@raystack/apsara 0.48.2 → 0.48.4

package/dist/components/dropdown-menu/dropdown-menu-misc.js

@@ -24,7 +24,7 @@ const DropdownMenuSeparator = forwardRef(({ className, asChild, ...props }, ref)
     if (shouldFilter) {
         return null;
     }
-    return (jsxRuntimeExports.jsx(MenuSeparator, { ref: ref, className: cx(styles.separator, className), render: asChild ? jsxRuntimeExports.jsx(Slot, {}) : undefined, ...props }));
+    return (jsxRuntimeExports.jsx(MenuSeparator, { ref: ref, className: cx(styles.separator, className), render: asChild ? jsxRuntimeExports.jsx(Slot, {}) : jsxRuntimeExports.jsx("div", {}), ...props }));
 });
 const DropdownMenuEmptyState = forwardRef(({ className, children, ...props }, ref) => (jsxRuntimeExports.jsx("div", { ref: ref, className: cx(styles.empty, className), ...props, children: children })));
 

package/dist/components/dropdown-menu/dropdown-menu-misc.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-misc.js","sources":["../../../components/dropdown-menu/dropdown-menu-misc.tsx"],"sourcesContent":["import {\n  MenuGroup,\n  MenuGroupLabel,\n  MenuGroupLabelProps,\n  MenuGroupProps,\n  MenuSeparator,\n  MenuSeparatorProps\n} from '@ariakit/react';\nimport { cx } from 'class-variance-authority';\nimport { Slot } from 'radix-ui';\nimport {\n  ElementRef,\n  Fragment,\n  HTMLAttributes,\n  ReactNode,\n  forwardRef\n} from 'react';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport styles from './dropdown-menu.module.css';\nimport { WithAsChild } from './types';\n\nexport const DropdownMenuGroup = forwardRef<\n  ElementRef<typeof MenuGroup>,\n  WithAsChild<MenuGroupProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  return (\n    <MenuGroup\n      ref={ref}\n      className={cx(styles.menugroup, className)}\n      render={shouldFilter ? <Fragment /> : asChild ? <Slot.Root /> : undefined}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuLabel = forwardRef<\n  ElementRef<typeof MenuGroupLabel>,\n  WithAsChild<MenuGroupLabelProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuGroupLabel\n      ref={ref}\n      className={cx(styles.label, className)}\n      render={asChild ? <Slot.Root /> : undefined}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuSeparator = forwardRef<\n  ElementRef<typeof MenuSeparator>,\n  WithAsChild<MenuSeparatorProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuSeparator\n      ref={ref}\n      className={cx(styles.separator, className)}\n      render={asChild ? <Slot.Root /> : undefined}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuEmptyState = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement> & {\n    children: ReactNode;\n  }\n>(({ className, children, ...props }, ref) => (\n  <div ref={ref} className={cx(styles.empty, className)} {...props}>\n    {children}\n  </div>\n));\n"],"names":["_jsx","Slot.Root"],"mappings":";;;;;;;;;;AAqBa,MAAA,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,QACEA,sBAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAC1C,MAAM,EAAE,YAAY,GAAGA,qBAAC,CAAA,QAAQ,KAAG,GAAG,OAAO,GAAGA,qBAAC,CAAAC,IAAS,EAAA,EAAA,CAAG,GAAG,SAAS,EACrE,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,IAAI,YAAY,EAAE;AAChB,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACED,qBAAC,CAAA,cAAc,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,EACtC,MAAM,EAAE,OAAO,GAAGA,qBAAA,CAACC,IAAS,EAAG,EAAA,CAAA,GAAG,SAAS,KACvC,KAAK,EAAA,CACT,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,qBAAqB,GAAG,UAAU,CAG7C,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,IAAI,YAAY,EAAE;AAChB,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACED,qBAAC,CAAA,aAAa,EACZ,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAC1C,MAAM,EAAE,OAAO,GAAGA,qBAAA,CAACC,IAAS,EAAG,EAAA,CAAA,GAAG,SAAS,KACvC,KAAK,EAAA,CACT,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,sBAAsB,GAAG,UAAU,CAK9C,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACvCD,+BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,KAAM,KAAK,EAAA,QAAA,EAC7D,QAAQ,EACL,CAAA,CACP;;;;"}
+{"version":3,"file":"dropdown-menu-misc.js","sources":["../../../components/dropdown-menu/dropdown-menu-misc.tsx"],"sourcesContent":["import {\n  MenuGroup,\n  MenuGroupLabel,\n  MenuGroupLabelProps,\n  MenuGroupProps,\n  MenuSeparator,\n  MenuSeparatorProps\n} from '@ariakit/react';\nimport { cx } from 'class-variance-authority';\nimport { Slot } from 'radix-ui';\nimport {\n  ElementRef,\n  Fragment,\n  HTMLAttributes,\n  ReactNode,\n  forwardRef\n} from 'react';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport styles from './dropdown-menu.module.css';\nimport { WithAsChild } from './types';\n\nexport const DropdownMenuGroup = forwardRef<\n  ElementRef<typeof MenuGroup>,\n  WithAsChild<MenuGroupProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  return (\n    <MenuGroup\n      ref={ref}\n      className={cx(styles.menugroup, className)}\n      render={shouldFilter ? <Fragment /> : asChild ? <Slot.Root /> : undefined}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuLabel = forwardRef<\n  ElementRef<typeof MenuGroupLabel>,\n  WithAsChild<MenuGroupLabelProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuGroupLabel\n      ref={ref}\n      className={cx(styles.label, className)}\n      render={asChild ? <Slot.Root /> : undefined}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuSeparator = forwardRef<\n  ElementRef<typeof MenuSeparator>,\n  WithAsChild<MenuSeparatorProps>\n>(({ className, asChild, ...props }, ref) => {\n  const { shouldFilter } = useDropdownContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuSeparator\n      ref={ref}\n      className={cx(styles.separator, className)}\n      render={asChild ? <Slot.Root /> : <div />}\n      {...props}\n    />\n  );\n});\n\nexport const DropdownMenuEmptyState = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement> & {\n    children: ReactNode;\n  }\n>(({ className, children, ...props }, ref) => (\n  <div ref={ref} className={cx(styles.empty, className)} {...props}>\n    {children}\n  </div>\n));\n"],"names":["_jsx","Slot.Root"],"mappings":";;;;;;;;;;AAqBa,MAAA,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,QACEA,sBAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAC1C,MAAM,EAAE,YAAY,GAAGA,qBAAC,CAAA,QAAQ,KAAG,GAAG,OAAO,GAAGA,qBAAC,CAAAC,IAAS,EAAA,EAAA,CAAG,GAAG,SAAS,EACrE,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,IAAI,YAAY,EAAE;AAChB,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACED,qBAAC,CAAA,cAAc,EACb,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,EACtC,MAAM,EAAE,OAAO,GAAGA,qBAAA,CAACC,IAAS,EAAG,EAAA,CAAA,GAAG,SAAS,KACvC,KAAK,EAAA,CACT,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,qBAAqB,GAAG,UAAU,CAG7C,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1C,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAE9C,IAAI,YAAY,EAAE;AAChB,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACED,qBAAC,CAAA,aAAa,EACZ,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAC1C,MAAM,EAAE,OAAO,GAAGA,qBAAA,CAACC,IAAS,EAAG,EAAA,CAAA,GAAGD,qBAAA,CAAA,KAAA,EAAA,EAAA,CAAO,KACrC,KAAK,EAAA,CACT,EACF;AACJ,CAAC,EAAE;AAEU,MAAA,sBAAsB,GAAG,UAAU,CAK9C,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACvCA,+BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,KAAM,KAAK,EAAA,QAAA,EAC7D,QAAQ,EACL,CAAA,CACP;;;;"}

package/dist/components/dropdown-menu/dropdown-menu-root.cjs

@@ -15,35 +15,35 @@ const useDropdownContext = () => {
     if (!context)
         return {};
     const shouldFilter = !!(context?.autocomplete &&
-        context?.autocompleteMode === "auto" &&
+        context?.autocompleteMode === 'auto' &&
         context?.searchValue?.length);
     const shouldFilterParent = !!(context?.parent?.autocomplete &&
-        context?.parent?.autocompleteMode === "auto" &&
+        context?.parent?.autocompleteMode === 'auto' &&
         context?.parent?.searchValue?.length);
     return {
         ...context,
         shouldFilter,
         parent: context?.parent && {
             ...context.parent,
-            shouldFilter: shouldFilterParent,
-        },
+            shouldFilter: shouldFilterParent
+        }
     };
 };
-const DropdownMenuRoot = ({ autocomplete, autocompleteMode = "auto", searchValue: providedSearchValue, onSearch, focusLoop = true, defaultSearchValue = "", ...props }) => {
+const DropdownMenuRoot = ({ autocomplete, autocompleteMode = 'auto', searchValue: providedSearchValue, onSearch, focusLoop = true, defaultSearchValue = '', onOpenChange, ...props }) => {
     const [internalSearchValue, setInternalSearchValue] = React.useState(defaultSearchValue);
     const dropdownContext = useDropdownContext();
     const searchValue = providedSearchValue ?? internalSearchValue;
-    const setValue = (value) => {
+    const setValue = React.useCallback((value) => {
         setInternalSearchValue(value);
         onSearch?.(value);
-    };
-    const element = jsxRuntime.jsxRuntimeExports.jsx(menuProvider.MenuProvider, { focusLoop: focusLoop, ...props });
+    }, [onSearch]);
+    const element = (jsxRuntime.jsxRuntimeExports.jsx(menuProvider.MenuProvider, { focusLoop: focusLoop, setOpen: onOpenChange, ...props }));
     return (jsxRuntime.jsxRuntimeExports.jsx(DropdownContext.Provider, { value: {
             autocomplete,
             parent: dropdownContext,
             autocompleteMode,
-            searchValue,
-        }, children: autocomplete ? (jsxRuntime.jsxRuntimeExports.jsx(comboboxProvider.ComboboxProvider, { resetValueOnHide: true, focusLoop: focusLoop, includesBaseElement: false, value: searchValue, setValue: setValue, children: element })) : (element) }));
+            searchValue
+        }, children: autocomplete ? (jsxRuntime.jsxRuntimeExports.jsx(comboboxProvider.ComboboxProvider, { resetValueOnHide: true, focusLoop: focusLoop, includesBaseElement: false, value: searchValue, setOpen: onOpenChange, setValue: setValue, children: element })) : (element) }));
 };
 
 exports.DropdownContext = DropdownContext;

