@arolariu/components 0.0.39 → 0.0.40

package/dist/esm/components/ui/bubble-background.js

@@ -111,8 +111,7 @@ const BubbleBackground = /*#__PURE__*/ forwardRef(({ className, children, intera
                             duration: 20,
                             ease: "linear",
                             repeat: 1 / 0,
-                            repeatType: "loop",
-                            reverse: true
+                            repeatType: "reverse"
                         },
                         children: /*#__PURE__*/ jsx("div", {
                             className: "rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--second-color),0.8)_0%,rgba(var(--second-color),0)_50%)]"

package/dist/esm/components/ui/bubble-background.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\bubble-background.js","sources":["webpack://@arolariu/components/./src/components/ui/bubble-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n  motion,\n  type SpringOptions,\n  useMotionValue,\n  useSpring,\n} from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface BubbleBackgroundProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean;\n  transition?: SpringOptions;\n  colors?: {\n    first: string;\n    second: string;\n    third: string;\n    fourth: string;\n    fifth: string;\n    sixth: string;\n  };\n}\n\nconst BubbleBackground = React.forwardRef<\n  HTMLDivElement,\n  BubbleBackgroundProps\n>(\n  (\n    {\n      className,\n      children,\n      interactive = false,\n      transition = { stiffness: 100, damping: 20 },\n      colors = {\n        first: \"18,113,255\",\n        second: \"221,74,255\",\n        third: \"0,220,255\",\n        fourth: \"200,50,50\",\n        fifth: \"180,180,50\",\n        sixth: \"140,100,255\",\n      },\n      ...props\n    },\n    ref,\n  ) => {\n    const containerRef = React.useRef<HTMLDivElement>(null);\n    React.useImperativeHandle(\n      ref,\n      () => containerRef.current as HTMLDivElement,\n    );\n\n    const mouseX = useMotionValue(0);\n    const mouseY = useMotionValue(0);\n    const springX = useSpring(mouseX, transition);\n    const springY = useSpring(mouseY, transition);\n\n    React.useEffect(() => {\n      if (!interactive) return;\n\n      const currentContainer = containerRef.current;\n      if (!currentContainer) return;\n\n      const handleMouseMove = (e: MouseEvent) => {\n        const rect = currentContainer.getBoundingClientRect();\n        const centerX = rect.left + rect.width / 2;\n        const centerY = rect.top + rect.height / 2;\n        mouseX.set(e.clientX - centerX);\n        mouseY.set(e.clientY - centerY);\n      };\n\n      currentContainer?.addEventListener(\"mousemove\", handleMouseMove);\n      return () =>\n        currentContainer?.removeEventListener(\"mousemove\", handleMouseMove);\n    }, [interactive, mouseX, mouseY]);\n\n    return (\n      <div\n        ref={containerRef}\n        className={cn(\n          \"relative size-full overflow-hidden bg-gradient-to-br from-violet-900 to-blue-900\",\n          className,\n        )}\n        {...props}\n      >\n        <style>\n          {`\n            :root {\n              --first-color: ${colors.first};\n              --second-color: ${colors.second};\n              --third-color: ${colors.third};\n              --fourth-color: ${colors.fourth};\n              --fifth-color: ${colors.fifth};\n              --sixth-color: ${colors.sixth};\n            }\n          `}\n        </style>\n\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          className=\"absolute top-0 left-0 w-0 h-0\"\n        >\n          <defs>\n            <filter id=\"goo\">\n              <feGaussianBlur\n                in=\"SourceGraphic\"\n                stdDeviation=\"10\"\n                result=\"blur\"\n              />\n              <feColorMatrix\n                in=\"blur\"\n                mode=\"matrix\"\n                values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\n                result=\"goo\"\n              />\n              <feBlend in=\"SourceGraphic\" in2=\"goo\" />\n            </filter>\n          </defs>\n        </svg>\n\n        <div\n          className=\"absolute inset-0\"\n          style={{ filter: \"url(#goo) blur(40px)\" }}\n        >\n          <motion.div\n            className=\"absolute rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--first-color),0.8)_0%,rgba(var(--first-color),0)_50%)]\"\n            animate={{ y: [-50, 50, -50] }}\n            transition={{ duration: 30, ease: \"easeInOut\", repeat: Infinity }}\n          />\n\n          <motion.div\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%-400px)]\"\n            animate={{ rotate: 360 }}\n            transition={{\n              duration: 20,\n              ease: \"linear\",\n              repeat: Infinity,\n              repeatType: \"loop\",\n              reverse: true,\n            }}\n          >\n            <div className=\"rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--second-color),0.8)_0%,rgba(var(--second-color),0)_50%)]\" />\n          </motion.div>\n\n          <motion.div\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%+400px)]\"\n            animate={{ rotate: 360 }}\n            transition={{ duration: 40, ease: \"linear\", repeat: Infinity }}\n          >\n            <div className=\"absolute rounded-full size-[80%] bg-[radial-gradient(circle_at_center,rgba(var(--third-color),0.8)_0%,rgba(var(--third-color),0)_50%)] mix-blend-hard-light top-[calc(50%+200px)] left-[calc(50%-500px)]\" />\n          </motion.div>\n\n          <motion.div\n            className=\"absolute rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--fourth-color),0.8)_0%,rgba(var(--fourth-color),0)_50%)] opacity-70\"\n            animate={{ x: [-50, 50, -50] }}\n            transition={{ duration: 40, ease: \"easeInOut\", repeat: Infinity }}\n          />\n\n          <motion.div\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%_-_800px)_calc(50%_+_200px)]\"\n            animate={{ rotate: 360 }}\n            transition={{ duration: 20, ease: \"linear\", repeat: Infinity }}\n          >\n            <div className=\"absolute rounded-full size-[160%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--fifth-color),0.8)_0%,rgba(var(--fifth-color),0)_50%)] top-[calc(50%-80%)] left-[calc(50%-80%)]\" />\n          </motion.div>\n\n          {interactive && (\n            <motion.div\n              className=\"absolute rounded-full size-full mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--sixth-color),0.8)_0%,rgba(var(--sixth-color),0)_50%)] opacity-70\"\n              style={{\n                x: springX,\n                y: springY,\n              }}\n            />\n          )}\n        </div>\n\n        {children}\n      </div>\n    );\n  },\n);\n\nBubbleBackground.displayName = \"BubbleBackground\";\n\nexport { BubbleBackground, type BubbleBackgroundProps };\n"],"names":["BubbleBackground","React","className","children","interactive","transition","colors","props","ref","containerRef","mouseX","useMotionValue","mouseY","springX","useSpring","springY","currentContainer","handleMouseMove","e","rect","centerX","centerY","cn","motion","Infinity"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\bubble-background.js","sources":["webpack://@arolariu/components/./src/components/ui/bubble-background.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport {\r\n  motion,\r\n  type SpringOptions,\r\n  Transition,\r\n  useMotionValue,\r\n  useSpring,\r\n} from \"motion/react\";\r\n\r\nimport { cn } from \"@/lib/utils\";\r\n\r\ninterface BubbleBackgroundProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  interactive?: boolean;\r\n  transition?: SpringOptions;\r\n  colors?: {\r\n    first: string;\r\n    second: string;\r\n    third: string;\r\n    fourth: string;\r\n    fifth: string;\r\n    sixth: string;\r\n  };\r\n}\r\n\r\nconst BubbleBackground = React.forwardRef<\r\n  HTMLDivElement,\r\n  BubbleBackgroundProps\r\n>(\r\n  (\r\n    {\r\n      className,\r\n      children,\r\n      interactive = false,\r\n      transition = { stiffness: 100, damping: 20 },\r\n      colors = {\r\n        first: \"18,113,255\",\r\n        second: \"221,74,255\",\r\n        third: \"0,220,255\",\r\n        fourth: \"200,50,50\",\r\n        fifth: \"180,180,50\",\r\n        sixth: \"140,100,255\",\r\n      },\r\n      ...props\r\n    },\r\n    ref,\r\n  ) => {\r\n    const containerRef = React.useRef<HTMLDivElement>(null);\r\n    React.useImperativeHandle(\r\n      ref,\r\n      () => containerRef.current as HTMLDivElement,\r\n    );\r\n\r\n    const mouseX = useMotionValue(0);\r\n    const mouseY = useMotionValue(0);\r\n    const springX = useSpring(mouseX, transition);\r\n    const springY = useSpring(mouseY, transition);\r\n\r\n    React.useEffect(() => {\r\n      if (!interactive) return;\r\n\r\n      const currentContainer = containerRef.current;\r\n      if (!currentContainer) return;\r\n\r\n      const handleMouseMove = (e: MouseEvent) => {\r\n        const rect = currentContainer.getBoundingClientRect();\r\n        const centerX = rect.left + rect.width / 2;\r\n        const centerY = rect.top + rect.height / 2;\r\n        mouseX.set(e.clientX - centerX);\r\n        mouseY.set(e.clientY - centerY);\r\n      };\r\n\r\n      currentContainer?.addEventListener(\"mousemove\", handleMouseMove);\r\n      return () =>\r\n        currentContainer?.removeEventListener(\"mousemove\", handleMouseMove);\r\n    }, [interactive, mouseX, mouseY]);\r\n\r\n    return (\r\n      <div\r\n        ref={containerRef}\r\n        className={cn(\r\n          \"relative size-full overflow-hidden bg-gradient-to-br from-violet-900 to-blue-900\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        <style>\r\n          {`\r\n            :root {\r\n              --first-color: ${colors.first};\r\n              --second-color: ${colors.second};\r\n              --third-color: ${colors.third};\r\n              --fourth-color: ${colors.fourth};\r\n              --fifth-color: ${colors.fifth};\r\n              --sixth-color: ${colors.sixth};\r\n            }\r\n          `}\r\n        </style>\r\n\r\n        <svg\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          className=\"absolute top-0 left-0 w-0 h-0\"\r\n        >\r\n          <defs>\r\n            <filter id=\"goo\">\r\n              <feGaussianBlur\r\n                in=\"SourceGraphic\"\r\n                stdDeviation=\"10\"\r\n                result=\"blur\"\r\n              />\r\n              <feColorMatrix\r\n                in=\"blur\"\r\n                mode=\"matrix\"\r\n                values=\"1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -8\"\r\n                result=\"goo\"\r\n              />\r\n              <feBlend in=\"SourceGraphic\" in2=\"goo\" />\r\n            </filter>\r\n          </defs>\r\n        </svg>\r\n\r\n        <div\r\n          className=\"absolute inset-0\"\r\n          style={{ filter: \"url(#goo) blur(40px)\" }}\r\n        >\r\n          <motion.div\r\n            className=\"absolute rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--first-color),0.8)_0%,rgba(var(--first-color),0)_50%)]\"\r\n            animate={{ y: [-50, 50, -50] }}\r\n            transition={{ duration: 30, ease: \"easeInOut\", repeat: Infinity }}\r\n          />\r\n\r\n          <motion.div\r\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%-400px)]\"\r\n            animate={{ rotate: 360 }}\r\n            transition={\r\n              {\r\n                duration: 20,\r\n                ease: \"linear\",\r\n                repeat: Infinity,\r\n                repeatType: \"reverse\",\r\n              } satisfies Transition\r\n            }\r\n          >\r\n            <div className=\"rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--second-color),0.8)_0%,rgba(var(--second-color),0)_50%)]\" />\r\n          </motion.div>\r\n\r\n          <motion.div\r\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%+400px)]\"\r\n            animate={{ rotate: 360 }}\r\n            transition={{ duration: 40, ease: \"linear\", repeat: Infinity }}\r\n          >\r\n            <div className=\"absolute rounded-full size-[80%] bg-[radial-gradient(circle_at_center,rgba(var(--third-color),0.8)_0%,rgba(var(--third-color),0)_50%)] mix-blend-hard-light top-[calc(50%+200px)] left-[calc(50%-500px)]\" />\r\n          </motion.div>\r\n\r\n          <motion.div\r\n            className=\"absolute rounded-full size-[80%] top-[10%] left-[10%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--fourth-color),0.8)_0%,rgba(var(--fourth-color),0)_50%)] opacity-70\"\r\n            animate={{ x: [-50, 50, -50] }}\r\n            transition={{ duration: 40, ease: \"easeInOut\", repeat: Infinity }}\r\n          />\r\n\r\n          <motion.div\r\n            className=\"absolute inset-0 flex justify-center items-center origin-[calc(50%_-_800px)_calc(50%_+_200px)]\"\r\n            animate={{ rotate: 360 }}\r\n            transition={{ duration: 20, ease: \"linear\", repeat: Infinity }}\r\n          >\r\n            <div className=\"absolute rounded-full size-[160%] mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--fifth-color),0.8)_0%,rgba(var(--fifth-color),0)_50%)] top-[calc(50%-80%)] left-[calc(50%-80%)]\" />\r\n          </motion.div>\r\n\r\n          {interactive && (\r\n            <motion.div\r\n              className=\"absolute rounded-full size-full mix-blend-hard-light bg-[radial-gradient(circle_at_center,rgba(var(--sixth-color),0.8)_0%,rgba(var(--sixth-color),0)_50%)] opacity-70\"\r\n              style={{\r\n                x: springX,\r\n                y: springY,\r\n              }}\r\n            />\r\n          )}\r\n        </div>\r\n\r\n        {children}\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nBubbleBackground.displayName = \"BubbleBackground\";\r\n\r\nexport { BubbleBackground, type BubbleBackgroundProps };\r\n"],"names":["BubbleBackground","React","className","children","interactive","transition","colors","props","ref","containerRef","mouseX","useMotionValue","mouseY","springX","useSpring","springY","currentContainer","handleMouseMove","e","rect","centerX","centerY","cn","motion","Infinity"],"mappings":"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"}

package/dist/esm/components/ui/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\calendar.js","sources":["webpack://@arolariu/components/./src/components/ui/calendar.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n} from \"lucide-react\";\nimport { DayButton, DayPicker, getDefaultClassNames } from \"react-day-picker\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button, buttonVariants } from \"@/components/ui/button\";\n\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  captionLayout = \"label\",\n  buttonVariant = \"ghost\",\n  formatters,\n  components,\n  ...props\n}: React.ComponentProps<typeof DayPicker> & {\n  buttonVariant?: React.ComponentProps<typeof Button>[\"variant\"];\n}) {\n  const defaultClassNames = getDefaultClassNames();\n\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\n        \"bg-white group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent dark:bg-neutral-950\",\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n        className,\n      )}\n      captionLayout={captionLayout}\n      formatters={{\n        formatMonthDropdown: (date) =>\n          date.toLocaleString(\"default\", { month: \"short\" }),\n        ...formatters,\n      }}\n      classNames={{\n        root: cn(\"w-fit\", defaultClassNames.root),\n        months: cn(\n          \"flex gap-4 flex-col md:flex-row relative\",\n          defaultClassNames.months,\n        ),\n        month: cn(\"flex flex-col w-full gap-4\", defaultClassNames.month),\n        nav: cn(\n          \"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between\",\n          defaultClassNames.nav,\n        ),\n        button_previous: cn(\n          buttonVariants({ variant: buttonVariant }),\n          \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n          defaultClassNames.button_previous,\n        ),\n        button_next: cn(\n          buttonVariants({ variant: buttonVariant }),\n          \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\n          defaultClassNames.button_next,\n        ),\n        month_caption: cn(\n          \"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)\",\n          defaultClassNames.month_caption,\n        ),\n        dropdowns: cn(\n          \"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5\",\n          defaultClassNames.dropdowns,\n        ),\n        dropdown_root: cn(\n          \"relative has-focus:border-neutral-950 border border-neutral-200 shadow-xs has-focus:ring-neutral-950/50 has-focus:ring-[3px] rounded-md dark:has-focus:border-neutral-300 dark:border-neutral-800 dark:has-focus:ring-neutral-300/50\",\n          defaultClassNames.dropdown_root,\n        ),\n        dropdown: cn(\"absolute inset-0 opacity-0\", defaultClassNames.dropdown),\n        caption_label: cn(\n          \"select-none font-medium\",\n          captionLayout === \"label\"\n            ? \"text-sm\"\n            : \"rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-neutral-500 [&>svg]:size-3.5 dark:[&>svg]:text-neutral-400\",\n          defaultClassNames.caption_label,\n        ),\n        table: \"w-full border-collapse\",\n        weekdays: cn(\"flex\", defaultClassNames.weekdays),\n        weekday: cn(\n          \"text-neutral-500 rounded-md flex-1 font-normal text-[0.8rem] select-none dark:text-neutral-400\",\n          defaultClassNames.weekday,\n        ),\n        week: cn(\"flex w-full mt-2\", defaultClassNames.week),\n        week_number_header: cn(\n          \"select-none w-(--cell-size)\",\n          defaultClassNames.week_number_header,\n        ),\n        week_number: cn(\n          \"text-[0.8rem] select-none text-neutral-500 dark:text-neutral-400\",\n          defaultClassNames.week_number,\n        ),\n        day: cn(\n          \"relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none\",\n          defaultClassNames.day,\n        ),\n        range_start: cn(\n          \"rounded-l-md bg-neutral-100 dark:bg-neutral-800\",\n          defaultClassNames.range_start,\n        ),\n        range_middle: cn(\"rounded-none\", defaultClassNames.range_middle),\n        range_end: cn(\n          \"rounded-r-md bg-neutral-100 dark:bg-neutral-800\",\n          defaultClassNames.range_end,\n        ),\n        today: cn(\n          \"bg-neutral-100 text-neutral-900 rounded-md data-[selected=true]:rounded-none dark:bg-neutral-800 dark:text-neutral-50\",\n          defaultClassNames.today,\n        ),\n        outside: cn(\n          \"text-neutral-500 aria-selected:text-neutral-500 dark:text-neutral-400 dark:aria-selected:text-neutral-400\",\n          defaultClassNames.outside,\n        ),\n        disabled: cn(\n          \"text-neutral-500 opacity-50 dark:text-neutral-400\",\n          defaultClassNames.disabled,\n        ),\n        hidden: cn(\"invisible\", defaultClassNames.hidden),\n        ...classNames,\n      }}\n      components={{\n        Root: ({ className, rootRef, ...props }) => {\n          return (\n            <div\n              data-slot=\"calendar\"\n              ref={rootRef}\n              className={cn(className)}\n              {...props}\n            />\n          );\n        },\n        Chevron: ({ className, orientation, ...props }) => {\n          if (orientation === \"left\") {\n            return (\n              <ChevronLeftIcon className={cn(\"size-4\", className)} {...props} />\n            );\n          }\n\n          if (orientation === \"right\") {\n            return (\n              <ChevronRightIcon\n                className={cn(\"size-4\", className)}\n                {...props}\n              />\n            );\n          }\n\n          return (\n            <ChevronDownIcon className={cn(\"size-4\", className)} {...props} />\n          );\n        },\n        DayButton: CalendarDayButton,\n        WeekNumber: ({ children, ...props }) => {\n          return (\n            <td {...props}>\n              <div className=\"flex size-(--cell-size) items-center justify-center text-center\">\n                {children}\n              </div>\n            </td>\n          );\n        },\n        ...components,\n      }}\n      {...props}\n    />\n  );\n}\n\nfunction CalendarDayButton({\n  className,\n  day,\n  modifiers,\n  ...props\n}: React.ComponentProps<typeof DayButton>) {\n  const defaultClassNames = getDefaultClassNames();\n\n  const ref = React.useRef<HTMLButtonElement>(null);\n  React.useEffect(() => {\n    if (modifiers[\"focused\"]) ref.current?.focus();\n  }, [modifiers[\"focused\"]]);\n\n  return (\n    <Button\n      ref={ref}\n      variant=\"ghost\"\n      size=\"icon\"\n      data-day={day.date.toLocaleDateString()}\n      data-selected-single={\n        modifiers[\"selected\"] &&\n        !modifiers[\"range_start\"] &&\n        !modifiers[\"range_end\"] &&\n        !modifiers[\"range_middle\"]\n      }\n      data-range-start={modifiers[\"range_start\"]}\n      data-range-end={modifiers[\"range_end\"]}\n      data-range-middle={modifiers[\"range_middle\"]}\n      className={cn(\n        \"data-[selected-single=true]:bg-neutral-900 data-[selected-single=true]:text-neutral-50 data-[range-middle=true]:bg-neutral-100 data-[range-middle=true]:text-neutral-900 data-[range-start=true]:bg-neutral-900 data-[range-start=true]:text-neutral-50 data-[range-end=true]:bg-neutral-900 data-[range-end=true]:text-neutral-50 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-neutral-900 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70 dark:data-[selected-single=true]:bg-neutral-50 dark:data-[selected-single=true]:text-neutral-900 dark:data-[range-middle=true]:bg-neutral-800 dark:data-[range-middle=true]:text-neutral-50 dark:data-[range-start=true]:bg-neutral-50 dark:data-[range-start=true]:text-neutral-900 dark:data-[range-end=true]:bg-neutral-50 dark:data-[range-end=true]:text-neutral-900 dark:dark:hover:text-neutral-50\",\n        defaultClassNames.day,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Calendar, CalendarDayButton };\n"],"names":["Calendar","className","classNames","showOutsideDays","captionLayout","buttonVariant","formatters","components","props","defaultClassNames","getDefaultClassNames","DayPicker","cn","String","date","buttonVariants","rootRef","orientation","ChevronLeftIcon","ChevronRightIcon","ChevronDownIcon","CalendarDayButton","children","day","modifiers","ref","React","Button"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\calendar.js","sources":["webpack://@arolariu/components/./src/components/ui/calendar.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport {\r\n  ChevronDownIcon,\r\n  ChevronLeftIcon,\r\n  ChevronRightIcon,\r\n} from \"lucide-react\";\r\nimport { DayButton, DayPicker, getDefaultClassNames } from \"react-day-picker\";\r\n\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Button, buttonVariants } from \"@/components/ui/button\";\r\n\r\nfunction Calendar({\r\n  className,\r\n  classNames,\r\n  showOutsideDays = true,\r\n  captionLayout = \"label\",\r\n  buttonVariant = \"ghost\",\r\n  formatters,\r\n  components,\r\n  ...props\r\n}: React.ComponentProps<typeof DayPicker> & {\r\n  buttonVariant?: React.ComponentProps<typeof Button>[\"variant\"];\r\n}) {\r\n  const defaultClassNames = getDefaultClassNames();\r\n\r\n  return (\r\n    <DayPicker\r\n      showOutsideDays={showOutsideDays}\r\n      className={cn(\r\n        \"bg-white group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent dark:bg-neutral-950\",\r\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\r\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\r\n        className,\r\n      )}\r\n      captionLayout={captionLayout}\r\n      formatters={{\r\n        formatMonthDropdown: (date) =>\r\n          date.toLocaleString(\"default\", { month: \"short\" }),\r\n        ...formatters,\r\n      }}\r\n      classNames={{\r\n        root: cn(\"w-fit\", defaultClassNames.root),\r\n        months: cn(\r\n          \"flex gap-4 flex-col md:flex-row relative\",\r\n          defaultClassNames.months,\r\n        ),\r\n        month: cn(\"flex flex-col w-full gap-4\", defaultClassNames.month),\r\n        nav: cn(\r\n          \"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between\",\r\n          defaultClassNames.nav,\r\n        ),\r\n        button_previous: cn(\r\n          buttonVariants({ variant: buttonVariant }),\r\n          \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\r\n          defaultClassNames.button_previous,\r\n        ),\r\n        button_next: cn(\r\n          buttonVariants({ variant: buttonVariant }),\r\n          \"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none\",\r\n          defaultClassNames.button_next,\r\n        ),\r\n        month_caption: cn(\r\n          \"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)\",\r\n          defaultClassNames.month_caption,\r\n        ),\r\n        dropdowns: cn(\r\n          \"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5\",\r\n          defaultClassNames.dropdowns,\r\n        ),\r\n        dropdown_root: cn(\r\n          \"relative has-focus:border-neutral-950 border border-neutral-200 shadow-xs has-focus:ring-neutral-950/50 has-focus:ring-[3px] rounded-md dark:has-focus:border-neutral-300 dark:border-neutral-800 dark:has-focus:ring-neutral-300/50\",\r\n          defaultClassNames.dropdown_root,\r\n        ),\r\n        dropdown: cn(\"absolute inset-0 opacity-0\", defaultClassNames.dropdown),\r\n        caption_label: cn(\r\n          \"select-none font-medium\",\r\n          captionLayout === \"label\"\r\n            ? \"text-sm\"\r\n            : \"rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-neutral-500 [&>svg]:size-3.5 dark:[&>svg]:text-neutral-400\",\r\n          defaultClassNames.caption_label,\r\n        ),\r\n        table: \"w-full border-collapse\",\r\n        weekdays: cn(\"flex\", defaultClassNames.weekdays),\r\n        weekday: cn(\r\n          \"text-neutral-500 rounded-md flex-1 font-normal text-[0.8rem] select-none dark:text-neutral-400\",\r\n          defaultClassNames.weekday,\r\n        ),\r\n        week: cn(\"flex w-full mt-2\", defaultClassNames.week),\r\n        week_number_header: cn(\r\n          \"select-none w-(--cell-size)\",\r\n          defaultClassNames.week_number_header,\r\n        ),\r\n        week_number: cn(\r\n          \"text-[0.8rem] select-none text-neutral-500 dark:text-neutral-400\",\r\n          defaultClassNames.week_number,\r\n        ),\r\n        day: cn(\r\n          \"relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none\",\r\n          defaultClassNames.day,\r\n        ),\r\n        range_start: cn(\r\n          \"rounded-l-md bg-neutral-100 dark:bg-neutral-800\",\r\n          defaultClassNames.range_start,\r\n        ),\r\n        range_middle: cn(\"rounded-none\", defaultClassNames.range_middle),\r\n        range_end: cn(\r\n          \"rounded-r-md bg-neutral-100 dark:bg-neutral-800\",\r\n          defaultClassNames.range_end,\r\n        ),\r\n        today: cn(\r\n          \"bg-neutral-100 text-neutral-900 rounded-md data-[selected=true]:rounded-none dark:bg-neutral-800 dark:text-neutral-50\",\r\n          defaultClassNames.today,\r\n        ),\r\n        outside: cn(\r\n          \"text-neutral-500 aria-selected:text-neutral-500 dark:text-neutral-400 dark:aria-selected:text-neutral-400\",\r\n          defaultClassNames.outside,\r\n        ),\r\n        disabled: cn(\r\n          \"text-neutral-500 opacity-50 dark:text-neutral-400\",\r\n          defaultClassNames.disabled,\r\n        ),\r\n        hidden: cn(\"invisible\", defaultClassNames.hidden),\r\n        ...classNames,\r\n      }}\r\n      components={{\r\n        Root: ({ className, rootRef, ...props }) => {\r\n          return (\r\n            <div\r\n              data-slot=\"calendar\"\r\n              ref={rootRef}\r\n              className={cn(className)}\r\n              {...props}\r\n            />\r\n          );\r\n        },\r\n        Chevron: ({ className, orientation, ...props }) => {\r\n          if (orientation === \"left\") {\r\n            return (\r\n              <ChevronLeftIcon className={cn(\"size-4\", className)} {...props} />\r\n            );\r\n          }\r\n\r\n          if (orientation === \"right\") {\r\n            return (\r\n              <ChevronRightIcon\r\n                className={cn(\"size-4\", className)}\r\n                {...props}\r\n              />\r\n            );\r\n          }\r\n\r\n          return (\r\n            <ChevronDownIcon className={cn(\"size-4\", className)} {...props} />\r\n          );\r\n        },\r\n        DayButton: CalendarDayButton,\r\n        WeekNumber: ({ children, ...props }) => {\r\n          return (\r\n            <td {...props}>\r\n              <div className=\"flex size-(--cell-size) items-center justify-center text-center\">\r\n                {children}\r\n              </div>\r\n            </td>\r\n          );\r\n        },\r\n        ...components,\r\n      }}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction CalendarDayButton({\r\n  className,\r\n  day,\r\n  modifiers,\r\n  ...props\r\n}: React.ComponentProps<typeof DayButton>) {\r\n  const defaultClassNames = getDefaultClassNames();\r\n\r\n  const ref = React.useRef<HTMLButtonElement>(null);\r\n  React.useEffect(() => {\r\n    if (modifiers[\"focused\"]) ref.current?.focus();\r\n  }, [modifiers[\"focused\"]]);\r\n\r\n  return (\r\n    <Button\r\n      ref={ref}\r\n      variant=\"ghost\"\r\n      size=\"icon\"\r\n      data-day={day.date.toLocaleDateString()}\r\n      data-selected-single={\r\n        modifiers[\"selected\"] &&\r\n        !modifiers[\"range_start\"] &&\r\n        !modifiers[\"range_end\"] &&\r\n        !modifiers[\"range_middle\"]\r\n      }\r\n      data-range-start={modifiers[\"range_start\"]}\r\n      data-range-end={modifiers[\"range_end\"]}\r\n      data-range-middle={modifiers[\"range_middle\"]}\r\n      className={cn(\r\n        \"data-[selected-single=true]:bg-neutral-900 data-[selected-single=true]:text-neutral-50 data-[range-middle=true]:bg-neutral-100 data-[range-middle=true]:text-neutral-900 data-[range-start=true]:bg-neutral-900 data-[range-start=true]:text-neutral-50 data-[range-end=true]:bg-neutral-900 data-[range-end=true]:text-neutral-50 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-neutral-900 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70 dark:data-[selected-single=true]:bg-neutral-50 dark:data-[selected-single=true]:text-neutral-900 dark:data-[range-middle=true]:bg-neutral-800 dark:data-[range-middle=true]:text-neutral-50 dark:data-[range-start=true]:bg-neutral-50 dark:data-[range-start=true]:text-neutral-900 dark:data-[range-end=true]:bg-neutral-50 dark:data-[range-end=true]:text-neutral-900 dark:dark:hover:text-neutral-50\",\r\n        defaultClassNames.day,\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport { Calendar, CalendarDayButton };\r\n"],"names":["Calendar","className","classNames","showOutsideDays","captionLayout","buttonVariant","formatters","components","props","defaultClassNames","getDefaultClassNames","DayPicker","cn","String","date","buttonVariants","rootRef","orientation","ChevronLeftIcon","ChevronRightIcon","ChevronDownIcon","CalendarDayButton","children","day","modifiers","ref","React","Button"],"mappings":"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"}

package/dist/esm/components/ui/chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\chart.js","sources":["webpack://@arolariu/components/./src/components/ui/chart.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RechartsPrimitive from \"recharts\";\nimport type { LegendPayload } from \"recharts/types/component/DefaultLegendContent\";\nimport {\n  NameType,\n  Payload,\n  ValueType,\n} from \"recharts/types/component/DefaultTooltipContent\";\nimport type { Props as LegendProps } from \"recharts/types/component/Legend\";\nimport { TooltipContentProps } from \"recharts/types/component/Tooltip\";\n\nimport { cn } from \"@/lib/utils\";\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\n\nexport type ChartConfig = {\n  [k in string]: {\n    label?: React.ReactNode;\n    icon?: React.ComponentType;\n  } & (\n    | { color?: string; theme?: never }\n    | { color?: never; theme: Record<keyof typeof THEMES, string> }\n  );\n};\n\ntype ChartContextProps = {\n  config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n  const context = React.useContext(ChartContext);\n\n  if (!context) {\n    throw new Error(\"useChart must be used within a <ChartContainer />\");\n  }\n\n  return context;\n}\n\nfunction ChartContainer({\n  id,\n  className,\n  children,\n  config,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  config: ChartConfig;\n  children: React.ComponentProps<\n    typeof RechartsPrimitive.ResponsiveContainer\n  >[\"children\"];\n}) {\n  const uniqueId = React.useId();\n  const chartId = `chart-${id || uniqueId.replace(/:/g, \"\")}`;\n\n  return (\n    <ChartContext.Provider value={{ config }}>\n      <div\n        data-slot=\"chart\"\n        data-chart={chartId}\n        className={cn(\n          \"[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\n          className,\n        )}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <RechartsPrimitive.ResponsiveContainer>\n          {children}\n        </RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>\n  );\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n  const colorConfig = Object.entries(config).filter(\n    ([, config]) => config.theme || config.color,\n  );\n\n  if (!colorConfig.length) {\n    return null;\n  }\n\n  return (\n    <style\n      dangerouslySetInnerHTML={{\n        __html: Object.entries(THEMES)\n          .map(\n            ([theme, prefix]) => `\n            ${prefix} [data-chart=${id}] {\n            ${colorConfig\n              .map(([key, itemConfig]) => {\n                const color =\n                  itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||\n                  itemConfig.color;\n                return color ? `  --color-${key}: ${color};` : null;\n              })\n              .join(\"\\n\")}\n            }\n            `,\n          )\n          .join(\"\\n\"),\n      }}\n    />\n  );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\ntype CustomTooltipProps = TooltipContentProps<ValueType, NameType> & {\n  className?: string;\n  hideLabel?: boolean;\n  hideIndicator?: boolean;\n  indicator?: \"line\" | \"dot\" | \"dashed\";\n  nameKey?: string;\n  labelKey?: string;\n  labelFormatter?: (\n    label: TooltipContentProps<number, string>[\"label\"],\n    payload: TooltipContentProps<number, string>[\"payload\"],\n  ) => React.ReactNode;\n  formatter?: (\n    value: number | string,\n    name: string,\n    item: Payload<number | string, string>,\n    index: number,\n    payload: ReadonlyArray<Payload<number | string, string>>,\n  ) => React.ReactNode;\n  labelClassName?: string;\n  color?: string;\n};\n\nfunction ChartTooltipContent({\n  active,\n  payload,\n  label,\n  className,\n  indicator = \"dot\",\n  hideLabel = false,\n  hideIndicator = false,\n  labelFormatter,\n  formatter,\n  labelClassName,\n  color,\n  nameKey,\n  labelKey,\n}: CustomTooltipProps) {\n  const { config } = useChart();\n\n  const tooltipLabel = React.useMemo(() => {\n    if (hideLabel || !payload?.length) {\n      return null;\n    }\n\n    const [item] = payload;\n    const key = `${labelKey || item?.dataKey || item?.name || \"value\"}`;\n    const itemConfig = getPayloadConfigFromPayload(config, item, key);\n    const value =\n      !labelKey && typeof label === \"string\"\n        ? config[label as keyof typeof config]?.label || label\n        : itemConfig?.label;\n\n    if (labelFormatter) {\n      return (\n        <div className={cn(\"font-medium\", labelClassName)}>\n          {labelFormatter(value, payload)}\n        </div>\n      );\n    }\n\n    if (!value) {\n      return null;\n    }\n\n    return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\n  }, [\n    label,\n    labelFormatter,\n    payload,\n    hideLabel,\n    labelClassName,\n    config,\n    labelKey,\n  ]);\n\n  if (!active || !payload?.length) {\n    return null;\n  }\n\n  const nestLabel = payload.length === 1 && indicator !== \"dot\";\n\n  return (\n    <div\n      className={cn(\n        \"border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl\",\n        className,\n      )}\n    >\n      {!nestLabel ? tooltipLabel : null}\n      <div className=\"grid gap-1.5\">\n        {payload.map((item, index) => {\n          const key = `${nameKey || item.name || item.dataKey || \"value\"}`;\n          const itemConfig = getPayloadConfigFromPayload(config, item, key);\n          const indicatorColor = color || item.payload.fill || item.color;\n\n          return (\n            <div\n              key={item.dataKey}\n              className={cn(\n                \"[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5\",\n                indicator === \"dot\" && \"items-center\",\n              )}\n            >\n              {formatter && item?.value !== undefined && item.name ? (\n                formatter(item.value, item.name, item, index, item.payload)\n              ) : (\n                <>\n                  {itemConfig?.icon ? (\n                    <itemConfig.icon />\n                  ) : (\n                    !hideIndicator && (\n                      <div\n                        className={cn(\n                          \"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\",\n                          {\n                            \"h-2.5 w-2.5\": indicator === \"dot\",\n                            \"w-1\": indicator === \"line\",\n                            \"w-0 border-[1.5px] border-dashed bg-transparent\":\n                              indicator === \"dashed\",\n                            \"my-0.5\": nestLabel && indicator === \"dashed\",\n                          },\n                        )}\n                        style={\n                          {\n                            \"--color-bg\": indicatorColor,\n                            \"--color-border\": indicatorColor,\n                          } as React.CSSProperties\n                        }\n                      />\n                    )\n                  )}\n                  <div\n                    className={cn(\n                      \"flex flex-1 justify-between leading-none\",\n                      nestLabel ? \"items-end\" : \"items-center\",\n                    )}\n                  >\n                    <div className=\"grid gap-1.5\">\n                      {nestLabel ? tooltipLabel : null}\n                      <span className=\"text-muted-foreground\">\n                        {itemConfig?.label || item.name}\n                      </span>\n                    </div>\n                    {item.value && (\n                      <span className=\"text-foreground font-mono font-medium tabular-nums\">\n                        {item.value.toLocaleString()}\n                      </span>\n                    )}\n                  </div>\n                </>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\ntype ChartLegendContentProps = {\n  className?: string;\n  hideIcon?: boolean;\n  verticalAlign?: LegendProps[\"verticalAlign\"];\n  payload?: LegendPayload[];\n  nameKey?: string;\n};\n\nfunction ChartLegendContent({\n  className,\n  hideIcon = false,\n  payload,\n  verticalAlign = \"bottom\",\n  nameKey,\n}: ChartLegendContentProps) {\n  const { config } = useChart();\n\n  if (!payload?.length) {\n    return null;\n  }\n\n  return (\n    <div\n      className={cn(\n        \"flex items-center justify-center gap-4\",\n        verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\",\n        className,\n      )}\n    >\n      {payload.map((item) => {\n        const key = `${nameKey || item.dataKey || \"value\"}`;\n        const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n        return (\n          <div\n            key={item.value}\n            className={cn(\n              \"[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3\",\n            )}\n          >\n            {itemConfig?.icon && !hideIcon ? (\n              <itemConfig.icon />\n            ) : (\n              <div\n                className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n                style={{\n                  backgroundColor: item.color,\n                }}\n              />\n            )}\n            {itemConfig?.label}\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(\n  config: ChartConfig,\n  payload: unknown,\n  key: string,\n) {\n  if (typeof payload !== \"object\" || payload === null) {\n    return undefined;\n  }\n\n  const payloadPayload =\n    \"payload\" in payload &&\n    typeof payload.payload === \"object\" &&\n    payload.payload !== null\n      ? payload.payload\n      : undefined;\n\n  let configLabelKey: string = key;\n\n  if (\n    key in payload &&\n    typeof payload[key as keyof typeof payload] === \"string\"\n  ) {\n    configLabelKey = payload[key as keyof typeof payload] as string;\n  } else if (\n    payloadPayload &&\n    key in payloadPayload &&\n    typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n  ) {\n    configLabelKey = payloadPayload[\n      key as keyof typeof payloadPayload\n    ] as string;\n  }\n\n  return configLabelKey in config\n    ? config[configLabelKey]\n    : config[key as keyof typeof config];\n}\n\nexport {\n  ChartContainer,\n  ChartTooltip,\n  ChartTooltipContent,\n  ChartLegend,\n  ChartLegendContent,\n  ChartStyle,\n};\n"],"names":["THEMES","ChartContext","React","useChart","context","Error","ChartContainer","id","className","children","config","props","uniqueId","chartId","cn","ChartStyle","RechartsPrimitive","colorConfig","Object","theme","prefix","key","itemConfig","color","ChartTooltip","ChartTooltipContent","active","payload","label","indicator","hideLabel","hideIndicator","labelFormatter","formatter","labelClassName","nameKey","labelKey","tooltipLabel","item","getPayloadConfigFromPayload","value","nestLabel","index","indicatorColor","undefined","ChartLegend","ChartLegendContent","hideIcon","verticalAlign","payloadPayload","configLabelKey"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\chart.js","sources":["webpack://@arolariu/components/./src/components/ui/chart.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport * as RechartsPrimitive from \"recharts\";\r\nimport type { LegendPayload } from \"recharts/types/component/DefaultLegendContent\";\r\nimport {\r\n  NameType,\r\n  Payload,\r\n  ValueType,\r\n} from \"recharts/types/component/DefaultTooltipContent\";\r\nimport type { Props as LegendProps } from \"recharts/types/component/Legend\";\r\nimport { TooltipContentProps } from \"recharts/types/component/Tooltip\";\r\n\r\nimport { cn } from \"@/lib/utils\";\r\n\r\n// Format: { THEME_NAME: CSS_SELECTOR }\r\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\r\n\r\nexport type ChartConfig = {\r\n  [k in string]: {\r\n    label?: React.ReactNode;\r\n    icon?: React.ComponentType;\r\n  } & (\r\n    | { color?: string; theme?: never }\r\n    | { color?: never; theme: Record<keyof typeof THEMES, string> }\r\n  );\r\n};\r\n\r\ntype ChartContextProps = {\r\n  config: ChartConfig;\r\n};\r\n\r\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\r\n\r\nfunction useChart() {\r\n  const context = React.useContext(ChartContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useChart must be used within a <ChartContainer />\");\r\n  }\r\n\r\n  return context;\r\n}\r\n\r\nfunction ChartContainer({\r\n  id,\r\n  className,\r\n  children,\r\n  config,\r\n  ...props\r\n}: React.ComponentProps<\"div\"> & {\r\n  config: ChartConfig;\r\n  children: React.ComponentProps<\r\n    typeof RechartsPrimitive.ResponsiveContainer\r\n  >[\"children\"];\r\n}) {\r\n  const uniqueId = React.useId();\r\n  const chartId = `chart-${id || uniqueId.replace(/:/g, \"\")}`;\r\n\r\n  return (\r\n    <ChartContext.Provider value={{ config }}>\r\n      <div\r\n        data-slot=\"chart\"\r\n        data-chart={chartId}\r\n        className={cn(\r\n          \"[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        <ChartStyle id={chartId} config={config} />\r\n        <RechartsPrimitive.ResponsiveContainer>\r\n          {children}\r\n        </RechartsPrimitive.ResponsiveContainer>\r\n      </div>\r\n    </ChartContext.Provider>\r\n  );\r\n}\r\n\r\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\r\n  const colorConfig = Object.entries(config).filter(\r\n    ([, config]) => config.theme || config.color,\r\n  );\r\n\r\n  if (!colorConfig.length) {\r\n    return null;\r\n  }\r\n\r\n  return (\r\n    <style\r\n      dangerouslySetInnerHTML={{\r\n        __html: Object.entries(THEMES)\r\n          .map(\r\n            ([theme, prefix]) => `\r\n            ${prefix} [data-chart=${id}] {\r\n            ${colorConfig\r\n              .map(([key, itemConfig]) => {\r\n                const color =\r\n                  itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||\r\n                  itemConfig.color;\r\n                return color ? `  --color-${key}: ${color};` : null;\r\n              })\r\n              .join(\"\\n\")}\r\n            }\r\n            `,\r\n          )\r\n          .join(\"\\n\"),\r\n      }}\r\n    />\r\n  );\r\n};\r\n\r\nconst ChartTooltip = RechartsPrimitive.Tooltip;\r\n\r\ntype CustomTooltipProps = TooltipContentProps<ValueType, NameType> & {\r\n  className?: string;\r\n  hideLabel?: boolean;\r\n  hideIndicator?: boolean;\r\n  indicator?: \"line\" | \"dot\" | \"dashed\";\r\n  nameKey?: string;\r\n  labelKey?: string;\r\n  labelFormatter?: (\r\n    label: TooltipContentProps<number, string>[\"label\"],\r\n    payload: TooltipContentProps<number, string>[\"payload\"],\r\n  ) => React.ReactNode;\r\n  formatter?: (\r\n    value: number | string,\r\n    name: string,\r\n    item: Payload<number | string, string>,\r\n    index: number,\r\n    payload: ReadonlyArray<Payload<number | string, string>>,\r\n  ) => React.ReactNode;\r\n  labelClassName?: string;\r\n  color?: string;\r\n};\r\n\r\nfunction ChartTooltipContent({\r\n  active,\r\n  payload,\r\n  label,\r\n  className,\r\n  indicator = \"dot\",\r\n  hideLabel = false,\r\n  hideIndicator = false,\r\n  labelFormatter,\r\n  formatter,\r\n  labelClassName,\r\n  color,\r\n  nameKey,\r\n  labelKey,\r\n}: CustomTooltipProps) {\r\n  const { config } = useChart();\r\n\r\n  const tooltipLabel = React.useMemo(() => {\r\n    if (hideLabel || !payload?.length) {\r\n      return null;\r\n    }\r\n\r\n    const [item] = payload;\r\n    const key = `${labelKey || item?.dataKey || item?.name || \"value\"}`;\r\n    const itemConfig = getPayloadConfigFromPayload(config, item, key);\r\n    const value =\r\n      !labelKey && typeof label === \"string\"\r\n        ? config[label as keyof typeof config]?.label || label\r\n        : itemConfig?.label;\r\n\r\n    if (labelFormatter) {\r\n      return (\r\n        <div className={cn(\"font-medium\", labelClassName)}>\r\n          {labelFormatter(value, payload)}\r\n        </div>\r\n      );\r\n    }\r\n\r\n    if (!value) {\r\n      return null;\r\n    }\r\n\r\n    return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\r\n  }, [\r\n    label,\r\n    labelFormatter,\r\n    payload,\r\n    hideLabel,\r\n    labelClassName,\r\n    config,\r\n    labelKey,\r\n  ]);\r\n\r\n  if (!active || !payload?.length) {\r\n    return null;\r\n  }\r\n\r\n  const nestLabel = payload.length === 1 && indicator !== \"dot\";\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        \"border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl\",\r\n        className,\r\n      )}\r\n    >\r\n      {!nestLabel ? tooltipLabel : null}\r\n      <div className=\"grid gap-1.5\">\r\n        {payload.map((item, index) => {\r\n          const key = `${nameKey || item.name || item.dataKey || \"value\"}`;\r\n          const itemConfig = getPayloadConfigFromPayload(config, item, key);\r\n          const indicatorColor = color || item.payload.fill || item.color;\r\n\r\n          return (\r\n            <div\r\n              key={item.dataKey}\r\n              className={cn(\r\n                \"[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5\",\r\n                indicator === \"dot\" && \"items-center\",\r\n              )}\r\n            >\r\n              {formatter && item?.value !== undefined && item.name ? (\r\n                formatter(item.value, item.name, item, index, item.payload)\r\n              ) : (\r\n                <>\r\n                  {itemConfig?.icon ? (\r\n                    <itemConfig.icon />\r\n                  ) : (\r\n                    !hideIndicator && (\r\n                      <div\r\n                        className={cn(\r\n                          \"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\",\r\n                          {\r\n                            \"h-2.5 w-2.5\": indicator === \"dot\",\r\n                            \"w-1\": indicator === \"line\",\r\n                            \"w-0 border-[1.5px] border-dashed bg-transparent\":\r\n                              indicator === \"dashed\",\r\n                            \"my-0.5\": nestLabel && indicator === \"dashed\",\r\n                          },\r\n                        )}\r\n                        style={\r\n                          {\r\n                            \"--color-bg\": indicatorColor,\r\n                            \"--color-border\": indicatorColor,\r\n                          } as React.CSSProperties\r\n                        }\r\n                      />\r\n                    )\r\n                  )}\r\n                  <div\r\n                    className={cn(\r\n                      \"flex flex-1 justify-between leading-none\",\r\n                      nestLabel ? \"items-end\" : \"items-center\",\r\n                    )}\r\n                  >\r\n                    <div className=\"grid gap-1.5\">\r\n                      {nestLabel ? tooltipLabel : null}\r\n                      <span className=\"text-muted-foreground\">\r\n                        {itemConfig?.label || item.name}\r\n                      </span>\r\n                    </div>\r\n                    {item.value && (\r\n                      <span className=\"text-foreground font-mono font-medium tabular-nums\">\r\n                        {item.value.toLocaleString()}\r\n                      </span>\r\n                    )}\r\n                  </div>\r\n                </>\r\n              )}\r\n            </div>\r\n          );\r\n        })}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nconst ChartLegend = RechartsPrimitive.Legend;\r\n\r\ntype ChartLegendContentProps = {\r\n  className?: string;\r\n  hideIcon?: boolean;\r\n  verticalAlign?: LegendProps[\"verticalAlign\"];\r\n  payload?: LegendPayload[];\r\n  nameKey?: string;\r\n};\r\n\r\nfunction ChartLegendContent({\r\n  className,\r\n  hideIcon = false,\r\n  payload,\r\n  verticalAlign = \"bottom\",\r\n  nameKey,\r\n}: ChartLegendContentProps) {\r\n  const { config } = useChart();\r\n\r\n  if (!payload?.length) {\r\n    return null;\r\n  }\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        \"flex items-center justify-center gap-4\",\r\n        verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\",\r\n        className,\r\n      )}\r\n    >\r\n      {payload.map((item) => {\r\n        const key = `${nameKey || item.dataKey || \"value\"}`;\r\n        const itemConfig = getPayloadConfigFromPayload(config, item, key);\r\n\r\n        return (\r\n          <div\r\n            key={item.value}\r\n            className={cn(\r\n              \"[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3\",\r\n            )}\r\n          >\r\n            {itemConfig?.icon && !hideIcon ? (\r\n              <itemConfig.icon />\r\n            ) : (\r\n              <div\r\n                className=\"h-2 w-2 shrink-0 rounded-[2px]\"\r\n                style={{\r\n                  backgroundColor: item.color,\r\n                }}\r\n              />\r\n            )}\r\n            {itemConfig?.label}\r\n          </div>\r\n        );\r\n      })}\r\n    </div>\r\n  );\r\n}\r\n\r\n// Helper to extract item config from a payload.\r\nfunction getPayloadConfigFromPayload(\r\n  config: ChartConfig,\r\n  payload: unknown,\r\n  key: string,\r\n) {\r\n  if (typeof payload !== \"object\" || payload === null) {\r\n    return undefined;\r\n  }\r\n\r\n  const payloadPayload =\r\n    \"payload\" in payload &&\r\n    typeof payload.payload === \"object\" &&\r\n    payload.payload !== null\r\n      ? payload.payload\r\n      : undefined;\r\n\r\n  let configLabelKey: string = key;\r\n\r\n  if (\r\n    key in payload &&\r\n    typeof payload[key as keyof typeof payload] === \"string\"\r\n  ) {\r\n    configLabelKey = payload[key as keyof typeof payload] as string;\r\n  } else if (\r\n    payloadPayload &&\r\n    key in payloadPayload &&\r\n    typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\r\n  ) {\r\n    configLabelKey = payloadPayload[\r\n      key as keyof typeof payloadPayload\r\n    ] as string;\r\n  }\r\n\r\n  return configLabelKey in config\r\n    ? config[configLabelKey]\r\n    : config[key as keyof typeof config];\r\n}\r\n\r\nexport {\r\n  ChartContainer,\r\n  ChartTooltip,\r\n  ChartTooltipContent,\r\n  ChartLegend,\r\n  ChartLegendContent,\r\n  ChartStyle,\r\n};\r\n"],"names":["THEMES","ChartContext","React","useChart","context","Error","ChartContainer","id","className","children","config","props","uniqueId","chartId","cn","ChartStyle","RechartsPrimitive","colorConfig","Object","theme","prefix","key","itemConfig","color","ChartTooltip","ChartTooltipContent","active","payload","label","indicator","hideLabel","hideIndicator","labelFormatter","formatter","labelClassName","nameKey","labelKey","tooltipLabel","item","getPayloadConfigFromPayload","value","nestLabel","index","indicatorColor","undefined","ChartLegend","ChartLegendContent","hideIcon","verticalAlign","payloadPayload","configLabelKey"],"mappings":"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"}

package/dist/esm/components/ui/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\drawer.js","sources":["webpack://@arolariu/components/./src/components/ui/drawer.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { Drawer as DrawerPrimitive } from \"vaul\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />;\n}\n\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          \"group/drawer-content bg-white fixed z-50 flex h-auto flex-col dark:bg-neutral-950\",\n          \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\n          \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\n          \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n          \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"bg-neutral-100 mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block dark:bg-neutral-800\" />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  );\n}\n\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\n        \"flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn(\n        \"text-neutral-950 font-semibold dark:text-neutral-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn(\n        \"text-neutral-500 text-sm dark:text-neutral-400\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n};\n"],"names":["Drawer","props","DrawerPrimitive","DrawerTrigger","DrawerPortal","DrawerClose","DrawerOverlay","className","cn","DrawerContent","children","DrawerHeader","DrawerFooter","DrawerTitle","DrawerDescription"],"mappings":";;;;;AAOA,SAASA,cAAO,EACd,GAAGC,OAC+C;IAClD,OAAO,WAAP,GAAO,IAACC,OAAAA,IAAoB;QAAC,aAAU;QAAU,GAAGD,KAAK;;AAC3D;AAEA,SAASE,cAAc,EACrB,GAAGF,OACkD;IACrD,OAAO,WAAP,GAAO,IAACC,OAAAA,OAAuB;QAAC,aAAU;QAAkB,GAAGD,KAAK;;AACtE;AAEA,SAASG,aAAa,EACpB,GAAGH,OACiD;IACpD,OAAO,WAAP,GAAO,IAACC,OAAAA,MAAsB;QAAC,aAAU;QAAiB,GAAGD,KAAK;;AACpE;AAEA,SAASI,YAAY,EACnB,GAAGJ,OACgD;IACnD,OAAO,WAAP,GAAO,IAACC,OAAAA,KAAqB;QAAC,aAAU;QAAgB,GAAGD,KAAK;;AAClE;AAEA,SAASK,cAAc,EACrBC,SAAS,EACT,GAAGN,OACkD;IACrD,OAAO,WAAP,GACE,IAACC,OAAAA,OAAuB;QACtB,aAAU;QACV,WAAWM,GACT,0JACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASQ,cAAc,EACrBF,SAAS,EACTG,QAAQ,EACR,GAAGT,OACkD;IACrD,OAAO,WAAP,GACE,KAACG,cAAAA;QAAa,aAAU;;0BACtB,IAACE,eAAAA,CAAAA;0BACD,KAACJ,OAAAA,OAAuB;gBACtB,aAAU;gBACV,WAAWM,GACT,qFACA,kQACA,uRACA,+NACA,yNACAD;gBAED,GAAGN,KAAK;;kCAET,IAAC;wBAAI,WAAU;;oBACdS;;;;;AAIT;AAEA,SAASC,aAAa,EAAEJ,SAAS,EAAE,GAAGN,OAAoC;IACxE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWO,GACT,4LACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASW,aAAa,EAAEL,SAAS,EAAE,GAAGN,OAAoC;IACxE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWO,GAAG,mCAAmCD;QAChD,GAAGN,KAAK;;AAGf;AAEA,SAASY,YAAY,EACnBN,SAAS,EACT,GAAGN,OACgD;IACnD,OAAO,WAAP,GACE,IAACC,OAAAA,KAAqB;QACpB,aAAU;QACV,WAAWM,GACT,uDACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASa,kBAAkB,EACzBP,SAAS,EACT,GAAGN,OACsD;IACzD,OAAO,WAAP,GACE,IAACC,OAAAA,WAA2B;QAC1B,aAAU;QACV,WAAWM,GACT,kDACAD;QAED,GAAGN,KAAK;;AAGf"}
+{"version":3,"file":"components\\ui\\drawer.js","sources":["webpack://@arolariu/components/./src/components/ui/drawer.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport { Drawer as DrawerPrimitive } from \"vaul\";\r\n\r\nimport { cn } from \"@/lib/utils\";\r\n\r\nfunction Drawer({\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\r\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\r\n}\r\n\r\nfunction DrawerTrigger({\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\r\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\r\n}\r\n\r\nfunction DrawerPortal({\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\r\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />;\r\n}\r\n\r\nfunction DrawerClose({\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\r\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\r\n}\r\n\r\nfunction DrawerOverlay({\r\n  className,\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\r\n  return (\r\n    <DrawerPrimitive.Overlay\r\n      data-slot=\"drawer-overlay\"\r\n      className={cn(\r\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction DrawerContent({\r\n  className,\r\n  children,\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\r\n  return (\r\n    <DrawerPortal data-slot=\"drawer-portal\">\r\n      <DrawerOverlay />\r\n      <DrawerPrimitive.Content\r\n        data-slot=\"drawer-content\"\r\n        className={cn(\r\n          \"group/drawer-content bg-white fixed z-50 flex h-auto flex-col dark:bg-neutral-950\",\r\n          \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\r\n          \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\r\n          \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\r\n          \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        <div className=\"bg-neutral-100 mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block dark:bg-neutral-800\" />\r\n        {children}\r\n      </DrawerPrimitive.Content>\r\n    </DrawerPortal>\r\n  );\r\n}\r\n\r\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\r\n  return (\r\n    <div\r\n      data-slot=\"drawer-header\"\r\n      className={cn(\r\n        \"flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\r\n  return (\r\n    <div\r\n      data-slot=\"drawer-footer\"\r\n      className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction DrawerTitle({\r\n  className,\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\r\n  return (\r\n    <DrawerPrimitive.Title\r\n      data-slot=\"drawer-title\"\r\n      className={cn(\r\n        \"text-neutral-950 font-semibold dark:text-neutral-50\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction DrawerDescription({\r\n  className,\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\r\n  return (\r\n    <DrawerPrimitive.Description\r\n      data-slot=\"drawer-description\"\r\n      className={cn(\r\n        \"text-neutral-500 text-sm dark:text-neutral-400\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport {\r\n  Drawer,\r\n  DrawerPortal,\r\n  DrawerOverlay,\r\n  DrawerTrigger,\r\n  DrawerClose,\r\n  DrawerContent,\r\n  DrawerHeader,\r\n  DrawerFooter,\r\n  DrawerTitle,\r\n  DrawerDescription,\r\n};\r\n"],"names":["Drawer","props","DrawerPrimitive","DrawerTrigger","DrawerPortal","DrawerClose","DrawerOverlay","className","cn","DrawerContent","children","DrawerHeader","DrawerFooter","DrawerTitle","DrawerDescription"],"mappings":";;;;;AAOA,SAASA,cAAO,EACd,GAAGC,OAC+C;IAClD,OAAO,WAAP,GAAO,IAACC,OAAAA,IAAoB;QAAC,aAAU;QAAU,GAAGD,KAAK;;AAC3D;AAEA,SAASE,cAAc,EACrB,GAAGF,OACkD;IACrD,OAAO,WAAP,GAAO,IAACC,OAAAA,OAAuB;QAAC,aAAU;QAAkB,GAAGD,KAAK;;AACtE;AAEA,SAASG,aAAa,EACpB,GAAGH,OACiD;IACpD,OAAO,WAAP,GAAO,IAACC,OAAAA,MAAsB;QAAC,aAAU;QAAiB,GAAGD,KAAK;;AACpE;AAEA,SAASI,YAAY,EACnB,GAAGJ,OACgD;IACnD,OAAO,WAAP,GAAO,IAACC,OAAAA,KAAqB;QAAC,aAAU;QAAgB,GAAGD,KAAK;;AAClE;AAEA,SAASK,cAAc,EACrBC,SAAS,EACT,GAAGN,OACkD;IACrD,OAAO,WAAP,GACE,IAACC,OAAAA,OAAuB;QACtB,aAAU;QACV,WAAWM,GACT,0JACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASQ,cAAc,EACrBF,SAAS,EACTG,QAAQ,EACR,GAAGT,OACkD;IACrD,OAAO,WAAP,GACE,KAACG,cAAAA;QAAa,aAAU;;0BACtB,IAACE,eAAAA,CAAAA;0BACD,KAACJ,OAAAA,OAAuB;gBACtB,aAAU;gBACV,WAAWM,GACT,qFACA,kQACA,uRACA,+NACA,yNACAD;gBAED,GAAGN,KAAK;;kCAET,IAAC;wBAAI,WAAU;;oBACdS;;;;;AAIT;AAEA,SAASC,aAAa,EAAEJ,SAAS,EAAE,GAAGN,OAAoC;IACxE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWO,GACT,4LACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASW,aAAa,EAAEL,SAAS,EAAE,GAAGN,OAAoC;IACxE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWO,GAAG,mCAAmCD;QAChD,GAAGN,KAAK;;AAGf;AAEA,SAASY,YAAY,EACnBN,SAAS,EACT,GAAGN,OACgD;IACnD,OAAO,WAAP,GACE,IAACC,OAAAA,KAAqB;QACpB,aAAU;QACV,WAAWM,GACT,uDACAD;QAED,GAAGN,KAAK;;AAGf;AAEA,SAASa,kBAAkB,EACzBP,SAAS,EACT,GAAGN,OACsD;IACzD,OAAO,WAAP,GACE,IAACC,OAAAA,WAA2B;QAC1B,aAAU;QACV,WAAWM,GACT,kDACAD;QAED,GAAGN,KAAK;;AAGf"}

package/dist/esm/components/ui/dropdrawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\dropdrawer.js","sources":["webpack://@arolariu/components/./src/components/ui/dropdrawer.tsx"],"sourcesContent":["\n\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {\n  Drawer,\n  DrawerClose,\n  DrawerContent,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerTitle,\n  DrawerTrigger,\n} from \"@/components/ui/drawer\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { useIsMobile } from \"@/hooks/use-mobile\";\nimport { cn } from \"@/lib/utils\";\n\nconst DropDrawerContext = React.createContext<{ isMobile: boolean }>({\n  isMobile: false,\n});\n\nconst useDropDrawerContext = () => {\n  const context = React.useContext(DropDrawerContext);\n  if (!context) {\n    throw new Error(\n      \"DropDrawer components cannot be rendered outside the Context\",\n    );\n  }\n  return context;\n};\n\nfunction DropDrawer({\n  children,\n  ...props\n}:\n  | React.ComponentProps<typeof Drawer>\n  | React.ComponentProps<typeof DropdownMenu>) {\n  const isMobile = useIsMobile();\n  const DropdownComponent = isMobile ? Drawer : DropdownMenu;\n\n  return (\n    <DropDrawerContext.Provider value={{ isMobile }}>\n      <DropdownComponent\n        data-slot=\"drop-drawer\"\n        {...(isMobile && { autoFocus: true })}\n        {...props}\n      >\n        {children}\n      </DropdownComponent>\n    </DropDrawerContext.Provider>\n  );\n}\n\nfunction DropDrawerTrigger({\n  className,\n  children,\n  ...props\n}:\n  | React.ComponentProps<typeof DrawerTrigger>\n  | React.ComponentProps<typeof DropdownMenuTrigger>) {\n  const { isMobile } = useDropDrawerContext();\n  const TriggerComponent = isMobile ? DrawerTrigger : DropdownMenuTrigger;\n\n  return (\n    <TriggerComponent\n      data-slot=\"drop-drawer-trigger\"\n      className={className}\n      {...props}\n    >\n      {children}\n    </TriggerComponent>\n  );\n}\n\nfunction DropDrawerContent({\n  className,\n  children,\n  ...props\n}:\n  | React.ComponentProps<typeof DrawerContent>\n  | React.ComponentProps<typeof DropdownMenuContent>) {\n  const { isMobile } = useDropDrawerContext();\n  const [activeSubmenu, setActiveSubmenu] = React.useState<string | null>(null);\n  const [submenuTitle, setSubmenuTitle] = React.useState<string | null>(null);\n  const [submenuStack, setSubmenuStack] = React.useState<\n    { id: string; title: string }[]\n  >([]);\n  // Add animation direction state\n  const [animationDirection, setAnimationDirection] = React.useState<\n    \"forward\" | \"backward\"\n  >(\"forward\");\n\n  // Create a ref to store submenu content by ID\n  const submenuContentRef = React.useRef<Map<string, React.ReactNode[]>>(\n    new Map(),\n  );\n\n  // Function to navigate to a submenu\n  const navigateToSubmenu = React.useCallback((id: string, title: string) => {\n    // Set animation direction to forward when navigating to a submenu\n    setAnimationDirection(\"forward\");\n    setActiveSubmenu(id);\n    setSubmenuTitle(title);\n    setSubmenuStack((prev) => [...prev, { id, title }]);\n  }, []);\n\n  // Function to go back to previous menu\n  const goBack = React.useCallback(() => {\n    // Set animation direction to backward when going back\n    setAnimationDirection(\"backward\");\n\n    if (submenuStack.length <= 1) {\n      // If we're at the first level, go back to main menu\n      setActiveSubmenu(null);\n      setSubmenuTitle(null);\n      setSubmenuStack([]);\n    } else {\n      // Go back to previous submenu\n      const newStack = [...submenuStack];\n      newStack.pop(); // Remove current\n      const previous = newStack[newStack.length - 1];\n      setActiveSubmenu(previous.id);\n      setSubmenuTitle(previous.title);\n      setSubmenuStack(newStack);\n    }\n  }, [submenuStack]);\n\n  // Function to register submenu content\n  const registerSubmenuContent = React.useCallback(\n    (id: string, content: React.ReactNode[]) => {\n      submenuContentRef.current.set(id, content);\n    },\n    [],\n  );\n\n  // Function to extract submenu content\n  const extractSubmenuContent = React.useCallback(\n    (elements: React.ReactNode, targetId: string): React.ReactNode[] => {\n      const result: React.ReactNode[] = [];\n\n      // Recursive function to search through all children\n      const findSubmenuContent = (node: React.ReactNode) => {\n        // Skip if not a valid element\n        if (!React.isValidElement(node)) return;\n\n        const element = node as React.ReactElement;\n        // Use a more specific type to avoid 'any'\n        const props = element.props as {\n          id?: string;\n          \"data-submenu-id\"?: string;\n          children?: React.ReactNode;\n        };\n\n        // Check if this is a DropDrawerSub\n        if (element.type === DropDrawerSub) {\n          // Get all possible ID values\n          const elementId = props.id;\n          const dataSubmenuId = props[\"data-submenu-id\"];\n\n          // If this is the submenu we're looking for\n          if (elementId === targetId || dataSubmenuId === targetId) {\n            // Find the SubContent within this Sub\n            if (props.children) {\n              React.Children.forEach(props.children, (child) => {\n                if (\n                  React.isValidElement(child) &&\n                  child.type === DropDrawerSubContent\n                ) {\n                  // Add all children of the SubContent to the result\n                  const subContentProps = child.props as {\n                    children?: React.ReactNode;\n                  };\n                  if (subContentProps.children) {\n                    React.Children.forEach(\n                      subContentProps.children,\n                      (contentChild) => {\n                        result.push(contentChild);\n                      },\n                    );\n                  }\n                }\n              });\n            }\n            return; // Found what we needed, no need to search deeper\n          }\n        }\n\n        // If this element has children, search through them\n        if (props.children) {\n          if (Array.isArray(props.children)) {\n            props.children.forEach((child: React.ReactNode) =>\n              findSubmenuContent(child),\n            );\n          } else {\n            findSubmenuContent(props.children);\n          }\n        }\n      };\n\n      // Start the search from the root elements\n      if (Array.isArray(elements)) {\n        elements.forEach((child) => findSubmenuContent(child));\n      } else {\n        findSubmenuContent(elements);\n      }\n\n      return result;\n    },\n    [],\n  );\n\n  // Get submenu content (either from cache or extract it)\n  const getSubmenuContent = React.useCallback(\n    (id: string) => {\n      // Check if we have the content in our ref\n      const cachedContent = submenuContentRef.current.get(id || \"\");\n      if (cachedContent && cachedContent.length > 0) {\n        return cachedContent;\n      }\n\n      // If not in cache, extract it\n      const submenuContent = extractSubmenuContent(children, id);\n\n      if (submenuContent.length === 0) {\n        return [];\n      }\n\n      // Store in cache for future use\n      if (id) {\n        submenuContentRef.current.set(id, submenuContent);\n      }\n\n      return submenuContent;\n    },\n    [children, extractSubmenuContent],\n  );\n\n  // Animation variants for Framer Motion\n  const variants = {\n    enter: (direction: \"forward\" | \"backward\") => ({\n      x: direction === \"forward\" ? \"100%\" : \"-100%\",\n      opacity: 0,\n    }),\n    center: {\n      x: 0,\n      opacity: 1,\n    },\n    exit: (direction: \"forward\" | \"backward\") => ({\n      x: direction === \"forward\" ? \"-100%\" : \"100%\",\n      opacity: 0,\n    }),\n  };\n\n  // Animation transition\n  const transition = {\n    duration: 0.3,\n    ease: [0.25, 0.1, 0.25, 1.0], // cubic-bezier easing\n  };\n\n  if (isMobile) {\n    return (\n      <SubmenuContext.Provider\n        value={{\n          activeSubmenu,\n          setActiveSubmenu: (id) => {\n            if (id === null) {\n              setActiveSubmenu(null);\n              setSubmenuTitle(null);\n              setSubmenuStack([]);\n            }\n          },\n          submenuTitle,\n          setSubmenuTitle,\n          navigateToSubmenu,\n          registerSubmenuContent,\n        }}\n      >\n        <DrawerContent\n          data-slot=\"drop-drawer-content\"\n          className={cn(\"max-h-[90vh]\", className)}\n          {...props}\n        >\n          {activeSubmenu ? (\n            <>\n              <DrawerHeader>\n                <div className=\"flex items-center gap-2\">\n                  <button\n                    onClick={goBack}\n                    className=\"hover:bg-neutral-100/50 rounded-full p-1 dark:hover:bg-neutral-800/50\"\n                  >\n                    <ChevronLeftIcon className=\"h-5 w-5\" />\n                  </button>\n                  <DrawerTitle>{submenuTitle || \"Submenu\"}</DrawerTitle>\n                </div>\n              </DrawerHeader>\n              <div className=\"flex-1 relative overflow-y-auto max-h-[70vh]\">\n                {/* Use AnimatePresence to handle exit animations */}\n                <AnimatePresence\n                  initial={false}\n                  mode=\"wait\"\n                  custom={animationDirection}\n                >\n                  <motion.div\n                    key={activeSubmenu || \"main\"}\n                    custom={animationDirection}\n                    variants={variants}\n                    initial=\"enter\"\n                    animate=\"center\"\n                    exit=\"exit\"\n                    transition={transition}\n                    className=\"pb-6 space-y-1.5 w-full h-full\"\n                  >\n                    {activeSubmenu\n                      ? getSubmenuContent(activeSubmenu)\n                      : children}\n                  </motion.div>\n                </AnimatePresence>\n              </div>\n            </>\n          ) : (\n            <>\n              <DrawerHeader className=\"sr-only\">\n                <DrawerTitle>Menu</DrawerTitle>\n              </DrawerHeader>\n              <div className=\"overflow-y-auto max-h-[70vh]\">\n                <AnimatePresence\n                  initial={false}\n                  mode=\"wait\"\n                  custom={animationDirection}\n                >\n                  <motion.div\n                    key=\"main-menu\"\n                    custom={animationDirection}\n                    variants={variants}\n                    initial=\"enter\"\n                    animate=\"center\"\n                    exit=\"exit\"\n                    transition={transition}\n                    className=\"pb-6 space-y-1.5 w-full\"\n                  >\n                    {children}\n                  </motion.div>\n                </AnimatePresence>\n              </div>\n            </>\n          )}\n        </DrawerContent>\n      </SubmenuContext.Provider>\n    );\n  }\n\n  return (\n    <SubmenuContext.Provider\n      value={{\n        activeSubmenu,\n        setActiveSubmenu,\n        submenuTitle,\n        setSubmenuTitle,\n        registerSubmenuContent,\n      }}\n    >\n      <DropdownMenuContent\n        data-slot=\"drop-drawer-content\"\n        align=\"end\"\n        sideOffset={4}\n        className={cn(\n          \"max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[220px] overflow-y-auto\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </DropdownMenuContent>\n    </SubmenuContext.Provider>\n  );\n}\n\nfunction DropDrawerItem({\n  className,\n  children,\n  onSelect,\n  onClick,\n  icon,\n  variant = \"default\",\n  inset,\n  disabled,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuItem> & {\n  icon?: React.ReactNode;\n}) {\n  const { isMobile } = useDropDrawerContext();\n\n  // Define hooks outside of conditionals to follow React rules\n  // Check if this item is inside a group by looking at parent elements\n  const isInGroup = React.useCallback(\n    (element: HTMLElement | null): boolean => {\n      if (!element) return false;\n\n      // Check if any parent has a data-drop-drawer-group attribute\n      let parent = element.parentElement;\n      while (parent) {\n        if (parent.hasAttribute(\"data-drop-drawer-group\")) {\n          return true;\n        }\n        parent = parent.parentElement;\n      }\n      return false;\n    },\n    [],\n  );\n\n  // Create a ref to check if the item is in a group\n  const itemRef = React.useRef<HTMLDivElement>(null);\n  const [isInsideGroup, setIsInsideGroup] = React.useState(false);\n\n  React.useEffect(() => {\n    // Only run this effect in mobile mode\n    if (!isMobile) return;\n\n    // Use a short timeout to ensure the DOM is fully rendered\n    const timer = setTimeout(() => {\n      if (itemRef.current) {\n        setIsInsideGroup(isInGroup(itemRef.current));\n      }\n    }, 0);\n\n    return () => clearTimeout(timer);\n  }, [isInGroup, isMobile]);\n\n  if (isMobile) {\n    const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n      if (disabled) return;\n      if (onClick) onClick(e);\n      if (onSelect) onSelect(e as unknown as Event);\n    };\n\n    // Only wrap in DrawerClose if it's not a submenu item\n    const content = (\n      <div\n        ref={itemRef}\n        data-slot=\"drop-drawer-item\"\n        data-variant={variant}\n        data-inset={inset}\n        data-disabled={disabled}\n        className={cn(\n          \"flex cursor-pointer items-center justify-between px-4 py-4\",\n          // Only apply margin, background and rounded corners if not in a group\n          !isInsideGroup &&\n            \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-1.5 rounded-md dark:bg-neutral-800 dark:dark:bg-neutral-800\",\n          // For items in a group, don't add background but add more padding\n          isInsideGroup && \"bg-transparent py-4\",\n          inset && \"pl-8\",\n          variant === \"destructive\" &&\n            \"text-red-500 dark:text-red-500 dark:text-red-900 dark:dark:text-red-900\",\n          disabled && \"pointer-events-none opacity-50\",\n          className,\n        )}\n        onClick={handleClick}\n        aria-disabled={disabled}\n        {...props}\n      >\n        <div className=\"flex items-center gap-2\">{children}</div>\n        {icon && <div className=\"flex-shrink-0\">{icon}</div>}\n      </div>\n    );\n\n    // Check if this is inside a submenu\n    const isInSubmenu =\n      (props as Record<string, unknown>)[\"data-parent-submenu-id\"] ||\n      (props as Record<string, unknown>)[\"data-parent-submenu\"];\n\n    if (isInSubmenu) {\n      return content;\n    }\n\n    return <DrawerClose asChild>{content}</DrawerClose>;\n  }\n\n  return (\n    <DropdownMenuItem\n      data-slot=\"drop-drawer-item\"\n      data-variant={variant}\n      data-inset={inset}\n      className={className}\n      onSelect={onSelect}\n      onClick={onClick as React.MouseEventHandler<HTMLDivElement>}\n      variant={variant}\n      inset={inset}\n      disabled={disabled}\n      {...props}\n    >\n      <div className=\"flex w-full items-center justify-between\">\n        <div>{children}</div>\n        {icon && <div>{icon}</div>}\n      </div>\n    </DropdownMenuItem>\n  );\n}\n\nfunction DropDrawerSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSeparator>) {\n  const { isMobile } = useDropDrawerContext();\n\n  // For mobile, render a simple divider\n  if (isMobile) {\n    return null;\n  }\n\n  // For desktop, use the standard dropdown separator\n  return (\n    <DropdownMenuSeparator\n      data-slot=\"drop-drawer-separator\"\n      className={className}\n      {...props}\n    />\n  );\n}\n\nfunction DropDrawerLabel({\n  className,\n  children,\n  ...props\n}:\n  | React.ComponentProps<typeof DropdownMenuLabel>\n  | React.ComponentProps<typeof DrawerTitle>) {\n  const { isMobile } = useDropDrawerContext();\n\n  if (isMobile) {\n    return (\n      <DrawerHeader className=\"p-0\">\n        <DrawerTitle\n          data-slot=\"drop-drawer-label\"\n          className={cn(\n            \"text-neutral-500 px-4 py-2 text-sm font-medium dark:text-neutral-400\",\n            className,\n          )}\n          {...props}\n        >\n          {children}\n        </DrawerTitle>\n      </DrawerHeader>\n    );\n  }\n\n  return (\n    <DropdownMenuLabel\n      data-slot=\"drop-drawer-label\"\n      className={className}\n      {...props}\n    >\n      {children}\n    </DropdownMenuLabel>\n  );\n}\n\nfunction DropDrawerFooter({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerFooter> | React.ComponentProps<\"div\">) {\n  const { isMobile } = useDropDrawerContext();\n\n  if (isMobile) {\n    return (\n      <DrawerFooter\n        data-slot=\"drop-drawer-footer\"\n        className={cn(\"p-4\", className)}\n        {...props}\n      >\n        {children}\n      </DrawerFooter>\n    );\n  }\n\n  // No direct equivalent in DropdownMenu, so we'll just render a div\n  return (\n    <div\n      data-slot=\"drop-drawer-footer\"\n      className={cn(\"p-2\", className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction DropDrawerGroup({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  children: React.ReactNode;\n}) {\n  const { isMobile } = useDropDrawerContext();\n\n  // Add separators between children on mobile\n  const childrenWithSeparators = React.useMemo(() => {\n    if (!isMobile) return children;\n\n    const childArray = React.Children.toArray(children);\n\n    // Filter out any existing separators\n    const filteredChildren = childArray.filter(\n      (child) =>\n        React.isValidElement(child) && child.type !== DropDrawerSeparator,\n    );\n\n    // Add separators between items\n    return filteredChildren.flatMap((child, index) => {\n      if (index === filteredChildren.length - 1) return [child];\n      return [\n        child,\n        <div\n          key={`separator-${index}`}\n          className=\"bg-neutral-200 h-px dark:bg-neutral-800\"\n          aria-hidden=\"true\"\n        />,\n      ];\n    });\n  }, [children, isMobile]);\n\n  if (isMobile) {\n    return (\n      <div\n        data-drop-drawer-group\n        data-slot=\"drop-drawer-group\"\n        role=\"group\"\n        className={cn(\n          \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-3 overflow-hidden rounded-xl dark:bg-neutral-800 dark:dark:bg-neutral-800\",\n          className,\n        )}\n        {...props}\n      >\n        {childrenWithSeparators}\n      </div>\n    );\n  }\n\n  // On desktop, use a div with proper role and attributes\n  return (\n    <div\n      data-drop-drawer-group\n      data-slot=\"drop-drawer-group\"\n      role=\"group\"\n      className={className}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\n// Context for managing submenu state on mobile\ninterface SubmenuContextType {\n  activeSubmenu: string | null;\n  setActiveSubmenu: (id: string | null) => void;\n  submenuTitle: string | null;\n  setSubmenuTitle: (title: string | null) => void;\n  navigateToSubmenu?: (id: string, title: string) => void;\n  registerSubmenuContent?: (id: string, content: React.ReactNode[]) => void;\n}\n\nconst SubmenuContext = React.createContext<SubmenuContextType>({\n  activeSubmenu: null,\n  setActiveSubmenu: () => {},\n  submenuTitle: null,\n  setSubmenuTitle: () => {},\n  navigateToSubmenu: undefined,\n  registerSubmenuContent: undefined,\n});\n\n// Submenu components\n// Counter for generating simple numeric IDs\nlet submenuIdCounter = 0;\n\nfunction DropDrawerSub({\n  children,\n  id,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSub> & {\n  id?: string;\n}) {\n  const { isMobile } = useDropDrawerContext();\n  const { registerSubmenuContent } = React.useContext(SubmenuContext);\n\n  // Generate a simple numeric ID instead of using React.useId()\n  const [generatedId] = React.useState(() => `submenu-${submenuIdCounter++}`);\n  const submenuId = id || generatedId;\n\n  // Extract submenu content to register with parent\n  React.useEffect(() => {\n    if (!registerSubmenuContent) return;\n\n    // Find the SubContent within this Sub\n    const contentItems: React.ReactNode[] = [];\n    React.Children.forEach(children, (child) => {\n      if (React.isValidElement(child) && child.type === DropDrawerSubContent) {\n        // Add all children of the SubContent to the result\n        React.Children.forEach(\n          (child.props as { children?: React.ReactNode }).children,\n          (contentChild) => {\n            contentItems.push(contentChild);\n          },\n        );\n      }\n    });\n\n    // Register the content with the parent\n    if (contentItems.length > 0) {\n      registerSubmenuContent(submenuId, contentItems);\n    }\n  }, [children, registerSubmenuContent, submenuId]);\n\n  if (isMobile) {\n    // For mobile, we'll use the context to manage submenu state\n    // Process children to pass the submenu ID to the trigger and content\n    const processedChildren = React.Children.map(children, (child) => {\n      if (!React.isValidElement(child)) return child;\n\n      if (child.type === DropDrawerSubTrigger) {\n        return React.cloneElement(\n          child as React.ReactElement,\n          {\n            ...(child.props as object),\n            \"data-parent-submenu-id\": submenuId,\n            \"data-submenu-id\": submenuId,\n            // Use only data attributes, not custom props\n            \"data-parent-submenu\": submenuId,\n          } as React.HTMLAttributes<HTMLElement>,\n        );\n      }\n\n      if (child.type === DropDrawerSubContent) {\n        return React.cloneElement(\n          child as React.ReactElement,\n          {\n            ...(child.props as object),\n            \"data-parent-submenu-id\": submenuId,\n            \"data-submenu-id\": submenuId,\n            // Use only data attributes, not custom props\n            \"data-parent-submenu\": submenuId,\n          } as React.HTMLAttributes<HTMLElement>,\n        );\n      }\n\n      return child;\n    });\n\n    return (\n      <div\n        data-slot=\"drop-drawer-sub\"\n        data-submenu-id={submenuId}\n        id={submenuId}\n      >\n        {processedChildren}\n      </div>\n    );\n  }\n\n  // For desktop, pass the generated ID to the DropdownMenuSub\n  return (\n    <DropdownMenuSub\n      data-slot=\"drop-drawer-sub\"\n      data-submenu-id={submenuId}\n      // Don't pass id to DropdownMenuSub as it doesn't accept this prop\n      {...props}\n    >\n      {children}\n    </DropdownMenuSub>\n  );\n}\n\nfunction DropDrawerSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubTrigger> & {\n  icon?: React.ReactNode;\n}) {\n  const { isMobile } = useDropDrawerContext();\n  const { navigateToSubmenu } = React.useContext(SubmenuContext);\n\n  // Define hooks outside of conditionals to follow React rules\n  // Check if this item is inside a group by looking at parent elements\n  const isInGroup = React.useCallback(\n    (element: HTMLElement | null): boolean => {\n      if (!element) return false;\n\n      // Check if any parent has a data-drop-drawer-group attribute\n      let parent = element.parentElement;\n      while (parent) {\n        if (parent.hasAttribute(\"data-drop-drawer-group\")) {\n          return true;\n        }\n        parent = parent.parentElement;\n      }\n      return false;\n    },\n    [],\n  );\n\n  // Create a ref to check if the item is in a group\n  const itemRef = React.useRef<HTMLDivElement>(null);\n  const [isInsideGroup, setIsInsideGroup] = React.useState(false);\n\n  React.useEffect(() => {\n    // Only run this effect in mobile mode\n    if (!isMobile) return;\n\n    // Use a short timeout to ensure the DOM is fully rendered\n    const timer = setTimeout(() => {\n      if (itemRef.current) {\n        setIsInsideGroup(isInGroup(itemRef.current));\n      }\n    }, 0);\n\n    return () => clearTimeout(timer);\n  }, [isInGroup, isMobile]);\n\n  if (isMobile) {\n    // Find the parent submenu ID\n    const handleClick = (e: React.MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n\n      // Get the closest parent with data-submenu-id attribute\n      const element = e.currentTarget as HTMLElement;\n      let submenuId: string | null = null;\n\n      // First check if the element itself has the data attribute\n      if (element.closest(\"[data-submenu-id]\")) {\n        const closestElement = element.closest(\"[data-submenu-id]\");\n        const id = closestElement?.getAttribute(\"data-submenu-id\");\n        if (id) {\n          submenuId = id;\n        }\n      }\n\n      // If not found, try props\n      if (!submenuId) {\n        submenuId =\n          ((props as Record<string, unknown>)[\n            \"data-parent-submenu-id\"\n          ] as string) ||\n          ((props as Record<string, unknown>)[\"data-parent-submenu\"] as string);\n      }\n\n      if (!submenuId) {\n        return;\n      }\n\n      // Get the title\n      const title = typeof children === \"string\" ? children : \"Submenu\";\n\n      // Navigate to the submenu\n      if (navigateToSubmenu) {\n        navigateToSubmenu(submenuId, title);\n      }\n    };\n\n    // Combine onClick handlers\n    const combinedOnClick = (e: React.MouseEvent) => {\n      // Call the original onClick if provided\n      const typedProps = props as Record<string, unknown>;\n      if (typedProps[\"onClick\"]) {\n        const originalOnClick = typedProps[\n          \"onClick\"\n        ] as React.MouseEventHandler<HTMLDivElement>;\n        originalOnClick(e as React.MouseEvent<HTMLDivElement>);\n      }\n\n      // Call our navigation handler\n      handleClick(e);\n    };\n\n    // Remove onClick from props to avoid duplicate handlers\n    const { ...restProps } = props as Record<string, unknown>;\n\n    // Don't wrap in DrawerClose for submenu triggers\n    return (\n      <div\n        ref={itemRef}\n        data-slot=\"drop-drawer-sub-trigger\"\n        data-inset={inset}\n        className={cn(\n          \"flex cursor-pointer items-center justify-between px-4 py-4\",\n          // Only apply margin, background and rounded corners if not in a group\n          !isInsideGroup &&\n            \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-1.5 rounded-md dark:bg-neutral-800 dark:dark:bg-neutral-800\",\n          // For items in a group, don't add background but add more padding\n          isInsideGroup && \"bg-transparent py-4\",\n          inset && \"pl-8\",\n          className,\n        )}\n        onClick={combinedOnClick}\n        {...restProps}\n      >\n        <div className=\"flex items-center gap-2\">{children}</div>\n        <ChevronRightIcon className=\"h-5 w-5\" />\n      </div>\n    );\n  }\n\n  return (\n    <DropdownMenuSubTrigger\n      data-slot=\"drop-drawer-sub-trigger\"\n      data-inset={inset}\n      className={className}\n      inset={inset}\n      {...props}\n    >\n      {children}\n    </DropdownMenuSubTrigger>\n  );\n}\n\nfunction DropDrawerSubContent({\n  className,\n  sideOffset = 4,\n  children,\n  ...props\n}: React.ComponentProps<typeof DropdownMenuSubContent>) {\n  const { isMobile } = useDropDrawerContext();\n\n  if (isMobile) {\n    // For mobile, we don't render the content directly\n    // It will be rendered by the DropDrawerContent component when active\n    return null;\n  }\n\n  return (\n    <DropdownMenuSubContent\n      data-slot=\"drop-drawer-sub-content\"\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 p-1 shadow-lg dark:border-neutral-800\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </DropdownMenuSubContent>\n  );\n}\n\nexport {\n  DropDrawer,\n  DropDrawerContent,\n  DropDrawerFooter,\n  DropDrawerGroup,\n  DropDrawerItem,\n  DropDrawerLabel,\n  DropDrawerSeparator,\n  DropDrawerSub,\n  DropDrawerSubContent,\n  DropDrawerSubTrigger,\n  DropDrawerTrigger,\n};\n"],"names":["DropDrawerContext","React","useDropDrawerContext","context","Error","DropDrawer","children","props","isMobile","useIsMobile","DropdownComponent","Drawer","DropdownMenu","DropDrawerTrigger","className","TriggerComponent","DrawerTrigger","DropdownMenuTrigger","DropDrawerContent","activeSubmenu","setActiveSubmenu","submenuTitle","setSubmenuTitle","submenuStack","setSubmenuStack","animationDirection","setAnimationDirection","submenuContentRef","Map","navigateToSubmenu","id","title","prev","goBack","newStack","previous","registerSubmenuContent","content","extractSubmenuContent","elements","targetId","result","findSubmenuContent","node","element","DropDrawerSub","elementId","dataSubmenuId","child","DropDrawerSubContent","subContentProps","contentChild","Array","getSubmenuContent","cachedContent","submenuContent","variants","direction","transition","SubmenuContext","DrawerContent","cn","DrawerHeader","ChevronLeftIcon","DrawerTitle","AnimatePresence","motion","DropdownMenuContent","DropDrawerItem","onSelect","onClick","icon","variant","inset","disabled","isInGroup","parent","itemRef","isInsideGroup","setIsInsideGroup","timer","setTimeout","clearTimeout","handleClick","e","isInSubmenu","DrawerClose","DropdownMenuItem","DropDrawerSeparator","DropdownMenuSeparator","DropDrawerLabel","DropdownMenuLabel","DropDrawerFooter","DrawerFooter","DropDrawerGroup","childrenWithSeparators","childArray","filteredChildren","index","undefined","submenuIdCounter","generatedId","submenuId","contentItems","processedChildren","DropDrawerSubTrigger","DropdownMenuSub","closestElement","combinedOnClick","typedProps","originalOnClick","restProps","ChevronRightIcon","DropdownMenuSubTrigger","sideOffset","DropdownMenuSubContent"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\dropdrawer.js","sources":["webpack://@arolariu/components/./src/components/ui/dropdrawer.tsx"],"sourcesContent":["\r\n\r\nimport { AnimatePresence, motion, Transition } from \"motion/react\";\r\nimport { ChevronLeftIcon, ChevronRightIcon } from \"lucide-react\";\r\nimport * as React from \"react\";\r\n\r\nimport {\r\n  Drawer,\r\n  DrawerClose,\r\n  DrawerContent,\r\n  DrawerFooter,\r\n  DrawerHeader,\r\n  DrawerTitle,\r\n  DrawerTrigger,\r\n} from \"@/components/ui/drawer\";\r\nimport {\r\n  DropdownMenu,\r\n  DropdownMenuContent,\r\n  DropdownMenuItem,\r\n  DropdownMenuLabel,\r\n  DropdownMenuSeparator,\r\n  DropdownMenuSub,\r\n  DropdownMenuSubContent,\r\n  DropdownMenuSubTrigger,\r\n  DropdownMenuTrigger,\r\n} from \"@/components/ui/dropdown-menu\";\r\nimport { useIsMobile } from \"@/hooks/use-mobile\";\r\nimport { cn } from \"@/lib/utils\";\r\n\r\nconst DropDrawerContext = React.createContext<{ isMobile: boolean }>({\r\n  isMobile: false,\r\n});\r\n\r\nconst useDropDrawerContext = () => {\r\n  const context = React.useContext(DropDrawerContext);\r\n  if (!context) {\r\n    throw new Error(\r\n      \"DropDrawer components cannot be rendered outside the Context\",\r\n    );\r\n  }\r\n  return context;\r\n};\r\n\r\nfunction DropDrawer({\r\n  children,\r\n  ...props\r\n}:\r\n  | React.ComponentProps<typeof Drawer>\r\n  | React.ComponentProps<typeof DropdownMenu>) {\r\n  const isMobile = useIsMobile();\r\n  const DropdownComponent = isMobile ? Drawer : DropdownMenu;\r\n\r\n  return (\r\n    <DropDrawerContext.Provider value={{ isMobile }}>\r\n      <DropdownComponent\r\n        data-slot=\"drop-drawer\"\r\n        {...(isMobile && { autoFocus: true })}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </DropdownComponent>\r\n    </DropDrawerContext.Provider>\r\n  );\r\n}\r\n\r\nfunction DropDrawerTrigger({\r\n  className,\r\n  children,\r\n  ...props\r\n}:\r\n  | React.ComponentProps<typeof DrawerTrigger>\r\n  | React.ComponentProps<typeof DropdownMenuTrigger>) {\r\n  const { isMobile } = useDropDrawerContext();\r\n  const TriggerComponent = isMobile ? DrawerTrigger : DropdownMenuTrigger;\r\n\r\n  return (\r\n    <TriggerComponent\r\n      data-slot=\"drop-drawer-trigger\"\r\n      className={className}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </TriggerComponent>\r\n  );\r\n}\r\n\r\nfunction DropDrawerContent({\r\n  className,\r\n  children,\r\n  ...props\r\n}:\r\n  | React.ComponentProps<typeof DrawerContent>\r\n  | React.ComponentProps<typeof DropdownMenuContent>) {\r\n  const { isMobile } = useDropDrawerContext();\r\n  const [activeSubmenu, setActiveSubmenu] = React.useState<string | null>(null);\r\n  const [submenuTitle, setSubmenuTitle] = React.useState<string | null>(null);\r\n  const [submenuStack, setSubmenuStack] = React.useState<\r\n    { id: string; title: string }[]\r\n  >([]);\r\n  // Add animation direction state\r\n  const [animationDirection, setAnimationDirection] = React.useState<\r\n    \"forward\" | \"backward\"\r\n  >(\"forward\");\r\n\r\n  // Create a ref to store submenu content by ID\r\n  const submenuContentRef = React.useRef<Map<string, React.ReactNode[]>>(\r\n    new Map(),\r\n  );\r\n\r\n  // Function to navigate to a submenu\r\n  const navigateToSubmenu = React.useCallback((id: string, title: string) => {\r\n    // Set animation direction to forward when navigating to a submenu\r\n    setAnimationDirection(\"forward\");\r\n    setActiveSubmenu(id);\r\n    setSubmenuTitle(title);\r\n    setSubmenuStack((prev) => [...prev, { id, title }]);\r\n  }, []);\r\n\r\n  // Function to go back to previous menu\r\n  const goBack = React.useCallback(() => {\r\n    // Set animation direction to backward when going back\r\n    setAnimationDirection(\"backward\");\r\n\r\n    if (submenuStack.length <= 1) {\r\n      // If we're at the first level, go back to main menu\r\n      setActiveSubmenu(null);\r\n      setSubmenuTitle(null);\r\n      setSubmenuStack([]);\r\n    } else {\r\n      // Go back to previous submenu\r\n      const newStack = [...submenuStack];\r\n      newStack.pop(); // Remove current\r\n      const previous = newStack[newStack.length - 1];\r\n      setActiveSubmenu(previous.id);\r\n      setSubmenuTitle(previous.title);\r\n      setSubmenuStack(newStack);\r\n    }\r\n  }, [submenuStack]);\r\n\r\n  // Function to register submenu content\r\n  const registerSubmenuContent = React.useCallback(\r\n    (id: string, content: React.ReactNode[]) => {\r\n      submenuContentRef.current.set(id, content);\r\n    },\r\n    [],\r\n  );\r\n\r\n  // Function to extract submenu content\r\n  const extractSubmenuContent = React.useCallback(\r\n    (elements: React.ReactNode, targetId: string): React.ReactNode[] => {\r\n      const result: React.ReactNode[] = [];\r\n\r\n      // Recursive function to search through all children\r\n      const findSubmenuContent = (node: React.ReactNode) => {\r\n        // Skip if not a valid element\r\n        if (!React.isValidElement(node)) return;\r\n\r\n        const element = node as React.ReactElement;\r\n        // Use a more specific type to avoid 'any'\r\n        const props = element.props as {\r\n          id?: string;\r\n          \"data-submenu-id\"?: string;\r\n          children?: React.ReactNode;\r\n        };\r\n\r\n        // Check if this is a DropDrawerSub\r\n        if (element.type === DropDrawerSub) {\r\n          // Get all possible ID values\r\n          const elementId = props.id;\r\n          const dataSubmenuId = props[\"data-submenu-id\"];\r\n\r\n          // If this is the submenu we're looking for\r\n          if (elementId === targetId || dataSubmenuId === targetId) {\r\n            // Find the SubContent within this Sub\r\n            if (props.children) {\r\n              React.Children.forEach(props.children, (child) => {\r\n                if (\r\n                  React.isValidElement(child) &&\r\n                  child.type === DropDrawerSubContent\r\n                ) {\r\n                  // Add all children of the SubContent to the result\r\n                  const subContentProps = child.props as {\r\n                    children?: React.ReactNode;\r\n                  };\r\n                  if (subContentProps.children) {\r\n                    React.Children.forEach(\r\n                      subContentProps.children,\r\n                      (contentChild) => {\r\n                        result.push(contentChild);\r\n                      },\r\n                    );\r\n                  }\r\n                }\r\n              });\r\n            }\r\n            return; // Found what we needed, no need to search deeper\r\n          }\r\n        }\r\n\r\n        // If this element has children, search through them\r\n        if (props.children) {\r\n          if (Array.isArray(props.children)) {\r\n            props.children.forEach((child: React.ReactNode) =>\r\n              findSubmenuContent(child),\r\n            );\r\n          } else {\r\n            findSubmenuContent(props.children);\r\n          }\r\n        }\r\n      };\r\n\r\n      // Start the search from the root elements\r\n      if (Array.isArray(elements)) {\r\n        elements.forEach((child) => findSubmenuContent(child));\r\n      } else {\r\n        findSubmenuContent(elements);\r\n      }\r\n\r\n      return result;\r\n    },\r\n    [],\r\n  );\r\n\r\n  // Get submenu content (either from cache or extract it)\r\n  const getSubmenuContent = React.useCallback(\r\n    (id: string) => {\r\n      // Check if we have the content in our ref\r\n      const cachedContent = submenuContentRef.current.get(id || \"\");\r\n      if (cachedContent && cachedContent.length > 0) {\r\n        return cachedContent;\r\n      }\r\n\r\n      // If not in cache, extract it\r\n      const submenuContent = extractSubmenuContent(children, id);\r\n\r\n      if (submenuContent.length === 0) {\r\n        return [];\r\n      }\r\n\r\n      // Store in cache for future use\r\n      if (id) {\r\n        submenuContentRef.current.set(id, submenuContent);\r\n      }\r\n\r\n      return submenuContent;\r\n    },\r\n    [children, extractSubmenuContent],\r\n  );\r\n\r\n  // Animation variants for Framer Motion\r\n  const variants = {\r\n    enter: (direction: \"forward\" | \"backward\") => ({\r\n      x: direction === \"forward\" ? \"100%\" : \"-100%\",\r\n      opacity: 0,\r\n    }),\r\n    center: {\r\n      x: 0,\r\n      opacity: 1,\r\n    },\r\n    exit: (direction: \"forward\" | \"backward\") => ({\r\n      x: direction === \"forward\" ? \"-100%\" : \"100%\",\r\n      opacity: 0,\r\n    }),\r\n  };\r\n\r\n  // Animation transition\r\n  const transition = {\r\n    duration: 0.3,\r\n    ease: [0.25, 0.1, 0.25, 1.0], // cubic-bezier easing\r\n  } satisfies Transition;\r\n\r\n  if (isMobile) {\r\n    return (\r\n      <SubmenuContext.Provider\r\n        value={{\r\n          activeSubmenu,\r\n          setActiveSubmenu: (id) => {\r\n            if (id === null) {\r\n              setActiveSubmenu(null);\r\n              setSubmenuTitle(null);\r\n              setSubmenuStack([]);\r\n            }\r\n          },\r\n          submenuTitle,\r\n          setSubmenuTitle,\r\n          navigateToSubmenu,\r\n          registerSubmenuContent,\r\n        }}\r\n      >\r\n        <DrawerContent\r\n          data-slot=\"drop-drawer-content\"\r\n          className={cn(\"max-h-[90vh]\", className)}\r\n          {...props}\r\n        >\r\n          {activeSubmenu ? (\r\n            <>\r\n              <DrawerHeader>\r\n                <div className=\"flex items-center gap-2\">\r\n                  <button\r\n                    onClick={goBack}\r\n                    className=\"hover:bg-neutral-100/50 rounded-full p-1 dark:hover:bg-neutral-800/50\"\r\n                  >\r\n                    <ChevronLeftIcon className=\"h-5 w-5\" />\r\n                  </button>\r\n                  <DrawerTitle>{submenuTitle || \"Submenu\"}</DrawerTitle>\r\n                </div>\r\n              </DrawerHeader>\r\n              <div className=\"flex-1 relative overflow-y-auto max-h-[70vh]\">\r\n                {/* Use AnimatePresence to handle exit animations */}\r\n                <AnimatePresence\r\n                  initial={false}\r\n                  mode=\"wait\"\r\n                  custom={animationDirection}\r\n                >\r\n                  <motion.div\r\n                    key={activeSubmenu || \"main\"}\r\n                    custom={animationDirection}\r\n                    variants={variants}\r\n                    initial=\"enter\"\r\n                    animate=\"center\"\r\n                    exit=\"exit\"\r\n                    transition={transition}\r\n                    className=\"pb-6 space-y-1.5 w-full h-full\"\r\n                  >\r\n                    {activeSubmenu\r\n                      ? getSubmenuContent(activeSubmenu)\r\n                      : children}\r\n                  </motion.div>\r\n                </AnimatePresence>\r\n              </div>\r\n            </>\r\n          ) : (\r\n            <>\r\n              <DrawerHeader className=\"sr-only\">\r\n                <DrawerTitle>Menu</DrawerTitle>\r\n              </DrawerHeader>\r\n              <div className=\"overflow-y-auto max-h-[70vh]\">\r\n                <AnimatePresence\r\n                  initial={false}\r\n                  mode=\"wait\"\r\n                  custom={animationDirection}\r\n                >\r\n                  <motion.div\r\n                    key=\"main-menu\"\r\n                    custom={animationDirection}\r\n                    variants={variants}\r\n                    initial=\"enter\"\r\n                    animate=\"center\"\r\n                    exit=\"exit\"\r\n                    transition={transition}\r\n                    className=\"pb-6 space-y-1.5 w-full\"\r\n                  >\r\n                    {children}\r\n                  </motion.div>\r\n                </AnimatePresence>\r\n              </div>\r\n            </>\r\n          )}\r\n        </DrawerContent>\r\n      </SubmenuContext.Provider>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <SubmenuContext.Provider\r\n      value={{\r\n        activeSubmenu,\r\n        setActiveSubmenu,\r\n        submenuTitle,\r\n        setSubmenuTitle,\r\n        registerSubmenuContent,\r\n      }}\r\n    >\r\n      <DropdownMenuContent\r\n        data-slot=\"drop-drawer-content\"\r\n        align=\"end\"\r\n        sideOffset={4}\r\n        className={cn(\r\n          \"max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[220px] overflow-y-auto\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </DropdownMenuContent>\r\n    </SubmenuContext.Provider>\r\n  );\r\n}\r\n\r\nfunction DropDrawerItem({\r\n  className,\r\n  children,\r\n  onSelect,\r\n  onClick,\r\n  icon,\r\n  variant = \"default\",\r\n  inset,\r\n  disabled,\r\n  ...props\r\n}: React.ComponentProps<typeof DropdownMenuItem> & {\r\n  icon?: React.ReactNode;\r\n}) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  // Define hooks outside of conditionals to follow React rules\r\n  // Check if this item is inside a group by looking at parent elements\r\n  const isInGroup = React.useCallback(\r\n    (element: HTMLElement | null): boolean => {\r\n      if (!element) return false;\r\n\r\n      // Check if any parent has a data-drop-drawer-group attribute\r\n      let parent = element.parentElement;\r\n      while (parent) {\r\n        if (parent.hasAttribute(\"data-drop-drawer-group\")) {\r\n          return true;\r\n        }\r\n        parent = parent.parentElement;\r\n      }\r\n      return false;\r\n    },\r\n    [],\r\n  );\r\n\r\n  // Create a ref to check if the item is in a group\r\n  const itemRef = React.useRef<HTMLDivElement>(null);\r\n  const [isInsideGroup, setIsInsideGroup] = React.useState(false);\r\n\r\n  React.useEffect(() => {\r\n    // Only run this effect in mobile mode\r\n    if (!isMobile) return;\r\n\r\n    // Use a short timeout to ensure the DOM is fully rendered\r\n    const timer = setTimeout(() => {\r\n      if (itemRef.current) {\r\n        setIsInsideGroup(isInGroup(itemRef.current));\r\n      }\r\n    }, 0);\r\n\r\n    return () => clearTimeout(timer);\r\n  }, [isInGroup, isMobile]);\r\n\r\n  if (isMobile) {\r\n    const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\r\n      if (disabled) return;\r\n      if (onClick) onClick(e);\r\n      if (onSelect) onSelect(e as unknown as Event);\r\n    };\r\n\r\n    // Only wrap in DrawerClose if it's not a submenu item\r\n    const content = (\r\n      <div\r\n        ref={itemRef}\r\n        data-slot=\"drop-drawer-item\"\r\n        data-variant={variant}\r\n        data-inset={inset}\r\n        data-disabled={disabled}\r\n        className={cn(\r\n          \"flex cursor-pointer items-center justify-between px-4 py-4\",\r\n          // Only apply margin, background and rounded corners if not in a group\r\n          !isInsideGroup &&\r\n            \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-1.5 rounded-md dark:bg-neutral-800 dark:dark:bg-neutral-800\",\r\n          // For items in a group, don't add background but add more padding\r\n          isInsideGroup && \"bg-transparent py-4\",\r\n          inset && \"pl-8\",\r\n          variant === \"destructive\" &&\r\n            \"text-red-500 dark:text-red-500 dark:text-red-900 dark:dark:text-red-900\",\r\n          disabled && \"pointer-events-none opacity-50\",\r\n          className,\r\n        )}\r\n        onClick={handleClick}\r\n        aria-disabled={disabled}\r\n        {...props}\r\n      >\r\n        <div className=\"flex items-center gap-2\">{children}</div>\r\n        {icon && <div className=\"flex-shrink-0\">{icon}</div>}\r\n      </div>\r\n    );\r\n\r\n    // Check if this is inside a submenu\r\n    const isInSubmenu =\r\n      (props as Record<string, unknown>)[\"data-parent-submenu-id\"] ||\r\n      (props as Record<string, unknown>)[\"data-parent-submenu\"];\r\n\r\n    if (isInSubmenu) {\r\n      return content;\r\n    }\r\n\r\n    return <DrawerClose asChild>{content}</DrawerClose>;\r\n  }\r\n\r\n  return (\r\n    <DropdownMenuItem\r\n      data-slot=\"drop-drawer-item\"\r\n      data-variant={variant}\r\n      data-inset={inset}\r\n      className={className}\r\n      onSelect={onSelect}\r\n      onClick={onClick as React.MouseEventHandler<HTMLDivElement>}\r\n      variant={variant}\r\n      inset={inset}\r\n      disabled={disabled}\r\n      {...props}\r\n    >\r\n      <div className=\"flex w-full items-center justify-between\">\r\n        <div>{children}</div>\r\n        {icon && <div>{icon}</div>}\r\n      </div>\r\n    </DropdownMenuItem>\r\n  );\r\n}\r\n\r\nfunction DropDrawerSeparator({\r\n  className,\r\n  ...props\r\n}: React.ComponentProps<typeof DropdownMenuSeparator>) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  // For mobile, render a simple divider\r\n  if (isMobile) {\r\n    return null;\r\n  }\r\n\r\n  // For desktop, use the standard dropdown separator\r\n  return (\r\n    <DropdownMenuSeparator\r\n      data-slot=\"drop-drawer-separator\"\r\n      className={className}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nfunction DropDrawerLabel({\r\n  className,\r\n  children,\r\n  ...props\r\n}:\r\n  | React.ComponentProps<typeof DropdownMenuLabel>\r\n  | React.ComponentProps<typeof DrawerTitle>) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  if (isMobile) {\r\n    return (\r\n      <DrawerHeader className=\"p-0\">\r\n        <DrawerTitle\r\n          data-slot=\"drop-drawer-label\"\r\n          className={cn(\r\n            \"text-neutral-500 px-4 py-2 text-sm font-medium dark:text-neutral-400\",\r\n            className,\r\n          )}\r\n          {...props}\r\n        >\r\n          {children}\r\n        </DrawerTitle>\r\n      </DrawerHeader>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <DropdownMenuLabel\r\n      data-slot=\"drop-drawer-label\"\r\n      className={className}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </DropdownMenuLabel>\r\n  );\r\n}\r\n\r\nfunction DropDrawerFooter({\r\n  className,\r\n  children,\r\n  ...props\r\n}: React.ComponentProps<typeof DrawerFooter> | React.ComponentProps<\"div\">) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  if (isMobile) {\r\n    return (\r\n      <DrawerFooter\r\n        data-slot=\"drop-drawer-footer\"\r\n        className={cn(\"p-4\", className)}\r\n        {...props}\r\n      >\r\n        {children}\r\n      </DrawerFooter>\r\n    );\r\n  }\r\n\r\n  // No direct equivalent in DropdownMenu, so we'll just render a div\r\n  return (\r\n    <div\r\n      data-slot=\"drop-drawer-footer\"\r\n      className={cn(\"p-2\", className)}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction DropDrawerGroup({\r\n  className,\r\n  children,\r\n  ...props\r\n}: React.ComponentProps<\"div\"> & {\r\n  children: React.ReactNode;\r\n}) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  // Add separators between children on mobile\r\n  const childrenWithSeparators = React.useMemo(() => {\r\n    if (!isMobile) return children;\r\n\r\n    const childArray = React.Children.toArray(children);\r\n\r\n    // Filter out any existing separators\r\n    const filteredChildren = childArray.filter(\r\n      (child) =>\r\n        React.isValidElement(child) && child.type !== DropDrawerSeparator,\r\n    );\r\n\r\n    // Add separators between items\r\n    return filteredChildren.flatMap((child, index) => {\r\n      if (index === filteredChildren.length - 1) return [child];\r\n      return [\r\n        child,\r\n        <div\r\n          key={`separator-${index}`}\r\n          className=\"bg-neutral-200 h-px dark:bg-neutral-800\"\r\n          aria-hidden=\"true\"\r\n        />,\r\n      ];\r\n    });\r\n  }, [children, isMobile]);\r\n\r\n  if (isMobile) {\r\n    return (\r\n      <div\r\n        data-drop-drawer-group\r\n        data-slot=\"drop-drawer-group\"\r\n        role=\"group\"\r\n        className={cn(\r\n          \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-3 overflow-hidden rounded-xl dark:bg-neutral-800 dark:dark:bg-neutral-800\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        {childrenWithSeparators}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  // On desktop, use a div with proper role and attributes\r\n  return (\r\n    <div\r\n      data-drop-drawer-group\r\n      data-slot=\"drop-drawer-group\"\r\n      role=\"group\"\r\n      className={className}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </div>\r\n  );\r\n}\r\n\r\n// Context for managing submenu state on mobile\r\ninterface SubmenuContextType {\r\n  activeSubmenu: string | null;\r\n  setActiveSubmenu: (id: string | null) => void;\r\n  submenuTitle: string | null;\r\n  setSubmenuTitle: (title: string | null) => void;\r\n  navigateToSubmenu?: (id: string, title: string) => void;\r\n  registerSubmenuContent?: (id: string, content: React.ReactNode[]) => void;\r\n}\r\n\r\nconst SubmenuContext = React.createContext<SubmenuContextType>({\r\n  activeSubmenu: null,\r\n  setActiveSubmenu: () => {},\r\n  submenuTitle: null,\r\n  setSubmenuTitle: () => {},\r\n  navigateToSubmenu: undefined,\r\n  registerSubmenuContent: undefined,\r\n});\r\n\r\n// Submenu components\r\n// Counter for generating simple numeric IDs\r\nlet submenuIdCounter = 0;\r\n\r\nfunction DropDrawerSub({\r\n  children,\r\n  id,\r\n  ...props\r\n}: React.ComponentProps<typeof DropdownMenuSub> & {\r\n  id?: string;\r\n}) {\r\n  const { isMobile } = useDropDrawerContext();\r\n  const { registerSubmenuContent } = React.useContext(SubmenuContext);\r\n\r\n  // Generate a simple numeric ID instead of using React.useId()\r\n  const [generatedId] = React.useState(() => `submenu-${submenuIdCounter++}`);\r\n  const submenuId = id || generatedId;\r\n\r\n  // Extract submenu content to register with parent\r\n  React.useEffect(() => {\r\n    if (!registerSubmenuContent) return;\r\n\r\n    // Find the SubContent within this Sub\r\n    const contentItems: React.ReactNode[] = [];\r\n    React.Children.forEach(children, (child) => {\r\n      if (React.isValidElement(child) && child.type === DropDrawerSubContent) {\r\n        // Add all children of the SubContent to the result\r\n        React.Children.forEach(\r\n          (child.props as { children?: React.ReactNode }).children,\r\n          (contentChild) => {\r\n            contentItems.push(contentChild);\r\n          },\r\n        );\r\n      }\r\n    });\r\n\r\n    // Register the content with the parent\r\n    if (contentItems.length > 0) {\r\n      registerSubmenuContent(submenuId, contentItems);\r\n    }\r\n  }, [children, registerSubmenuContent, submenuId]);\r\n\r\n  if (isMobile) {\r\n    // For mobile, we'll use the context to manage submenu state\r\n    // Process children to pass the submenu ID to the trigger and content\r\n    const processedChildren = React.Children.map(children, (child) => {\r\n      if (!React.isValidElement(child)) return child;\r\n\r\n      if (child.type === DropDrawerSubTrigger) {\r\n        return React.cloneElement(\r\n          child as React.ReactElement,\r\n          {\r\n            ...(child.props as object),\r\n            \"data-parent-submenu-id\": submenuId,\r\n            \"data-submenu-id\": submenuId,\r\n            // Use only data attributes, not custom props\r\n            \"data-parent-submenu\": submenuId,\r\n          } as React.HTMLAttributes<HTMLElement>,\r\n        );\r\n      }\r\n\r\n      if (child.type === DropDrawerSubContent) {\r\n        return React.cloneElement(\r\n          child as React.ReactElement,\r\n          {\r\n            ...(child.props as object),\r\n            \"data-parent-submenu-id\": submenuId,\r\n            \"data-submenu-id\": submenuId,\r\n            // Use only data attributes, not custom props\r\n            \"data-parent-submenu\": submenuId,\r\n          } as React.HTMLAttributes<HTMLElement>,\r\n        );\r\n      }\r\n\r\n      return child;\r\n    });\r\n\r\n    return (\r\n      <div\r\n        data-slot=\"drop-drawer-sub\"\r\n        data-submenu-id={submenuId}\r\n        id={submenuId}\r\n      >\r\n        {processedChildren}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  // For desktop, pass the generated ID to the DropdownMenuSub\r\n  return (\r\n    <DropdownMenuSub\r\n      data-slot=\"drop-drawer-sub\"\r\n      data-submenu-id={submenuId}\r\n      // Don't pass id to DropdownMenuSub as it doesn't accept this prop\r\n      {...props}\r\n    >\r\n      {children}\r\n    </DropdownMenuSub>\r\n  );\r\n}\r\n\r\nfunction DropDrawerSubTrigger({\r\n  className,\r\n  inset,\r\n  children,\r\n  ...props\r\n}: React.ComponentProps<typeof DropdownMenuSubTrigger> & {\r\n  icon?: React.ReactNode;\r\n}) {\r\n  const { isMobile } = useDropDrawerContext();\r\n  const { navigateToSubmenu } = React.useContext(SubmenuContext);\r\n\r\n  // Define hooks outside of conditionals to follow React rules\r\n  // Check if this item is inside a group by looking at parent elements\r\n  const isInGroup = React.useCallback(\r\n    (element: HTMLElement | null): boolean => {\r\n      if (!element) return false;\r\n\r\n      // Check if any parent has a data-drop-drawer-group attribute\r\n      let parent = element.parentElement;\r\n      while (parent) {\r\n        if (parent.hasAttribute(\"data-drop-drawer-group\")) {\r\n          return true;\r\n        }\r\n        parent = parent.parentElement;\r\n      }\r\n      return false;\r\n    },\r\n    [],\r\n  );\r\n\r\n  // Create a ref to check if the item is in a group\r\n  const itemRef = React.useRef<HTMLDivElement>(null);\r\n  const [isInsideGroup, setIsInsideGroup] = React.useState(false);\r\n\r\n  React.useEffect(() => {\r\n    // Only run this effect in mobile mode\r\n    if (!isMobile) return;\r\n\r\n    // Use a short timeout to ensure the DOM is fully rendered\r\n    const timer = setTimeout(() => {\r\n      if (itemRef.current) {\r\n        setIsInsideGroup(isInGroup(itemRef.current));\r\n      }\r\n    }, 0);\r\n\r\n    return () => clearTimeout(timer);\r\n  }, [isInGroup, isMobile]);\r\n\r\n  if (isMobile) {\r\n    // Find the parent submenu ID\r\n    const handleClick = (e: React.MouseEvent) => {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n\r\n      // Get the closest parent with data-submenu-id attribute\r\n      const element = e.currentTarget as HTMLElement;\r\n      let submenuId: string | null = null;\r\n\r\n      // First check if the element itself has the data attribute\r\n      if (element.closest(\"[data-submenu-id]\")) {\r\n        const closestElement = element.closest(\"[data-submenu-id]\");\r\n        const id = closestElement?.getAttribute(\"data-submenu-id\");\r\n        if (id) {\r\n          submenuId = id;\r\n        }\r\n      }\r\n\r\n      // If not found, try props\r\n      if (!submenuId) {\r\n        submenuId =\r\n          ((props as Record<string, unknown>)[\r\n            \"data-parent-submenu-id\"\r\n          ] as string) ||\r\n          ((props as Record<string, unknown>)[\"data-parent-submenu\"] as string);\r\n      }\r\n\r\n      if (!submenuId) {\r\n        return;\r\n      }\r\n\r\n      // Get the title\r\n      const title = typeof children === \"string\" ? children : \"Submenu\";\r\n\r\n      // Navigate to the submenu\r\n      if (navigateToSubmenu) {\r\n        navigateToSubmenu(submenuId, title);\r\n      }\r\n    };\r\n\r\n    // Combine onClick handlers\r\n    const combinedOnClick = (e: React.MouseEvent) => {\r\n      // Call the original onClick if provided\r\n      const typedProps = props as Record<string, unknown>;\r\n      if (typedProps[\"onClick\"]) {\r\n        const originalOnClick = typedProps[\r\n          \"onClick\"\r\n        ] as React.MouseEventHandler<HTMLDivElement>;\r\n        originalOnClick(e as React.MouseEvent<HTMLDivElement>);\r\n      }\r\n\r\n      // Call our navigation handler\r\n      handleClick(e);\r\n    };\r\n\r\n    // Remove onClick from props to avoid duplicate handlers\r\n    const { ...restProps } = props as Record<string, unknown>;\r\n\r\n    // Don't wrap in DrawerClose for submenu triggers\r\n    return (\r\n      <div\r\n        ref={itemRef}\r\n        data-slot=\"drop-drawer-sub-trigger\"\r\n        data-inset={inset}\r\n        className={cn(\r\n          \"flex cursor-pointer items-center justify-between px-4 py-4\",\r\n          // Only apply margin, background and rounded corners if not in a group\r\n          !isInsideGroup &&\r\n            \"bg-neutral-100 dark:bg-neutral-100 mx-2 my-1.5 rounded-md dark:bg-neutral-800 dark:dark:bg-neutral-800\",\r\n          // For items in a group, don't add background but add more padding\r\n          isInsideGroup && \"bg-transparent py-4\",\r\n          inset && \"pl-8\",\r\n          className,\r\n        )}\r\n        onClick={combinedOnClick}\r\n        {...restProps}\r\n      >\r\n        <div className=\"flex items-center gap-2\">{children}</div>\r\n        <ChevronRightIcon className=\"h-5 w-5\" />\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <DropdownMenuSubTrigger\r\n      data-slot=\"drop-drawer-sub-trigger\"\r\n      data-inset={inset}\r\n      className={className}\r\n      inset={inset}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </DropdownMenuSubTrigger>\r\n  );\r\n}\r\n\r\nfunction DropDrawerSubContent({\r\n  className,\r\n  sideOffset = 4,\r\n  children,\r\n  ...props\r\n}: React.ComponentProps<typeof DropdownMenuSubContent>) {\r\n  const { isMobile } = useDropDrawerContext();\r\n\r\n  if (isMobile) {\r\n    // For mobile, we don't render the content directly\r\n    // It will be rendered by the DropDrawerContent component when active\r\n    return null;\r\n  }\r\n\r\n  return (\r\n    <DropdownMenuSubContent\r\n      data-slot=\"drop-drawer-sub-content\"\r\n      sideOffset={sideOffset}\r\n      className={cn(\r\n        \"z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 p-1 shadow-lg dark:border-neutral-800\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </DropdownMenuSubContent>\r\n  );\r\n}\r\n\r\nexport {\r\n  DropDrawer,\r\n  DropDrawerContent,\r\n  DropDrawerFooter,\r\n  DropDrawerGroup,\r\n  DropDrawerItem,\r\n  DropDrawerLabel,\r\n  DropDrawerSeparator,\r\n  DropDrawerSub,\r\n  DropDrawerSubContent,\r\n  DropDrawerSubTrigger,\r\n  DropDrawerTrigger,\r\n};\r\n"],"names":["DropDrawerContext","React","useDropDrawerContext","context","Error","DropDrawer","children","props","isMobile","useIsMobile","DropdownComponent","Drawer","DropdownMenu","DropDrawerTrigger","className","TriggerComponent","DrawerTrigger","DropdownMenuTrigger","DropDrawerContent","activeSubmenu","setActiveSubmenu","submenuTitle","setSubmenuTitle","submenuStack","setSubmenuStack","animationDirection","setAnimationDirection","submenuContentRef","Map","navigateToSubmenu","id","title","prev","goBack","newStack","previous","registerSubmenuContent","content","extractSubmenuContent","elements","targetId","result","findSubmenuContent","node","element","DropDrawerSub","elementId","dataSubmenuId","child","DropDrawerSubContent","subContentProps","contentChild","Array","getSubmenuContent","cachedContent","submenuContent","variants","direction","transition","SubmenuContext","DrawerContent","cn","DrawerHeader","ChevronLeftIcon","DrawerTitle","AnimatePresence","motion","DropdownMenuContent","DropDrawerItem","onSelect","onClick","icon","variant","inset","disabled","isInGroup","parent","itemRef","isInsideGroup","setIsInsideGroup","timer","setTimeout","clearTimeout","handleClick","e","isInSubmenu","DrawerClose","DropdownMenuItem","DropDrawerSeparator","DropdownMenuSeparator","DropDrawerLabel","DropdownMenuLabel","DropDrawerFooter","DrawerFooter","DropDrawerGroup","childrenWithSeparators","childArray","filteredChildren","index","undefined","submenuIdCounter","generatedId","submenuId","contentItems","processedChildren","DropDrawerSubTrigger","DropdownMenuSub","closestElement","combinedOnClick","typedProps","originalOnClick","restProps","ChevronRightIcon","DropdownMenuSubTrigger","sideOffset","DropdownMenuSubContent"],"mappings":"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"}

package/dist/esm/components/ui/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\input.js","sources":["webpack://@arolariu/components/./src/components/ui/input.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"file:text-neutral-950 placeholder:text-neutral-500 selection:bg-neutral-900 selection:text-neutral-50 dark:bg-neutral-200/30 border-neutral-200 flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:selection:bg-neutral-50 dark:selection:text-neutral-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800\",\n        \"focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50\",\n        \"aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"names":["Input","className","type","props","cn"],"mappings":";;;;AAKA,SAASA,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAE,GAAGC,OAAsC;IACzE,OAAO,WAAP,GACE,IAAC;QACC,MAAMD;QACN,aAAU;QACV,WAAWE,GACT,onBACA,4KACA,wMACAH;QAED,GAAGE,KAAK;;AAGf"}
+{"version":3,"file":"components\\ui\\input.js","sources":["webpack://@arolariu/components/./src/components/ui/input.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\n\r\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\r\n  return (\r\n    <input\r\n      type={type}\r\n      data-slot=\"input\"\r\n      className={cn(\r\n        \"file:text-neutral-950 placeholder:text-neutral-500 selection:bg-neutral-900 selection:text-neutral-50 dark:bg-neutral-200/30 border-neutral-200 flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:file:text-neutral-50 dark:placeholder:text-neutral-400 dark:selection:bg-neutral-50 dark:selection:text-neutral-900 dark:dark:bg-neutral-800/30 dark:border-neutral-800\",\r\n        \"focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 focus-visible:ring-[3px] dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50\",\r\n        \"aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport { Input };\r\n"],"names":["Input","className","type","props","cn"],"mappings":";;;;AAKA,SAASA,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAE,GAAGC,OAAsC;IACzE,OAAO,WAAP,GACE,IAAC;QACC,MAAMD;QACN,aAAU;QACV,WAAWE,GACT,onBACA,4KACA,wMACAH;QAED,GAAGE,KAAK;;AAGf"}

package/dist/esm/components/ui/ripple-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { type HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface Ripple {\n  id: number;\n  x: number;\n  y: number;\n}\n\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\n  children: React.ReactNode;\n  rippleClassName?: string;\n  scale?: number;\n  transition?: Transition;\n}\n\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\n  (\n    {\n      children,\n      onClick,\n      className,\n      rippleClassName,\n      scale = 10,\n      transition = { duration: 0.6, ease: \"easeOut\" },\n      ...props\n    },\n    ref,\n  ) => {\n    const [ripples, setRipples] = React.useState<Ripple[]>([]);\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\n    React.useImperativeHandle(\n      ref,\n      () => buttonRef.current as HTMLButtonElement,\n    );\n\n    const createRipple = React.useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        const button = buttonRef.current;\n        if (!button) return;\n\n        const rect = button.getBoundingClientRect();\n        const x = event.clientX - rect.left;\n        const y = event.clientY - rect.top;\n\n        const newRipple: Ripple = {\n          id: Date.now(),\n          x,\n          y,\n        };\n\n        setRipples((prev) => [...prev, newRipple]);\n\n        setTimeout(() => {\n          setRipples((prev) => prev.filter((r) => r.id !== newRipple.id));\n        }, 600);\n      },\n      [],\n    );\n\n    const handleClick = React.useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        createRipple(event);\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [createRipple, onClick],\n    );\n\n    return (\n      <motion.button\n        ref={buttonRef}\n        onClick={handleClick}\n        whileTap={{ scale: 0.95 }}\n        whileHover={{ scale: 1.05 }}\n        className={cn(\n          \"relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {ripples.map((ripple) => (\n          <motion.span\n            key={ripple.id}\n            initial={{ scale: 0, opacity: 0.5 }}\n            animate={{ scale, opacity: 0 }}\n            transition={transition}\n            className={cn(\n              \"absolute bg-primary-foreground rounded-full size-5 pointer-events-none\",\n              rippleClassName,\n            )}\n            style={{\n              top: ripple.y - 10,\n              left: ripple.x - 10,\n            }}\n          />\n        ))}\n      </motion.button>\n    );\n  },\n);\n\nRippleButton.displayName = \"RippleButton\";\n\nexport { RippleButton, type RippleButtonProps };\n"],"names":["RippleButton","React","children","onClick","className","rippleClassName","scale","transition","props","ref","ripples","setRipples","buttonRef","createRipple","event","button","rect","x","y","newRipple","Date","prev","setTimeout","r","handleClick","motion","cn","ripple"],"mappings":";;;;;AAoBA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CACE,EACEC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,eAAe,EACfC,QAAQ,EAAE,EACVC,aAAa;IAAE,UAAU;IAAK,MAAM;AAAU,CAAC,EAC/C,GAAGC,OACJ,EACDC;IAEA,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAyB,EAAE;IACzD,MAAMW,YAAYX,OAAgC;IAClDA,oBACEQ,KACA,IAAMG,UAAU,OAAO;IAGzB,MAAMC,eAAeZ,YACnB,CAACa;QACC,MAAMC,SAASH,UAAU,OAAO;QAChC,IAAI,CAACG,QAAQ;QAEb,MAAMC,OAAOD,OAAO,qBAAqB;QACzC,MAAME,IAAIH,MAAM,OAAO,GAAGE,KAAK,IAAI;QACnC,MAAME,IAAIJ,MAAM,OAAO,GAAGE,KAAK,GAAG;QAElC,MAAMG,YAAoB;YACxB,IAAIC,KAAK,GAAG;YACZH;YACAC;QACF;QAEAP,WAAW,CAACU,OAAS;mBAAIA;gBAAMF;aAAU;QAEzCG,WAAW;YACTX,WAAW,CAACU,OAASA,KAAK,MAAM,CAAC,CAACE,IAAMA,EAAE,EAAE,KAAKJ,UAAU,EAAE;QAC/D,GAAG;IACL,GACA,EAAE;IAGJ,MAAMK,cAAcvB,YAClB,CAACa;QACCD,aAAaC;QACb,IAAIX,SACFA,QAAQW;IAEZ,GACA;QAACD;QAAcV;KAAQ;IAGzB,OAAO,WAAP,GACE,KAACsB,OAAO,MAAM;QACZ,KAAKb;QACL,SAASY;QACT,UAAU;YAAE,OAAO;QAAK;QACxB,YAAY;YAAE,OAAO;QAAK;QAC1B,WAAWE,GACT,+IACAtB;QAED,GAAGI,KAAK;;YAERN;YACAQ,QAAQ,GAAG,CAAC,CAACiB,SAAAA,WAAAA,GACZ,IAACF,OAAO,IAAI;oBAEV,SAAS;wBAAE,OAAO;wBAAG,SAAS;oBAAI;oBAClC,SAAS;wBAAEnB;wBAAO,SAAS;oBAAE;oBAC7B,YAAYC;oBACZ,WAAWmB,GACT,0EACArB;oBAEF,OAAO;wBACL,KAAKsB,OAAO,CAAC,GAAG;wBAChB,MAAMA,OAAO,CAAC,GAAG;oBACnB;mBAXKA,OAAO,EAAE;;;AAgBxB;AAGF3B,aAAa,WAAW,GAAG"}
+{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\r\n\r\nimport * as React from \"react\";\r\nimport { type HTMLMotionProps, motion, type Transition } from \"motion/react\";\r\n\r\nimport { cn } from \"@/lib/utils\";\r\n\r\ninterface Ripple {\r\n  id: number;\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\r\n  children: React.ReactNode;\r\n  rippleClassName?: string;\r\n  scale?: number;\r\n  transition?: Transition;\r\n}\r\n\r\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\r\n  (\r\n    {\r\n      children,\r\n      onClick,\r\n      className,\r\n      rippleClassName,\r\n      scale = 10,\r\n      transition = { duration: 0.6, ease: \"easeOut\" },\r\n      ...props\r\n    },\r\n    ref,\r\n  ) => {\r\n    const [ripples, setRipples] = React.useState<Ripple[]>([]);\r\n    const buttonRef = React.useRef<HTMLButtonElement>(null);\r\n    React.useImperativeHandle(\r\n      ref,\r\n      () => buttonRef.current as HTMLButtonElement,\r\n    );\r\n\r\n    const createRipple = React.useCallback(\r\n      (event: React.MouseEvent<HTMLButtonElement>) => {\r\n        const button = buttonRef.current;\r\n        if (!button) return;\r\n\r\n        const rect = button.getBoundingClientRect();\r\n        const x = event.clientX - rect.left;\r\n        const y = event.clientY - rect.top;\r\n\r\n        const newRipple: Ripple = {\r\n          id: Date.now(),\r\n          x,\r\n          y,\r\n        };\r\n\r\n        setRipples((prev) => [...prev, newRipple]);\r\n\r\n        setTimeout(() => {\r\n          setRipples((prev) => prev.filter((r) => r.id !== newRipple.id));\r\n        }, 600);\r\n      },\r\n      [],\r\n    );\r\n\r\n    const handleClick = React.useCallback(\r\n      (event: React.MouseEvent<HTMLButtonElement>) => {\r\n        createRipple(event);\r\n        if (onClick) {\r\n          onClick(event);\r\n        }\r\n      },\r\n      [createRipple, onClick],\r\n    );\r\n\r\n    return (\r\n      <motion.button\r\n        ref={buttonRef}\r\n        onClick={handleClick}\r\n        whileTap={{ scale: 0.95 }}\r\n        whileHover={{ scale: 1.05 }}\r\n        className={cn(\r\n          \"relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none\",\r\n          className,\r\n        )}\r\n        {...props}\r\n      >\r\n        {children}\r\n        {ripples.map((ripple) => (\r\n          <motion.span\r\n            key={ripple.id}\r\n            initial={{ scale: 0, opacity: 0.5 }}\r\n            animate={{ scale, opacity: 0 }}\r\n            transition={transition}\r\n            className={cn(\r\n              \"absolute bg-primary-foreground rounded-full size-5 pointer-events-none\",\r\n              rippleClassName,\r\n            )}\r\n            style={{\r\n              top: ripple.y - 10,\r\n              left: ripple.x - 10,\r\n            }}\r\n          />\r\n        ))}\r\n      </motion.button>\r\n    );\r\n  },\r\n);\r\n\r\nRippleButton.displayName = \"RippleButton\";\r\n\r\nexport { RippleButton, type RippleButtonProps };\r\n"],"names":["RippleButton","React","children","onClick","className","rippleClassName","scale","transition","props","ref","ripples","setRipples","buttonRef","createRipple","event","button","rect","x","y","newRipple","Date","prev","setTimeout","r","handleClick","motion","cn","ripple"],"mappings":";;;;;AAoBA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CACE,EACEC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,eAAe,EACfC,QAAQ,EAAE,EACVC,aAAa;IAAE,UAAU;IAAK,MAAM;AAAU,CAAC,EAC/C,GAAGC,OACJ,EACDC;IAEA,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAyB,EAAE;IACzD,MAAMW,YAAYX,OAAgC;IAClDA,oBACEQ,KACA,IAAMG,UAAU,OAAO;IAGzB,MAAMC,eAAeZ,YACnB,CAACa;QACC,MAAMC,SAASH,UAAU,OAAO;QAChC,IAAI,CAACG,QAAQ;QAEb,MAAMC,OAAOD,OAAO,qBAAqB;QACzC,MAAME,IAAIH,MAAM,OAAO,GAAGE,KAAK,IAAI;QACnC,MAAME,IAAIJ,MAAM,OAAO,GAAGE,KAAK,GAAG;QAElC,MAAMG,YAAoB;YACxB,IAAIC,KAAK,GAAG;YACZH;YACAC;QACF;QAEAP,WAAW,CAACU,OAAS;mBAAIA;gBAAMF;aAAU;QAEzCG,WAAW;YACTX,WAAW,CAACU,OAASA,KAAK,MAAM,CAAC,CAACE,IAAMA,EAAE,EAAE,KAAKJ,UAAU,EAAE;QAC/D,GAAG;IACL,GACA,EAAE;IAGJ,MAAMK,cAAcvB,YAClB,CAACa;QACCD,aAAaC;QACb,IAAIX,SACFA,QAAQW;IAEZ,GACA;QAACD;QAAcV;KAAQ;IAGzB,OAAO,WAAP,GACE,KAACsB,OAAO,MAAM;QACZ,KAAKb;QACL,SAASY;QACT,UAAU;YAAE,OAAO;QAAK;QACxB,YAAY;YAAE,OAAO;QAAK;QAC1B,WAAWE,GACT,+IACAtB;QAED,GAAGI,KAAK;;YAERN;YACAQ,QAAQ,GAAG,CAAC,CAACiB,SAAAA,WAAAA,GACZ,IAACF,OAAO,IAAI;oBAEV,SAAS;wBAAE,OAAO;wBAAG,SAAS;oBAAI;oBAClC,SAAS;wBAAEnB;wBAAO,SAAS;oBAAE;oBAC7B,YAAYC;oBACZ,WAAWmB,GACT,0EACArB;oBAEF,OAAO;wBACL,KAAKsB,OAAO,CAAC,GAAG;wBAChB,MAAMA,OAAO,CAAC,GAAG;oBACnB;mBAXKA,OAAO,EAAE;;;AAgBxB;AAGF3B,aAAa,WAAW,GAAG"}

package/dist/esm/components/ui/scratcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\n\nimport { cn } from \"@/lib/utils\";\nimport { motion, useAnimation } from \"motion/react\";\nimport React, { useEffect, useRef, useState } from \"react\";\n\ninterface ScratcherProps {\n  children: React.ReactNode;\n  width: number;\n  height: number;\n  minScratchPercentage?: number;\n  className?: string;\n  onComplete?: () => void;\n  gradientColors?: [string, string, string];\n}\n\nexport const Scratcher: React.FC<ScratcherProps> = ({\n  width,\n  height,\n  minScratchPercentage = 50,\n  onComplete,\n  children,\n  className,\n  gradientColors = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"],\n}) => {\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n  const [isScratching, setIsScratching] = useState(false);\n  const [isComplete, setIsComplete] = useState(false);\n\n  const controls = useAnimation();\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      ctx.fillStyle = \"#ccc\";\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n      const gradient = ctx.createLinearGradient(\n        0,\n        0,\n        canvas.width,\n        canvas.height,\n      );\n      gradient.addColorStop(0, gradientColors[0]);\n      gradient.addColorStop(0.5, gradientColors[1]);\n      gradient.addColorStop(1, gradientColors[2]);\n      ctx.fillStyle = gradient;\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\n    }\n  }, [gradientColors]);\n\n  useEffect(() => {\n    const handleDocumentMouseMove = (event: MouseEvent) => {\n      if (!isScratching) return;\n      scratch(event.clientX, event.clientY);\n    };\n\n    const handleDocumentTouchMove = (event: TouchEvent) => {\n      if (!isScratching) return;\n      const touch = event.touches[0];\n      scratch(touch.clientX, touch.clientY);\n    };\n\n    const handleDocumentMouseUp = () => {\n      setIsScratching(false);\n      checkCompletion();\n    };\n\n    const handleDocumentTouchEnd = () => {\n      setIsScratching(false);\n      checkCompletion();\n    };\n\n    document.addEventListener(\"mousedown\", handleDocumentMouseMove);\n    document.addEventListener(\"mousemove\", handleDocumentMouseMove);\n    document.addEventListener(\"touchstart\", handleDocumentTouchMove);\n    document.addEventListener(\"touchmove\", handleDocumentTouchMove);\n    document.addEventListener(\"mouseup\", handleDocumentMouseUp);\n    document.addEventListener(\"touchend\", handleDocumentTouchEnd);\n    document.addEventListener(\"touchcancel\", handleDocumentTouchEnd);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleDocumentMouseMove);\n      document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\n      document.removeEventListener(\"touchstart\", handleDocumentTouchMove);\n      document.removeEventListener(\"touchmove\", handleDocumentTouchMove);\n      document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\n      document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\n      document.removeEventListener(\"touchcancel\", handleDocumentTouchEnd);\n    };\n  }, [isScratching]);\n\n  const handleMouseDown = () => setIsScratching(true);\n\n  const handleTouchStart = () => setIsScratching(true);\n\n  const scratch = (clientX: number, clientY: number) => {\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      const rect = canvas.getBoundingClientRect();\n      const x = clientX - rect.left + 16;\n      const y = clientY - rect.top + 16;\n      ctx.globalCompositeOperation = \"destination-out\";\n      ctx.beginPath();\n      ctx.arc(x, y, 30, 0, Math.PI * 2);\n      ctx.fill();\n    }\n  };\n\n  const startAnimation = async () => {\n    await controls.start({\n      scale: [1, 1.5, 1],\n      rotate: [0, 10, -10, 10, -10, 0],\n      transition: { duration: 0.5 },\n    });\n\n    // Call onComplete after animation finishes\n    if (onComplete) {\n      onComplete();\n    }\n  };\n\n  const checkCompletion = () => {\n    if (isComplete) return;\n\n    const canvas = canvasRef.current;\n    const ctx = canvas?.getContext(\"2d\");\n    if (canvas && ctx) {\n      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\n      const pixels = imageData.data;\n      const totalPixels = pixels.length / 4;\n      let clearPixels = 0;\n\n      for (let i = 3; i < pixels.length; i += 4) {\n        if (pixels[i] === 0) clearPixels++;\n      }\n\n      const percentage = (clearPixels / totalPixels) * 100;\n\n      if (percentage >= minScratchPercentage) {\n        setIsComplete(true);\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\n        startAnimation();\n      }\n    }\n  };\n\n  return (\n    <motion.div\n      className={cn(\"relative select-none\", className)}\n      style={{\n        width,\n        height,\n        cursor:\n          \"url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto\",\n      }}\n      animate={controls}\n    >\n      <canvas\n        ref={canvasRef}\n        width={width}\n        height={height}\n        className=\"absolute left-0 top-0\"\n        onMouseDown={handleMouseDown}\n        onTouchStart={handleTouchStart}\n      ></canvas>\n      {children}\n    </motion.div>\n  );\n};\n"],"names":["Scratcher","width","height","minScratchPercentage","onComplete","children","className","gradientColors","canvasRef","useRef","isScratching","setIsScratching","useState","isComplete","setIsComplete","controls","useAnimation","useEffect","canvas","ctx","gradient","handleDocumentMouseMove","event","scratch","handleDocumentTouchMove","touch","handleDocumentMouseUp","checkCompletion","handleDocumentTouchEnd","document","handleMouseDown","handleTouchStart","clientX","clientY","rect","x","y","Math","startAnimation","imageData","pixels","totalPixels","clearPixels","i","percentage","motion","cn"],"mappings":"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"}
+{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\r\n\r\nimport { cn } from \"@/lib/utils\";\r\nimport { motion, useAnimation } from \"motion/react\";\r\nimport React, { useEffect, useRef, useState } from \"react\";\r\n\r\ninterface ScratcherProps {\r\n  children: React.ReactNode;\r\n  width: number;\r\n  height: number;\r\n  minScratchPercentage?: number;\r\n  className?: string;\r\n  onComplete?: () => void;\r\n  gradientColors?: [string, string, string];\r\n}\r\n\r\nexport const Scratcher: React.FC<ScratcherProps> = ({\r\n  width,\r\n  height,\r\n  minScratchPercentage = 50,\r\n  onComplete,\r\n  children,\r\n  className,\r\n  gradientColors = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"],\r\n}) => {\r\n  const canvasRef = useRef<HTMLCanvasElement>(null);\r\n  const [isScratching, setIsScratching] = useState(false);\r\n  const [isComplete, setIsComplete] = useState(false);\r\n\r\n  const controls = useAnimation();\r\n\r\n  useEffect(() => {\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      ctx.fillStyle = \"#ccc\";\r\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n      const gradient = ctx.createLinearGradient(\r\n        0,\r\n        0,\r\n        canvas.width,\r\n        canvas.height,\r\n      );\r\n      gradient.addColorStop(0, gradientColors[0]);\r\n      gradient.addColorStop(0.5, gradientColors[1]);\r\n      gradient.addColorStop(1, gradientColors[2]);\r\n      ctx.fillStyle = gradient;\r\n      ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n    }\r\n  }, [gradientColors]);\r\n\r\n  useEffect(() => {\r\n    const handleDocumentMouseMove = (event: MouseEvent) => {\r\n      if (!isScratching) return;\r\n      scratch(event.clientX, event.clientY);\r\n    };\r\n\r\n    const handleDocumentTouchMove = (event: TouchEvent) => {\r\n      if (!isScratching) return;\r\n      const touch = event.touches[0];\r\n      scratch(touch.clientX, touch.clientY);\r\n    };\r\n\r\n    const handleDocumentMouseUp = () => {\r\n      setIsScratching(false);\r\n      checkCompletion();\r\n    };\r\n\r\n    const handleDocumentTouchEnd = () => {\r\n      setIsScratching(false);\r\n      checkCompletion();\r\n    };\r\n\r\n    document.addEventListener(\"mousedown\", handleDocumentMouseMove);\r\n    document.addEventListener(\"mousemove\", handleDocumentMouseMove);\r\n    document.addEventListener(\"touchstart\", handleDocumentTouchMove);\r\n    document.addEventListener(\"touchmove\", handleDocumentTouchMove);\r\n    document.addEventListener(\"mouseup\", handleDocumentMouseUp);\r\n    document.addEventListener(\"touchend\", handleDocumentTouchEnd);\r\n    document.addEventListener(\"touchcancel\", handleDocumentTouchEnd);\r\n\r\n    return () => {\r\n      document.removeEventListener(\"mousedown\", handleDocumentMouseMove);\r\n      document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\r\n      document.removeEventListener(\"touchstart\", handleDocumentTouchMove);\r\n      document.removeEventListener(\"touchmove\", handleDocumentTouchMove);\r\n      document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\r\n      document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\r\n      document.removeEventListener(\"touchcancel\", handleDocumentTouchEnd);\r\n    };\r\n  }, [isScratching]);\r\n\r\n  const handleMouseDown = () => setIsScratching(true);\r\n\r\n  const handleTouchStart = () => setIsScratching(true);\r\n\r\n  const scratch = (clientX: number, clientY: number) => {\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      const rect = canvas.getBoundingClientRect();\r\n      const x = clientX - rect.left + 16;\r\n      const y = clientY - rect.top + 16;\r\n      ctx.globalCompositeOperation = \"destination-out\";\r\n      ctx.beginPath();\r\n      ctx.arc(x, y, 30, 0, Math.PI * 2);\r\n      ctx.fill();\r\n    }\r\n  };\r\n\r\n  const startAnimation = async () => {\r\n    await controls.start({\r\n      scale: [1, 1.5, 1],\r\n      rotate: [0, 10, -10, 10, -10, 0],\r\n      transition: { duration: 0.5 },\r\n    });\r\n\r\n    // Call onComplete after animation finishes\r\n    if (onComplete) {\r\n      onComplete();\r\n    }\r\n  };\r\n\r\n  const checkCompletion = () => {\r\n    if (isComplete) return;\r\n\r\n    const canvas = canvasRef.current;\r\n    const ctx = canvas?.getContext(\"2d\");\r\n    if (canvas && ctx) {\r\n      const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\r\n      const pixels = imageData.data;\r\n      const totalPixels = pixels.length / 4;\r\n      let clearPixels = 0;\r\n\r\n      for (let i = 3; i < pixels.length; i += 4) {\r\n        if (pixels[i] === 0) clearPixels++;\r\n      }\r\n\r\n      const percentage = (clearPixels / totalPixels) * 100;\r\n\r\n      if (percentage >= minScratchPercentage) {\r\n        setIsComplete(true);\r\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n        startAnimation();\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <motion.div\r\n      className={cn(\"relative select-none\", className)}\r\n      style={{\r\n        width,\r\n        height,\r\n        cursor:\r\n          \"url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto\",\r\n      }}\r\n      animate={controls}\r\n    >\r\n      <canvas\r\n        ref={canvasRef}\r\n        width={width}\r\n        height={height}\r\n        className=\"absolute left-0 top-0\"\r\n        onMouseDown={handleMouseDown}\r\n        onTouchStart={handleTouchStart}\r\n      ></canvas>\r\n      {children}\r\n    </motion.div>\r\n  );\r\n};\r\n"],"names":["Scratcher","width","height","minScratchPercentage","onComplete","children","className","gradientColors","canvasRef","useRef","isScratching","setIsScratching","useState","isComplete","setIsComplete","controls","useAnimation","useEffect","canvas","ctx","gradient","handleDocumentMouseMove","event","scratch","handleDocumentTouchMove","touch","handleDocumentMouseUp","checkCompletion","handleDocumentTouchEnd","document","handleMouseDown","handleTouchStart","clientX","clientY","rect","x","y","Math","startAnimation","imageData","pixels","totalPixels","clearPixels","i","percentage","motion","cn"],"mappings":";;;;;AAgBO,MAAMA,YAAsC,CAAC,EAClDC,KAAK,EACLC,MAAM,EACNC,uBAAuB,EAAE,EACzBC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACTC,iBAAiB;IAAC;IAAW;IAAW;CAAU,EACnD;IACC,MAAMC,YAAYC,OAA0B;IAC5C,MAAM,CAACC,cAAcC,gBAAgB,GAAGC,SAAS;IACjD,MAAM,CAACC,YAAYC,cAAc,GAAGF,SAAS;IAE7C,MAAMG,WAAWC;IAEjBC,UAAU;QACR,MAAMC,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjBA,IAAI,SAAS,GAAG;YAChBA,IAAI,QAAQ,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;YAC9C,MAAME,WAAWD,IAAI,oBAAoB,CACvC,GACA,GACAD,OAAO,KAAK,EACZA,OAAO,MAAM;YAEfE,SAAS,YAAY,CAAC,GAAGb,cAAc,CAAC,EAAE;YAC1Ca,SAAS,YAAY,CAAC,KAAKb,cAAc,CAAC,EAAE;YAC5Ca,SAAS,YAAY,CAAC,GAAGb,cAAc,CAAC,EAAE;YAC1CY,IAAI,SAAS,GAAGC;YAChBD,IAAI,QAAQ,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;QAChD;IACF,GAAG;QAACX;KAAe;IAEnBU,UAAU;QACR,MAAMI,0BAA0B,CAACC;YAC/B,IAAI,CAACZ,cAAc;YACnBa,QAAQD,MAAM,OAAO,EAAEA,MAAM,OAAO;QACtC;QAEA,MAAME,0BAA0B,CAACF;YAC/B,IAAI,CAACZ,cAAc;YACnB,MAAMe,QAAQH,MAAM,OAAO,CAAC,EAAE;YAC9BC,QAAQE,MAAM,OAAO,EAAEA,MAAM,OAAO;QACtC;QAEA,MAAMC,wBAAwB;YAC5Bf,gBAAgB;YAChBgB;QACF;QAEA,MAAMC,yBAAyB;YAC7BjB,gBAAgB;YAChBgB;QACF;QAEAE,SAAS,gBAAgB,CAAC,aAAaR;QACvCQ,SAAS,gBAAgB,CAAC,aAAaR;QACvCQ,SAAS,gBAAgB,CAAC,cAAcL;QACxCK,SAAS,gBAAgB,CAAC,aAAaL;QACvCK,SAAS,gBAAgB,CAAC,WAAWH;QACrCG,SAAS,gBAAgB,CAAC,YAAYD;QACtCC,SAAS,gBAAgB,CAAC,eAAeD;QAEzC,OAAO;YACLC,SAAS,mBAAmB,CAAC,aAAaR;YAC1CQ,SAAS,mBAAmB,CAAC,aAAaR;YAC1CQ,SAAS,mBAAmB,CAAC,cAAcL;YAC3CK,SAAS,mBAAmB,CAAC,aAAaL;YAC1CK,SAAS,mBAAmB,CAAC,WAAWH;YACxCG,SAAS,mBAAmB,CAAC,YAAYD;YACzCC,SAAS,mBAAmB,CAAC,eAAeD;QAC9C;IACF,GAAG;QAAClB;KAAa;IAEjB,MAAMoB,kBAAkB,IAAMnB,gBAAgB;IAE9C,MAAMoB,mBAAmB,IAAMpB,gBAAgB;IAE/C,MAAMY,UAAU,CAACS,SAAiBC;QAChC,MAAMf,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjB,MAAMe,OAAOhB,OAAO,qBAAqB;YACzC,MAAMiB,IAAIH,UAAUE,KAAK,IAAI,GAAG;YAChC,MAAME,IAAIH,UAAUC,KAAK,GAAG,GAAG;YAC/Bf,IAAI,wBAAwB,GAAG;YAC/BA,IAAI,SAAS;YACbA,IAAI,GAAG,CAACgB,GAAGC,GAAG,IAAI,GAAGC,IAAAA,KAAK,EAAE;YAC5BlB,IAAI,IAAI;QACV;IACF;IAEA,MAAMmB,iBAAiB;QACrB,MAAMvB,SAAS,KAAK,CAAC;YACnB,OAAO;gBAAC;gBAAG;gBAAK;aAAE;YAClB,QAAQ;gBAAC;gBAAG;gBAAI;gBAAK;gBAAI;gBAAK;aAAE;YAChC,YAAY;gBAAE,UAAU;YAAI;QAC9B;QAGA,IAAIX,YACFA;IAEJ;IAEA,MAAMuB,kBAAkB;QACtB,IAAId,YAAY;QAEhB,MAAMK,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjB,MAAMoB,YAAYpB,IAAI,YAAY,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;YACpE,MAAMsB,SAASD,UAAU,IAAI;YAC7B,MAAME,cAAcD,OAAO,MAAM,GAAG;YACpC,IAAIE,cAAc;YAElB,IAAK,IAAIC,IAAI,GAAGA,IAAIH,OAAO,MAAM,EAAEG,KAAK,EACtC,IAAIH,MAAAA,MAAM,CAACG,EAAE,EAAQD;YAGvB,MAAME,aAAcF,cAAcD,cAAe;YAEjD,IAAIG,cAAczC,sBAAsB;gBACtCW,cAAc;gBACdK,IAAI,SAAS,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;gBAC/CoB;YACF;QACF;IACF;IAEA,OAAO,WAAP,GACE,KAACO,OAAO,GAAG;QACT,WAAWC,GAAG,wBAAwBxC;QACtC,OAAO;YACLL;YACAC;YACA,QACE;QACJ;QACA,SAASa;;0BAET,IAAC;gBACC,KAAKP;gBACL,OAAOP;gBACP,QAAQC;gBACR,WAAU;gBACV,aAAa4B;gBACb,cAAcC;;YAEf1B;;;AAGP"}

package/dist/esm/index.css

@@ -7006,7 +7006,7 @@
 @property --tw-gradient-from-position {
   syntax: "<length-percentage>";
   inherits: false;
-  initial-value: 0;
+  initial-value: 0%;
 }
 
 @property --tw-gradient-via-position {