@particle-academy/react-fancy 5.12.0 → 5.14.0

package/dist/chunk-PPLR2DNC.cjs

@@ -0,0 +1,41 @@
+'use strict';
+
+var chunkYLGTDBB2_cjs = require('./chunk-YLGTDBB2.cjs');
+var chunk3Z6ALUWP_cjs = require('./chunk-3Z6ALUWP.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+
+function Field({
+  label,
+  description,
+  error,
+  required,
+  htmlFor,
+  size = "md",
+  children,
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...rest, "data-react-fancy-field": "", className: chunk3Z6ALUWP_cjs.cn("flex flex-col gap-2", className), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsxs(
+      "label",
+      {
+        htmlFor,
+        className: chunk3Z6ALUWP_cjs.cn(
+          "font-medium text-zinc-700 dark:text-zinc-100",
+          chunkYLGTDBB2_cjs.labelSizeClasses[size]
+        ),
+        children: [
+          label,
+          required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" })
+        ]
+      }
+    ),
+    children,
+    description && !error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: description }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-red-500", children: error })
+  ] });
+}
+
+exports.Field = Field;
+//# sourceMappingURL=chunk-PPLR2DNC.cjs.map
+//# sourceMappingURL=chunk-PPLR2DNC.cjs.map

package/dist/chunk-PPLR2DNC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/inputs/Field/Field.tsx"],"names":["jsxs","cn","labelSizeClasses","jsx"],"mappings":";;;;;;AAIO,SAAS,KAAA,CAAM;AAAA,EACpB,KAAA;AAAA,EACA,WAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAe;AACb,EAAA,uBACEA,eAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,wBAAA,EAAuB,IAAG,SAAA,EAAWC,oBAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA,EACpF,QAAA,EAAA;AAAA,IAAA,KAAA,oBACCD,eAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,SAAA,EAAWC,oBAAA;AAAA,UACT,8CAAA;AAAA,UACAC,mCAAiB,IAAI;AAAA,SACvB;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,UACA,QAAA,oBAAYC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAsB,QAAA,EAAA,GAAA,EAAC;AAAA;AAAA;AAAA,KACtD;AAAA,IAED,QAAA;AAAA,IACA,eAAe,CAAC,KAAA,mCACd,GAAA,EAAA,EAAE,SAAA,EAAU,4CACV,QAAA,EAAA,WAAA,EACH,CAAA;AAAA,IAED,KAAA,oBAASA,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,wBAAwB,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EACvD,CAAA;AAEJ","file":"chunk-PPLR2DNC.cjs","sourcesContent":["import { cn } from \"../../../utils/cn\";\nimport { labelSizeClasses } from \"../inputs.utils\";\nimport type { FieldProps } from \"./Field.types\";\n\nexport function Field({\n  label,\n  description,\n  error,\n  required,\n  htmlFor,\n  size = \"md\",\n  children,\n  className,\n  ...rest\n}: FieldProps) {\n  return (\n    <div {...rest} data-react-fancy-field=\"\" className={cn(\"flex flex-col gap-2\", className)}>\n      {label && (\n        <label\n          htmlFor={htmlFor}\n          className={cn(\n            \"font-medium text-zinc-700 dark:text-zinc-100\",\n            labelSizeClasses[size],\n          )}\n        >\n          {label}\n          {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n        </label>\n      )}\n      {children}\n      {description && !error && (\n        <p className=\"text-xs text-zinc-500 dark:text-zinc-400\">\n          {description}\n        </p>\n      )}\n      {error && <p className=\"text-xs text-red-500\">{error}</p>}\n    </div>\n  );\n}\n"]}

package/dist/chunk-PQWQ5K6J.js

@@ -0,0 +1,15 @@
+import { FieldModeContext } from './chunk-NRXK42LO.js';
+import { useMemo } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+function FormProvider({ mode = "edit", children }) {
+  const value = useMemo(() => ({ mode }), [mode]);
+  return /* @__PURE__ */ jsx(FieldModeContext.Provider, { value, children });
+}
+function Form({ mode, children, ...formProps }) {
+  return /* @__PURE__ */ jsx(FormProvider, { mode, children: /* @__PURE__ */ jsx("form", { "data-react-fancy-form": "", ...formProps, children }) });
+}
+
+export { Form, FormProvider };
+//# sourceMappingURL=chunk-PQWQ5K6J.js.map
+//# sourceMappingURL=chunk-PQWQ5K6J.js.map

