@wallarm-org/design-system 1.28.2-rc-fix-table-window-scroll-root.1 → 1.29.0

package/dist/components/Select/SelectGroupLabel.d.ts

@@ -1,5 +1,8 @@
-import type { FC } from 'react';
+import type { FC, Ref } from 'react';
 import { Select as ArkUiSelect } from '@ark-ui/react/select';
-type SelectGroupLabelProps = ArkUiSelect.ItemGroupLabelProps;
+import { type TestableProps } from '../../utils/testId';
+type SelectGroupLabelProps = ArkUiSelect.ItemGroupLabelProps & TestableProps & {
+    ref?: Ref<HTMLDivElement>;
+};
 export declare const SelectGroupLabel: FC<SelectGroupLabelProps>;
 export {};

package/dist/components/Select/SelectGroupLabel.js

@@ -3,8 +3,8 @@ import { Select } from "@ark-ui/react/select";
 import { cn } from "../../utils/cn.js";
 import { useTestId } from "../../utils/testId.js";
 import { dropdownMenuLabelVariants } from "../DropdownMenu/index.js";
-const SelectGroupLabel = (props)=>{
-    const testId = useTestId('group-label');
+const SelectGroupLabel = ({ 'data-testid': testIdProp, ...props })=>{
+    const testId = useTestId('group-label', testIdProp);
     return /*#__PURE__*/ jsx(Select.ItemGroupLabel, {
         ...props,
         "data-testid": testId,

package/dist/components/Select/SelectOption.js

@@ -12,7 +12,7 @@ const SelectOption = ({ variant = 'default', 'data-testid': testIdProp, ...props
         className: cn(dropdownMenuItemVariants({
             variant,
             inset: false
-        }), 'flex-wrap relative gap-y-0 gap-x-8 pr-32', 'data-[state=checked]:bg-states-primary-active', 'data-highlighted:bg-states-primary-hover')
+        }), 'flex-wrap relative gap-y-0 gap-x-8 pr-32', 'has-[>[data-slot=select-option-hint]]:flex-nowrap', 'data-[state=checked]:bg-states-primary-active', 'data-highlighted:bg-states-primary-hover')
     });
 };
 SelectOption.displayName = 'SelectOption';

package/dist/components/Select/SelectOptionHint.d.ts

@@ -0,0 +1,11 @@
+import type { FC, HTMLAttributes, Ref } from 'react';
+import { type TestableProps } from '../../utils/testId';
+export interface SelectOptionHintProps extends HTMLAttributes<HTMLSpanElement>, TestableProps {
+    ref?: Ref<HTMLSpanElement>;
+}
+/**
+ * Secondary text at the right end of an option, such as a count. It sits before the indicator
+ * rather than under it: the option stops wrapping while a hint is present, so the label wraps
+ * inside its own box and the hint keeps its place on the first line.
+ */
+export declare const SelectOptionHint: FC<SelectOptionHintProps>;

package/dist/components/Select/SelectOptionHint.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../utils/cn.js";
+import { useTestId } from "../../utils/testId.js";
+const SelectOptionHint = ({ ref, className, 'data-testid': testIdProp, ...props })=>{
+    const testId = useTestId('option-hint', testIdProp);
+    return /*#__PURE__*/ jsx("span", {
+        ...props,
+        ref: ref,
+        "data-slot": "select-option-hint",
+        "data-testid": testId,
+        className: cn('ml-auto shrink-0 self-start font-sans text-sm text-text-secondary tabular-nums', className)
+    });
+};
+SelectOptionHint.displayName = 'SelectOptionHint';
+export { SelectOptionHint };

package/dist/components/Select/SelectPositioner.d.ts

@@ -1,5 +1,15 @@
-import type { FC } from 'react';
+import type { FC, Ref } from 'react';
 import { Select as ArkUiSelect } from '@ark-ui/react/select';
