@bioturing/components 0.30.0 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/components/choice-list/component.js +26 -28
  2. package/dist/components/choice-list/component.js.map +1 -1
  3. package/dist/components/code-block/component.js +10 -10
  4. package/dist/components/combobox/component.js +148 -143
  5. package/dist/components/combobox/component.js.map +1 -1
  6. package/dist/components/command-palette/component.js +79 -0
  7. package/dist/components/command-palette/component.js.map +1 -0
  8. package/dist/components/command-palette/style.css +1 -0
  9. package/dist/components/dropdown-menu/component.js +119 -189
  10. package/dist/components/dropdown-menu/component.js.map +1 -1
  11. package/dist/components/dropdown-menu/item.css +1 -1
  12. package/dist/components/dropdown-menu/item.js +82 -60
  13. package/dist/components/dropdown-menu/item.js.map +1 -1
  14. package/dist/components/dropdown-menu/style.css +1 -1
  15. package/dist/components/dropdown-menu/useDropdownMenu.js +127 -0
  16. package/dist/components/dropdown-menu/useDropdownMenu.js.map +1 -0
  17. package/dist/components/input/component.js +24 -23
  18. package/dist/components/input/component.js.map +1 -1
  19. package/dist/components/keyboard-shortcut/component.js +72 -0
  20. package/dist/components/keyboard-shortcut/component.js.map +1 -0
  21. package/dist/components/keyboard-shortcut/style.css +1 -0
  22. package/dist/components/loader/component.js +15 -0
  23. package/dist/components/loader/component.js.map +1 -0
  24. package/dist/components/loader/style.css +1 -0
  25. package/dist/components/popup-panel/style.css +1 -1
  26. package/dist/components/scroll-area/component.js +83 -64
  27. package/dist/components/scroll-area/component.js.map +1 -1
  28. package/dist/components/select/component.js.map +1 -1
  29. package/dist/components/theme-provider/style.css +1 -1
  30. package/dist/components/toast/style.css +1 -1
  31. package/dist/index.d.ts +236 -66
  32. package/dist/index.js +203 -197
  33. package/dist/index.js.map +1 -1
  34. package/dist/metadata.js +47 -2
  35. package/dist/metadata.js.map +1 -1
  36. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../../src/components/dropdown-menu/component.tsx"],"sourcesContent":["\"use client\";\nimport { Menu } from \"@base-ui-components/react/menu\";\nimport { useControlled } from \"@base-ui-components/utils/useControlled\";\nimport { Popover } from \"@base-ui-components/react/popover\";\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { useCallback, useRef } from \"react\";\nimport {\n clsx,\n DROPDOWN_COLLISION_AVOIDANCE,\n parseAntdPlacement,\n useAntdCssVarClassname,\n useCls,\n} from \"../utils\";\nimport { Command } from \"../cmdk\";\nimport { ScrollArea } from \"../scroll-area\";\nimport { FormItemInputContext } from \"antd/es/form/context\";\n\n// Import component-specific styles\nimport { Input } from \"../input\";\nimport { PopupPanelSize } from \"../popup-panel/constants\";\nimport { DropdownMenuItem } from \"./item\";\n\nimport \"./style.css\";\nimport { DropdownMenuDivider } from \"./divider\";\n\nexport type DropdownMenuItemType =\n | {\n /**\n * The type of the menu item\n */\n type: \"item\";\n /**\n * The label of the menu item\n */\n label?: React.ReactNode;\n /**\n * Whether the menu item is disabled\n */\n disabled?: boolean;\n /**\n * The icon of the menu item\n */\n icon?: React.ReactNode;\n /**\n * The key of the menu item\n */\n key: React.Key;\n /**\n * The onClick event handler of the menu item\n */\n onClick?: React.HTMLAttributes<HTMLElement>[\"onClick\"];\n /**\n * The onMouseEnter event handler of the menu item\n */\n onMouseEnter?: React.HTMLAttributes<HTMLElement>[\"onMouseEnter\"];\n /**\n * The onMouseLeave event handler of the menu item\n */\n onMouseLeave?: React.HTMLAttributes<HTMLElement>[\"onMouseLeave\"];\n /**\n * The onMouseOver event handler of the menu item\n */\n onMouseOver?: React.HTMLAttributes<HTMLElement>[\"onMouseOver\"];\n /**\n * The onMouseOut event handler of the menu item\n */\n onMouseOut?: React.HTMLAttributes<HTMLElement>[\"onMouseOut\"];\n /**\n * The className of the menu item\n */\n className?: string;\n /**\n * Whether the menu item is a danger item\n */\n danger?: boolean;\n /**\n * The ref of the menu item\n */\n ref?: React.Ref<HTMLElement>;\n }\n | {\n /**\n * The type of the menu item\n */\n type: \"divider\";\n }\n | {\n /**\n * The type of the menu item\n */\n type: \"header\";\n /**\n * The title of the menu item\n */\n title?: React.ReactNode;\n /**\n * The className of the menu item\n */\n className?: string;\n };\n\nexport interface DropdownMenuProps {\n /** Array of menu items to be displayed in the dropdown */\n items: DropdownMenuItemType[];\n /** Custom render function for the trigger element */\n children?: React.ComponentProps<typeof Menu.Trigger>[\"render\"];\n /**\n * Placement of the dropdown relative to the trigger element\n * @default \"bottomLeft\"\n */\n placement?: PopoverProps[\"placement\"];\n /**\n * Whether to open the dropdown on hover instead of click\n * @default false\n */\n openOnHover?: boolean;\n /**\n * Controlled open state of the dropdown\n */\n open?: boolean;\n /**\n * Callback fired when the dropdown open state changes\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Additional CSS class for the dropdown component\n */\n className?: string;\n /**\n * Custom class names for different parts of the dropdown\n * @default {}\n */\n classNames?: {\n root?: string;\n trigger?: string;\n popup?: string;\n group?: string;\n groupLabel?: string;\n item?: string;\n itemIcon?: string;\n itemText?: string;\n separator?: string;\n positioner?: string;\n };\n /**\n * Custom render function for menu items\n */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Whether to show search input\n * @default false\n */\n showSearch?: boolean;\n /**\n * Size of the dropdown menu\n * @default \"auto\"\n */\n size?: \"auto\" | keyof typeof PopupPanelSize;\n /**\n * Search placeholder\n */\n searchProps?: Omit<\n React.ComponentProps<typeof Command.Input>,\n \"size\" | \"ref\"\n >;\n /**\n * Whether to match the width of the popup with the trigger\n * @default false\n */\n popupMatchTriggerWidth?: boolean;\n\n /**\n * Content to display before the list\n */\n beforeList?: React.ReactNode;\n /**\n * Content to display after the list\n */\n afterList?: React.ReactNode;\n /**\n * Whether to keep the dropdown open when an item is selected\n * @default false\n */\n keepOpenOnSelect?: boolean;\n /**\n * Control the highlighted state of the menu item\n */\n highlightedItemKey?: React.Key;\n /**\n * Control the selected state of the menu item\n */\n selectedItemKeys?: React.Key[];\n /**\n * Whether to show checkbox\n * @default false\n */\n showCheckbox?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuItemType & { type: \"item\" }) => string[];\n}\n\ninterface DropdownMenuGroup {\n label: React.ReactNode | null;\n items: DropdownMenuItemType[];\n}\n\nexport const DropdownMenu = ({\n children,\n items,\n placement,\n openOnHover,\n open: outsideOpen,\n onOpenChange: outsideOnOpenChange,\n className,\n itemRender,\n classNames,\n size = \"auto\",\n showSearch,\n searchProps = {\n placeholder: \"Search...\",\n },\n popupMatchTriggerWidth,\n beforeList,\n afterList,\n keepOpenOnSelect,\n highlightedItemKey,\n selectedItemKeys,\n showCheckbox,\n getItemKeywords,\n}: DropdownMenuProps) => {\n const [open, setOpen] = useControlled({\n controlled: outsideOpen,\n default: false,\n name: \"open\",\n });\n const onOpenChange = useCallback(\n (newValue: boolean) => {\n setOpen(newValue);\n outsideOnOpenChange?.(newValue);\n },\n [setOpen, outsideOnOpenChange]\n );\n const cls = useCls();\n const antdCssVarClassname = useAntdCssVarClassname();\n const baseUIPlacement = parseAntdPlacement(placement);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const itemGroups = items.reduce<DropdownMenuGroup[]>((acc, current) => {\n // If no groups exist yet and current item is not a header, create default group\n if (acc.length === 0 && current.type !== \"header\") {\n acc.push({\n label: null,\n items: [],\n });\n }\n\n // If it's a header, create a new group\n if (current.type === \"header\") {\n acc.push({\n label: current.title,\n items: [],\n });\n }\n // If it's an item and we have at least one group, add it to the last group's items\n else if (\n (current.type === \"item\" || current.type === \"divider\") &&\n acc.length > 0\n ) {\n acc[acc.length - 1].items.push(current);\n }\n // Skip dividers\n return acc;\n }, []);\n\n const renderMenuItem = useCallback(\n (item: DropdownMenuItemType, i: number, j: number) => {\n if (item.type === \"item\") {\n return (\n <DropdownMenuItem\n key={i + \"-\" + j}\n item={item}\n inCombobox={showSearch}\n selected={selectedItemKeys?.includes(item.key)}\n onSelect={\n showSearch\n ? () => {\n const e = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n }) as unknown as React.MouseEvent<HTMLElement, MouseEvent>;\n item.onClick(e);\n if (!keepOpenOnSelect) onOpenChange?.(false);\n }\n : undefined\n }\n itemRender={itemRender}\n showCheckbox={showCheckbox}\n getItemKeywords={getItemKeywords}\n />\n );\n } else if (item.type === \"divider\") {\n return (\n <DropdownMenuDivider\n key={i + \"-\" + j}\n inCombobox={showSearch}\n className={classNames?.separator}\n />\n );\n }\n return null;\n },\n [\n classNames,\n itemRender,\n onOpenChange,\n showSearch,\n keepOpenOnSelect,\n selectedItemKeys,\n showCheckbox,\n ]\n );\n\n const renderGroup = useCallback(\n (group: DropdownMenuGroup, index: number) => (\n <Menu.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n >\n {group.label && (\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n )}\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Menu.Group>\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderGroupShowSearch = useCallback(\n (group: DropdownMenuGroup, index: number) =>\n group.label ? (\n <Command.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n heading={\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n }\n >\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Command.Group>\n ) : (\n group.items.map((item, j) => renderMenuItem(item, index, j))\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderMenuInner = useCallback(\n () =>\n showSearch ? (\n <Command\n className={cls(\"dropdown-menu-container\")}\n disablePointerSelection={showSearch}\n defaultValue={\n highlightedItemKey ? String(highlightedItemKey) : undefined\n }\n >\n <FormItemInputContext.Provider value={{}}>\n <Command.Input\n {...searchProps}\n key=\"search\"\n render={\n <Input\n allowClear\n className={cls(\"dropdown-menu-search\")}\n placeholder=\"Search\"\n />\n }\n />\n </FormItemInputContext.Provider>\n {beforeList}\n <ScrollArea fadeEdges>\n <Command.List className={cls(\"dropdown-menu-list\")}>\n <Command.Empty className={cls(\"dropdown-menu-empty\")}>\n No results found.\n </Command.Empty>\n {itemGroups.map(renderGroupShowSearch)}\n </Command.List>\n </ScrollArea>\n {afterList}\n </Command>\n ) : (\n <div className={cls(\"dropdown-menu-container\")}>\n {beforeList}\n <ScrollArea fadeEdges>{itemGroups.map(renderGroup)}</ScrollArea>\n {afterList}\n </div>\n ),\n [\n showSearch,\n cls,\n highlightedItemKey,\n searchProps,\n beforeList,\n itemGroups,\n renderGroupShowSearch,\n afterList,\n renderGroup,\n ]\n );\n\n const BaseComponent = showSearch ? Popover : Menu;\n\n return (\n <BaseComponent.Root\n openOnHover={openOnHover}\n open={open}\n onOpenChange={onOpenChange}\n >\n <BaseComponent.Trigger\n render={children}\n ref={buttonRef}\n className={clsx(\n cls(\"dropdown-menu-trigger\"),\n classNames?.trigger,\n antdCssVarClassname\n )}\n />\n <BaseComponent.Portal>\n <BaseComponent.Positioner\n side={baseUIPlacement.side}\n align={baseUIPlacement.align}\n sideOffset={4}\n className={clsx(cls(\"dropdown-menu-root\"), classNames?.root)}\n collisionAvoidance={DROPDOWN_COLLISION_AVOIDANCE}\n >\n <BaseComponent.Popup\n className={clsx(\n cls(\n \"dropdown-menu\",\n showCheckbox && \"dropdown-menu-show-checkbox\",\n popupMatchTriggerWidth && \"dropdown-menu-match-trigger-width\"\n ),\n className,\n classNames?.popup,\n antdCssVarClassname\n )}\n style={\n {\n \"--size-width\":\n size in PopupPanelSize ? PopupPanelSize[size] : undefined,\n } as React.CSSProperties\n }\n >\n {renderMenuInner()}\n </BaseComponent.Popup>\n </BaseComponent.Positioner>\n </BaseComponent.Portal>\n </BaseComponent.Root>\n );\n};\n"],"names":["DropdownMenu","children","items","placement","openOnHover","outsideOpen","outsideOnOpenChange","className","itemRender","classNames","size","showSearch","searchProps","popupMatchTriggerWidth","beforeList","afterList","keepOpenOnSelect","highlightedItemKey","selectedItemKeys","showCheckbox","getItemKeywords","open","setOpen","useControlled","onOpenChange","useCallback","newValue","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","baseUIPlacement","parseAntdPlacement","buttonRef","useRef","itemGroups","acc","current","renderMenuItem","item","i","j","jsx","DropdownMenuItem","e","DropdownMenuDivider","renderGroup","group","index","jsxs","Menu","clsx","renderGroupShowSearch","Command","renderMenuInner","FormItemInputContext","createElement","Input","ScrollArea","BaseComponent","Popover","DROPDOWN_COLLISION_AVOIDANCE","PopupPanelSize"],"mappings":"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"}