package/dist/chunk-PQWQ5K6J.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/inputs/mode/Form.tsx"],"names":[],"mappings":";;;;AAoBO,SAAS,YAAA,CAAa,EAAE,IAAA,GAAO,MAAA,EAAQ,UAAS,EAAsB;AAC3E,EAAA,MAAM,KAAA,GAAQ,QAAQ,OAAO,EAAE,MAAK,CAAA,EAAI,CAAC,IAAI,CAAC,CAAA;AAC9C,EAAA,uBAAO,GAAA,CAAC,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,OAAe,QAAA,EAAS,CAAA;AAC5D;AAOO,SAAS,KAAK,EAAE,IAAA,EAAM,QAAA,EAAU,GAAG,WAAU,EAAc;AAChE,EAAA,uBACE,GAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EACZ,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,yBAAsB,EAAA,EAAI,GAAG,SAAA,EAChC,QAAA,EACH,CAAA,EACF,CAAA;AAEJ","file":"chunk-PQWQ5K6J.js","sourcesContent":["import { useMemo, type FormHTMLAttributes, type ReactNode } from \"react\";\nimport type { FieldMode } from \"../inputs.types\";\nimport { FieldModeContext } from \"./FieldMode.context\";\n\nexport interface FormProviderProps {\n  /** `\"edit\"` (default) or `\"view\"` — applied to every input below that doesn't override it. */\n  mode?: FieldMode;\n  children?: ReactNode;\n}\n\nexport interface FormProps extends FormHTMLAttributes<HTMLFormElement> {\n  /** `\"edit\"` (default) or `\"view\"` — applied to every input inside. */\n  mode?: FieldMode;\n}\n\n/**\n * Provide a form-wide {@link FieldMode} to every Fancy input below — flip a\n * whole form from editable to read-only display in one place. Pure context, no\n * DOM (use it to wrap a filter bar or any tree that isn't a `<form>`).\n */\nexport function FormProvider({ mode = \"edit\", children }: FormProviderProps) {\n  const value = useMemo(() => ({ mode }), [mode]);\n  return <FieldModeContext.Provider value={value}>{children}</FieldModeContext.Provider>;\n}\n\n/**\n * A real `<form>` that also broadcasts a form-wide {@link FieldMode} to the\n * inputs inside it (sugar over {@link FormProvider}). Per-input `mode` props\n * still override this.\n */\nexport function Form({ mode, children, ...formProps }: FormProps) {\n  return (\n    <FormProvider mode={mode}>\n      <form data-react-fancy-form=\"\" {...formProps}>\n        {children}\n      </form>\n    </FormProvider>\n  );\n}\n"]}

package/dist/chunk-PRDWJ4AR.js

