UI Components

A complete list of all UI components in Yao DSLs. ## View Components Components that are used to display data or interact with the user, can be used to Table Widgets. | Component | Description | | ---------------------------------- | -------------------------------------------------------------------------------- | | [A](ui-components/a) | A link that shows a tooltip with the destination URL on hover and opens the link | | [Checkbox](ui-components/checkbox) | A checkbox for selecting or deselecting an option | | [Color](ui-components/color) | A color picker for selecting a color | | [Image](ui-components/image) | An image element for displaying images | | [Switch](ui-components/switch) | A switch for toggling between two states | | [Tag](ui-components/tag) | A tag for categorizing or labeling content | | [Text](ui-components/text) | A text element for displaying text | | [Tooltip](ui-components/tooltip) | A tooltip that shows additional information on hover | ## Edit Components Components that are used to edit data or interact with the user, can be used to Form Widget. | Component | Description | | --------------------------------------------- | ----------------------------------------------------------------------- | | [Autocomplete](ui-components/autocomplete) | An input field with a dropdown list for selecting an option from a list | | [Cascader](ui-components/cascader) | A cascading dropdown list for selecting an option from a hierarchy | | [CheckboxGroup](ui-components/checkbox-group) | A group of checkboxes for selecting multiple options | | [CodeEditor](ui-components/code-editor) | A code editor for editing code | | [ColorPicker](ui-components/color-picker) | A color picker for selecting a color | | [Divider](ui-components/divider) | A horizontal line to separate content | | [FlowBuilder](ui-components/flow-builder) | A flow builder for creating workflows | | [FormBuilder](ui-components/form-builder) | A form builder for creating forms | | [Frame](ui-components/frame) | A frame for displaying content in a bordered box | | [Input](ui-components/input) | An input field for entering text | | [InputNumber](ui-components/input-number) | An input field for entering numbers | | [List](ui-components/list) | A list for displaying data | | [Password](ui-components/password) | An input field for entering passwords | | [Placement](ui-components/placement) | A placement for positioning elements | | [Select](ui-components/select) | A dropdown list for selecting an option from a list | | [TextArea](ui-components/text-area) | A text area for entering multiple lines of text | | [Text](ui-components/text) | A text element for displaying text | | [TimePicker](ui-components/time-picker) | A time picker for selecting a time | | [Tree](ui-components/tree) | A tree for displaying hierarchical data | | [Upload](ui-components/upload) | An upload component for uploading files | | [WangEditor](ui-components/wang-editor) | A WYSIWYG editor for editing text | | [Table](ui-components/table) | A table reference for displaying data | ## Chart Components Components that are used to visualize data in various chart formats, can be used to Chart and Dashboard widgets. | Component | Description | | ----------------------------------------- | ------------------------------------- | | [Bar](ui-components/bar) | A bar chart | | [Line](ui-components/line) | A line chart | | [Funnel](ui-components/funnel) | A funnel chart | | [LineBar](ui-components/line-bar) | A line and bar chart | | [Number](ui-components/number) | A number chart | | [NumberChart](ui-components/number-chart) | A number chart with a title and value | | [Pie](ui-components/pie) | A pie chart | | [Table](ui-components/table) | A table display in chart format |