@bloomreach/react-banana-ui 1.11.0 → 1.13.0

package/dist/components/foundations/icon/icon.stories.d.ts

@@ -14,3 +14,4 @@ export declare const CustomIcon: Story;
  */
 export declare const Refs: Story;
 export declare const All: Story;
+export declare const Showcase: Story;

package/dist/components/inputs/autocomplete/autocomplete.d.ts

@@ -0,0 +1,23 @@
+import type { AutocompleteComponentType } from './autocomplete.types';
+import './autocomplete.scss';
+/**
+ * Autocomplete allows a user to search for value(s) to select from a list.
+ *
+ * ### Usage
+ *
+ * ```tsx
+ * import { Autocomplete } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyAutocomplete() {
+ *   return (
+ *     <Autocomplete
+ *       options={['Banana', 'Apple', 'Orange', 'Pineapple', 'Strawberry', 'Grape', 'Watermelon']}
+ *       placeholder="Select a fruit"
+ *       onChange={(_, newValue) => console.log(newValue)}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+declare const _default: AutocompleteComponentType;
+export default _default;

package/dist/components/inputs/autocomplete/autocomplete.qa.stories.d.ts

@@ -0,0 +1,19 @@
+import { Meta } from '@storybook/react';
+import { ControlledMultipleValue as ControlledMultipleValueStory, ControlledSingleValue as ControlledSingleValueStory, CustomOptionLabel as CustomOptionLabelStory, HideSelectedOptions as HideSelectedOptionsStory, Multiple as MultipleStory, type Story } from './autocomplete.stories';
+import Autocomplete from './autocomplete';
+declare const meta: Meta<typeof Autocomplete>;
+export default meta;
+export declare const Basic: Story;
+export declare const DifferentStates: Story;
+export declare const Single: Story;
+export declare const ControlledSingleValue: typeof ControlledSingleValueStory;
+export declare const Multiple: typeof MultipleStory;
+export declare const ControlledMultipleValue: typeof ControlledMultipleValueStory;
+export declare const HideSelectedOptions: typeof HideSelectedOptionsStory;
+export declare const GroupedOptions: Story<{
+    group: string;
+    label: string;
+}>;
+export declare const DisabledOptions: Story;
+export declare const CustomOptionLabel: typeof CustomOptionLabelStory;
+export declare const Loading: Story;

package/dist/components/inputs/autocomplete/autocomplete.stories.d.ts

@@ -0,0 +1,26 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Autocomplete from './autocomplete';
+declare const meta: Meta<typeof Autocomplete>;
+export default meta;
+export type Story<Value extends NonNullable<unknown> = string, Multiple extends boolean = false> = StoryObj<typeof Autocomplete<Value, Multiple>>;
+declare const fruits: string[];
+export declare const Basic: Story;
+export declare const DefaultValue: Story;
+export declare const ControlledSingleValue: Story;
+export declare const Multiple: Story<typeof fruits[0], true>;
+export declare const DefaultValueMultiple: Story<typeof fruits[0], true>;
+export declare const ControlledMultipleValue: Story<typeof fruits[0], true>;
+export declare const HideSelectedOptions: Story<string, true>;
+export declare const GroupedOptions: Story<{
+    label: string;
+    firstLetter: string;
+}>;
+export declare const DisabledOptions: Story<{
+    label: string;
+    id: number;
+}>;
+export declare const CustomOptionLabel: Story<{
+    fruitName: string;
+}>;
+export declare const NoOptionsText: Story<string>;
+export declare const Loading: Story;

package/dist/components/inputs/autocomplete/autocomplete.types.d.ts

@@ -0,0 +1,114 @@
+import type { AutocompleteGroupedOption as MuiBaseAutocompleteGroupedOption } from '@mui/base';
+import { ForwardedRef, ReactElement, ReactNode, SyntheticEvent } from 'react';
+export type AutocompleteValue<Value, Multiple> = Multiple extends true ? Value[] : Value | null;
+export interface AutocompleteProps<AutocompleteOption extends NonNullable<unknown>, Multiple extends boolean> {
+    /**
+     * Custom class name for the container of the component.
+     */
+    className?: string;
+    /**
+     * Clear the selected value when clicking the clear icon.
+     * @default false
+     */
+    clearable?: boolean;
+    /**
+     * If `true`, the popup closes after a selection is made.
+     * It is `false` by default when `multiple` is `true`.
+     */
+    closeOnSelect?: boolean;
+    /**
+     * The default selected value. Use when the component is not controlled.
+     * The value must be an array when `multiple` is `true`.
+     */
+    defaultValue?: AutocompleteValue<AutocompleteOption, Multiple>;
+    /**
+     * If `true`, the component is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Used to determine if an option is disabled.
+     */
+    getOptionDisabled?: (option: AutocompleteOption) => boolean;
+    /**
+     * Used to determine the string value for a given option.
+     * @default (option) => option
+     */
+    getOptionLabel?: (option: AutocompleteOption) => string;
+    /**
+     * If provided, the options will be grouped under the returned string.
+     * The groupBy value is also used as the text for group headings
+     */
+    groupBy?: (option: AutocompleteOption) => string;
+    /**
+     * If `true`, the selected options are not displayed.
+     * @default false
+     */
+    hideSelectedOptions?: boolean;
+    /**
+     * If `true`, the component is in a loading state.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * The text to display when the component is in a loading state.
+     * @default "Loading..."
+     */
+    loadingText?: string;
+    /**
+     * If `true`, the component allows multiple selections.
+     * @default false
+     */
+    multiple?: Multiple;
+    /**
+     * Text to display when there are no options.
+     * @default "No options"
+     */
+    noOptionsText?: string;
+    /**
+     * Callback fired when the value changes.
+     */
+    onChange?: (event: SyntheticEvent, value: AutocompleteValue<AutocompleteOption, Multiple>) => void;
+    /**
+     * Callback fired when the popup closes.
+     */
+    onClose?: () => void;
+    /**
+     * Callback fired when the popup opens.
+     */
+    onOpen?: () => void;
+    /**
+     * Array ot options to display.
+     */
+    options: AutocompleteOption[];
+    /**
+     * The input placeholder.
+     */
+    placeholder?: string;
+    /**
+     * If `true`, the autocomplete is readonly.
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the autocomplete is required.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * The selected value.
+     * Set to `null` in case of single select and `[]` in case of multiple select to clear the selection.
+     * If the value is an object it must have reference equality with the option in order to be selected.
+     */
+    value?: AutocompleteValue<AutocompleteOption, Multiple>;
+}
+export interface AutocompleteGroupedOption<AutocompleteOption extends NonNullable<unknown>> extends MuiBaseAutocompleteGroupedOption<AutocompleteOption> {
+}
+export interface AutocompleteRenderGroupParams extends AutocompleteGroupedOption<object> {
+    children: ReactNode;
+}
+export interface AutocompleteComponentType {
+    <AutocompleteOption extends NonNullable<unknown>, Multiple extends boolean = false>(props: AutocompleteProps<AutocompleteOption, Multiple> & {
+        ref?: ForwardedRef<HTMLElement>;
+    }): ReactElement | null;
+    displayName?: string | undefined;
+}