@@ -0,0 +1,215 @@
+import { useFocusTrap } from './chunk-5U2DZ7AV.js';
+import { useAnimation } from './chunk-CHADHN6M.js';
+import { Portal } from './chunk-WHEXTDPV.js';
+import { useEscapeKey } from './chunk-JXE5XID6.js';
+import { cn } from './chunk-DSUHZO6T.js';
+import { createContext, useRef, useCallback, useEffect, useMemo, useContext } from 'react';
+import { X } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var DrawerContext = createContext(null);
+function useDrawer() {
+  const ctx = useContext(DrawerContext);
+  if (!ctx) {
+    throw new Error("Drawer compound components must be used within <Drawer>");
+  }
+  return ctx;
+}
+function DrawerHeader({ children, closable = true, className }) {
+  const { close } = useDrawer();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-react-fancy-drawer-header": "",
+      className: cn(
+        "flex shrink-0 items-center justify-between border-b border-zinc-200 px-4 py-3 dark:border-zinc-700",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-100", children }),
+        closable ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: close,
+            className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
+            "aria-label": "Close",
+            children: /* @__PURE__ */ jsx(X, { size: 18 })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+DrawerHeader.displayName = "DrawerHeader";
+function DrawerBody({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-react-fancy-drawer-body": "",
+      className: cn("min-h-0 flex-1 overflow-auto px-4 py-3 text-zinc-700 dark:text-zinc-300", className),
+      children
+    }
+  );
+}
+DrawerBody.displayName = "DrawerBody";
+function DrawerFooter({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-react-fancy-drawer-footer": "",
+      className: cn(
+        "flex shrink-0 items-center justify-end gap-2 border-t border-zinc-200 px-4 py-3 dark:border-zinc-700",
+        className
+      ),
+      children
+    }
+  );
+}
+DrawerFooter.displayName = "DrawerFooter";
+function DrawerContainer({ children, className, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-react-fancy-drawer-container": "",
+      ...rest,
+      className: cn("relative overflow-hidden", className),
+      children
+    }
+  );
+}
+DrawerContainer.displayName = "DrawerContainer";
+var WIDTH = {
+  sm: "w-64",
+  md: "w-80",
+  lg: "w-96",
+  xl: "w-[32rem]",
+  full: "w-full"
+};
+var HEIGHT = {
+  sm: "h-32",
+  md: "h-64",
+  lg: "h-96",
+  xl: "h-[32rem]",
+  full: "h-full"
+};
+var ANCHOR = {
+  left: "inset-y-0 left-0",
+  right: "inset-y-0 right-0",
+  top: "inset-x-0 top-0",
+  bottom: "inset-x-0 bottom-0"
+};
+var ENTER = {
+  left: "fancy-slide-in-left",
+  right: "fancy-slide-in-right",
+  top: "fancy-slide-in-top",
+  bottom: "fancy-slide-in-bottom"
+};
+var EXIT = {
+  left: "fancy-slide-out-left",
+  right: "fancy-slide-out-right",
+  top: "fancy-slide-out-top",
+  bottom: "fancy-slide-out-bottom"
+};
+var EDGE = {
+  left: "border-r",
+  right: "border-l",
+  top: "border-b",
+  bottom: "border-t"
+};
+function DrawerRoot({
+  children,
+  open,
+  onClose,
+  side = "right",
+  size = "md",
+  attach = "viewport",
+  backdrop = true,
+  dismissOnBackdrop = true,
+  dismissOnEscape = true,
+  className,
+  ...rest
+}) {
+  const panelRef = useRef(null);
+  const horizontal = side === "left" || side === "right";
+  const isViewport = attach === "viewport";
+  const close = useCallback(() => onClose(), [onClose]);
+  useEscapeKey(close, open && dismissOnEscape);
+  useFocusTrap(panelRef, open && isViewport);
+  useEffect(() => {
+    if (!open || !isViewport) return;
+    const original = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    return () => {
+      document.body.style.overflow = original;
+    };
+  }, [open, isViewport]);
+  const { mounted, className: animClass, ref: animRef } = useAnimation({
+    open,
+    enterClass: ENTER[side],
+    exitClass: EXIT[side]
+  });
+  const ctx = useMemo(() => ({ open, close, side }), [open, close, side]);
+  if (!mounted) return null;
+  const frame = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-react-fancy-drawer-frame": "",
+      className: cn(isViewport ? "fixed inset-0 z-50" : "absolute inset-0 z-20", !backdrop && "pointer-events-none"),
+      children: [
+        backdrop ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-react-fancy-drawer-backdrop": "",
+            className: cn(
+              "absolute inset-0 bg-black/40 transition-opacity",
+              isViewport && "backdrop-blur-sm",
+              open ? "opacity-100" : "opacity-0"
+            ),
+            onClick: dismissOnBackdrop ? close : void 0,
+            "aria-hidden": "true"
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: (node) => {
+              panelRef.current = node;
+              animRef.current = node;
+            },
+            "data-react-fancy-drawer": "",
+            "data-side": side,
+            role: "dialog",
+            "aria-modal": isViewport || void 0,
+            ...rest,
+            className: cn(
+              "pointer-events-auto absolute flex flex-col border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900",
+              ANCHOR[side],
+              EDGE[side],
+              horizontal ? WIDTH[size] : HEIGHT[size],
+              // Cross-axis fills the anchor; the main axis is capped so a viewport
+              // drawer can never grow past the screen on a small device.
+              horizontal ? "h-full" : "w-full",
+              isViewport && (horizontal ? "max-w-[90vw]" : "max-h-[90vh]"),
+              !isViewport && (horizontal ? "max-w-full" : "max-h-full"),
+              animClass,
+              className
+            ),
+            children
+          }
+        )
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx(DrawerContext.Provider, { value: ctx, children: isViewport ? /* @__PURE__ */ jsx(Portal, { children: frame }) : frame });
+}
+var Drawer = Object.assign(DrawerRoot, {
+  Header: DrawerHeader,
+  Body: DrawerBody,
+  Footer: DrawerFooter,
+  Container: DrawerContainer
+});
+
+export { Drawer, useDrawer };
+//# sourceMappingURL=chunk-PRDWJ4AR.js.map
+//# sourceMappingURL=chunk-PRDWJ4AR.js.map

