@definable/ui 0.1.9 → 0.1.12

package/dist/components/selection-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-bar.js","sources":["../../src/components/selection-bar.tsx"],"sourcesContent":["import { motion, AnimatePresence } from \"framer-motion\"\nimport { Check, X, Trash, Download } from \"lucide-react\"\nimport { Button } from \"./button\"\n\ninterface SelectionBarProps {\n  selectedCount: number\n  onEnable?: () => void\n  onDisable?: () => void\n  onDelete?: () => void\n  onDownload?: () => void\n  onCancel: () => void\n  show: boolean\n}\n\nexport function SelectionBar({ \n  selectedCount, \n  onEnable,\n  onDisable,\n  onDelete,\n  onDownload,\n  onCancel,\n  show \n}: SelectionBarProps) {\n  return (\n    <AnimatePresence>\n      {show && (\n        <motion.div\n          initial={{ y: 100, opacity: 0 }}\n          animate={{ y: 0, opacity: 1 }}\n          exit={{ y: 100, opacity: 0 }}\n          className=\"fixed bottom-4 left-0 right-0 mx-auto max-w-fit bg-background rounded-lg border shadow-lg z-50\"\n        >\n          <div className=\"flex items-center gap-6 px-4 py-2\">\n            <div className=\"flex items-center gap-2 text-sm font-medium\">\n              <span className=\"bg-primary text-primary-foreground w-8 h-8 rounded-lg flex items-center justify-center\">\n                {selectedCount}\n              </span>\n              Selected\n            </div>\n            \n            <div className=\"h-4 w-px bg-border\" />\n            \n            <div className=\"flex items-center gap-2\">\n              {onEnable && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onEnable}>\n                  <Check className=\"mr-2 h-4 w-4\" />\n                  Enable\n                </Button>\n              )}\n              {onDisable && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onDisable}>\n                  <X className=\"mr-2 h-4 w-4\" />\n                  Disable\n                </Button>\n              )}\n              {onDownload && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onDownload}>\n                  <Download className=\"mr-2 h-4 w-4\" />\n                  Download\n                </Button>\n              )}\n              {onDelete && (\n                <Button variant=\"ghost\" size=\"sm\" className=\"text-destructive\" onClick={onDelete}>\n                  <Trash className=\"mr-2 h-4 w-4\" />\n                  Delete\n                </Button>\n              )}\n            </div>\n            \n            <div className=\"h-4 w-px bg-border\" />\n            \n            <Button variant=\"ghost\" size=\"sm\" onClick={onCancel}>\n              Cancel\n            </Button>\n          </div>\n        </motion.div>\n      )}\n    </AnimatePresence>\n  )\n} "],"names":["SelectionBar","selectedCount","onEnable","onDisable","onDelete","onDownload","onCancel","show","jsx","AnimatePresence","motion","jsxs","Button","Check","X","Download","Trash"],"mappings":"6MAcO,SAASA,EAAa,CAC3B,cAAAC,EACA,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,WAAAC,EACA,SAAAC,EACA,KAAAC,CACF,EAAsB,CACpB,OACEC,EAAAA,kBAAAA,IAACC,EAAAA,iBACE,SAAAF,GACCC,EAAAA,kBAAAA,IAACE,EAAAA,OAAO,IAAP,CACC,QAAS,CAAE,EAAG,IAAK,QAAS,CAAA,EAC5B,QAAS,CAAE,EAAG,EAAG,QAAS,CAAA,EAC1B,KAAM,CAAE,EAAG,IAAK,QAAS,CAAA,EACzB,UAAU,iGAEV,SAAAC,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,oCACb,SAAA,CAAAA,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,8CACb,SAAA,CAAAH,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,yFACb,SAAAP,EACH,EAAO,UAAA,EAET,EAEAO,EAAAA,kBAAAA,IAAC,MAAA,CAAI,UAAU,oBAAA,CAAqB,EAEpCG,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAT,4BACEU,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAASV,EACzC,SAAA,CAAAM,EAAAA,kBAAAA,IAACK,EAAAA,MAAA,CAAM,UAAU,cAAA,CAAe,EAAE,QAAA,EAEpC,EAEDV,4BACES,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAAST,EACzC,SAAA,CAAAK,EAAAA,kBAAAA,IAACM,EAAAA,EAAA,CAAE,UAAU,cAAA,CAAe,EAAE,SAAA,EAEhC,EAEDT,4BACEO,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAASP,EACzC,SAAA,CAAAG,EAAAA,kBAAAA,IAACO,EAAAA,SAAA,CAAS,UAAU,cAAA,CAAe,EAAE,UAAA,EAEvC,EAEDX,GACCO,EAAAA,kBAAAA,KAACC,EAAAA,OAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,UAAU,mBAAmB,QAASR,EACtE,SAAA,CAAAI,EAAAA,kBAAAA,IAACQ,EAAAA,MAAA,CAAM,UAAU,cAAA,CAAe,EAAE,QAAA,CAAA,CAEpC,CAAA,EAEJ,EAEAR,EAAAA,kBAAAA,IAAC,MAAA,CAAI,UAAU,oBAAA,CAAqB,EAEpCA,EAAAA,kBAAAA,IAACI,EAAAA,QAAO,QAAQ,QAAQ,KAAK,KAAK,QAASN,EAAU,SAAA,QAAA,CAErD,CAAA,CAAA,CACF,CAAA,CAAA,EAGN,CAEJ"}
+{"version":3,"file":"selection-bar.js","sources":["../../src/components/selection-bar.tsx"],"sourcesContent":["import { motion, AnimatePresence } from \"framer-motion\"\nimport { Check, X, Trash, Download } from \"lucide-react\"\nimport { Button } from \"./button\"\n\ninterface SelectionBarProps {\n  selectedCount: number\n  onEnable?: () => void\n  onDisable?: () => void\n  onDelete?: () => void\n  onDownload?: () => void\n  onCancel: () => void\n  show: boolean\n}\n\nexport function SelectionBar({ \n  selectedCount, \n  onEnable,\n  onDisable,\n  onDelete,\n  onDownload,\n  onCancel,\n  show \n}: SelectionBarProps) {\n  return (\n    <AnimatePresence>\n      {show && (\n        <motion.div\n          initial={{ y: 100, opacity: 0 }}\n          animate={{ y: 0, opacity: 1 }}\n          exit={{ y: 100, opacity: 0 }}\n          className=\"fixed bottom-4 left-1/2 -translate-x-1/2 w-fit bg-background rounded-lg border shadow-lg z-50\"\n        >\n          <div className=\"flex items-center gap-6 px-4 py-2\">\n            <div className=\"flex items-center gap-2 text-sm font-medium\">\n              <span className=\"bg-primary text-primary-foreground w-8 h-8 rounded-lg flex items-center justify-center\">\n                {selectedCount}\n              </span>\n              Selected\n            </div>\n            \n            <div className=\"h-4 w-px bg-border\" />\n            \n            <div className=\"flex items-center gap-2\">\n              {onEnable && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onEnable}>\n                  <Check className=\"mr-2 h-4 w-4\" />\n                  Enable\n                </Button>\n              )}\n              {onDisable && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onDisable}>\n                  <X className=\"mr-2 h-4 w-4\" />\n                  Disable\n                </Button>\n              )}\n              {onDownload && (\n                <Button variant=\"ghost\" size=\"sm\" onClick={onDownload}>\n                  <Download className=\"mr-2 h-4 w-4\" />\n                  Download\n                </Button>\n              )}\n              {onDelete && (\n                <Button variant=\"ghost\" size=\"sm\" className=\"text-destructive\" onClick={onDelete}>\n                  <Trash className=\"mr-2 h-4 w-4\" />\n                  Delete\n                </Button>\n              )}\n            </div>\n            \n            <div className=\"h-4 w-px bg-border\" />\n            \n            <Button variant=\"ghost\" size=\"sm\" onClick={onCancel}>\n              Cancel\n            </Button>\n          </div>\n        </motion.div>\n      )}\n    </AnimatePresence>\n  )\n} "],"names":["SelectionBar","selectedCount","onEnable","onDisable","onDelete","onDownload","onCancel","show","jsx","AnimatePresence","motion","jsxs","Button","Check","X","Download","Trash"],"mappings":"6MAcO,SAASA,EAAa,CAC3B,cAAAC,EACA,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,WAAAC,EACA,SAAAC,EACA,KAAAC,CACF,EAAsB,CACpB,OACEC,EAAAA,kBAAAA,IAACC,EAAAA,iBACE,SAAAF,GACCC,EAAAA,kBAAAA,IAACE,EAAAA,OAAO,IAAP,CACC,QAAS,CAAE,EAAG,IAAK,QAAS,CAAA,EAC5B,QAAS,CAAE,EAAG,EAAG,QAAS,CAAA,EAC1B,KAAM,CAAE,EAAG,IAAK,QAAS,CAAA,EACzB,UAAU,gGAEV,SAAAC,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,oCACb,SAAA,CAAAA,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,8CACb,SAAA,CAAAH,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,yFACb,SAAAP,EACH,EAAO,UAAA,EAET,EAEAO,EAAAA,kBAAAA,IAAC,MAAA,CAAI,UAAU,oBAAA,CAAqB,EAEpCG,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAT,4BACEU,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAASV,EACzC,SAAA,CAAAM,EAAAA,kBAAAA,IAACK,EAAAA,MAAA,CAAM,UAAU,cAAA,CAAe,EAAE,QAAA,EAEpC,EAEDV,4BACES,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAAST,EACzC,SAAA,CAAAK,EAAAA,kBAAAA,IAACM,EAAAA,EAAA,CAAE,UAAU,cAAA,CAAe,EAAE,SAAA,EAEhC,EAEDT,4BACEO,SAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,QAASP,EACzC,SAAA,CAAAG,EAAAA,kBAAAA,IAACO,EAAAA,SAAA,CAAS,UAAU,cAAA,CAAe,EAAE,UAAA,EAEvC,EAEDX,GACCO,EAAAA,kBAAAA,KAACC,EAAAA,OAAA,CAAO,QAAQ,QAAQ,KAAK,KAAK,UAAU,mBAAmB,QAASR,EACtE,SAAA,CAAAI,EAAAA,kBAAAA,IAACQ,EAAAA,MAAA,CAAM,UAAU,cAAA,CAAe,EAAE,QAAA,CAAA,CAEpC,CAAA,EAEJ,EAEAR,EAAAA,kBAAAA,IAAC,MAAA,CAAI,UAAU,oBAAA,CAAqB,EAEpCA,EAAAA,kBAAAA,IAACI,EAAAA,QAAO,QAAQ,QAAQ,KAAK,KAAK,QAASN,EAAU,SAAA,QAAA,CAErD,CAAA,CAAA,CACF,CAAA,CAAA,EAGN,CAEJ"}

