{/*
* _____ _
*|_ _|_ _____ _ __ | |_ _ _
* | | \ \ /\ / / _ \ '_ \| __| | | | Auto-generated file
* | | \ V V / __/ | | | |_| |_| | DO NOT EDIT - changes will be overwritten
* |_| \_/\_/ \___|_| |_|\__|\__, | Generated by: npx nx generate:ui twenty-docs
* |___/
*
* This file is generated from the documentation data in packages/twenty-ui/generated.
* To update it, edit the component prop types or design tokens in twenty-ui and run:
* npx nx generate:ui twenty-docs
*/}
### Select.Root
A ref to imperative actions.
- `unmount`: Manually unmounts the select.
Call this after any externally controlled closing animation finishes.
Provides a hint to the browser for autofill.
Whether the select popup is initially open.
To render a controlled select popup, use the `open` prop instead.
The uncontrolled value of the select when it's initially rendered.
To render a controlled select, use the `value` prop instead.
Whether the component should ignore user interaction.
Identifies the form that owns the hidden input.
Useful when the select is rendered outside the form.
Whether moving the pointer over items should highlight them.
Disabling this prop allows CSS `:hover` to be differentiated from the `:focus` (`data-highlighted`) state.
The id of the Select.
A ref to access the hidden input element.
Custom comparison logic used to determine if a select item value matches the current selected value. Useful when item values are objects without matching referentially.
Defaults to `Object.is` comparison.
Data structure of the items rendered in the select popup.
When specified, `` renders the label of the selected item instead of the raw value.
When the item values are objects (``), this function converts the object value to a string representation for display in the trigger.
If the shape of the object is `{ value, label }`, the label will be used automatically without needing to specify this prop.
When the item values are objects (``), this function converts the object value to a string representation for form submission.
If the shape of the object is `{ value, label }`, the value will be used automatically without needing to specify this prop.
Determines if the select enters a modal state when open.
- `true`: user interaction is limited to the select: document page scroll is locked and pointer interactions on outside elements are disabled.
- `false`: user interaction with the rest of the document is allowed.
On touch devices, a `true` modal blocks outside taps but leaves the page scrollable unless the popup spans nearly the full viewport width, matching native iOS behavior.
Whether multiple items can be selected.
Identifies the field when a form is submitted.
Event handler called when the select popup is opened or closed.
Event handler called after any animations complete when the select popup is opened or closed.
Event handler called when the value of the select changes.
Whether the select popup is currently open.
Whether the user should be unable to choose a different option from the select popup.
Whether the user must choose a value before submitting a form.
The value of the select. Use when controlled.
### Select.Trigger
CSS class applied to the element, or a function that
returns a class based on the component's state.
Whether the component should ignore user interaction.
Whether the component renders a native `