flowbite-react/dist/components/Floating/Floating.cjs.map

Official React components built for Flowbite and Tailwind CSS

{"version":3,"file":"Floating.cjs","sources":["../../../src/components/Floating/Floating.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Placement } from \"@floating-ui/core\";\nimport { autoUpdate, useFocus } from \"@floating-ui/react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { twMerge } from \"../../helpers/tailwind-merge\";\nimport { useBaseFLoating, useFloatingInteractions } from \"../../hooks/use-floating\";\nimport { getArrowPlacement } from \"./helpers\";\n\nexport interface FloatingTheme {\n  arrow: FloatingArrowTheme;\n  animation: string;\n  base: string;\n  content: string;\n  hidden: string;\n  style: {\n    auto: string;\n    dark: string;\n    light: string;\n  };\n  target: string;\n}\n\nexport interface FloatingArrowTheme {\n  base: string;\n  placement: string;\n  style: {\n    dark: string;\n    light: string;\n    auto: string;\n  };\n}\n\nexport type FloatingStyle = \"dark\" | \"light\" | \"auto\";\n\nexport interface FloatingProps extends Omit<ComponentProps<\"div\">, \"content\" | \"style\"> {\n  animation?: false | `duration-${number}`;\n  arrow?: boolean;\n  content: ReactNode;\n  placement?: \"auto\" | Placement;\n  style?: FloatingStyle;\n  theme: FloatingTheme;\n  trigger?: \"hover\" | \"click\";\n  minWidth?: number;\n}\n\n/**\n * @see https://floating-ui.com/docs/react-dom-interactions\n */\nexport function Floating({\n  animation = \"duration-300\",\n  arrow = true,\n  children,\n  className,\n  content,\n  placement = \"top\",\n  style = \"dark\",\n  theme,\n  trigger = \"hover\",\n  minWidth,\n  ...props\n}: FloatingProps) {\n  const arrowRef = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(false);\n\n  const floatingProperties = useBaseFLoating({\n    open,\n    placement,\n    arrowRef,\n    setOpen,\n  });\n\n  const {\n    context,\n    middlewareData: { arrow: { x: arrowX, y: arrowY } = {} },\n    refs,\n    strategy,\n    update,\n    x,\n    y,\n  } = floatingProperties;\n\n  const focus = useFocus(context);\n  const { getFloatingProps, getReferenceProps } = useFloatingInteractions({\n    context,\n    role: \"tooltip\",\n    trigger,\n    interactions: [focus],\n  });\n\n  useEffect(() => {\n    if (refs.reference.current && refs.floating.current && open) {\n      return autoUpdate(refs.reference.current, refs.floating.current, update);\n    }\n  }, [open, refs.floating, refs.reference, update]);\n\n  return (\n    <>\n      <div\n        ref={refs.setReference}\n        className={theme.target}\n        data-testid=\"flowbite-tooltip-target\"\n        {...getReferenceProps()}\n      >\n        {children}\n      </div>\n      <div\n        ref={refs.setFloating}\n        data-testid=\"flowbite-tooltip\"\n        {...getFloatingProps({\n          className: twMerge(\n            theme.base,\n            animation && `${theme.animation} ${animation}`,\n            !open && theme.hidden,\n            theme.style[style],\n            className,\n          ),\n          style: {\n            position: strategy,\n            top: y ?? \" \",\n            left: x ?? \" \",\n            minWidth,\n          },\n          ...props,\n        })}\n      >\n        <div className={theme.content}>{content}</div>\n        {arrow && (\n          <div\n            className={twMerge(\n              theme.arrow.base,\n              style === \"dark\" && theme.arrow.style.dark,\n              style === \"light\" && theme.arrow.style.light,\n              style === \"auto\" && theme.arrow.style.auto,\n            )}\n            data-testid=\"flowbite-tooltip-arrow\"\n            ref={arrowRef}\n            style={{\n              top: arrowY ?? \" \",\n              left: arrowX ?? \" \",\n              right: \" \",\n              bottom: \" \",\n              [getArrowPlacement({ placement: floatingProperties.placement })]: theme.arrow.placement,\n            }}\n          >\n            &nbsp;\n          </div>\n        )}\n      </div>\n    </>\n  );\n}\n\nFloating.displayName = \"Floating\";\n"],"names":["useRef","useState","useBaseFLoating","useFocus","useFloatingInteractions","useEffect","autoUpdate","jsxs","Fragment","jsx","twMerge","getArrowPlacement"],"mappings":"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"}