package/dist/components/sheet.esm.js

@@ -10,30 +10,30 @@ function T({
   isOpen: i,
   onClose: n,
   children: y,
-  header: g,
+  header: b,
   footer: u,
-  className: j,
-  enableFullscreen: b = !0,
+  className: g,
+  enableFullscreen: j = !0,
   position: c = "right",
   headerClassName: v = ""
 }) {
-  const [o, N] = B(!1), a = I(null);
+  const [r, N] = B(!1), a = I(null);
   if (d(() => (i ? s.push(a) : s = s.filter((t) => t !== a), () => {
     s = s.filter((t) => t !== a);
   }), [i]), d(() => {
-    const t = (r) => {
+    const t = (o) => {
       var x;
       const L = s.some(
-        (f) => f.current && f.current.contains(r.target)
-      ), R = (x = r.target) == null ? void 0 : x.closest("[data-sheet-close]");
-      !L && !R && a.current && !a.current.contains(r.target) && n();
+        (f) => f.current && f.current.contains(o.target)
+      ), R = (x = o.target) == null ? void 0 : x.closest("[data-sheet-close]");
+      !L && !R && a.current && !a.current.contains(o.target) && n();
     };
-    return i && !o && document.addEventListener("mousedown", t), () => {
+    return i && !r && document.addEventListener("mousedown", t), () => {
       document.removeEventListener("mousedown", t);
     };
-  }, [i, o, n]), d(() => {
-    const t = (r) => {
-      r.key === "Escape" && i && s[s.length - 1] === a && n();
+  }, [i, r, n]), d(() => {
+    const t = (o) => {
+      o.key === "Escape" && i && s[s.length - 1] === a && n();
     };
     return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
   }, [i, n]), !i) return null;
@@ -41,21 +41,21 @@ function T({
     t.stopPropagation(), n();
   }, w = /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col h-full", children: [
     /* @__PURE__ */ e.jsxs("div", { className: m(
-      "flex items-center justify-between py-4 px-4 h-header border-b",
+      "flex items-center justify-between py-4 px-4 h-header border-b border-border/50",
       v
     ), children: [
-      /* @__PURE__ */ e.jsx("div", { className: "text-sm font-medium", children: g }),
+      /* @__PURE__ */ e.jsx("div", { className: "text-sm font-medium", children: b }),
       /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1 ml-auto", children: [
-        b && /* @__PURE__ */ e.jsx(
+        j && /* @__PURE__ */ e.jsx(
           h,
           {
             variant: "ghost",
             size: "icon",
             className: "h-7 w-7",
             onClick: (t) => {
-              t.stopPropagation(), N(!o);
+              t.stopPropagation(), N(!r);
             },
-            children: o ? /* @__PURE__ */ e.jsx(S, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ e.jsx(A, { className: "h-3.5 w-3.5" })
+            children: r ? /* @__PURE__ */ e.jsx(S, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ e.jsx(A, { className: "h-3.5 w-3.5" })
           }
         ),
         /* @__PURE__ */ e.jsx(
@@ -72,7 +72,7 @@ function T({
       ] })
     ] }),
     /* @__PURE__ */ e.jsx("div", { className: "flex-1 overflow-auto", children: y }),
-    u && /* @__PURE__ */ e.jsx("div", { className: "border-t py-2 px-3", children: /* @__PURE__ */ e.jsx("div", { className: "text-sm", children: u }) })
+    u && /* @__PURE__ */ e.jsx("div", { className: "border-t border-border/50 py-2 px-3", children: /* @__PURE__ */ e.jsx("div", { className: "text-sm", children: u }) })
   ] }), E = () => c === "left" ? {
     initial: { x: -100, opacity: 0 },
     animate: { x: 0, opacity: 1 },
@@ -85,7 +85,7 @@ function T({
     initial: { x: 100, opacity: 0 },
     animate: { x: 0, opacity: 1 },
     exit: { x: 100, opacity: 0 }
-  }, P = () => o ? "inset-4 rounded-lg" : c === "left" ? "inset-y-0 left-0 border-r" : c === "bottom" ? "inset-x-0 bottom-0 border-t" : "inset-y-0 right-0 border-l", l = E(), z = P(), C = /* @__PURE__ */ e.jsx(M, { children: i && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+  }, P = () => r ? "inset-4 rounded-lg" : c === "left" ? "inset-y-0 left-0 border-r" : c === "bottom" ? "inset-x-0 bottom-0 border-t" : "inset-y-0 right-0 border-l", l = E(), z = P(), C = /* @__PURE__ */ e.jsx(M, { children: i && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
       p.div,
       {
@@ -97,7 +97,7 @@ function T({
         },
         className: m(
           "fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-          o ? "block" : "hidden"
+          r ? "block" : "hidden"
         )
       }
     ),
@@ -113,9 +113,9 @@ function T({
           ease: [0.32, 0.72, 0, 1]
         },
         className: m(
-          "fixed z-[100] bg-background shadow-lg flex flex-col",
+          "fixed z-[100] bg-background shadow-lg flex flex-col border-border/50",
           z,
-          j
+          g
         ),
         children: w
       }

package/dist/components/sheet.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.esm.js","sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { X, Maximize2, Minimize2 } from \"lucide-react\"\nimport { Button } from \"./button\"\nimport { useState, useRef, useEffect } from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { createPortal } from \"react-dom\"\n\ninterface SheetProps {\n  isOpen: boolean\n  onClose: () => void\n  children: React.ReactNode\n  header?: React.ReactNode\n  footer?: React.ReactNode\n  className?: string\n  enableFullscreen?: boolean\n  position?: 'left' | 'right' | 'bottom'\n  headerClassName?: string\n}\n\n// Create a global registry of open sheets to prevent closing multiple sheets\nlet openSheetRefs: React.RefObject<HTMLDivElement>[] = [];\n\nexport function Sheet({ \n  isOpen, \n  onClose, \n  children, \n  header, \n  footer, \n  className, \n  enableFullscreen = true,\n  position = 'right',\n  headerClassName = ''\n}: SheetProps) {\n  const [isFullscreen, setIsFullscreen] = useState(false)\n  const sheetRef = useRef<HTMLDivElement>(null)\n\n  // When the sheet opens, add its ref to the registry\n  useEffect(() => {\n    if (isOpen) {\n      openSheetRefs.push(sheetRef);\n    } else {\n      // Remove the ref when sheet closes\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    }\n    \n    return () => {\n      // Cleanup when component unmounts\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    };\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      // If we clicked inside any open sheet, don't close any sheets\n      const clickedInsideAnySheet = openSheetRefs.some(ref => \n        ref.current && ref.current.contains(event.target as Node)\n      );\n\n      // Check if clicked on the close button\n      const isCloseButton = (event.target as Element)?.closest('[data-sheet-close]');\n      \n      // Only close if not clicked inside any sheet and not clicking a close button\n      if (!clickedInsideAnySheet && !isCloseButton && sheetRef.current && !sheetRef.current.contains(event.target as Node)) {\n        onClose();\n      }\n    }\n\n    if (isOpen && !isFullscreen) {\n      document.addEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [isOpen, isFullscreen, onClose])\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen) {\n        // Only close the topmost sheet (last one in the registry)\n        if (openSheetRefs[openSheetRefs.length - 1] === sheetRef) {\n          onClose();\n        }\n      }\n    }\n\n    document.addEventListener('keydown', handleEscape)\n    return () => document.removeEventListener('keydown', handleEscape)\n  }, [isOpen, onClose])\n\n  if (!isOpen) return null\n\n  const handleCloseClick = (e: React.MouseEvent) => {\n    e.stopPropagation(); // Prevent event from bubbling to parent sheets\n    onClose();\n  };\n\n  const content = (\n    <div className=\"flex flex-col h-full\">\n      <div className={cn(\n        \"flex items-center justify-between py-4 px-4 h-header border-b\",\n        headerClassName\n      )}>\n        <div className=\"text-sm font-medium\">{header}</div>\n        <div className=\"flex items-center gap-1 ml-auto\">\n          {enableFullscreen && (\n            <Button \n              variant=\"ghost\" \n              size=\"icon\" \n              className=\"h-7 w-7\"\n              onClick={(e) => {\n                e.stopPropagation();\n                setIsFullscreen(!isFullscreen);\n              }}\n            >\n              {isFullscreen ? (\n                <Minimize2 className=\"h-3.5 w-3.5\" />\n              ) : (\n                <Maximize2 className=\"h-3.5 w-3.5\" />\n              )}\n            </Button>\n          )}\n          <Button \n            variant=\"ghost\" \n            size=\"icon\" \n            className=\"h-7 w-7\"\n            onClick={handleCloseClick}\n            data-sheet-close=\"true\"\n          >\n            <X className=\"h-3.5 w-3.5\" />\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"flex-1 overflow-auto\">\n        {children}\n      </div>\n\n      {footer && (\n        <div className=\"border-t py-2 px-3\">\n          <div className=\"text-sm\">{footer}</div>\n        </div>\n      )}\n    </div>\n  )\n\n  // Determine animation properties based on position\n  const getAnimationProps = () => {\n    if (position === 'left') {\n      return {\n        initial: { x: -100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: -100, opacity: 0 },\n      }\n    } else if (position === 'bottom') {\n      return {\n        initial: { y: 100, opacity: 0 },\n        animate: { y: 0, opacity: 1 },\n        exit: { y: 100, opacity: 0 },\n      }\n    } else { // right (default)\n      return {\n        initial: { x: 100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: 100, opacity: 0 },\n      }\n    }\n  }\n\n  // Determine position classes based on position\n  const getPositionClasses = () => {\n    if (isFullscreen) {\n      return \"inset-4 rounded-lg\"\n    } else if (position === 'left') {\n      return \"inset-y-0 left-0 border-r\"\n    } else if (position === 'bottom') {\n      return \"inset-x-0 bottom-0 border-t\"\n    } else { // right (default)\n      return \"inset-y-0 right-0 border-l\"\n    }\n  }\n\n  const animationProps = getAnimationProps()\n  const positionClasses = getPositionClasses()\n\n  const sheetContent = (\n    <AnimatePresence>\n      {isOpen && (\n        <>\n          {/* Backdrop */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            exit={{ opacity: 0 }}\n            onClick={(e) => {\n              e.stopPropagation();\n              onClose();\n            }}\n            className={cn(\n              \"fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n              isFullscreen ? \"block\" : \"hidden\"\n            )}\n          />\n\n          {/* Sheet/Modal */}\n          <motion.div\n            ref={sheetRef}\n            initial={animationProps.initial}\n            animate={animationProps.animate}\n            exit={animationProps.exit}\n            transition={{ \n              duration: 0.3,\n              ease: [0.32, 0.72, 0, 1]\n            }}\n            className={cn(\n              \"fixed z-[100] bg-background shadow-lg flex flex-col\",\n              positionClasses,\n              className\n            )}\n          >\n            {content}\n          </motion.div>\n        </>\n      )}\n    </AnimatePresence>\n  )\n\n  return createPortal(sheetContent, document.body)\n} "],"names":["openSheetRefs","Sheet","isOpen","onClose","children","header","footer","className","enableFullscreen","position","headerClassName","isFullscreen","setIsFullscreen","useState","sheetRef","useRef","useEffect","ref","handleClickOutside","event","clickedInsideAnySheet","isCloseButton","_a","handleEscape","handleCloseClick","e","content","jsxs","cn","jsx","Button","Minimize2","Maximize2","X","getAnimationProps","getPositionClasses","animationProps","positionClasses","sheetContent","AnimatePresence","Fragment","motion","createPortal"],"mappings":"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"}
+{"version":3,"file":"sheet.esm.js","sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { X, Maximize2, Minimize2 } from \"lucide-react\"\nimport { Button } from \"./button\"\nimport { useState, useRef, useEffect } from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { createPortal } from \"react-dom\"\n\ninterface SheetProps {\n  isOpen: boolean\n  onClose: () => void\n  children: React.ReactNode\n  header?: React.ReactNode\n  footer?: React.ReactNode\n  className?: string\n  enableFullscreen?: boolean\n  position?: 'left' | 'right' | 'bottom'\n  headerClassName?: string\n}\n\n// Create a global registry of open sheets to prevent closing multiple sheets\nlet openSheetRefs: React.RefObject<HTMLDivElement>[] = [];\n\nexport function Sheet({ \n  isOpen, \n  onClose, \n  children, \n  header, \n  footer, \n  className, \n  enableFullscreen = true,\n  position = 'right',\n  headerClassName = ''\n}: SheetProps) {\n  const [isFullscreen, setIsFullscreen] = useState(false)\n  const sheetRef = useRef<HTMLDivElement>(null)\n\n  // When the sheet opens, add its ref to the registry\n  useEffect(() => {\n    if (isOpen) {\n      openSheetRefs.push(sheetRef);\n    } else {\n      // Remove the ref when sheet closes\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    }\n    \n    return () => {\n      // Cleanup when component unmounts\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    };\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      // If we clicked inside any open sheet, don't close any sheets\n      const clickedInsideAnySheet = openSheetRefs.some(ref => \n        ref.current && ref.current.contains(event.target as Node)\n      );\n\n      // Check if clicked on the close button\n      const isCloseButton = (event.target as Element)?.closest('[data-sheet-close]');\n      \n      // Only close if not clicked inside any sheet and not clicking a close button\n      if (!clickedInsideAnySheet && !isCloseButton && sheetRef.current && !sheetRef.current.contains(event.target as Node)) {\n        onClose();\n      }\n    }\n\n    if (isOpen && !isFullscreen) {\n      document.addEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [isOpen, isFullscreen, onClose])\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen) {\n        // Only close the topmost sheet (last one in the registry)\n        if (openSheetRefs[openSheetRefs.length - 1] === sheetRef) {\n          onClose();\n        }\n      }\n    }\n\n    document.addEventListener('keydown', handleEscape)\n    return () => document.removeEventListener('keydown', handleEscape)\n  }, [isOpen, onClose])\n\n  if (!isOpen) return null\n\n  const handleCloseClick = (e: React.MouseEvent) => {\n    e.stopPropagation(); // Prevent event from bubbling to parent sheets\n    onClose();\n  };\n\n  const content = (\n    <div className=\"flex flex-col h-full\">\n      <div className={cn(\n        \"flex items-center justify-between py-4 px-4 h-header border-b border-border/50\",\n        headerClassName\n      )}>\n        <div className=\"text-sm font-medium\">{header}</div>\n        <div className=\"flex items-center gap-1 ml-auto\">\n          {enableFullscreen && (\n            <Button \n              variant=\"ghost\" \n              size=\"icon\" \n              className=\"h-7 w-7\"\n              onClick={(e) => {\n                e.stopPropagation();\n                setIsFullscreen(!isFullscreen);\n              }}\n            >\n              {isFullscreen ? (\n                <Minimize2 className=\"h-3.5 w-3.5\" />\n              ) : (\n                <Maximize2 className=\"h-3.5 w-3.5\" />\n              )}\n            </Button>\n          )}\n          <Button \n            variant=\"ghost\" \n            size=\"icon\" \n            className=\"h-7 w-7\"\n            onClick={handleCloseClick}\n            data-sheet-close=\"true\"\n          >\n            <X className=\"h-3.5 w-3.5\" />\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"flex-1 overflow-auto\">\n        {children}\n      </div>\n\n      {footer && (\n        <div className=\"border-t border-border/50 py-2 px-3\">\n          <div className=\"text-sm\">{footer}</div>\n        </div>\n      )}\n    </div>\n  )\n\n  // Determine animation properties based on position\n  const getAnimationProps = () => {\n    if (position === 'left') {\n      return {\n        initial: { x: -100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: -100, opacity: 0 },\n      }\n    } else if (position === 'bottom') {\n      return {\n        initial: { y: 100, opacity: 0 },\n        animate: { y: 0, opacity: 1 },\n        exit: { y: 100, opacity: 0 },\n      }\n    } else { // right (default)\n      return {\n        initial: { x: 100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: 100, opacity: 0 },\n      }\n    }\n  }\n\n  // Determine position classes based on position\n  const getPositionClasses = () => {\n    if (isFullscreen) {\n      return \"inset-4 rounded-lg\"\n    } else if (position === 'left') {\n      return \"inset-y-0 left-0 border-r\"\n    } else if (position === 'bottom') {\n      return \"inset-x-0 bottom-0 border-t\"\n    } else { // right (default)\n      return \"inset-y-0 right-0 border-l\"\n    }\n  }\n\n  const animationProps = getAnimationProps()\n  const positionClasses = getPositionClasses()\n\n  const sheetContent = (\n    <AnimatePresence>\n      {isOpen && (\n        <>\n          {/* Backdrop */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            exit={{ opacity: 0 }}\n            onClick={(e) => {\n              e.stopPropagation();\n              onClose();\n            }}\n            className={cn(\n              \"fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n              isFullscreen ? \"block\" : \"hidden\"\n            )}\n          />\n\n          {/* Sheet/Modal */}\n          <motion.div\n            ref={sheetRef}\n            initial={animationProps.initial}\n            animate={animationProps.animate}\n            exit={animationProps.exit}\n            transition={{ \n              duration: 0.3,\n              ease: [0.32, 0.72, 0, 1]\n            }}\n            className={cn(\n              \"fixed z-[100] bg-background shadow-lg flex flex-col border-border/50\",\n              positionClasses,\n              className\n            )}\n          >\n            {content}\n          </motion.div>\n        </>\n      )}\n    </AnimatePresence>\n  )\n\n  return createPortal(sheetContent, document.body)\n} "],"names":["openSheetRefs","Sheet","isOpen","onClose","children","header","footer","className","enableFullscreen","position","headerClassName","isFullscreen","setIsFullscreen","useState","sheetRef","useRef","useEffect","ref","handleClickOutside","event","clickedInsideAnySheet","isCloseButton","_a","handleEscape","handleCloseClick","e","content","jsxs","cn","jsx","Button","Minimize2","Maximize2","X","getAnimationProps","getPositionClasses","animationProps","positionClasses","sheetContent","AnimatePresence","Fragment","motion","createPortal"],"mappings":"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"}

package/dist/components/sheet.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../jsx-runtime-BYECrxsp.cjs"),x=require("lucide-react"),j=require("./button.js"),c=require("react"),m=require("../utils-DSKoFOjv.cjs"),d=require("framer-motion"),L=require("react-dom");let i=[];function M({isOpen:s,onClose:a,children:y,header:E,footer:f,className:g,enableFullscreen:R=!0,position:l="right",headerClassName:b=""}){const[o,v]=c.useState(!1),n=c.useRef(null);if(c.useEffect(()=>(s?i.push(n):i=i.filter(t=>t!==n),()=>{i=i.filter(t=>t!==n)}),[s]),c.useEffect(()=>{const t=r=>{var p;const z=i.some(h=>h.current&&h.current.contains(r.target)),C=(p=r.target)==null?void 0:p.closest("[data-sheet-close]");!z&&!C&&n.current&&!n.current.contains(r.target)&&a()};return s&&!o&&document.addEventListener("mousedown",t),()=>{document.removeEventListener("mousedown",t)}},[s,o,a]),c.useEffect(()=>{const t=r=>{r.key==="Escape"&&s&&i[i.length-1]===n&&a()};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[s,a]),!s)return null;const N=t=>{t.stopPropagation(),a()},k=e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col h-full",children:[e.jsxRuntimeExports.jsxs("div",{className:m.cn("flex items-center justify-between py-4 px-4 h-header border-b",b),children:[e.jsxRuntimeExports.jsx("div",{className:"text-sm font-medium",children:E}),e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-1 ml-auto",children:[R&&e.jsxRuntimeExports.jsx(j.Button,{variant:"ghost",size:"icon",className:"h-7 w-7",onClick:t=>{t.stopPropagation(),v(!o)},children:o?e.jsxRuntimeExports.jsx(x.Minimize2,{className:"h-3.5 w-3.5"}):e.jsxRuntimeExports.jsx(x.Maximize2,{className:"h-3.5 w-3.5"})}),e.jsxRuntimeExports.jsx(j.Button,{variant:"ghost",size:"icon",className:"h-7 w-7",onClick:N,"data-sheet-close":"true",children:e.jsxRuntimeExports.jsx(x.X,{className:"h-3.5 w-3.5"})})]})]}),e.jsxRuntimeExports.jsx("div",{className:"flex-1 overflow-auto",children:y}),f&&e.jsxRuntimeExports.jsx("div",{className:"border-t py-2 px-3",children:e.jsxRuntimeExports.jsx("div",{className:"text-sm",children:f})})]}),w=()=>l==="left"?{initial:{x:-100,opacity:0},animate:{x:0,opacity:1},exit:{x:-100,opacity:0}}:l==="bottom"?{initial:{y:100,opacity:0},animate:{y:0,opacity:1},exit:{y:100,opacity:0}}:{initial:{x:100,opacity:0},animate:{x:0,opacity:1},exit:{x:100,opacity:0}},P=()=>o?"inset-4 rounded-lg":l==="left"?"inset-y-0 left-0 border-r":l==="bottom"?"inset-x-0 bottom-0 border-t":"inset-y-0 right-0 border-l",u=w(),q=P(),S=e.jsxRuntimeExports.jsx(d.AnimatePresence,{children:s&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(d.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},onClick:t=>{t.stopPropagation(),a()},className:m.cn("fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",o?"block":"hidden")}),e.jsxRuntimeExports.jsx(d.motion.div,{ref:n,initial:u.initial,animate:u.animate,exit:u.exit,transition:{duration:.3,ease:[.32,.72,0,1]},className:m.cn("fixed z-[100] bg-background shadow-lg flex flex-col",q,g),children:k})]})});return L.createPortal(S,document.body)}exports.Sheet=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../jsx-runtime-BYECrxsp.cjs"),x=require("lucide-react"),j=require("./button.js"),c=require("react"),d=require("../utils-DSKoFOjv.cjs"),m=require("framer-motion"),L=require("react-dom");let i=[];function M({isOpen:s,onClose:r,children:b,header:y,footer:f,className:E,enableFullscreen:g=!0,position:l="right",headerClassName:R=""}){const[o,v]=c.useState(!1),n=c.useRef(null);if(c.useEffect(()=>(s?i.push(n):i=i.filter(t=>t!==n),()=>{i=i.filter(t=>t!==n)}),[s]),c.useEffect(()=>{const t=a=>{var p;const z=i.some(h=>h.current&&h.current.contains(a.target)),C=(p=a.target)==null?void 0:p.closest("[data-sheet-close]");!z&&!C&&n.current&&!n.current.contains(a.target)&&r()};return s&&!o&&document.addEventListener("mousedown",t),()=>{document.removeEventListener("mousedown",t)}},[s,o,r]),c.useEffect(()=>{const t=a=>{a.key==="Escape"&&s&&i[i.length-1]===n&&r()};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[s,r]),!s)return null;const N=t=>{t.stopPropagation(),r()},k=e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col h-full",children:[e.jsxRuntimeExports.jsxs("div",{className:d.cn("flex items-center justify-between py-4 px-4 h-header border-b border-border/50",R),children:[e.jsxRuntimeExports.jsx("div",{className:"text-sm font-medium",children:y}),e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-1 ml-auto",children:[g&&e.jsxRuntimeExports.jsx(j.Button,{variant:"ghost",size:"icon",className:"h-7 w-7",onClick:t=>{t.stopPropagation(),v(!o)},children:o?e.jsxRuntimeExports.jsx(x.Minimize2,{className:"h-3.5 w-3.5"}):e.jsxRuntimeExports.jsx(x.Maximize2,{className:"h-3.5 w-3.5"})}),e.jsxRuntimeExports.jsx(j.Button,{variant:"ghost",size:"icon",className:"h-7 w-7",onClick:N,"data-sheet-close":"true",children:e.jsxRuntimeExports.jsx(x.X,{className:"h-3.5 w-3.5"})})]})]}),e.jsxRuntimeExports.jsx("div",{className:"flex-1 overflow-auto",children:b}),f&&e.jsxRuntimeExports.jsx("div",{className:"border-t border-border/50 py-2 px-3",children:e.jsxRuntimeExports.jsx("div",{className:"text-sm",children:f})})]}),w=()=>l==="left"?{initial:{x:-100,opacity:0},animate:{x:0,opacity:1},exit:{x:-100,opacity:0}}:l==="bottom"?{initial:{y:100,opacity:0},animate:{y:0,opacity:1},exit:{y:100,opacity:0}}:{initial:{x:100,opacity:0},animate:{x:0,opacity:1},exit:{x:100,opacity:0}},P=()=>o?"inset-4 rounded-lg":l==="left"?"inset-y-0 left-0 border-r":l==="bottom"?"inset-x-0 bottom-0 border-t":"inset-y-0 right-0 border-l",u=w(),q=P(),S=e.jsxRuntimeExports.jsx(m.AnimatePresence,{children:s&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(m.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},onClick:t=>{t.stopPropagation(),r()},className:d.cn("fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",o?"block":"hidden")}),e.jsxRuntimeExports.jsx(m.motion.div,{ref:n,initial:u.initial,animate:u.animate,exit:u.exit,transition:{duration:.3,ease:[.32,.72,0,1]},className:d.cn("fixed z-[100] bg-background shadow-lg flex flex-col border-border/50",q,E),children:k})]})});return L.createPortal(S,document.body)}exports.Sheet=M;
 //# sourceMappingURL=sheet.js.map