package/dist/chunk-PRDWJ4AR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Drawer/Drawer.context.ts","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerBody.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContainer.tsx","../src/components/Drawer/Drawer.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"chunk-PRDWJ4AR.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DrawerContextValue } from \"./Drawer.types\";\n\nexport const DrawerContext = createContext<DrawerContextValue | null>(null);\n\nexport function useDrawer(): DrawerContextValue {\n  const ctx = useContext(DrawerContext);\n  if (!ctx) {\n    throw new Error(\"Drawer compound components must be used within <Drawer>\");\n  }\n  return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useDrawer } from \"./Drawer.context\";\nimport type { DrawerHeaderProps } from \"./Drawer.types\";\n\nexport function DrawerHeader({ children, closable = true, className }: DrawerHeaderProps) {\n  const { close } = useDrawer();\n\n  return (\n    <div\n      data-react-fancy-drawer-header=\"\"\n      className={cn(\n        \"flex shrink-0 items-center justify-between border-b border-zinc-200 px-4 py-3 dark:border-zinc-700\",\n        className,\n      )}\n    >\n      <div className=\"text-sm font-semibold text-zinc-900 dark:text-zinc-100\">{children}</div>\n      {closable ? (\n        <button\n          type=\"button\"\n          onClick={close}\n          className=\"rounded-lg p-1 text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300\"\n          aria-label=\"Close\"\n        >\n          <X size={18} />\n        </button>\n      ) : null}\n    </div>\n  );\n}\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerBodyProps } from \"./Drawer.types\";\n\nexport function DrawerBody({ children, className }: DrawerBodyProps) {\n  return (\n    <div\n      data-react-fancy-drawer-body=\"\"\n      className={cn(\"min-h-0 flex-1 overflow-auto px-4 py-3 text-zinc-700 dark:text-zinc-300\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerBody.displayName = \"DrawerBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerFooterProps } from \"./Drawer.types\";\n\nexport function DrawerFooter({ children, className }: DrawerFooterProps) {\n  return (\n    <div\n      data-react-fancy-drawer-footer=\"\"\n      className={cn(\n        \"flex shrink-0 items-center justify-end gap-2 border-t border-zinc-200 px-4 py-3 dark:border-zinc-700\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerContainerProps } from \"./Drawer.types\";\n\n/**\n * The anchor for `<Drawer attach=\"container\">`.\n *\n * A container-attached drawer positions itself `absolute`, which resolves\n * against the nearest *positioned* ancestor — so without `relative` somewhere\n * above it, the drawer silently escapes to the viewport and looks like it\n * ignored `attach` entirely. This wrapper supplies `relative` + `overflow-hidden`\n * so the panel slides within the box rather than out of it.\n *\n *   <Drawer.Container className=\"h-80 rounded-xl border\">\n *     <YourContent />\n *     <Drawer attach=\"container\" side=\"bottom\" open={open} onClose={close}>\n *       <Drawer.Body>Filters</Drawer.Body>\n *     </Drawer>\n *   </Drawer.Container>\n *\n * Any element works as long as it is positioned — this is the shortcut, not a\n * requirement. Wrapping a Card, a layout pane, or a prompt-input shell in\n * `relative overflow-hidden` does the same job.\n */\nexport function DrawerContainer({ children, className, ...rest }: DrawerContainerProps) {\n  return (\n    <div\n      data-react-fancy-drawer-container=\"\"\n      {...rest}\n      className={cn(\"relative overflow-hidden\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerContainer.displayName = \"DrawerContainer\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { DrawerContext } from \"./Drawer.context\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerBody } from \"./DrawerBody\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContainer } from \"./DrawerContainer\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DrawerProps, DrawerSide } from \"./Drawer.types\";\n\n/**\n * `size` addresses the drawer's own axis: width on the horizontal edges,\n * height on the vertical ones. Keeping one scale across both means `size=\"lg\"`\n * does not have to be re-learned when a drawer moves from the side to the\n * bottom.\n */\nconst WIDTH = {\n  sm: \"w-64\",\n  md: \"w-80\",\n  lg: \"w-96\",\n  xl: \"w-[32rem]\",\n  full: \"w-full\",\n} as const;\n\nconst HEIGHT = {\n  sm: \"h-32\",\n  md: \"h-64\",\n  lg: \"h-96\",\n  xl: \"h-[32rem]\",\n  full: \"h-full\",\n} as const;\n\nconst ANCHOR: Record<DrawerSide, string> = {\n  left: \"inset-y-0 left-0\",\n  right: \"inset-y-0 right-0\",\n  top: \"inset-x-0 top-0\",\n  bottom: \"inset-x-0 bottom-0\",\n};\n\nconst ENTER: Record<DrawerSide, string> = {\n  left: \"fancy-slide-in-left\",\n  right: \"fancy-slide-in-right\",\n  top: \"fancy-slide-in-top\",\n  bottom: \"fancy-slide-in-bottom\",\n};\n\nconst EXIT: Record<DrawerSide, string> = {\n  left: \"fancy-slide-out-left\",\n  right: \"fancy-slide-out-right\",\n  top: \"fancy-slide-out-top\",\n  bottom: \"fancy-slide-out-bottom\",\n};\n\n/** The panel's edge shadow reads as depth away from the anchored edge. */\nconst EDGE: Record<DrawerSide, string> = {\n  left: \"border-r\",\n  right: \"border-l\",\n  top: \"border-b\",\n  bottom: \"border-t\",\n};\n\nfunction DrawerRoot({\n  children,\n  open,\n  onClose,\n  side = \"right\",\n  size = \"md\",\n  attach = \"viewport\",\n  backdrop = true,\n  dismissOnBackdrop = true,\n  dismissOnEscape = true,\n  className,\n  ...rest\n}: DrawerProps) {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const horizontal = side === \"left\" || side === \"right\";\n  const isViewport = attach === \"viewport\";\n\n  const close = useCallback(() => onClose(), [onClose]);\n  useEscapeKey(close, open && dismissOnEscape);\n\n  // A container-attached drawer is a panel, not a dialog — trapping focus in it\n  // would strand keyboard users inside a Card. Only the viewport form is modal.\n  useFocusTrap(panelRef, open && isViewport);\n\n  useEffect(() => {\n    if (!open || !isViewport) return;\n    const original = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = original;\n    };\n  }, [open, isViewport]);\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: ENTER[side],\n    exitClass: EXIT[side],\n  });\n\n  const ctx = useMemo(() => ({ open, close, side }), [open, close, side]);\n\n  if (!mounted) return null;\n\n  const frame = (\n    <div\n      data-react-fancy-drawer-frame=\"\"\n      className={cn(isViewport ? \"fixed inset-0 z-50\" : \"absolute inset-0 z-20\", !backdrop && \"pointer-events-none\")}\n    >\n      {backdrop ? (\n        <div\n          data-react-fancy-drawer-backdrop=\"\"\n          className={cn(\n            \"absolute inset-0 bg-black/40 transition-opacity\",\n            isViewport && \"backdrop-blur-sm\",\n            open ? \"opacity-100\" : \"opacity-0\",\n          )}\n          onClick={dismissOnBackdrop ? close : undefined}\n          aria-hidden=\"true\"\n        />\n      ) : null}\n\n      <div\n        ref={(node) => {\n          panelRef.current = node;\n          (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n        }}\n        data-react-fancy-drawer=\"\"\n        data-side={side}\n        role=\"dialog\"\n        aria-modal={isViewport || undefined}\n        {...rest}\n        className={cn(\n          \"pointer-events-auto absolute flex flex-col border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900\",\n          ANCHOR[side],\n          EDGE[side],\n          horizontal ? WIDTH[size] : HEIGHT[size],\n          // Cross-axis fills the anchor; the main axis is capped so a viewport\n          // drawer can never grow past the screen on a small device.\n          horizontal ? \"h-full\" : \"w-full\",\n          isViewport && (horizontal ? \"max-w-[90vw]\" : \"max-h-[90vh]\"),\n          !isViewport && (horizontal ? \"max-w-full\" : \"max-h-full\"),\n          animClass,\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n\n  return (\n    <DrawerContext.Provider value={ctx}>\n      {isViewport ? <Portal>{frame}</Portal> : frame}\n    </DrawerContext.Provider>\n  );\n}\n\nexport const Drawer = Object.assign(DrawerRoot, {\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  Container: DrawerContainer,\n});\n"]}