1
+ {"version":3,"file":"component.js","sources":["../../../src/components/dropdown-menu/component.tsx"],"sourcesContent":["\"use client\";\nimport { Menu } from \"@base-ui-components/react/menu\";\nimport { Popover } from \"@base-ui-components/react/popover\";\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { useCallback, useRef } from \"react\";\nimport {\n clsx,\n DROPDOWN_COLLISION_AVOIDANCE,\n parseAntdPlacement,\n useAntdCssVarClassname,\n useCls,\n} from \"../utils\";\nimport { Command } from \"../cmdk\";\nimport { ScrollArea } from \"../scroll-area\";\nimport { FormItemInputContext } from \"antd/es/form/context\";\n\n// Import component-specific styles\nimport { Input } from \"../input\";\nimport { PopupPanelSize } from \"../popup-panel/constants\";\n\nimport { DropdownMenuItemType } from \"./types\";\nimport { useDropdownMenu, UseDropdownMenuProps } from \"./useDropdownMenu\";\nimport { useControlledState } from \"../hooks\";\n\nimport \"./style.css\";\n\nexport interface DropdownMenuProps\n extends Omit<UseDropdownMenuProps, \"classNames\"> {\n /** Array of menu items to be displayed in the dropdown */\n items: DropdownMenuItemType[];\n /** Custom render function for the trigger element */\n children?: React.ComponentProps<typeof Menu.Trigger>[\"render\"];\n /**\n * Placement of the dropdown relative to the trigger element\n * @default \"bottomLeft\"\n */\n placement?: PopoverProps[\"placement\"];\n /**\n * Whether to open the dropdown on hover instead of click\n * @default false\n */\n openOnHover?: boolean;\n /**\n * Controlled open state of the dropdown\n */\n open?: boolean;\n /**\n * Callback fired when the dropdown open state changes\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Default open state of the dropdown\n */\n defaultOpen?: boolean;\n /**\n * Additional CSS class for the dropdown component\n */\n className?: string;\n /**\n * Custom class names for different parts of the dropdown\n * @default {}\n */\n classNames?: {\n root?: string;\n trigger?: string;\n popup?: string;\n itemIcon?: string;\n itemText?: string;\n positioner?: string;\n } & UseDropdownMenuProps[\"classNames\"];\n\n /**\n * Whether to show search input\n * @default false\n */\n showSearch?: boolean;\n /**\n * Size of the dropdown menu\n * @default \"auto\"\n */\n size?: \"auto\" | keyof typeof PopupPanelSize;\n /**\n * Search placeholder\n */\n searchProps?: Omit<\n React.ComponentProps<typeof Command.Input>,\n \"size\" | \"ref\"\n >;\n /**\n * Whether to match the width of the popup with the trigger\n * @default false\n */\n popupMatchTriggerWidth?: boolean;\n /**\n * Content to display before the list\n */\n beforeList?: React.ReactNode;\n /**\n * Content to display after the list\n */\n afterList?: React.ReactNode;\n}\n\nexport const DropdownMenu = ({\n children,\n items,\n placement,\n openOnHover,\n open: outsideOpen,\n onOpenChange: outsideOnOpenChange,\n defaultOpen,\n className,\n itemRender,\n classNames,\n size = \"auto\",\n showSearch,\n inCombobox: inComboboxProp,\n searchProps = {\n placeholder: \"Search...\",\n },\n popupMatchTriggerWidth,\n beforeList,\n afterList,\n keepOpenOnSelect,\n highlightedItemKey,\n selectedItemKeys,\n getItemKeywords,\n showCheckbox,\n itemLabelRender,\n}: DropdownMenuProps) => {\n const inCombobox =\n typeof inComboboxProp === \"boolean\" ? inComboboxProp : showSearch;\n const [open, onOpenChange] = useControlledState(\n outsideOpen,\n outsideOnOpenChange,\n defaultOpen\n );\n const cls = useCls();\n const antdCssVarClassname = useAntdCssVarClassname();\n const baseUIPlacement = parseAntdPlacement(placement);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const { itemGroups, renderGroup } = useDropdownMenu({\n items,\n keepOpenOnSelect,\n highlightedItemKey,\n selectedItemKeys,\n showCheckbox,\n getItemKeywords,\n itemLabelRender,\n itemRender,\n inCombobox,\n onOpenChange,\n classNames: {\n item: classNames?.item,\n itemIcon: classNames?.itemIcon,\n itemSuffix: classNames?.itemSuffix,\n group: classNames?.group,\n groupLabel: classNames?.groupLabel,\n divider: classNames?.divider,\n },\n });\n const renderMenuInner = useCallback(\n () =>\n showSearch ? (\n <Command\n className={cls(\"dropdown-menu-container\")}\n disablePointerSelection={showSearch}\n defaultValue={\n highlightedItemKey ? String(highlightedItemKey) : undefined\n }\n // filter={(value, search, keywords) => {\n // console.log({ value, search, keywords });\n // const extendValue = value + \" \" + keywords.join(\" \");\n // if (extendValue.toLowerCase().includes(search.toLowerCase()))\n // return 1;\n // return 0;\n // }}\n >\n <FormItemInputContext.Provider value={{}}>\n <Command.Input\n {...searchProps}\n key=\"search\"\n render={\n <Input\n allowClear\n className={cls(\"dropdown-menu-search\")}\n placeholder=\"Search\"\n />\n }\n />\n </FormItemInputContext.Provider>\n {beforeList}\n <ScrollArea fadeEdges>\n <Command.List className={cls(\"dropdown-menu-list\")}>\n <Command.Empty className={cls(\"dropdown-menu-empty\")}>\n No results found.\n </Command.Empty>\n {itemGroups.map(renderGroup)}\n </Command.List>\n </ScrollArea>\n {afterList}\n </Command>\n ) : (\n <div className={cls(\"dropdown-menu-container\")}>\n {beforeList}\n <ScrollArea fadeEdges>{itemGroups.map(renderGroup)}</ScrollArea>\n {afterList}\n </div>\n ),\n [\n showSearch,\n cls,\n highlightedItemKey,\n searchProps,\n beforeList,\n itemGroups,\n afterList,\n renderGroup,\n ]\n );\n const BaseComponent = showSearch ? Popover : Menu;\n\n return (\n <BaseComponent.Root\n openOnHover={openOnHover}\n open={open}\n onOpenChange={onOpenChange}\n >\n <BaseComponent.Trigger\n render={children}\n ref={buttonRef}\n className={clsx(\n cls(\"dropdown-menu-trigger\"),\n classNames?.trigger,\n antdCssVarClassname\n )}\n />\n <BaseComponent.Portal>\n <BaseComponent.Positioner\n side={baseUIPlacement.side}\n align={baseUIPlacement.align}\n sideOffset={4}\n className={clsx(cls(\"dropdown-menu-root\"), classNames?.root)}\n collisionAvoidance={DROPDOWN_COLLISION_AVOIDANCE}\n >\n <BaseComponent.Popup\n className={clsx(\n cls(\n \"dropdown-menu\",\n showCheckbox && \"dropdown-menu-show-checkbox\",\n popupMatchTriggerWidth && \"dropdown-menu-match-trigger-width\"\n ),\n className,\n classNames?.popup,\n antdCssVarClassname\n )}\n style={\n {\n \"--size-width\":\n size in PopupPanelSize ? PopupPanelSize[size] : undefined,\n } as React.CSSProperties\n }\n >\n {renderMenuInner()}\n </BaseComponent.Popup>\n </BaseComponent.Positioner>\n </BaseComponent.Portal>\n </BaseComponent.Root>\n );\n};\n"],"names":["DropdownMenu","children","items","placement","openOnHover","outsideOpen","outsideOnOpenChange","defaultOpen","className","itemRender","classNames","size","showSearch","inComboboxProp","searchProps","popupMatchTriggerWidth","beforeList","afterList","keepOpenOnSelect","highlightedItemKey","selectedItemKeys","getItemKeywords","showCheckbox","itemLabelRender","inCombobox","open","onOpenChange","useControlledState","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","baseUIPlacement","parseAntdPlacement","buttonRef","useRef","itemGroups","renderGroup","useDropdownMenu","renderMenuInner","useCallback","jsxs","Command","jsx","FormItemInputContext","createElement","Input","ScrollArea","BaseComponent","Popover","Menu","clsx","DROPDOWN_COLLISION_AVOIDANCE","PopupPanelSize"],"mappings":"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"}
@@ -1 +1 @@
1
- @layer components{.ds-dropdown-menu-item{padding:.375rem .75rem;border-radius:var(--ds-border-radius-sm);cursor:pointer;display:flex;align-items:center;transition:all .3s var(--ds-motion-ease-out)}.ds-dropdown-menu-item:focus{outline:none}.ds-dropdown-menu-item:hover,.ds-dropdown-menu-item[data-active=true],.ds-dropdown-menu-item[data-selected=true],.ds-dropdown-menu-item[data-highlighted=true]{background:var(--ds-control-item-bg-hover)}.ds-dropdown-menu-item:active,.ds-dropdown-menu-item:focus,.ds-dropdown-menu-item[data-focus=true]{background:var(--ds-control-item-bg-active);font-weight:500}.ds-dropdown-menu:not(.ds-dropdown-menu-show-checkbox) .ds-dropdown-menu-item[data-actual-selected=true]{background:var(--ds-control-item-bg-active);font-weight:500}.ds-dropdown-menu-item[data-disabled=true]{pointer-events:none;color:var(--ds-color-text-disabled)}.ds-dropdown-menu-item[data-danger=true]{color:var(--ds-color-error)}.ds-dropdown-menu-item[data-danger=true]:hover{background:var(--ds-color-error-bg)}.ds-dropdown-menu-item[data-danger=true]:active,.ds-dropdown-menu-item[data-danger=true]:focus,.ds-dropdown-menu-item[data-danger=true][data-focus=true]{background:var(--ds-color-error-bg-hover)}.ds-dropdown-menu-item .ds-checkbox-wrapper{margin-right:.5rem}.ds-dropdown-menu-item .ds-dropdown-menu-item-icon{display:flex;align-items:center;justify-content:center;margin-right:.5rem;font-size:1rem;color:var(--ds-color-icon)}[data-danger=true] .ds-dropdown-menu-item .ds-dropdown-menu-item-icon{color:var(--ds-color-error)}}
1
+ @layer components{.ds-dropdown-menu-search{margin-bottom:.25rem}.ds-dropdown-menu-divider{border-bottom:1px solid var(--ds-color-split);margin:.25rem 0}.ds-dropdown-menu-header{font-size:.75rem;font-weight:500;line-height:1rem;text-transform:uppercase;color:var(--ds-color-text-tertiary);padding:.75rem .75rem .25rem}.ds-dropdown-menu-header:first-child{padding-top:.5rem}.ds-dropdown-menu-empty{padding:.375rem .75rem;color:var(--ds-color-text-tertiary)}.ds-dropdown-menu-match-trigger-width{width:min(var(--anchor-width),var(--available-width))}.ds-dropdown-menu-item{padding:.375rem .75rem;border-radius:var(--ds-border-radius-sm);cursor:pointer;display:flex;align-items:center;transition:all .3s var(--ds-motion-ease-out);color:var(--ds-color-text)}.ds-dropdown-menu-item:focus{outline:none}.ds-dropdown-menu-item:hover,.ds-dropdown-menu-item[data-active=true],.ds-dropdown-menu-item[data-selected=true],.ds-dropdown-menu-item[data-highlighted=true]{background:var(--ds-control-item-bg-hover)}.ds-dropdown-menu-item:active,.ds-dropdown-menu-item:focus,.ds-dropdown-menu-item[data-focus=true]{background:var(--ds-control-item-bg-active)}.ds-dropdown-menu:not(.ds-dropdown-menu-show-checkbox) .ds-dropdown-menu-item[data-actual-selected=true]{background:var(--ds-control-item-bg-active)}.ds-dropdown-menu-item[data-disabled=true]{pointer-events:none;color:var(--ds-color-text-disabled)}.ds-dropdown-menu-item .ds-checkbox-wrapper{margin-right:.5rem}.ds-dropdown-menu-item .ds-dropdown-menu-item-icon{display:flex;align-items:center;justify-content:center;margin-right:.5rem;font-size:1rem;color:var(--ds-color-icon)}.ds-dropdown-menu-item .ds-dropdown-menu-item-text{flex-grow:1}.ds-dropdown-menu-item .ds-dropdown-menu-item-suffix{margin-left:.75rem;font-size:.75rem;line-height:1.25rem;color:var(--color-ds-color-text-tertiary);display:flex;flex-grow:0;flex-shrink:0;align-items:flex-end}.ds-dropdown-menu-item[data-danger=true]{color:var(--ds-color-error)}.ds-dropdown-menu-item[data-danger=true]:hover{background:var(--ds-color-error-bg)}.ds-dropdown-menu-item[data-danger=true]:active,.ds-dropdown-menu-item[data-danger=true]:focus,.ds-dropdown-menu-item[data-danger=true][data-focus=true]{background:var(--ds-color-error-bg-hover)}.ds-dropdown-menu-item[data-danger=true] .ds-dropdown-menu-item-icon{color:var(--ds-color-error)}}
@@ -1,38 +1,40 @@
1
1
  "use client";
