flowbite-react/dist/esm/components/Dropdown/DropdownItem.mjs.map

Official React components built for Flowbite and Tailwind CSS

{"version":3,"file":"DropdownItem.mjs","sources":["../../../../src/components/Dropdown/DropdownItem.tsx"],"sourcesContent":["\"use client\";\n\nimport { useListItem, useMergeRefs } from \"@floating-ui/react\";\nimport { forwardRef, type ComponentProps, type ElementType, type FC, type RefCallback } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport type { PolymorphicComponentPropWithRef, PolymorphicRef } from \"../../helpers/generic-as-prop\";\nimport { mergeDeep } from \"../../helpers/merge-deep\";\nimport type { DeepPartial } from \"../../types\";\nimport { ButtonBase, type ButtonBaseProps } from \"../Button/ButtonBase\";\nimport { useDropdownContext } from \"./DropdownContext\";\n\nexport interface FlowbiteDropdownItemTheme {\n  container: string;\n  base: string;\n  icon: string;\n}\n\nexport type DropdownItemProps<T extends ElementType = \"button\"> = PolymorphicComponentPropWithRef<\n  T,\n  {\n    href?: string;\n    icon?: FC<ComponentProps<\"svg\">>;\n    onClick?: () => void;\n    theme?: DeepPartial<FlowbiteDropdownItemTheme>;\n  }\n>;\n\ntype DropdownItemType = (<C extends ElementType = \"button\">(props: DropdownItemProps<C>) => JSX.Element) & {\n  displayName?: string;\n};\n\nexport const DropdownItem = forwardRef(\n  <T extends ElementType = \"button\">(\n    { children, className, icon: Icon, onClick, theme: customTheme = {}, ...props }: DropdownItemProps<T>,\n    forwardedRef: PolymorphicRef<T>,\n  ) => {\n    const { ref: listItemRef, index } = useListItem({ label: typeof children === \"string\" ? children : undefined });\n    const ref = useMergeRefs([forwardedRef, listItemRef]);\n    const { theme: rootTheme, activeIndex, dismissOnClick, getItemProps, handleSelect } = useDropdownContext();\n    const isActive = activeIndex === index;\n    const theme = mergeDeep(rootTheme.floating.item, customTheme);\n\n    const theirProps = props as ButtonBaseProps<T>;\n\n    return (\n      <li role=\"menuitem\" className={theme.container}>\n        <ButtonBase\n          ref={ref as RefCallback<T>}\n          className={twMerge(theme.base, className)}\n          {...theirProps}\n          {...getItemProps({\n            onClick: () => {\n              onClick?.();\n              dismissOnClick && handleSelect(null);\n            },\n          })}\n          tabIndex={isActive ? 0 : -1}\n        >\n          {Icon && <Icon className={theme.icon} />}\n          {children}\n        </ButtonBase>\n      </li>\n    );\n  },\n) as DropdownItemType;\n\nDropdownItem.displayName = \"DropdownItem\";\n"],"names":[],"mappings":";;;;;;;;AASY,MAAC,YAAY,GAAG,UAAU;AACtC,EAAE,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,GAAG,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,KAAK;AACrG,IAAI,MAAM,EAAE,GAAG,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,WAAW,CAAC,EAAE,KAAK,EAAE,OAAO,QAAQ,KAAK,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;AACjH,IAAI,MAAM,GAAG,GAAG,YAAY,CAAC,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;AAC1D,IAAI,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;AAC/G,IAAI,MAAM,QAAQ,GAAG,WAAW,KAAK,KAAK,CAAC;AAC3C,IAAI,MAAM,KAAK,GAAG,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AAClE,IAAI,MAAM,UAAU,GAAG,KAAK,CAAC;AAC7B,IAAI,uBAAuB,GAAG,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,kBAAkB,IAAI;AACnH,MAAM,UAAU;AAChB,MAAM;AACN,QAAQ,GAAG;AACX,QAAQ,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC;AACjD,QAAQ,GAAG,UAAU;AACrB,QAAQ,GAAG,YAAY,CAAC;AACxB,UAAU,OAAO,EAAE,MAAM;AACzB,YAAY,OAAO,IAAI,CAAC;AACxB,YAAY,cAAc,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC;AACjD,WAAW;AACX,SAAS,CAAC;AACV,QAAQ,QAAQ,EAAE,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAC;AACnC,QAAQ,QAAQ,EAAE;AAClB,UAAU,IAAI,oBAAoB,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC;AACtE,UAAU,QAAQ;AAClB,SAAS;AACT,OAAO;AACP,KAAK,EAAE,CAAC,CAAC;AACT,GAAG;AACH,EAAE;AACF,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}