From 32f2d76847b95868ef66a29a71db91a8552e4f98 Mon Sep 17 00:00:00 2001 From: literat Date: Tue, 7 May 2024 14:50:13 +0200 Subject: [PATCH] Style(repo): Replace unicode "heavy check mark" with "check mark" * we have previously used "heavy check mark" unicode character that is not recognized by the Prettier v3 * @see: https://www.compart.com/en/unicode/U+2714 * this unicode character is replaced by "check mark" that is lighter and Prettier to not have problem with it * @see: https://www.compart.com/en/unicode/U+2713 * it is also more convenient to use the same size of the character because as oposite to the "check mark" we are using "multiplication" * @see: https://www.compart.com/en/unicode/U+2715 * @see: https://github.com/prettier/prettier/issues/15572 for more details about the Prettier problem with thiunicode character --- CONTRIBUTING.md | 2 +- packages/form-validations/README.md | 16 +++---- .../src/components/Accordion/README.md | 12 ++--- .../web-react/src/components/Alert/README.md | 2 +- .../src/components/ButtonLink/README.md | 2 +- .../src/components/Checkbox/README.md | 2 +- .../src/components/Collapse/README.md | 4 +- .../src/components/Dropdown/README.md | 10 ++-- .../web-react/src/components/Field/README.md | 4 +- .../src/components/FieldGroup/README.md | 4 +- .../src/components/FileUploader/README.md | 48 +++++++++---------- .../web-react/src/components/Header/README.md | 12 ++--- .../web-react/src/components/Icon/README.md | 2 +- .../web-react/src/components/Item/README.md | 2 +- .../web-react/src/components/Modal/README.md | 6 +-- .../web-react/src/components/NoSsr/README.md | 2 +- .../src/components/Pagination/README.md | 10 ++-- .../web-react/src/components/Pill/README.md | 2 +- .../web-react/src/components/Radio/README.md | 2 +- .../src/components/ScrollView/README.md | 2 +- .../web-react/src/components/Select/README.md | 2 +- .../web-react/src/components/Tabs/README.md | 10 ++-- .../web-react/src/components/Tag/README.md | 2 +- .../src/components/TextArea/README.md | 2 +- .../src/components/TextField/README.md | 6 +-- .../src/components/TextFieldBase/README.md | 2 +- .../src/components/Tooltip/README.md | 8 ++-- .../src/components/VisuallyHidden/README.md | 2 +- .../Resources/components/Accordion/README.md | 10 ++-- .../Resources/components/ButtonLink/README.md | 2 +- .../Resources/components/Checkbox/README.md | 4 +- .../Resources/components/Collapse/README.md | 6 +-- .../Resources/components/Dropdown/README.md | 6 +-- .../Resources/components/FieldGroup/README.md | 2 +- .../components/FileUploader/README.md | 2 +- .../src/Resources/components/Header/README.md | 10 ++-- .../src/Resources/components/Icon/README.md | 2 +- .../src/Resources/components/Item/README.md | 2 +- .../src/Resources/components/Link/README.md | 2 +- .../src/Resources/components/Modal/README.md | 4 +- .../Resources/components/Pagination/README.md | 4 +- .../src/Resources/components/Radio/README.md | 4 +- .../src/Resources/components/Select/README.md | 6 +-- .../src/Resources/components/Tabs/README.md | 2 +- .../Resources/components/TextArea/README.md | 6 +-- .../Resources/components/TextField/README.md | 6 +-- .../components/TextFieldBase/README.md | 6 +-- .../Resources/components/Tooltip/README.md | 2 +- .../components/VisuallyHidden/README.md | 2 +- .../src/scss/components/Collapse/README.md | 4 +- .../src/scss/components/Dropdown/README.md | 6 +-- .../web/src/scss/components/Modal/README.md | 2 +- 52 files changed, 141 insertions(+), 141 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 43f61ac928..34a612bfdc 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -171,7 +171,7 @@ This project uses Prettier for code formatting. You can run `make format` to for - `Name` — the name of the prop, e.g. `title` - `Type` — the type of the prop, e.g. `string`, `number`, `bool`, `[horizontal | vertical]`, an existing [dictionary], etc. - `Default` — the default value of the prop, e.g. `null` or `—` (em-dash) if there is no default value - - `Required` — if the prop is required `✔` or not `✕` + - `Required` — if the prop is required `✓` or not `✕` - `Description` — the description of the prop, e.g. `Title of the accordion` 3. The props MUST be sorted alphabetically by their name. diff --git a/packages/form-validations/README.md b/packages/form-validations/README.md index ed3639c46a..bd5f8d370b 100644 --- a/packages/form-validations/README.md +++ b/packages/form-validations/README.md @@ -176,7 +176,7 @@ _Constructor_ | Parameter | Default | Required | Description | | --------- | ---------------------------- | -------- | --------------------------------------------------- | -| form | — | ✔ | The form element | +| form | — | ✓ | The form element | | config | [See above](#default-config) | ✕ | The config object | | live | `true` | ✕ | Whether FormValidations should validate as you type | @@ -207,7 +207,7 @@ _Set the current locale globally_ | Parameter | Default | Required | Description | | --------- | ------- | -------- | -------------------------------------------------------------------------------------- | -| `locale` | — | ✔ | Error messages on new FormValidations forms will be displayed according to this locale | +| `locale` | — | ✓ | Error messages on new FormValidations forms will be displayed according to this locale | **FormValidations.addMessages(locale, messages)** @@ -215,8 +215,8 @@ _Set the current locale globally_ | Parameter | Default | Required | Description | | ---------- | ------- | -------- | ------------------------------------------------------------------- | -| `locale` | — | ✔ | The corresponding locale | -| `messages` | — | ✔ | Object containing validator names as keys and error texts as values | +| `locale` | — | ✓ | The corresponding locale | +| `messages` | — | ✓ | Object containing validator names as keys and error texts as values | ### Custom validators @@ -226,11 +226,11 @@ _Add a custom validator_ | Parameter | Default | Required | Description | | ------------------- | ------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `element` | — | ✔ | The dom element where validator is applied to. | +| `element` | — | ✓ | The dom element where validator is applied to. | | `halt` | `false` | ✕ | Whether to stop validation of the field after this validator is applied on the field. When `true`, after this validator finishes validating, the rest of the validators are ignored on the current field. | -| `message` | — | ✔ | The message to show when the validation fails. It supports simple templating. `${0}` for the input's value, `${1}` and so on are for the attribute values. For the above example, `${0}` will get replaced by `myValue`, `${1}` by `10`, `${2}` by `20`, `${3}` by `dhaka`. It can also be a function which should return the error string. The values and inputs are available as function arguments | +| `message` | — | ✓ | The message to show when the validation fails. It supports simple templating. `${0}` for the input's value, `${1}` and so on are for the attribute values. For the above example, `${0}` will get replaced by `myValue`, `${1}` by `10`, `${2}` by `20`, `${3}` by `dhaka`. It can also be a function which should return the error string. The values and inputs are available as function arguments | | `priority` | 1 | ✕ | Priority of the validator function. The higher the value, the earlier it gets called when there are multiple validators on one field. | -| `validatorCallback` | — | ✔ | The function that validates the field. The value of the input field gets passed as the first parameter, and the attribute value (split using a comma) as the subsequent parameters. For example, for ``, the validator function gets called like `validatorCallback("myValue", 10, 20, "dhaka")`. Inside the function `this` refers to the input element | +| `validatorCallback` | — | ✓ | The function that validates the field. The value of the input field gets passed as the first parameter, and the attribute value (split using a comma) as the subsequent parameters. For example, for ``, the validator function gets called like `validatorCallback("myValue", 10, 20, "dhaka")`. Inside the function `this` refers to the input element | **FormValidations.addValidator(name, fn, message, priority, halt)** @@ -238,7 +238,7 @@ _Add a global custom validator_ | Parameter | Default | Required | Description | | --------- | ------- | -------- | --------------------------------------------------------------------------------------------------------------------------- | -| `name` | — | ✔ | A string, the name of the validator, you can then use `data-spirit-` attribute in form fields to apply this validator | +| `name` | — | ✓ | A string, the name of the validator, you can then use `data-spirit-` attribute in form fields to apply this validator | | `....` | — | — | Other parameters same as above | ### Resetting diff --git a/packages/web-react/src/components/Accordion/README.md b/packages/web-react/src/components/Accordion/README.md index 4de487b30e..21deb7157d 100644 --- a/packages/web-react/src/components/Accordion/README.md +++ b/packages/web-react/src/components/Accordion/README.md @@ -138,7 +138,7 @@ import { AccordionOpenStateType } from '@lmc-eu/spirit-web-react/types'; | Name | Type | Default | Required | Description | | ------------- | --------------------------------- | --------- | -------- | ------------------------------------------------ | -| `children` | `ReactNode` | — | ✔ | Accordion children's nodes | +| `children` | `ReactNode` | — | ✓ | Accordion children's nodes | | `elementType` | [`section` \| `article` \| `div`] | `section` | ✕ | Type of element used as wrapper | | `open` | [`string` \| `string[]`] | — | ✕ | Open item or list of open items \* | | `toggle` | `(id: string) => void` | — | ✕ | A generic handler for a single **AccordionItem** | @@ -153,7 +153,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ------------- | --------------------------------- | --------- | -------- | ---------------------------------------------- | -| `children` | `ReactNode` | — | ✔ | Accordion children's nodes | +| `children` | `ReactNode` | — | ✓ | Accordion children's nodes | | `defaultOpen` | [`string` \| `string[]`] | — | ✕ | Default open item(s) \* | | `elementType` | [`section` \| `article` \| `div`] | `section` | ✕ | Type of element used as wrapper | | `stayOpen` | `bool` | — | ✕ | Item stay open when another one is also opened | @@ -168,9 +168,9 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ------------- | --------------------------------- | --------- | -------- | ----------------------------------------------- | -| `children` | `ReactNode` | — | ✔ | Item children node | +| `children` | `ReactNode` | — | ✓ | Item children node | | `elementType` | [`article` \| `section` \| `div`] | `article` | ✕ | Type of element used as wrapper for single item | -| `id` | `string` | — | ✔ | Item id | +| `id` | `string` | — | ✓ | Item id | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] @@ -180,7 +180,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ------------- | ------------- | ------- | -------- | ----------------------- | -| `children` | `ReactNode` | — | ✔ | Header children node | +| `children` | `ReactNode` | — | ✓ | Header children node | | `elementType` | `ElementType` | `h3` | ✕ | Type of element | | `slot` | `ReactNode` | — | ✕ | Side slot in the header | @@ -192,7 +192,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ---------- | ----------- | ------- | -------- | --------------------- | -| `children` | `ReactNode` | — | ✔ | Content children node | +| `children` | `ReactNode` | — | ✓ | Content children node | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] diff --git a/packages/web-react/src/components/Alert/README.md b/packages/web-react/src/components/Alert/README.md index 054a48de46..93523132b1 100644 --- a/packages/web-react/src/components/Alert/README.md +++ b/packages/web-react/src/components/Alert/README.md @@ -29,7 +29,7 @@ import { Alert } from '@lmc-eu/spirit-web-react/components'; | Name | Type | Default | Required | Description | | -------------- | -------------------------------------------- | --------- | -------- | -------------------------- | -| `children` | `ReactNode` | — | ✔ | Content of the Alert | +| `children` | `ReactNode` | — | ✓ | Content of the Alert | | `color` | [Emotion Color dictionary][dictionary-color] | `success` | ✕ | Color of the component | | `iconName` | `string` | `info` \* | ✕ | Icon used in Alert | | `isCentered` . | `bool` | `false` | ✕ | If true, Alert is centered | diff --git a/packages/web-react/src/components/ButtonLink/README.md b/packages/web-react/src/components/ButtonLink/README.md index 1e7e48c55c..226f79781f 100644 --- a/packages/web-react/src/components/ButtonLink/README.md +++ b/packages/web-react/src/components/ButtonLink/README.md @@ -24,7 +24,7 @@ import { ButtonLink } from '@lmc-eu/spirit-web-react'; | `children` | `ReactNode` | `null` | ✕ | Content of the ButtonLink | | `color` | [Action Color dictionary][dictionary-color], [Emotion Color dictionary][dictionary-color] | `primary` | ✕ | Color variant | | `elementType` | `ElementType` | `a` | ✕ | Type of element | -| `href` | `string` | — | ✔ | Link URL | +| `href` | `string` | — | ✓ | Link URL | | `isBlock` | `bool` | `false` | ✕ | Span the element to the full width of its parent | | `isDisabled` | `bool` | `false` | ✕ | If true, ButtonLink is disabled | | `isLoading` | `bool` | `false` | ✕ | If true, ButtonLink is in a loading state, disabled and the Spinner is visible | diff --git a/packages/web-react/src/components/Checkbox/README.md b/packages/web-react/src/components/Checkbox/README.md index 5cf9224eea..d2a3d71edf 100644 --- a/packages/web-react/src/components/Checkbox/README.md +++ b/packages/web-react/src/components/Checkbox/README.md @@ -31,7 +31,7 @@ Advanced example usage: | ----------------- | ---------------------------------------------- | ------- | -------- | ---------------------------------------------------- | | `autoComplete` | `string` | - | ✕ | [Automated assistance in filling][autocomplete-attr] | | `helperText` | `string` | — | ✕ | Custom helper text | -| `id` | `string` | - | ✔ | Input and label identification | +| `id` | `string` | - | ✓ | Input and label identification | | `isDisabled` | `boolean` | - | ✕ | Whether is field disabled | | `isChecked` | `boolean` | - | ✕ | Whether is field checked | | `isItem` | `boolean` | - | ✕ | To render in [Item][item] mode | diff --git a/packages/web-react/src/components/Collapse/README.md b/packages/web-react/src/components/Collapse/README.md index 1a09c5d718..392a6b2d84 100644 --- a/packages/web-react/src/components/Collapse/README.md +++ b/packages/web-react/src/components/Collapse/README.md @@ -80,7 +80,7 @@ const [isOpen, toggle] = useState(true); | ------------------------- | ----------------------------------- | ------- | -------- | ------------------------------------------- | | `collapsibleToBreakpoint` | [`mobile` \| `tablet` \| `desktop`] | — | ✕ | Handle for responsive breakpoint | | `elementType` | [`span` \| `div`] | `div` | ✕ | Type of element used as wrapper and content | -| `id` | `string` | — | ✔ | Component id | +| `id` | `string` | — | ✓ | Component id | | `isOpen` | `bool` | — | ✕ | Is open on initialization | | `transitionDuration` | `number` | `250` | ✕ | Transition duration in miliseconds | @@ -131,7 +131,7 @@ import { Button, UncontrolledCollapse } from '@lmc-eu/spirit-web-react/component | ------------------------- | -------------------------------------------- | ------- | -------- | ------------------------------------------- | | `collapsibleToBreakpoint` | [`mobile` \| `tablet` \| `desktop`] | — | ✕ | Handle for responsive breakpoint | | `elementType` | [`span` \| `div`] | `div` | ✕ | Type of element used as wrapper and content | -| `id` | `string` | — | ✔ | Component id | +| `id` | `string` | — | ✓ | Component id | | `isOpen` | `bool` | — | ✕ | Is open on initialization | | `hideOnCollapse` | `bool` | — | ✕ | Hides button when content is displayed | | `renderTrigger` | `(render: CollapseRenderProps) => ReactNode` | — | ✕ | Properties for trigger render | diff --git a/packages/web-react/src/components/Dropdown/README.md b/packages/web-react/src/components/Dropdown/README.md index f1a08cde78..f7e91f4f15 100644 --- a/packages/web-react/src/components/Dropdown/README.md +++ b/packages/web-react/src/components/Dropdown/README.md @@ -56,10 +56,10 @@ import { UncontrolledDropdown, DropdownTrigger, DropdownPopover } from '@lmc-eu/ | ----------------- | ------------------------------------------------ | -------------- | -------- | ---------------------------------------------- | | `enableAutoClose` | `bool` | `true` | ✕ | Enables close on click outside of Dropdown | | `fullWidthMode` | [`DropdownFullwidthMode`][dropdownfullwidthmode] | `off` | ✕ | Full-width mode | -| `id` | `string` | — | ✔ | Component id | -| `isOpen` | `bool` | `false` | ✔ | Open state | +| `id` | `string` | — | ✓ | Component id | +| `isOpen` | `bool` | `false` | ✓ | Open state | | `onAutoClose` | `(event: Event) => void` | — | ✕ | Callback on close on click outside of Dropdown | -| `onToggle` | `() => void` | — | ✔ | Function for toggle open state of dropdown | +| `onToggle` | `() => void` | — | ✓ | Function for toggle open state of dropdown | | `placement` | [Placement dictionary][dictionary-placement] | `bottom-start` | ✕ | Alignment of the component | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -70,7 +70,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ------------- | ------------------------- | -------- | -------- | -------------------------------- | -| `children` | [`string` \| `ReactNode`] | — | ✔ | Content of trigger element | +| `children` | [`string` \| `ReactNode`] | — | ✓ | Content of trigger element | | `elementType` | [`string` \| `ReactNode`] | `button` | ✕ | Element type of dropdown trigger | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -81,7 +81,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ---------- | ------------------------- | ------- | -------- | -------------------------- | -| `children` | [`string` \| `ReactNode`] | — | ✔ | Content of trigger element | +| `children` | [`string` \| `ReactNode`] | — | ✓ | Content of trigger element | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] diff --git a/packages/web-react/src/components/Field/README.md b/packages/web-react/src/components/Field/README.md index d5c6769dc6..cf2ab265e4 100644 --- a/packages/web-react/src/components/Field/README.md +++ b/packages/web-react/src/components/Field/README.md @@ -26,6 +26,6 @@ Advanced example: | Name | Type | Default | Required | Description | | ---------------- | ------------------------ | ------- | -------- | ---------------------------------------------------------------------------------------------- | -| `className` | `string` | — | ✔ | Wrapper custom class name | +| `className` | `string` | — | ✓ | Wrapper custom class name | | `elementType` | [`span` \| `div`] | `div` | ✕ | Type of element used as main wrapper (applied only for single validation text, otherwise `ul`) | -| `validationText` | [`string` \| `string[]`] | — | ✔ | Validation text | +| `validationText` | [`string` \| `string[]`] | — | ✓ | Validation text | diff --git a/packages/web-react/src/components/FieldGroup/README.md b/packages/web-react/src/components/FieldGroup/README.md index 2c8b1bf57f..f50e7c8f34 100644 --- a/packages/web-react/src/components/FieldGroup/README.md +++ b/packages/web-react/src/components/FieldGroup/README.md @@ -98,12 +98,12 @@ Validation states can be presented either by adding the `validationState` attrib | ----------------- | ---------------------------------------------- | ------- | -------- | ---------------------------------------------------------- | | `form` | `string` | `null` | ✕ | Parent form ID | | `helperText` | `string` | `null` | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Group and label identification | +| `id` | `string` | — | ✓ | Group and label identification | | `isDisabled` | `bool` | `false` | ✕ | If true, the group is disabled | | `isFluid` | `bool` | — | ✕ | If true, the element spans to the full width of its parent | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, the group is marked as required | -| `label` | `string` | — | ✔ | Label text | +| `label` | `string` | — | ✓ | Label text | | `name` | `string` | `null` | ✕ | Group name | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state | | `validationText` | [`string` \| `string[]`] | `null` | ✕ | Validation text | diff --git a/packages/web-react/src/components/FileUploader/README.md b/packages/web-react/src/components/FileUploader/README.md index b8ae4fb73f..c8c50abb09 100644 --- a/packages/web-react/src/components/FileUploader/README.md +++ b/packages/web-react/src/components/FileUploader/README.md @@ -346,17 +346,17 @@ const customUpdate = (_event: MouseEvent, file: File) => { | Name | Type | Default | Required | Description | | ------------------------------------- | -------------------------------------------------------------------- | ------- | -------- | ------------------------------------------------------------------- | -| `addToQueue` | `(key: string, file: File, meta?: FileMetadata) => FileQueueMapType` | — | ✔ | Callback to add an item to the queue | -| `clearQueue` | `() => void` | — | ✔ | Callback to clear the queue | +| `addToQueue` | `(key: string, file: File, meta?: FileMetadata) => FileQueueMapType` | — | ✓ | Callback to add an item to the queue | +| `clearQueue` | `() => void` | — | ✓ | Callback to clear the queue | | `errorMessages.errorFileDuplicity` | `string` | — | ✕ | Translation for the error message: Duplicate file in queue | | `errorMessages.errorMaxFileSize` | `string` | — | ✕ | Translation for the error message: Maximum file size | | `errorMessages.errorMaxUploadedFiles` | `string` | — | ✕ | Translation for the error message: Maximum number of uploaded files | -| `fileQueue` | `FileQueueMapType` | — | ✔ | Queue of items to upload | -| `findInQueue` | `(key: string) => FileQueueMapType` | — | ✔ | A callback to find a particular item in the queue | -| `id` | `string` | — | ✔ | FileUploader id | +| `fileQueue` | `FileQueueMapType` | — | ✓ | Queue of items to upload | +| `findInQueue` | `(key: string) => FileQueueMapType` | — | ✓ | A callback to find a particular item in the queue | +| `id` | `string` | — | ✓ | FileUploader id | | `isFluid` | `bool` | — | ✕ | When the field is supposed to be fluid | -| `onDismiss` | `(key: string) => FileQueueMapType` | — | ✔ | A callback to delete a particular item from the queue | -| `updateQueue` | `(key: string, file: File, meta?: FileMetadata) => FileQueueMapType` | — | ✔ | A callback to update a particular item in the queue | +| `onDismiss` | `(key: string) => FileQueueMapType` | — | ✓ | A callback to delete a particular item from the queue | +| `updateQueue` | `(key: string, file: File, meta?: FileMetadata) => FileQueueMapType` | — | ✓ | A callback to update a particular item in the queue | The rest of the properties are created from the default `
` element. [More about the element][div-element-docs] @@ -372,7 +372,7 @@ and [escape hatches][readme-escape-hatches]. | `dropZoneRef` | `MutableRefObject` | — | ✕ | Drop zone element reference | | `helperText` | `string` | — | ✕ | Custom helper text | | `iconName` | `string` | `upload` | ✕ | Icon used in the drop zone | -| `id` | `string` | — | ✔ | FileUploaderInput id | +| `id` | `string` | — | ✓ | FileUploaderInput id | | `inputRef` | `MutableRefObject` | — | ✕ | Input element reference | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isLabelHidden` | `bool` | — | ✕ | Whether is input label hidden | @@ -383,7 +383,7 @@ and [escape hatches][readme-escape-hatches]. | `linkText` | `string` | — | ✕ | Link text in input in Drop zone | | `maxFileSize` | `number` | 1000000 | ✕ | The maximum size of the uploaded file in bytes | | `maxUploadedFiles` | `number` | 10 | ✕ | Maximum file upload queue size | -| `name` | `string` | — | ✔ | Field name, will be used for each attachment in the queue | +| `name` | `string` | — | ✓ | Field name, will be used for each attachment in the queue | | `onError` | `FileUploaderErrorCallbackType` | — | ✕ | Callback on error condition | | `queueLimitBehavior` | [`hide` \| `disable` \| `none`] | `none` | ✕ | Input behavior when the file queue is filled | | `validationState` | `ValidationState` | — | ✕ | Validation state | @@ -403,10 +403,10 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | --------------------- | -------- | ------- | -------- | --------------------------------------------- | -| `attachmentComponent` | `string` | — | ✔ | A component for rendering a single attachment | +| `attachmentComponent` | `string` | — | ✓ | A component for rendering a single attachment | | `hasImagePreview` | `bool` | false | ✕ | Show image preview in the list | -| `id` | `string` | — | ✔ | FileUploaderList id | -| `inputName` | `string` | — | ✔ | The name of the input field | +| `id` | `string` | — | ✓ | FileUploaderList id | +| `inputName` | `string` | — | ✓ | The name of the input field | | `label` | `string` | — | ✕ | Label for the list | The rest of the properties are created from the default `
    ` element. [More about the element][list-element-docs] @@ -420,14 +420,14 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | ----------------- | ------------------------------------ | -------- | -------- | ----------------------------------------------------- | | `editText` | `string` | `Edit` | ✕ | Edit button label | -| `file` | `File` | — | ✔ | Attachment file object | +| `file` | `File` | — | ✓ | Attachment file object | | `hasImagePreview` | `bool` | false | ✕ | Show image preview | | `iconName` | `string` | `file` | ✕ | Icon shown along the file | -| `id` | `string` | — | ✔ | FileUploaderAttachment id | +| `id` | `string` | — | ✓ | FileUploaderAttachment id | | `imageObjectFit` | [`cover` \| `contain`] | `cover` | ✕ | Defines FileUploaderAttachment image fit in container | -| `label` | `string` | — | ✔ | File name | -| `name` | `string` | — | ✔ | Input field name | -| `onDismiss` | `(key: string) => FileQueueMapType` | — | ✔ | Callback to delete an item from the queue | +| `label` | `string` | — | ✓ | File name | +| `name` | `string` | — | ✓ | Input field name | +| `onDismiss` | `(key: string) => FileQueueMapType` | — | ✓ | Callback to delete an item from the queue | | `onEdit` | `(event: Event, file: File) => void` | — | ✕ | Show and add function to edit button | | `onError` | `FileUploaderErrorCallbackType` | — | ✕ | Callback on error condition | | `removeText` | `string` | `Remove` | ✕ | Remove button label | @@ -471,13 +471,13 @@ via `inputProps` and `listProps`. | Name | Type | Default | Required | Description | | --------------------- | --------------------------------------- | -------- | -------- | --------------------------------------------------- | -| `attachmentComponent` | `string` | — | ✔ | A component for rendering a single attachment | +| `attachmentComponent` | `string` | — | ✓ | A component for rendering a single attachment | | `helperText` | `string` | — | ✕ | Custom helper text | -| `iconName` | `string` | `upload` | ✔ | Icon used in the UncontrolledFileUploader drop zone | -| `id` | `string` | — | ✔ | UncontrolledFileUploader id | -| `inputId` | `string` | — | ✔ | FileUploaderInput id | -| `inputLabel` | `string` | — | ✔ | FileUploaderInput label | -| `inputName` | `string` | — | ✔ | FileUploaderInput name | +| `iconName` | `string` | `upload` | ✓ | Icon used in the UncontrolledFileUploader drop zone | +| `id` | `string` | — | ✓ | UncontrolledFileUploader id | +| `inputId` | `string` | — | ✓ | FileUploaderInput id | +| `inputLabel` | `string` | — | ✓ | FileUploaderInput label | +| `inputName` | `string` | — | ✓ | FileUploaderInput name | | `inputProps` | `Partial` | — | ✕ | Rest of FileUploaderInput props | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isFluid` | `bool` | — | ✕ | When the field is supposed to be fluid | @@ -486,7 +486,7 @@ via `inputProps` and `listProps`. | `isRequired` | `bool` | — | ✕ | Whether is field marked as required | | `labelText` | `string` | — | ✕ | Label for input in Drop zone | | `linkText` | `string` | — | ✕ | Link text in input in Drop zone | -| `listId` | `string` | — | ✔ | FileUploaderList id | +| `listId` | `string` | — | ✓ | FileUploaderList id | | `listProps` | `Partial` | — | ✕ | Rest of FileUploaderList props | | `maxFileSize` | `number` | 1000000 | ✕ | The maximum size of the uploaded file in bytes | | `maxUploadedFiles` | `number` | 10 | ✕ | Maximum file upload queue size | diff --git a/packages/web-react/src/components/Header/README.md b/packages/web-react/src/components/Header/README.md index de5e916e47..02d10b71b8 100644 --- a/packages/web-react/src/components/Header/README.md +++ b/packages/web-react/src/components/Header/README.md @@ -124,10 +124,10 @@ You can place any custom content into the mobile actions component: | Name | Type | Default | Required | Description | | ----------------- | ---------------------------------------------- | ------- | -------- | ------------------------------- | | `children` | `ReactNode` | — | ✕ | Children node | -| `dialogId` | `string` | — | ✔ | ID of the linked HeaderDialog | -| `isOpen` | `bool` | `false` | ✔ | Dialog open state | +| `dialogId` | `string` | — | ✓ | ID of the linked HeaderDialog | +| `isOpen` | `bool` | `false` | ✓ | Dialog open state | | `menuToggleLabel` | `string` | `Menu` | ✕ | Label of the menu toggle button | -| `onOpen` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✔ | Callback for dialog when opened | +| `onOpen` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✓ | Callback for dialog when opened | The component implements the [`HTMLElement`][mdn-api-html-element] interface. @@ -292,9 +292,9 @@ const [isOpen, setOpen] = useState(false); | Name | Type | Default | Required | Description | | ---------- | ---------------------------------------------- | ------- | -------- | -------------------------------------- | | `children` | `ReactNode` | — | ✕ | Children node | -| `id` | `string` | — | ✔ | ID to be linked in HeaderMobileActions | -| `isOpen` | `bool` | `false` | ✔ | Open state | -| `onClose` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✔ | Callback for dialog when closed | +| `id` | `string` | — | ✓ | ID to be linked in HeaderMobileActions | +| `isOpen` | `bool` | `false` | ✓ | Open state | +| `onClose` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✓ | Callback for dialog when closed | The component further inherits properties from the [``][mdn-dialog-element] element. diff --git a/packages/web-react/src/components/Icon/README.md b/packages/web-react/src/components/Icon/README.md index 1886d141b5..968596eeec 100644 --- a/packages/web-react/src/components/Icon/README.md +++ b/packages/web-react/src/components/Icon/README.md @@ -43,7 +43,7 @@ import icons from '@lmc-eu/spirit-icons/icons'; | Name | Type | Default | Required | Description | | --------- | -------- | ------- | -------- | ----------------- | | `boxSize` | `number` | 24 | ✕ | Size of the icon | -| `name` | `string` | — | ✔ | Name of the icon | +| `name` | `string` | — | ✓ | Name of the icon | | `title` | `string` | — | ✕ | Title of the icon | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-react/src/components/Item/README.md b/packages/web-react/src/components/Item/README.md index 06664faf73..c82d8579c2 100644 --- a/packages/web-react/src/components/Item/README.md +++ b/packages/web-react/src/components/Item/README.md @@ -102,7 +102,7 @@ const onToggle = () => setIsOpen(!isOpen); | `iconName` | `string` | — | ✕ | Icon used in item | | `isDisabled` | `bool` | `false` | ✕ | Whether is the item disabled | | `isSelected` | `bool` | `false` | ✕ | Whether is the item selected | -| `label` | [`string` \| `ReactNode`] | - | ✔ | Label of the item | +| `label` | [`string` \| `ReactNode`] | - | ✓ | Label of the item | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] diff --git a/packages/web-react/src/components/Modal/README.md b/packages/web-react/src/components/Modal/README.md index e94eec11a9..1694439bcf 100644 --- a/packages/web-react/src/components/Modal/README.md +++ b/packages/web-react/src/components/Modal/README.md @@ -65,9 +65,9 @@ Example: | `alignmentY` | [AlignmentY dictionary][dictionary-alignment] | `center` | ✕ | Vertical alignment of modal | | `children` | `ReactNode` | — | ✕ | Children node | | `closeOnBackdropClick` | `bool` | `true` | ✕ | Whether the modal will close when backdrop is clicked | -| `id` | `string` | — | ✔ | Modal ID | -| `isOpen` | `bool` | `false` | ✔ | Open state | -| `onClose` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✔ | Callback on dialog closed | +| `id` | `string` | — | ✓ | Modal ID | +| `isOpen` | `bool` | `false` | ✓ | Open state | +| `onClose` | `(event: ClickEvent or KeyboardEvent) => void` | — | ✓ | Callback on dialog closed | Also, all properties of the [`` element][mdn-dialog] are supported. diff --git a/packages/web-react/src/components/NoSsr/README.md b/packages/web-react/src/components/NoSsr/README.md index 7aa8755fbe..7c45d9202f 100644 --- a/packages/web-react/src/components/NoSsr/README.md +++ b/packages/web-react/src/components/NoSsr/README.md @@ -16,4 +16,4 @@ Basic example usage: | Name | Type | Default | Required | Description | | ---------- | ----------- | ------- | -------- | ------------ | -| `children` | `ReactNode` | — | ✔ | Wrapped node | +| `children` | `ReactNode` | — | ✓ | Wrapped node | diff --git a/packages/web-react/src/components/Pagination/README.md b/packages/web-react/src/components/Pagination/README.md index 88e2d7cb5d..1f1be887b1 100644 --- a/packages/web-react/src/components/Pagination/README.md +++ b/packages/web-react/src/components/Pagination/README.md @@ -116,10 +116,10 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | -------------------- | ------------- | ------- | -------- | -------------------------------------- | -| `accessibilityLabel` | `string` | `null` | ✔ | Accessibility label of the link | +| `accessibilityLabel` | `string` | `null` | ✓ | Accessibility label of the link | | `elementType` | `ElementType` | `a` | ✕ | Type of an element | | `isCurrent` | `bool` | `null` | ✕ | If true, the link is marked as current | -| `pageNumber` | `number` | — | ✔ | Page number, hidden for screen readers | +| `pageNumber` | `number` | — | ✓ | Page number, hidden for screen readers | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] @@ -131,8 +131,8 @@ This component extends the [Button][button] component with directional arrows an | Name | Type | Default | Required | Description | | -------------------- | ---------------------- | ------- | -------- | -------------------------------------------------------------------- | -| `accessibilityLabel` | `string` | `null` | ✔ | Accessibility label of the link | -| `direction` | [`previous` \| `next`] | `null` | ✔ | The direction according to which the corresponding icon is displayed | +| `accessibilityLabel` | `string` | `null` | ✓ | Accessibility label of the link | +| `direction` | [`previous` \| `next`] | `null` | ✓ | The direction according to which the corresponding icon is displayed | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] @@ -171,7 +171,7 @@ and [escape hatches][readme-escape-hatches]. | `accessibilityLabelPrevious` | `string` | `Previous` | ✕ | Accessibility label of the previous link | | `defaultPage` | `number` | `1` | ✕ | The number of the page selected as current page at the first render | | `onChange` | `(pageNumber: number) => void` | - | ✕ | On page change callback | -| `totalPages` | `number` | 0 | ✔ | Total count of pages | +| `totalPages` | `number` | 0 | ✓ | Total count of pages | | `visiblePages` | `number` | `5` | ✕ | Number of displayed pages | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-react/src/components/Pill/README.md b/packages/web-react/src/components/Pill/README.md index 21bbb45b32..0400c135c9 100644 --- a/packages/web-react/src/components/Pill/README.md +++ b/packages/web-react/src/components/Pill/README.md @@ -23,7 +23,7 @@ import { Pill } from '@lmc-eu/spirit-web-react'; | Name | Type | Default | Required | Description | | ---------- | --------------------------------------------------------------------------------------------------------------------------- | ---------- | -------- | ---------------------- | -| `children` | `ReactNode` | — | ✔ | Content of the Pill | +| `children` | `ReactNode` | — | ✓ | Content of the Pill | | `color` | [[Action Color dictionary][dictionary-color] \| [Emotion Color dictionary][dictionary-color] \| `selected` \| `unselected`] | `selected` | ✕ | Color of the component | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-react/src/components/Radio/README.md b/packages/web-react/src/components/Radio/README.md index b4f4a98aba..8ce6dbbe77 100644 --- a/packages/web-react/src/components/Radio/README.md +++ b/packages/web-react/src/components/Radio/README.md @@ -30,7 +30,7 @@ Advanced example usage: | Name | Type | Default | Required | Description | | ----------------- | ---------------------------------------------- | ------- | -------- | ---------------------------------------------------- | | `autoComplete` | string | - | ✕ | [Automated assistance in filling][autocomplete-attr] | -| `id` | string | - | ✔ | Input and label identification | +| `id` | string | - | ✓ | Input and label identification | | `isDisabled` | boolean | - | ✕ | Whether is field disabled | | `isChecked` | boolean | - | ✕ | Whether is field checked | | `isItem` | boolean | - | ✕ | To render in [Item][item] mode | diff --git a/packages/web-react/src/components/ScrollView/README.md b/packages/web-react/src/components/ScrollView/README.md index 27603fa1aa..596b1d4f01 100644 --- a/packages/web-react/src/components/ScrollView/README.md +++ b/packages/web-react/src/components/ScrollView/README.md @@ -67,7 +67,7 @@ Or both: | Name | Type | Default | Required | Description | | --------------------- | ---------------------------------- | ---------- | -------- | ---------------------------------- | -| `children` | `ReactNode` | — | ✔ | ScrollView children's nodes | +| `children` | `ReactNode` | — | ✓ | ScrollView children's nodes | | `direction` | [`horizontal` \| `vertical`] | `vertical` | ✕ | Direction of the wrapper | | `isScrollbarDisabled` | `bool` | `false` | ✕ | If true, the Scrollbar is disabled | | `overflowDecorators` | [`borders` \| `shadows` \| `both`] | `shadows` | ✕ | ScrollView overflow decorators | diff --git a/packages/web-react/src/components/Select/README.md b/packages/web-react/src/components/Select/README.md index b21a00ff6c..33e37e289c 100644 --- a/packages/web-react/src/components/Select/README.md +++ b/packages/web-react/src/components/Select/README.md @@ -38,7 +38,7 @@ Advanced example usage: | ----------------- | ---------------------------------------------- | ------- | -------- | ------------------------------- | | `children` | `ReactNode` | `null` | ✕ | Content of the Select | | `helperText` | `string` | — | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Select and label identification | +| `id` | `string` | — | ✓ | Select and label identification | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isFluid` | `bool` | — | ✕ | Whether is field is fluid | | `isLabelHidden` | `bool` | — | ✕ | Whether is label hidden | diff --git a/packages/web-react/src/components/Tabs/README.md b/packages/web-react/src/components/Tabs/README.md index 4acb961aa3..fe2e1c6ef7 100644 --- a/packages/web-react/src/components/Tabs/README.md +++ b/packages/web-react/src/components/Tabs/README.md @@ -68,8 +68,8 @@ const selectTab = useCallback((id) => { | Name | Type | Default | Required | Description | | ------------------- | ---------------------- | ------- | -------- | -------------------------------------------- | -| `selectedTab` | [`string` \| `number`] | — | ✔ | Identification of the selected tab | -| `toogle` | `Function` | — | ✔ | Toggle function which accept tab ID as input | +| `selectedTab` | [`string` \| `number`] | — | ✓ | Identification of the selected tab | +| `toogle` | `Function` | — | ✓ | Toggle function which accept tab ID as input | | `children` | `any` | — | ✕ | Child component | | `onSelectionChange` | `(id: TabId) => void` | — | ✕ | When the state of the selected panel changes | @@ -83,7 +83,7 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | -------------------- | ---------------------- | ------- | -------- | -------------------------------------------- | -| `defaultSelectedTab` | [`string` \| `number`] | — | ✔ | Identification of default selected tab | +| `defaultSelectedTab` | [`string` \| `number`] | — | ✓ | Identification of default selected tab | | `children` | `any` | — | ✕ | Child component | | `onSelectionChange` | `(id: TabId) => void` | — | ✕ | When the state of the selected panel changes | @@ -113,7 +113,7 @@ Tab list item | Name | Type | Default | Required | Description | | ------------ | ---------------------- | ------- | -------- | --------------------- | -| `forTabPane` | [`string` \| `number`] | — | ✔ | Identification of tab | +| `forTabPane` | [`string` \| `number`] | — | ✓ | Identification of tab | | `children` | `any` | — | ✕ | Child component | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -158,7 +158,7 @@ Tab content item | Name | Type | Default | Required | Description | | ---------- | ---------------------- | ------- | -------- | --------------------- | -| `id` | [`string` \| `number`] | — | ✔ | Identification of tab | +| `id` | [`string` \| `number`] | — | ✓ | Identification of tab | | `children` | `any` | — | ✕ | Child component | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-react/src/components/Tag/README.md b/packages/web-react/src/components/Tag/README.md index 15536ba483..72c61cba43 100644 --- a/packages/web-react/src/components/Tag/README.md +++ b/packages/web-react/src/components/Tag/README.md @@ -16,7 +16,7 @@ import { Tag } from '@lmc-eu/spirit-web-react'; | Name | Type | Default | Required | Description | | ------------- | ------------------------------------------------------- | --------- | -------- | ------------------------------- | -| `children` | `ReactNode` | — | ✔ | Content of the Tag | +| `children` | `ReactNode` | — | ✓ | Content of the Tag | | `color` | [Emotion Color dictionary][dictionary-color], `neutral` | `neutral` | ✕ | Color of the component | | `elementType` | `React.Element` | `span` | ✕ | HTML tag | | `isSubtle` | `bool` | `false` | ✕ | If is Subtle color variant used | diff --git a/packages/web-react/src/components/TextArea/README.md b/packages/web-react/src/components/TextArea/README.md index fb25a314db..35d50e73b2 100644 --- a/packages/web-react/src/components/TextArea/README.md +++ b/packages/web-react/src/components/TextArea/README.md @@ -41,7 +41,7 @@ Example with Auto-Height Adjustment | `autoComplete` | `string` | - | ✕ | [Automated assistance in filling][autocomplete-attr] | | `autoResizingMaxHeight` | `number` | `400` | ✕ | Maximum field height with automatic height control | | `helperText` | `string` | — | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Textarea and label identification | +| `id` | `string` | — | ✓ | Textarea and label identification | | `isAutoResizing` | `bool` | — | ✕ | Whether is field auto resizing which adjusts its height while typing | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isLabelHidden` | `bool` | — | ✕ | Whether is label hidden | diff --git a/packages/web-react/src/components/TextField/README.md b/packages/web-react/src/components/TextField/README.md index bfecb61b66..30605b5b2e 100644 --- a/packages/web-react/src/components/TextField/README.md +++ b/packages/web-react/src/components/TextField/README.md @@ -47,14 +47,14 @@ TextField with password toggle (button to reveal the password): | Name | Type | Default | Required | Description | | ------------------- | --------------------------------------------------------------------------- | ------- | -------- | ----------------------------------------------------------------------- | | `autoComplete` | `bool` | — | ✕ | [Automated assistance in filling][autocomplete-attr] | -| `hasPasswordToggle` | `bool` | — | ✔ | If true, the `type` is set to `password` and a password toggle is shown | +| `hasPasswordToggle` | `bool` | — | ✓ | If true, the `type` is set to `password` and a password toggle is shown | | `helperText` | `string` | — | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Input and label identification | +| `id` | `string` | — | ✓ | Input and label identification | | `inputWidth` | `number` | — | ✕ | Input width | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isLabelHidden` | `bool` | — | ✕ | Whether is label hidden | | `isRequired` | `bool` | — | ✕ | Whether is field required | -| `label` | `string` | — | ✔ | Label text | +| `label` | `string` | — | ✓ | Label text | | `name` | `string` | — | ✕ | Input name | | `pattern` | `string` | — | ✕ | Defines regular expressions for allowed value types | | `placeholder` | `string` | — | ✕ | Input placeholder | diff --git a/packages/web-react/src/components/TextFieldBase/README.md b/packages/web-react/src/components/TextFieldBase/README.md index 3b309956fc..64009735c4 100644 --- a/packages/web-react/src/components/TextFieldBase/README.md +++ b/packages/web-react/src/components/TextFieldBase/README.md @@ -46,7 +46,7 @@ TextFieldBase with password toggle (button to reveal the password): | `autoComplete` | `bool` | — | ✕ | [Automated assistance in filling][autocomplete-attr] | | `hasPasswordToggle` | `bool` | — | ✕ | If true, the `type` is set to `password` and a password toggle is shown | | `helperText` | `string` | — | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Input and label identification | +| `id` | `string` | — | ✓ | Input and label identification | | `isDisabled` | `bool` | — | ✕ | Whether is field disabled | | `isLabelHidden` | `bool` | — | ✕ | Whether is label hidden | | `isMultiline` | `bool` | — | ✕ | Whether is DOM element `textarea` | diff --git a/packages/web-react/src/components/Tooltip/README.md b/packages/web-react/src/components/Tooltip/README.md index 9418fe7bfe..e3f39da3a1 100644 --- a/packages/web-react/src/components/Tooltip/README.md +++ b/packages/web-react/src/components/Tooltip/README.md @@ -59,17 +59,17 @@ const [open, setOpen] = React.useState(false); | Attribute | Type | Default | Required | Description | | ------------------------------- | -------------------------------------------- | ------------------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `children` | `ReactNode` | — | ✔ | Tooltip children's nodes - `TooltipTrigger` and `TooltipPopover` | +| `children` | `ReactNode` | — | ✓ | Tooltip children's nodes - `TooltipTrigger` and `TooltipPopover` | | `enableFlipping` | `bool` | true | ✕ | Enables [flipping][floating-ui-flip] of the element’s placement when it starts to overflow its boundary area. For example `top` can be flipped to `bottom`. | | `enableFlippingCrossAxis` | `bool` | true | ✕ | Enables flipping on the [cross axis][floating-ui-flip-cross-axis], the axis perpendicular to main axis. For example `top-end` can be flipped to the `top-start`. | | `enableShifting` | `bool` | true | ✕ | Enables [shifting][floating-ui-shift] of the element to keep it inside the boundary area by adjusting its position. | | `enableSizing` | `bool` | true | ✕ | Enables [sizing][floating-ui-size] of the element to keep it inside the boundary area by setting the max width. | | `flipFallbackAxisSideDirection` | ["none" \| "start" \| "end"] | "none" | ✕ | Whether to allow [fallback to the opposite axis][floating-ui-flip-fallback-axis-side-direction] if no placements along the preferred placement axis fit, and if so, which side direction along that axis to choose. If necessary, it will fallback to the other direction. | | `flipFallbackPlacements` | `string` | - | ✕ | This describes a list of [explicit placements][floating-ui-flip-fallback-placements] to try if the initial placement doesn’t fit on the axes in which overflow is checked. For example you can set `"top, right, bottom"` | -| `id` | `string` | - | ✔ | Tooltip id | +| `id` | `string` | - | ✓ | Tooltip id | | `isDismissible` | `bool` | false | ✕ | Make tooltip dismissible | -| `isOpen` | `bool` | - | ✔ | Open state | -| `onToggle` | `() => void` | - | ✔ | Function for toggle open state of dropdown | +| `isOpen` | `bool` | - | ✓ | Open state | +| `onToggle` | `() => void` | - | ✓ | Function for toggle open state of dropdown | | `placement` | [Placement Dictionary][dictionary-placement] | "bottom" | ✕ | Placement of tooltip | | `isFocusableOnHover` | `bool` | false | ✕ | Allows you to mouse over a tooltip without closing it. We suggest turning off the `click` trigger if you use this feature. | | `trigger` | ["click" \| "hover" \| "manual"] | ["click", "hover" ] | ✕ | How tooltip is triggered: `click`, `hover`, `manual`. You may pass multiple triggers. If you pass `manual`, there will be no toggle functionality and you should provide your own toggle solution. | diff --git a/packages/web-react/src/components/VisuallyHidden/README.md b/packages/web-react/src/components/VisuallyHidden/README.md index bcf18c2e8b..cfc6c195e7 100644 --- a/packages/web-react/src/components/VisuallyHidden/README.md +++ b/packages/web-react/src/components/VisuallyHidden/README.md @@ -22,7 +22,7 @@ Advanced example: | Name | Type | Default | Required | Description | | ------------- | -------- | ------- | -------- | ------------------------------------ | -| `children` | `string` | — | ✔ | Hidden Label | +| `children` | `string` | — | ✓ | Hidden Label | | `elementType` | `string` | `span` | ✕ | Type of element used as main wrapper | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-twig/src/Resources/components/Accordion/README.md b/packages/web-twig/src/Resources/components/Accordion/README.md index b1f6da5f32..c124761b41 100644 --- a/packages/web-twig/src/Resources/components/Accordion/README.md +++ b/packages/web-twig/src/Resources/components/Accordion/README.md @@ -193,15 +193,15 @@ The Accordion itself consists of several components which cannot be used indepen | Name | Type | Default | Required | Description | | ------------- | -------- | --------- | -------- | ------------------- | | `elementType` | `string` | `article` | ✕ | Custom element type | -| `id` | `string` | `null` | ✔ | AccordionItem ID | +| `id` | `string` | `null` | ✓ | AccordionItem ID | ### AccordionHeader | Name | Type | Default | Required | Description | | ------------- | -------- | ------- | -------- | ------------------------ | | `elementType` | `string` | `h3` | ✕ | Custom element type | -| `for` | `string` | `null` | ✔ | AccordionContent ID | -| `id` | `string` | `null` | ✔ | AccordionHeader ID | +| `for` | `string` | `null` | ✓ | AccordionContent ID | +| `id` | `string` | `null` | ✓ | AccordionHeader ID | | `isOpen` | `string` | `false` | ✕ | Whether the item is open | | `UNSAFE_slot` | `HTML` | — | ✕ | Side slot in the header | @@ -209,9 +209,9 @@ The Accordion itself consists of several components which cannot be used indepen | Name | Type | Default | Required | Description | | -------------- | -------- | ------- | -------- | --------------------------------------------------------------------------- | -| `id` | `string` | `null` | ✔ | AccordionContent ID | +| `id` | `string` | `null` | ✓ | AccordionContent ID | | `isOpen` | `bool` | `false` | ✕ | If true, make the item open on page load | -| `labelledById` | `string` | `null` | ✔ | AccordionHeader ID | +| `labelledById` | `string` | `null` | ✓ | AccordionHeader ID | | `parent` | `string` | `null` | ✕ | A parent element selector that ensures that only one item is open at a time | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-twig/src/Resources/components/ButtonLink/README.md b/packages/web-twig/src/Resources/components/ButtonLink/README.md index 172cb27e8b..b19f5be894 100644 --- a/packages/web-twig/src/Resources/components/ButtonLink/README.md +++ b/packages/web-twig/src/Resources/components/ButtonLink/README.md @@ -32,7 +32,7 @@ Without lexer: | Name | Type | Default | Required | Description | | ------------ | ----------------------------------------------------------------------------------------- | --------- | -------- | ------------------------------------------------------------------------------ | | `color` | [Action Color dictionary][dictionary-color], [Emotion Color dictionary][dictionary-color] | `primary` | ✕ | Color variant | -| `href` | `string` | — | ✔ | Link URL | +| `href` | `string` | — | ✓ | Link URL | | `isBlock` | `bool` | `false` | ✕ | Span the element to the full width of its parent | | `isDisabled` | `bool` | `false` | ✕ | If true, ButtonLink is disabled | | `isLoading` | `bool` | `false` | ✕ | If true, ButtonLink is in a loading state, disabled and the Spinner is visible | diff --git a/packages/web-twig/src/Resources/components/Checkbox/README.md b/packages/web-twig/src/Resources/components/Checkbox/README.md index 41fa37522b..9759b37c73 100644 --- a/packages/web-twig/src/Resources/components/Checkbox/README.md +++ b/packages/web-twig/src/Resources/components/Checkbox/README.md @@ -49,10 +49,10 @@ Without lexer: | `isItem` | `bool` | `false` | ✕ | To render in [Item][item] mode | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, input is required | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `name` | `string` | `null` | ✕ | Input name | | `UNSAFE_helperText` | `string` | `null` | ✕\*\* | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text (allows HTML) | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text (allows HTML) | | `UNSAFE_validationText` | [`string` \| `string[]`] | `null` | ✕\*\* | Unescaped validation text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state. | | `validationText` | [`string` \| `string[]`] | `null` | ✕\*\* | Validation text | diff --git a/packages/web-twig/src/Resources/components/Collapse/README.md b/packages/web-twig/src/Resources/components/Collapse/README.md index e80f63425f..c44edb7258 100644 --- a/packages/web-twig/src/Resources/components/Collapse/README.md +++ b/packages/web-twig/src/Resources/components/Collapse/README.md @@ -57,7 +57,7 @@ attributes to register trigger events. | ------------- | -------- | ------- | -------- | ---------------------------------------------------------------------- | | `breakpoint` | `string` | `null` | ✕ | Breakpoint level [mobile,tablet,desktop] | | `elementType` | `string` | `div` | ✕ | Custom element type for wrapper and content | -| `id` | `string` | — | ✔ | Collapse ID | +| `id` | `string` | — | ✓ | Collapse ID | | `isOpen` | `bool` | `false` | ✕ | If true, make the item open on page load | | `parent` | `string` | `null` | ✕ | A parent element selector that ensures that only one item is opened \* | @@ -74,8 +74,8 @@ and [escape hatches][readme-escape-hatches]. | `aria-controls` | `string` | — | ✕ | Aria controls state (auto) | | `aria-expanded` | `string` | — | ✕ | Aria expanded state (auto) | | `data-spirit-more` | `bool` | — | ✕ | For hide on collapse as more button | -| `data-spirit-target` | `string` | — | ✔ | Target selector | -| `data-spirit-toggle` | `string` | `collapse` | ✔ | Iterable selector | +| `data-spirit-target` | `string` | — | ✓ | Target selector | +| `data-spirit-toggle` | `string` | `collapse` | ✓ | Iterable selector | Other necessary attributes are toggled automatically, like `aria-controls` and `aria-expanded` when component is loaded or width of window is changed. There can be several triggers, the same rules apply to each. diff --git a/packages/web-twig/src/Resources/components/Dropdown/README.md b/packages/web-twig/src/Resources/components/Dropdown/README.md index 35654e3a22..b4debd32d6 100644 --- a/packages/web-twig/src/Resources/components/Dropdown/README.md +++ b/packages/web-twig/src/Resources/components/Dropdown/README.md @@ -51,7 +51,7 @@ attributes to register trigger events. | --------------- | -------------------------------------------- | -------------- | -------- | ------------------------------------- | | `elementType` | `string` | `div` | ✕ | HTML tag to render | | `fullWidthMode` | `string` | — | ✕ | Full-width mode [off,mobile-only,all] | -| `id` | `string` | — | ✔ | DropdownPopover ID | +| `id` | `string` | — | ✓ | DropdownPopover ID | | `placement` | [Placement Dictionary][dictionary-placement] | `bottom-start` | ✕ | Placement of the dropdown | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -64,8 +64,8 @@ and [escape hatches][readme-escape-hatches]. | -------------------- | -------- | ---------- | -------- | -------------------------- | | `aria-controls` | `string` | — | ✕ | Aria controls state (auto) | | `aria-expanded` | `string` | — | ✕ | Aria expanded state (auto) | -| `data-spirit-target` | `string` | — | ✔ | Target selector | -| `data-spirit-toggle` | `string` | `dropdown` | ✔ | Iterable selector | +| `data-spirit-target` | `string` | — | ✓ | Target selector | +| `data-spirit-toggle` | `string` | `dropdown` | ✓ | Iterable selector | Other necessary attributes are toggled automatically, like `aria-controls` and `aria-expanded` when the component is loaded or the width of the window is changed. There can be several triggers, the same rules apply to each. diff --git a/packages/web-twig/src/Resources/components/FieldGroup/README.md b/packages/web-twig/src/Resources/components/FieldGroup/README.md index 5f801a1afe..4257da68af 100644 --- a/packages/web-twig/src/Resources/components/FieldGroup/README.md +++ b/packages/web-twig/src/Resources/components/FieldGroup/README.md @@ -104,7 +104,7 @@ When validated on server: | ----------------------- | ---------------------------------------------- | ------- | -------- | ---------------------------------------------------------- | | `form` | `string` | `null` | ✕ | Parent form ID | | `helperText` | `string` | `null` | ✕\*\* | Custom helper text | -| `id` | `string` | — | ✔ | Group and label identification | +| `id` | `string` | — | ✓ | Group and label identification | | `isDisabled` | `bool` | `false` | ✕ | If true, the group is disabled | | `isFluid` | `bool` | `false` | ✕ | If true, the element spans to the full width of its parent | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | diff --git a/packages/web-twig/src/Resources/components/FileUploader/README.md b/packages/web-twig/src/Resources/components/FileUploader/README.md index 08483ea660..83bae866a1 100644 --- a/packages/web-twig/src/Resources/components/FileUploader/README.md +++ b/packages/web-twig/src/Resources/components/FileUploader/README.md @@ -206,7 +206,7 @@ To mark the input as disabled, simply add the `isDisabled` attribute: | `dragAndDropText` | `string` | `or drag and drop here` | ✕ | Text shown in the drop zone if drag-and-drop is enabled on the device | | `helperText` | `string` | `null` | ✕\*\* | Custom helper text | | `iconName` | `string` | `upload` | ✕ | Icon used in the drop zone | -| `id` | `string` | — | ✔ | Input and label identification | +| `id` | `string` | — | ✓ | Input and label identification | | `isDisabled` | `bool` | `false` | ✕ | If true, input is disabled | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, input is marked as required | diff --git a/packages/web-twig/src/Resources/components/Header/README.md b/packages/web-twig/src/Resources/components/Header/README.md index 6b2bc130fe..ad277b4576 100644 --- a/packages/web-twig/src/Resources/components/Header/README.md +++ b/packages/web-twig/src/Resources/components/Header/README.md @@ -157,7 +157,7 @@ You can place any custom content into the mobile actions component: | Name | Type | Default | Required | Description | | ----------------- | -------- | ------- | -------- | ------------------------------- | -| `dialogId` | `string` | — | ✔ | ID of the linked HeaderDialog | +| `dialogId` | `string` | — | ✓ | ID of the linked HeaderDialog | | `menuToggleLabel` | `string` | `Menu` | ✕ | Label of the menu toggle button | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -259,7 +259,7 @@ There is no API for HeaderNavItem. | Name | Type | Default | Required | Description | | ----------- | -------- | ------- | -------- | ----------------------------- | -| `href` | `string` | — | ✔ | Link URL | +| `href` | `string` | — | ✓ | Link URL | | `isCurrent` | `bool` | `false` | ✕ | Mark link as current | | `target` | `string` | `null` | ✕ | Browsing context for the link | @@ -287,7 +287,7 @@ used for second-level navigation in general. | Name | Type | Default | Required | Description | | ---- | -------- | ------- | -------- | -------------------------------------- | -| `id` | `string` | — | ✔ | ID to be linked in HeaderMobileActions | +| `id` | `string` | — | ✓ | ID to be linked in HeaderMobileActions | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. If you need more control over the styling of a component, you can use [style props][readme-style-props] @@ -305,7 +305,7 @@ Close button closes the Header Dialog using our Off-canvas JavaScript plugin. | Name | Type | Default | Required | Description | | --------------- | -------- | ------- | -------- | ------------------------------- | -| `dialogId` | `string` | — | ✔ | ID of the parent HeaderDialog | +| `dialogId` | `string` | — | ✓ | ID of the parent HeaderDialog | | `enableDismiss` | `bool` | `true` | ✕ | Enable Off-canvas JS dismiss | | `label` | `string` | `Close` | ✕ | Label of the menu toggle button | @@ -397,7 +397,7 @@ There is no API for HeaderDialogNavItem. | Name | Type | Default | Required | Description | | ----------- | -------- | ------- | -------- | ----------------------------- | -| `href` | `string` | — | ✔ | Link URL | +| `href` | `string` | — | ✓ | Link URL | | `isCurrent` | `bool` | `false` | ✕ | Mark link as current | | `target` | `string` | `null` | ✕ | Browsing context for the link | diff --git a/packages/web-twig/src/Resources/components/Icon/README.md b/packages/web-twig/src/Resources/components/Icon/README.md index 548e643a08..53f9b59882 100644 --- a/packages/web-twig/src/Resources/components/Icon/README.md +++ b/packages/web-twig/src/Resources/components/Icon/README.md @@ -53,7 +53,7 @@ so you might want to hide it using either wrapping element with `hidden` attribu | `boxSize` | `number` | `24` | ✕ | Size of the icon | | `isReusable` | `bool` | `true` | ✕ | Enables reusability of SVG icons | | `isSymbol` | `bool` | `false` | ✕ | If true, the element will be rendered as SVG symbol with the name assigned to the ID attribute, other props are skipped | -| `name` | `string` | — | ✔ | Name of the icon, case sensitive | +| `name` | `string` | — | ✓ | Name of the icon, case sensitive | | `title` | `string` | `null` | ✕ | Optional title to display on hover | Get the list of `name` options in the [Icon package][icon-package] or your source of icons. diff --git a/packages/web-twig/src/Resources/components/Item/README.md b/packages/web-twig/src/Resources/components/Item/README.md index 9bb946ef73..d7324b2ce1 100644 --- a/packages/web-twig/src/Resources/components/Item/README.md +++ b/packages/web-twig/src/Resources/components/Item/README.md @@ -80,7 +80,7 @@ Usage in [Dropdown][dropdown] component: | `iconName` | `string` | — | ✕ | Icon used in item | | `isDisabled` | `bool` | `false` | ✕ | Whether is the item disabled | | `isSelected` | `bool` | `false` | ✕ | Whether is the item selected | -| `label` | `string` | - | ✔\* | Label of the item | +| `label` | `string` | - | ✓\* | Label of the item | | `target` | `string` | — | ✕ | Target prop if element type is anchor | | `type` | `string` | `button` | ✕ | Input type if element type is button | | `UNSAFE_className` | `string` | — | ✕ | Wrapper custom class name | diff --git a/packages/web-twig/src/Resources/components/Link/README.md b/packages/web-twig/src/Resources/components/Link/README.md index 6758760480..eea2ec710f 100644 --- a/packages/web-twig/src/Resources/components/Link/README.md +++ b/packages/web-twig/src/Resources/components/Link/README.md @@ -38,7 +38,7 @@ Without lexer: | Name | Type | Default | Required | Description | | -------------- | ------------------------------------------------ | --------- | -------- | ---------------------------------- | | `color` | [Action Link Color dictionary][dictionary-color] | `primary` | ✕ | Color variant | -| `href` | `string` | — | ✔ | Link URL | +| `href` | `string` | — | ✓ | Link URL | | `isDisabled` | `bool` | `false` | ✕ | If true, Link is disabled | | `isUnderlined` | `bool` | `false` | ✕ | If true, Link is underlined | | `target` | `string` | `null` | ✕ | Browsing context for the link | diff --git a/packages/web-twig/src/Resources/components/Modal/README.md b/packages/web-twig/src/Resources/components/Modal/README.md index 2b64b68be0..5c18ce9db4 100644 --- a/packages/web-twig/src/Resources/components/Modal/README.md +++ b/packages/web-twig/src/Resources/components/Modal/README.md @@ -47,7 +47,7 @@ Example: | ---------------------- | --------------------------------------------- | -------- | -------- | ----------------------------------------------------- | | `alignmentY` | [AlignmentY dictionary][dictionary-alignment] | `center` | ✕ | Vertical alignment of modal | | `closeOnBackdropClick` | `bool` | `true` | ✕ | Whether the modal will close when backdrop is clicked | -| `id` | `string` | — | ✔ | Modal ID | +| `id` | `string` | — | ✓ | Modal ID | | `titleId` | `string` | `null` | ✕ | ID of the title inside ModalHeader | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. @@ -164,7 +164,7 @@ using the `aria-label` attribute on `` component: | --------------- | -------- | ------- | -------- | ----------------------- | | `closeLabel` | `string` | `Close` | ✕ | Custom close label | | `enableDismiss` | `bool` | `true` | ✕ | Enable JS Modal dismiss | -| `modalId` | `string` | — | ✔ | Modal ID | +| `modalId` | `string` | — | ✓ | Modal ID | | `titleId` | `string` | `null` | ✕ | ID of the title | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-twig/src/Resources/components/Pagination/README.md b/packages/web-twig/src/Resources/components/Pagination/README.md index 3ea4668856..154e62a479 100644 --- a/packages/web-twig/src/Resources/components/Pagination/README.md +++ b/packages/web-twig/src/Resources/components/Pagination/README.md @@ -96,10 +96,10 @@ and [escape hatches][readme-escape-hatches]. | Name | Type | Default | Required | Description | | -------------------- | -------- | ------- | -------- | -------------------------------------- | -| `accessibilityLabel` | `string` | `null` | ✔ | Accessibility label of the link | +| `accessibilityLabel` | `string` | `null` | ✓ | Accessibility label of the link | | `href` | `string` | `null` | ✕ | URL target of a link | | `isCurrent` | `bool` | `false` | ✕ | Mark link as current | -| `pageNumber` | `string` | `null` | ✔ | Page number, hidden for screen readers | +| `pageNumber` | `string` | `null` | ✓ | Page number, hidden for screen readers | | `target` | `string` | `null` | ✕ | Browsing context for the link | On top of the API options, the components accept [additional attributes][readme-additional-attributes]. diff --git a/packages/web-twig/src/Resources/components/Radio/README.md b/packages/web-twig/src/Resources/components/Radio/README.md index 5370f6496b..54272b1816 100644 --- a/packages/web-twig/src/Resources/components/Radio/README.md +++ b/packages/web-twig/src/Resources/components/Radio/README.md @@ -47,10 +47,10 @@ Without lexer: | `isDisabled` | `bool` | `false` | ✕ | If true, input is disabled | | `isItem` | `bool` | `false` | ✕ | To render in [Item][item] mode | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `name` | `string` | `null` | ✕ | Input name | | `UNSAFE_helperText` | `string` | `null` | ✕ | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state | | `value` | `string` | `null` | ✕ | Input value | diff --git a/packages/web-twig/src/Resources/components/Select/README.md b/packages/web-twig/src/Resources/components/Select/README.md index e8d76c4007..606f1d9418 100644 --- a/packages/web-twig/src/Resources/components/Select/README.md +++ b/packages/web-twig/src/Resources/components/Select/README.md @@ -48,16 +48,16 @@ Without lexer: | Name | Type | Default | Required | Description | | ----------------------- | ---------------------------------------------- | ------- | -------- | ---------------------------------------------------------- | | `helperText` | `string` | `null` | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Select and label identification | +| `id` | `string` | — | ✓ | Select and label identification | | `inputProps` | `string[]` | `[]` | ✕ | Pass additional attributes to the select element | | `isDisabled` | `bool` | `false` | ✕ | If true, select is disabled | | `isFluid` | `bool` | `false` | ✕ | If true, the element spans to the full width of its parent | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, select is required | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `name` | `string` | `null` | ✕ | Select name | | `UNSAFE_helperText` | `string` | `null` | ✕ | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text | | `UNSAFE_validationText` | [`string` \| `string[]`] | `null` | ✕ | Unescaped validation text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state. | | `validationText` | [`string` \| `string[]`] | `null` | ✕ | Validation text | diff --git a/packages/web-twig/src/Resources/components/Tabs/README.md b/packages/web-twig/src/Resources/components/Tabs/README.md index 22e0e41c69..b0dba6ed8d 100644 --- a/packages/web-twig/src/Resources/components/Tabs/README.md +++ b/packages/web-twig/src/Resources/components/Tabs/README.md @@ -66,7 +66,7 @@ There is no API for TabItem. | Name | Type | Default | Required | Description | | ------------ | --------- | ------- | -------- | ------------------------------ | -| `id` | `string ` | `null` | ✔ | Tab pane target identification | +| `id` | `string ` | `null` | ✓ | Tab pane target identification | | `isSelected` | `bool` | `false` | ✕ | Whether is tab pane selected | | `label` | `string` | `null` | ✕ | Aria label of the tab pane | diff --git a/packages/web-twig/src/Resources/components/TextArea/README.md b/packages/web-twig/src/Resources/components/TextArea/README.md index 3e90279173..f52e26cb2d 100644 --- a/packages/web-twig/src/Resources/components/TextArea/README.md +++ b/packages/web-twig/src/Resources/components/TextArea/README.md @@ -50,20 +50,20 @@ Without lexer: | ----------------------- | ---------------------------------------------- | ------- | -------- | ----------------------------------------------------------------------------------------------------------- | | `autocomplete` | `string` | `null` | ✕ | [Automated assistance in filling][autocomplete-attr] | | `helperText` | `string` | `null` | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | TextArea and label identification | +| `id` | `string` | — | ✓ | TextArea and label identification | | `inputProps` | `string[]` | `[]` | ✕ | Pass additional attributes to the textarea element | | `isAutoResizing` | `bool` | `false` | ✕ | If true, TextArea adjusts its height as user types, see [plugin info](#javascript-plugin-for-auto-resizing) | | `isDisabled` | `bool` | `false` | ✕ | If true, TextArea is disabled | | `isFluid` | `bool` | `false` | ✕ | If true, the element spans to the full width of its parent | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, TextArea is required | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `maxlength` | `number` | `null` | ✕ | Maximum number of characters | | `name` | `string` | `null` | ✕ | TextArea name | | `placeholder` | `string` | `null` | ✕ | TextArea placeholder | | `rows` | `number` | `null` | ✕ | Number of visible rows | | `UNSAFE_helperText` | `string` | `null` | ✕ | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text | | `UNSAFE_validationText` | [`string` \| `string[]`] | `null` | ✕ | Unescaped custom validation text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state. | | `validationText` | [`string` \| `string[]`] | `null` | ✕ | Validation text | diff --git a/packages/web-twig/src/Resources/components/TextField/README.md b/packages/web-twig/src/Resources/components/TextField/README.md index 03154cfcf1..fa22a685ac 100644 --- a/packages/web-twig/src/Resources/components/TextField/README.md +++ b/packages/web-twig/src/Resources/components/TextField/README.md @@ -63,19 +63,19 @@ Without lexer: | `autocomplete` | `string` | `null` | ✕ | [Automated assistance in filling][autocomplete-attr] | | `hasPasswordToggle` | `bool` | `false` | ✕ | If true, the `type` is set to `password` and a password toggle is shown | | `helperText` | `string` | `null` | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Input and label identification | +| `id` | `string` | — | ✓ | Input and label identification | | `inputProps` | `string[]` | `[]` | ✕ | Pass additional attributes to the input element | | `inputWidth` | `number` | `null` | ✕ | Input width | | `isDisabled` | `bool` | `false` | ✕ | If true, input is disabled | | `isFluid` | `bool` | `false` | ✕ | If true, the element spans to the full width of its parent | | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isRequired` | `bool` | `false` | ✕ | If true, input is required | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `name` | `string` | `null` | ✕ | Input name | | `placeholder` | `string` | `null` | ✕ | Input placeholder | | `type` | [`email` \| `number` \| `password` \| `search` \| `tel` \| `text` \| `url`] | `text` | ✕ | Input type | | `UNSAFE_helperText` | `string` | `null` | ✕ | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text | | `UNSAFE_validationText` | [`string` \| `string[]`] | `null` | ✕ | Unescaped validation text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state. | | `validationText` | [`string` \| `string[]`] | `null` | ✕ | Validation text | diff --git a/packages/web-twig/src/Resources/components/TextFieldBase/README.md b/packages/web-twig/src/Resources/components/TextFieldBase/README.md index 451f5689c0..fb75ec2be0 100644 --- a/packages/web-twig/src/Resources/components/TextFieldBase/README.md +++ b/packages/web-twig/src/Resources/components/TextFieldBase/README.md @@ -63,7 +63,7 @@ Without lexer: | `autocomplete` | `string` | `null` | ✕ | [Automated assistance in filling][autocomplete-attr] | | `hasPasswordToggle` | `bool` | `false` | ✕ | If true, the `type` is set to `password` and a password toggle is shown | | `helperText` | `string` | `null` | ✕ | Custom helper text | -| `id` | `string` | — | ✔ | Input and label identification | +| `id` | `string` | — | ✓ | Input and label identification | | `inputProps` | `string[]` | `[]` | ✕ | Pass additional attributes to the input/textarea element | | `isAutoResizing` | `bool` | `false` | ✕ | If true, TextArea adjusts its height as user types | | `isDisabled` | `bool` | `false` | ✕ | If true, input is disabled | @@ -71,13 +71,13 @@ Without lexer: | `isLabelHidden` | `bool` | `false` | ✕ | If true, label is hidden | | `isMultiline` | `bool` | `false` | ✕ | If true, rendered DOM element is `textarea` | | `isRequired` | `bool` | `false` | ✕ | If true, input is required | -| `label` | `string` | — | ✔\* | Label text | +| `label` | `string` | — | ✓\* | Label text | | `name` | `string` | `null` | ✕ | Input name | | `pattern` | `string` | `null` | ✕ | Defines regular expressions for allowed value types | | `placeholder` | `string` | `null` | ✕ | Input placeholder | | `type` | [`email` \| `number` \| `password` \| `search` \| `tel` \| `text` \| `url`] | `text` | ✕ | Input type | | `UNSAFE_helperText` | `string` | `null` | ✕ | Unescaped custom helper text | -| `UNSAFE_label` | `string` | — | ✔\* | Unescaped label text | +| `UNSAFE_label` | `string` | — | ✓\* | Unescaped label text | | `UNSAFE_validationText` | [`string` \| `string[]`] | `null` | ✕ | Unescaped validation text | | `validationState` | [Validation dictionary][dictionary-validation] | `null` | ✕ | Type of validation state. | | `validationText` | [`string` \| `string[]`] | `null` | ✕ | Validation text | diff --git a/packages/web-twig/src/Resources/components/Tooltip/README.md b/packages/web-twig/src/Resources/components/Tooltip/README.md index 0f73a6f967..3111af1fb6 100644 --- a/packages/web-twig/src/Resources/components/Tooltip/README.md +++ b/packages/web-twig/src/Resources/components/Tooltip/README.md @@ -134,7 +134,7 @@ Advanced floating functionality is provided by JavaScript plugin and by [Floatin | `enableSizing` | `bool` | true | ✕ | Enables [sizing][floating-ui-size] of the element to keep it inside the boundary area by setting the max width. | | `flipFallbackAxisSideDirection` | ["none" \| "start" \| "end"] | "none" | ✕ | Whether to allow [fallback to the opposite axis][floating-ui-flip-fallback-axis-side-direction] if no placements along the preferred placement axis fit, and if so, which side direction along that axis to choose. If necessary, it will fallback to the other direction. | | `flipFallbackPlacements` | `string` | - | ✕ | This describes a list of [explicit placements][floating-ui-flip-fallback-placements] to try if the initial placement doesn’t fit on the axes in which overflow is checked. For example you can set `"top, right, bottom"` | -| `id` | `string` | - | ✔ | Tooltip ID | +| `id` | `string` | - | ✓ | Tooltip ID | | `isDismissible` | `bool` | false | ✕ | Make tooltip dismissible | | `isOpen` | `bool` | false | ✕ | Whether is Tooltip open or hidden on initial render | | `placement` | [Placement Dictionary][dictionary-placement] | "bottom" | ✕ | Placement of tooltip | diff --git a/packages/web-twig/src/Resources/components/VisuallyHidden/README.md b/packages/web-twig/src/Resources/components/VisuallyHidden/README.md index 4b85e0be87..0731b3e6ee 100644 --- a/packages/web-twig/src/Resources/components/VisuallyHidden/README.md +++ b/packages/web-twig/src/Resources/components/VisuallyHidden/README.md @@ -30,7 +30,7 @@ Without lexer: | Name | Type | Default | Required | Description | | ------------------ | --------------- | ------- | -------- | ------------------------------------ | -| `children` | `string` | — | ✔ | Hidden Label | +| `children` | `string` | — | ✓ | Hidden Label | | `elementType` | `string` | `span` | ✕ | Type of element used as main wrapper | | `UNSAFE_className` | `string` | — | ✕ | Wrapper custom class name | | `UNSAFE_style` | `CSSProperties` | — | ✕ | Wrapper custom style | diff --git a/packages/web/src/scss/components/Collapse/README.md b/packages/web/src/scss/components/Collapse/README.md index 1ab9b714d4..83a64c4d74 100644 --- a/packages/web/src/scss/components/Collapse/README.md +++ b/packages/web/src/scss/components/Collapse/README.md @@ -47,8 +47,8 @@ Hide button when collapse | Name | Type | Default | Required | Description | | -------------------- | -------- | ---------- | -------- | ----------------------------------- | -| `data-spirit-toggle` | `string` | `collapse` | ✔ | Iterable selector | -| `data-spirit-target` | `string` | — | ✔ | Target selector | +| `data-spirit-toggle` | `string` | `collapse` | ✓ | Iterable selector | +| `data-spirit-target` | `string` | — | ✓ | Target selector | | `data-spirit-more` | `bool` | — | ✕ | For hide on collapse as more button | | `aria-expanded` | `string` | — | ✕ | Aria expanded state (auto) | | `aria-controls` | `string` | — | ✕ | Aria controls state (auto) | diff --git a/packages/web/src/scss/components/Dropdown/README.md b/packages/web/src/scss/components/Dropdown/README.md index 411fc49b0a..d6932464d9 100644 --- a/packages/web/src/scss/components/Dropdown/README.md +++ b/packages/web/src/scss/components/Dropdown/README.md @@ -260,9 +260,9 @@ There are two options here. Use the trigger element as an anchor or wrap the men | Attribute | Type | Default | Required | Description | | ----------------------- | -------- | ------- | -------- | -------------------------------------------------------------------------------------------------------------- | -| `data-spirit-target` | `string` | — | ✔ | Target menu element selector | -| `aria-expanded` | `bool` | — | ✔ | Is set on an element to indicate if a control is expanded or collapsed | -| `aria-controls` | `string` | — | ✔ | Identifies the element whose contents or presence are controlled by the element on which this attribute is set | +| `data-spirit-target` | `string` | — | ✓ | Target menu element selector | +| `aria-expanded` | `bool` | — | ✓ | Is set on an element to indicate if a control is expanded or collapsed | +| `aria-controls` | `string` | — | ✓ | Identifies the element whose contents or presence are controlled by the element on which this attribute is set | | `data-spirit-autoclose` | `bool` | `true` | ✕ | When you need to disable autoclose feature | ## DropdownPopover diff --git a/packages/web/src/scss/components/Modal/README.md b/packages/web/src/scss/components/Modal/README.md index fedd10ec25..4713ec0b2e 100644 --- a/packages/web/src/scss/components/Modal/README.md +++ b/packages/web/src/scss/components/Modal/README.md @@ -435,7 +435,7 @@ Both trigger and close buttons use `data` attributes to open and close the Modal | `aria-expanded` | `string` | — | ✕ | Aria expanded state (auto) | | `data-spirit-close-on-backdrop-click` | `bool` | `true` | ✕ | Whether the modal will close when backdrop is clicked | | `data-spirit-dismiss` | `string` | `modal` | ✕ | Iterable selector | -| `data-spirit-target` | `string` | — | ✔ | Target selector | +| `data-spirit-target` | `string` | — | ✓ | Target selector | | `data-spirit-toggle` | `string` | `modal` | ✕ | Iterable selector | ## JavaScript Plugin