diff --git a/docs-ui/src/content/components/search-field.props.ts b/docs-ui/src/content/components/search-field.props.ts index 9b05636f6a..d7b829e7f4 100644 --- a/docs-ui/src/content/components/search-field.props.ts +++ b/docs-ui/src/content/components/search-field.props.ts @@ -25,7 +25,7 @@ export const searchFieldPropDefs: Record = { type: 'string', required: true, }, - collapsible: { + startCollapsed: { type: 'boolean', default: 'false', }, diff --git a/packages/ui/report.api.md b/packages/ui/report.api.md index aa8d706784..ce30383c4c 100644 --- a/packages/ui/report.api.md +++ b/packages/ui/report.api.md @@ -1453,10 +1453,10 @@ export const SearchField: ForwardRefExoticComponent< export interface SearchFieldProps extends SearchFieldProps_2, Omit { - collapsible?: boolean; icon?: ReactNode | false; placeholder?: string; size?: 'small' | 'medium' | Partial>; + startCollapsed?: boolean; } // @public (undocumented) diff --git a/packages/ui/src/components/SearchField/SearchField.stories.tsx b/packages/ui/src/components/SearchField/SearchField.stories.tsx index f94154973d..a1076e2929 100644 --- a/packages/ui/src/components/SearchField/SearchField.stories.tsx +++ b/packages/ui/src/components/SearchField/SearchField.stories.tsx @@ -159,7 +159,7 @@ export const CustomField: Story = { export const Collapsible: Story = { args: { ...Default.args, - collapsible: true, + startCollapsed: true, }, render: args => ( diff --git a/packages/ui/src/components/SearchField/SearchField.tsx b/packages/ui/src/components/SearchField/SearchField.tsx index a795070626..da45c8fc20 100644 --- a/packages/ui/src/components/SearchField/SearchField.tsx +++ b/packages/ui/src/components/SearchField/SearchField.tsx @@ -40,7 +40,7 @@ export const SearchField = forwardRef( description, isRequired, placeholder = 'Search', - collapsible = false, + startCollapsed = false, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...rest @@ -100,7 +100,7 @@ export const SearchField = forwardRef( {...dataAttributes} aria-label={ariaLabel} aria-labelledby={ariaLabelledBy} - data-collapsible={collapsible} + data-collapsible={startCollapsed} data-collapsed={isCollapsed} onFocusChange={handleClick} onChange={handleChange} diff --git a/packages/ui/src/components/SearchField/types.ts b/packages/ui/src/components/SearchField/types.ts index 1c03270b7f..585469a268 100644 --- a/packages/ui/src/components/SearchField/types.ts +++ b/packages/ui/src/components/SearchField/types.ts @@ -42,5 +42,5 @@ export interface SearchFieldProps /** * The icon to render in the input */ - collapsible?: boolean; + startCollapsed?: boolean; } diff --git a/packages/ui/src/utils/componentDefinitions.ts b/packages/ui/src/utils/componentDefinitions.ts index 61f1ff4c7c..de4d739552 100644 --- a/packages/ui/src/utils/componentDefinitions.ts +++ b/packages/ui/src/utils/componentDefinitions.ts @@ -203,7 +203,7 @@ export const componentDefinitions = { clear: 'bui-InputClear', }, dataAttributes: { - collapsible: [true, false] as const, + startCollapsed: [true, false] as const, }, }, Select: {