package/dist/components/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { X, Maximize2, Minimize2 } from \"lucide-react\"\nimport { Button } from \"./button\"\nimport { useState, useRef, useEffect } from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { createPortal } from \"react-dom\"\n\ninterface SheetProps {\n  isOpen: boolean\n  onClose: () => void\n  children: React.ReactNode\n  header?: React.ReactNode\n  footer?: React.ReactNode\n  className?: string\n  enableFullscreen?: boolean\n  position?: 'left' | 'right' | 'bottom'\n  headerClassName?: string\n}\n\n// Create a global registry of open sheets to prevent closing multiple sheets\nlet openSheetRefs: React.RefObject<HTMLDivElement>[] = [];\n\nexport function Sheet({ \n  isOpen, \n  onClose, \n  children, \n  header, \n  footer, \n  className, \n  enableFullscreen = true,\n  position = 'right',\n  headerClassName = ''\n}: SheetProps) {\n  const [isFullscreen, setIsFullscreen] = useState(false)\n  const sheetRef = useRef<HTMLDivElement>(null)\n\n  // When the sheet opens, add its ref to the registry\n  useEffect(() => {\n    if (isOpen) {\n      openSheetRefs.push(sheetRef);\n    } else {\n      // Remove the ref when sheet closes\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    }\n    \n    return () => {\n      // Cleanup when component unmounts\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    };\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      // If we clicked inside any open sheet, don't close any sheets\n      const clickedInsideAnySheet = openSheetRefs.some(ref => \n        ref.current && ref.current.contains(event.target as Node)\n      );\n\n      // Check if clicked on the close button\n      const isCloseButton = (event.target as Element)?.closest('[data-sheet-close]');\n      \n      // Only close if not clicked inside any sheet and not clicking a close button\n      if (!clickedInsideAnySheet && !isCloseButton && sheetRef.current && !sheetRef.current.contains(event.target as Node)) {\n        onClose();\n      }\n    }\n\n    if (isOpen && !isFullscreen) {\n      document.addEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [isOpen, isFullscreen, onClose])\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen) {\n        // Only close the topmost sheet (last one in the registry)\n        if (openSheetRefs[openSheetRefs.length - 1] === sheetRef) {\n          onClose();\n        }\n      }\n    }\n\n    document.addEventListener('keydown', handleEscape)\n    return () => document.removeEventListener('keydown', handleEscape)\n  }, [isOpen, onClose])\n\n  if (!isOpen) return null\n\n  const handleCloseClick = (e: React.MouseEvent) => {\n    e.stopPropagation(); // Prevent event from bubbling to parent sheets\n    onClose();\n  };\n\n  const content = (\n    <div className=\"flex flex-col h-full\">\n      <div className={cn(\n        \"flex items-center justify-between py-4 px-4 h-header border-b\",\n        headerClassName\n      )}>\n        <div className=\"text-sm font-medium\">{header}</div>\n        <div className=\"flex items-center gap-1 ml-auto\">\n          {enableFullscreen && (\n            <Button \n              variant=\"ghost\" \n              size=\"icon\" \n              className=\"h-7 w-7\"\n              onClick={(e) => {\n                e.stopPropagation();\n                setIsFullscreen(!isFullscreen);\n              }}\n            >\n              {isFullscreen ? (\n                <Minimize2 className=\"h-3.5 w-3.5\" />\n              ) : (\n                <Maximize2 className=\"h-3.5 w-3.5\" />\n              )}\n            </Button>\n          )}\n          <Button \n            variant=\"ghost\" \n            size=\"icon\" \n            className=\"h-7 w-7\"\n            onClick={handleCloseClick}\n            data-sheet-close=\"true\"\n          >\n            <X className=\"h-3.5 w-3.5\" />\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"flex-1 overflow-auto\">\n        {children}\n      </div>\n\n      {footer && (\n        <div className=\"border-t py-2 px-3\">\n          <div className=\"text-sm\">{footer}</div>\n        </div>\n      )}\n    </div>\n  )\n\n  // Determine animation properties based on position\n  const getAnimationProps = () => {\n    if (position === 'left') {\n      return {\n        initial: { x: -100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: -100, opacity: 0 },\n      }\n    } else if (position === 'bottom') {\n      return {\n        initial: { y: 100, opacity: 0 },\n        animate: { y: 0, opacity: 1 },\n        exit: { y: 100, opacity: 0 },\n      }\n    } else { // right (default)\n      return {\n        initial: { x: 100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: 100, opacity: 0 },\n      }\n    }\n  }\n\n  // Determine position classes based on position\n  const getPositionClasses = () => {\n    if (isFullscreen) {\n      return \"inset-4 rounded-lg\"\n    } else if (position === 'left') {\n      return \"inset-y-0 left-0 border-r\"\n    } else if (position === 'bottom') {\n      return \"inset-x-0 bottom-0 border-t\"\n    } else { // right (default)\n      return \"inset-y-0 right-0 border-l\"\n    }\n  }\n\n  const animationProps = getAnimationProps()\n  const positionClasses = getPositionClasses()\n\n  const sheetContent = (\n    <AnimatePresence>\n      {isOpen && (\n        <>\n          {/* Backdrop */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            exit={{ opacity: 0 }}\n            onClick={(e) => {\n              e.stopPropagation();\n              onClose();\n            }}\n            className={cn(\n              \"fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n              isFullscreen ? \"block\" : \"hidden\"\n            )}\n          />\n\n          {/* Sheet/Modal */}\n          <motion.div\n            ref={sheetRef}\n            initial={animationProps.initial}\n            animate={animationProps.animate}\n            exit={animationProps.exit}\n            transition={{ \n              duration: 0.3,\n              ease: [0.32, 0.72, 0, 1]\n            }}\n            className={cn(\n              \"fixed z-[100] bg-background shadow-lg flex flex-col\",\n              positionClasses,\n              className\n            )}\n          >\n            {content}\n          </motion.div>\n        </>\n      )}\n    </AnimatePresence>\n  )\n\n  return createPortal(sheetContent, document.body)\n} "],"names":["openSheetRefs","Sheet","isOpen","onClose","children","header","footer","className","enableFullscreen","position","headerClassName","isFullscreen","setIsFullscreen","useState","sheetRef","useRef","useEffect","ref","handleClickOutside","event","clickedInsideAnySheet","isCloseButton","_a","handleEscape","handleCloseClick","e","content","jsxs","cn","jsx","Button","Minimize2","Maximize2","X","getAnimationProps","getPositionClasses","animationProps","positionClasses","sheetContent","AnimatePresence","Fragment","motion","createPortal"],"mappings":"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"}
+{"version":3,"file":"sheet.js","sources":["../../src/components/sheet.tsx"],"sourcesContent":["import { X, Maximize2, Minimize2 } from \"lucide-react\"\nimport { Button } from \"./button\"\nimport { useState, useRef, useEffect } from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { createPortal } from \"react-dom\"\n\ninterface SheetProps {\n  isOpen: boolean\n  onClose: () => void\n  children: React.ReactNode\n  header?: React.ReactNode\n  footer?: React.ReactNode\n  className?: string\n  enableFullscreen?: boolean\n  position?: 'left' | 'right' | 'bottom'\n  headerClassName?: string\n}\n\n// Create a global registry of open sheets to prevent closing multiple sheets\nlet openSheetRefs: React.RefObject<HTMLDivElement>[] = [];\n\nexport function Sheet({ \n  isOpen, \n  onClose, \n  children, \n  header, \n  footer, \n  className, \n  enableFullscreen = true,\n  position = 'right',\n  headerClassName = ''\n}: SheetProps) {\n  const [isFullscreen, setIsFullscreen] = useState(false)\n  const sheetRef = useRef<HTMLDivElement>(null)\n\n  // When the sheet opens, add its ref to the registry\n  useEffect(() => {\n    if (isOpen) {\n      openSheetRefs.push(sheetRef);\n    } else {\n      // Remove the ref when sheet closes\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    }\n    \n    return () => {\n      // Cleanup when component unmounts\n      openSheetRefs = openSheetRefs.filter(ref => ref !== sheetRef);\n    };\n  }, [isOpen]);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      // If we clicked inside any open sheet, don't close any sheets\n      const clickedInsideAnySheet = openSheetRefs.some(ref => \n        ref.current && ref.current.contains(event.target as Node)\n      );\n\n      // Check if clicked on the close button\n      const isCloseButton = (event.target as Element)?.closest('[data-sheet-close]');\n      \n      // Only close if not clicked inside any sheet and not clicking a close button\n      if (!clickedInsideAnySheet && !isCloseButton && sheetRef.current && !sheetRef.current.contains(event.target as Node)) {\n        onClose();\n      }\n    }\n\n    if (isOpen && !isFullscreen) {\n      document.addEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [isOpen, isFullscreen, onClose])\n\n  useEffect(() => {\n    const handleEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isOpen) {\n        // Only close the topmost sheet (last one in the registry)\n        if (openSheetRefs[openSheetRefs.length - 1] === sheetRef) {\n          onClose();\n        }\n      }\n    }\n\n    document.addEventListener('keydown', handleEscape)\n    return () => document.removeEventListener('keydown', handleEscape)\n  }, [isOpen, onClose])\n\n  if (!isOpen) return null\n\n  const handleCloseClick = (e: React.MouseEvent) => {\n    e.stopPropagation(); // Prevent event from bubbling to parent sheets\n    onClose();\n  };\n\n  const content = (\n    <div className=\"flex flex-col h-full\">\n      <div className={cn(\n        \"flex items-center justify-between py-4 px-4 h-header border-b border-border/50\",\n        headerClassName\n      )}>\n        <div className=\"text-sm font-medium\">{header}</div>\n        <div className=\"flex items-center gap-1 ml-auto\">\n          {enableFullscreen && (\n            <Button \n              variant=\"ghost\" \n              size=\"icon\" \n              className=\"h-7 w-7\"\n              onClick={(e) => {\n                e.stopPropagation();\n                setIsFullscreen(!isFullscreen);\n              }}\n            >\n              {isFullscreen ? (\n                <Minimize2 className=\"h-3.5 w-3.5\" />\n              ) : (\n                <Maximize2 className=\"h-3.5 w-3.5\" />\n              )}\n            </Button>\n          )}\n          <Button \n            variant=\"ghost\" \n            size=\"icon\" \n            className=\"h-7 w-7\"\n            onClick={handleCloseClick}\n            data-sheet-close=\"true\"\n          >\n            <X className=\"h-3.5 w-3.5\" />\n          </Button>\n        </div>\n      </div>\n\n      <div className=\"flex-1 overflow-auto\">\n        {children}\n      </div>\n\n      {footer && (\n        <div className=\"border-t border-border/50 py-2 px-3\">\n          <div className=\"text-sm\">{footer}</div>\n        </div>\n      )}\n    </div>\n  )\n\n  // Determine animation properties based on position\n  const getAnimationProps = () => {\n    if (position === 'left') {\n      return {\n        initial: { x: -100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: -100, opacity: 0 },\n      }\n    } else if (position === 'bottom') {\n      return {\n        initial: { y: 100, opacity: 0 },\n        animate: { y: 0, opacity: 1 },\n        exit: { y: 100, opacity: 0 },\n      }\n    } else { // right (default)\n      return {\n        initial: { x: 100, opacity: 0 },\n        animate: { x: 0, opacity: 1 },\n        exit: { x: 100, opacity: 0 },\n      }\n    }\n  }\n\n  // Determine position classes based on position\n  const getPositionClasses = () => {\n    if (isFullscreen) {\n      return \"inset-4 rounded-lg\"\n    } else if (position === 'left') {\n      return \"inset-y-0 left-0 border-r\"\n    } else if (position === 'bottom') {\n      return \"inset-x-0 bottom-0 border-t\"\n    } else { // right (default)\n      return \"inset-y-0 right-0 border-l\"\n    }\n  }\n\n  const animationProps = getAnimationProps()\n  const positionClasses = getPositionClasses()\n\n  const sheetContent = (\n    <AnimatePresence>\n      {isOpen && (\n        <>\n          {/* Backdrop */}\n          <motion.div\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            exit={{ opacity: 0 }}\n            onClick={(e) => {\n              e.stopPropagation();\n              onClose();\n            }}\n            className={cn(\n              \"fixed inset-0 z-[100] bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n              isFullscreen ? \"block\" : \"hidden\"\n            )}\n          />\n\n          {/* Sheet/Modal */}\n          <motion.div\n            ref={sheetRef}\n            initial={animationProps.initial}\n            animate={animationProps.animate}\n            exit={animationProps.exit}\n            transition={{ \n              duration: 0.3,\n              ease: [0.32, 0.72, 0, 1]\n            }}\n            className={cn(\n              \"fixed z-[100] bg-background shadow-lg flex flex-col border-border/50\",\n              positionClasses,\n              className\n            )}\n          >\n            {content}\n          </motion.div>\n        </>\n      )}\n    </AnimatePresence>\n  )\n\n  return createPortal(sheetContent, document.body)\n} "],"names":["openSheetRefs","Sheet","isOpen","onClose","children","header","footer","className","enableFullscreen","position","headerClassName","isFullscreen","setIsFullscreen","useState","sheetRef","useRef","useEffect","ref","handleClickOutside","event","clickedInsideAnySheet","isCloseButton","_a","handleEscape","handleCloseClick","e","content","jsxs","cn","jsx","Button","Minimize2","Maximize2","X","getAnimationProps","getPositionClasses","animationProps","positionClasses","sheetContent","AnimatePresence","Fragment","motion","createPortal"],"mappings":"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"}

