tachybase_todo/docs/en-US/development/client/ui-schema-designer/component-library.md

# Schema component library

## Wrapper Components

- BlockItem
- FormItem
- CardItem

## Layout

- Page
- Grid
- Tabs
- Space

## Field components

The field components are generally not used alone, but in the data presentation component

- CollectionField: universal component
- Cascader
- Checkbox
- ColorSelect
- DatePicker
- Filter
- Formula
- IconPicker
- Input
- InputNumber
- Markdown
- Password
- Percent
- Radio
- RecordPicker
- RichText
- Select
- TimePicker
- TreeSelect
- Upload

## Data presentation component

Need to be used with the field component

- Calendar
- Form
- Kanban
- Table
- TableV2

## Action (onClick event-based component)

- Action
- Action.Drawer
- Action.Modal
- ActionBar：For action layout
- Menu

## Other

- G2plot
- Markdown.Void

## Usage scenarios for `x-designer` and `x-initializer`

`x-designer` takes effect when `x-decorator` or `x-component` is a component of

- BlockItem
- CardItem
- FormItem
- Table.Column
- Tabs.TabPane

`x-initializer` takes effect when `x-decorator` or `x-component` is a component of

- ActionBar
- BlockItem
- CardItem
- FormItem
- Grid
- Table
- Tabs
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								# Schema component library
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Wrapper Components
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- BlockItem
 								- FormItem
 								- CardItem
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Layout
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- Page
 								- Grid
 								- Tabs
 								- Space
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Field components
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								The field components are generally not used alone, but in the data presentation component
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								- CollectionField: universal component
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
+								- Cascader
 								- Checkbox
 								- ColorSelect
 								- DatePicker
 								- Filter
 								- Formula
 								- IconPicker
 								- Input
 								- InputNumber
 								- Markdown
 								- Password
 								- Percent
 								- Radio
 								- RecordPicker
 								- RichText
 								- Select
 								- TimePicker
 								- TreeSelect
 								- Upload
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Data presentation component
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								Need to be used with the field component
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- Calendar
 								- Form
 								- Kanban
 								- Table
 								- TableV2
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Action (onClick event-based component)
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- Action
 								- Action.Drawer
 								- Action.Modal
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								- ActionBar：For action layout
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
+								- Menu
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Other
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- G2plot
 								- Markdown.Void
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								## Usage scenarios for `x-designer` and `x-initializer`
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								`x-designer` takes effect when `x-decorator` or `x-component` is a component of
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- BlockItem
 								- CardItem
 								- FormItem
 								- Table.Column
 								- Tabs.TabPane
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								`x-initializer` takes effect when `x-decorator` or `x-component` is a component of
-												feat: update docs (#990)

* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
											
										
										
											2022-10-31 11:52:17 +08:00
 								- ActionBar
 								- BlockItem
 								- CardItem
 								- FormItem
 								- Grid
 								- Table
-												Update component-library.md
											
										
										
											2022-12-21 09:59:07 +08:00
+								- Tabs