@servicetitan/anvil2 1.44.1 → 1.45.0

package/dist/components/Combobox/Combobox.d.ts

@@ -1,277 +1,5 @@
-import { ComboboxProps as CoreComboboxProps, ComboboxSelectProps as CoreComboboxSelectProps, ComboboxContentProps as CoreComboboxContentProps, ComboboxSearchFieldProps as CoreComboboxSearchFieldProps, ComboboxSelectTriggerProps as CoreComboboxSelectTriggerProps, ComboboxListProps as CoreComboboxListProps, ComboboxItemProps as CoreComboboxItemProps, ComboboxItemAddNewProps as CoreComboboxItemAddNewProps, ComboboxEmptyProps as CoreComboboxEmptyProps, IconProps as CoreIconProps, AvatarProps as CoreAvatarProps } from '@servicetitan/hammer-react';
-import { DataTrackingId } from '../../types/DataTrackingId';
-import { DistributiveOmit } from '../../types';
-/**
- * Props for the Combobox component
- * @property {Item[]} items - Array of items to display in the combobox
- * @property {(item: Item | null) => string} itemToString - Function to convert item to string
- * @property {(item: Item) => string | number} itemToKey - Function to get unique key for item
- * @property {Item | null} [selectedItem] - Currently selected item
- * @property {Item[] | null} [selectedItems] - Currently selected items for multiple selection
- * @property {boolean} [multiple] - Enable multiple selection mode
- * @property {boolean} [loading] - Show loading state
- * @property {Object} [filterOptions] - Options for filtering items
- * @property {boolean} [disableFilter] - Disable automatic filtering
- * @property {string} [groupBy] - Property to group items by
- * @property {(groupValue: any) => string} [groupToString] - Function to convert group value to string
- * @property {(a: any, b: any) => number} [groupSorter] - Function to sort groups
- * @extends DataTrackingId
- */
-export type ComboboxProps<Item> = CoreComboboxProps<Item>;
-/**
- * Props for the ComboboxSelect component
- * @property {Item[]} items - Array of items to display in the select
- * @property {(item: Item | null) => string} itemToString - Function to convert item to string
- * @property {(item: Item) => string | number} itemToKey - Function to get unique key for item
- * @property {Item | null} [selectedItem] - Currently selected item
- * @property {Item[] | null} [selectedItems] - Currently selected items for multiple selection
- * @property {boolean} [multiple] - Enable multiple selection mode
- * @property {boolean} [loading] - Show loading state
- * @property {string} [groupBy] - Property to group items by
- * @property {(groupValue: any) => string} [groupToString] - Function to convert group value to string
- * @extends DataTrackingId
- */
-export type ComboboxSelectProps<Item> = CoreComboboxSelectProps<Item>;
-/**
- * Props for the ComboboxContent component
- * @property {({ items: Item[], inputValue: string }) => ReactNode} children - Function that receives items and input value and renders content
- * @property {boolean} [disablePopover] - Whether to disable popover behavior and render inline
- */
-export type ComboboxContentProps<Item> = CoreComboboxContentProps<Item>;
-/**
- * Props for the ComboboxSearchField component
- * @property {string} label - Label for the search field
- * @property {string} [placeholder] - Placeholder text
- * @property {string} [description] - Helper text description
- * @property {string} [moreInfo] - Additional information text
- * @property {boolean} [required] - Mark field as required
- * @property {string | { icon: IconProps } | { avatar: AvatarProps }} [prefix] - Prefix content (string, icon, or avatar)
- * @property {(item: Item) => Partial<ChipProps>} [selectedItemProps] - Allows Combobox to display custom-colored Chips
- * @extends DataTrackingId
- */
-export type ComboboxSearchFieldProps = DistributiveOmit<CoreComboboxSearchFieldProps, "prefix"> & DataTrackingId & {
-    prefix?: string | {
-        icon: DistributiveOmit<CoreIconProps, "size">;
-    } | {
-        avatar: DistributiveOmit<CoreAvatarProps, "size">;
-    };
-};
-/**
- * Props for the ComboboxSelectTrigger component
- * @property {string} label - Label for the select trigger
- * @property {string} [placeholder] - Placeholder text
- * @property {string} [description] - Helper text description
- * @property {string} [moreInfo] - Additional information text
- * @property {boolean} [required] - Mark field as required
- * @property {string | { icon: IconProps } | { avatar: AvatarProps }} [prefix] - Prefix content (string, icon, or avatar)
- * @property {(item: Item) => Partial<ChipProps>} [selectedItemProps] - Allows Combobox to display custom-colored Chips
- * @extends DataTrackingId
- */
-export type ComboboxSelectTriggerProps = DistributiveOmit<CoreComboboxSelectTriggerProps, "prefix"> & DataTrackingId & {
-    prefix?: string | {
-        icon: DistributiveOmit<CoreIconProps, "size">;
-    } | {
-        avatar: DistributiveOmit<CoreAvatarProps, "size">;
-    };
-};
-/**
- * Props for the ComboboxList component
- * @property {ReactNode} children - List items to render
- */
-export type ComboboxListProps = CoreComboboxListProps;
-/**
- * Props for the ComboboxItem component
- * @property {Item} item - The item to render
- * @property {number} index - Index of the item in the list
- * @property {ReactNode} children - Content to render for the item
- * @property {boolean} [disabled] - Disable the item
- * @extends DataTrackingId
- */
-export type ComboboxItemProps<Item> = CoreComboboxItemProps<Item> & DataTrackingId;
-/**
- * Props for the ComboboxItemAddNew component
- * @property {(inputValue: string) => void} onSelection - Callback when "Add New" is selected
- * @property {ReactNode} children - Content to render for the "Add New" item
- * @property {boolean} [disabled] - Disable the "Add New" item
- * @extends DataTrackingId
- */
-export type ComboboxItemAddNewProps<Item> = CoreComboboxItemAddNewProps<Item> & DataTrackingId;
-/**
- * Props for the ComboboxEmpty component
- * @property {ReactNode} children - Content to render when no items are available
- */
-export type ComboboxEmptyProps = CoreComboboxEmptyProps;
-export declare const ComboboxElement: <Item = any>(props: ComboboxProps<Item>) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxSelect component for selecting items from a predefined list.
- *
- * Features:
- * - Single and multiple item selection from predefined options
- * - Dropdown-style selection interface
- * - Grouping support with custom group labels and sorting
- * - Loading states with spinner indicators
- * - Disabled and read-only states
- * - Customizable popover behavior and positioning
- * - Full accessibility support with ARIA attributes
- * - Keyboard navigation support
- * - Layout utility props for positioning and spacing
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.Select
- *   items={items}
- *   itemToString={(item) => item.name}
- *   onChange={setSelectedItem}
- * >
- *   <Combobox.SelectTrigger label="Select an item" />
- *   <Combobox.Content>
- *     {({ items }) => (
- *       <Combobox.List>
- *         {items.map((item, i) => (
- *           <Combobox.Item key={item.id} item={item} index={i}>
- *             {item.name}
- *           </Combobox.Item>
- *         ))}
- *       </Combobox.List>
- *     )}
- *   </Combobox.Content>
- * </Combobox.Select>
- */
-export declare const ComboboxSelect: <Item = any>(props: ComboboxSelectProps<Item>) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxContent component for rendering the content area of a combobox.
- *
- * Features:
- * - Supports both popover and inline rendering modes
- * - Provides render props pattern for flexible content rendering
- * - Handles grouped items with proper ARIA labels
- * - Integrates with combobox state management
- * - Supports custom styling and layout
- * - Manages focus and blur events for popover behavior
- *
- * @example
- * <Combobox.Content>
- *   {({ items }) => (
- *     <Combobox.List>
- *       {items.map((item, index) => (
- *         <Combobox.Item key={item.id} item={item} index={index}>
- *           {item.name}
- *         </Combobox.Item>
- *       ))}
- *     </Combobox.List>
- *   )}
- * </Combobox.Content>
- */
-export declare const ComboboxContent: <Item = any>(props: ComboboxContentProps<Item>) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxSearchField component for the search input field.
- *
- * Features:
- * - Search input with clear button functionality
- * - Supports multiple selection with chip display
- * - Handles keyboard navigation and accessibility
- * - Integrates with combobox state management
- * - Supports custom styling and layout
- * - Manages focus and blur events
- * - Enhanced prefix support for icons and avatars
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.SearchField
- *   label="Search users"
- *   placeholder="Type to search..."
- *   prefix={{ icon: { svg: SearchIcon } }}
- * />
- */
-export declare const ComboboxSearchField: ({ prefix: prefixProp, ...props }: ComboboxSearchFieldProps) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxSelectTrigger component for the select trigger field.
- *
- * Features:
- * - Select input with dropdown trigger
- * - Supports single selection display
- * - Handles keyboard navigation and accessibility
- * - Integrates with combobox state management
- * - Supports custom styling and layout
- * - Manages focus and blur events
- * - Enhanced prefix support for icons and avatars
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.SelectTrigger
- *   label="Select user"
- *   placeholder="Choose a user..."
- *   prefix={{ avatar: { name: "User" } }}
- * />
- */
-export declare const ComboboxSelectTrigger: ({ prefix: prefixProp, ...props }: ComboboxSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxList component for rendering the list of items.
- *
- * Features:
- * - Renders list of items with proper accessibility
- * - Supports both single and multiple selection modes
- * - Loading state with spinner
- * - Empty state handling
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.List>
- *   {items.map((item, i) => (
- *     <Combobox.Item key={item.id} item={item} index={i}>
- *       {item.name}
- *     </Combobox.Item>
- *   ))}
- * </Combobox.List>
- */
-export declare const ComboboxList: <Item = any>(props: ComboboxListProps) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxItem component for rendering individual items in the list.
- *
- * Features:
- * - Individual item rendering with proper accessibility
- * - Support for disabled state
- * - Custom content rendering
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.Item item={item} index={index}>
- *   <Flex direction="column">
- *     <Text>{item.name}</Text>
- *     <Text size="small" subdued>{item.description}</Text>
- *   </Flex>
- * </Combobox.Item>
- */
-export declare const ComboboxItem: <Item = any>(props: ComboboxItemProps<Item>) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxItemAddNew component for rendering an "Add New" option.
- *
- * Features:
- * - "Add New" option that appears when no exact match is found
- * - Customizable content rendering
- * - Callback when selected
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.ItemAddNew onSelection={(inputValue) => addNewItem(inputValue)}>
- *   Add "{inputValue}" as new item
- * </Combobox.ItemAddNew>
- */
-export declare const ComboboxItemAddNew: <Item = any>(props: ComboboxItemAddNewProps<Item>) => import("react/jsx-runtime").JSX.Element;
-/**
- * ComboboxEmpty component for rendering content when no items are available.
- *
- * Features:
- * - Renders content when list is empty
- * - Customizable empty state message
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Combobox.Empty>
- *   <Text>No items found. Try adjusting your search.</Text>
- * </Combobox.Empty>
- */
-export declare const ComboboxEmpty: <Item = any>(props: ComboboxEmptyProps) => import("react/jsx-runtime").JSX.Element;
+import { ComboboxProps } from './ComboboxTypes';
+export declare const ComboboxElement: <Item>(props: ComboboxProps<Item>) => import("react/jsx-runtime").JSX.Element;
 /**
  * Combobox component for selecting items with search and filtering capabilities.
  *
@@ -309,7 +37,7 @@ export declare const ComboboxEmpty: <Item = any>(props: ComboboxEmptyProps) => i
  *   </Combobox.Content>
  * </Combobox>
  */
-export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => import("react/jsx-runtime").JSX.Element) & {
+export declare const Combobox: (<Item>(props: ComboboxProps<Item>) => import("react/jsx-runtime").JSX.Element) & {
     /**
      * ComboboxSelect component for selecting items from a predefined list.
      *
@@ -345,7 +73,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   </Combobox.Content>
      * </Combobox.Select>
      */
-    Select: <Item = any>(props: ComboboxSelectProps<Item>) => import("react/jsx-runtime").JSX.Element;
+    Select: <Item>(props: import('./ComboboxTypes').ComboboxSelectProps<Item>) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxSearchField component for the search input field.
      *
@@ -366,7 +94,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   prefix={{ icon: { svg: SearchIcon } }}
      * />
      */
-    SearchField: ({ prefix: prefixProp, ...props }: ComboboxSearchFieldProps) => import("react/jsx-runtime").JSX.Element;
+    SearchField: ({ prefix: prefixProp, ...props }: import('./ComboboxTypes').ComboboxSearchFieldProps) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxSelectTrigger component for the select trigger field.
      *
@@ -387,7 +115,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   prefix={{ avatar: { name: "User" } }}
      * />
      */
-    SelectTrigger: ({ prefix: prefixProp, ...props }: ComboboxSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
+    SelectTrigger: ({ prefix: prefixProp, ...props }: import('./ComboboxTypes').ComboboxSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxContent component for rendering the content area of a combobox.
      *
@@ -412,7 +140,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   )}
      * </Combobox.Content>
      */
-    Content: <Item = any>(props: ComboboxContentProps<Item>) => import("react/jsx-runtime").JSX.Element;
+    Content: <Item = any>({ children, className, disablePopover, ...rest }: import('./ComboboxContent').ComboboxContentProps<Item>) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxList component for rendering the list of items.
      *
@@ -432,7 +160,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   ))}
      * </Combobox.List>
      */