package/dist/components/stepper.esm.js

@@ -1,214 +1,7 @@
-import { j as e } from "../jsx-runtime-DGlMoOmv.js";
-import { c as a } from "../utils-qaFjX9_3.js";
-import { motion as t, AnimatePresence as k } from "framer-motion";
-import { Modal as L } from "./modal.esm.js";
-import { Button as d } from "./button.esm.js";
-function A({ steps: o, className: s }) {
-  return /* @__PURE__ */ e.jsx("div", { className: a("py-6 space-y-5", s), children: o.map((i, r) => /* @__PURE__ */ e.jsxs(
-    t.div,
-    {
-      className: "relative",
-      initial: { opacity: 0, y: 10 },
-      animate: { opacity: 1, y: 0 },
-      transition: { delay: r * 0.1, duration: 0.3 },
-      children: [
-        r !== 0 && /* @__PURE__ */ e.jsx(
-          t.div,
-          {
-            className: a(
-              "absolute left-[15px] -top-[26px] w-[2px] h-[24px] origin-top",
-              i.isCompleted || i.isCurrent ? "bg-primary/60" : "bg-border"
-            ),
-            initial: { scaleY: 0 },
-            animate: { scaleY: 1 },
-            transition: { delay: r * 0.1 + 0.2, duration: 0.2 }
-          }
-        ),
-        /* @__PURE__ */ e.jsxs("div", { className: "flex gap-4 items-start", children: [
-          /* @__PURE__ */ e.jsx(
-            t.div,
-            {
-              className: a(
-                "w-[30px] h-[30px] rounded-full flex items-center justify-center text-xs font-medium shrink-0 transition-all",
-                i.isCompleted && "bg-primary text-primary-foreground shadow-sm shadow-primary/20",
-                i.isCurrent && "border-2 border-primary bg-primary/10 text-primary",
-                !i.isCompleted && !i.isCurrent && "border-2 border-muted-foreground/30 text-muted-foreground"
-              ),
-              whileHover: { scale: 1.05 },
-              whileTap: { scale: 0.98 },
-              transition: { duration: 0.2 },
-              children: i.isCompleted ? /* @__PURE__ */ e.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e.jsx(
-                "path",
-                {
-                  d: "M7.75 12.75L10 15.25L16.25 8.75",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round"
-                }
-              ) }) : r + 1
-            }
-          ),
-          /* @__PURE__ */ e.jsxs("div", { className: "space-y-0.5 pt-0.5", children: [
-            /* @__PURE__ */ e.jsx("h3", { className: a(
-              "text-sm font-medium transition-colors",
-              i.isCurrent && "text-primary",
-              i.isCompleted && "text-foreground",
-              !i.isCurrent && !i.isCompleted && "text-muted-foreground"
-            ), children: i.title }),
-            i.description && /* @__PURE__ */ e.jsx("p", { className: a(
-              "text-xs text-muted-foreground leading-relaxed",
-              i.isCurrent && "text-muted-foreground/90"
-            ), children: i.description })
-          ] })
-        ] })
-      ]
-    },
-    i.title
-  )) });
-}
-function O({
-  children: o,
-  title: s,
-  sidebar: i,
-  subclassName: r
-}) {
-  return /* @__PURE__ */ e.jsxs("div", { className: "flex h-scroll-xl overflow-hidden", children: [
-    /* @__PURE__ */ e.jsx(
-      t.div,
-      {
-        className: "border-r bg-gradient-to-b from-muted/30 to-muted/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]",
-        initial: { opacity: 0, x: -10 },
-        animate: { opacity: 1, x: 0 },
-        transition: { duration: 0.3, ease: "easeInOut" },
-        children: i
-      }
-    ),
-    /* @__PURE__ */ e.jsxs(
-      t.div,
-      {
-        className: a("flex-1 px-5 py-4 overflow-y-auto", r),
-        initial: { opacity: 0, x: 5 },
-        animate: { opacity: 1, x: 0 },
-        transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" },
-        children: [
-          s && /* @__PURE__ */ e.jsx("div", { className: "flex items-center mb-5", children: /* @__PURE__ */ e.jsx("h2", { className: "text-lg font-semibold text-foreground", children: s }) }),
-          /* @__PURE__ */ e.jsx("div", { className: "h-full", children: o })
-        ]
-      }
-    )
-  ] });
-}
-function E({
-  isOpen: o,
-  onClose: s,
-  title: i,
-  description: r,
-  icon: m,
-  currentStep: l,
-  totalSteps: n,
-  onBack: u,
-  onNext: f,
-  onComplete: h,
-  sidebar: p,
-  children: y,
-  continueText: j = "Continue",
-  completeText: g = "Complete",
-  isNextDisabled: c = !1,
-  isNextLoading: x = !1,
-  size: v = "2xl",
-  stepLayoutSubclassName: b,
-  isShowBackButton: N = !0,
-  isModelContentScrollable: w = !1
-}) {
-  const C = (l + 1) / n * 100;
-  return /* @__PURE__ */ e.jsxs(
-    L,
-    {
-      isOpen: o,
-      onClose: s,
-      size: v,
-      showClose: !0,
-      title: i,
-      isContentScrollable: w,
-      description: r,
-      icon: m && /* @__PURE__ */ e.jsx("div", { className: "bg-primary/10 p-2 rounded-full", children: /* @__PURE__ */ e.jsx(m, { className: "h-5 w-5 text-primary" }) }),
-      contentClassName: "px-0 pt-0 pb-0",
-      footer: /* @__PURE__ */ e.jsxs("div", { className: "w-full flex items-center justify-between", children: [
-        /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: l > 0 && N && /* @__PURE__ */ e.jsx(
-          d,
-          {
-            variant: "ghost",
-            onClick: u,
-            size: "sm",
-            className: "text-muted-foreground hover:text-foreground transition-colors",
-            children: "Back"
-          }
-        ) }),
-        /* @__PURE__ */ e.jsxs("div", { className: "flex-1 flex justify-center text-xs text-muted-foreground", children: [
-          "Step ",
-          l + 1,
-          " of ",
-          n
-        ] }),
-        /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex justify-end", children: l < n - 1 ? /* @__PURE__ */ e.jsx(
-          d,
-          {
-            onClick: f,
-            disabled: c,
-            isLoading: x,
-            size: "sm",
-            className: "bg-primary text-primary-foreground hover:bg-primary/90",
-            children: j
-          }
-        ) : /* @__PURE__ */ e.jsx(
-          d,
-          {
-            onClick: h,
-            disabled: c,
-            isLoading: x,
-            size: "sm",
-            className: "bg-primary text-primary-foreground hover:bg-primary/90",
-            children: g
-          }
-        ) })
-      ] }),
-      children: [
-        /* @__PURE__ */ e.jsx("div", { className: "w-full h-0.5 bg-muted relative mb-1", children: /* @__PURE__ */ e.jsx(
-          t.div,
-          {
-            className: "absolute top-0 left-0 h-full bg-primary",
-            initial: { width: 0 },
-            animate: { width: `${C}%` },
-            transition: { duration: 0.3, ease: "easeInOut" }
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(
-          O,
-          {
-            sidebar: p,
-            subclassName: b,
-            children: /* @__PURE__ */ e.jsx(k, { mode: "wait", children: /* @__PURE__ */ e.jsx(
-              t.div,
-              {
-                initial: { opacity: 0, y: 10 },
-                animate: { opacity: 1, y: 0 },
-                exit: { opacity: 0, y: -10 },
-                transition: { duration: 0.25, ease: "easeInOut" },
-                className: "h-full",
-                children: y
-              },
-              l
-            ) })
-          }
-        )
-      ]
-    }
-  );
-}
+import { a as p, S as t, b as o } from "../stepper-modal-SYU9mbXs.js";
 export {
-  O as StepLayout,
-  A as Stepper,
-  E as StepperModal
+  p as StepLayout,
+  t as Stepper,
+  o as StepperModal
 };
 //# sourceMappingURL=stepper.esm.js.map

package/dist/components/stepper.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.esm.js","sources":["../../src/components/stepper/stepper.tsx","../../src/components/stepper/step-layout.tsx","../../src/components/stepper/stepper-modal.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { motion } from \"framer-motion\"\nimport { Step } from \"./types\"\n\ninterface StepperProps {\n  steps: Step[]\n  className?: string\n}\n\nexport function Stepper({ steps, className }: StepperProps) {\n  return (\n    <div className={cn(\"py-6 space-y-5\", className)}>\n      {steps.map((step, index) => (\n        <motion.div \n          key={step.title} \n          className=\"relative\"\n          initial={{ opacity: 0, y: 10 }}\n          animate={{ opacity: 1, y: 0 }}\n          transition={{ delay: index * 0.1, duration: 0.3 }}\n        >\n          {/* Connector line between steps */}\n          {index !== 0 && (\n            <motion.div \n              className={cn(\n                \"absolute left-[15px] -top-[26px] w-[2px] h-[24px] origin-top\",\n                step.isCompleted || step.isCurrent ? \"bg-primary/60\" : \"bg-border\"\n              )}\n              initial={{ scaleY: 0 }}\n              animate={{ scaleY: 1 }}\n              transition={{ delay: index * 0.1 + 0.2, duration: 0.2 }}\n            />\n          )}\n          \n          <div className=\"flex gap-4 items-start\">\n            {/* Step indicator circle */}\n            <motion.div \n              className={cn(\n                \"w-[30px] h-[30px] rounded-full flex items-center justify-center text-xs font-medium shrink-0 transition-all\",\n                step.isCompleted && \"bg-primary text-primary-foreground shadow-sm shadow-primary/20\",\n                step.isCurrent && \"border-2 border-primary bg-primary/10 text-primary\",\n                !step.isCompleted && !step.isCurrent && \"border-2 border-muted-foreground/30 text-muted-foreground\"\n              )}\n              whileHover={{ scale: 1.05 }}\n              whileTap={{ scale: 0.98 }}\n              transition={{ duration: 0.2 }}\n            >\n              {step.isCompleted ? (\n                <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path\n                    d=\"M7.75 12.75L10 15.25L16.25 8.75\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"2\"\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                  />\n                </svg>\n              ) : (\n                index + 1\n              )}\n            </motion.div>\n            \n            {/* Step content */}\n            <div className=\"space-y-0.5 pt-0.5\">\n              <h3 className={cn(\n                \"text-sm font-medium transition-colors\",\n                step.isCurrent && \"text-primary\",\n                step.isCompleted && \"text-foreground\",\n                !step.isCurrent && !step.isCompleted && \"text-muted-foreground\"\n              )}>\n                {step.title}\n              </h3>\n              {step.description && (\n                <p className={cn(\n                  \"text-xs text-muted-foreground leading-relaxed\",\n                  step.isCurrent && \"text-muted-foreground/90\"\n                )}>\n                  {step.description}\n                </p>\n              )}\n            </div>\n          </div>\n        </motion.div>\n      ))}\n    </div>\n  )\n} ","import { cn } from \"@/lib/utils\"\nimport { motion } from \"framer-motion\"\n\ninterface StepLayoutProps {\n  children: React.ReactNode\n  title?: string\n  sidebar?: React.ReactNode\n  subclassName?: string\n}\n\nexport function StepLayout({ \n  children, \n  title,\n  sidebar,\n  subclassName,\n}: StepLayoutProps) {\n  return (\n    <div className=\"flex h-scroll-xl overflow-hidden\">\n      {/* Sidebar with sticky positioning */}\n      <motion.div \n        className=\"border-r bg-gradient-to-b from-muted/30 to-muted/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]\"\n        initial={{ opacity: 0, x: -10 }}\n        animate={{ opacity: 1, x: 0 }}\n        transition={{ duration: 0.3, ease: \"easeInOut\" }}\n      >\n        {sidebar}\n      </motion.div>\n      \n      {/* Main content area */}\n      <motion.div \n        className={cn(\"flex-1 px-5 py-4 overflow-y-auto\", subclassName)}\n        initial={{ opacity: 0, x: 5 }}\n        animate={{ opacity: 1, x: 0 }}\n        transition={{ duration: 0.3, delay: 0.1, ease: \"easeInOut\" }}\n      >\n        {title && (\n          <div className=\"flex items-center mb-5\">\n            <h2 className=\"text-lg font-semibold text-foreground\">{title}</h2>\n          </div>\n        )}\n        <div className=\"h-full\">\n          {children}\n        </div>\n      </motion.div>\n    </div>\n  )\n} ","import { Modal, ModalProps } from \"../modal\"\nimport { StepLayout } from \"./step-layout\"\nimport { Button } from \"../button\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { cn } from \"@/lib/utils\"\n\ninterface StepperModalProps {\n  isOpen: boolean\n  onClose: () => void\n  title: string\n  description?: string\n  icon?: React.ComponentType<any>\n  currentStep: number\n  totalSteps: number\n  onBack: () => void\n  onNext: () => void\n  onComplete: () => void\n  sidebar: React.ReactNode\n  children: React.ReactNode\n  continueText?: string\n  completeText?: string\n  isNextDisabled?: boolean\n  isNextLoading?: boolean\n  size?: ModalProps['size']\n  stepLayoutSubclassName?: string \n  isShowClose?: boolean\n  isShowBackButton?: boolean\n  isModelContentScrollable?: boolean\n}\n\nexport function StepperModal({\n  isOpen,\n  onClose,\n  title,\n  description,\n  icon: Icon,\n  currentStep,\n  totalSteps,\n  onBack,\n  onNext,\n  onComplete,\n  sidebar,\n  children,\n  continueText = \"Continue\",\n  completeText = \"Complete\",\n  isNextDisabled = false,\n  isNextLoading = false,\n  size = \"2xl\",\n  stepLayoutSubclassName,\n  isShowBackButton = true,\n  isModelContentScrollable = false\n}: StepperModalProps) {\n  // Calculate progress percentage\n  const progress = ((currentStep + 1) / totalSteps) * 100;\n  \n  return (\n    <Modal \n      isOpen={isOpen} \n      onClose={onClose}\n      size={size}\n      showClose={true}\n      title={title}\n      isContentScrollable={isModelContentScrollable}\n      description={description}\n      icon={Icon && (\n        <div className=\"bg-primary/10 p-2 rounded-full\">\n          <Icon className=\"h-5 w-5 text-primary\" />\n        </div>\n      )}\n      contentClassName=\"px-0 pt-0 pb-0\"\n      footer={\n        <div className=\"w-full flex items-center justify-between\">\n          <div className=\"flex-1\">\n            {currentStep > 0 && isShowBackButton && (\n              <Button \n                variant=\"ghost\" \n                onClick={onBack}\n                size=\"sm\"\n                className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              >\n                Back\n              </Button>\n            )}\n          </div>\n          \n          <div className=\"flex-1 flex justify-center text-xs text-muted-foreground\">\n            Step {currentStep + 1} of {totalSteps}\n          </div>\n          \n          <div className=\"flex-1 flex justify-end\">\n            {currentStep < totalSteps - 1 ? (\n              <Button \n                onClick={onNext} \n                disabled={isNextDisabled} \n                isLoading={isNextLoading}\n                size=\"sm\"\n                className=\"bg-primary text-primary-foreground hover:bg-primary/90\"\n              >\n                {continueText}\n              </Button>\n            ) : (\n              <Button \n                onClick={onComplete} \n                disabled={isNextDisabled} \n                isLoading={isNextLoading}\n                size=\"sm\"\n                className=\"bg-primary text-primary-foreground hover:bg-primary/90\"\n              >\n                {completeText}\n              </Button>\n            )}\n          </div>\n        </div>\n      }\n    >\n      {/* Progress bar */}\n      <div className=\"w-full h-0.5 bg-muted relative mb-1\">\n        <motion.div \n          className=\"absolute top-0 left-0 h-full bg-primary\"\n          initial={{ width: 0 }}\n          animate={{ width: `${progress}%` }}\n          transition={{ duration: 0.3, ease: \"easeInOut\" }}\n        />\n      </div>\n      \n      <StepLayout\n        sidebar={sidebar}\n        subclassName={stepLayoutSubclassName}\n      >\n        <AnimatePresence mode=\"wait\">\n          <motion.div\n            key={currentStep}\n            initial={{ opacity: 0, y: 10 }}\n            animate={{ opacity: 1, y: 0 }}\n            exit={{ opacity: 0, y: -10 }}\n            transition={{ duration: 0.25, ease: \"easeInOut\" }}\n            className=\"h-full\"\n          >\n            {children}\n          </motion.div>\n        </AnimatePresence>\n      </StepLayout>\n    </Modal>\n  )\n} "],"names":["Stepper","steps","className","jsx","cn","step","index","jsxs","motion","StepLayout","children","title","sidebar","subclassName","StepperModal","isOpen","onClose","description","Icon","currentStep","totalSteps","onBack","onNext","onComplete","continueText","completeText","isNextDisabled","isNextLoading","size","stepLayoutSubclassName","isShowBackButton","isModelContentScrollable","progress","Modal","Button","AnimatePresence"],"mappings":"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"}
+{"version":3,"file":"stepper.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/stepper.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../jsx-runtime-BYECrxsp.cjs"),o=require("../utils-DSKoFOjv.cjs"),i=require("framer-motion"),C=require("./modal.js"),x=require("./button.js");function k({steps:n,className:r}){return e.jsxRuntimeExports.jsx("div",{className:o.cn("py-6 space-y-5",r),children:n.map((t,s)=>e.jsxRuntimeExports.jsxs(i.motion.div,{className:"relative",initial:{opacity:0,y:10},animate:{opacity:1,y:0},transition:{delay:s*.1,duration:.3},children:[s!==0&&e.jsxRuntimeExports.jsx(i.motion.div,{className:o.cn("absolute left-[15px] -top-[26px] w-[2px] h-[24px] origin-top",t.isCompleted||t.isCurrent?"bg-primary/60":"bg-border"),initial:{scaleY:0},animate:{scaleY:1},transition:{delay:s*.1+.2,duration:.2}}),e.jsxRuntimeExports.jsxs("div",{className:"flex gap-4 items-start",children:[e.jsxRuntimeExports.jsx(i.motion.div,{className:o.cn("w-[30px] h-[30px] rounded-full flex items-center justify-center text-xs font-medium shrink-0 transition-all",t.isCompleted&&"bg-primary text-primary-foreground shadow-sm shadow-primary/20",t.isCurrent&&"border-2 border-primary bg-primary/10 text-primary",!t.isCompleted&&!t.isCurrent&&"border-2 border-muted-foreground/30 text-muted-foreground"),whileHover:{scale:1.05},whileTap:{scale:.98},transition:{duration:.2},children:t.isCompleted?e.jsxRuntimeExports.jsx("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsxRuntimeExports.jsx("path",{d:"M7.75 12.75L10 15.25L16.25 8.75",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}):s+1}),e.jsxRuntimeExports.jsxs("div",{className:"space-y-0.5 pt-0.5",children:[e.jsxRuntimeExports.jsx("h3",{className:o.cn("text-sm font-medium transition-colors",t.isCurrent&&"text-primary",t.isCompleted&&"text-foreground",!t.isCurrent&&!t.isCompleted&&"text-muted-foreground"),children:t.title}),t.description&&e.jsxRuntimeExports.jsx("p",{className:o.cn("text-xs text-muted-foreground leading-relaxed",t.isCurrent&&"text-muted-foreground/90"),children:t.description})]})]})]},t.title))})}function c({children:n,title:r,sidebar:t,subclassName:s}){return e.jsxRuntimeExports.jsxs("div",{className:"flex h-scroll-xl overflow-hidden",children:[e.jsxRuntimeExports.jsx(i.motion.div,{className:"border-r bg-gradient-to-b from-muted/30 to-muted/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]",initial:{opacity:0,x:-10},animate:{opacity:1,x:0},transition:{duration:.3,ease:"easeInOut"},children:t}),e.jsxRuntimeExports.jsxs(i.motion.div,{className:o.cn("flex-1 px-5 py-4 overflow-y-auto",s),initial:{opacity:0,x:5},animate:{opacity:1,x:0},transition:{duration:.3,delay:.1,ease:"easeInOut"},children:[r&&e.jsxRuntimeExports.jsx("div",{className:"flex items-center mb-5",children:e.jsxRuntimeExports.jsx("h2",{className:"text-lg font-semibold text-foreground",children:r})}),e.jsxRuntimeExports.jsx("div",{className:"h-full",children:n})]})]})}function L({isOpen:n,onClose:r,title:t,description:s,icon:m,currentStep:a,totalSteps:l,onBack:p,onNext:j,onComplete:h,sidebar:f,children:y,continueText:g="Continue",completeText:b="Complete",isNextDisabled:d=!1,isNextLoading:u=!1,size:v="2xl",stepLayoutSubclassName:R,isShowBackButton:E=!0,isModelContentScrollable:N=!1}){const w=(a+1)/l*100;return e.jsxRuntimeExports.jsxs(C.Modal,{isOpen:n,onClose:r,size:v,showClose:!0,title:t,isContentScrollable:N,description:s,icon:m&&e.jsxRuntimeExports.jsx("div",{className:"bg-primary/10 p-2 rounded-full",children:e.jsxRuntimeExports.jsx(m,{className:"h-5 w-5 text-primary"})}),contentClassName:"px-0 pt-0 pb-0",footer:e.jsxRuntimeExports.jsxs("div",{className:"w-full flex items-center justify-between",children:[e.jsxRuntimeExports.jsx("div",{className:"flex-1",children:a>0&&E&&e.jsxRuntimeExports.jsx(x.Button,{variant:"ghost",onClick:p,size:"sm",className:"text-muted-foreground hover:text-foreground transition-colors",children:"Back"})}),e.jsxRuntimeExports.jsxs("div",{className:"flex-1 flex justify-center text-xs text-muted-foreground",children:["Step ",a+1," of ",l]}),e.jsxRuntimeExports.jsx("div",{className:"flex-1 flex justify-end",children:a<l-1?e.jsxRuntimeExports.jsx(x.Button,{onClick:j,disabled:d,isLoading:u,size:"sm",className:"bg-primary text-primary-foreground hover:bg-primary/90",children:g}):e.jsxRuntimeExports.jsx(x.Button,{onClick:h,disabled:d,isLoading:u,size:"sm",className:"bg-primary text-primary-foreground hover:bg-primary/90",children:b})})]}),children:[e.jsxRuntimeExports.jsx("div",{className:"w-full h-0.5 bg-muted relative mb-1",children:e.jsxRuntimeExports.jsx(i.motion.div,{className:"absolute top-0 left-0 h-full bg-primary",initial:{width:0},animate:{width:`${w}%`},transition:{duration:.3,ease:"easeInOut"}})}),e.jsxRuntimeExports.jsx(c,{sidebar:f,subclassName:R,children:e.jsxRuntimeExports.jsx(i.AnimatePresence,{mode:"wait",children:e.jsxRuntimeExports.jsx(i.motion.div,{initial:{opacity:0,y:10},animate:{opacity:1,y:0},exit:{opacity:0,y:-10},transition:{duration:.25,ease:"easeInOut"},className:"h-full",children:y},a)})})]})}exports.StepLayout=c;exports.Stepper=k;exports.StepperModal=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../stepper-modal-CPlBpxWy.cjs");exports.StepLayout=e.StepLayout;exports.Stepper=e.Stepper;exports.StepperModal=e.StepperModal;
 //# sourceMappingURL=stepper.js.map

package/dist/components/stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.js","sources":["../../src/components/stepper/stepper.tsx","../../src/components/stepper/step-layout.tsx","../../src/components/stepper/stepper-modal.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\"\nimport { motion } from \"framer-motion\"\nimport { Step } from \"./types\"\n\ninterface StepperProps {\n  steps: Step[]\n  className?: string\n}\n\nexport function Stepper({ steps, className }: StepperProps) {\n  return (\n    <div className={cn(\"py-6 space-y-5\", className)}>\n      {steps.map((step, index) => (\n        <motion.div \n          key={step.title} \n          className=\"relative\"\n          initial={{ opacity: 0, y: 10 }}\n          animate={{ opacity: 1, y: 0 }}\n          transition={{ delay: index * 0.1, duration: 0.3 }}\n        >\n          {/* Connector line between steps */}\n          {index !== 0 && (\n            <motion.div \n              className={cn(\n                \"absolute left-[15px] -top-[26px] w-[2px] h-[24px] origin-top\",\n                step.isCompleted || step.isCurrent ? \"bg-primary/60\" : \"bg-border\"\n              )}\n              initial={{ scaleY: 0 }}\n              animate={{ scaleY: 1 }}\n              transition={{ delay: index * 0.1 + 0.2, duration: 0.2 }}\n            />\n          )}\n          \n          <div className=\"flex gap-4 items-start\">\n            {/* Step indicator circle */}\n            <motion.div \n              className={cn(\n                \"w-[30px] h-[30px] rounded-full flex items-center justify-center text-xs font-medium shrink-0 transition-all\",\n                step.isCompleted && \"bg-primary text-primary-foreground shadow-sm shadow-primary/20\",\n                step.isCurrent && \"border-2 border-primary bg-primary/10 text-primary\",\n                !step.isCompleted && !step.isCurrent && \"border-2 border-muted-foreground/30 text-muted-foreground\"\n              )}\n              whileHover={{ scale: 1.05 }}\n              whileTap={{ scale: 0.98 }}\n              transition={{ duration: 0.2 }}\n            >\n              {step.isCompleted ? (\n                <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path\n                    d=\"M7.75 12.75L10 15.25L16.25 8.75\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"2\"\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                  />\n                </svg>\n              ) : (\n                index + 1\n              )}\n            </motion.div>\n            \n            {/* Step content */}\n            <div className=\"space-y-0.5 pt-0.5\">\n              <h3 className={cn(\n                \"text-sm font-medium transition-colors\",\n                step.isCurrent && \"text-primary\",\n                step.isCompleted && \"text-foreground\",\n                !step.isCurrent && !step.isCompleted && \"text-muted-foreground\"\n              )}>\n                {step.title}\n              </h3>\n              {step.description && (\n                <p className={cn(\n                  \"text-xs text-muted-foreground leading-relaxed\",\n                  step.isCurrent && \"text-muted-foreground/90\"\n                )}>\n                  {step.description}\n                </p>\n              )}\n            </div>\n          </div>\n        </motion.div>\n      ))}\n    </div>\n  )\n} ","import { cn } from \"@/lib/utils\"\nimport { motion } from \"framer-motion\"\n\ninterface StepLayoutProps {\n  children: React.ReactNode\n  title?: string\n  sidebar?: React.ReactNode\n  subclassName?: string\n}\n\nexport function StepLayout({ \n  children, \n  title,\n  sidebar,\n  subclassName,\n}: StepLayoutProps) {\n  return (\n    <div className=\"flex h-scroll-xl overflow-hidden\">\n      {/* Sidebar with sticky positioning */}\n      <motion.div \n        className=\"border-r bg-gradient-to-b from-muted/30 to-muted/60 sticky top-0 self-start h-full max-h-[calc(100vh-10rem)]\"\n        initial={{ opacity: 0, x: -10 }}\n        animate={{ opacity: 1, x: 0 }}\n        transition={{ duration: 0.3, ease: \"easeInOut\" }}\n      >\n        {sidebar}\n      </motion.div>\n      \n      {/* Main content area */}\n      <motion.div \n        className={cn(\"flex-1 px-5 py-4 overflow-y-auto\", subclassName)}\n        initial={{ opacity: 0, x: 5 }}\n        animate={{ opacity: 1, x: 0 }}\n        transition={{ duration: 0.3, delay: 0.1, ease: \"easeInOut\" }}\n      >\n        {title && (\n          <div className=\"flex items-center mb-5\">\n            <h2 className=\"text-lg font-semibold text-foreground\">{title}</h2>\n          </div>\n        )}\n        <div className=\"h-full\">\n          {children}\n        </div>\n      </motion.div>\n    </div>\n  )\n} ","import { Modal, ModalProps } from \"../modal\"\nimport { StepLayout } from \"./step-layout\"\nimport { Button } from \"../button\"\nimport { motion, AnimatePresence } from \"framer-motion\"\nimport { cn } from \"@/lib/utils\"\n\ninterface StepperModalProps {\n  isOpen: boolean\n  onClose: () => void\n  title: string\n  description?: string\n  icon?: React.ComponentType<any>\n  currentStep: number\n  totalSteps: number\n  onBack: () => void\n  onNext: () => void\n  onComplete: () => void\n  sidebar: React.ReactNode\n  children: React.ReactNode\n  continueText?: string\n  completeText?: string\n  isNextDisabled?: boolean\n  isNextLoading?: boolean\n  size?: ModalProps['size']\n  stepLayoutSubclassName?: string \n  isShowClose?: boolean\n  isShowBackButton?: boolean\n  isModelContentScrollable?: boolean\n}\n\nexport function StepperModal({\n  isOpen,\n  onClose,\n  title,\n  description,\n  icon: Icon,\n  currentStep,\n  totalSteps,\n  onBack,\n  onNext,\n  onComplete,\n  sidebar,\n  children,\n  continueText = \"Continue\",\n  completeText = \"Complete\",\n  isNextDisabled = false,\n  isNextLoading = false,\n  size = \"2xl\",\n  stepLayoutSubclassName,\n  isShowBackButton = true,\n  isModelContentScrollable = false\n}: StepperModalProps) {\n  // Calculate progress percentage\n  const progress = ((currentStep + 1) / totalSteps) * 100;\n  \n  return (\n    <Modal \n      isOpen={isOpen} \n      onClose={onClose}\n      size={size}\n      showClose={true}\n      title={title}\n      isContentScrollable={isModelContentScrollable}\n      description={description}\n      icon={Icon && (\n        <div className=\"bg-primary/10 p-2 rounded-full\">\n          <Icon className=\"h-5 w-5 text-primary\" />\n        </div>\n      )}\n      contentClassName=\"px-0 pt-0 pb-0\"\n      footer={\n        <div className=\"w-full flex items-center justify-between\">\n          <div className=\"flex-1\">\n            {currentStep > 0 && isShowBackButton && (\n              <Button \n                variant=\"ghost\" \n                onClick={onBack}\n                size=\"sm\"\n                className=\"text-muted-foreground hover:text-foreground transition-colors\"\n              >\n                Back\n              </Button>\n            )}\n          </div>\n          \n          <div className=\"flex-1 flex justify-center text-xs text-muted-foreground\">\n            Step {currentStep + 1} of {totalSteps}\n          </div>\n          \n          <div className=\"flex-1 flex justify-end\">\n            {currentStep < totalSteps - 1 ? (\n              <Button \n                onClick={onNext} \n                disabled={isNextDisabled} \n                isLoading={isNextLoading}\n                size=\"sm\"\n                className=\"bg-primary text-primary-foreground hover:bg-primary/90\"\n              >\n                {continueText}\n              </Button>\n            ) : (\n              <Button \n                onClick={onComplete} \n                disabled={isNextDisabled} \n                isLoading={isNextLoading}\n                size=\"sm\"\n                className=\"bg-primary text-primary-foreground hover:bg-primary/90\"\n              >\n                {completeText}\n              </Button>\n            )}\n          </div>\n        </div>\n      }\n    >\n      {/* Progress bar */}\n      <div className=\"w-full h-0.5 bg-muted relative mb-1\">\n        <motion.div \n          className=\"absolute top-0 left-0 h-full bg-primary\"\n          initial={{ width: 0 }}\n          animate={{ width: `${progress}%` }}\n          transition={{ duration: 0.3, ease: \"easeInOut\" }}\n        />\n      </div>\n      \n      <StepLayout\n        sidebar={sidebar}\n        subclassName={stepLayoutSubclassName}\n      >\n        <AnimatePresence mode=\"wait\">\n          <motion.div\n            key={currentStep}\n            initial={{ opacity: 0, y: 10 }}\n            animate={{ opacity: 1, y: 0 }}\n            exit={{ opacity: 0, y: -10 }}\n            transition={{ duration: 0.25, ease: \"easeInOut\" }}\n            className=\"h-full\"\n          >\n            {children}\n          </motion.div>\n        </AnimatePresence>\n      </StepLayout>\n    </Modal>\n  )\n} "],"names":["Stepper","steps","className","jsx","cn","step","index","jsxs","motion","StepLayout","children","title","sidebar","subclassName","StepperModal","isOpen","onClose","description","Icon","currentStep","totalSteps","onBack","onNext","onComplete","continueText","completeText","isNextDisabled","isNextLoading","size","stepLayoutSubclassName","isShowBackButton","isModelContentScrollable","progress","Modal","Button","AnimatePresence"],"mappings":"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"}
+{"version":3,"file":"stepper.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}