package/dist/chunk-PRJSEZ5F.cjs

@@ -0,0 +1,285 @@
+'use strict';
+
+var chunk3Z6ALUWP_cjs = require('./chunk-3Z6ALUWP.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var TimelineContext = react.createContext({
+  variant: "stacked",
+  index: 0,
+  total: 0,
+  animated: true
+});
+function useTimeline() {
+  return react.useContext(TimelineContext);
+}
+var dotColorClasses = {
+  slate: "bg-slate-400 dark:bg-slate-600",
+  gray: "bg-gray-400 dark:bg-gray-600",
+  zinc: "bg-zinc-300 dark:bg-zinc-600",
+  neutral: "bg-neutral-400 dark:bg-neutral-600",
+  stone: "bg-stone-400 dark:bg-stone-600",
+  red: "bg-red-500",
+  orange: "bg-orange-500",
+  amber: "bg-amber-500",
+  yellow: "bg-yellow-500",
+  lime: "bg-lime-500",
+  green: "bg-green-500",
+  emerald: "bg-emerald-500",
+  teal: "bg-teal-500",
+  cyan: "bg-cyan-500",
+  sky: "bg-sky-500",
+  blue: "bg-blue-500",
+  indigo: "bg-indigo-500",
+  violet: "bg-violet-500",
+  purple: "bg-purple-500",
+  fuchsia: "bg-fuchsia-500",
+  pink: "bg-pink-500",
+  rose: "bg-rose-500"
+};
+var ringColorClasses = {
+  slate: "ring-slate-400/30",
+  gray: "ring-gray-400/30",
+  zinc: "ring-zinc-400/30 dark:ring-zinc-500/30",
+  neutral: "ring-neutral-400/30",
+  stone: "ring-stone-400/30",
+  red: "ring-red-500/30",
+  orange: "ring-orange-500/30",
+  amber: "ring-amber-500/30",
+  yellow: "ring-yellow-500/30",
+  lime: "ring-lime-500/30",
+  green: "ring-green-500/30",
+  emerald: "ring-emerald-500/30",
+  teal: "ring-teal-500/30",
+  cyan: "ring-cyan-500/30",
+  sky: "ring-sky-500/30",
+  blue: "ring-blue-500/30",
+  indigo: "ring-indigo-500/30",
+  violet: "ring-violet-500/30",
+  purple: "ring-purple-500/30",
+  fuchsia: "ring-fuchsia-500/30",
+  pink: "ring-pink-500/30",
+  rose: "ring-rose-500/30"
+};
+function Dot({ icon, emoji, color, active }) {
+  const c = color ?? "zinc";
+  if (emoji) {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full border border-zinc-200 bg-zinc-100 dark:border-zinc-700 dark:bg-zinc-800", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: emoji }) });
+  }
+  if (icon) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: chunk3Z6ALUWP_cjs.cn(
+          "flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-white",
+          dotColorClasses[c],
+          active && "ring-4",
+          active && ringColorClasses[c]
+        ),
+        children: icon
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: chunk3Z6ALUWP_cjs.cn(
+        "h-3 w-3 shrink-0 rounded-full",
+        dotColorClasses[c],
+        active && "ring-4",
+        active && ringColorClasses[c]
+      )
+    }
+  );
+}
+function useIntersectionReveal(animated) {
+  const ref = react.useRef(null);
+  const [visible, setVisible] = react.useState(!animated);
+  react.useEffect(() => {
+    if (!animated || !ref.current) return;
+    const el = ref.current;
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        if (entry.isIntersecting) {
+          setVisible(true);
+          observer.disconnect();
+        }
+      },
+      { threshold: 0.2 }
+    );
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [animated]);
+  return { ref, visible };
+}
+var TimelineItem = react.forwardRef(
+  ({ children, icon, emoji, date, color = "zinc", active = false, className }, _ref) => {
+    const { variant, index, total, animated } = useTimeline();
+    const { ref, visible } = useIntersectionReveal(animated);
+    const isLast = index === total - 1;
+    const isLargeDot = !!icon || !!emoji;
+    const isEven = index % 2 === 0;
+    if (variant === "horizontal") {
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref,
+          "data-react-fancy-timeline-item": "",
+          className: chunk3Z6ALUWP_cjs.cn(
+            "flex flex-col items-center",
+            !isLast && "min-w-40",
+            animated && "transition duration-500 ease-out",
+            animated && (visible ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"),
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-8 w-full items-center", children: [
+              index > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px flex-1 bg-zinc-200 dark:bg-zinc-700" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
+              /* @__PURE__ */ jsxRuntime.jsx(Dot, { icon, emoji, color, active }),
+              !isLast ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px flex-1 bg-zinc-200 dark:bg-zinc-700" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 max-w-40 px-2 text-center", children: [
+              date && /* @__PURE__ */ jsxRuntime.jsx("time", { className: "text-xs font-medium uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: date }),
+              children
+            ] })
+          ]
+        }
+      );
+    }
+    if (variant === "alternating") {
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref,
+          "data-react-fancy-timeline-item": "",
+          className: chunk3Z6ALUWP_cjs.cn(
+            "relative flex gap-x-4 md:grid md:grid-cols-[1fr_1.5rem_1fr] md:gap-x-6",
+            animated && "transition duration-500 ease-out",
+            animated && (visible ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"),
+            className
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10 flex w-8 shrink-0 justify-center md:col-start-2 md:row-start-1 md:w-auto md:justify-center", children: !isLargeDot ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1.5", children: /* @__PURE__ */ jsxRuntime.jsx(Dot, { icon, emoji, color, active }) }) : /* @__PURE__ */ jsxRuntime.jsx(Dot, { icon, emoji, color, active }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunk3Z6ALUWP_cjs.cn(
+              "min-w-0 flex-1",
+              !isLast && "pb-8",
+              isLargeDot && "pt-1",
+              isEven ? "md:col-start-1 md:row-start-1 md:text-right" : "md:col-start-3"
+            ), children: [
+              date && /* @__PURE__ */ jsxRuntime.jsx("time", { className: "text-xs font-medium uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: date }),
+              children
+            ] })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-react-fancy-timeline-item": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "relative flex gap-x-4",
+          animated && "transition duration-500 ease-out",
+          animated && (visible ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"),
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10 flex w-8 shrink-0 justify-center", children: !isLargeDot ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1.5", children: /* @__PURE__ */ jsxRuntime.jsx(Dot, { icon, emoji, color, active }) }) : /* @__PURE__ */ jsxRuntime.jsx(Dot, { icon, emoji, color, active }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunk3Z6ALUWP_cjs.cn("min-w-0 flex-1", !isLast && "pb-8", isLargeDot && "pt-1"), children: [
+            date && /* @__PURE__ */ jsxRuntime.jsx("time", { className: "text-xs font-medium uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: date }),
+            children
+          ] })
+        ]
+      }
+    );
+  }
+);
+TimelineItem.displayName = "TimelineItem";
+var TimelineBlock = react.forwardRef(
+  ({ heading, children, icon, emoji, color = "zinc", active = false, className }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(TimelineItem, { icon, emoji, color, active, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-react-fancy-timeline-block": "",
+        className: chunk3Z6ALUWP_cjs.cn(
+          "rounded-lg border border-zinc-200 bg-white p-4 dark:border-zinc-700 dark:bg-zinc-900",
+          active && "ring-2 ring-blue-500/20 dark:ring-blue-400/20",
+          className
+        ),
+        children: [
+          heading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-sm font-semibold text-zinc-900 dark:text-zinc-100", children: heading }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-zinc-600 dark:text-zinc-400", children })
+        ]
+      }
+    ) });
+  }
+);
+TimelineBlock.displayName = "TimelineBlock";
+var TimelineRoot = react.forwardRef(
+  ({
+    children,
+    variant: variantProp,
+    orientation,
+    events,
+    heading,
+    description,
+    animated = true,
+    className
+  }, ref) => {
+    const scrollRef = react.useRef(null);
+    let variant = variantProp ?? "stacked";
+    if (!variantProp && orientation) {
+      variant = orientation === "horizontal" ? "horizontal" : "stacked";
+    }
+    const isHorizontal = variant === "horizontal";
+    const isAlternating = variant === "alternating";
+    const items = events ? events.map((e, i) => /* @__PURE__ */ jsxRuntime.jsxs(TimelineItem, { date: e.date, emoji: e.emoji, icon: e.icon, color: e.color, children: [
+      e.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-zinc-900 dark:text-white", children: e.title }),
+      e.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-sm leading-relaxed text-zinc-600 dark:text-zinc-400", children: e.description })
+    ] }, i)) : react.Children.toArray(children);
+    const handleWheel = react.useCallback((e) => {
+      if (!scrollRef.current) return;
+      e.preventDefault();
+      scrollRef.current.scrollLeft += e.deltaY;
+    }, []);
+    const content = items.map((child, i) => /* @__PURE__ */ jsxRuntime.jsx(TimelineContext.Provider, { value: { variant, index: i, total: items.length, animated }, children: child }, i));
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, "data-react-fancy-timeline": "", "data-variant": variant, className, children: [
+      (heading || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-8", children: [
+        heading && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-semibold text-zinc-900 dark:text-white", children: heading }),
+        description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-zinc-500 dark:text-zinc-400", children: description })
+      ] }),
+      isHorizontal ? /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ref: scrollRef,
+          className: "overflow-x-auto pb-4 -mb-4",
+          style: { scrollbarWidth: "thin", scrollbarColor: "rgb(161 161 170) transparent" },
+          onWheel: handleWheel,
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-max items-start", children: content })
+        }
+      ) : (
+        /* Vertical variants: continuous background line behind all events */
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+          items.length > 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk3Z6ALUWP_cjs.cn(
+            "absolute top-0 bottom-0 w-px bg-zinc-200 dark:bg-zinc-700",
+            isAlternating ? "left-4 md:left-1/2 md:-translate-x-px" : "left-4"
+          ) }),
+          content
+        ] })
+      )
+    ] });
+  }
+);
+TimelineRoot.displayName = "Timeline";
+var Timeline = Object.assign(TimelineRoot, {
+  Item: TimelineItem,
+  Block: TimelineBlock
+});
+
+exports.Timeline = Timeline;
+exports.TimelineBlock = TimelineBlock;
+exports.TimelineItem = TimelineItem;
+//# sourceMappingURL=chunk-PRJSEZ5F.cjs.map
+//# sourceMappingURL=chunk-PRJSEZ5F.cjs.map