package/dist/components/dropdown-menu/dropdown-menu-root.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-root.cjs","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"sourcesContent":["import {\n  ComboboxProvider,\n  MenuProvider,\n  MenuProviderProps,\n} from \"@ariakit/react\";\nimport { createContext, useContext, useState } from \"react\";\n\ninterface CommonProps {\n  autocomplete?: boolean;\n  autocompleteMode?: \"auto\" | \"manual\";\n  searchValue?: string;\n}\n\ninterface DropdownContextValue extends CommonProps {\n  parent?: CommonProps;\n}\n\ninterface UseDropdownContext extends DropdownContextValue {\n  shouldFilter?: boolean;\n  parent?: CommonProps & {\n    shouldFilter?: boolean;\n  };\n}\n\n/**\n Root context to manage the Dropdown control\n @remarks Only for internal usage.\n */\n\nexport const DropdownContext = createContext<DropdownContextValue | undefined>(\n  undefined,\n);\n\nexport const useDropdownContext = (): UseDropdownContext => {\n  const context = useContext(DropdownContext);\n  if (!context) return {};\n\n  const shouldFilter = !!(\n    context?.autocomplete &&\n    context?.autocompleteMode === \"auto\" &&\n    context?.searchValue?.length\n  );\n\n  const shouldFilterParent = !!(\n    context?.parent?.autocomplete &&\n    context?.parent?.autocompleteMode === \"auto\" &&\n    context?.parent?.searchValue?.length\n  );\n\n  return {\n    ...context,\n    shouldFilter,\n    parent: context?.parent && {\n      ...context.parent,\n      shouldFilter: shouldFilterParent,\n    },\n  };\n};\n\nexport interface NormalDropdownMenuRootProps extends MenuProviderProps {\n  autocomplete?: false;\n  autocompleteMode?: never;\n  searchValue?: never;\n  onSearch?: never;\n  defaultSearchValue?: never;\n}\n\nexport interface AutocompleteDropdownMenuRootProps\n  extends MenuProviderProps,\n    CommonProps {\n  autocomplete: true;\n  onSearch?: (value: string) => void;\n  defaultSearchValue?: string;\n}\n\nexport type DropdownMenuRootProps =\n  | NormalDropdownMenuRootProps\n  | AutocompleteDropdownMenuRootProps;\n\nexport const DropdownMenuRoot = ({\n  autocomplete,\n  autocompleteMode = \"auto\",\n  searchValue: providedSearchValue,\n  onSearch,\n  focusLoop = true,\n  defaultSearchValue = \"\",\n  ...props\n}: DropdownMenuRootProps) => {\n  const [internalSearchValue, setInternalSearchValue] =\n    useState(defaultSearchValue);\n  const dropdownContext = useDropdownContext();\n\n  const searchValue = providedSearchValue ?? internalSearchValue;\n\n  const setValue = (value: string) => {\n    setInternalSearchValue(value);\n    onSearch?.(value);\n  };\n\n  const element = <MenuProvider focusLoop={focusLoop} {...props} />;\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        autocomplete,\n        parent: dropdownContext,\n        autocompleteMode,\n        searchValue,\n      }}>\n      {autocomplete ? (\n        <ComboboxProvider\n          resetValueOnHide\n          focusLoop={focusLoop}\n          includesBaseElement={false}\n          value={searchValue}\n          setValue={setValue}>\n          {element}\n        </ComboboxProvider>\n      ) : (\n        element\n      )}\n    </DropdownContext.Provider>\n  );\n};\n"],"names":["createContext","useContext","useState","_jsx","MenuProvider","ComboboxProvider"],"mappings":";;;;;;;AAwBA;;;AAGG;MAEU,eAAe,GAAGA,mBAAa,CAC1C,SAAS,EACT;AAEK,MAAM,kBAAkB,GAAG,MAAyB;AACzD,IAAA,MAAM,OAAO,GAAGC,gBAAU,CAAC,eAAe,CAAC,CAAC;AAC5C,IAAA,IAAI,CAAC,OAAO;AAAE,QAAA,OAAO,EAAE,CAAC;AAExB,IAAA,MAAM,YAAY,GAAG,CAAC,EACpB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,gBAAgB,KAAK,MAAM;AACpC,QAAA,OAAO,EAAE,WAAW,EAAE,MAAM,CAC7B,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAC1B,OAAO,EAAE,MAAM,EAAE,YAAY;AAC7B,QAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,KAAK,MAAM;AAC5C,QAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,CACrC,CAAC;IAEF,OAAO;AACL,QAAA,GAAG,OAAO;QACV,YAAY;AACZ,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI;YACzB,GAAG,OAAO,CAAC,MAAM;AACjB,YAAA,YAAY,EAAE,kBAAkB;AACjC,SAAA;KACF,CAAC;AACJ,EAAE;AAsBK,MAAM,gBAAgB,GAAG,CAAC,EAC/B,YAAY,EACZ,gBAAgB,GAAG,MAAM,EACzB,WAAW,EAAE,mBAAmB,EAChC,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,kBAAkB,GAAG,EAAE,EACvB,GAAG,KAAK,EACc,KAAI;IAC1B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GACjDC,cAAQ,CAAC,kBAAkB,CAAC,CAAC;AAC/B,IAAA,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;AAE7C,IAAA,MAAM,WAAW,GAAG,mBAAmB,IAAI,mBAAmB,CAAC;AAE/D,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAI;QACjC,sBAAsB,CAAC,KAAK,CAAC,CAAC;AAC9B,QAAA,QAAQ,GAAG,KAAK,CAAC,CAAC;AACpB,KAAC,CAAC;IAEF,MAAM,OAAO,GAAGC,gCAAA,CAACC,yBAAY,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA,GAAM,KAAK,EAAA,CAAI,CAAC;AAElE,IAAA,QACED,gCAAC,CAAA,eAAe,CAAC,QAAQ,EAAA,EACvB,KAAK,EAAE;YACL,YAAY;AACZ,YAAA,MAAM,EAAE,eAAe;YACvB,gBAAgB;YAChB,WAAW;AACZ,SAAA,EAAA,QAAA,EACA,YAAY,IACXA,iCAACE,iCAAgB,EAAA,EACf,gBAAgB,EAAA,IAAA,EAChB,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,QAAQ,YACjB,OAAO,EAAA,CACS,KAEnB,OAAO,CACR,EAAA,CACwB,EAC3B;AACJ;;;;;;"}
+{"version":3,"file":"dropdown-menu-root.cjs","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"sourcesContent":["import {\n  ComboboxProvider,\n  MenuProvider,\n  MenuProviderProps\n} from '@ariakit/react';\nimport { createContext, useCallback, useContext, useState } from 'react';\n\ninterface CommonProps {\n  autocomplete?: boolean;\n  autocompleteMode?: 'auto' | 'manual';\n  searchValue?: string;\n}\n\ninterface DropdownContextValue extends CommonProps {\n  parent?: CommonProps;\n}\n\ninterface UseDropdownContext extends DropdownContextValue {\n  shouldFilter?: boolean;\n  parent?: CommonProps & {\n    shouldFilter?: boolean;\n  };\n}\n\n/**\n Root context to manage the Dropdown control\n @remarks Only for internal usage.\n */\n\nexport const DropdownContext = createContext<DropdownContextValue | undefined>(\n  undefined\n);\n\nexport const useDropdownContext = (): UseDropdownContext => {\n  const context = useContext(DropdownContext);\n  if (!context) return {};\n\n  const shouldFilter = !!(\n    context?.autocomplete &&\n    context?.autocompleteMode === 'auto' &&\n    context?.searchValue?.length\n  );\n\n  const shouldFilterParent = !!(\n    context?.parent?.autocomplete &&\n    context?.parent?.autocompleteMode === 'auto' &&\n    context?.parent?.searchValue?.length\n  );\n\n  return {\n    ...context,\n    shouldFilter,\n    parent: context?.parent && {\n      ...context.parent,\n      shouldFilter: shouldFilterParent\n    }\n  };\n};\n\nexport interface BaseMenuProviderProps\n  extends Omit<MenuProviderProps, 'setOpen'> {\n  onOpenChange?: MenuProviderProps['setOpen'];\n}\n\nexport interface NormalDropdownMenuRootProps extends BaseMenuProviderProps {\n  autocomplete?: false;\n  autocompleteMode?: never;\n  searchValue?: never;\n  onSearch?: never;\n  defaultSearchValue?: never;\n}\n\nexport interface AutocompleteDropdownMenuRootProps\n  extends BaseMenuProviderProps,\n    CommonProps {\n  autocomplete: true;\n  onSearch?: (value: string) => void;\n  defaultSearchValue?: string;\n}\n\nexport type DropdownMenuRootProps =\n  | NormalDropdownMenuRootProps\n  | AutocompleteDropdownMenuRootProps;\n\nexport const DropdownMenuRoot = ({\n  autocomplete,\n  autocompleteMode = 'auto',\n  searchValue: providedSearchValue,\n  onSearch,\n  focusLoop = true,\n  defaultSearchValue = '',\n  onOpenChange,\n  ...props\n}: DropdownMenuRootProps) => {\n  const [internalSearchValue, setInternalSearchValue] =\n    useState(defaultSearchValue);\n  const dropdownContext = useDropdownContext();\n\n  const searchValue = providedSearchValue ?? internalSearchValue;\n\n  const setValue = useCallback(\n    (value: string) => {\n      setInternalSearchValue(value);\n      onSearch?.(value);\n    },\n    [onSearch]\n  );\n\n  const element = (\n    <MenuProvider focusLoop={focusLoop} setOpen={onOpenChange} {...props} />\n  );\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        autocomplete,\n        parent: dropdownContext,\n        autocompleteMode,\n        searchValue\n      }}\n    >\n      {autocomplete ? (\n        <ComboboxProvider\n          resetValueOnHide\n          focusLoop={focusLoop}\n          includesBaseElement={false}\n          value={searchValue}\n          setOpen={onOpenChange}\n          setValue={setValue}\n        >\n          {element}\n        </ComboboxProvider>\n      ) : (\n        element\n      )}\n    </DropdownContext.Provider>\n  );\n};\n"],"names":["createContext","useContext","useState","useCallback","_jsx","MenuProvider","ComboboxProvider"],"mappings":";;;;;;;AAwBA;;;AAGG;MAEU,eAAe,GAAGA,mBAAa,CAC1C,SAAS,EACT;AAEK,MAAM,kBAAkB,GAAG,MAAyB;AACzD,IAAA,MAAM,OAAO,GAAGC,gBAAU,CAAC,eAAe,CAAC,CAAC;AAC5C,IAAA,IAAI,CAAC,OAAO;AAAE,QAAA,OAAO,EAAE,CAAC;AAExB,IAAA,MAAM,YAAY,GAAG,CAAC,EACpB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,gBAAgB,KAAK,MAAM;AACpC,QAAA,OAAO,EAAE,WAAW,EAAE,MAAM,CAC7B,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAC1B,OAAO,EAAE,MAAM,EAAE,YAAY;AAC7B,QAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,KAAK,MAAM;AAC5C,QAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,CACrC,CAAC;IAEF,OAAO;AACL,QAAA,GAAG,OAAO;QACV,YAAY;AACZ,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI;YACzB,GAAG,OAAO,CAAC,MAAM;AACjB,YAAA,YAAY,EAAE,kBAAkB;AACjC,SAAA;KACF,CAAC;AACJ,EAAE;AA2BK,MAAM,gBAAgB,GAAG,CAAC,EAC/B,YAAY,EACZ,gBAAgB,GAAG,MAAM,EACzB,WAAW,EAAE,mBAAmB,EAChC,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,kBAAkB,GAAG,EAAE,EACvB,YAAY,EACZ,GAAG,KAAK,EACc,KAAI;IAC1B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GACjDC,cAAQ,CAAC,kBAAkB,CAAC,CAAC;AAC/B,IAAA,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;AAE7C,IAAA,MAAM,WAAW,GAAG,mBAAmB,IAAI,mBAAmB,CAAC;AAE/D,IAAA,MAAM,QAAQ,GAAGC,iBAAW,CAC1B,CAAC,KAAa,KAAI;QAChB,sBAAsB,CAAC,KAAK,CAAC,CAAC;AAC9B,QAAA,QAAQ,GAAG,KAAK,CAAC,CAAC;AACpB,KAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;AAEF,IAAA,MAAM,OAAO,IACXC,gCAAC,CAAAC,yBAAY,IAAC,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,KAAM,KAAK,EAAA,CAAI,CACzE,CAAC;AAEF,IAAA,QACED,gCAAC,CAAA,eAAe,CAAC,QAAQ,EAAA,EACvB,KAAK,EAAE;YACL,YAAY;AACZ,YAAA,MAAM,EAAE,eAAe;YACvB,gBAAgB;YAChB,WAAW;AACZ,SAAA,EAAA,QAAA,EAEA,YAAY,IACXA,gCAAA,CAACE,iCAAgB,EACf,EAAA,gBAAgB,EAChB,IAAA,EAAA,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,QAAQ,EAEjB,QAAA,EAAA,OAAO,GACS,KAEnB,OAAO,CACR,EAAA,CACwB,EAC3B;AACJ;;;;;;"}

