diff --git a/packages/v1-components/docs/AI.md b/packages/v1-components/docs/AI.md index a046b7ef..8deafb08 100644 --- a/packages/v1-components/docs/AI.md +++ b/packages/v1-components/docs/AI.md @@ -63,10 +63,13 @@ When building a basic form or settings screen, start from patterns like: ```ts import { UiButton, + UiCheckbox, UiField, + UiNumberStepper, UiPageFooter, UiPageHeader, UiSelect, + UiSwitch, UiTextbox, } from '@retailcrm/embed-ui-v1-components/remote' ``` @@ -75,6 +78,9 @@ Typical compositions: - `UiField` + `UiTextbox` - `UiField` + `UiSelect` +- `UiField` + `UiNumberStepper` +- `UiSwitch` + visible label + hint row +- `UiCheckbox` + visible label row or checkbox group - `UiPageHeader` + `UiButton` - `UiSelect` + `UiSelectOption` @@ -91,15 +97,20 @@ Default screen rules: - use `UiPageFooter` for page-level save/cancel/delete actions instead of recreating a local footer; - use one `Success Primary` button for the strongest save/apply/create action that commits a result; use `Default Primary` only for another important action with a different meaning; +- use `Secondary` buttons for real neighboring commands that should still look like buttons; +- use `Tertiary` buttons for lower-emphasis edit, open, configure, cancel, close, and optional commands near headers, + cards, tables, and inline content; - apply the 24px top and 32px side/bottom padding rule to white content surfaces, not to the page root wrapper; - keep filters and controls near the content they affect; -- use `UiField` around labeled form controls; +- use `UiField` around labeled textbox, select, number, date, and time controls; - use `UiTable` for structured result lists; - use `UiLink` for navigation and inline links, `UiButton` for commands; - use `UiLoader` with `overlay: true` when loading should dim the covered page or module content; - keep public imports on `@retailcrm/embed-ui-v1-components/remote`; - when a component uses only the default slot, prefer `v-slot` on the component instead of `