package/dist/components/inputs/autocomplete/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Autocomplete } from './autocomplete';
+export type { AutocompleteProps } from './autocomplete.types';

package/dist/components/inputs/base-input/base-input.types.d.ts

@@ -1,10 +1,5 @@
-import { ChangeEventHandler, FocusEventHandler, ForwardedRef, InputHTMLAttributes, ReactNode } from 'react';
+import { ChangeEventHandler, FocusEventHandler, ForwardedRef, InputHTMLAttributes, ReactNode, Ref, RefCallback } from 'react';
 export interface BaseInputProps {
-    /**
-     * Automatically adjusts textarea height to match the length of the content within.
-     * When `multiline` is `false`, this prop is ignored.
-     */
-    autoSize?: boolean;
     /**
      * Custom class name for the container of this component.
      */
@@ -39,7 +34,7 @@ export interface BaseInputProps {
     /**
      * The ref to the `input` or `textarea` element.
      */
-    inputRef?: ForwardedRef<HTMLInputElement> | ForwardedRef<HTMLTextAreaElement>;
+    inputRef?: ForwardedRef<HTMLInputElement | HTMLTextAreaElement> | Ref<HTMLInputElement | HTMLTextAreaElement>;
     /**
      * Icon or any element displayed at the end of the `input` or `textarea`.
      */
@@ -54,10 +49,6 @@ export interface BaseInputProps {
      * Works only when `multiline` is `true`.
      */
     minRows?: number;
-    /**
-     * If `true`, a `textarea` element is rendered.
-    */
-    multiline?: boolean;
     /**
      * The `name` attribute of the `input` or `textarea` element.
      */
@@ -90,6 +81,11 @@ export interface BaseInputProps {
      * If `true`, the `input` or `textarea` will be required.
      */
     required?: boolean;
+    /**
+     * Custom render function for the `input` or `textarea` element.
+     * Use this to render a custom `input` or `textarea` element.
+     */
+    renderInput?: (props: InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>, ref: RefCallback<HTMLInputElement | HTMLTextAreaElement> | null) => JSX.Element;
     /**
      * Icon or any element displayed at the start of the `input` or `textarea`.
      */

package/dist/components/inputs/index.d.ts

@@ -1,6 +1,10 @@
-export * from './checkbox';
+export * from './autocomplete';
 export * from './checkbox-field';
+export * from './checkbox';
 export * from './input-field';
+export * from './radio';
+export * from './radio-field';
+export * from './radio-group';
 export * from './select-field';
 export * from './select-option';
 export * from './text-field';

package/dist/components/inputs/radio/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Radio } from './radio';
+export type { RadioProps } from './radio.types';

package/dist/components/inputs/radio/radio.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import type { RadioProps } from './radio.types';
+import './radio.scss';
+/**
+ * Radio buttons are used to pick an option when only one option can be chosen.
+ * A single radio button can be used representing a singular option,
+ * for the purpose of selecting an element between a group of options.
+ *
+ * ### Usage
+ *
+ * ```tsx
+ * import { useState } from 'react';
+ * import { Radio } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyRadioComponent() {
+ *   const [checked, setChecked] = useState(false);
+ *   return (
+ *     <Radio
+ *       checked={checked}
+ *       onChange={(event) => setChecked(event.target.checked)}
+ *    />
+ *   );
+ * }
+ * ```
+ */
+declare const Radio: import("react").ForwardRefExoticComponent<RadioProps & import("react").RefAttributes<HTMLInputElement>>;
+export default Radio;

package/dist/components/inputs/radio/radio.qa.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta } from '@storybook/react';
+import { type Story } from './radio.stories';
+declare const meta: Meta;
+export default meta;
+export declare const SelectedUncontrolled: Story;
+export declare const SelectedControlled: Story;
+export declare const Unselected: Story;
+export declare const RadiosWithSameName: Story;
+export declare const CombinedStories: Story;

package/dist/components/inputs/radio/radio.stories.d.ts

@@ -0,0 +1,10 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Radio from './radio';
+declare const meta: Meta<typeof Radio>;
+export default meta;
+export type Story = StoryObj<typeof Radio>;
+export declare const Basic: Story;
+export declare const Controlled: Story;
+export declare const Disabled: Story;
+export declare const ReadOnly: Story;
+export declare const RadiosWithSameNameAttribute: Story;

package/dist/components/inputs/radio/radio.types.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+export interface RadioProps {
+    /**
+     * If `true`, the radio button is checked.
+     */
+    checked?: boolean;
+    /**
+     * Custom class name for the container of the component.
+     */
+    className?: string;
+    /**
+     * The state of the radio button when it is initially rendered. Use when you do not need to control its state.
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * When `true`, prevents the user from interacting with the radio.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The props applied to the input element.
+     */
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    /**
+     * The name of the input element.
+     */
+    name?: string;
+    /**
+     * Callback fired when the radio button is clicked
+     */
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    /**
+     * If `true`, the component is read only and prevent user to change state.
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the radio element is required.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * The value of the radio element.
+     */
+    value?: string;
+}

package/dist/components/inputs/radio-field/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RadioField } from './radio-field';
+export type { RadioFieldProps } from './radio-field.types';

package/dist/components/inputs/radio-field/radio-field.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import type { RadioFieldProps } from './radio-field.types';
+/**
+ * Radio fields are used to pick an option when only one option can be chosen.
+ * A single Radio field can be used representing a singular option,
+ * for the purpose of selecting an element between a group of options.
+ *
+ * ### Usage
+ *
+ * ```tsx
+ * import { useState } from 'react';
+ * import { RadioField } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyRadioFieldComponent() {
+ *   const [checked, setChecked] = useState(false);
+ *
+ *   return (
+ *     <RadioField
+ *       checked={checked}
+ *       label="Radio button field with a label"
+ *       onChange={(event) => setChecked(event.target.checked)}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+declare const RadioField: import("react").ForwardRefExoticComponent<RadioFieldProps & import("react").RefAttributes<HTMLInputElement>>;
+export default RadioField;

package/dist/components/inputs/radio-field/radio-field.qa.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta } from '@storybook/react';
+import { type Story } from './radio-field.stories';
+declare const meta: Meta;
+export default meta;
+export declare const WithLabelAndTooltip: Story;
+export declare const Uncontrolled: Story;
+export declare const Controlled: Story;
+export declare const RadioFieldsWithSameNameAttribute: Story;

package/dist/components/inputs/radio-field/radio-field.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/react';
+import RadioField from './radio-field';
+declare const meta: Meta<typeof RadioField>;
+export default meta;
+export type Story = StoryObj<typeof RadioField>;
+export declare const Basic: Story;
+export declare const WithLabelAndTooltip: Story;
+export declare const Controlled: Story;
+export declare const Disabled: Story;
+export declare const ReadOnly: Story;
+export declare const RadioFieldsWithSameNameAttribute: Story;

package/dist/components/inputs/radio-field/radio-field.types.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import type { RadioProps } from '../radio';
+export interface RadioFieldProps extends RadioProps {
+    /**
+     * The label to display with the radio field.
+     */
+    label?: ReactNode;
+    /**
+     * Tooltip to display when the field has info icon.
+     */
+    tooltip?: ReactNode;
+}