package/dist/components/dropdown-menu/dropdown-menu-root.d.ts

@@ -1,7 +1,7 @@
-import { MenuProviderProps } from "@ariakit/react";
+import { MenuProviderProps } from '@ariakit/react';
 interface CommonProps {
     autocomplete?: boolean;
-    autocompleteMode?: "auto" | "manual";
+    autocompleteMode?: 'auto' | 'manual';
     searchValue?: string;
 }
 interface DropdownContextValue extends CommonProps {
@@ -19,19 +19,22 @@ interface UseDropdownContext extends DropdownContextValue {
  */
 export declare const DropdownContext: import("react").Context<DropdownContextValue | undefined>;
 export declare const useDropdownContext: () => UseDropdownContext;
-export interface NormalDropdownMenuRootProps extends MenuProviderProps {
+export interface BaseMenuProviderProps extends Omit<MenuProviderProps, 'setOpen'> {
+    onOpenChange?: MenuProviderProps['setOpen'];
+}
+export interface NormalDropdownMenuRootProps extends BaseMenuProviderProps {
     autocomplete?: false;
     autocompleteMode?: never;
     searchValue?: never;
     onSearch?: never;
     defaultSearchValue?: never;
 }
-export interface AutocompleteDropdownMenuRootProps extends MenuProviderProps, CommonProps {
+export interface AutocompleteDropdownMenuRootProps extends BaseMenuProviderProps, CommonProps {
     autocomplete: true;
     onSearch?: (value: string) => void;
     defaultSearchValue?: string;
 }
 export type DropdownMenuRootProps = NormalDropdownMenuRootProps | AutocompleteDropdownMenuRootProps;
-export declare const DropdownMenuRoot: ({ autocomplete, autocompleteMode, searchValue: providedSearchValue, onSearch, focusLoop, defaultSearchValue, ...props }: DropdownMenuRootProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DropdownMenuRoot: ({ autocomplete, autocompleteMode, searchValue: providedSearchValue, onSearch, focusLoop, defaultSearchValue, onOpenChange, ...props }: DropdownMenuRootProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=dropdown-menu-root.d.ts.map

package/dist/components/dropdown-menu/dropdown-menu-root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-root.d.ts","sourceRoot":"","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAClB,MAAM,gBAAgB,CAAC;AAGxB,UAAU,WAAW;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,oBAAqB,SAAQ,WAAW;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED,UAAU,kBAAmB,SAAQ,oBAAoB;IACvD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,WAAW,GAAG;QACrB,YAAY,CAAC,EAAE,OAAO,CAAC;KACxB,CAAC;CACH;AAED;;;GAGG;AAEH,eAAO,MAAM,eAAe,2DAE3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,QAAO,kBAwBrC,CAAC;AAEF,MAAM,WAAW,2BAA4B,SAAQ,iBAAiB;IACpE,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAC;IACzB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B;AAED,MAAM,WAAW,iCACf,SAAQ,iBAAiB,EACvB,WAAW;IACb,YAAY,EAAE,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,qBAAqB,GAC7B,2BAA2B,GAC3B,iCAAiC,CAAC;AAEtC,eAAO,MAAM,gBAAgB,4HAQ1B,qBAAqB,4CAoCvB,CAAC"}
+{"version":3,"file":"dropdown-menu-root.d.ts","sourceRoot":"","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAClB,MAAM,gBAAgB,CAAC;AAGxB,UAAU,WAAW;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,oBAAqB,SAAQ,WAAW;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED,UAAU,kBAAmB,SAAQ,oBAAoB;IACvD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,WAAW,GAAG;QACrB,YAAY,CAAC,EAAE,OAAO,CAAC;KACxB,CAAC;CACH;AAED;;;GAGG;AAEH,eAAO,MAAM,eAAe,2DAE3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,QAAO,kBAwBrC,CAAC;AAEF,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC1C,YAAY,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;CAC7C;AAED,MAAM,WAAW,2BAA4B,SAAQ,qBAAqB;IACxE,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAC;IACzB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B;AAED,MAAM,WAAW,iCACf,SAAQ,qBAAqB,EAC3B,WAAW;IACb,YAAY,EAAE,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,qBAAqB,GAC7B,2BAA2B,GAC3B,iCAAiC,CAAC;AAEtC,eAAO,MAAM,gBAAgB,0IAS1B,qBAAqB,4CA4CvB,CAAC"}

package/dist/components/dropdown-menu/dropdown-menu-root.js

@@ -1,7 +1,7 @@
 import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
 import { MenuProvider } from '../../node_modules/.pnpm/@ariakit_react-core@0.4.16_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@ariakit/react-core/esm/menu/menu-provider.js';
 import { ComboboxProvider } from '../../node_modules/.pnpm/@ariakit_react-core@0.4.16_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@ariakit/react-core/esm/combobox/combobox-provider.js';
-import { createContext, useContext, useState } from 'react';
+import { createContext, useContext, useState, useCallback } from 'react';
 
 /**
  Root context to manage the Dropdown control
@@ -13,35 +13,35 @@ const useDropdownContext = () => {
     if (!context)
         return {};
     const shouldFilter = !!(context?.autocomplete &&
-        context?.autocompleteMode === "auto" &&
+        context?.autocompleteMode === 'auto' &&
         context?.searchValue?.length);
     const shouldFilterParent = !!(context?.parent?.autocomplete &&
-        context?.parent?.autocompleteMode === "auto" &&
+        context?.parent?.autocompleteMode === 'auto' &&
         context?.parent?.searchValue?.length);
     return {
         ...context,
         shouldFilter,
         parent: context?.parent && {
             ...context.parent,
-            shouldFilter: shouldFilterParent,
-        },
+            shouldFilter: shouldFilterParent
+        }
     };
 };
-const DropdownMenuRoot = ({ autocomplete, autocompleteMode = "auto", searchValue: providedSearchValue, onSearch, focusLoop = true, defaultSearchValue = "", ...props }) => {
+const DropdownMenuRoot = ({ autocomplete, autocompleteMode = 'auto', searchValue: providedSearchValue, onSearch, focusLoop = true, defaultSearchValue = '', onOpenChange, ...props }) => {
     const [internalSearchValue, setInternalSearchValue] = useState(defaultSearchValue);
     const dropdownContext = useDropdownContext();
     const searchValue = providedSearchValue ?? internalSearchValue;
-    const setValue = (value) => {
+    const setValue = useCallback((value) => {
         setInternalSearchValue(value);
         onSearch?.(value);
-    };
-    const element = jsxRuntimeExports.jsx(MenuProvider, { focusLoop: focusLoop, ...props });
+    }, [onSearch]);
+    const element = (jsxRuntimeExports.jsx(MenuProvider, { focusLoop: focusLoop, setOpen: onOpenChange, ...props }));
     return (jsxRuntimeExports.jsx(DropdownContext.Provider, { value: {
             autocomplete,
             parent: dropdownContext,
             autocompleteMode,
-            searchValue,
-        }, children: autocomplete ? (jsxRuntimeExports.jsx(ComboboxProvider, { resetValueOnHide: true, focusLoop: focusLoop, includesBaseElement: false, value: searchValue, setValue: setValue, children: element })) : (element) }));
+            searchValue
+        }, children: autocomplete ? (jsxRuntimeExports.jsx(ComboboxProvider, { resetValueOnHide: true, focusLoop: focusLoop, includesBaseElement: false, value: searchValue, setOpen: onOpenChange, setValue: setValue, children: element })) : (element) }));
 };
 
 export { DropdownContext, DropdownMenuRoot, useDropdownContext };

package/dist/components/dropdown-menu/dropdown-menu-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-root.js","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"sourcesContent":["import {\n  ComboboxProvider,\n  MenuProvider,\n  MenuProviderProps,\n} from \"@ariakit/react\";\nimport { createContext, useContext, useState } from \"react\";\n\ninterface CommonProps {\n  autocomplete?: boolean;\n  autocompleteMode?: \"auto\" | \"manual\";\n  searchValue?: string;\n}\n\ninterface DropdownContextValue extends CommonProps {\n  parent?: CommonProps;\n}\n\ninterface UseDropdownContext extends DropdownContextValue {\n  shouldFilter?: boolean;\n  parent?: CommonProps & {\n    shouldFilter?: boolean;\n  };\n}\n\n/**\n Root context to manage the Dropdown control\n @remarks Only for internal usage.\n */\n\nexport const DropdownContext = createContext<DropdownContextValue | undefined>(\n  undefined,\n);\n\nexport const useDropdownContext = (): UseDropdownContext => {\n  const context = useContext(DropdownContext);\n  if (!context) return {};\n\n  const shouldFilter = !!(\n    context?.autocomplete &&\n    context?.autocompleteMode === \"auto\" &&\n    context?.searchValue?.length\n  );\n\n  const shouldFilterParent = !!(\n    context?.parent?.autocomplete &&\n    context?.parent?.autocompleteMode === \"auto\" &&\n    context?.parent?.searchValue?.length\n  );\n\n  return {\n    ...context,\n    shouldFilter,\n    parent: context?.parent && {\n      ...context.parent,\n      shouldFilter: shouldFilterParent,\n    },\n  };\n};\n\nexport interface NormalDropdownMenuRootProps extends MenuProviderProps {\n  autocomplete?: false;\n  autocompleteMode?: never;\n  searchValue?: never;\n  onSearch?: never;\n  defaultSearchValue?: never;\n}\n\nexport interface AutocompleteDropdownMenuRootProps\n  extends MenuProviderProps,\n    CommonProps {\n  autocomplete: true;\n  onSearch?: (value: string) => void;\n  defaultSearchValue?: string;\n}\n\nexport type DropdownMenuRootProps =\n  | NormalDropdownMenuRootProps\n  | AutocompleteDropdownMenuRootProps;\n\nexport const DropdownMenuRoot = ({\n  autocomplete,\n  autocompleteMode = \"auto\",\n  searchValue: providedSearchValue,\n  onSearch,\n  focusLoop = true,\n  defaultSearchValue = \"\",\n  ...props\n}: DropdownMenuRootProps) => {\n  const [internalSearchValue, setInternalSearchValue] =\n    useState(defaultSearchValue);\n  const dropdownContext = useDropdownContext();\n\n  const searchValue = providedSearchValue ?? internalSearchValue;\n\n  const setValue = (value: string) => {\n    setInternalSearchValue(value);\n    onSearch?.(value);\n  };\n\n  const element = <MenuProvider focusLoop={focusLoop} {...props} />;\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        autocomplete,\n        parent: dropdownContext,\n        autocompleteMode,\n        searchValue,\n      }}>\n      {autocomplete ? (\n        <ComboboxProvider\n          resetValueOnHide\n          focusLoop={focusLoop}\n          includesBaseElement={false}\n          value={searchValue}\n          setValue={setValue}>\n          {element}\n        </ComboboxProvider>\n      ) : (\n        element\n      )}\n    </DropdownContext.Provider>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAwBA;;;AAGG;MAEU,eAAe,GAAG,aAAa,CAC1C,SAAS,EACT;AAEK,MAAM,kBAAkB,GAAG,MAAyB;AACzD,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;AAC5C,IAAA,IAAI,CAAC,OAAO;AAAE,QAAA,OAAO,EAAE,CAAC;AAExB,IAAA,MAAM,YAAY,GAAG,CAAC,EACpB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,gBAAgB,KAAK,MAAM;AACpC,QAAA,OAAO,EAAE,WAAW,EAAE,MAAM,CAC7B,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAC1B,OAAO,EAAE,MAAM,EAAE,YAAY;AAC7B,QAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,KAAK,MAAM;AAC5C,QAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,CACrC,CAAC;IAEF,OAAO;AACL,QAAA,GAAG,OAAO;QACV,YAAY;AACZ,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI;YACzB,GAAG,OAAO,CAAC,MAAM;AACjB,YAAA,YAAY,EAAE,kBAAkB;AACjC,SAAA;KACF,CAAC;AACJ,EAAE;AAsBK,MAAM,gBAAgB,GAAG,CAAC,EAC/B,YAAY,EACZ,gBAAgB,GAAG,MAAM,EACzB,WAAW,EAAE,mBAAmB,EAChC,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,kBAAkB,GAAG,EAAE,EACvB,GAAG,KAAK,EACc,KAAI;IAC1B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GACjD,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAC/B,IAAA,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;AAE7C,IAAA,MAAM,WAAW,GAAG,mBAAmB,IAAI,mBAAmB,CAAC;AAE/D,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAI;QACjC,sBAAsB,CAAC,KAAK,CAAC,CAAC;AAC9B,QAAA,QAAQ,GAAG,KAAK,CAAC,CAAC;AACpB,KAAC,CAAC;IAEF,MAAM,OAAO,GAAGA,qBAAA,CAAC,YAAY,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA,GAAM,KAAK,EAAA,CAAI,CAAC;AAElE,IAAA,QACEA,qBAAC,CAAA,eAAe,CAAC,QAAQ,EAAA,EACvB,KAAK,EAAE;YACL,YAAY;AACZ,YAAA,MAAM,EAAE,eAAe;YACvB,gBAAgB;YAChB,WAAW;AACZ,SAAA,EAAA,QAAA,EACA,YAAY,IACXA,sBAAC,gBAAgB,EAAA,EACf,gBAAgB,EAAA,IAAA,EAChB,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,QAAQ,YACjB,OAAO,EAAA,CACS,KAEnB,OAAO,CACR,EAAA,CACwB,EAC3B;AACJ;;;;"}
+{"version":3,"file":"dropdown-menu-root.js","sources":["../../../components/dropdown-menu/dropdown-menu-root.tsx"],"sourcesContent":["import {\n  ComboboxProvider,\n  MenuProvider,\n  MenuProviderProps\n} from '@ariakit/react';\nimport { createContext, useCallback, useContext, useState } from 'react';\n\ninterface CommonProps {\n  autocomplete?: boolean;\n  autocompleteMode?: 'auto' | 'manual';\n  searchValue?: string;\n}\n\ninterface DropdownContextValue extends CommonProps {\n  parent?: CommonProps;\n}\n\ninterface UseDropdownContext extends DropdownContextValue {\n  shouldFilter?: boolean;\n  parent?: CommonProps & {\n    shouldFilter?: boolean;\n  };\n}\n\n/**\n Root context to manage the Dropdown control\n @remarks Only for internal usage.\n */\n\nexport const DropdownContext = createContext<DropdownContextValue | undefined>(\n  undefined\n);\n\nexport const useDropdownContext = (): UseDropdownContext => {\n  const context = useContext(DropdownContext);\n  if (!context) return {};\n\n  const shouldFilter = !!(\n    context?.autocomplete &&\n    context?.autocompleteMode === 'auto' &&\n    context?.searchValue?.length\n  );\n\n  const shouldFilterParent = !!(\n    context?.parent?.autocomplete &&\n    context?.parent?.autocompleteMode === 'auto' &&\n    context?.parent?.searchValue?.length\n  );\n\n  return {\n    ...context,\n    shouldFilter,\n    parent: context?.parent && {\n      ...context.parent,\n      shouldFilter: shouldFilterParent\n    }\n  };\n};\n\nexport interface BaseMenuProviderProps\n  extends Omit<MenuProviderProps, 'setOpen'> {\n  onOpenChange?: MenuProviderProps['setOpen'];\n}\n\nexport interface NormalDropdownMenuRootProps extends BaseMenuProviderProps {\n  autocomplete?: false;\n  autocompleteMode?: never;\n  searchValue?: never;\n  onSearch?: never;\n  defaultSearchValue?: never;\n}\n\nexport interface AutocompleteDropdownMenuRootProps\n  extends BaseMenuProviderProps,\n    CommonProps {\n  autocomplete: true;\n  onSearch?: (value: string) => void;\n  defaultSearchValue?: string;\n}\n\nexport type DropdownMenuRootProps =\n  | NormalDropdownMenuRootProps\n  | AutocompleteDropdownMenuRootProps;\n\nexport const DropdownMenuRoot = ({\n  autocomplete,\n  autocompleteMode = 'auto',\n  searchValue: providedSearchValue,\n  onSearch,\n  focusLoop = true,\n  defaultSearchValue = '',\n  onOpenChange,\n  ...props\n}: DropdownMenuRootProps) => {\n  const [internalSearchValue, setInternalSearchValue] =\n    useState(defaultSearchValue);\n  const dropdownContext = useDropdownContext();\n\n  const searchValue = providedSearchValue ?? internalSearchValue;\n\n  const setValue = useCallback(\n    (value: string) => {\n      setInternalSearchValue(value);\n      onSearch?.(value);\n    },\n    [onSearch]\n  );\n\n  const element = (\n    <MenuProvider focusLoop={focusLoop} setOpen={onOpenChange} {...props} />\n  );\n\n  return (\n    <DropdownContext.Provider\n      value={{\n        autocomplete,\n        parent: dropdownContext,\n        autocompleteMode,\n        searchValue\n      }}\n    >\n      {autocomplete ? (\n        <ComboboxProvider\n          resetValueOnHide\n          focusLoop={focusLoop}\n          includesBaseElement={false}\n          value={searchValue}\n          setOpen={onOpenChange}\n          setValue={setValue}\n        >\n          {element}\n        </ComboboxProvider>\n      ) : (\n        element\n      )}\n    </DropdownContext.Provider>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAwBA;;;AAGG;MAEU,eAAe,GAAG,aAAa,CAC1C,SAAS,EACT;AAEK,MAAM,kBAAkB,GAAG,MAAyB;AACzD,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;AAC5C,IAAA,IAAI,CAAC,OAAO;AAAE,QAAA,OAAO,EAAE,CAAC;AAExB,IAAA,MAAM,YAAY,GAAG,CAAC,EACpB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,gBAAgB,KAAK,MAAM;AACpC,QAAA,OAAO,EAAE,WAAW,EAAE,MAAM,CAC7B,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAC1B,OAAO,EAAE,MAAM,EAAE,YAAY;AAC7B,QAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,KAAK,MAAM;AAC5C,QAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,CACrC,CAAC;IAEF,OAAO;AACL,QAAA,GAAG,OAAO;QACV,YAAY;AACZ,QAAA,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI;YACzB,GAAG,OAAO,CAAC,MAAM;AACjB,YAAA,YAAY,EAAE,kBAAkB;AACjC,SAAA;KACF,CAAC;AACJ,EAAE;AA2BK,MAAM,gBAAgB,GAAG,CAAC,EAC/B,YAAY,EACZ,gBAAgB,GAAG,MAAM,EACzB,WAAW,EAAE,mBAAmB,EAChC,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,kBAAkB,GAAG,EAAE,EACvB,YAAY,EACZ,GAAG,KAAK,EACc,KAAI;IAC1B,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GACjD,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAC/B,IAAA,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;AAE7C,IAAA,MAAM,WAAW,GAAG,mBAAmB,IAAI,mBAAmB,CAAC;AAE/D,IAAA,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,KAAa,KAAI;QAChB,sBAAsB,CAAC,KAAK,CAAC,CAAC;AAC9B,QAAA,QAAQ,GAAG,KAAK,CAAC,CAAC;AACpB,KAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;AAEF,IAAA,MAAM,OAAO,IACXA,qBAAC,CAAA,YAAY,IAAC,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,KAAM,KAAK,EAAA,CAAI,CACzE,CAAC;AAEF,IAAA,QACEA,qBAAC,CAAA,eAAe,CAAC,QAAQ,EAAA,EACvB,KAAK,EAAE;YACL,YAAY;AACZ,YAAA,MAAM,EAAE,eAAe;YACvB,gBAAgB;YAChB,WAAW;AACZ,SAAA,EAAA,QAAA,EAEA,YAAY,IACXA,qBAAA,CAAC,gBAAgB,EACf,EAAA,gBAAgB,EAChB,IAAA,EAAA,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,KAAK,EAC1B,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,QAAQ,EAEjB,QAAA,EAAA,OAAO,GACS,KAEnB,OAAO,CACR,EAAA,CACwB,EAC3B;AACJ;;;;"}

package/dist/components/dropdown-menu/dropdown-menu-trigger.cjs

@@ -9,8 +9,12 @@ var dropdownMenuRoot = require('./dropdown-menu-root.cjs');
 var utils = require('./utils.cjs');
 var index = require('../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@18.2.12_react@18.2.0/node_modules/@radix-ui/react-slot/dist/index.cjs');
 
-const DropdownMenuTrigger = React.forwardRef(({ children, asChild, ...props }, ref) => {
-    return (jsxRuntime.jsxRuntimeExports.jsx(menuButton.MenuButton, { ref: ref, render: asChild ? jsxRuntime.jsxRuntimeExports.jsx(index.Root, {}) : undefined, ...props, children: children }));
+const DropdownMenuTrigger = React.forwardRef(({ children, asChild, stopPropagation = true, onClick, ...props }, ref) => {
+    return (jsxRuntime.jsxRuntimeExports.jsx(menuButton.MenuButton, { ref: ref, render: asChild ? jsxRuntime.jsxRuntimeExports.jsx(index.Root, {}) : undefined, onClick: (e) => {
+            if (stopPropagation)
+                e.stopPropagation();
+            onClick?.(e);
+        }, ...props, children: children }));
 });
 /**
  * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.

package/dist/components/dropdown-menu/dropdown-menu-trigger.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-trigger.cjs","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"sourcesContent":["import { MenuButton, MenuButtonProps } from '@ariakit/react';\nimport { Slot } from 'radix-ui';\nimport { forwardRef } from 'react';\nimport { TriangleRightIcon } from '~/icons';\nimport { DropdownMenuItem, DropdownMenuItemProps } from './dropdown-menu-item';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport { WithAsChild } from './types';\nimport { getMatch } from './utils';\n\nexport interface DropdownMenuTriggerProps\n  extends WithAsChild<MenuButtonProps> {}\n\nexport const DropdownMenuTrigger = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerProps\n>(({ children, asChild, ...props }, ref) => {\n  return (\n    <MenuButton\n      ref={ref}\n      render={asChild ? <Slot.Root /> : undefined}\n      {...props}\n    >\n      {children}\n    </MenuButton>\n  );\n});\n\nexport interface DropdownMenuTriggerItemProps extends DropdownMenuItemProps {}\n\n/**\n * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.\n */\nexport const DropdownMenuTriggerItem = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerItemProps\n>(\n  (\n    { children, value, trailingIcon = <TriangleRightIcon />, ...props },\n    ref\n  ) => {\n    const { parent } = useDropdownContext();\n\n    if (\n      parent?.shouldFilter &&\n      !getMatch(value, children, parent?.searchValue)\n    ) {\n      return null;\n    }\n\n    return (\n      <MenuButton\n        ref={ref}\n        render={\n          <DropdownMenuItem\n            value={value}\n            trailingIcon={trailingIcon}\n            {...props}\n            forceRender={parent?.autocomplete ? 'combobox' : 'auto'}\n          />\n        }\n      >\n        {children}\n      </MenuButton>\n    );\n  }\n);\n"],"names":["forwardRef","_jsx","MenuButton","Slot.Root","TriangleRightIcon","useDropdownContext","getMatch","DropdownMenuItem"],"mappings":";;;;;;;;;;;AAYa,MAAA,mBAAmB,GAAGA,gBAAU,CAG3C,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AACzC,IAAA,QACEC,gCAAA,CAACC,qBAAU,EAAA,EACT,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,OAAO,GAAGD,gCAAC,CAAAE,UAAS,EAAG,EAAA,CAAA,GAAG,SAAS,EAAA,GACvC,KAAK,EAAA,QAAA,EAER,QAAQ,EAAA,CACE,EACb;AACJ,CAAC,EAAE;AAIH;;AAEG;AACU,MAAA,uBAAuB,GAAGH,gBAAU,CAI/C,CACE,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,GAAGC,gCAAA,CAACG,4BAAiB,EAAA,EAAA,CAAG,EAAE,GAAG,KAAK,EAAE,EACnE,GAAG,KACD;AACF,IAAA,MAAM,EAAE,MAAM,EAAE,GAAGC,mCAAkB,EAAE,CAAC;IAExC,IACE,MAAM,EAAE,YAAY;QACpB,CAACC,cAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAC/C;AACA,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACEL,gCAAC,CAAAC,qBAAU,IACT,GAAG,EAAE,GAAG,EACR,MAAM,EACJD,gCAAA,CAACM,iCAAgB,EACf,EAAA,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EACtB,GAAA,KAAK,EACT,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,EAAA,CACvD,YAGH,QAAQ,EAAA,CACE,EACb;AACJ,CAAC;;;;;"}
+{"version":3,"file":"dropdown-menu-trigger.cjs","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"sourcesContent":["import { MenuButton, MenuButtonProps } from '@ariakit/react';\nimport { Slot } from 'radix-ui';\nimport { PointerEvent, forwardRef } from 'react';\nimport { TriangleRightIcon } from '~/icons';\nimport { DropdownMenuItem, DropdownMenuItemProps } from './dropdown-menu-item';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport { WithAsChild } from './types';\nimport { getMatch } from './utils';\n\nexport interface DropdownMenuTriggerProps extends WithAsChild<MenuButtonProps> {\n  stopPropagation?: boolean;\n}\n\nexport const DropdownMenuTrigger = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerProps\n>(({ children, asChild, stopPropagation = true, onClick, ...props }, ref) => {\n  return (\n    <MenuButton\n      ref={ref}\n      render={asChild ? <Slot.Root /> : undefined}\n      onClick={(\n        e: PointerEvent<HTMLButtonElement> & PointerEvent<HTMLDivElement>\n      ) => {\n        if (stopPropagation) e.stopPropagation();\n        onClick?.(e);\n      }}\n      {...props}\n    >\n      {children}\n    </MenuButton>\n  );\n});\n\nexport interface DropdownMenuTriggerItemProps extends DropdownMenuItemProps {}\n\n/**\n * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.\n */\nexport const DropdownMenuTriggerItem = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerItemProps\n>(\n  (\n    { children, value, trailingIcon = <TriangleRightIcon />, ...props },\n    ref\n  ) => {\n    const { parent } = useDropdownContext();\n\n    if (\n      parent?.shouldFilter &&\n      !getMatch(value, children, parent?.searchValue)\n    ) {\n      return null;\n    }\n\n    return (\n      <MenuButton\n        ref={ref}\n        render={\n          <DropdownMenuItem\n            value={value}\n            trailingIcon={trailingIcon}\n            {...props}\n            forceRender={parent?.autocomplete ? 'combobox' : 'auto'}\n          />\n        }\n      >\n        {children}\n      </MenuButton>\n    );\n  }\n);\n"],"names":["forwardRef","_jsx","MenuButton","Slot.Root","TriangleRightIcon","useDropdownContext","getMatch","DropdownMenuItem"],"mappings":";;;;;;;;;;;AAaa,MAAA,mBAAmB,GAAGA,gBAAU,CAG3C,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,eAAe,GAAG,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1E,IAAA,QACEC,gCAAA,CAACC,qBAAU,EAAA,EACT,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,OAAO,GAAGD,gCAAC,CAAAE,UAAS,EAAG,EAAA,CAAA,GAAG,SAAS,EAC3C,OAAO,EAAE,CACP,CAAiE,KAC/D;AACF,YAAA,IAAI,eAAe;gBAAE,CAAC,CAAC,eAAe,EAAE,CAAC;AACzC,YAAA,OAAO,GAAG,CAAC,CAAC,CAAC;AACf,SAAC,KACG,KAAK,EAAA,QAAA,EAER,QAAQ,EAAA,CACE,EACb;AACJ,CAAC,EAAE;AAIH;;AAEG;AACU,MAAA,uBAAuB,GAAGH,gBAAU,CAI/C,CACE,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,GAAGC,gCAAA,CAACG,4BAAiB,EAAA,EAAA,CAAG,EAAE,GAAG,KAAK,EAAE,EACnE,GAAG,KACD;AACF,IAAA,MAAM,EAAE,MAAM,EAAE,GAAGC,mCAAkB,EAAE,CAAC;IAExC,IACE,MAAM,EAAE,YAAY;QACpB,CAACC,cAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAC/C;AACA,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACEL,gCAAC,CAAAC,qBAAU,IACT,GAAG,EAAE,GAAG,EACR,MAAM,EACJD,gCAAA,CAACM,iCAAgB,EACf,EAAA,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EACtB,GAAA,KAAK,EACT,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,EAAA,CACvD,YAGH,QAAQ,EAAA,CACE,EACb;AACJ,CAAC;;;;;"}

package/dist/components/dropdown-menu/dropdown-menu-trigger.d.ts

@@ -2,6 +2,7 @@ import { MenuButtonProps } from '@ariakit/react';
 import { DropdownMenuItemProps } from './dropdown-menu-item';
 import { WithAsChild } from './types';
 export interface DropdownMenuTriggerProps extends WithAsChild<MenuButtonProps> {
+    stopPropagation?: boolean;
 }
 export declare const DropdownMenuTrigger: import("react").ForwardRefExoticComponent<Omit<DropdownMenuTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 export interface DropdownMenuTriggerItemProps extends DropdownMenuItemProps {

package/dist/components/dropdown-menu/dropdown-menu-trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-trigger.d.ts","sourceRoot":"","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAI7D,OAAO,EAAoB,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAE/E,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,MAAM,WAAW,wBACf,SAAQ,WAAW,CAAC,eAAe,CAAC;CAAG;AAEzC,eAAO,MAAM,mBAAmB,qIAa9B,CAAC;AAEH,MAAM,WAAW,4BAA6B,SAAQ,qBAAqB;CAAG;AAE9E;;GAEG;AACH,eAAO,MAAM,uBAAuB,yIAiCnC,CAAC"}
+{"version":3,"file":"dropdown-menu-trigger.d.ts","sourceRoot":"","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAI7D,OAAO,EAAoB,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAE/E,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,MAAM,WAAW,wBAAyB,SAAQ,WAAW,CAAC,eAAe,CAAC;IAC5E,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,mBAAmB,qIAmB9B,CAAC;AAEH,MAAM,WAAW,4BAA6B,SAAQ,qBAAqB;CAAG;AAE9E;;GAEG;AACH,eAAO,MAAM,uBAAuB,yIAiCnC,CAAC"}

package/dist/components/dropdown-menu/dropdown-menu-trigger.js

@@ -7,8 +7,12 @@ import { useDropdownContext } from './dropdown-menu-root.js';
 import { getMatch } from './utils.js';
 import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@18.2.12_react@18.2.0/node_modules/@radix-ui/react-slot/dist/index.js';
 
-const DropdownMenuTrigger = forwardRef(({ children, asChild, ...props }, ref) => {
-    return (jsxRuntimeExports.jsx(MenuButton, { ref: ref, render: asChild ? jsxRuntimeExports.jsx(Slot, {}) : undefined, ...props, children: children }));
+const DropdownMenuTrigger = forwardRef(({ children, asChild, stopPropagation = true, onClick, ...props }, ref) => {
+    return (jsxRuntimeExports.jsx(MenuButton, { ref: ref, render: asChild ? jsxRuntimeExports.jsx(Slot, {}) : undefined, onClick: (e) => {
+            if (stopPropagation)
+                e.stopPropagation();
+            onClick?.(e);
+        }, ...props, children: children }));
 });
 /**
  * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.

package/dist/components/dropdown-menu/dropdown-menu-trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu-trigger.js","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"sourcesContent":["import { MenuButton, MenuButtonProps } from '@ariakit/react';\nimport { Slot } from 'radix-ui';\nimport { forwardRef } from 'react';\nimport { TriangleRightIcon } from '~/icons';\nimport { DropdownMenuItem, DropdownMenuItemProps } from './dropdown-menu-item';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport { WithAsChild } from './types';\nimport { getMatch } from './utils';\n\nexport interface DropdownMenuTriggerProps\n  extends WithAsChild<MenuButtonProps> {}\n\nexport const DropdownMenuTrigger = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerProps\n>(({ children, asChild, ...props }, ref) => {\n  return (\n    <MenuButton\n      ref={ref}\n      render={asChild ? <Slot.Root /> : undefined}\n      {...props}\n    >\n      {children}\n    </MenuButton>\n  );\n});\n\nexport interface DropdownMenuTriggerItemProps extends DropdownMenuItemProps {}\n\n/**\n * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.\n */\nexport const DropdownMenuTriggerItem = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerItemProps\n>(\n  (\n    { children, value, trailingIcon = <TriangleRightIcon />, ...props },\n    ref\n  ) => {\n    const { parent } = useDropdownContext();\n\n    if (\n      parent?.shouldFilter &&\n      !getMatch(value, children, parent?.searchValue)\n    ) {\n      return null;\n    }\n\n    return (\n      <MenuButton\n        ref={ref}\n        render={\n          <DropdownMenuItem\n            value={value}\n            trailingIcon={trailingIcon}\n            {...props}\n            forceRender={parent?.autocomplete ? 'combobox' : 'auto'}\n          />\n        }\n      >\n        {children}\n      </MenuButton>\n    );\n  }\n);\n"],"names":["_jsx","Slot.Root","TriangleRightIcon"],"mappings":";;;;;;;;;AAYa,MAAA,mBAAmB,GAAG,UAAU,CAG3C,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AACzC,IAAA,QACEA,qBAAA,CAAC,UAAU,EAAA,EACT,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,OAAO,GAAGA,qBAAC,CAAAC,IAAS,EAAG,EAAA,CAAA,GAAG,SAAS,EAAA,GACvC,KAAK,EAAA,QAAA,EAER,QAAQ,EAAA,CACE,EACb;AACJ,CAAC,EAAE;AAIH;;AAEG;AACU,MAAA,uBAAuB,GAAG,UAAU,CAI/C,CACE,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,GAAGD,qBAAA,CAACE,gBAAiB,EAAA,EAAA,CAAG,EAAE,GAAG,KAAK,EAAE,EACnE,GAAG,KACD;AACF,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAExC,IACE,MAAM,EAAE,YAAY;QACpB,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAC/C;AACA,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACEF,qBAAC,CAAA,UAAU,IACT,GAAG,EAAE,GAAG,EACR,MAAM,EACJA,qBAAA,CAAC,gBAAgB,EACf,EAAA,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EACtB,GAAA,KAAK,EACT,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,EAAA,CACvD,YAGH,QAAQ,EAAA,CACE,EACb;AACJ,CAAC;;;;"}
+{"version":3,"file":"dropdown-menu-trigger.js","sources":["../../../components/dropdown-menu/dropdown-menu-trigger.tsx"],"sourcesContent":["import { MenuButton, MenuButtonProps } from '@ariakit/react';\nimport { Slot } from 'radix-ui';\nimport { PointerEvent, forwardRef } from 'react';\nimport { TriangleRightIcon } from '~/icons';\nimport { DropdownMenuItem, DropdownMenuItemProps } from './dropdown-menu-item';\nimport { useDropdownContext } from './dropdown-menu-root';\nimport { WithAsChild } from './types';\nimport { getMatch } from './utils';\n\nexport interface DropdownMenuTriggerProps extends WithAsChild<MenuButtonProps> {\n  stopPropagation?: boolean;\n}\n\nexport const DropdownMenuTrigger = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerProps\n>(({ children, asChild, stopPropagation = true, onClick, ...props }, ref) => {\n  return (\n    <MenuButton\n      ref={ref}\n      render={asChild ? <Slot.Root /> : undefined}\n      onClick={(\n        e: PointerEvent<HTMLButtonElement> & PointerEvent<HTMLDivElement>\n      ) => {\n        if (stopPropagation) e.stopPropagation();\n        onClick?.(e);\n      }}\n      {...props}\n    >\n      {children}\n    </MenuButton>\n  );\n});\n\nexport interface DropdownMenuTriggerItemProps extends DropdownMenuItemProps {}\n\n/**\n * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.\n */\nexport const DropdownMenuTriggerItem = forwardRef<\n  HTMLButtonElement,\n  DropdownMenuTriggerItemProps\n>(\n  (\n    { children, value, trailingIcon = <TriangleRightIcon />, ...props },\n    ref\n  ) => {\n    const { parent } = useDropdownContext();\n\n    if (\n      parent?.shouldFilter &&\n      !getMatch(value, children, parent?.searchValue)\n    ) {\n      return null;\n    }\n\n    return (\n      <MenuButton\n        ref={ref}\n        render={\n          <DropdownMenuItem\n            value={value}\n            trailingIcon={trailingIcon}\n            {...props}\n            forceRender={parent?.autocomplete ? 'combobox' : 'auto'}\n          />\n        }\n      >\n        {children}\n      </MenuButton>\n    );\n  }\n);\n"],"names":["_jsx","Slot.Root","TriangleRightIcon"],"mappings":";;;;;;;;;AAaa,MAAA,mBAAmB,GAAG,UAAU,CAG3C,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,eAAe,GAAG,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC1E,IAAA,QACEA,qBAAA,CAAC,UAAU,EAAA,EACT,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,OAAO,GAAGA,qBAAC,CAAAC,IAAS,EAAG,EAAA,CAAA,GAAG,SAAS,EAC3C,OAAO,EAAE,CACP,CAAiE,KAC/D;AACF,YAAA,IAAI,eAAe;gBAAE,CAAC,CAAC,eAAe,EAAE,CAAC;AACzC,YAAA,OAAO,GAAG,CAAC,CAAC,CAAC;AACf,SAAC,KACG,KAAK,EAAA,QAAA,EAER,QAAQ,EAAA,CACE,EACb;AACJ,CAAC,EAAE;AAIH;;AAEG;AACU,MAAA,uBAAuB,GAAG,UAAU,CAI/C,CACE,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,GAAGD,qBAAA,CAACE,gBAAiB,EAAA,EAAA,CAAG,EAAE,GAAG,KAAK,EAAE,EACnE,GAAG,KACD;AACF,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAExC,IACE,MAAM,EAAE,YAAY;QACpB,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,EAC/C;AACA,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACEF,qBAAC,CAAA,UAAU,IACT,GAAG,EAAE,GAAG,EACR,MAAM,EACJA,qBAAA,CAAC,gBAAgB,EACf,EAAA,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EACtB,GAAA,KAAK,EACT,WAAW,EAAE,MAAM,EAAE,YAAY,GAAG,UAAU,GAAG,MAAM,EAAA,CACvD,YAGH,QAAQ,EAAA,CACE,EACb;AACJ,CAAC;;;;"}

package/dist/components/dropdown-menu/dropdown-menu.d.ts

@@ -1,4 +1,4 @@
-export declare const DropdownMenu: (({ autocomplete, autocompleteMode, searchValue: providedSearchValue, onSearch, focusLoop, defaultSearchValue, ...props }: import("./dropdown-menu-root").DropdownMenuRootProps) => import("react/jsx-runtime").JSX.Element) & {
+export declare const DropdownMenu: (({ autocomplete, autocompleteMode, searchValue: providedSearchValue, onSearch, focusLoop, defaultSearchValue, onOpenChange, ...props }: import("./dropdown-menu-root").DropdownMenuRootProps) => import("react/jsx-runtime").JSX.Element) & {
     Trigger: import("react").ForwardRefExoticComponent<Omit<import("./dropdown-menu-trigger").DropdownMenuTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
     /**
      * `TriggerItem` is a helper component that renders a `Trigger` as a `MenuItem`.

package/dist/components/filter-chip/filter-chip-operation.cjs

@@ -0,0 +1,31 @@
+'use strict';
+
+var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
+var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var React = require('react');
+var select = require('../select/select.cjs');
+var text = require('../text/text.cjs');
+var filterChip_module = require('./filter-chip.module.css.cjs');
+
+const Operation = ({ label, value, onChange, operations, showAlternateLabel = false }) => {
+    const operationValue = value?.value ?? '';
+    const handleValueChange = React.useCallback((newValue) => {
+        const operation = operations.find(o => o.value === newValue);
+        if (operation)
+            onChange(operation);
+    }, [operations, onChange]);
+    if (operations.length === 1)
+        return (jsxRuntime.jsxRuntimeExports.jsx(text.Text, { variant: 'secondary', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), children: operations[0].label }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), "aria-label": `${label} filter operation`, iconProps: {
+                    style: {
+                        display: 'none'
+                    }
+                }, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select operation', className: filterChip_module.default.operationText }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
+                    return (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: showAlternateLabel && operation?.alternateLabel
+                            ? operation.alternateLabel
+                            : operation.label }, operation.value));
+                }) })] }));
+};
+
+exports.Operation = Operation;
+//# sourceMappingURL=filter-chip-operation.cjs.map

package/dist/components/filter-chip/filter-chip-operation.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-chip-operation.cjs","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n  label: string;\n  value?: FilterOperation;\n  onChange: (operation: FilterOperation) => void;\n  operations: FilterOperator<string>[];\n  showAlternateLabel?: boolean;\n}\n\nexport const Operation = ({\n  label,\n  value,\n  onChange,\n  operations,\n  showAlternateLabel = false\n}: OperationProps) => {\n  const operationValue = value?.value ?? '';\n\n  const handleValueChange = useCallback(\n    (newValue: string) => {\n      const operation = operations.find(o => o.value === newValue);\n      if (operation) onChange(operation);\n    },\n    [operations, onChange]\n  );\n\n  if (operations.length === 1)\n    return (\n      <Text\n        variant='secondary'\n        className={cx(styles.selectValue, styles.operationValue)}\n      >\n        {operations[0].label}\n      </Text>\n    );\n\n  return (\n    <Select\n      value={operationValue}\n      onValueChange={handleValueChange}\n      aria-labelledby={`${label}-label`}\n    >\n      <Select.Trigger\n        variant='text'\n        className={cx(styles.selectValue, styles.operationValue)}\n        aria-label={`${label} filter operation`}\n        iconProps={{\n          style: {\n            display: 'none'\n          }\n        }}\n      >\n        <Select.Value\n          placeholder='Select operation'\n          className={styles.operationText}\n        />\n      </Select.Trigger>\n      <Select.Content data-variant='filter'>\n        {operations.map(operation => {\n          return (\n            <Select.Item\n              key={operation.value}\n              value={operation.value}\n              aria-label={`Filter ${label} ${operation.label}`}\n            >\n              {showAlternateLabel && operation?.alternateLabel\n                ? operation.alternateLabel\n                : operation.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n"],"names":["useCallback","_jsx","Text","cx","styles","_jsxs","Select"],"mappings":";;;;;;;;;AAea,MAAA,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,kBAAkB,GAAG,KAAK,EACX,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAGA,iBAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;AACzB,QAAA,QACEC,gCAAA,CAACC,SAAI,EAAA,EACH,OAAO,EAAC,WAAW,EACnB,SAAS,EAAEC,QAAE,CAACC,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,cAAc,CAAC,EAEvD,QAAA,EAAA,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAA,CACf,EACP;AAEJ,IAAA,QACEC,iCAAC,CAAAC,aAAM,IACL,KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,aAEjCL,gCAAC,CAAAK,aAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,EAAEH,QAAE,CAACC,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,cAAc,CAAC,EAC5C,YAAA,EAAA,CAAA,EAAG,KAAK,CAAmB,iBAAA,CAAA,EACvC,SAAS,EAAE;AACT,oBAAA,KAAK,EAAE;AACL,wBAAA,OAAO,EAAE,MAAM;AAChB,qBAAA;AACF,iBAAA,EAAA,QAAA,EAEDH,gCAAC,CAAAK,aAAM,CAAC,KAAK,EACX,EAAA,WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAEF,yBAAM,CAAC,aAAa,EAAA,CAC/B,EACa,CAAA,EACjBH,gCAAC,CAAAK,aAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;oBAC1B,QACEL,gCAAC,CAAAK,aAAM,CAAC,IAAI,IAEV,KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,UAAU,KAAK,CAAA,CAAA,EAAI,SAAS,CAAC,KAAK,CAAA,CAAE,YAE/C,kBAAkB,IAAI,SAAS,EAAE,cAAc;8BAC5C,SAAS,CAAC,cAAc;8BACxB,SAAS,CAAC,KAAK,EAAA,EANd,SAAS,CAAC,KAAK,CAOR,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}

package/dist/components/filter-chip/filter-chip-operation.d.ts

@@ -0,0 +1,11 @@
+import { FilterOperation, FilterOperator } from '~/types/filters';
+interface OperationProps {
+    label: string;
+    value?: FilterOperation;
+    onChange: (operation: FilterOperation) => void;
+    operations: FilterOperator<string>[];
+    showAlternateLabel?: boolean;
+}
+export declare const Operation: ({ label, value, onChange, operations, showAlternateLabel }: OperationProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=filter-chip-operation.d.ts.map

package/dist/components/filter-chip/filter-chip-operation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-chip-operation.d.ts","sourceRoot":"","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAKlE,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,SAAS,+DAMnB,cAAc,4CA2DhB,CAAC"}

package/dist/components/filter-chip/filter-chip-operation.js

@@ -0,0 +1,29 @@
+import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
+import { cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { useCallback } from 'react';
+import { Select } from '../select/select.js';
+import { Text } from '../text/text.js';
+import styles from './filter-chip.module.css.js';
+
+const Operation = ({ label, value, onChange, operations, showAlternateLabel = false }) => {
+    const operationValue = value?.value ?? '';
+    const handleValueChange = useCallback((newValue) => {
+        const operation = operations.find(o => o.value === newValue);
+        if (operation)
+            onChange(operation);
+    }, [operations, onChange]);
+    if (operations.length === 1)
+        return (jsxRuntimeExports.jsx(Text, { variant: 'secondary', className: cx(styles.selectValue, styles.operationValue), children: operations[0].label }));
+    return (jsxRuntimeExports.jsxs(Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntimeExports.jsx(Select.Trigger, { variant: 'text', className: cx(styles.selectValue, styles.operationValue), "aria-label": `${label} filter operation`, iconProps: {
+                    style: {
+                        display: 'none'
+                    }
+                }, children: jsxRuntimeExports.jsx(Select.Value, { placeholder: 'Select operation', className: styles.operationText }) }), jsxRuntimeExports.jsx(Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
+                    return (jsxRuntimeExports.jsx(Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: showAlternateLabel && operation?.alternateLabel
+                            ? operation.alternateLabel
+                            : operation.label }, operation.value));
+                }) })] }));
+};
+
+export { Operation };
+//# sourceMappingURL=filter-chip-operation.js.map

package/dist/components/filter-chip/filter-chip-operation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-chip-operation.js","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n  label: string;\n  value?: FilterOperation;\n  onChange: (operation: FilterOperation) => void;\n  operations: FilterOperator<string>[];\n  showAlternateLabel?: boolean;\n}\n\nexport const Operation = ({\n  label,\n  value,\n  onChange,\n  operations,\n  showAlternateLabel = false\n}: OperationProps) => {\n  const operationValue = value?.value ?? '';\n\n  const handleValueChange = useCallback(\n    (newValue: string) => {\n      const operation = operations.find(o => o.value === newValue);\n      if (operation) onChange(operation);\n    },\n    [operations, onChange]\n  );\n\n  if (operations.length === 1)\n    return (\n      <Text\n        variant='secondary'\n        className={cx(styles.selectValue, styles.operationValue)}\n      >\n        {operations[0].label}\n      </Text>\n    );\n\n  return (\n    <Select\n      value={operationValue}\n      onValueChange={handleValueChange}\n      aria-labelledby={`${label}-label`}\n    >\n      <Select.Trigger\n        variant='text'\n        className={cx(styles.selectValue, styles.operationValue)}\n        aria-label={`${label} filter operation`}\n        iconProps={{\n          style: {\n            display: 'none'\n          }\n        }}\n      >\n        <Select.Value\n          placeholder='Select operation'\n          className={styles.operationText}\n        />\n      </Select.Trigger>\n      <Select.Content data-variant='filter'>\n        {operations.map(operation => {\n          return (\n            <Select.Item\n              key={operation.value}\n              value={operation.value}\n              aria-label={`Filter ${label} ${operation.label}`}\n            >\n              {showAlternateLabel && operation?.alternateLabel\n                ? operation.alternateLabel\n                : operation.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;AAea,MAAA,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,kBAAkB,GAAG,KAAK,EACX,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;AACzB,QAAA,QACEA,qBAAA,CAAC,IAAI,EAAA,EACH,OAAO,EAAC,WAAW,EACnB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,cAAc,CAAC,EAEvD,QAAA,EAAA,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAA,CACf,EACP;AAEJ,IAAA,QACEC,sBAAC,CAAA,MAAM,IACL,KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,aAEjCD,qBAAC,CAAA,MAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,cAAc,CAAC,EAC5C,YAAA,EAAA,CAAA,EAAG,KAAK,CAAmB,iBAAA,CAAA,EACvC,SAAS,EAAE;AACT,oBAAA,KAAK,EAAE;AACL,wBAAA,OAAO,EAAE,MAAM;AAChB,qBAAA;AACF,iBAAA,EAAA,QAAA,EAEDA,qBAAC,CAAA,MAAM,CAAC,KAAK,EACX,EAAA,WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAE,MAAM,CAAC,aAAa,EAAA,CAC/B,EACa,CAAA,EACjBA,qBAAC,CAAA,MAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;oBAC1B,QACEA,qBAAC,CAAA,MAAM,CAAC,IAAI,IAEV,KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,UAAU,KAAK,CAAA,CAAA,EAAI,SAAS,CAAC,KAAK,CAAA,CAAE,YAE/C,kBAAkB,IAAI,SAAS,EAAE,cAAc;8BAC5C,SAAS,CAAC,cAAc;8BACxB,SAAS,CAAC,KAAK,EAAA,EANd,SAAS,CAAC,KAAK,CAOR,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}

package/dist/components/filter-chip/filter-chip.cjs

@@ -2,9 +2,9 @@
 
 var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
 var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
-var React = require('react');
-var box = require('../box/box.cjs');
 var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var React = require('react');
+var filters = require('../../types/filters.cjs');
 var flex = require('../flex/flex.cjs');
 require('../icon-button/icon-button.cjs');
 var select = require('../select/select.cjs');
@@ -16,61 +16,57 @@ require('../popover/popover.cjs');
 require('../input-field/input-field.cjs');
 var text = require('../text/text.cjs');
 var textfield = require('../textfield/textfield.cjs');
+var filterChipOperation = require('./filter-chip-operation.cjs');
 var filterChip_module = require('./filter-chip.module.css.cjs');
-var filters = require('../../types/filters.cjs');
 
 const chip = index.cva(filterChip_module.default.chip, {
     variants: {
         variant: {
-            default: filterChip_module.default["chip-default"],
-            text: null,
-        },
+            default: filterChip_module.default['chip-default'],
+            text: null
+        }
     },
     defaultVariants: {
-        variant: "default",
-    },
+        variant: 'default'
+    }
 });
-const Operation = ({ label, columnType = filters.FilterType.string, onOperationSelect, }) => {
-    const filterOptions = filters.filterOperators[columnType] || [];
-    // FilterOperatorTypes gives error as Select returns string
-    const [value, setValue] = React.useState(filterOptions?.[0]?.value);
-    React.useEffect(() => {
-        const selectedOption = filterOptions.find(o => o.value === value);
-        if (selectedOption) {
-            onOperationSelect(selectedOption);
-        }
-    }, [value]);
-    return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: value, onValueChange: setValue, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: "text", className: filterChip_module.default.selectValue, "aria-label": `${label} filter operation`, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: "Select operation", className: filterChip_module.default.operationText }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": "filter", children: filterOptions.map(opt => {
-                    return (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value, "aria-label": `Filter ${label} ${opt.label}`, children: opt.label }, opt.value));
-                }) })] }));
-};
-const FilterChip = ({ label, value, onRemove, className, ref, columnType = filters.FilterType.string, options = [], onValueChange, onOperationChange, leadingIcon, variant, ...props }) => {
-    const [operation, setOperation] = React.useState();
-    const [filterValue, setFilterValue] = React.useState(value || "");
-    const showOnRemove = typeof onRemove === "function";
-    React.useEffect(() => {
-        if (onOperationChange && operation?.value) {
-            onOperationChange(operation?.value);
-        }
-    }, [operation?.value]);
-    React.useEffect(() => {
-        if (onValueChange) {
-            onValueChange(filterValue);
-        }
-    }, [filterValue]);
+const FilterChip = ({ label, value, onRemove, className, ref, columnType = filters.FilterType.string, options = [], onValueChange, onOperationChange, leadingIcon, variant, operations, ...props }) => {
+    const computedOperations = operations?.length
+        ? operations
+        : filters.filterOperators[columnType];
+    const [operation, setOperation] = React.useState(computedOperations?.[0]);
+    const [filterValue, setFilterValue] = React.useState(value || '');
+    const showOnRemove = typeof onRemove === 'function';
+    const isMultiSelectColumn = columnType === filters.FilterType.multiselect;
+    const handleOperationChange = React.useCallback((operation) => {
+        setOperation(operation);
+        if (operation?.value)
+            onOperationChange?.(operation.value);
+    }, [onOperationChange]);
+    const handleFilterValueChange = React.useCallback((value) => {
+        setFilterValue(value);
+        onValueChange?.(value, operation?.value ?? '');
+    }, [operation, onValueChange]);
     const renderValueInput = () => {
         switch (columnType) {
+            case filters.FilterType.multiselect:
             case filters.FilterType.select:
-                return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: filterValue.toString(), onValueChange: setFilterValue, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: "text", className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.selectColumn), children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: "Select value" }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": "filter", children: options.map(opt => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
+                return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: isMultiSelectColumn ? filterValue : filterValue.toString(), onValueChange: handleFilterValueChange, multiple: isMultiSelectColumn, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { iconProps: {
+                                style: {
+                                    display: 'none'
+                                }
+                            }, variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.selectColumn), children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select value', children: isMultiSelectColumn && filterValue.length > 1
+                                    ? `${filterValue.length} selected`
+                                    : undefined }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
             case filters.FilterType.date:
-                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.dateFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(datePicker.DatePicker, { value: filterValue, onSelect: date => setFilterValue(date), showCalendarIcon: false, inputFieldProps: { className: filterChip_module.default.dateField } }) }));
+                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.dateFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(datePicker.DatePicker, { value: filterValue, onSelect: date => handleFilterValueChange(date), showCalendarIcon: false, inputFieldProps: { className: filterChip_module.default.dateField } }) }));
             default:
-                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.textFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(textfield.TextField, { className: filterChip_module.default.textField, value: filterValue, onChange: e => setFilterValue(e.target.value) }) }));
+                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.textFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(textfield.TextField, { className: filterChip_module.default.textField, value: filterValue, onChange: e => handleFilterValueChange(e.target.value) }) }));
         }
     };
-    return (jsxRuntime.jsxRuntimeExports.jsx(box.Box, { ref: ref, className: chip({ variant, className }), role: "group", "aria-label": `Filter by ${label}`, ...props, children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: "center", children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: "center", gap: 2, children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": "true", children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: "normal", children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(Operation, { columnType: columnType, label: label, onOperationSelect: setOperation }), renderValueInput(), showOnRemove && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }) }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, ...props, children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', gap: 2, className: filterChip_module.default['chip-label'], children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(filterChipOperation.Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange, showAlternateLabel: isMultiSelectColumn && filterValue.length <= 1 }), renderValueInput(), showOnRemove && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }));
 };
-FilterChip.displayName = "FilterChip";
+FilterChip.displayName = 'FilterChip';
 
 exports.FilterChip = FilterChip;
 //# sourceMappingURL=filter-chip.cjs.map