Components
==========

.. toctree::
   :maxdepth: 1
   :titlesonly:
   :hidden:

   formating/index
   navigation/index
   assistance/index
   editing/index

Components
----------

.. container:: grid

   .. container:: componentcard
  
      *Group Box*
      
      A group box is a labeled rectangular area that surrounds a set of
      related controls.
      
      .. image:: /img/text-x-qml.svg
         :height: 32px
         :width: 32px
         :alt: Available in Kirigami
         :align: right
         
      .. image:: /img/text-x-c++src.svg
         :height: 32px
         :width: 32px
         :alt: Available in QtWidgets
         :align: right
      
      .. image:: /img/application-x-plasma.svg
         :height: 32px
         :width: 32px
         :alt: Available in Plasma Components
         :align: right

   .. container:: componentcard

      *Splitter*
      
      A splitter is a visual separator between two element groups.
      
      .. image:: /img/text-x-qml.svg
         :height: 32px
         :width: 32px
         :alt: Available in Kirigami
         :align: right
         
      .. image:: /img/text-x-c++src.svg
         :height: 32px
         :width: 32px
         :alt: Available in QtWidgets
         :align: right
      
      .. image:: /img/application-x-plasma.svg
         :height: 32px
         :width: 32px
         :alt: Available in Plasma Components
         :align: right

   .. container:: componentcard

      *Primary Action Button*
      
      Use for a primary action for a
      certain page of your application or for the whole application.
      
      .. image:: /img/text-x-qml.svg
         :height: 32px
         :width: 32px
         :alt: Available in Kirigami
         :align: right

   .. container:: componentcard

      *Command Link*
      
      A command link is an area containing icon and text that is used to
      initiate an action.
      
      .. image:: /img/text-x-qml.svg
         :height: 32px
         :width: 32px
         :alt: Available in Kirigami
         :align: right
         
      .. image:: /img/text-x-c++src.svg
         :height: 32px
         :width: 32px
         :alt: Available in QtWidgets
         :align: right
      
      .. image:: /img/application-x-plasma.svg
         :height: 32px
         :width: 32px
         :alt: Available in Plasma Components
         :align: right
                 
* :doc:`formating/groupbox`
* :doc:`formating/splitter`

Navigation
----------

* :doc:`navigation/actionbutton`
* :doc:`navigation/commandlink`
* :doc:`navigation/contextdrawer`
* :doc:`navigation/contextmenu`
* :doc:`navigation/dialog`
* :doc:`navigation/globaldrawer`
* :doc:`navigation/menubar`
* :doc:`navigation/pushbutton`
* :doc:`navigation/tab`
* :doc:`navigation/toolbar`
* :doc:`navigation/scrim`

User Assistance
---------------

User Assistance guidance considers interface elements that inform users of the application’s activity and status, as well as elements dedicated to user education. This includes online help, error alerts, and status alerts.

Notification
~~~~~~~~~~~~

* :doc:`assistance/emblem`
* :doc:`assistance/inline`
* :doc:`assistance/message`
* :doc:`assistance/progress`
* :doc:`assistance/statusbar`

Help
~~~~

* :doc:`assistance/tooltip`

Editing and Manipulation
------------------------

Editing and Manipulation considers the behaviors that result in persistent changes to user’s stored information.

Selection
~~~~~~~~~

* :doc:`editing/card`
* :doc:`editing/checkbox`
* :doc:`editing/combobox`
* :doc:`editing/dropdown`
* :doc:`editing/grid`
* :doc:`editing/list`
* :doc:`editing/radiobutton`
* :doc:`editing/togglebutton`
* :doc:`editing/tree`

Unconstrained Input
~~~~~~~~~~~~~~~~~~~

* :doc:`editing/lineedit`
* :doc:`editing/tableview`
* :doc:`editing/textedit`

Constrained Input
~~~~~~~~~~~~~~~~~
* :doc:`editing/date`
* :doc:`editing/slider`
* :doc:`editing/spinbox`