-    List: <Item = any>(props: ComboboxListProps) => import("react/jsx-runtime").JSX.Element;
+    List: <Item = any>({ children, className, ...rest }: import('./ComboboxList').ComboboxListProps) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxItem component for rendering individual items in the list.
      *
@@ -450,7 +178,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   </Flex>
      * </Combobox.Item>
      */
-    Item: <Item = any>(props: ComboboxItemProps<Item>) => import("react/jsx-runtime").JSX.Element;
+    Item: <Item = any>(props: import('./ComboboxTypes').ComboboxItemProps<Item>) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxItemAddNew component for rendering an "Add New" option.
      *
@@ -465,7 +193,7 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   Add "{inputValue}" as new item
      * </Combobox.ItemAddNew>
      */
-    ItemAddNew: <Item = any>(props: ComboboxItemAddNewProps<Item>) => import("react/jsx-runtime").JSX.Element;
+    ItemAddNew: <Item = any>(props: import('./ComboboxTypes').ComboboxItemAddNewProps<Item>) => import("react/jsx-runtime").JSX.Element;
     /**
      * ComboboxEmpty component for rendering content when no items are available.
      *
@@ -479,5 +207,5 @@ export declare const Combobox: (<Item = any>(props: ComboboxProps<Item>) => impo
      *   <Text>No items found. Try adjusting your search.</Text>
      * </Combobox.Empty>
      */
