@frontify/fondue-components 8.0.0 → 8.0.2
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.
- package/dist/fondue-components10.js +1 -1
- package/dist/fondue-components11.js +65 -75
- package/dist/fondue-components11.js.map +1 -1
- package/dist/fondue-components12.js +1 -1
- package/dist/fondue-components14.js +1 -1
- package/dist/fondue-components15.js +1 -1
- package/dist/fondue-components16.js +1 -1
- package/dist/fondue-components17.js +2 -2
- package/dist/fondue-components18.js +6 -6
- package/dist/fondue-components19.js +1 -1
- package/dist/fondue-components20.js +1 -1
- package/dist/fondue-components21.js +46 -46
- package/dist/fondue-components21.js.map +1 -1
- package/dist/fondue-components22.js +3 -3
- package/dist/fondue-components23.js +1 -1
- package/dist/fondue-components24.js +1 -1
- package/dist/fondue-components28.js +2 -2
- package/dist/fondue-components28.js.map +1 -1
- package/dist/fondue-components31.js +1 -1
- package/dist/fondue-components33.js +15 -15
- package/dist/fondue-components33.js.map +1 -1
- package/dist/fondue-components37.js +10 -25
- package/dist/fondue-components37.js.map +1 -1
- package/dist/fondue-components4.js +20 -18
- package/dist/fondue-components4.js.map +1 -1
- package/dist/fondue-components40.js +17 -14
- package/dist/fondue-components40.js.map +1 -1
- package/dist/fondue-components41.js +17 -18
- package/dist/fondue-components41.js.map +1 -1
- package/dist/fondue-components42.js +4 -16
- package/dist/fondue-components42.js.map +1 -1
- package/dist/fondue-components43.js +13 -3
- package/dist/fondue-components43.js.map +1 -1
- package/dist/fondue-components44.js +3 -13
- package/dist/fondue-components44.js.map +1 -1
- package/dist/fondue-components45.js +35 -5
- package/dist/fondue-components45.js.map +1 -1
- package/dist/fondue-components46.js +13 -35
- package/dist/fondue-components46.js.map +1 -1
- package/dist/fondue-components47.js +4 -12
- package/dist/fondue-components47.js.map +1 -1
- package/dist/fondue-components48.js +24 -4
- package/dist/fondue-components48.js.map +1 -1
- package/dist/fondue-components49.js +16 -24
- package/dist/fondue-components49.js.map +1 -1
- package/dist/fondue-components50.js +139 -16
- package/dist/fondue-components50.js.map +1 -1
- package/dist/fondue-components51.js +16 -140
- package/dist/fondue-components51.js.map +1 -1
- package/dist/fondue-components52.js +70 -16
- package/dist/fondue-components52.js.map +1 -1
- package/dist/fondue-components53.js +8 -72
- package/dist/fondue-components53.js.map +1 -1
- package/dist/fondue-components54.js +33 -8
- package/dist/fondue-components54.js.map +1 -1
- package/dist/fondue-components55.js +48 -32
- package/dist/fondue-components55.js.map +1 -1
- package/dist/fondue-components56.js +10 -48
- package/dist/fondue-components56.js.map +1 -1
- package/dist/fondue-components57.js +10 -8
- package/dist/fondue-components57.js.map +1 -1
- package/dist/fondue-components58.js +7 -12
- package/dist/fondue-components58.js.map +1 -1
- package/dist/fondue-components59.js +12 -7
- package/dist/fondue-components59.js.map +1 -1
- package/dist/fondue-components60.js +20 -12
- package/dist/fondue-components60.js.map +1 -1
- package/dist/fondue-components61.js +15 -19
- package/dist/fondue-components61.js.map +1 -1
- package/dist/fondue-components62.js +52 -14
- package/dist/fondue-components62.js.map +1 -1
- package/dist/fondue-components63.js +14 -52
- package/dist/fondue-components63.js.map +1 -1
- package/dist/fondue-components64.js +17 -14
- package/dist/fondue-components64.js.map +1 -1
- package/dist/fondue-components65.js +6 -17
- package/dist/fondue-components65.js.map +1 -1
- package/dist/fondue-components66.js +2 -7
- package/dist/fondue-components66.js.map +1 -1
- package/dist/fondue-components67.js +15 -2
- package/dist/fondue-components67.js.map +1 -1
- package/dist/fondue-components68.js +38 -14
- package/dist/fondue-components68.js.map +1 -1
- package/dist/fondue-components9.js +91 -101
- package/dist/fondue-components9.js.map +1 -1
- package/dist/index.d.ts +1 -2
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/dist/fondue-components69.js +0 -42
- package/dist/fondue-components69.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fondue-components9.js","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretRight } from '@frontify/fondue-icons';\nimport * as RadixDropdown from '@radix-ui/react-dropdown-menu';\nimport { Slot } from '@radix-ui/react-slot';\nimport { forwardRef, useRef, type ForwardedRef, type ReactNode } from 'react';\n\nimport { usePreventDropdownOverflow } from '#/hooks/usePreventDropdownOverflow';\nimport { syncRefs } from '#/utilities/domUtilities';\n\nimport { useProcessedChildren } from './hooks/useProcessedChildren';\nimport styles from './styles/dropdown.module.scss';\n\nexport type DropdownRootProps = {\n children?: ReactNode;\n /**\n * Controls the open state of the dropdown.\n */\n open?: boolean;\n /**\n * Callback that is called when the open state of the dropdown changes.\n */\n onOpenChange?: (open: boolean) => void;\n\n 'data-test-id'?: string;\n};\n\nexport const DropdownRoot = ({\n children,\n open,\n onOpenChange,\n\n 'data-test-id': dataTestId = 'fondue-dropdown',\n}: DropdownRootProps) => {\n return (\n <RadixDropdown.Root open={open} onOpenChange={onOpenChange} data-test-id={dataTestId}>\n {children}\n </RadixDropdown.Root>\n );\n};\nDropdownRoot.displayName = 'Dropdown.Root';\n\nexport type DropdownTriggerProps = {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n * @default true\n */\n asChild?: boolean;\n children?: ReactNode;\n 'data-test-id'?: string;\n};\n\nexport const DropdownTrigger = (\n {\n asChild = true,\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-trigger',\n ...props\n }: DropdownTriggerProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) => {\n return (\n <RadixDropdown.Trigger asChild={asChild} data-test-id={dataTestId} ref={ref} {...props}>\n {children}\n </RadixDropdown.Trigger>\n );\n};\nDropdownTrigger.displayName = 'Dropdown.Trigger';\n\nexport type DropdownContentProps = {\n children?: ReactNode;\n 'data-test-id'?: string;\n onOpen?: () => void;\n onClose?: () => void;\n /**\n * The vertical padding around each dropdown item.\n * @default \"comfortable\"\n */\n padding?: 'comfortable' | 'compact';\n /**\n * Defines the alignment of the dropdown.\n * @default \"start\"\n */\n align?: 'start' | 'center' | 'end';\n /**\n * Defines the preferred side of the dropdown. It will not be respected if there are collisions with the viewport.\n * @default \"bottom\"\n */\n side?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * Prevents the focus from being set on the trigger when the dropdown is closed.\n */\n preventTriggerFocusOnClose?: boolean;\n};\n\nexport const DropdownContent = (\n {\n onOpen,\n onClose,\n side = 'bottom',\n padding = 'comfortable',\n align = 'start',\n children,\n preventTriggerFocusOnClose,\n 'data-test-id': dataTestId = 'fondue-dropdown-content',\n }: DropdownContentProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const localRef = useRef(null);\n const dropdownIsOpen = useRef(false);\n\n const { setMaxHeight } = usePreventDropdownOverflow(localRef);\n\n return (\n <RadixDropdown.Portal>\n <RadixDropdown.Content\n align={align}\n collisionPadding={8}\n sideOffset={8}\n side={side}\n className={styles.content}\n data-padding={padding}\n data-test-id={dataTestId}\n ref={localRef}\n onCloseAutoFocus={(event) => {\n if (preventTriggerFocusOnClose) {\n event.preventDefault();\n }\n syncRefs(localRef, ref);\n onClose && onClose();\n dropdownIsOpen.current = false;\n }}\n onFocus={() => {\n if (!dropdownIsOpen.current) {\n setMaxHeight();\n syncRefs(localRef, ref);\n onOpen && onOpen();\n dropdownIsOpen.current = true;\n }\n }}\n >\n {children}\n </RadixDropdown.Content>\n </RadixDropdown.Portal>\n );\n};\nDropdownContent.displayName = 'Dropdown.Content';\n\nexport type DropdownGroupProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownGroup = (\n { children, 'data-test-id': dataTestId = 'fondue-dropdown-group' }: DropdownGroupProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <RadixDropdown.Group className={styles.group} data-test-id={dataTestId} ref={ref}>\n {children}\n </RadixDropdown.Group>\n );\n};\nDropdownGroup.displayName = 'Dropdown.Group';\n\nexport type DropdownSubMenuProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownSubMenu = ({\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-submenu',\n}: DropdownSubMenuProps) => {\n return <RadixDropdown.Sub data-test-id={dataTestId}>{children}</RadixDropdown.Sub>;\n};\nDropdownSubMenu.displayName = 'Dropdown.SubMenu';\n\nexport type DropdownSubTriggerProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownSubTrigger = (\n { children, 'data-test-id': dataTestId = 'fondue-dropdown-subtrigger' }: DropdownSubTriggerProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const { content } = useProcessedChildren(children);\n return (\n <RadixDropdown.SubTrigger className={styles.subTrigger} data-test-id={dataTestId} ref={ref}>\n {content}\n <IconCaretRight className={styles.subMenuIndicator} size={16} />\n </RadixDropdown.SubTrigger>\n );\n};\nDropdownSubTrigger.displayName = 'Dropdown.SubTrigger';\n\nexport type DropdownSubContentProps = {\n /**\n * The vertical padding around each dropdown item.\n * @default \"comfortable\"\n */\n padding?: 'comfortable' | 'compact';\n children: ReactNode;\n 'data-test-id'?: string;\n};\n\nexport const DropdownSubContent = (\n {\n padding = 'comfortable',\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-subcontent',\n }: DropdownSubContentProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <RadixDropdown.Portal>\n <RadixDropdown.SubContent\n className={styles.subContent}\n data-padding={padding}\n data-test-id={dataTestId}\n ref={ref}\n >\n {children}\n </RadixDropdown.SubContent>\n </RadixDropdown.Portal>\n );\n};\nDropdownSubContent.displayName = 'Dropdown.SubContent';\n\nexport type DropdownItemProps = {\n children: ReactNode;\n /**\n * Disables the item.\n */\n disabled?: boolean;\n /**\n * The text value of the item that is passed to the onSelect callback.\n */\n textValue?: string;\n /**\n * The style of the item.\n * @default \"default\"\n */\n emphasis?: 'default' | 'danger';\n /**\n * Callback that is called when the item is selected.\n */\n onSelect?: (event: Event) => void;\n 'data-test-id'?: string;\n};\n\nexport const DropdownItem = (\n {\n children,\n disabled,\n textValue,\n onSelect,\n emphasis = 'default',\n 'data-test-id': dataTestId = 'fondue-dropdown-subtrigger',\n ...props\n }: DropdownItemProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const { content, isLink } = useProcessedChildren(children);\n\n const Wrapper = isLink ? Slot : 'div';\n\n return (\n <RadixDropdown.Item\n onSelect={onSelect}\n className={styles.item}\n textValue={textValue}\n data-test-id={dataTestId}\n data-emphasis={emphasis}\n ref={ref}\n disabled={disabled}\n asChild\n {...props}\n >\n <Wrapper>{content}</Wrapper>\n </RadixDropdown.Item>\n );\n};\nDropdownItem.displayName = 'Dropdown.Item';\n\nexport type DropdownSlotProps = { children: ReactNode; name?: 'left' | 'right'; 'data-test-id'?: string };\n\nexport const DropdownSlot = (\n { children, name, 'data-test-id': dataTestId = 'fondue-dropdown-slot' }: DropdownSlotProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <div data-name={name} className={styles.slot} data-test-id={dataTestId} ref={ref}>\n {children}\n </div>\n );\n};\nDropdownSlot.displayName = 'Dropdown.Slot';\n\nconst ForwardedRefDropdownTrigger = forwardRef<HTMLButtonElement, DropdownTriggerProps>(DropdownTrigger);\nconst ForwardedRefDropdownContent = forwardRef<HTMLDivElement, DropdownContentProps>(DropdownContent);\nconst ForwardedRefDropdownGroup = forwardRef<HTMLDivElement, DropdownGroupProps>(DropdownGroup);\nconst ForwardedRefDropdownSubTrigger = forwardRef<HTMLDivElement, DropdownSubTriggerProps>(DropdownSubTrigger);\nconst ForwardedRefDropdownSubContent = forwardRef<HTMLDivElement, DropdownSubContentProps>(DropdownSubContent);\nconst ForwardedRefDropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(DropdownItem);\nconst ForwardedRefDropdownSlot = forwardRef<HTMLDivElement, DropdownSlotProps>(DropdownSlot);\n\nexport const Dropdown = {\n Root: DropdownRoot,\n Trigger: ForwardedRefDropdownTrigger,\n Content: ForwardedRefDropdownContent,\n Group: ForwardedRefDropdownGroup,\n SubMenu: DropdownSubMenu,\n SubTrigger: ForwardedRefDropdownSubTrigger,\n SubContent: ForwardedRefDropdownSubContent,\n Item: ForwardedRefDropdownItem,\n Slot: ForwardedRefDropdownSlot,\n};\n"],"names":["DropdownRoot","children","open","onOpenChange","dataTestId","jsx","RadixDropdown","DropdownTrigger","asChild","props","ref","DropdownContent","onOpen","onClose","side","padding","align","preventTriggerFocusOnClose","localRef","useRef","dropdownIsOpen","setMaxHeight","usePreventDropdownOverflow","styles","event","syncRefs","DropdownGroup","DropdownSubMenu","DropdownSubTrigger","content","useProcessedChildren","jsxs","IconCaretRight","DropdownSubContent","DropdownItem","disabled","textValue","onSelect","emphasis","isLink","Wrapper","Slot","DropdownSlot","name","ForwardedRefDropdownTrigger","forwardRef","ForwardedRefDropdownContent","ForwardedRefDropdownGroup","ForwardedRefDropdownSubTrigger","ForwardedRefDropdownSubContent","ForwardedRefDropdownItem","ForwardedRefDropdownSlot","Dropdown"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fondue-components9.js","sources":["../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretRight } from '@frontify/fondue-icons';\nimport * as RadixDropdown from '@radix-ui/react-dropdown-menu';\nimport { Slot } from '@radix-ui/react-slot';\nimport { forwardRef, type ForwardedRef, type ReactNode } from 'react';\n\nimport { useProcessedChildren } from './hooks/useProcessedChildren';\nimport styles from './styles/dropdown.module.scss';\n\nexport type DropdownRootProps = {\n children?: ReactNode;\n /**\n * Controls the open state of the dropdown.\n */\n open?: boolean;\n /**\n * Callback that is called when the open state of the dropdown changes.\n */\n onOpenChange?: (open: boolean) => void;\n\n 'data-test-id'?: string;\n};\n\nexport const DropdownRoot = ({\n children,\n open,\n onOpenChange,\n\n 'data-test-id': dataTestId = 'fondue-dropdown',\n}: DropdownRootProps) => {\n return (\n <RadixDropdown.Root open={open} onOpenChange={onOpenChange} data-test-id={dataTestId}>\n {children}\n </RadixDropdown.Root>\n );\n};\nDropdownRoot.displayName = 'Dropdown.Root';\n\nexport type DropdownTriggerProps = {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n * @default true\n */\n asChild?: boolean;\n children?: ReactNode;\n 'data-test-id'?: string;\n};\n\nexport const DropdownTrigger = (\n {\n asChild = true,\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-trigger',\n ...props\n }: DropdownTriggerProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) => {\n return (\n <RadixDropdown.Trigger asChild={asChild} data-test-id={dataTestId} ref={ref} {...props}>\n {children}\n </RadixDropdown.Trigger>\n );\n};\nDropdownTrigger.displayName = 'Dropdown.Trigger';\n\nexport type DropdownContentProps = {\n children?: ReactNode;\n 'data-test-id'?: string;\n /**\n * The vertical padding around each dropdown item.\n * @default \"comfortable\"\n */\n padding?: 'comfortable' | 'compact';\n /**\n * Defines the alignment of the dropdown.\n * @default \"start\"\n */\n align?: 'start' | 'center' | 'end';\n /**\n * Defines the preferred side of the dropdown. It will not be respected if there are collisions with the viewport.\n * @default \"bottom\"\n */\n side?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * Prevents the focus from being set on the trigger when the dropdown is closed.\n */\n preventTriggerFocusOnClose?: boolean;\n};\n\nexport const DropdownContent = (\n {\n side = 'bottom',\n padding = 'comfortable',\n align = 'start',\n children,\n preventTriggerFocusOnClose,\n 'data-test-id': dataTestId = 'fondue-dropdown-content',\n }: DropdownContentProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <RadixDropdown.Portal>\n <RadixDropdown.Content\n align={align}\n collisionPadding={8}\n sideOffset={8}\n side={side}\n className={styles.content}\n data-padding={padding}\n data-test-id={dataTestId}\n ref={ref}\n onCloseAutoFocus={(event) => {\n if (preventTriggerFocusOnClose) {\n event.preventDefault();\n }\n }}\n >\n {children}\n </RadixDropdown.Content>\n </RadixDropdown.Portal>\n );\n};\nDropdownContent.displayName = 'Dropdown.Content';\n\nexport type DropdownGroupProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownGroup = (\n { children, 'data-test-id': dataTestId = 'fondue-dropdown-group' }: DropdownGroupProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <RadixDropdown.Group className={styles.group} data-test-id={dataTestId} ref={ref}>\n {children}\n </RadixDropdown.Group>\n );\n};\nDropdownGroup.displayName = 'Dropdown.Group';\n\nexport type DropdownSubMenuProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownSubMenu = ({\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-submenu',\n}: DropdownSubMenuProps) => {\n return <RadixDropdown.Sub data-test-id={dataTestId}>{children}</RadixDropdown.Sub>;\n};\nDropdownSubMenu.displayName = 'Dropdown.SubMenu';\n\nexport type DropdownSubTriggerProps = { children: ReactNode; 'data-test-id'?: string };\n\nexport const DropdownSubTrigger = (\n { children, 'data-test-id': dataTestId = 'fondue-dropdown-subtrigger' }: DropdownSubTriggerProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const { content } = useProcessedChildren(children);\n return (\n <RadixDropdown.SubTrigger className={styles.subTrigger} data-test-id={dataTestId} ref={ref}>\n {content}\n <IconCaretRight className={styles.subMenuIndicator} size={16} />\n </RadixDropdown.SubTrigger>\n );\n};\nDropdownSubTrigger.displayName = 'Dropdown.SubTrigger';\n\nexport type DropdownSubContentProps = {\n /**\n * The vertical padding around each dropdown item.\n * @default \"comfortable\"\n */\n padding?: 'comfortable' | 'compact';\n children: ReactNode;\n 'data-test-id'?: string;\n};\n\nexport const DropdownSubContent = (\n {\n padding = 'comfortable',\n children,\n 'data-test-id': dataTestId = 'fondue-dropdown-subcontent',\n }: DropdownSubContentProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <RadixDropdown.Portal>\n <RadixDropdown.SubContent\n className={styles.subContent}\n data-padding={padding}\n data-test-id={dataTestId}\n ref={ref}\n >\n {children}\n </RadixDropdown.SubContent>\n </RadixDropdown.Portal>\n );\n};\nDropdownSubContent.displayName = 'Dropdown.SubContent';\n\nexport type DropdownItemProps = {\n children: ReactNode;\n /**\n * Disables the item.\n */\n disabled?: boolean;\n /**\n * The text value of the item that is passed to the onSelect callback.\n */\n textValue?: string;\n /**\n * The style of the item.\n * @default \"default\"\n */\n emphasis?: 'default' | 'danger';\n /**\n * Callback that is called when the item is selected.\n */\n onSelect?: (event: Event) => void;\n 'data-test-id'?: string;\n};\n\nexport const DropdownItem = (\n {\n children,\n disabled,\n textValue,\n onSelect,\n emphasis = 'default',\n 'data-test-id': dataTestId = 'fondue-dropdown-subtrigger',\n ...props\n }: DropdownItemProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n const { content, isLink } = useProcessedChildren(children);\n\n const Wrapper = isLink ? Slot : 'div';\n\n return (\n <RadixDropdown.Item\n onSelect={onSelect}\n className={styles.item}\n textValue={textValue}\n data-test-id={dataTestId}\n data-emphasis={emphasis}\n ref={ref}\n disabled={disabled}\n asChild\n {...props}\n >\n <Wrapper>{content}</Wrapper>\n </RadixDropdown.Item>\n );\n};\nDropdownItem.displayName = 'Dropdown.Item';\n\nexport type DropdownSlotProps = { children: ReactNode; name?: 'left' | 'right'; 'data-test-id'?: string };\n\nexport const DropdownSlot = (\n { children, name, 'data-test-id': dataTestId = 'fondue-dropdown-slot' }: DropdownSlotProps,\n ref: ForwardedRef<HTMLDivElement>,\n) => {\n return (\n <div data-name={name} className={styles.slot} data-test-id={dataTestId} ref={ref}>\n {children}\n </div>\n );\n};\nDropdownSlot.displayName = 'Dropdown.Slot';\n\nconst ForwardedRefDropdownTrigger = forwardRef<HTMLButtonElement, DropdownTriggerProps>(DropdownTrigger);\nconst ForwardedRefDropdownContent = forwardRef<HTMLDivElement, DropdownContentProps>(DropdownContent);\nconst ForwardedRefDropdownGroup = forwardRef<HTMLDivElement, DropdownGroupProps>(DropdownGroup);\nconst ForwardedRefDropdownSubTrigger = forwardRef<HTMLDivElement, DropdownSubTriggerProps>(DropdownSubTrigger);\nconst ForwardedRefDropdownSubContent = forwardRef<HTMLDivElement, DropdownSubContentProps>(DropdownSubContent);\nconst ForwardedRefDropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(DropdownItem);\nconst ForwardedRefDropdownSlot = forwardRef<HTMLDivElement, DropdownSlotProps>(DropdownSlot);\n\nexport const Dropdown = {\n Root: DropdownRoot,\n Trigger: ForwardedRefDropdownTrigger,\n Content: ForwardedRefDropdownContent,\n Group: ForwardedRefDropdownGroup,\n SubMenu: DropdownSubMenu,\n SubTrigger: ForwardedRefDropdownSubTrigger,\n SubContent: ForwardedRefDropdownSubContent,\n Item: ForwardedRefDropdownItem,\n Slot: ForwardedRefDropdownSlot,\n};\n"],"names":["DropdownRoot","children","open","onOpenChange","dataTestId","jsx","RadixDropdown","DropdownTrigger","asChild","props","ref","DropdownContent","side","padding","align","preventTriggerFocusOnClose","styles","event","DropdownGroup","DropdownSubMenu","DropdownSubTrigger","content","useProcessedChildren","jsxs","IconCaretRight","DropdownSubContent","DropdownItem","disabled","textValue","onSelect","emphasis","isLink","Wrapper","Slot","DropdownSlot","name","ForwardedRefDropdownTrigger","forwardRef","ForwardedRefDropdownContent","ForwardedRefDropdownGroup","ForwardedRefDropdownSubTrigger","ForwardedRefDropdownSubContent","ForwardedRefDropdownItem","ForwardedRefDropdownSlot","Dropdown"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -105,6 +105,7 @@ declare type ButtonProps = {
|
|
|
105
105
|
hugWidth?: boolean;
|
|
106
106
|
children?: ReactNode;
|
|
107
107
|
onPress?: (event?: MouseEvent_2<HTMLButtonElement>) => void;
|
|
108
|
+
form?: string;
|
|
108
109
|
'aria-label'?: string;
|
|
109
110
|
'aria-describedby'?: string;
|
|
110
111
|
'data-test-id'?: string;
|
|
@@ -510,8 +511,6 @@ export declare const Dropdown: {
|
|
|
510
511
|
declare type DropdownContentProps = {
|
|
511
512
|
children?: ReactNode;
|
|
512
513
|
'data-test-id'?: string;
|
|
513
|
-
onOpen?: () => void;
|
|
514
|
-
onClose?: () => void;
|
|
515
514
|
/**
|
|
516
515
|
* The vertical padding around each dropdown item.
|
|
517
516
|
* @default "comfortable"
|