package/dist/components/inputs/radio-group/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RadioGroup } from './radio-group';
+export type { RadioGroupProps } from './radio-group.types';

package/dist/components/inputs/radio-group/radio-group-context.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+export type RadioGroupContextType = {
+    /**
+     * If `true`, all the radio buttons within the group will be disabled, preventing user interaction.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The common name for all radio buttons within the group.
+     * This is used to group the radio buttons together semantically in the DOM.
+     */
+    name?: string;
+    /**
+     * This is a callback function that is fired when the state of any radio button within the group is changed.
+     * The event object of the radio button that triggered the change is passed as an argument.
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * If `true`, all the radio buttons within the group will be read-only,
+     * preventing the user from changing the value but allowing them to interact with the component.
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the user must select one of the radio buttons within the group before submitting a form.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * The current value of the radio group. This is usually the value of the selected radio button within the group.
+     */
+    value: string | null;
+};
+export declare const RadioGroupContext: React.Context<RadioGroupContextType | undefined>;

package/dist/components/inputs/radio-group/radio-group.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import type { RadioGroupProps } from './radio-group.types';
+import './radio-group.scss';
+/**
+ *
+ * RadioGroup is a component that groups Radio components together,
+ * ensuring that only one Radio within the group can be selected at a time.
+ * It is used when there is a list of two or more options that are mutually
+ * exclusive and the user must select exactly one choice
+ *
+ * ### Usage
+ *
+ * ```tsx
+ * import { RadioGroup } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyRadioFieldGroupComponent() {
+ *  return (
+ *  <RadioGroup label="Pick your favourite fruit">
+ *      <RadioField label="Mango" value="mango" />
+ *      <RadioField label="Banana" value="banana" />
+ *      <RadioField label="Orange" value="orange" />
+ *  </RadioGroup>
+ * ```
+ *OR
+ *
+ * ### Usage
+ *
+ * ```tsx
+ * import { RadioGroup } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyRadioGroupComponent() {
+ *  return (
+ *  <RadioGroup label="Radio Group" name="Radio group name">
+ *      <Radio value="option1" />
+ *      <Radio value="option2" />
+ *      <Radio value="option3" />
+ *  </RadioGroup>
+ * ```
+ */
+declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLInputElement>>;
+export default RadioGroup;

