Status

colour	Yellow
title	ongoing

Table of Contents

Description

...

The column picker appears inside a dialog box with the title "named Set Columns", including Ok and Cancel buttons
The dialog box contains these elements:

Expand

title	Example for heading in general

<<use heading 3>>

Text (Headings, labels, microcopty, help text Etc..) ( how to write microcopy for that component. For example, in lists the list items must be grammatically parallel and don’t mix active and passive voice etc)
Format / structure (describe the objects the component is made of and are optional e.g. search bar in a table) (for search component include - variations, results)(for tabs - Number of tabs)
Content (for example, in dropdowns and lists)
Length (e.g. length of list)
Order (e.g. order of drop down menu)
Placement or Positioning (when this is important, e.g. toast message)
Internal Logic (when explaining how to use different components inside the current component. For example, when to use radio buttons, checkboxes, and fields in a form)
Default section or Default values

States

...

two lists of items, named Available Columns (on the left) and Selected Columns (on the right)
Next to the selected columns title there is an indicator, showing the number of selected items out of the total number of items
Each list will contain a search bar
If the number of items on a list is large enough to exceed its container, a scroll bar will appear

Order

<<for example, how to change a value – type, arrows, use slider>>

<<use Click target to describe the interaction>>

<<used for specific components e.g. slider>>

<<Used to describe transitions or animations the occurs in any of the interaction stages>>

<<e.g. Slider should display a .label its on>>

...