@optiaxiom/react 0.3.4 → 0.3.5

package/dist/src/textarea-autosize/TextareaAutosize-css.js

@@ -1,9 +1,9 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/textarea-autosize/TextareaAutosize.css.ts.vanilla-BdcQ9g7K.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/textarea-autosize/TextareaAutosize.css.ts.vanilla-B8N-ZjBS.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var shadow = recipeRuntime({base:['_1i3b7fd','_16rmsha']});
-var textarea = recipeRuntime({base:['_1i3b7fd','_10yx66i']});
-var wrapper = recipeRuntime({base:{display:'grid',flex:'auto',overflow:'auto'},variants:{maxRows:{'1':['_1pfw6m7','b99499'],'2':['_1pfw6m7','_87fl7e'],'3':['_1pfw6m7','zc85qp'],'4':['_1pfw6m7','lvd06'],'5':['_1pfw6m7','mxynr2']},resize:{auto:{},none:{},vertical:'fmudw2'}}});
+var shadow = recipeRuntime({base:['ivlwrr','_1c78n5n']});
+var textarea = recipeRuntime({base:['ivlwrr','_1r0scqc']});
+var wrapper = recipeRuntime({base:{display:'grid',flex:'auto',overflow:'auto'},variants:{maxRows:{'1':['_1yiv158','zavvdw'],'2':['_1yiv158','_1bbk6lh'],'3':['_1yiv158','_5bm10s'],'4':['_1yiv158','_6swszg'],'5':['_1yiv158','_1fn9xay']},resize:{auto:{},none:{},vertical:'_4ynwox'}}});
 
 export { shadow, textarea, wrapper };

package/dist/src/toast/Toast-css.js

@@ -1,9 +1,9 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/toast-provider/ToastProvider.css.ts.vanilla-D0WvOUI1.css';
-import './../../assets/src/toast/Toast.css.ts.vanilla-CULVVH5B.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/toast-provider/ToastProvider.css.ts.vanilla-DEMA1i5o.css';
+import './../../assets/src/toast/Toast.css.ts.vanilla-CHiwYBgv.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{alignSelf:'start',mt:'4'},'_1w8rle2']});
-var root = recipeRuntime({base:[{alignItems:'center',bg:'bg.default.inverse',color:'fg.default.inverse',display:'flex',gap:'xs',maxW:'full',p:'sm',pl:'md',rounded:'md',shadow:'md',w:['full','max']},'biqcg2'],variants:{colorScheme:{danger:'_1xko13c',information:'_4j60dk',neutral:'_1jjg9i',success:'_1sgbtc2',warning:'_1lslqv5'}}});
+var icon = recipeRuntime({base:[{alignSelf:'start',mt:'4'},'_1nggm9s']});
+var root = recipeRuntime({base:[{alignItems:'center',bg:'bg.default.inverse',color:'fg.default.inverse',display:'flex',gap:'xs',maxW:'full',p:'sm',pl:'md',rounded:'md',shadow:'md',w:['full','max']},'_1jbvkcm'],variants:{colorScheme:{danger:'edpov6',information:'c1i8a7',neutral:'_18sa79i',success:'_1v1x58o',warning:'_80u9jd'}}});
 
 export { icon, root };

package/dist/src/toast/Toast.js

@@ -12,6 +12,7 @@ import { IconX } from '../icons/IconX.js';
 import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