package/dist/components/inputs/radio-group/radio-group.qa.stories.d.ts

@@ -0,0 +1,10 @@
+import { Args, Meta } from '@storybook/react';
+import { type Story } from './radio-group.stories';
+import { RadioGroupProps } from './radio-group.types';
+type StoryArgs = Args & RadioGroupProps;
+declare const meta: Meta<StoryArgs>;
+export default meta;
+export declare const Uncontrolled: Story;
+export declare const Controlled: Story;
+export declare const MixedDisabledAndReadOnlyState: Story;
+export declare const CombinedStories: Story;

package/dist/components/inputs/radio-group/radio-group.stories.d.ts

@@ -0,0 +1,14 @@
+import { Meta, StoryObj } from '@storybook/react';
+import RadioGroup from './radio-group';
+declare const meta: Meta<typeof RadioGroup>;
+export default meta;
+export type Story = StoryObj<typeof RadioGroup>;
+export declare const UncontrolledWithRadioFields: Story;
+export declare const ControlledWithRadioFields: Story;
+export declare const UncontrolledWithRadios: Story;
+export declare const ControlledWithRadios: Story;
+export declare const MixedWithRadioFieldsAndRadios: Story;
+export declare const AllDisabled: Story;
+export declare const AllReadOnly: Story;
+export declare const MixedDisabledAndReadOnly: Story;
+export declare const SingleRadioFieldInGroup: Story;