2
- import { jsxs as I, Fragment as x, jsx as r } from "react/jsx-runtime";
2
+ import { jsxs as w, Fragment as y, jsx as r } from "react/jsx-runtime";
3
3
  import { useMemo as h } from "react";
4
- import { Command as j } from "../cmdk/index.js";
5
- import { Menu as E } from "@base-ui-components/react/menu";
4
+ import { Command as q } from "../cmdk/index.js";
5
+ import { Menu as z } from "@base-ui-components/react/menu";
6
6
  import './item.css';/* empty css */
7
- import { Checkbox as w } from "antd";
8
- import { reactNodeToString as L } from "../utils/reactToString.js";
9
- import { useCls as D } from "../utils/antdUtils.js";
10
- import { clsx as t } from "../utils/cn.js";
11
- const J = ({
7
+ import { Checkbox as O } from "antd";
8
+ import { reactNodeToString as T } from "../utils/reactToString.js";
9
+ import { useCls as A } from "../utils/antdUtils.js";
10
+ import { clsx as M } from "../utils/cn.js";
11
+ import { WithRenderProp as j } from "../utils/WithRenderProp.js";
12
+ const Z = ({
12
13
  item: o,
13
- inCombobox: u = !1,
14
- selected: f = !1,
15
- itemRender: p,
16
- itemProps: y = {},
14
+ inCombobox: p = !1,
15
+ selected: v = !1,
16
+ itemRender: u,
17
+ itemLabelRender: f,
18
+ itemProps: E = {},
17
19
  classNames: n,
18
- onSelect: k,
19
- showCheckbox: M,
20
- indeterminate: e,
21
- renderAsNativeElement: O,
22
- getItemKeywords: g
20
+ onSelect: S,
21
+ showCheckbox: t,
22
+ indeterminate: g,
23
+ renderAsNativeElement: P,
24
+ getItemKeywords: i
23
25
  }) => {
24
- const d = D(), T = h(
25
- () => u ? j.Item : E.Item,
26
- [u]
27
- ), i = h(() => ({
28
- className: t(
29
- d("dropdown-menu-item", u && "dropdown-menu-item-combobox"),
26
+ const d = A(), D = h(
27
+ () => p ? q.Item : z.Item,
28
+ [p]
29
+ ), x = h(() => ({
30
+ className: M(
31
+ d("dropdown-menu-item", p && "dropdown-menu-item-combobox"),
30
32
  n == null ? void 0 : n.item,
31
33
  o.className
32
34
  ),
33
35
  disabled: o.disabled,
34
36
  "data-danger": o.danger,
35
- "data-actual-selected": f,
37
+ "data-actual-selected": v,
36
38
  ref: o.ref,
37
39
  onClick: o.onClick,
38
40
  onMouseEnter: o.onMouseEnter,
@@ -40,20 +42,20 @@ const J = ({
40
42
  onMouseOver: o.onMouseOver,
41
43
  onMouseOut: o.onMouseOut,
42
44
  "data-value": typeof o.label == "string" ? o.label : String(o.key),
43
- render: p ? (b) => p(o, b) : void 0,
44
- children: u ? /* @__PURE__ */ I(x, { children: [
45
- M && /* @__PURE__ */ r(
46
- w,
45
+ render: u ? (k) => u(o, k) : void 0,
46
+ children: p ? /* @__PURE__ */ w(y, { children: [
47
+ t && /* @__PURE__ */ r(
48
+ O,
47
49
  {
48
- checked: f,
50
+ checked: v,
49
51
  tabIndex: -1,
50
- indeterminate: e
52
+ indeterminate: g
51
53
  }
52
54
  ),
53
55
  o.icon && /* @__PURE__ */ r(
54
56
  "span",
55
57
  {
56
- className: t(
58
+ className: M(
57
59
  d("dropdown-menu-item-icon"),
58
60
  n == null ? void 0 : n.itemIcon
59
61
  ),
@@ -61,28 +63,30 @@ const J = ({
61
63
  }
62
64
  ),
63
65
  /* @__PURE__ */ r(
64
- "span",
66
+ j,
65
67
  {
66
- className: t(
68
+ render: f ? (k) => f(o, k) : void 0,
69
+ as: "span",
70
+ className: M(
67
71
  d("dropdown-menu-item-text"),
68
72
  n == null ? void 0 : n.itemText
69
73
  ),
70
74
  children: o.label
71
75
  }
72
76
  )
73
- ] }) : /* @__PURE__ */ I(x, { children: [
74
- M && /* @__PURE__ */ r(
75
- w,
77
+ ] }) : /* @__PURE__ */ w(y, { children: [
78
+ t && /* @__PURE__ */ r(
79
+ O,
76
80
  {
77
- checked: f,
81
+ checked: v,
78
82
  tabIndex: -1,
79
- indeterminate: e
83
+ indeterminate: g
80
84
  }
81
85
  ),
82
86
  o.icon && /* @__PURE__ */ r(
83
87
  "span",
84
88
  {
85
- className: t(
89
+ className: M(
86
90
  d("dropdown-menu-item-icon"),
87
91
  n == null ? void 0 : n.itemIcon
88
92
  ),
@@ -90,13 +94,21 @@ const J = ({
90
94
  }
91
95
  ),
92
96
  /* @__PURE__ */ r(
97
+ j,
98
+ {
99
+ render: f ? (k) => f(o, k) : void 0,
100
+ as: "span",
101
+ children: o.label
102
+ }
103
+ ),
104
+ o.suffix && /* @__PURE__ */ r(
93
105
  "span",
94
106
  {
95
- className: t(
96
- d("dropdown-menu-item-text"),
97
- n == null ? void 0 : n.itemText
107
+ className: M(
108
+ d("dropdown-menu-item-suffix"),
109
+ n == null ? void 0 : n.itemSuffix
98
110
  ),
99
- children: o.label
111
+ children: o.suffix
100
112
  }
101
113
  )
102
114
  ] })
@@ -104,31 +116,41 @@ const J = ({
104
116
  n == null ? void 0 : n.item,
105
117
  n == null ? void 0 : n.itemIcon,
106
118
  n == null ? void 0 : n.itemText,
119
+ n == null ? void 0 : n.itemSuffix,
107
120
  d,
108
- u,
109
- e,
110
- o,
111
121
  p,
112
- f,
113
- M
114
- ]);
115
- if (p)
116
- return p(o, {
117
- ...i,
118
- ...y
122
+ g,
123
+ o,
124
+ u,
125
+ v,
126
+ t,
127
+ f
128
+ ]), F = h(
129
+ () => i ? i(o) : [String(o.key), T(o.label)],
130
+ [i, o]
131
+ );
132
+ if (u)
133
+ return console.log(u), u(o, {
134
+ ...x,
135
+ ...E
119
136
  });
120
- const { render: v, ...S } = i;
121
- return O ? v ? v(i) : /* @__PURE__ */ r("div", { onClick: k, ...S }) : /* @__PURE__ */ r(
122
- T,
137
+ const { render: I, ...W } = x;
138
+ return console.log(
139
+ "keywords",
140
+ i ? i(o) : [String(o.key), T(o.label)]
141
+ ), P ? I ? I(x) : /* @__PURE__ */ r("div", { onClick: S, ...W }) : /* @__PURE__ */ r(
142
+ D,
123
143
  {
124
144
  value: String(o.key),
125
- keywords: g ? g(o) : [String(o.key), L(o.label)],
126
- onSelect: k,
127
- ...i
145
+ keywords: F || void 0,
146
+ onSelect: () => {
147
+ S(o);
148
+ },
149
+ ...x
128
150
  }
129
151
  );
130
152
  };
131
153
  export {
132
- J as DropdownMenuItem
154
+ Z as DropdownMenuItem
133
155
  };
134
156
  //# sourceMappingURL=item.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"item.js","sources":["../../../src/components/dropdown-menu/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { Ref, useMemo } from \"react\";\nimport { clsx, reactNodeToString, useCls } from \"../utils\";\nimport type { DropdownMenuItemType } from \"./component\";\nimport { Command } from \"../cmdk\";\nimport { Menu } from \"@base-ui-components/react/menu\";\n\nimport \"./item.css\";\nimport { Checkbox } from \"antd\";\n\nexport interface DropdownMenuItemProps {\n /** The menu item data */\n item: DropdownMenuItemType & { type: \"item\" };\n /** Custom render function for the item */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /** Additional props to pass to the item */\n itemProps?: React.HTMLAttributes<HTMLElement>;\n /** Class names from parent DropdownMenu */\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n };\n onSelect?: () => void;\n /**\n * Whether the menu item is in a combobox\n */\n inCombobox?: boolean;\n /**\n * Whether the menu item is in a menu\n */\n renderAsNativeElement?: boolean;\n /**\n * Whether the menu item is selected (for combobox)\n * @default false\n */\n selected?: boolean;\n /**\n * Whether to show checkbox (only for decoration purpose)\n */\n showCheckbox?: boolean;\n /**\n * Whether the menu item checkbox is indeterminate (for combobox)\n * @default false\n */\n indeterminate?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuItemType & { type: \"item\" }) => string[];\n}\n\nexport const DropdownMenuItem: React.FC<DropdownMenuItemProps> = ({\n item,\n inCombobox = false,\n selected = false,\n itemRender,\n itemProps = {},\n classNames,\n onSelect,\n showCheckbox,\n indeterminate,\n renderAsNativeElement,\n getItemKeywords,\n}) => {\n const cls = useCls();\n\n const MenuItem = useMemo(\n () => (inCombobox ? Command.Item : Menu.Item),\n [inCombobox]\n );\n\n const props = useMemo(() => {\n return {\n className: clsx(\n cls(\"dropdown-menu-item\", inCombobox && \"dropdown-menu-item-combobox\"),\n classNames?.item,\n item.className\n ),\n disabled: item.disabled,\n \"data-danger\": item.danger,\n \"data-actual-selected\": selected,\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: item.onClick,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n \"data-value\":\n typeof item.label === \"string\" ? item.label : String(item.key),\n render: itemRender\n ? (itemProps: React.HTMLAttributes<HTMLElement>) =>\n itemRender(item, itemProps)\n : undefined,\n children: inCombobox ? (\n <>\n {showCheckbox && (\n <Checkbox\n checked={selected}\n tabIndex={-1}\n indeterminate={indeterminate}\n />\n )}\n {item.icon && (\n <span\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n )}\n <span\n className={clsx(\n cls(\"dropdown-menu-item-text\"),\n classNames?.itemText\n )}\n >\n {item.label}\n </span>\n </>\n ) : (\n <>\n {showCheckbox && (\n <Checkbox\n checked={selected}\n tabIndex={-1}\n indeterminate={indeterminate}\n />\n )}\n {item.icon && (\n <span\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n )}\n <span\n className={clsx(\n cls(\"dropdown-menu-item-text\"),\n classNames?.itemText\n )}\n >\n {item.label}\n </span>\n </>\n ),\n };\n }, [\n classNames?.item,\n classNames?.itemIcon,\n classNames?.itemText,\n cls,\n inCombobox,\n indeterminate,\n item,\n itemRender,\n selected,\n showCheckbox,\n ]);\n // If custom render function is provided, use it\n if (itemRender) {\n return itemRender(item, {\n ...props,\n ...itemProps,\n });\n }\n const { render, ...restProps } = props;\n // Default rendering\n return renderAsNativeElement ? (\n render ? (\n render(props)\n ) : (\n <div onClick={onSelect} {...restProps} />\n )\n ) : (\n <MenuItem\n value={String(item.key)}\n keywords={getItemKeywords ? getItemKeywords(item) : [String(item.key), reactNodeToString(item.label)]}\n onSelect={onSelect}\n {...props}\n ></MenuItem>\n );\n};\n"],"names":["DropdownMenuItem","item","inCombobox","selected","itemRender","itemProps","classNames","onSelect","showCheckbox","indeterminate","renderAsNativeElement","getItemKeywords","cls","useCls","MenuItem","useMemo","Command","Menu","props","clsx","jsxs","Fragment","jsx","Checkbox","render","restProps","reactNodeToString"],"mappings":";;;;;;;;;;AAwDO,MAAMA,IAAoD,CAAC;AAAA,EAChE,MAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,UAAAC,IAAW;AAAA,EACX,YAAAC;AAAA,EACA,WAAAC,IAAY,CAAC;AAAA,EACb,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,iBAAAC;AACF,MAAM;AACJ,QAAMC,IAAMC,EAAO,GAEbC,IAAWC;AAAA,IACf,MAAOb,IAAac,EAAQ,OAAOC,EAAK;AAAA,IACxC,CAACf,CAAU;AAAA,EACb,GAEMgB,IAAQH,EAAQ,OACb;AAAA,IACL,WAAWI;AAAA,MACTP,EAAI,sBAAsBV,KAAc,6BAA6B;AAAA,MACrEI,KAAA,gBAAAA,EAAY;AAAA,MACZL,EAAK;AAAA,IACP;AAAA,IACA,UAAUA,EAAK;AAAA,IACf,eAAeA,EAAK;AAAA,IACpB,wBAAwBE;AAAA,IACxB,KAAKF,EAAK;AAAA,IACV,SAASA,EAAK;AAAA,IACd,cAAcA,EAAK;AAAA,IACnB,cAAcA,EAAK;AAAA,IACnB,aAAaA,EAAK;AAAA,IAClB,YAAYA,EAAK;AAAA,IACjB,cACE,OAAOA,EAAK,SAAU,WAAWA,EAAK,QAAQ,OAAOA,EAAK,GAAG;AAAA,IAC/D,QAAQG,IACJ,CAACC,MACCD,EAAWH,GAAMI,CAAS,IAC5B;AAAA,IACJ,UAAUH,IAEL,gBAAAkB,EAAAC,GAAA,EAAA,UAAA;AAAA,MACCb,KAAA,gBAAAc;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASpB;AAAA,UACT,UAAU;AAAA,UACV,eAAAM;AAAA,QAAA;AAAA,MACF;AAAA,MAEDR,EAAK,QACJ,gBAAAqB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWH;AAAA,YACTP,EAAI,yBAAyB;AAAA,YAC7BN,KAAA,gBAAAA,EAAY;AAAA,UACd;AAAA,UAEC,UAAKL,EAAA;AAAA,QAAA;AAAA,MACR;AAAA,MAEF,gBAAAqB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWH;AAAA,YACTP,EAAI,yBAAyB;AAAA,YAC7BN,KAAA,gBAAAA,EAAY;AAAA,UACd;AAAA,UAEC,UAAKL,EAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACR,EAAA,CACF,IAGG,gBAAAmB,EAAAC,GAAA,EAAA,UAAA;AAAA,MACCb,KAAA,gBAAAc;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASpB;AAAA,UACT,UAAU;AAAA,UACV,eAAAM;AAAA,QAAA;AAAA,MACF;AAAA,MAEDR,EAAK,QACJ,gBAAAqB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWH;AAAA,YACTP,EAAI,yBAAyB;AAAA,YAC7BN,KAAA,gBAAAA,EAAY;AAAA,UACd;AAAA,UAEC,UAAKL,EAAA;AAAA,QAAA;AAAA,MACR;AAAA,MAEF,gBAAAqB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWH;AAAA,YACTP,EAAI,yBAAyB;AAAA,YAC7BN,KAAA,gBAAAA,EAAY;AAAA,UACd;AAAA,UAEC,UAAKL,EAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACR,EACF,CAAA;AAAA,EAEJ,IACC;AAAA,IACDK,KAAA,gBAAAA,EAAY;AAAA,IACZA,KAAA,gBAAAA,EAAY;AAAA,IACZA,KAAA,gBAAAA,EAAY;AAAA,IACZM;AAAA,IACAV;AAAA,IACAO;AAAA,IACAR;AAAA,IACAG;AAAA,IACAD;AAAA,IACAK;AAAA,EAAA,CACD;AAED,MAAIJ;AACF,WAAOA,EAAWH,GAAM;AAAA,MACtB,GAAGiB;AAAA,MACH,GAAGb;AAAA,IAAA,CACJ;AAEH,QAAM,EAAE,QAAAmB,GAAQ,GAAGC,EAAA,IAAcP;AAE1B,SAAAR,IACLc,IACEA,EAAON,CAAK,IAEX,gBAAAI,EAAA,OAAA,EAAI,SAASf,GAAW,GAAGkB,EAAA,CAAW,IAGzC,gBAAAH;AAAA,IAACR;AAAA,IAAA;AAAA,MACC,OAAO,OAAOb,EAAK,GAAG;AAAA,MACtB,UAAUU,IAAkBA,EAAgBV,CAAI,IAAI,CAAC,OAAOA,EAAK,GAAG,GAAGyB,EAAkBzB,EAAK,KAAK,CAAC;AAAA,MACpG,UAAAM;AAAA,MACC,GAAGW;AAAA,IAAA;AAAA,EACL;AAEL;"}
1
+ {"version":3,"file":"item.js","sources":["../../../src/components/dropdown-menu/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { Ref, useMemo } from \"react\";\nimport { clsx, reactNodeToString, useCls, WithRenderProp } from \"../utils\";\nimport type { DropdownMenuItemType } from \"./types\";\nimport { Command } from \"../cmdk\";\nimport { Menu } from \"@base-ui-components/react/menu\";\n\nimport \"./item.css\";\nimport { Checkbox } from \"antd\";\n\nexport interface DropdownMenuItemProps {\n /** The menu item data */\n item: DropdownMenuItemType & { type: \"item\" };\n /** Custom render function for the item */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n itemLabelRender?: (\n item: DropdownMenuItemType & { type: \"item\" },\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /** Additional props to pass to the item */\n itemProps?: React.HTMLAttributes<HTMLElement>;\n /** Class names from parent DropdownMenu */\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n itemSuffix?: string;\n };\n onSelect?: (item: DropdownMenuItemType & { type: \"item\" }) => void;\n /**\n * Whether the menu item is in a combobox\n */\n inCombobox?: boolean;\n /**\n * Whether the menu item is in a menu\n */\n renderAsNativeElement?: boolean;\n /**\n * Whether the menu item is selected (for combobox)\n * @default false\n */\n selected?: boolean;\n /**\n * Whether to show checkbox (only for decoration purpose)\n */\n showCheckbox?: boolean;\n /**\n * Whether the menu item checkbox is indeterminate (for combobox)\n * @default false\n */\n indeterminate?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuItemType & { type: \"item\" }) => string[];\n}\n\nexport const DropdownMenuItem: React.FC<DropdownMenuItemProps> = ({\n item,\n inCombobox = false,\n selected = false,\n itemRender,\n itemLabelRender,\n itemProps = {},\n classNames,\n onSelect,\n showCheckbox,\n indeterminate,\n renderAsNativeElement,\n getItemKeywords,\n}) => {\n const cls = useCls();\n\n const MenuItem = useMemo(\n () => (inCombobox ? Command.Item : Menu.Item),\n [inCombobox]\n );\n\n const props = useMemo(() => {\n return {\n className: clsx(\n cls(\"dropdown-menu-item\", inCombobox && \"dropdown-menu-item-combobox\"),\n classNames?.item,\n item.className\n ),\n disabled: item.disabled,\n \"data-danger\": item.danger,\n \"data-actual-selected\": selected,\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: item.onClick,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n \"data-value\":\n typeof item.label === \"string\" ? item.label : String(item.key),\n render: itemRender\n ? (itemProps: React.HTMLAttributes<HTMLElement>) =>\n itemRender(item, itemProps)\n : undefined,\n children: inCombobox ? (\n <>\n {showCheckbox && (\n <Checkbox\n checked={selected}\n tabIndex={-1}\n indeterminate={indeterminate}\n />\n )}\n {item.icon && (\n <span\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n )}\n <WithRenderProp\n render={\n itemLabelRender\n ? (props) => itemLabelRender(item, props)\n : undefined\n }\n as={\"span\"}\n className={clsx(\n cls(\"dropdown-menu-item-text\"),\n classNames?.itemText\n )}\n >\n {item.label}\n </WithRenderProp>\n </>\n ) : (\n <>\n {showCheckbox && (\n <Checkbox\n checked={selected}\n tabIndex={-1}\n indeterminate={indeterminate}\n />\n )}\n {item.icon && (\n <span\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n )}\n <WithRenderProp\n render={\n itemLabelRender\n ? (props) => itemLabelRender(item, props)\n : undefined\n }\n as={\"span\"}\n >\n {item.label}\n </WithRenderProp>\n {item.suffix && (\n <span\n className={clsx(\n cls(\"dropdown-menu-item-suffix\"),\n classNames?.itemSuffix\n )}\n >\n {item.suffix}\n </span>\n )}\n </>\n ),\n };\n }, [\n classNames?.item,\n classNames?.itemIcon,\n classNames?.itemText,\n classNames?.itemSuffix,\n cls,\n inCombobox,\n indeterminate,\n item,\n itemRender,\n selected,\n showCheckbox,\n itemLabelRender,\n ]);\n const keywords = useMemo(\n () =>\n getItemKeywords\n ? getItemKeywords(item)\n : [String(item.key), reactNodeToString(item.label)],\n [getItemKeywords, item]\n );\n // If custom render function is provided, use it\n if (itemRender) {\n console.log(itemRender);\n return itemRender(item, {\n ...props,\n ...itemProps,\n });\n }\n const { render, ...restProps } = props;\n console.log(\n \"keywords\",\n getItemKeywords\n ? getItemKeywords(item)\n : [String(item.key), reactNodeToString(item.label)]\n );\n // Default rendering\n return renderAsNativeElement ? (\n render ? (\n render(props)\n ) : (\n <div onClick={onSelect} {...restProps} />\n )\n ) : (\n <MenuItem\n value={String(item.key)}\n keywords={keywords || undefined}\n onSelect={() => {\n onSelect(item);\n }}\n {...props}\n ></MenuItem>\n );\n};\n"],"names":["DropdownMenuItem","item","inCombobox","selected","itemRender","itemLabelRender","itemProps","classNames","onSelect","showCheckbox","indeterminate","renderAsNativeElement","getItemKeywords","cls","useCls","MenuItem","useMemo","Command","Menu","props","clsx","jsxs","Fragment","jsx","Checkbox","WithRenderProp","keywords","reactNodeToString","render","restProps"],"mappings":"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"}
@@ -1 +1 @@
1
- @layer components{.ds-dropdown-menu-root{z-index:2000}.ds-dropdown-menu{box-shadow:var(--ds-box-shadow-secondary);border-radius:var(--ds-border-radius);background:var(--ds-color-bg-elevated);list-style:none;padding:.25rem;color:var(--ds-color-text);font-size:var(--ds-font-size);font-family:var(--ds-font-family);transition-property:transform,scale,opacity;transition-duration:.2s;transition-timing-function:var(--ds-motion-ease-out);transform-origin:var(--transform-origin);max-width:min(var(--size-width),var(--available-width));max-height:var(--available-height);display:flex;flex-direction:column}.ds-dropdown-menu[data-ending-style],.ds-dropdown-menu[data-starting-style]{transform:scale(.9);opacity:0}.ds-dropdown-menu:focus{outline:none}.ds-dropdown-menu .ds-dropdown-menu-container{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-dropdown-menu .ds-dropdown-menu-search{flex-shrink:0}.ds-dropdown-menu .ds-dropdown-menu-list,.ds-dropdown-menu .ds-dropdown-menu-list [cmdk-list-sizer]{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-dropdown-menu-search{margin-bottom:.25rem}.ds-dropdown-menu-divider{border-bottom:1px solid var(--ds-color-split);margin:.25rem 0}.ds-dropdown-menu-header{font-size:.75rem;font-weight:500;line-height:1rem;text-transform:uppercase;color:var(--ds-color-text-tertiary);padding:.75rem .75rem .25rem}.ds-dropdown-menu-header:first-child{padding-top:.5rem}.ds-dropdown-menu-empty{padding:.375rem .75rem;color:var(--ds-color-text-tertiary)}.ds-dropdown-menu-match-trigger-width{width:min(var(--anchor-width),var(--available-width))}}
1
+ @layer components{.ds-dropdown-menu-root{z-index:var(--ds-z-index-dropdown)}.ds-dropdown-menu{box-shadow:var(--ds-box-shadow-secondary);border-radius:var(--ds-border-radius);background:var(--ds-color-bg-elevated);list-style:none;padding:.25rem;color:var(--ds-color-text);font-size:var(--ds-font-size);font-family:var(--ds-font-family);transition-property:transform,scale,opacity;transition-duration:.2s;transition-timing-function:var(--ds-motion-ease-out);transform-origin:var(--transform-origin);max-width:min(var(--size-width),var(--available-width));max-height:var(--available-height);display:flex;flex-direction:column}.ds-dropdown-menu[data-ending-style],.ds-dropdown-menu[data-starting-style]{transform:scale(.9);opacity:0}.ds-dropdown-menu:focus{outline:none}.ds-dropdown-menu .ds-dropdown-menu-container{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-dropdown-menu .ds-dropdown-menu-search{flex-shrink:0}.ds-dropdown-menu .ds-dropdown-menu-list,.ds-dropdown-menu .ds-dropdown-menu-list [cmdk-list-sizer]{flex-shrink:1;min-height:0;display:flex;flex-direction:column}}
@@ -0,0 +1,127 @@
1
+ import { jsx as d, jsxs as L } from "react/jsx-runtime";
2
+ import { useCallback as G, useMemo as y } from "react";
3
+ import { DropdownMenuItem as j } from "./item.js";
4
+ import { DropdownMenuDivider as E } from "./divider.js";
5
+ import { Menu as b } from "@base-ui-components/react";
6
+ import { Command as T } from "../cmdk/index.js";
7
+ import { useCls as q } from "../utils/antdUtils.js";
8
+ import { reactNodeToString as z } from "../utils/reactToString.js";
9
+ import { clsx as h } from "../utils/cn.js";
10
+ const X = ({
11
+ items: M,
12
+ inCombobox: e = !1,
13
+ classNames: o = {},
14
+ selectedItemKeys: f,
15
+ keepOpenOnSelect: v,
16
+ showCheckbox: w = !1,
17
+ getItemKeywords: S = (i) => [String(i.key), z(i.label)],
18
+ onOpenChange: l,
19
+ itemRender: g,
20
+ itemLabelRender: k
21
+ }) => {
22
+ const i = q(), n = G(
23
+ (r, u, p) => r.type === "item" ? /* @__PURE__ */ d(
24
+ j,
25
+ {
26
+ item: r,
27
+ inCombobox: e,
28
+ selected: f == null ? void 0 : f.includes(r.key),
29
+ onSelect: e ? r.onSelect ? r.onSelect : () => {
30
+ const t = new MouseEvent("click", {
31
+ bubbles: !0,
32
+ cancelable: !0
33
+ });
34
+ r.onClick(t), v || l == null || l(!1);
35
+ } : void 0,
36
+ itemRender: g,
37
+ showCheckbox: w,
38
+ getItemKeywords: S,
39
+ itemLabelRender: k,
40
+ classNames: {
41
+ item: o.item,
42
+ itemIcon: o.itemIcon,
43
+ itemSuffix: o.itemSuffix
44
+ }
45
+ },
46
+ u + "-" + p
47
+ ) : r.type === "divider" ? /* @__PURE__ */ d(
48
+ E,
49
+ {
50
+ inCombobox: e,
51
+ className: o == null ? void 0 : o.divider
52
+ },
53
+ u + "-" + p
54
+ ) : null,
55
+ [
56
+ o,
57
+ g,
58
+ l,
59
+ e,
60
+ v,
61
+ f,
62
+ w,
63
+ S,
64
+ k
65
+ ]
66
+ ), D = G(
67
+ (r, u) => /* @__PURE__ */ L(
68
+ b.Group,
69
+ {
70
+ className: h(i("dropdown-menu-group"), o == null ? void 0 : o.group),
71
+ children: [
72
+ r.label && /* @__PURE__ */ d(
73
+ b.GroupLabel,
74
+ {
75
+ className: h(
76
+ i("dropdown-menu-header"),
77
+ o == null ? void 0 : o.groupLabel
78
+ ),
79
+ children: /* @__PURE__ */ d("span", { children: r.label })
80
+ }
81
+ ),
82
+ r.items.map((p, t) => n(p, u, t))
83
+ ]
84
+ },
85
+ "group" + u
86
+ ),
87
+ [i, o, n]
88
+ ), m = G(
89
+ (r, u) => r.label ? /* @__PURE__ */ d(
90
+ T.Group,
91
+ {
92
+ className: h(i("dropdown-menu-group"), o == null ? void 0 : o.group),
93
+ heading: /* @__PURE__ */ d(
94
+ b.GroupLabel,
95
+ {
96
+ className: h(
97
+ i("dropdown-menu-header"),
98
+ o == null ? void 0 : o.groupLabel
99
+ ),
100
+ children: /* @__PURE__ */ d("span", { children: r.label })
101
+ }
102
+ ),
103
+ children: r.items.map((p, t) => n(p, u, t))
104
+ },
105
+ "group" + u
106
+ ) : r.items.map((p, t) => n(p, u, t)),
107
+ [i, o, n]
108
+ );
109
+ return {
110
+ itemGroups: y(
111
+ () => M.reduce((r, u) => (r.length === 0 && u.type !== "header" && r.push({
112
+ label: null,
113
+ items: []
114
+ }), u.type === "header" ? r.push({
115
+ label: u.title,
116
+ items: []
117
+ }) : (u.type === "item" || u.type === "divider") && r.length > 0 && r[r.length - 1].items.push(u), r), []),
118
+ [M]
119
+ ),
120
+ renderMenuItem: n,
121
+ renderGroup: e ? m : D
122
+ };
123
+ };
124
+ export {
125
+ X as useDropdownMenu
126
+ };
127
+ //# sourceMappingURL=useDropdownMenu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useDropdownMenu.js","sources":["../../../src/components/dropdown-menu/useDropdownMenu.tsx"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\nimport { DropdownMenuItemType, DropdownMenuGroup } from \"./types\";\nimport { DropdownMenuItem } from \"./item\";\nimport { DropdownMenuDivider } from \"./divider\";\nimport { reactNodeToString, clsx, useCls } from \"../utils\";\nimport { Menu } from \"@base-ui-components/react\";\nimport { Command } from \"../cmdk\";\n\nexport interface UseDropdownMenuProps {\n /**\n * Callback function to handle the open state change of the dropdown menu.\n */\n onOpenChange?: (open: boolean) => void;\n items: DropdownMenuItemType[];\n inCombobox?: boolean;\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemSuffix?: string;\n group?: string;\n groupLabel?: string;\n divider?: string;\n };\n /**\n * Custom render function for menu items\n */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Custom render function for menu item labels\n */\n itemLabelRender?: (\n item: DropdownMenuItemType & { type: \"item\" },\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Whether to keep the dropdown open when an item is selected\n * @default false\n */\n keepOpenOnSelect?: boolean;\n /**\n * Control the highlighted state of the menu item\n */\n highlightedItemKey?: React.Key;\n /**\n * Control the selected state of the menu item\n */\n selectedItemKeys?: React.Key[];\n /**\n * Whether to show checkbox\n * @default false\n */\n showCheckbox?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuItemType & { type: \"item\" }) => string[];\n}\n\nexport const useDropdownMenu = ({\n items,\n inCombobox = false,\n classNames = {},\n selectedItemKeys,\n keepOpenOnSelect,\n showCheckbox = false,\n getItemKeywords = (item) => [String(item.key), reactNodeToString(item.label)],\n onOpenChange,\n itemRender,\n itemLabelRender,\n}: UseDropdownMenuProps) => {\n const cls = useCls();\n const renderMenuItem = useCallback(\n (item: DropdownMenuItemType, i: number, j: number) => {\n if (item.type === \"item\") {\n return (\n <DropdownMenuItem\n key={i + \"-\" + j}\n item={item}\n inCombobox={inCombobox}\n selected={selectedItemKeys?.includes(item.key)}\n onSelect={\n inCombobox\n ? item.onSelect\n ? item.onSelect\n : () => {\n const e = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n }) as unknown as React.MouseEvent<\n HTMLElement,\n MouseEvent\n >;\n item.onClick(e);\n if (!keepOpenOnSelect) onOpenChange?.(false);\n }\n : undefined\n }\n itemRender={itemRender}\n showCheckbox={showCheckbox}\n getItemKeywords={getItemKeywords}\n itemLabelRender={itemLabelRender}\n classNames={{\n item: classNames.item,\n itemIcon: classNames.itemIcon,\n itemSuffix: classNames.itemSuffix,\n }}\n />\n );\n } else if (item.type === \"divider\") {\n return (\n <DropdownMenuDivider\n key={i + \"-\" + j}\n inCombobox={inCombobox}\n className={classNames?.divider}\n />\n );\n }\n return null;\n },\n [\n classNames,\n itemRender,\n onOpenChange,\n inCombobox,\n keepOpenOnSelect,\n selectedItemKeys,\n showCheckbox,\n getItemKeywords,\n itemLabelRender,\n ]\n );\n\n const renderGroup = useCallback(\n (group: DropdownMenuGroup, index: number) => (\n <Menu.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n >\n {group.label && (\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n )}\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Menu.Group>\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderGroupCombobox = useCallback(\n (group: DropdownMenuGroup, index: number) =>\n group.label ? (\n <Command.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n heading={\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n }\n >\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Command.Group>\n ) : (\n group.items.map((item, j) => renderMenuItem(item, index, j))\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const itemGroups = useMemo(\n () =>\n items.reduce<DropdownMenuGroup[]>((acc, current) => {\n // If no groups exist yet and current item is not a header, create default group\n if (acc.length === 0 && current.type !== \"header\") {\n acc.push({\n label: null,\n items: [],\n });\n }\n\n // If it's a header, create a new group\n if (current.type === \"header\") {\n acc.push({\n label: current.title,\n items: [],\n });\n }\n // If it's an item and we have at least one group, add it to the last group's items\n else if (\n (current.type === \"item\" || current.type === \"divider\") &&\n acc.length > 0\n ) {\n acc[acc.length - 1].items.push(current);\n }\n // Skip dividers\n return acc;\n }, []),\n [items]\n );\n return {\n itemGroups,\n renderMenuItem,\n renderGroup: inCombobox ? renderGroupCombobox : renderGroup,\n };\n};\n"],"names":["useDropdownMenu","items","inCombobox","classNames","selectedItemKeys","keepOpenOnSelect","showCheckbox","getItemKeywords","item","reactNodeToString","onOpenChange","itemRender","itemLabelRender","cls","useCls","renderMenuItem","useCallback","i","j","jsx","DropdownMenuItem","e","DropdownMenuDivider","renderGroup","group","index","jsxs","Menu","clsx","renderGroupCombobox","Command","useMemo","acc","current"],"mappings":"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"}
@@ -2,32 +2,32 @@
2
2
  import { jsx as r } from "react/jsx-runtime";
3
3
  import { MagnifyingGlassIcon as p, EyeIcon as x, EyeClosedIcon as C } from "@bioturing/assets";
4
4
  import { Input as n } from "antd";
5
- import { forwardRef as a, useCallback as d, useMemo as P } from "react";
5
+ import { forwardRef as i, useCallback as d, useMemo as P } from "react";
6
6
  import './style.css';/* empty css */
7
7
  import { useCls as g } from "../utils/antdUtils.js";
8
8
  import { Spin as z } from "../spin/component.js";
9
9
  import { IconButton as M } from "../icon-button/component.js";
10
- const T = (e, s) => /* @__PURE__ */ r(n, { ref: s, ...e }), y = (e, s) => {
10
+ const T = (t, s) => /* @__PURE__ */ r(n, { ref: s, ...t }), y = (t, s) => {
11
11
  const o = P(() => ({
12
- iconRender: (t) => /* @__PURE__ */ r(
12
+ iconRender: (e) => /* @__PURE__ */ r(
13
13
  M,
14
14
  {
15
15
  size: "small",
16
- label: t ? "Hide password" : "Show password",
17
- children: t ? /* @__PURE__ */ r(x, {}) : /* @__PURE__ */ r(C, {})
16
+ label: e ? "Hide password" : "Show password",
17
+ children: e ? /* @__PURE__ */ r(x, {}) : /* @__PURE__ */ r(C, {})
18
18
  }
19
19
  ),
20
- ...e
21
- }), [e]);
20
+ ...t
21
+ }), [t]);
22
22
  return /* @__PURE__ */ r(n.Password, { ref: s, ...o });
23
23
  }, A = ({
24
- enterButton: e = !1,
24
+ enterButton: t = !1,
25
25
  onSearch: s,
26
26
  prefix: o,
27
- onPressEnter: t,
28
- onClear: i,
29
- loading: c,
30
- ...u
27
+ onPressEnter: e,
28
+ onClear: a,
29
+ loading: u,
30
+ ...c
31
31
  }, l) => {
32
32
  const I = g(), f = d(
33
33
  (m) => {
@@ -37,29 +37,30 @@ const T = (e, s) => /* @__PURE__ */ r(n, { ref: s, ...e }), y = (e, s) => {
37
37
  ), w = d(() => {
38
38
  s == null || s("", void 0, { source: "clear" });
39
39
  }, [s]);
40
- return e === !1 ? /* @__PURE__ */ r(
40
+ return t === !1 ? /* @__PURE__ */ r(
41
41
  n,
42
42
  {
43
43
  ref: l,
44
- prefix: o || (c ? /* @__PURE__ */ r(z, { size: 16 }) : /* @__PURE__ */ r(p, { size: 16, className: I("input-search-icon") })),
45
- onPressEnter: t || f,
46
- onClear: i || w,
44
+ prefix: o || (u ? /* @__PURE__ */ r(z, { size: 16 }) : /* @__PURE__ */ r(p, { size: 16, className: I("input-search-icon") })),
45
+ onPressEnter: e || f,
46
+ onClear: a || w,
47
47
  allowClear: !0,
48
- ...u
48
+ ...c
49
49
  }
50
50
  ) : /* @__PURE__ */ r(
51
51
  n.Search,
52
52
  {
53
53
  ref: l,
54
54
  prefix: o,
55
- onPressEnter: t,
56
- onClear: i,
57
- loading: c,
58
- enterButton: e === !0 ? /* @__PURE__ */ r(p, { size: 16 }) : e,
59
- ...u
55
+ onPressEnter: e,
56
+ onSearch: s,
57
+ onClear: a,
58
+ loading: u,
59
+ enterButton: t === !0 ? /* @__PURE__ */ r(p, { size: 16 }) : t,
60
+ ...c
60
61
  }
61
62
  );
62
- }, E = (e, s) => /* @__PURE__ */ r(n.TextArea, { ref: s, ...e }), b = a(T), j = a(y), R = a(A), k = a(E), D = Object.assign(b, {
63
+ }, E = (t, s) => /* @__PURE__ */ r(n.TextArea, { ref: s, ...t }), b = i(T), j = i(y), R = i(A), k = i(E), D = Object.assign(b, {
63
64
  Password: j,
64
65
  Search: R,
65
66
  TextArea: k