-    Empty: <Item = any>(props: ComboboxEmptyProps) => import("react/jsx-runtime").JSX.Element;
+    Empty: <Item = any>({ children, }: import('./ComboboxEmpty').ComboboxEmptyProps) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/components/Combobox/ComboboxContent.d.ts

@@ -0,0 +1,59 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { UseComboboxProps as UseDownshiftComboboxProps, UseSelectProps as UseDownshiftSelectProps, UseComboboxReturnValue as UseDownshiftComboboxReturnValue, UseSelectReturnValue as UseDownshiftSelectReturnValue } from 'downshift';
+/**
+ * Props for the options passed to the children render function
+ */
+export type ComboboxContentOptionsProps<Item> = {
+    /** Props for the option including selection and disabled state */
+    optionProps: ReturnType<UseDownshiftComboboxReturnValue<Item>["getItemProps"]> & {
+        selected: boolean;
+        disabled: boolean;
+    };
+    /** The item to render */
+    item: Item;
+    /** The index of the item in the list */
+    index: number;
+};
+/**
+ * Props for the ComboboxContent component
+ */
+export type ComboboxContentProps<Item> = Omit<ComponentPropsWithoutRef<"div">, "children"> & {
+    /** Render function that receives combobox state and returns content */
+    children?: ({ items, inputValue, selectedItem, getMenuProps, getItemProps, }: Pick<UseDownshiftComboboxProps<Item> | UseDownshiftSelectProps<Item>, "items"> & Pick<UseDownshiftComboboxReturnValue<Item> | UseDownshiftSelectReturnValue<Item>, "getMenuProps" | "getItemProps" | "inputValue" | "selectedItem"> & {
+        listProps: ReturnType<UseDownshiftComboboxReturnValue<Item>["getMenuProps"] | UseDownshiftSelectReturnValue<Item>["getMenuProps"]> & {
+            style: any;
+        };
+        options: ComboboxContentOptionsProps<Item>[];
+    }) => ReactNode;
+    /** Whether to disable popover behavior and render inline */
+    disablePopover?: boolean;
+};
+/**
+ * ComboboxContent component for rendering the content area of a combobox
+ *
+ * Features:
+ * - Supports both popover and inline rendering modes
+ * - Provides render props pattern for flexible content rendering
+ * - Handles grouped items with proper ARIA labels
+ * - Integrates with combobox state management
+ * - Supports custom styling and layout
+ * - Manages focus and blur events for popover behavior
+ *
+ * @template Item - The type of items in the combobox
+ * @param props - The component props
+ * @returns A rendered combobox content area
+ *
+ * @example
+ * <Combobox.Content>
+ *   {({ items }) => (
+ *     <ul>
+ *       {items.map((item, index) => (
+ *         <li key={item.id}>
+ *           {item.name}
+ *         </li>
+ *       ))}
+ *     </ul>
+ *   )}
+ * </Combobox.Content>
+ */
+export declare const ComboboxContent: <Item = any>({ children, className, disablePopover, ...rest }: ComboboxContentProps<Item>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Combobox/ComboboxEmpty.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+/**
+ * Props for the ComboboxEmpty component
+ */
+export type ComboboxEmptyProps = {
+    children?: ReactNode;
+};
+/**
+ * ComboboxEmpty component for rendering content when no items are available
+ *
+ * Features:
+ * - Only renders children when the combobox has no items
+ * - Integrates with combobox state management
+ * - Supports popover and legacy fallback modes
+ * - Automatically manages empty state visibility
+ *
+ * @template Item - The type of items in the combobox
+ * @param props - The component props
+ * @returns The children when no items are available, or null
+ *
+ * @example
+ * <ComboboxEmpty>
+ *   <Text>No items found. Try a different search term.</Text>
+ * </ComboboxEmpty>
+ */
+export declare const ComboboxEmpty: <Item = any>({ children, }: ComboboxEmptyProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Combobox/ComboboxItem.d.ts

@@ -0,0 +1,34 @@
+import { ComboboxItemAddNewProps, ComboboxItemProps } from './ComboboxTypes';
+/**
+ * ComboboxItem component for rendering individual items in the list.
+ *
+ * Features:
+ * - Individual item rendering with proper accessibility
+ * - Support for disabled state
+ * - Custom content rendering
+ * - Automatic tracking ID generation for analytics
+ *
+ * @example
+ * <Combobox.Item item={item} index={index}>
+ *   <Flex direction="column">
+ *     <Text>{item.name}</Text>
+ *     <Text size="small" subdued>{item.description}</Text>
+ *   </Flex>
+ * </Combobox.Item>
+ */
+export declare const ComboboxItem: <Item = any>(props: ComboboxItemProps<Item>) => import("react/jsx-runtime").JSX.Element;
+/**
+ * ComboboxItemAddNew component for rendering an "Add New" option.
+ *
+ * Features:
+ * - "Add New" option that appears when no exact match is found
+ * - Customizable content rendering
+ * - Callback when selected
+ * - Automatic tracking ID generation for analytics
+ *
+ * @example
+ * <Combobox.ItemAddNew onSelection={(inputValue) => addNewItem(inputValue)}>
+ *   Add "{inputValue}" as new item
+ * </Combobox.ItemAddNew>
+ */
+export declare const ComboboxItemAddNew: <Item = any>(props: ComboboxItemAddNewProps<Item>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Combobox/ComboboxList.d.ts

@@ -0,0 +1,31 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+/**
+ * Props for the ComboboxList component
+ */
+export type ComboboxListProps = ComponentPropsWithoutRef<"ul" | "div"> & {
+    children?: ReactNode;
+};
+/**
+ * ComboboxList component for rendering the list container of combobox items
+ *
+ * Features:
+ * - Supports both single and multiple selection modes
+ * - Automatically handles empty state with "No match found" message
+ * - Shows loading spinner during async operations
+ * - Integrates with combobox state management
+ * - Supports popover and legacy fallback modes
+ *
+ * @template Item - The type of items in the combobox
+ * @param props - The component props
+ * @returns A rendered combobox list container
+ *
+ * @example
+ * <ComboboxList>
+ *   {items.map((item, index) => (
+ *     <ComboboxItem key={item.id} item={item} index={index}>
+ *       {item.name}
+ *     </ComboboxItem>
+ *   ))}
+ * </ComboboxList>
+ */
+export declare const ComboboxList: <Item = any>({ children, className, ...rest }: ComboboxListProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Combobox/ComboboxMockData.d.ts

@@ -0,0 +1,44 @@
+export type TeammateItem = string;
+export declare const teammates: string[];
+export type AirportItem = {
+    id: number;
+    name: string;
+    disabled?: boolean;
+};
+export declare const airports: ({
+    id: number;
+    name: string;
+    disabled?: undefined;
+} | {
+    id: number;
+    name: string;
+    disabled: boolean;
+})[];
+export declare const tenThousandRows: {
+    id: number;
+    name: string;
+}[];
+export type DummyItem = {
+    name: string;
+    language: string;
+    id: string;
+    bio: string;
+    version: number;
+};
+export declare const dummyJSON: {
+    name: string;
+    language: string;
+    id: string;
+    bio: string;
+    version: number;
+}[];
+export declare const groupedDummyJSON: {
+    name: string;
+    items: any[];
+}[];
+export declare const dummyJSONFakeAPI: ({ page, pageSize, searchTerm, ids, }: {
+    page: number;
+    pageSize: number;
+    searchTerm?: string;
+    ids?: string[];
+}) => Promise<DummyItem[]>;

package/dist/components/Combobox/ComboboxSelect.d.ts

@@ -0,0 +1,59 @@
+import { ComboboxSelectProps, SelectSingleProps } from './ComboboxTypes';
+/**
+ * NOTE: There is a lot of duplicated code here! Here's a list of the /actual/
+ *       differences between select-only and regular combobox to help with
+ *       refactoring this later!
+ *
+ *       1) Using Downshift's `useSelect` hook instead of `useCombobox`
+ *          - Swapping out the stateChangeTypes for their equivalents
+ *       2) Since there's no input, we don't need to passthrough `getInputProps`
+ *       3) Since we don't do any sorting or filtering, we can remove:
+ *          - onInputValueChange function and prop
+ *            - setInputValue function
+ *          - onIsOpenChange function
+ *          - filterOptions prop
+ *          - internal `items` state and useEffect to keep it in sync
+ *            - useEffect to track first render
+ *       4) Multiple-specific
+ *          - Remove `disableClearInputValueOnSelectItem` prop
+ *          - No need to store `setInputValue` function
+ *          - Remove all state reducer references to `inputValue`
+ *          - Remove `onStateChange` function from `useMultipleSelection`
+ */
+export declare const SelectSingle: <Item>(props: SelectSingleProps<Item>) => import("react/jsx-runtime").JSX.Element;
+/**
+ * ComboboxSelect component for selecting items from a predefined list.
+ *
+ * Features:
+ * - Single and multiple item selection from predefined options
+ * - Dropdown-style selection interface
+ * - Grouping support with custom group labels and sorting
+ * - Loading states with spinner indicators
+ * - Disabled and read-only states
+ * - Customizable popover behavior and positioning
+ * - Full accessibility support with ARIA attributes
+ * - Keyboard navigation support
+ * - Layout utility props for positioning and spacing
+ * - Automatic tracking ID generation for analytics
+ *
+ * @example
+ * <Combobox.Select
+ *   items={items}
+ *   itemToString={(item) => item.name}
+ *   onChange={setSelectedItem}
+ * >
+ *   <Combobox.SelectTrigger label="Select an item" />
+ *   <Combobox.Content>
+ *     {({ items }) => (
+ *       <Combobox.List>
+ *         {items.map((item, i) => (
+ *           <Combobox.Item key={item.id} item={item} index={i}>
+ *             {item.name}
+ *           </Combobox.Item>
+ *         ))}
+ *       </Combobox.List>
+ *     )}
+ *   </Combobox.Content>
+ * </Combobox.Select>
+ */
+export declare const ComboboxSelect: <Item>(props: ComboboxSelectProps<Item>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Combobox/ComboboxTrigger.d.ts

@@ -0,0 +1,43 @@
+import { ComboboxSearchFieldProps, ComboboxSelectTriggerProps } from './ComboboxTypes';
+/**
+ * ComboboxSearchField component for the search input field.
+ *
+ * Features:
+ * - Search input with clear button functionality
+ * - Supports multiple selection with chip display
+ * - Handles keyboard navigation and accessibility
+ * - Integrates with combobox state management
+ * - Supports custom styling and layout
+ * - Manages focus and blur events
+ * - Enhanced prefix support for icons and avatars
+ * - Automatic tracking ID generation for analytics
+ *
+ * @example
+ * <Combobox.SearchField
+ *   label="Search users"
+ *   placeholder="Type to search..."
+ *   prefix={{ icon: { svg: SearchIcon } }}
+ * />
+ */
+export declare const ComboboxSearchField: ({ prefix: prefixProp, ...props }: ComboboxSearchFieldProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * ComboboxSelectTrigger component for the select trigger field.
+ *
+ * Features:
+ * - Select input with dropdown trigger
+ * - Supports single selection display
+ * - Handles keyboard navigation and accessibility
+ * - Integrates with combobox state management
+ * - Supports custom styling and layout
+ * - Manages focus and blur events
+ * - Enhanced prefix support for icons and avatars
+ * - Automatic tracking ID generation for analytics
+ *
+ * @example
+ * <Combobox.SelectTrigger
+ *   label="Select user"
+ *   placeholder="Choose a user..."
+ *   prefix={{ avatar: { name: "User" } }}
+ * />
+ */
+export declare const ComboboxSelectTrigger: ({ prefix: prefixProp, ...props }: ComboboxSelectTriggerProps) => import("react/jsx-runtime").JSX.Element;