package/dist/components/inputs/radio-group/radio-group.types.d.ts

@@ -0,0 +1,57 @@
+import React, { ReactElement } from 'react';
+export interface RadioGroupProps {
+    /**
+     * The child elements of the component. These are usually `Radio` or 'RadioField' components.
+     */
+    children: ReactElement | ReactElement[];
+    /**
+     * Custom class name for the container of the component. This can be used to apply custom styles.
+     */
+    className?: string;
+    /**
+     * The default value of the selected radio field in an uncontrolled component.
+     * This is the value that the radio group starts with.
+     */
+    defaultValue?: string;
+    /**
+     * If `true`, all the radio buttons within the group will be disabled, preventing user interaction.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * The label for the radio group. This is usually displayed above the radio buttons.
+     */
+    label?: string;
+    /**
+     * The common name for all radio buttons within the group.
+     * This is used to group the radio buttons together semantically in the DOM.
+     * If not provided, a unique name will be generated for the group.
+     */
+    name?: string;
+    /**
+     * This is a callback function that is fired when the state of any radio button within the group is changed.
+     * The change event object of the radio button that triggered the change is passed as an argument.
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * The component orientation of the radio buttons within the group.
+     * @default 'vertical'
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * If `true`, all the radio buttons within the group will be read-only,
+     * preventing the user from changing the value but allowing them to interact with the component.
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the user must select one of the radio buttons within the group.
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * The value of the selected radio field in a controlled component.
+     * This is the value that the radio group starts with.
+     */
+    value?: string;
+}

package/dist/components/inputs/select-option/select-option.d.ts

@@ -1,4 +1,3 @@
 import type { SelectOptionComponentType } from './select-option.types';
-import './select-option.scss';
 declare const _default: SelectOptionComponentType;
 export default _default;

package/dist/components/lists/internal.d.ts

@@ -1,2 +1,4 @@
+export * from './listbox-group-label';
+export * from './listbox-group';
 export * from './listbox-item';
 export * from './listbox';

package/dist/components/lists/listbox-group/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ListboxGroup } from './listbox-group';
+export type { ListboxGroupProps } from './listbox-group.types';

package/dist/components/lists/listbox-group/listbox-group.d.ts

@@ -0,0 +1,33 @@
+/// <reference types="react" />
+import type { ListboxGroupProps } from './listbox-group.types';
+import './listbox-group.scss';
+/**
+ * @internal
+ * The `ListboxGroup` component is used to display a list of grouped items aligned with design system styles.
+ * Use the `ListboxItem` component to define the items of the list and `ListboxGroupLabel` to define the group label.
+ *
+ * ### Usage
+ *
+ * import { Listbox, ListboxItem, ListboxGroup, ListboxGroupLabel } from '@bloomreach/react-banana-ui';
+ *
+ * export default function MyList() {
+ *   return (
+ *      <Listbox>
+ *        <ListboxGroup>
+ *          <ListboxGroupLabel>Group one</ListboxGroupLabel>
+ *          <ListboxItem>Item 1</ListboxItem>
+ *          <ListboxItem>Item 2</ListboxItem>
+ *          <ListboxItem>Item 3</ListboxItem>
+ *        </ListboxGroup>
+ *        <ListboxGroup>
+ *          <ListboxGroupLabel>Group two</ListboxGroupLabel>
+ *          <ListboxItem>Item 1</ListboxItem>
+ *          <ListboxItem>Item 2</ListboxItem>
+ *          <ListboxItem>Item 3</ListboxItem>
+ *        </ListboxGroup>
+ *      </Listbox>
+ *   );
+ * }
+ */
+declare const ListboxGroup: import("react").ForwardRefExoticComponent<ListboxGroupProps & import("react").RefAttributes<HTMLUListElement>>;
+export default ListboxGroup;

package/dist/components/lists/listbox-group/listbox-group.types.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export interface ListboxGroupProps {
+    /**
+     * Custom class name for the container of the component.
+     */
+    className?: string;
+    /**
+     * The content of the component.
+     */
+    children?: ReactNode;
+}

package/dist/components/lists/listbox-group-label/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ListboxGroupLabel } from './listbox-group-label';
+export type { ListboxGroupLabelProps } from './listbox-group-label.types';