+import { useToastContext } from '../toast-context/ToastContext.js';
 import { root, icon } from './Toast-css.js';
 
 const iconMap = {
@@ -24,11 +25,16 @@ const iconMap = {
 const Toast = forwardRef(
   ({ children, colorScheme = "neutral", onOpenChange, open, ...props }, ref) => {
     const { restProps, sprinkleProps } = extractSprinkles(props);
+    const context = useToastContext("Toast");
     return /* @__PURE__ */ jsx(Box, { asChild: true, ...root({ colorScheme }), ...sprinkleProps, children: /* @__PURE__ */ jsxs(
       RadixToast.Root,
       {
-        onOpenChange,
-        open,
+        forceMount: !!context,
+        onOpenChange: (open2) => {
+          onOpenChange?.(open2);
+          context.onOpenChange(open2);
+        },
+        open: context.open || open,
         ref,
         ...restProps,
         children: [

package/dist/src/toast-context/ToastContext.js

@@ -0,0 +1,5 @@
+import { createContext } from '@radix-ui/react-context';
+
+const [ToastContextProvider, useToastContext] = createContext("ToastProvider");
+
+export { ToastContextProvider, useToastContext };

package/dist/src/toast-provider/ToastProvider-css.js

@@ -1,7 +1,7 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/toast-provider/ToastProvider.css.ts.vanilla-D0WvOUI1.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/toast-provider/ToastProvider.css.ts.vanilla-DEMA1i5o.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var viewport = recipeRuntime({base:[{gap:'md',justifyContent:'normal',maxH:'full',overflowX:'hidden',overflowY:'auto',p:'24',w:['full','384'],z:'toast'},'_11cqo1y'],variants:{position:{bottom:'avkih1','bottom-left':'_1b788g3','bottom-right':'_5lsw9p',top:'_1k7g9xb','top-left':'_1mxb55n','top-right':'gb52re'}}});
+var viewport = recipeRuntime({base:[{gap:'md',justifyContent:'normal',maxH:'full',overflowX:'hidden',overflowY:'auto',p:'24',w:['full','384'],z:'toast'},'_1t3o9re'],variants:{position:{bottom:'s89c8m','bottom-left':'_16bynhz','bottom-right':'_17g1iko',top:'_1tbnfeq','top-left':'y37e87','top-right':'_130jicq'}}});
 
 export { viewport };

package/dist/src/toast-provider/ToastProvider.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
 import { Portal } from '@radix-ui/react-portal';
 import * as RadixToast from '@radix-ui/react-toast';
-import { forwardRef, useRef, cloneElement, isValidElement } from 'react';
+import { forwardRef, useRef, isValidElement } from 'react';
 import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
 import { Flex } from '../flex/Flex.js';
 import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
@@ -10,6 +10,7 @@ import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 import { Toast } from '../toast/Toast.js';
 import { ToastAction } from '../toast-action/ToastAction.js';
+import { ToastContextProvider } from '../toast-context/ToastContext.js';
 import { ToastTitle } from '../toast-title/ToastTitle.js';
 import { toaster } from '@optiaxiom/globals';
 import { viewport } from './ToastProvider-css.js';
@@ -53,10 +54,13 @@ const ToastProvider = forwardRef(
         swipeDirection: swipeDirection ?? mapPositionToSwipeDirection[position],
         swipeThreshold,
         children: [
-          toasts.map(
-            ({ id, open, toast }) => cloneElement(
+          toasts.map(({ id, open, toast }) => /* @__PURE__ */ jsx(
+            ToastContextProvider,
+            {
+              onOpenChange: () => toasterProp.remove(id),
+              open,
               // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/microsoft/TypeScript/issues/53178
-              isValidElement(toast) ? toast : /* @__PURE__ */ jsxs(Toast, { colorScheme: toast.type, children: [
+              children: isValidElement(toast) ? toast : /* @__PURE__ */ jsxs(Toast, { colorScheme: toast.type, children: [
                 /* @__PURE__ */ jsx(ToastTitle, { children: toast.title }),
                 toast.action && /* @__PURE__ */ jsx(
                   ToastAction,
@@ -66,20 +70,10 @@ const ToastProvider = forwardRef(
                     children: toast.action.label
                   }
                 )
-              ] }, id),
-              {
-                forceMount: true,
-                key: id,
-                onOpenChange: (open2) => {
-                  if (isValidElement(toast)) {
-                    toast.props.onOpenChange?.(open2);
-                  }
-                  toasterProp.remove(id);
-                },
-                open
-              }
-            )
-          ),
+              ] }, id)
+            },
+            id
+          )),
           /* @__PURE__ */ jsx(Portal, { container, children: /* @__PURE__ */ jsx(
             Flex,
             {

package/dist/src/toggle-input/ToggleInput-css.js

@@ -1,8 +1,8 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/table-row/TableRow.css.ts.vanilla-BMIhB2fq.css';
-import './../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-DiU1hVaB.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-DkygPBaI.css';
+import './../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-CYG8X4be.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var toggleInput = recipeRuntime({base:['_11ai96d',{alignItems:'start',flexDirection:'row',gap:'xs'},'amkhy6']});
+var toggleInput = recipeRuntime({base:['pctqts',{alignItems:'start',flexDirection:'row',gap:'xs'},'_13md6rf']});
 
 export { toggleInput };

package/dist/src/toggle-input-control/ToggleInputControl-css.js

@@ -1,9 +1,9 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/table-row/TableRow.css.ts.vanilla-BMIhB2fq.css';
-import './../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-DiU1hVaB.css';
-import './../../assets/src/toggle-input-control/ToggleInputControl.css.ts.vanilla-B2VkrVTh.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-DkygPBaI.css';
+import './../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-CYG8X4be.css';
+import './../../assets/src/toggle-input-control/ToggleInputControl.css.ts.vanilla-BuJ2mQgD.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:['_19ajbot']});
+var control = recipeRuntime({base:['qbp44b']});
 
 export { control };

package/dist/src/toggle-input-hidden-input/ToggleInputHiddenInput-css.js

@@ -1,6 +1,6 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/table-row/TableRow.css.ts.vanilla-BMIhB2fq.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/table-row/TableRow.css.ts.vanilla-DkygPBaI.css';
 
-var className = '_1gdvwm2';
+var className = 'fs2y3f';
 
 export { className };

package/dist/src/tooltip-content/TooltipContent-css.js

@@ -1,4 +1,4 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var content = recipeRuntime({base:[{bg:'bg.default.inverse',color:'fg.default.inverse',px:'12',py:'8',rounded:'md',z:'tooltip'}]});

package/dist/src/transition/Transition-css.js

@@ -1,8 +1,8 @@
-import './../../assets/src/layers/layers.css.ts.vanilla-DQSmpGQ1.css';
-import './../../assets/src/transition/Transition.css.ts.vanilla-8tg-gwE2.css';
+import './../../assets/src/layers/layers.css.ts.vanilla-BQxl5Oc4.css';
+import './../../assets/src/transition/Transition.css.ts.vanilla-DIc7AOWt.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var transition = recipeRuntime({base:'_1azpzr7',variants:{duration:{sm:'_8lyvl5',md:'_1styjlp',lg:'_2t7u54'},type:{fade:'isc3ld',pop:'fx13no'}}});
+var transition = recipeRuntime({base:'_1bnnv5d',variants:{duration:{sm:'_1ownef6',md:'aqo5ir',lg:'sm9l7g'},type:{fade:'n24qgb',pop:'htfrzr'}}});
 var transitionDuration = {sm:150,md:250,lg:400};
 
 export { transition, transitionDuration };

package/dist/unstable.d.ts

@@ -1,13 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import { ReactNode } from 'react';
+import { ReactNode, ComponentPropsWithoutRef } from 'react';
 import { UseComboboxProps, UseSelectProps } from 'downshift';
 import { S as Sprinkles, B as BoxProps, L as Link } from './Link-DSt1ACyC.js';
 import * as _radix_ui_react_popper from '@radix-ui/react-popper';
+import * as RadixPopover from '@radix-ui/react-popover';
+import * as _vanilla_extract_sprinkles from '@vanilla-extract/sprinkles';
+import * as _radix_ui_react_separator from '@radix-ui/react-separator';
 import { TableOptions, Column } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
-import * as _vanilla_extract_sprinkles from '@vanilla-extract/sprinkles';
-import * as RadixSeparator from '@radix-ui/react-separator';
 
 type AutocompleteProps<Item> = {
     children?: ReactNode;
@@ -32,12 +33,10 @@ declare const AutocompleteContent: react.ForwardRefExoticComponent<Omit<Omit<_ra
     loading?: boolean;
 } & react.RefAttributes<HTMLDivElement>>;
 
-declare const AutocompleteEmptyItem: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
+declare const AutocompleteEmpty: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref">, "color" | "className"> & Omit<{
     asChild?: boolean;
     className?: string;
-} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLDivElement> | null | undefined;
-}, "ref"> & react.RefAttributes<HTMLLIElement>>;
+} & Sprinkles, never> & react.RefAttributes<HTMLLIElement>>;
 
 declare const AutocompleteItem: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref">, "color" | "className"> & Omit<{
     asChild?: boolean;
@@ -46,25 +45,22 @@ declare const AutocompleteItem: react.ForwardRefExoticComponent<Omit<Omit<react.
     addonAfter?: react.ReactNode;
     addonBefore?: react.ReactNode;
     description?: react.ReactNode;
+    icon?: react.ReactNode;
 } & {
     colorScheme?: "danger" | "neutral" | undefined;
-}, never> & react.RefAttributes<HTMLLIElement>>;
+}, never> & {
+    item: unknown;
+} & react.RefAttributes<HTMLLIElement>>;
 
 declare const AutocompleteItemIndicator: react.ForwardRefExoticComponent<Omit<Omit<Omit<react.SVGProps<SVGSVGElement>, "ref"> & react.RefAttributes<SVGSVGElement>, "ref">, "color" | "fontFamily" | "fontSize" | "cursor" | "fontWeight" | "pointerEvents" | "overflow" | "z" | "display" | "className"> & Omit<{
     asChild?: boolean;
     className?: string;
 } & Sprinkles, never> & react.RefAttributes<SVGSVGElement>>;
 
-type AutocompleteListProps = {
-    /**
-     * Render each item using a children render prop.
-     */
-    children: (item: any) => ReactNode;
-};
-declare function AutocompleteList({ children }: AutocompleteListProps): react_jsx_runtime.JSX.Element;
-declare namespace AutocompleteList {
-    var displayName: string;
-}
+declare const AutocompleteList: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLUListElement>>;
 
 declare const AutocompleteTrigger: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "color" | "size" | "className"> & Omit<{
     asChild?: boolean;
@@ -127,6 +123,140 @@ declare namespace BreadcrumbSeparator {
     var displayName: string;
 }
 
+type ComboBoxProps<Item, Mode extends "multiple" | "single" = "single"> = {
+    children: ReactNode;
+    defaultOpen?: boolean;
+    defaultValue?: Mode extends "multiple" ? Item[] : Item;
+    mode: Mode;
+    onInputValueChange?: (inputValue: string) => void;
+    onOpenChange?: (open: boolean) => void;
+    onValueChange?: (value: Mode extends "multiple" ? Item[] : Item) => void;
+    open?: boolean;
+    value?: Mode extends "multiple" ? Item[] : Item;
+} & Pick<UseComboboxProps<Item>, "isItemDisabled" | "items" | "itemToKey" | "itemToString">;
+declare function Combobox<Item, Mode extends "multiple" | "single" = "single">({ children, defaultOpen, defaultValue, items, itemToKey, itemToString, mode: modeProp, onInputValueChange, onOpenChange, onValueChange, open: openProp, value: valueProp, ...props }: ComboBoxProps<Item, Mode>): react_jsx_runtime.JSX.Element;
+declare namespace Combobox {
+    var displayName: string;
+}
+
+declare const ComboboxContent: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<RadixPopover.PopoverContentProps & react.RefAttributes<HTMLDivElement>, "ref">, "borderColor" | "color" | "fontFamily" | "animation" | "fontSize" | "size" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w" | "className" | "asChild" | "minW" | "provider" | "enableExitAnimation" | "withArrow"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & Omit<{
+    enableExitAnimation?: boolean;
+} & {
+    minW?: "0" | "trigger" | undefined;
+    provider?: "popover" | "dropdown-menu" | "popper" | undefined;
+}, never> & {
+    withArrow?: boolean;
+}, "ref"> & react.RefAttributes<HTMLDivElement>, "ref">, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+declare const ComboboxEmpty: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
+
+declare const ComboboxFooter: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLDivElement> | null | undefined;
+}, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLDivElement> | null | undefined;
+}, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+declare const ComboboxInput: react.ForwardRefExoticComponent<Omit<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "color" | "size" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, "size"> & Omit<{
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    addonPointerEvents?: "auto" | "none";
+    disabled?: boolean;
+    error?: boolean;
+} & {
+    size?: "md" | "lg" | undefined;
+}, never> & {
+    appearance?: "number" | "default" | undefined;
+} & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+
+declare const ComboboxItem: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & Omit<{
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    description?: react.ReactNode;
+    icon?: react.ReactNode;
+} & {
+    colorScheme?: "danger" | "neutral" | undefined;
+}, never> & {
+    item: unknown;
+} & react.RefAttributes<HTMLLIElement>>;
+
+declare const ComboboxItemIndicator: react.ForwardRefExoticComponent<Omit<Omit<Omit<react.SVGProps<SVGSVGElement>, "ref"> & react.RefAttributes<SVGSVGElement>, "ref">, "color" | "fontFamily" | "fontSize" | "cursor" | "fontWeight" | "pointerEvents" | "overflow" | "z" | "display" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<SVGSVGElement>>;
+
+declare const ComboboxList: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLUListElement>>;
+
+declare const ComboboxSeparator: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "className" | "asChild" | "orientation"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & {
+    orientation?: ("vertical" | "horizontal" | {
+        readonly base?: "vertical" | "horizontal" | undefined;
+        readonly sm?: "vertical" | "horizontal" | undefined;
+        readonly md?: "vertical" | "horizontal" | undefined;
+        readonly lg?: "vertical" | "horizontal" | undefined;
+    } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<2 | 1 | 3, "vertical" | "horizontal" | null>;
+} & react.RefAttributes<HTMLHRElement>, "ref">, "borderColor" | "color" | "fontFamily" | "animation" | "fontSize" | "size" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w" | "className" | "asChild"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLLIElement>>;
+
+declare const ComboboxTrigger: react.ForwardRefExoticComponent<Omit<Omit<Omit<RadixPopover.PopoverTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref">, "children" | "disabled" | "color" | "className" | "asChild"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, "size"> & Omit<{
+    appearance?: "default" | "inverse" | "danger" | "subtle" | "primary" | "danger-outline";
+    children?: react.ReactNode;
+    disabled?: boolean;
+    loading?: boolean;
+} & Omit<{
+    colorScheme?: "danger" | "neutral" | "primary" | undefined;
+    iconOnly?: boolean | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
+    variant?: "outline" | "subtle" | "solid" | undefined;
+}, "colorScheme" | "variant">, "children"> & Omit<{
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    children?: react.ReactNode;
+    icon?: react.ReactNode;
+    iconPosition?: "end" | "start";
+}, never> & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+declare const ComboboxMultipleValue: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & {
+    placeholder?: string;
+} & react.RefAttributes<HTMLDivElement>>;
+
+declare const ComboboxSingleValue: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & {
+    placeholder?: string;
+} & react.RefAttributes<HTMLDivElement>>;
+
+type ComboboxValueProps = ComponentPropsWithoutRef<typeof ComboboxMultipleValue> | ComponentPropsWithoutRef<typeof ComboboxSingleValue>;
+declare const ComboboxValue: react.ForwardRefExoticComponent<ComboboxValueProps & react.RefAttributes<HTMLDivElement>>;
+
 type DataTableProps<TData> = TableOptions<TData>;
 declare const DataTable: <TData>({ columns, data, ...props }: DataTableProps<TData>) => react_jsx_runtime.JSX.Element;
 
@@ -143,21 +273,22 @@ declare const Pill: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<react.De
     asChild?: boolean;
     className?: string;
 } & Sprinkles, "size"> & Omit<{
-    addonAfter?: react.ReactNode;
-    addonBefore?: react.ReactNode;
     appearance?: "default" | "inverse" | "danger" | "subtle" | "primary" | "danger-outline";
     children?: react.ReactNode;
     disabled?: boolean;
-    icon?: react.ReactNode;
-    iconAutosize?: boolean;
-    iconPosition?: "end" | "start";
     loading?: boolean;
 } & Omit<{
     colorScheme?: "danger" | "neutral" | "primary" | undefined;
     iconOnly?: boolean | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     variant?: "outline" | "subtle" | "solid" | undefined;
-}, "colorScheme" | "iconOnly" | "variant">, never> & react.RefAttributes<HTMLButtonElement>, "ref">, "borderColor" | "color" | "fontFamily" | "animation" | "fontSize" | "size" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w" | "className" | "asChild"> & Omit<{
+}, "colorScheme" | "variant">, "children"> & Omit<{
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    children?: react.ReactNode;
+    icon?: react.ReactNode;
+    iconPosition?: "end" | "start";
+}, never> & react.RefAttributes<HTMLButtonElement>, "ref">, "borderColor" | "color" | "fontFamily" | "animation" | "fontSize" | "size" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w" | "className" | "asChild"> & Omit<{
     asChild?: boolean;
     className?: string;
 } & Sprinkles, "size"> & {
@@ -195,6 +326,7 @@ declare const SelectItem: react.ForwardRefExoticComponent<Omit<Omit<react.Detail
     addonAfter?: react.ReactNode;
     addonBefore?: react.ReactNode;
     description?: react.ReactNode;
+    icon?: react.ReactNode;
 } & {
     colorScheme?: "danger" | "neutral" | undefined;
 }, never> & {
@@ -211,7 +343,7 @@ declare const SelectLabel: react.ForwardRefExoticComponent<Omit<Omit<Omit<react.
     className?: string;
 } & Sprinkles, never> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
-declare const SelectSeparator: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<RadixSeparator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "className" | "asChild" | "orientation"> & Omit<{
+declare const SelectSeparator: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "className" | "asChild" | "orientation"> & Omit<{
     asChild?: boolean;
     className?: string;
 } & Sprinkles, never> & {
@@ -230,21 +362,22 @@ declare const SelectTrigger: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui
     asChild?: boolean;
     className?: string;
 } & Sprinkles, "size"> & Omit<{
-    addonAfter?: react.ReactNode;
-    addonBefore?: react.ReactNode;
     appearance?: "default" | "inverse" | "danger" | "subtle" | "primary" | "danger-outline";
     children?: react.ReactNode;
     disabled?: boolean;
-    icon?: react.ReactNode;
-    iconAutosize?: boolean;
-    iconPosition?: "end" | "start";
     loading?: boolean;
 } & Omit<{
     colorScheme?: "danger" | "neutral" | "primary" | undefined;
     iconOnly?: boolean | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     variant?: "outline" | "subtle" | "solid" | undefined;
-}, "colorScheme" | "iconOnly" | "variant">, never> & react.RefAttributes<HTMLButtonElement>>;
+}, "colorScheme" | "variant">, "children"> & Omit<{
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    children?: react.ReactNode;
+    icon?: react.ReactNode;
+    iconPosition?: "end" | "start";
+}, never> & react.RefAttributes<HTMLButtonElement>>;
 
 declare const SelectValue: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & Omit<{
     asChild?: boolean;
@@ -283,4 +416,4 @@ declare const TableRow: react.ForwardRefExoticComponent<Omit<Omit<react.Detailed
     className?: string;
 } & Sprinkles, never> & react.RefAttributes<HTMLTableRowElement>>;
 
-export { Autocomplete, AutocompleteContent, AutocompleteEmptyItem, AutocompleteItem, AutocompleteItemIndicator, AutocompleteList, AutocompleteTrigger, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, DataTable, DataTableHeader, Pill, Select, SelectContent, SelectItem, SelectItemIndicator, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Table, TableBody, TableCell, TableHead, TableHeaderCell, TableRow };
+export { Autocomplete, AutocompleteContent, AutocompleteEmpty, AutocompleteItem, AutocompleteItemIndicator, AutocompleteList, AutocompleteTrigger, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Combobox, ComboboxContent, ComboboxEmpty, ComboboxFooter, ComboboxInput, ComboboxItem, ComboboxItemIndicator, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, DataTable, DataTableHeader, Pill, Select, SelectContent, SelectItem, SelectItemIndicator, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Table, TableBody, TableCell, TableHead, TableHeaderCell, TableRow };

package/dist/unstable.js

@@ -1,6 +1,6 @@
 export { Autocomplete } from './src/autocomplete/Autocomplete.js';
 export { AutocompleteContent } from './src/autocomplete-content/AutocompleteContent.js';
-export { AutocompleteEmptyItem } from './src/autocomplete-empty-item/AutocompleteEmptyItem.js';
+export { AutocompleteEmpty } from './src/autocomplete-empty/AutocompleteEmpty.js';
 export { AutocompleteItem } from './src/autocomplete-item/AutocompletItem.js';
 export { AutocompleteItemIndicator } from './src/autocomplete-item-indicator/AutocompleteItemIndicator.js';
 export { AutocompleteList } from './src/autocomplete-list/AutocompleteList.js';
@@ -11,6 +11,17 @@ export { BreadcrumbItem } from './src/breadcrumb-item/BreadcrumbItem.js';
 export { BreadcrumbLink } from './src/breadcrumb-link/BreadcrumbLink.js';
 export { BreadcrumbPage } from './src/breadcrumb-page/BreadcrumbPage.js';
 export { BreadcrumbSeparator } from './src/breadcrumb-separator/BreadcrumbSeparator.js';
+export { Combobox } from './src/combobox/Combobox.js';
+export { ComboboxContent } from './src/combobox-content/ComboboxContent.js';
+export { ComboboxEmpty } from './src/combobox-empty/ComboboxEmpty.js';
+export { ComboboxFooter } from './src/combobox-footer/ComboboxFooter.js';
+export { ComboboxInput } from './src/combobox-input/ComboboxInput.js';
+export { ComboboxItem } from './src/combobox-item/ComboboxItem.js';
+export { ComboboxItemIndicator } from './src/combobox-item-indicator/ComboboxItemIndicator.js';
+export { ComboboxList } from './src/combobox-list/ComboboxList.js';
+export { ComboboxSeparator } from './src/combobox-separator/ComboboxSeparator.js';
+export { ComboboxTrigger } from './src/combobox-trigger/ComboboxTrigger.js';
+export { ComboboxValue } from './src/combobox-value/ComboboxValue.js';
 export { DataTable } from './src/data-table/DataTable.js';
 export { DataTableHeader } from './src/data-table-header/DataTableHeader.js';
 export { Pill } from './src/pill/Pill.js';

package/package.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/optimizely-axiom/optiaxiom.git"
   },
   "type": "module",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "files": [
     "dist/**",
     "LICENSE"
@@ -72,7 +72,6 @@
   "peerDependencies": {
     "@tanstack/react-table": "^8.0.0",
     "@tanstack/table-core": "^8.0.0",
-    "cmdk": "^1.0.0",
     "react": "^16.14.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0"
   },

package/dist/assets/src/alert-dialog-footer/AlertDialogFooter.css.ts.vanilla-D5AnKyTd.css

@@ -1,6 +0,0 @@
-@layer optiaxiom._8eawvo;
-@layer optiaxiom._8eawvo {
-  ._14oqywm {
-    border-top: 1px solid var(--ax-colors-border-secondary);
-  }
-}

package/dist/assets/src/autocomplete-content/AutocompleteContent.css.ts.vanilla-DbhN4jbL.css

@@ -1,10 +0,0 @@
-@layer optiaxiom._8eawvo;
-@layer optiaxiom._8eawvo {
-  .bb2k0v {
-    overflow: auto;
-    overscroll-behavior: contain;
-  }
-  .bb2k0v:empty {
-    visibility: hidden;
-  }
-}

package/dist/assets/src/avatar/Avatar.css.ts.vanilla-DH4ziCzi.css

@@ -1,27 +0,0 @@
-@layer optiaxiom._8eawvo;
-@layer optiaxiom._8eawvo {
-  ._126xuk5 {
-    user-select: none;
-  }
-  ._1x7izju ._126xuk5 {
-    border: 1px solid var(--ax-colors-bg-default);
-  }
-  ._1x7izju ._1advlkn:not(:first-child) {
-    margin-left: -3px;
-  }
-  ._1x7izju .ma63w8:not(:first-child) {
-    margin-left: -5px;
-  }
-  ._1x7izju ._1rbybnk:not(:first-child) {
-    margin-left: -7px;
-  }
-  ._1x7izju .voclpu:not(:first-child) {
-    margin-left: -9px;
-  }
-  ._1x7izju .m83r23:not(:first-child) {
-    margin-left: -11px;
-  }
-  ._1x7izju .prrad6:not(:first-child) {
-    margin-left: -13px;
-  }
-}