-type SelectPositionerProps = ArkUiSelect.PositionerProps;
+export interface SelectPositionerProps extends ArkUiSelect.PositionerProps {
+    /**
+     * Props for the content element (the `listbox` panel inside the positioner) — for a ref, an
+     * inline measurement such as a locked width, or `data-*` attributes. `className` on the
+     * positioner itself already lands on the content, and overrides its default sizes
+     * (`min-w-240 max-w-320 max-h-(--available-height)`) through tailwind-merge.
+     */
+    contentProps?: Omit<ArkUiSelect.ContentProps, 'className' | 'children' | 'asChild'> & {
+        ref?: Ref<HTMLDivElement>;
+        [dataAttribute: `data-${string}`]: string | undefined;
+    };
+}
 export declare const SelectPositioner: FC<SelectPositionerProps>;
-export {};

package/dist/components/Select/SelectPositioner.js

@@ -3,11 +3,12 @@ import { Portal } from "@ark-ui/react/portal";
 import { Select } from "@ark-ui/react/select";
 import { cn } from "../../utils/cn.js";
 import { dropdownMenuClassNames } from "../DropdownMenu/index.js";
-const SelectPositioner = ({ className, children, ...props })=>/*#__PURE__*/ jsx(Portal, {
+const SelectPositioner = ({ className, children, contentProps, ...props })=>/*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(Select.Positioner, {
             ...props,
             className: "outline-none",
             children: /*#__PURE__*/ jsx(Select.Content, {
+                ...contentProps,
                 className: cn(dropdownMenuClassNames, 'flex flex-col', 'h-full', 'min-w-240', 'max-w-320', 'max-h-(--available-height)', 'p-0', 'origin-[--transform-origin]', className),
                 children: children
             })

package/dist/components/Select/SelectSearchInput.d.ts

@@ -1,7 +1,10 @@
-import type { FC, HTMLAttributes } from 'react';
+import type { FC, InputHTMLAttributes, Ref } from 'react';
 import { type TestableProps } from '../../utils/testId';
-export interface SelectSearchInputProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'onChange' | 'color'>, TestableProps {
+export interface SelectSearchInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'children' | 'onChange' | 'color' | 'size' | 'type' | 'value'>, TestableProps {
     value: string;
     onChange: (value: string) => void;
+    /** Called when the built-in clear button empties the field, before `onChange('')`. */
+    onClear?: () => void;
+    ref?: Ref<HTMLInputElement>;
 }
 export declare const SelectSearchInput: FC<SelectSearchInputProps>;

package/dist/components/Select/SelectSearchInput.js

@@ -1,12 +1,22 @@
 import { jsx } from "react/jsx-runtime";
 import { useTestId } from "../../utils/testId.js";
 import { SearchInput } from "../SearchInput/index.js";
-const SelectSearchInput = ({ value, onChange, 'data-testid': testIdProp, ...rest })=>{
+const INPUT_OWNED_KEYS = new Set([
+    ' ',
+    'Home',
+    'End'
+]);
+const SelectSearchInput = ({ value, onChange, onKeyDown, 'data-testid': testIdProp, ...rest })=>{
     const testId = useTestId('search-input', testIdProp);
+    const handleKeyDown = (event)=>{
+        onKeyDown?.(event);
+        if (INPUT_OWNED_KEYS.has(event.key)) event.stopPropagation();
+    };
     return /*#__PURE__*/ jsx(SearchInput, {
         ...rest,
         value: value,
         onChange: onChange,
+        onKeyDown: handleKeyDown,
         "data-testid": testId
     });
 };

package/dist/components/Select/classes.d.ts

@@ -0,0 +1,3 @@
+export declare const selectFooterVariants: (props?: ({
+    variant?: "actions" | "default" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/components/Select/classes.js

@@ -0,0 +1,13 @@
+import { cva } from "class-variance-authority";
+const selectFooterVariants = cva('shrink-0 border-t', {
+    variants: {
+        variant: {
+            default: 'bg-component-outline-button-bg py-8 px-16 border-border-primary',
+            actions: 'flex items-center justify-end gap-8 p-8 border-border-primary-light'
+        }
+    },
+    defaultVariants: {
+        variant: 'default'
+    }
+});
+export { selectFooterVariants };

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

@@ -1,20 +1,22 @@
 export { createListCollection } from '@ark-ui/react/collection';
+export { selectFooterVariants } from './classes';
 export { Select } from './Select';
 export { SelectButton } from './SelectButton';
 export { SelectButtonTag, SelectButtonTagValue } from './SelectButtonTag';
 export { SelectClearTrigger } from './SelectClearTrigger';
 export { SelectContent } from './SelectContent';
 export { SelectEmptyState, type SelectEmptyStateProps } from './SelectEmptyState';
-export { SelectFooter } from './SelectFooter';
+export { SelectFooter, type SelectFooterProps } from './SelectFooter';
 export { SelectGroup } from './SelectGroup';
 export { SelectGroupLabel } from './SelectGroupLabel';
 export { SelectHeader } from './SelectHeader';
 export { SelectInput } from './SelectInput';
 export { SelectOption } from './SelectOption';
 export { SelectOptionDescription } from './SelectOptionDescription';
+export { SelectOptionHint, type SelectOptionHintProps } from './SelectOptionHint';
 export { SelectOptionIndicator } from './SelectOptionIndicator';
 export { SelectOptionText } from './SelectOptionText';
-export { SelectPositioner } from './SelectPositioner';
+export { SelectPositioner, type SelectPositionerProps } from './SelectPositioner';
 export { SelectSearchInput, type SelectSearchInputProps } from './SelectSearchInput';
 export { SelectSeparator, type SelectSeparatorProps } from './SelectSeparator';
 export type { SelectDataItem } from './types';

package/dist/components/Select/index.js

@@ -1,4 +1,5 @@
 export { createListCollection } from "@ark-ui/react/collection";
+export { selectFooterVariants } from "./classes.js";
 export { Select } from "./Select.js";
 export { SelectButton } from "./SelectButton.js";
 export { SelectButtonTag, SelectButtonTagValue } from "./SelectButtonTag/index.js";
@@ -12,6 +13,7 @@ export { SelectHeader } from "./SelectHeader.js";
 export { SelectInput } from "./SelectInput/index.js";
 export { SelectOption } from "./SelectOption.js";
 export { SelectOptionDescription } from "./SelectOptionDescription.js";
+export { SelectOptionHint } from "./SelectOptionHint.js";
 export { SelectOptionIndicator } from "./SelectOptionIndicator.js";
 export { SelectOptionText } from "./SelectOptionText.js";
 export { SelectPositioner } from "./SelectPositioner.js";

package/dist/components/Table/TableBody/TableBodyVirtualizedCore.js

@@ -47,7 +47,7 @@ const TableBodyVirtualizedCore = ({ tbodyRef, virtualizer })=>{
                 virtualRows.length > 0 && /*#__PURE__*/ jsx(Tr, {
                     children: /*#__PURE__*/ jsx(Td, {
                         style: {
-                            height: `${totalSize + scrollMargin - (virtualRows[virtualRows.length - 1]?.end ?? 0)}px`,
+                            height: `${totalSize - (virtualRows[virtualRows.length - 1]?.end ?? 0)}px`,
                             padding: 0,
                             border: 'none'
                         },

package/dist/components/Table/TableBody/TableBodyVirtualizedWindow.js

@@ -1,37 +1,20 @@
 import { jsx } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef } from "react";
-import { elementScroll, observeElementOffset, observeElementRect, observeWindowOffset, observeWindowRect, useVirtualizer } from "@tanstack/react-virtual";
-import { TABLE_VIRTUALIZATION_OVERSCAN, getOffsetTopInScrollRoot, getRowKey, getScrollMetrics, getScrollRoot } from "../lib/index.js";
+import { useCallback, useEffect } from "react";
+import { useWindowVirtualizer } from "@tanstack/react-virtual";
+import { TABLE_VIRTUALIZATION_OVERSCAN, getRowKey } from "../lib/index.js";
 import { useTableContext } from "../TableContext/index.js";
+import { getDocumentOffsetTop } from "./lib/getDocumentOffsetTop.js";
 import { measureRowElement } from "./lib/measureRowElement.js";
 import { TableBodyVirtualizedCore } from "./TableBodyVirtualizedCore.js";
 import { useResetVirtualizerOnDataChange } from "./useResetVirtualizerOnDataChange.js";
 import { useSmoothScrollOnSort } from "./useSmoothScrollOnSort.js";
-const isWindowRoot = (instance)=>instance.scrollElement === window;
-const observeRootRect = (instance, cb)=>isWindowRoot(instance) ? observeWindowRect(instance, cb) : observeElementRect(instance, cb);
-const observeRootOffset = (instance, cb)=>isWindowRoot(instance) ? observeWindowOffset(instance, cb) : observeElementOffset(instance, cb);
 const TableBodyVirtualizedWindow = ()=>{
-    const { table, estimateRowHeight, overscan, tbodyRef, virtualizerRef, containerRef } = useTableContext();
-    const scrollRootRef = useRef(null);
-    const getScrollElement = useCallback(()=>{
-        const anchor = tbodyRef.current ?? containerRef.current;
-        if (!scrollRootRef.current && anchor) scrollRootRef.current = getScrollRoot(anchor);
-        return scrollRootRef.current;
-    }, [
-        tbodyRef,
-        containerRef
-    ]);
-    const scrollRoot = getScrollElement();
-    const virtualizer = useVirtualizer({
+    const { table, estimateRowHeight, overscan, tbodyRef, virtualizerRef } = useTableContext();
+    const virtualizer = useWindowVirtualizer({
         count: table.getRowModel().rows.length,
-        getScrollElement: getScrollElement,
-        observeElementRect: observeRootRect,
-        observeElementOffset: observeRootOffset,
-        scrollToFn: elementScroll,
-        initialOffset: ()=>getScrollMetrics(getScrollElement() ?? window).scrollTop,
         estimateSize: estimateRowHeight ?? (()=>40),
         overscan: overscan ?? TABLE_VIRTUALIZATION_OVERSCAN,
-        scrollMargin: tbodyRef.current && scrollRoot ? getOffsetTopInScrollRoot(tbodyRef.current, scrollRoot) : 0,
+        scrollMargin: tbodyRef.current ? getDocumentOffsetTop(tbodyRef.current) : 0,
         getItemKey: useCallback((index)=>getRowKey(table.getRowModel().rows, index), [
             table
         ]),
@@ -44,7 +27,8 @@ const TableBodyVirtualizedWindow = ()=>{
         virtualizerRef
     ]);
     useResetVirtualizerOnDataChange(table, virtualizer);
-    useSmoothScrollOnSort(table, getScrollElement);
+    const getScrollTarget = useCallback(()=>window, []);
+    useSmoothScrollOnSort(table, getScrollTarget);
     return /*#__PURE__*/ jsx(TableBodyVirtualizedCore, {
         tbodyRef: tbodyRef,
         virtualizer: virtualizer

package/dist/components/Table/TableInner/TableInnerWindow.js

@@ -17,7 +17,6 @@ const TableInnerWindow = ({ isEmpty, showSettings, hasConsumerSettingsMenu, aria
     const containerWidth = useContainerWidth(rootRef);
     useInfiniteScroll({
         mode: 'window',
-        scrollRef: containerRef,
         table,
         virtualizerRef,
         tbodyRef,

package/dist/components/Table/hooks/infiniteScroll/useInfiniteScroll.d.ts

@@ -4,7 +4,7 @@ import { type DSTableFeatures } from '../../lib';
 import type { TableVirtualizerInstance } from '../../TableContext/types';
 interface UseInfiniteScrollOptions<T extends RowData> {
     mode: 'container' | 'window';
-    /** `container`: the scroll element. `window`: an element to resolve the scroll root from. */
+    /** Scroll element ref — required for `container` mode */
     scrollRef?: RefObject<HTMLElement | null>;
     table: Table<DSTableFeatures, T>;
     virtualizerRef: RefObject<TableVirtualizerInstance | null>;

package/dist/components/Table/hooks/infiniteScroll/usePrependScrollAnchor.d.ts

@@ -2,7 +2,6 @@ import { type RefObject } from 'react';
 import type { TableVirtualizerInstance } from '../../TableContext/types';
 interface UsePrependScrollAnchorOptions {
     mode: 'container' | 'window';
-    /** `container`: the scroll element. `window`: an element to resolve the scroll root from. */
     scrollRef?: RefObject<HTMLElement | null>;
     rows: {
         id: string;

package/dist/components/Table/hooks/infiniteScroll/usePrependScrollAnchor.js

@@ -1,5 +1,5 @@
 import { useLayoutEffect, useRef } from "react";
-import { detectDataChange, getScrollMetrics, getScrollRoot, scrollRootBy } from "../../lib/index.js";
+import { detectDataChange } from "../../lib/index.js";
 const usePrependScrollAnchor = ({ mode, scrollRef, rows, virtualizerRef, tbodyRef, isLoadingPrevious })=>{
     const prevFirstRowIdRef = useRef(void 0);
     const prevLastRowIdRef = useRef(void 0);
@@ -12,15 +12,7 @@ const usePrependScrollAnchor = ({ mode, scrollRef, rows, virtualizerRef, tbodyRe
     });
     const seededRef = useRef(false);
     useLayoutEffect(()=>{
-        const getRoot = ()=>'window' === mode ? getScrollRoot(scrollRef?.current ?? null) : scrollRef?.current;
-        const getScrollHeight = ()=>{
-            const root = getRoot();
-            return root ? getScrollMetrics(root).scrollHeight : 0;
-        };
-        const scrollBy = (delta)=>{
-            const root = getRoot();
-            if (root) scrollRootBy(root, delta);
-        };
+        const getScrollHeight = ()=>'window' === mode ? document.documentElement.scrollHeight : scrollRef?.current?.scrollHeight ?? 0;
         const getStartLoaderHeight = ()=>{
             const loaderRows = tbodyRef?.current?.querySelectorAll('tr[data-loading-position="start"]');
             const count = loaderRows?.length ?? 0;
@@ -62,10 +54,16 @@ const usePrependScrollAnchor = ({ mode, scrollRef, rows, virtualizerRef, tbodyRe
                 const rowDelta = newStart - prevFirstRowStartRef.current;
                 const loaderDelta = getStartLoaderHeight() - prevLoaderHeight;
                 const delta = rowDelta + loaderDelta;
-                if (0 !== delta) scrollBy(delta);
+                if (0 !== delta) {
+                    if ('window' === mode) window.scrollBy(0, delta);
+                    else if (scrollRef?.current) scrollRef.current.scrollTop += delta;
+                }
             } else if (null !== prevScrollHeightRef.current) {
                 const delta = getScrollHeight() - prevScrollHeightRef.current;
-                if (delta > 0) scrollBy(delta);
+                if (delta > 0) {
+                    if ('window' === mode) window.scrollBy(0, delta);
+                    else if (scrollRef?.current) scrollRef.current.scrollTop += delta;
+                }
             }
         }
         prevFirstRowIdRef.current = rows[0]?.id;

package/dist/components/Table/hooks/infiniteScroll/useScrollEdge.d.ts

@@ -4,10 +4,7 @@ type ScrollEdge = 'start' | 'end';
 interface UseScrollEdgeOptions {
     edge: ScrollEdge;
     mode: ScrollMode;
-    /**
-     * `container`: the scroll element. `window`: any element inside the table —
-     * the scroll root is resolved from it (see `getScrollRoot`).
-     */
+    /** Scroll element ref — required for `container` mode */
     scrollRef?: RefObject<HTMLElement | null>;
     onReached?: () => void;
     threshold: number;

package/dist/components/Table/hooks/infiniteScroll/useScrollEdge.js

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { SCROLL_EDGE_COOLDOWN_MS, getScrollMetrics, getScrollRoot } from "../../lib/index.js";
+import { SCROLL_EDGE_COOLDOWN_MS } from "../../lib/index.js";
 const useScrollEdge = ({ edge, mode, scrollRef, onReached, threshold, enabled = true })=>{
     const firedRef = useRef(false);
     const lastFiredAtRef = useRef(0);
@@ -12,12 +12,23 @@ const useScrollEdge = ({ edge, mode, scrollRef, onReached, threshold, enabled =
         enabledRef.current = enabled;
     });
     useEffect(()=>{
-        const target = 'window' === mode ? getScrollRoot(scrollRef?.current ?? null) : scrollRef?.current;
-        if (!target) return;
         const check = ()=>{
             const callback = onReachedRef.current;
             if (!callback || !enabledRef.current) return;
-            const { scrollTop, clientHeight, scrollHeight } = getScrollMetrics(target);
+            let scrollTop;
+            let clientHeight;
+            let scrollHeight;
+            if ('window' === mode) {
+                scrollTop = window.scrollY;
+                clientHeight = window.innerHeight;
+                scrollHeight = document.documentElement.scrollHeight;
+            } else {
+                const el = scrollRef?.current;
+                if (!el) return;
+                scrollTop = el.scrollTop;
+                clientHeight = el.clientHeight;
+                scrollHeight = el.scrollHeight;
+            }
             const distance = 'start' === edge ? scrollTop : scrollHeight - scrollTop - clientHeight;
             if (distance <= threshold) {
                 const now = Date.now();
@@ -28,6 +39,8 @@ const useScrollEdge = ({ edge, mode, scrollRef, onReached, threshold, enabled =
                 }
             } else firedRef.current = false;
         };
+        const target = 'window' === mode ? window : scrollRef?.current;
+        if (!target) return;
         target.addEventListener('scroll', check, {
             passive: true
         });

package/dist/components/Table/lib/index.d.ts

@@ -11,7 +11,6 @@ export { getDndStyles } from './getDndStyles';
 export { getPinningStyles } from './getPinningStyles';
 export { getRowKey } from './getRowKey';
 export { isLastPinnedLeft } from './isLastPinnedLeft';
-export { getOffsetTopInScrollRoot, getScrollMetrics, getScrollRoot, isWindowScrollRoot, type ScrollRoot, scrollRootBy, } from './scrollRoot';
 export { useColumnDnd } from './useColumnDnd';
 export { useContainerWidth } from './useContainerWidth';
 export { useRowDnd } from './useRowDnd';

package/dist/components/Table/lib/index.js

@@ -11,7 +11,6 @@ export { getDndStyles } from "./getDndStyles.js";
 export { getPinningStyles } from "./getPinningStyles.js";
 export { getRowKey } from "./getRowKey.js";
 export { isLastPinnedLeft } from "./isLastPinnedLeft.js";
-export { getOffsetTopInScrollRoot, getScrollMetrics, getScrollRoot, isWindowScrollRoot, scrollRootBy } from "./scrollRoot.js";
 export { useColumnDnd } from "./useColumnDnd.js";
 export { useContainerWidth } from "./useContainerWidth.js";
 export { useRowDnd } from "./useRowDnd.js";

package/dist/components/Table/types.d.ts

@@ -245,10 +245,7 @@ export interface TableProps<T> extends TestableProps {
      * the close edge here.
      */
     onSettingsOpenChange?: (open: boolean) => void;
-    /**
-     * Enable row virtualization. `'container'` virtualizes within the table's own scroll container;
-     * `'window'` follows the page scroll — the nearest scrollable ancestor, or the browser window.
-     */
+    /** Enable row virtualization. `'container'` virtualizes within the scroll container; `'window'` virtualizes against the browser window. */
     virtualized?: TableVirtualized;
     /**
      * Whether columns stretch proportionally to fill the container width.

package/dist/index.d.ts

@@ -36,6 +36,7 @@ export { EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIllustr
 export { FeedbackPulse, type FeedbackPulseCloseReason, type FeedbackPulseProps, } from './components/FeedbackPulse';
 export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, } from './components/Field';
 export { FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, FileUploadError, type FileUploadErrorCode, type FileUploadErrorProps, FileUploadItem, FileUploadItemAction, type FileUploadItemActionProps, FileUploadItemDeleteTrigger, type FileUploadItemDeleteTriggerProps, type FileUploadItemFile, FileUploadItemGroup, type FileUploadItemGroupProps, type FileUploadItemProps, FileUploadItemReplaceTrigger, type FileUploadItemReplaceTriggerProps, type FileUploadProps, type FileUploadRejection, FileUploadTrigger, type FileUploadTriggerProps, fileUploadDropzoneVariants, fileUploadItemVariants, fileUploadVariants, } from './components/FileUpload';
+export { FilterDropdown, FilterDropdownAllOption, type FilterDropdownAllOptionProps, FilterDropdownClear, type FilterDropdownClearProps, FilterDropdownContent, type FilterDropdownContentProps, FilterDropdownEmpty, type FilterDropdownEmptyProps, FilterDropdownFooter, FilterDropdownFooterClear, type FilterDropdownFooterClearProps, type FilterDropdownFooterProps, FilterDropdownGroup, FilterDropdownGroupLabel, type FilterDropdownGroupLabelProps, type FilterDropdownGroupProps, type FilterDropdownOpenChangeDetails, FilterDropdownOption, type FilterDropdownOptionProps, type FilterDropdownProps, FilterDropdownSearch, type FilterDropdownSearchProps, FilterDropdownSelected, type FilterDropdownSelectedProps, FilterDropdownTrigger, type FilterDropdownTriggerProps, type FilterDropdownValueChangeDetails, filterDropdownControlVariants, filterDropdownTriggerVariants, type UseFilterDropdownResult, useFilterDropdown, } from './components/FilterDropdown';
 export { type Condition, type ExprNode, type FieldMetadata, type FieldType, FilterInput, FilterInputChip, type FilterInputChipData, type FilterInputChipProps, type FilterInputChipVariant, FilterInputFieldMenu, type FilterInputFieldMenuProps, FilterInputOperatorMenu, type FilterInputOperatorMenuProps, type FilterInputProps, type FilterOperator, type Group, } from './components/FilterInput';
 export { Flex, type FlexProps } from './components/Flex';
 export { FormatDateTime, type FormatDateTimeProps } from './components/FormatDateTime';
@@ -73,7 +74,7 @@ export { SearchInput, type SearchInputProps } from './components/SearchInput';
 export { SearchModal, SearchModalBody, type SearchModalBodyProps, SearchModalContent, type SearchModalContentProps, SearchModalEmpty, type SearchModalEmptyProps, SearchModalFooter, type SearchModalFooterProps, SearchModalGroup, SearchModalGroupLabel, type SearchModalGroupLabelProps, type SearchModalGroupProps, SearchModalInput, type SearchModalInputProps, SearchModalItem, type SearchModalItemProps, type SearchModalProps, SearchModalTrigger, type SearchModalTriggerProps, useSearchModalContext, } from './components/SearchModal';
 export { SegmentedControl, SegmentedControlButton, type SegmentedControlButtonProps, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, SegmentedControlSeparator, type SegmentedControlSeparatorProps, } from './components/SegmentedControl';
 export { SegmentedTabs, SegmentedTabsButton, SegmentedTabsContent, SegmentedTabsList, SegmentedTabsSeparator, SegmentedTabsTrigger, SegmentedTabsTriggerButton, } from './components/SegmentedTabs';
-export { createListCollection, Select, SelectButton, SelectClearTrigger, SelectContent, type SelectDataItem, SelectEmptyState, type SelectEmptyStateProps, SelectFooter, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionIndicator, SelectOptionText, SelectPositioner, SelectSearchInput, SelectSeparator, type UseSelectSearchOptions, type UseSelectSearchResult, useSelectSearch, } from './components/Select';
+export { createListCollection, Select, SelectButton, SelectClearTrigger, SelectContent, type SelectDataItem, SelectEmptyState, type SelectEmptyStateProps, SelectFooter, type SelectFooterProps, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionHint, type SelectOptionHintProps, SelectOptionIndicator, SelectOptionText, SelectPositioner, type SelectPositionerProps, SelectSearchInput, SelectSeparator, selectFooterVariants, type UseSelectSearchOptions, type UseSelectSearchResult, useSelectSearch, } from './components/Select';
 export { Selection, SelectionAll, type SelectionAllProps, SelectionBulkBar, type SelectionBulkBarPlacement, type SelectionBulkBarProps, type SelectionContextValue, SelectionItem, type SelectionItemProps, type SelectionProps, useSelectionContext, } from './components/Selection';
 export { Separator, type SeparatorProps } from './components/Separator';
 export { SettingsHeader, SettingsHeaderActions, type SettingsHeaderActionsProps, SettingsHeaderBreadcrumbs, type SettingsHeaderBreadcrumbsProps, SettingsHeaderDescription, type SettingsHeaderDescriptionProps, SettingsHeaderFilters, type SettingsHeaderFiltersProps, SettingsHeaderHeading, type SettingsHeaderHeadingProps, type SettingsHeaderProps, SettingsHeaderTitle, type SettingsHeaderTitleProps, } from './components/SettingsHeader';

package/dist/index.js

@@ -25,6 +25,7 @@ export { EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIllustr
 export { FeedbackPulse } from "./components/FeedbackPulse/index.js";
 export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle } from "./components/Field/index.js";
 export { FileUpload, FileUploadDropzone, FileUploadError, FileUploadItem, FileUploadItemAction, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemReplaceTrigger, FileUploadTrigger, fileUploadDropzoneVariants, fileUploadItemVariants, fileUploadVariants } from "./components/FileUpload/index.js";
+export { FilterDropdown, FilterDropdownAllOption, FilterDropdownClear, FilterDropdownContent, FilterDropdownEmpty, FilterDropdownFooter, FilterDropdownFooterClear, FilterDropdownGroup, FilterDropdownGroupLabel, FilterDropdownOption, FilterDropdownSearch, FilterDropdownSelected, FilterDropdownTrigger, filterDropdownControlVariants, filterDropdownTriggerVariants, useFilterDropdown } from "./components/FilterDropdown/index.js";
 export { FilterInput, FilterInputChip, FilterInputFieldMenu, FilterInputOperatorMenu } from "./components/FilterInput/index.js";
 export { Flex } from "./components/Flex/index.js";
 export { FormatDateTime } from "./components/FormatDateTime/index.js";
@@ -62,7 +63,7 @@ export { SearchInput } from "./components/SearchInput/index.js";
 export { SearchModal, SearchModalBody, SearchModalContent, SearchModalEmpty, SearchModalFooter, SearchModalGroup, SearchModalGroupLabel, SearchModalInput, SearchModalItem, SearchModalTrigger, useSearchModalContext } from "./components/SearchModal/index.js";
 export { SegmentedControl, SegmentedControlButton, SegmentedControlItem, SegmentedControlSeparator } from "./components/SegmentedControl/index.js";
 export { SegmentedTabs, SegmentedTabsButton, SegmentedTabsContent, SegmentedTabsList, SegmentedTabsSeparator, SegmentedTabsTrigger, SegmentedTabsTriggerButton } from "./components/SegmentedTabs/index.js";
-export { Select, SelectButton, SelectClearTrigger, SelectContent, SelectEmptyState, SelectFooter, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionIndicator, SelectOptionText, SelectPositioner, SelectSearchInput, SelectSeparator, createListCollection, useSelectSearch } from "./components/Select/index.js";
+export { Select, SelectButton, SelectClearTrigger, SelectContent, SelectEmptyState, SelectFooter, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionHint, SelectOptionIndicator, SelectOptionText, SelectPositioner, SelectSearchInput, SelectSeparator, createListCollection, selectFooterVariants, useSelectSearch } from "./components/Select/index.js";
 export { Selection, SelectionAll, SelectionBulkBar, SelectionItem, useSelectionContext } from "./components/Selection/index.js";
 export { Separator } from "./components/Separator/index.js";
 export { SettingsHeader, SettingsHeaderActions, SettingsHeaderBreadcrumbs, SettingsHeaderDescription, SettingsHeaderFilters, SettingsHeaderHeading, SettingsHeaderTitle } from "./components/SettingsHeader/index.js";