@particle-academy/react-fancy 5.16.0 → 5.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -43,7 +43,14 @@ function ModalHeader({ children, className }) {
43
43
  }
44
44
  ModalHeader.displayName = "ModalHeader";
45
45
  function ModalBody({ children, className }) {
46
- return /* @__PURE__ */ jsx("div", { "data-react-fancy-modal-body": "", className: cn("flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300", className), children });
46
+ return (
47
+ // `min-h-0` is load-bearing, not decoration. A flex child defaults to
48
+ // `min-height: auto`, which refuses to shrink below its content — so
49
+ // `flex-1` alone would push the panel through its own max-height and the
50
+ // scrollbar would never appear. This is what permits the overflow that
51
+ // `overflow-y-auto` then handles.
52
+ /* @__PURE__ */ jsx("div", { "data-react-fancy-modal-body": "", className: cn("min-h-0 flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300", className), children })
53
+ );
47
54
  }
48
55
  ModalBody.displayName = "ModalBody";
49
56
  function ModalFooter({ children, className }) {
@@ -60,12 +67,13 @@ function ModalFooter({ children, className }) {
60
67
  );
61
68
  }
62
69
  ModalFooter.displayName = "ModalFooter";
70
+ var VIEWPORT_CAP = "max-h-[calc(100vh-2rem)] max-h-[calc(100dvh-2rem)]";
63
71
  var SIZE_MAP = {
64
- sm: "max-w-sm",
65
- md: "max-w-lg",
66
- lg: "max-w-2xl",
67
- xl: "max-w-4xl",
68
- full: "max-w-[calc(100vw-2rem)] max-h-[calc(100vh-2rem)]"
72
+ sm: `max-w-sm ${VIEWPORT_CAP}`,
73
+ md: `max-w-lg ${VIEWPORT_CAP}`,
74
+ lg: `max-w-2xl ${VIEWPORT_CAP}`,
75
+ xl: `max-w-4xl ${VIEWPORT_CAP}`,
76
+ full: `max-w-[calc(100vw-2rem)] ${VIEWPORT_CAP}`
69
77
  };
70
78
  function ModalRoot({
71
79
  children,
@@ -133,5 +141,5 @@ var Modal = Object.assign(ModalRoot, {
133
141
  });
134
142
 
135
143
  export { Modal, useModal };
136
- //# sourceMappingURL=chunk-MYF2PDTU.js.map
137
- //# sourceMappingURL=chunk-MYF2PDTU.js.map
144
+ //# sourceMappingURL=chunk-M645OITZ.js.map
145
+ //# sourceMappingURL=chunk-M645OITZ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Modal/Modal.context.ts","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/Modal.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"chunk-M645OITZ.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ModalContextValue } from \"./Modal.types\";\n\nexport const ModalContext = createContext<ModalContextValue | null>(null);\n\nexport function useModal(): ModalContextValue {\n const ctx = useContext(ModalContext);\n if (!ctx) {\n throw new Error(\"Modal compound components must be used within <Modal>\");\n }\n return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useModal } from \"./Modal.context\";\nimport type { ModalHeaderProps } from \"./Modal.types\";\n\nexport function ModalHeader({ children, className }: ModalHeaderProps) {\n const { close } = useModal();\n\n return (\n <div\n data-react-fancy-modal-header=\"\"\n className={cn(\n \"flex items-center justify-between border-b border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n <div className=\"text-lg font-semibold text-zinc-900 dark:text-zinc-100\">{children}</div>\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={20} />\n </button>\n </div>\n );\n}\n\nModalHeader.displayName = \"ModalHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalBodyProps } from \"./Modal.types\";\n\nexport function ModalBody({ children, className }: ModalBodyProps) {\n return (\n // `min-h-0` is load-bearing, not decoration. A flex child defaults to\n // `min-height: auto`, which refuses to shrink below its content — so\n // `flex-1` alone would push the panel through its own max-height and the\n // scrollbar would never appear. This is what permits the overflow that\n // `overflow-y-auto` then handles.\n <div data-react-fancy-modal-body=\"\" className={cn(\"min-h-0 flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300\", className)}>\n {children}\n </div>\n );\n}\n\nModalBody.displayName = \"ModalBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalFooterProps } from \"./Modal.types\";\n\nexport function ModalFooter({ children, className }: ModalFooterProps) {\n return (\n <div\n data-react-fancy-modal-footer=\"\"\n className={cn(\n \"flex items-center justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nModalFooter.displayName = \"ModalFooter\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ModalContext } from \"./Modal.context\";\nimport { ModalHeader } from \"./ModalHeader\";\nimport { ModalBody } from \"./ModalBody\";\nimport { ModalFooter } from \"./ModalFooter\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { ModalProps } from \"./Modal.types\";\n\n/**\n * Every size is capped against the VIEWPORT, not just the width.\n *\n * Only `full` used to carry a max-height. The other four were width-constrained\n * and vertically unbounded, so a modal with long content simply grew past the\n * bottom of the screen and the rest became unreachable — no scrollbar, because\n * there was no overflow to scroll: the box got taller instead.\n *\n * `ModalBody` already had `flex-1 overflow-y-auto` and the panel already had\n * `overflow-hidden`. The scrolling machinery was complete and inert, waiting on\n * the one constraint that makes it engage.\n *\n * `dvh` over `vh` deliberately: on mobile browsers `100vh` is the tallest the\n * viewport ever gets, ignoring the address bar, so a `vh`-capped modal still\n * runs under the chrome on exactly the devices with least room. `dvh` tracks\n * the visible height. The `vh` fallback is listed first for any engine that\n * does not know `dvh` yet — an unknown unit drops the declaration, so ordering\n * is what keeps the old behaviour rather than none.\n */\nconst VIEWPORT_CAP = \"max-h-[calc(100vh-2rem)] max-h-[calc(100dvh-2rem)]\";\n\nconst SIZE_MAP = {\n sm: `max-w-sm ${VIEWPORT_CAP}`,\n md: `max-w-lg ${VIEWPORT_CAP}`,\n lg: `max-w-2xl ${VIEWPORT_CAP}`,\n xl: `max-w-4xl ${VIEWPORT_CAP}`,\n full: `max-w-[calc(100vw-2rem)] ${VIEWPORT_CAP}`,\n} as const;\n\nfunction ModalRoot({\n children,\n open,\n onClose,\n size = \"md\",\n className,\n ...rest\n}: ModalProps) {\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => onClose(), [onClose]);\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Body scroll lock\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(() => ({ open, close }), [open, close]);\n\n if (!mounted) return null;\n\n return (\n <ModalContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n {/* Backdrop */}\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n {/* Panel */}\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-modal=\"\"\n role=\"dialog\"\n aria-modal=\"true\"\n {...rest}\n className={cn(\n \"relative flex w-full flex-col overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900\",\n SIZE_MAP[size],\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </ModalContext.Provider>\n );\n}\n\nexport const Modal = Object.assign(ModalRoot, {\n Header: ModalHeader,\n Body: ModalBody,\n Footer: ModalFooter,\n});\n"]}
@@ -45,7 +45,14 @@ function ModalHeader({ children, className }) {
45
45
  }
46
46
  ModalHeader.displayName = "ModalHeader";
47
47
  function ModalBody({ children, className }) {
48
- return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-modal-body": "", className: chunk3Z6ALUWP_cjs.cn("flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300", className), children });
48
+ return (
49
+ // `min-h-0` is load-bearing, not decoration. A flex child defaults to
50
+ // `min-height: auto`, which refuses to shrink below its content — so
51
+ // `flex-1` alone would push the panel through its own max-height and the
52
+ // scrollbar would never appear. This is what permits the overflow that
53
+ // `overflow-y-auto` then handles.
54
+ /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-modal-body": "", className: chunk3Z6ALUWP_cjs.cn("min-h-0 flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300", className), children })
55
+ );
49
56
  }
50
57
  ModalBody.displayName = "ModalBody";
51
58
  function ModalFooter({ children, className }) {
@@ -62,12 +69,13 @@ function ModalFooter({ children, className }) {
62
69
  );
63
70
  }
64
71
  ModalFooter.displayName = "ModalFooter";
72
+ var VIEWPORT_CAP = "max-h-[calc(100vh-2rem)] max-h-[calc(100dvh-2rem)]";
65
73
  var SIZE_MAP = {
66
- sm: "max-w-sm",
67
- md: "max-w-lg",
68
- lg: "max-w-2xl",
69
- xl: "max-w-4xl",
70
- full: "max-w-[calc(100vw-2rem)] max-h-[calc(100vh-2rem)]"
74
+ sm: `max-w-sm ${VIEWPORT_CAP}`,
75
+ md: `max-w-lg ${VIEWPORT_CAP}`,
76
+ lg: `max-w-2xl ${VIEWPORT_CAP}`,
77
+ xl: `max-w-4xl ${VIEWPORT_CAP}`,
78
+ full: `max-w-[calc(100vw-2rem)] ${VIEWPORT_CAP}`
71
79
  };
72
80
  function ModalRoot({
73
81
  children,
@@ -136,5 +144,5 @@ var Modal = Object.assign(ModalRoot, {
136
144
 
137
145
  exports.Modal = Modal;
138
146
  exports.useModal = useModal;
139
- //# sourceMappingURL=chunk-TZKZ2LUF.cjs.map
140
- //# sourceMappingURL=chunk-TZKZ2LUF.cjs.map
147
+ //# sourceMappingURL=chunk-UPVWN72I.cjs.map
148
+ //# sourceMappingURL=chunk-UPVWN72I.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Modal/Modal.context.ts","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/Modal.tsx"],"names":["createContext","useContext","jsxs","cn","jsx","X","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useAnimation","useMemo","Portal"],"mappings":";;;;;;;;;;;AAGO,IAAM,YAAA,GAAeA,oBAAwC,IAAI,CAAA;AAEjE,SAAS,QAAA,GAA8B;AAC5C,EAAA,MAAM,GAAA,GAAMC,iBAAW,YAAY,CAAA;AACnC,EAAA,IAAI,CAAC,GAAA,EAAK;AACR,IAAA,MAAM,IAAI,MAAM,uDAAuD,CAAA;AAAA,EACzE;AACA,EAAA,OAAO,GAAA;AACT;ACNO,SAAS,WAAA,CAAY,EAAE,QAAA,EAAU,SAAA,EAAU,EAAqB;AACrE,EAAA,MAAM,EAAE,KAAA,EAAM,GAAI,QAAA,EAAS;AAE3B,EAAA,uBACEC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,+BAAA,EAA8B,EAAA;AAAA,MAC9B,SAAA,EAAWC,oBAAA;AAAA,QACT,2FAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wDAAA,EAA0D,QAAA,EAAS,CAAA;AAAA,wBAClFA,cAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,KAAA;AAAA,YACT,SAAA,EAAU,sIAAA;AAAA,YACV,YAAA,EAAW,OAAA;AAAA,YAEX,QAAA,kBAAAA,cAAA,CAACC,aAAA,EAAA,EAAE,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AACf;AAAA;AAAA,GACF;AAEJ;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA;AC1BnB,SAAS,SAAA,CAAU,EAAE,QAAA,EAAU,SAAA,EAAU,EAAmB;AACjE,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAMED,cAAAA,CAAC,KAAA,EAAA,EAAI,6BAAA,EAA4B,EAAA,EAAG,WAAWD,oBAAA,CAAG,2EAAA,EAA6E,SAAS,CAAA,EACrI,QAAA,EACH;AAAA;AAEJ;AAEA,SAAA,CAAU,WAAA,GAAc,WAAA;ACbjB,SAAS,WAAA,CAAY,EAAE,QAAA,EAAU,SAAA,EAAU,EAAqB;AACrE,EAAA,uBACEC,cAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,+BAAA,EAA8B,EAAA;AAAA,MAC9B,SAAA,EAAWD,oBAAA;AAAA,QACT,6FAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA;ACc1B,IAAM,YAAA,GAAe,oDAAA;AAErB,IAAM,QAAA,GAAW;AAAA,EACf,EAAA,EAAI,YAAY,YAAY,CAAA,CAAA;AAAA,EAC5B,EAAA,EAAI,YAAY,YAAY,CAAA,CAAA;AAAA,EAC5B,EAAA,EAAI,aAAa,YAAY,CAAA,CAAA;AAAA,EAC7B,EAAA,EAAI,aAAa,YAAY,CAAA,CAAA;AAAA,EAC7B,IAAA,EAAM,4BAA4B,YAAY,CAAA;AAChD,CAAA;AAEA,SAAS,SAAA,CAAU;AAAA,EACjB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAe;AACb,EAAA,MAAM,QAAA,GAAWG,aAAuB,IAAI,CAAA;AAE5C,EAAA,MAAM,QAAQC,iBAAA,CAAY,MAAM,SAAQ,EAAG,CAAC,OAAO,CAAC,CAAA;AACpD,EAAAC,8BAAA,CAAa,OAAO,IAAI,CAAA;AACxB,EAAAC,8BAAA,CAAa,UAAU,IAAI,CAAA;AAG3B,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,IAAA,EAAM;AACR,MAAA,MAAM,QAAA,GAAW,QAAA,CAAS,IAAA,CAAK,KAAA,CAAM,QAAA;AACrC,MAAA,QAAA,CAAS,IAAA,CAAK,MAAM,QAAA,GAAW,QAAA;AAC/B,MAAA,OAAO,MAAM;AACX,QAAA,QAAA,CAAS,IAAA,CAAK,MAAM,QAAA,GAAW,QAAA;AAAA,MACjC,CAAA;AAAA,IACF;AAAA,EACF,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,EAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,WAAW,GAAA,EAAK,OAAA,KAAYC,8BAAA,CAAa;AAAA,IACnE,IAAA;AAAA,IACA,UAAA,EAAY,gBAAA;AAAA,IACZ,SAAA,EAAW;AAAA,GACZ,CAAA;AAED,EAAA,MAAM,GAAA,GAAMC,aAAA,CAAQ,OAAO,EAAE,IAAA,EAAM,OAAM,CAAA,EAAI,CAAC,IAAA,EAAM,KAAK,CAAC,CAAA;AAE1D,EAAA,IAAI,CAAC,SAAS,OAAO,IAAA;AAErB,EAAA,uBACER,cAAAA,CAAC,YAAA,CAAa,QAAA,EAAb,EAAsB,KAAA,EAAO,GAAA,EAC5B,QAAA,kBAAAA,cAAAA,CAACS,wBAAA,EAAA,EACC,QAAA,kBAAAX,eAAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yDAAA,EAEb,QAAA,EAAA;AAAA,oBAAAE,cAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAU,+CAAA;AAAA,QACV,OAAA,EAAS,KAAA;AAAA,QACT,aAAA,EAAY;AAAA;AAAA,KACd;AAAA,oBAEAA,cAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,CAAC,IAAA,KAAS;AACb,UAAA,QAAA,CAAS,OAAA,GAAU,IAAA;AACnB,UAAC,QAAuD,OAAA,GACtD,IAAA;AAAA,QACJ,CAAA;AAAA,QACA,wBAAA,EAAuB,EAAA;AAAA,QACvB,IAAA,EAAK,QAAA;AAAA,QACL,YAAA,EAAW,MAAA;AAAA,QACV,GAAG,IAAA;AAAA,QACJ,SAAA,EAAWD,oBAAA;AAAA,UACT,2IAAA;AAAA,UACA,SAAS,IAAI,CAAA;AAAA,UACb,SAAA;AAAA,UACA;AAAA,SACF;AAAA,QAEC;AAAA;AAAA;AACH,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ;AAEO,IAAM,KAAA,GAAQ,MAAA,CAAO,MAAA,CAAO,SAAA,EAAW;AAAA,EAC5C,MAAA,EAAQ,WAAA;AAAA,EACR,IAAA,EAAM,SAAA;AAAA,EACN,MAAA,EAAQ;AACV,CAAC","file":"chunk-UPVWN72I.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ModalContextValue } from \"./Modal.types\";\n\nexport const ModalContext = createContext<ModalContextValue | null>(null);\n\nexport function useModal(): ModalContextValue {\n const ctx = useContext(ModalContext);\n if (!ctx) {\n throw new Error(\"Modal compound components must be used within <Modal>\");\n }\n return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useModal } from \"./Modal.context\";\nimport type { ModalHeaderProps } from \"./Modal.types\";\n\nexport function ModalHeader({ children, className }: ModalHeaderProps) {\n const { close } = useModal();\n\n return (\n <div\n data-react-fancy-modal-header=\"\"\n className={cn(\n \"flex items-center justify-between border-b border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n <div className=\"text-lg font-semibold text-zinc-900 dark:text-zinc-100\">{children}</div>\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={20} />\n </button>\n </div>\n );\n}\n\nModalHeader.displayName = \"ModalHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalBodyProps } from \"./Modal.types\";\n\nexport function ModalBody({ children, className }: ModalBodyProps) {\n return (\n // `min-h-0` is load-bearing, not decoration. A flex child defaults to\n // `min-height: auto`, which refuses to shrink below its content — so\n // `flex-1` alone would push the panel through its own max-height and the\n // scrollbar would never appear. This is what permits the overflow that\n // `overflow-y-auto` then handles.\n <div data-react-fancy-modal-body=\"\" className={cn(\"min-h-0 flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300\", className)}>\n {children}\n </div>\n );\n}\n\nModalBody.displayName = \"ModalBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalFooterProps } from \"./Modal.types\";\n\nexport function ModalFooter({ children, className }: ModalFooterProps) {\n return (\n <div\n data-react-fancy-modal-footer=\"\"\n className={cn(\n \"flex items-center justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nModalFooter.displayName = \"ModalFooter\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ModalContext } from \"./Modal.context\";\nimport { ModalHeader } from \"./ModalHeader\";\nimport { ModalBody } from \"./ModalBody\";\nimport { ModalFooter } from \"./ModalFooter\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { ModalProps } from \"./Modal.types\";\n\n/**\n * Every size is capped against the VIEWPORT, not just the width.\n *\n * Only `full` used to carry a max-height. The other four were width-constrained\n * and vertically unbounded, so a modal with long content simply grew past the\n * bottom of the screen and the rest became unreachable — no scrollbar, because\n * there was no overflow to scroll: the box got taller instead.\n *\n * `ModalBody` already had `flex-1 overflow-y-auto` and the panel already had\n * `overflow-hidden`. The scrolling machinery was complete and inert, waiting on\n * the one constraint that makes it engage.\n *\n * `dvh` over `vh` deliberately: on mobile browsers `100vh` is the tallest the\n * viewport ever gets, ignoring the address bar, so a `vh`-capped modal still\n * runs under the chrome on exactly the devices with least room. `dvh` tracks\n * the visible height. The `vh` fallback is listed first for any engine that\n * does not know `dvh` yet — an unknown unit drops the declaration, so ordering\n * is what keeps the old behaviour rather than none.\n */\nconst VIEWPORT_CAP = \"max-h-[calc(100vh-2rem)] max-h-[calc(100dvh-2rem)]\";\n\nconst SIZE_MAP = {\n sm: `max-w-sm ${VIEWPORT_CAP}`,\n md: `max-w-lg ${VIEWPORT_CAP}`,\n lg: `max-w-2xl ${VIEWPORT_CAP}`,\n xl: `max-w-4xl ${VIEWPORT_CAP}`,\n full: `max-w-[calc(100vw-2rem)] ${VIEWPORT_CAP}`,\n} as const;\n\nfunction ModalRoot({\n children,\n open,\n onClose,\n size = \"md\",\n className,\n ...rest\n}: ModalProps) {\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => onClose(), [onClose]);\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Body scroll lock\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(() => ({ open, close }), [open, close]);\n\n if (!mounted) return null;\n\n return (\n <ModalContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n {/* Backdrop */}\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n {/* Panel */}\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-modal=\"\"\n role=\"dialog\"\n aria-modal=\"true\"\n {...rest}\n className={cn(\n \"relative flex w-full flex-col overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900\",\n SIZE_MAP[size],\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </ModalContext.Provider>\n );\n}\n\nexport const Modal = Object.assign(ModalRoot, {\n Header: ModalHeader,\n Body: ModalBody,\n Footer: ModalFooter,\n});\n"]}
package/dist/index.cjs CHANGED
@@ -33,7 +33,7 @@ var chunkIXHZVFHX_cjs = require('./chunk-IXHZVFHX.cjs');
33
33
  var chunk6Y2QO7YV_cjs = require('./chunk-6Y2QO7YV.cjs');
34
34
  var chunkVQ4M25U3_cjs = require('./chunk-VQ4M25U3.cjs');
35
35
  var chunkRR7BWUVP_cjs = require('./chunk-RR7BWUVP.cjs');
36
- var chunkTZKZ2LUF_cjs = require('./chunk-TZKZ2LUF.cjs');
36
+ var chunkUPVWN72I_cjs = require('./chunk-UPVWN72I.cjs');
37
37
  var chunkI6L7OP7G_cjs = require('./chunk-I6L7OP7G.cjs');
38
38
  var chunkB3HVWXIQ_cjs = require('./chunk-B3HVWXIQ.cjs');
39
39
  var chunkE7PHL3TD_cjs = require('./chunk-E7PHL3TD.cjs');
@@ -250,11 +250,11 @@ Object.defineProperty(exports, "Separator", {
250
250
  });
251
251
  Object.defineProperty(exports, "Modal", {
252
252
  enumerable: true,
253
- get: function () { return chunkTZKZ2LUF_cjs.Modal; }
253
+ get: function () { return chunkUPVWN72I_cjs.Modal; }
254
254
  });
255
255
  Object.defineProperty(exports, "useModal", {
256
256
  enumerable: true,
257
- get: function () { return chunkTZKZ2LUF_cjs.useModal; }
257
+ get: function () { return chunkUPVWN72I_cjs.useModal; }
258
258
  });
259
259
  Object.defineProperty(exports, "MoodMeter", {
260
260
  enumerable: true,
package/dist/index.js CHANGED
@@ -31,7 +31,7 @@ export { PullQuote } from './chunk-YCZN4FWI.js';
31
31
  export { ReasonTag } from './chunk-HNITJ2UR.js';
32
32
  export { Section } from './chunk-PG3ILQIW.js';
33
33
  export { Separator } from './chunk-QFFC2DKK.js';
34
- export { Modal, useModal } from './chunk-MYF2PDTU.js';
34
+ export { Modal, useModal } from './chunk-M645OITZ.js';
35
35
  export { MoodMeter } from './chunk-32AJIHBZ.js';
36
36
  export { Navbar, useNavbar } from './chunk-D4WM23Y4.js';
37
37
  export { OtpInput } from './chunk-UCYAHLGM.js';
package/dist/modal.cjs CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunkTZKZ2LUF_cjs = require('./chunk-TZKZ2LUF.cjs');
3
+ var chunkUPVWN72I_cjs = require('./chunk-UPVWN72I.cjs');
4
4
  require('./chunk-TXTRTTG7.cjs');
5
5
  require('./chunk-3WGRVDQR.cjs');
6
6
  require('./chunk-NBZC6LOB.cjs');
@@ -11,11 +11,11 @@ require('./chunk-3Z6ALUWP.cjs');
11
11
 
12
12
  Object.defineProperty(exports, "Modal", {
13
13
  enumerable: true,
14
- get: function () { return chunkTZKZ2LUF_cjs.Modal; }
14
+ get: function () { return chunkUPVWN72I_cjs.Modal; }
15
15
  });
16
16
  Object.defineProperty(exports, "useModal", {
17
17
  enumerable: true,
18
- get: function () { return chunkTZKZ2LUF_cjs.useModal; }
18
+ get: function () { return chunkUPVWN72I_cjs.useModal; }
19
19
  });
20
20
  //# sourceMappingURL=modal.cjs.map
21
21
  //# sourceMappingURL=modal.cjs.map
package/dist/modal.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Modal, useModal } from './chunk-MYF2PDTU.js';
1
+ export { Modal, useModal } from './chunk-M645OITZ.js';
2
2
  import './chunk-5U2DZ7AV.js';
3
3
  import './chunk-CHADHN6M.js';
4
4
  import './chunk-WHEXTDPV.js';
package/dist/styles.css CHANGED
@@ -26,9 +26,6 @@
26
26
  --color-secondary-900: var(--color-zinc-100);
27
27
  --color-secondary-950: var(--color-zinc-50);
28
28
  }
29
- [data-react-fancy-field] + [data-react-fancy-field] {
30
- margin-top: 1rem;
31
- }
32
29
  [data-react-fancy-input] input,
33
30
  [data-react-fancy-textarea],
34
31
  [data-react-fancy-select],
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/react-fancy — base styles + animations */\n\n/* ─── Brand colour scheme ────────────────────────────────────────────────────\n Three token families every Fancy package can rely on, so a component never\n has to invent a palette or hardcode a literal:\n\n brand one accent — the thing a consumer rebrands first\n primary-* the accent as a full 50→950 scale\n secondary-* the NEUTRAL scale for surfaces, borders and body text\n\n Why this exists: packages were already writing `bg-brand`, `text-primary-600`\n and `border-secondary-200` against tokens nothing defined. Tailwind generated\n no such utility, the class silently resolved to nothing, and the component\n rendered unstyled — correct markup, no colour, no error. Defining them here\n turns those classes into a contract instead of a hope.\n\n SECONDARY INVERTS WITH THE THEME. `text-secondary-900` means \"strongest\n foreground\", not \"nearly black\" — so it stays readable on a dark surface.\n That distinction is the whole point: mixing a literal background (`bg-white`)\n with a semantic foreground (`text-secondary-900`) is what produced\n white-on-white in a dark host.\n\n OVERRIDE IT. Redefine any of these in your own `@theme` (or on `:root`) and\n yours wins — nothing here is `!important`, and the utilities read the variable\n rather than baking a value in:\n\n @theme { --color-brand: var(--color-emerald-600); }\n ──────────────────────────────────────────────────────────────────────────── */\n@theme {\n --color-brand: var(--color-violet-600);\n\n --color-primary-50: var(--color-violet-50);\n --color-primary-100: var(--color-violet-100);\n --color-primary-200: var(--color-violet-200);\n --color-primary-300: var(--color-violet-300);\n --color-primary-400: var(--color-violet-400);\n --color-primary-500: var(--color-violet-500);\n --color-primary-600: var(--color-violet-600);\n --color-primary-700: var(--color-violet-700);\n --color-primary-800: var(--color-violet-800);\n --color-primary-900: var(--color-violet-900);\n --color-primary-950: var(--color-violet-950);\n\n /* Light-theme defaults: 50 = faintest surface, 900/950 = strongest text. */\n --color-secondary-50: var(--color-zinc-50);\n --color-secondary-100: var(--color-zinc-100);\n --color-secondary-200: var(--color-zinc-200);\n --color-secondary-300: var(--color-zinc-300);\n --color-secondary-400: var(--color-zinc-400);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-600);\n --color-secondary-700: var(--color-zinc-700);\n --color-secondary-800: var(--color-zinc-800);\n --color-secondary-900: var(--color-zinc-900);\n --color-secondary-950: var(--color-zinc-950);\n}\n\n@layer base {\n\n/* ─── Progress (circular) — named diameters ──────────────────────────────────\n These ship as real CSS rather than Tailwind classes on the element, because a\n consumer who has not @sourced this package gets no generated utilities and\n the ring would render with NO SIZE at all. They were inline styles before,\n which always worked but could not be overridden by className (issue #17).\n\n Being inside @layer base, a className utility now beats them — which is the\n whole point, and the reason #20 had to land first. */\n[data-react-fancy-progress][data-size=\"sm\"] { width: 2rem; height: 2rem; }\n[data-react-fancy-progress][data-size=\"md\"] { width: 3rem; height: 3rem; }\n[data-react-fancy-progress][data-size=\"lg\"] { width: 4rem; height: 4rem; }\n\n\n\n/* Dark: the neutral scale flips, so \"900\" still means strongest foreground and\n \"50\" still means faintest surface. Wrapped in :where() for zero specificity,\n matching the rest of this file — any consumer override beats it. */\n:where(.dark) {\n --color-secondary-50: var(--color-zinc-950);\n --color-secondary-100: var(--color-zinc-900);\n --color-secondary-200: var(--color-zinc-800);\n --color-secondary-300: var(--color-zinc-700);\n --color-secondary-400: var(--color-zinc-600);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-400);\n --color-secondary-700: var(--color-zinc-300);\n --color-secondary-800: var(--color-zinc-200);\n --color-secondary-900: var(--color-zinc-100);\n --color-secondary-950: var(--color-zinc-50);\n}\n\n/* ─── Input & Field defaults ─────────────────────────────────────────────────\n Better UX out of the box: spacing between stacked fields, smooth transitions,\n and polished dark-mode defaults. All overridable via data-attribute selectors.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Field spacing — adjacent fields get vertical breathing room */\n[data-react-fancy-field] + [data-react-fancy-field] {\n margin-top: 1rem;\n}\n\n/* Smooth transitions on all text inputs, selects, and textareas */\n[data-react-fancy-input] input,\n[data-react-fancy-textarea],\n[data-react-fancy-select],\n[data-react-fancy-date-picker],\n[data-react-fancy-autocomplete] input,\n[data-react-fancy-pillbox],\n[data-react-fancy-otp-input] input,\n[data-react-fancy-time-picker] input,\n[data-react-fancy-color-picker] input {\n transition: border-color 0.15s ease, box-shadow 0.15s ease,\n background-color 0.15s ease;\n}\n\n/* Dark-mode input refinements — slightly darker bg for contrast against page */\n/* ─── Inherent dark-mode defaults ────────────────────────────────────────────\n Every rule below is wrapped in :where() so it carries ZERO specificity, which\n buys two properties at once:\n 1. Inherent — a sensible dark appearance ships out of the box, even when the\n consumer's Tailwind build doesn't generate react-fancy's `dark:` utility\n classes (e.g. they didn't @source the package). This is what lets the\n overlays (Dropdown, Menu, Popover, …) go dark on their own.\n 2. Override-friendly — because specificity is 0, ANY consumer override wins:\n a plain `dark:bg-…` utility, a custom class, or the component's own\n `dark:` class (when it IS generated) all take precedence — no !important,\n no need to target the data-attribute.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Inputs / selects / textareas — darker bg for contrast against the page */\n:where(.dark [data-react-fancy-input] input),\n:where(.dark [data-react-fancy-textarea]),\n:where(.dark [data-react-fancy-select]),\n:where(.dark [data-react-fancy-date-picker]),\n:where(.dark [data-react-fancy-autocomplete] input),\n:where(.dark [data-react-fancy-pillbox]),\n:where(.dark [data-react-fancy-otp-input] input),\n:where(.dark [data-react-fancy-time-picker] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Focus ring — brighter border + subtle glow */\n:where(.dark [data-react-fancy-input] input:focus),\n:where(.dark [data-react-fancy-textarea]:focus),\n:where(.dark [data-react-fancy-select]:focus),\n:where(.dark [data-react-fancy-date-picker]:focus),\n:where(.dark [data-react-fancy-autocomplete] input:focus),\n:where(.dark [data-react-fancy-otp-input] input:focus),\n:where(.dark [data-react-fancy-time-picker] input:focus) {\n border-color: #60a5fa;\n box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.15);\n}\n\n/* Field labels — brighter for readability */\n:where(.dark [data-react-fancy-field] > label:first-child) {\n color: #f4f4f5;\n}\n\n/* Checkbox & radio */\n:where(.dark [data-react-fancy-checkbox] input),\n:where(.dark [data-react-fancy-radio-group] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Switch unchecked track */\n:where(.dark [data-react-fancy-switch] button[aria-checked=\"false\"]) {\n background-color: #3f3f46;\n}\n\n/* Input wrapper affixes */\n:where(.dark [data-react-fancy-input-wrapper] > span:first-child),\n:where(.dark [data-react-fancy-input-wrapper] > span:last-child) {\n border-color: #3f3f46;\n background-color: #27272a;\n}\n\n/* Date picker icon (calendar, clock) */\n:where(.dark [data-react-fancy-date-picker]::-webkit-calendar-picker-indicator) {\n filter: invert(0.8);\n}\n\n/* ─── Overlays — inherent dark surfaces ──────────────────────────────────────\n Dropdown / Menu / Popover / ContextMenu / MobileMenu flyout / Modal / Toast.\n Mirrors the components' own `dark:` utilities (zinc-900 surface, zinc-700\n border, zinc-300 text) so overlays render correctly in dark mode WITHOUT the\n consumer @sourcing react-fancy. When those utilities ARE generated they win\n (specificity 0 here), so there's no drift or double-styling. */\n:where(.dark [data-react-fancy-dropdown]),\n:where(.dark [data-react-fancy-menu]),\n:where(.dark [data-react-fancy-popover]),\n:where(.dark [data-react-fancy-context-menu]),\n:where(.dark [data-react-fancy-context-menu-sub-content]),\n:where(.dark [data-react-fancy-mobile-menu-flyout]),\n:where(.dark [data-react-fancy-modal]),\n:where(.dark [data-react-fancy-toast-item]) {\n background-color: #18181b; /* zinc-900 */\n border-color: #3f3f46; /* zinc-700 */\n color: #d4d4d8; /* zinc-300 */\n}\n\n/* Overlay item hover states */\n:where(.dark [data-react-fancy-dropdown-item]:hover),\n:where(.dark [data-react-fancy-menu-item]:hover),\n:where(.dark [data-react-fancy-context-menu-item]:hover) {\n background-color: #27272a; /* zinc-800 */\n}\n\n/* Overlay separators */\n:where(.dark [data-react-fancy-dropdown-separator]),\n:where(.dark [data-react-fancy-context-menu-separator]) {\n background-color: #3f3f46; /* zinc-700 */\n}\n\n/* ─── Media viewer — transparency checkerboard ───────────────────────────────\n Backdrop for <ImageViewer> / <MediaViewer> so transparent images read clearly.\n Light + dark variants; the dark rule is wrapped in :where() (zero specificity)\n so it ships out of the box without the consumer @sourcing react-fancy. */\n.fancy-checkerboard {\n background-color: #ffffff;\n background-image:\n linear-gradient(45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(-45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #e5e7eb 75%),\n linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);\n background-size: 16px 16px;\n background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n}\n\n:where(.dark) .fancy-checkerboard {\n background-color: #18181b; /* zinc-900 */\n background-image:\n linear-gradient(45deg, #27272a 25%, transparent 25%),\n linear-gradient(-45deg, #27272a 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #27272a 75%),\n linear-gradient(-45deg, transparent 75%, #27272a 75%);\n}\n}\n\n\n@keyframes fancy-fade-in {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-left {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-right {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@layer base {\n\n\n.fancy-fade-in {\n animation: fancy-fade-in 0.2s ease-out;\n}\n\n.fancy-slide-left {\n animation: fancy-slide-left 0.3s ease-out;\n}\n\n.fancy-slide-right {\n animation: fancy-slide-right 0.3s ease-out;\n}\n}\n\n\n/* Overlay / floating animations */\n\n@keyframes fancy-scale-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes fancy-slide-up {\n from {\n opacity: 0;\n transform: translateY(16px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n@keyframes fancy-toast-in {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-collapse-open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n\n@keyframes fancy-collapse-close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n\n@layer base {\n\n\n.fancy-scale-in {\n animation: fancy-scale-in 0.15s ease-out;\n}\n\n.fancy-slide-up {\n animation: fancy-slide-up 0.2s ease-out;\n}\n\n.fancy-fade-out {\n animation: fancy-fade-out 0.15s ease-in forwards;\n}\n\n.fancy-toast-in {\n animation: fancy-toast-in 0.3s ease-out;\n}\n\n.fancy-collapse-open {\n animation: fancy-collapse-open 0.2s ease-out forwards;\n}\n\n.fancy-collapse-close {\n animation: fancy-collapse-close 0.15s ease-in forwards;\n}\n}\n\n\n/* Mobile flyout slide animations */\n\n@keyframes fancy-slide-in-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-out-left {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n}\n\n@keyframes fancy-slide-in-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n/* Avatar glow — a looping halo ring (box-shadow only, no reflow). Color comes\n from the --fancy-glow custom property set on the element. */\n@keyframes fancy-avatar-glow {\n 0% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 55%, transparent);\n opacity: 0.9;\n }\n 70% {\n box-shadow: 0 0 0 6px color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.5;\n }\n 100% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.9;\n }\n}\n\n@layer base {\n\n\n.fancy-avatar-glow {\n position: absolute;\n inset: 0;\n border-radius: 9999px;\n pointer-events: none;\n box-shadow:\n 0 0 0 2px color-mix(in srgb, var(--fancy-glow, #a855f7) 70%, transparent),\n 0 0 10px 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 45%, transparent);\n animation: fancy-avatar-glow 1.6s ease-out infinite;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-avatar-glow {\n animation: none;\n }\n}\n}\n\n\n@keyframes fancy-slide-out-right {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n@layer base {\n\n\n.fancy-slide-in-left {\n animation: fancy-slide-in-left 0.25s ease-out;\n}\n\n.fancy-slide-out-left {\n animation: fancy-slide-out-left 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-right {\n animation: fancy-slide-in-right 0.25s ease-out;\n}\n\n.fancy-slide-out-right {\n animation: fancy-slide-out-right 0.2s ease-in forwards;\n}\n}\n\n\n/* Vertical drawer edges. The horizontal pair above predates Drawer (it was\n built for MobileMenu.Flyout, which only ever opened left/right); these\n complete the set so `side=\"top\"`/`side=\"bottom\"` animate rather than pop. */\n\n@keyframes fancy-slide-in-top {\n from {\n transform: translateY(-100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-top {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n}\n\n@keyframes fancy-slide-in-bottom {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-bottom {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n}\n\n@layer base {\n\n\n.fancy-slide-in-top {\n animation: fancy-slide-in-top 0.25s ease-out;\n}\n\n.fancy-slide-out-top {\n animation: fancy-slide-out-top 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-bottom {\n animation: fancy-slide-in-bottom 0.25s ease-out;\n}\n\n.fancy-slide-out-bottom {\n animation: fancy-slide-out-bottom 0.2s ease-in forwards;\n}\n\n/* Reduced motion collapses the travel — but must NOT use `animation: none`.\n `useAnimation` unmounts on `animationend`, so removing the animation removes\n the event, and a closed drawer would stay in the DOM forever. A ~0 duration\n still fires it. */\n@media (prefers-reduced-motion: reduce) {\n .fancy-slide-in-left,\n .fancy-slide-out-left,\n .fancy-slide-in-right,\n .fancy-slide-out-right,\n .fancy-slide-in-top,\n .fancy-slide-out-top,\n .fancy-slide-in-bottom,\n .fancy-slide-out-bottom {\n animation-duration: 0.01ms;\n }\n}\n\n/* ─── Marquee ────────────────────────────────────────────────────────────────\n Edge-to-edge auto-scrolling strip. The track holds two identical copies of\n the content; translateX(-50%) over one loop shifts exactly one copy, so the\n wrap is seamless. Duration/gap/fade arrive as custom properties set by the\n component. No animation under prefers-reduced-motion.\n ──────────────────────────────────────────────────────────────────────────── */\n\n[data-react-fancy-marquee] {\n overflow: hidden;\n width: 100%;\n}\n\n.fancy-marquee--fade {\n -webkit-mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n}\n\n.fancy-marquee__track {\n display: flex;\n width: max-content;\n animation: fancy-marquee var(--fancy-marquee-duration, 40s) linear infinite;\n will-change: transform;\n}\n\n[data-react-fancy-marquee][data-direction=\"right\"] .fancy-marquee__track {\n animation-direction: reverse;\n}\n\n.fancy-marquee--pause-hover:hover .fancy-marquee__track,\n[data-react-fancy-marquee][data-paused] .fancy-marquee__track {\n animation-play-state: paused;\n}\n\n.fancy-marquee__group {\n display: flex;\n flex: none;\n}\n\n.fancy-marquee__unit {\n display: flex;\n flex: none;\n align-items: center;\n gap: var(--fancy-marquee-gap, 40px);\n padding-inline-end: var(--fancy-marquee-gap, 40px);\n white-space: nowrap;\n}\n\n.fancy-marquee__item,\n.fancy-marquee__separator {\n flex: none;\n}\n}\n\n\n@keyframes fancy-marquee {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-50%);\n }\n}\n\n@layer base {\n\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-marquee__track {\n animation: none;\n }\n}\n}\n\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/* @particle-academy/react-fancy — base styles + animations */\n\n/* ─── Brand colour scheme ────────────────────────────────────────────────────\n Three token families every Fancy package can rely on, so a component never\n has to invent a palette or hardcode a literal:\n\n brand one accent — the thing a consumer rebrands first\n primary-* the accent as a full 50→950 scale\n secondary-* the NEUTRAL scale for surfaces, borders and body text\n\n Why this exists: packages were already writing `bg-brand`, `text-primary-600`\n and `border-secondary-200` against tokens nothing defined. Tailwind generated\n no such utility, the class silently resolved to nothing, and the component\n rendered unstyled — correct markup, no colour, no error. Defining them here\n turns those classes into a contract instead of a hope.\n\n SECONDARY INVERTS WITH THE THEME. `text-secondary-900` means \"strongest\n foreground\", not \"nearly black\" — so it stays readable on a dark surface.\n That distinction is the whole point: mixing a literal background (`bg-white`)\n with a semantic foreground (`text-secondary-900`) is what produced\n white-on-white in a dark host.\n\n OVERRIDE IT. Redefine any of these in your own `@theme` (or on `:root`) and\n yours wins — nothing here is `!important`, and the utilities read the variable\n rather than baking a value in:\n\n @theme { --color-brand: var(--color-emerald-600); }\n ──────────────────────────────────────────────────────────────────────────── */\n@theme {\n --color-brand: var(--color-violet-600);\n\n --color-primary-50: var(--color-violet-50);\n --color-primary-100: var(--color-violet-100);\n --color-primary-200: var(--color-violet-200);\n --color-primary-300: var(--color-violet-300);\n --color-primary-400: var(--color-violet-400);\n --color-primary-500: var(--color-violet-500);\n --color-primary-600: var(--color-violet-600);\n --color-primary-700: var(--color-violet-700);\n --color-primary-800: var(--color-violet-800);\n --color-primary-900: var(--color-violet-900);\n --color-primary-950: var(--color-violet-950);\n\n /* Light-theme defaults: 50 = faintest surface, 900/950 = strongest text. */\n --color-secondary-50: var(--color-zinc-50);\n --color-secondary-100: var(--color-zinc-100);\n --color-secondary-200: var(--color-zinc-200);\n --color-secondary-300: var(--color-zinc-300);\n --color-secondary-400: var(--color-zinc-400);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-600);\n --color-secondary-700: var(--color-zinc-700);\n --color-secondary-800: var(--color-zinc-800);\n --color-secondary-900: var(--color-zinc-900);\n --color-secondary-950: var(--color-zinc-950);\n}\n\n@layer base {\n\n/* ─── Progress (circular) — named diameters ──────────────────────────────────\n These ship as real CSS rather than Tailwind classes on the element, because a\n consumer who has not @sourced this package gets no generated utilities and\n the ring would render with NO SIZE at all. They were inline styles before,\n which always worked but could not be overridden by className (issue #17).\n\n Being inside @layer base, a className utility now beats them — which is the\n whole point, and the reason #20 had to land first. */\n[data-react-fancy-progress][data-size=\"sm\"] { width: 2rem; height: 2rem; }\n[data-react-fancy-progress][data-size=\"md\"] { width: 3rem; height: 3rem; }\n[data-react-fancy-progress][data-size=\"lg\"] { width: 4rem; height: 4rem; }\n\n\n\n/* Dark: the neutral scale flips, so \"900\" still means strongest foreground and\n \"50\" still means faintest surface. Wrapped in :where() for zero specificity,\n matching the rest of this file — any consumer override beats it. */\n:where(.dark) {\n --color-secondary-50: var(--color-zinc-950);\n --color-secondary-100: var(--color-zinc-900);\n --color-secondary-200: var(--color-zinc-800);\n --color-secondary-300: var(--color-zinc-700);\n --color-secondary-400: var(--color-zinc-600);\n --color-secondary-500: var(--color-zinc-500);\n --color-secondary-600: var(--color-zinc-400);\n --color-secondary-700: var(--color-zinc-300);\n --color-secondary-800: var(--color-zinc-200);\n --color-secondary-900: var(--color-zinc-100);\n --color-secondary-950: var(--color-zinc-50);\n}\n\n/* ─── Input & Field defaults ─────────────────────────────────────────────────\n Better UX out of the box: spacing between stacked fields, smooth transitions,\n and polished dark-mode defaults. All overridable via data-attribute selectors.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Field spacing is the CONTAINER's job, not the field's.\n ────────────────────────────────────────────────────────────────────────────\n This used to be:\n\n [data-react-fancy-field] + [data-react-fancy-field] { margin-top: 1rem; }\n\n An adjacent-sibling selector cannot know which way its parent lays children\n out. Stacked vertically it read as spacing; inside a `grid-cols-2` row it\n pushed the right-hand cell 16px down, and `items-start` could not fix it\n because a margin is not alignment. The only escape was wrapping every field\n in a plain <div> so each became an only-child.\n\n Space fields with the container instead — `space-y-4`, or `gap-4` on a flex\n or grid parent. A container knows its own axis; a sibling selector never\n can. See CHANGELOG 5.17.0 for the migration.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Smooth transitions on all text inputs, selects, and textareas */\n[data-react-fancy-input] input,\n[data-react-fancy-textarea],\n[data-react-fancy-select],\n[data-react-fancy-date-picker],\n[data-react-fancy-autocomplete] input,\n[data-react-fancy-pillbox],\n[data-react-fancy-otp-input] input,\n[data-react-fancy-time-picker] input,\n[data-react-fancy-color-picker] input {\n transition: border-color 0.15s ease, box-shadow 0.15s ease,\n background-color 0.15s ease;\n}\n\n/* Dark-mode input refinements — slightly darker bg for contrast against page */\n/* ─── Inherent dark-mode defaults ────────────────────────────────────────────\n Every rule below is wrapped in :where() so it carries ZERO specificity, which\n buys two properties at once:\n 1. Inherent — a sensible dark appearance ships out of the box, even when the\n consumer's Tailwind build doesn't generate react-fancy's `dark:` utility\n classes (e.g. they didn't @source the package). This is what lets the\n overlays (Dropdown, Menu, Popover, …) go dark on their own.\n 2. Override-friendly — because specificity is 0, ANY consumer override wins:\n a plain `dark:bg-…` utility, a custom class, or the component's own\n `dark:` class (when it IS generated) all take precedence — no !important,\n no need to target the data-attribute.\n ──────────────────────────────────────────────────────────────────────────── */\n\n/* Inputs / selects / textareas — darker bg for contrast against the page */\n:where(.dark [data-react-fancy-input] input),\n:where(.dark [data-react-fancy-textarea]),\n:where(.dark [data-react-fancy-select]),\n:where(.dark [data-react-fancy-date-picker]),\n:where(.dark [data-react-fancy-autocomplete] input),\n:where(.dark [data-react-fancy-pillbox]),\n:where(.dark [data-react-fancy-otp-input] input),\n:where(.dark [data-react-fancy-time-picker] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Focus ring — brighter border + subtle glow */\n:where(.dark [data-react-fancy-input] input:focus),\n:where(.dark [data-react-fancy-textarea]:focus),\n:where(.dark [data-react-fancy-select]:focus),\n:where(.dark [data-react-fancy-date-picker]:focus),\n:where(.dark [data-react-fancy-autocomplete] input:focus),\n:where(.dark [data-react-fancy-otp-input] input:focus),\n:where(.dark [data-react-fancy-time-picker] input:focus) {\n border-color: #60a5fa;\n box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.15);\n}\n\n/* Field labels — brighter for readability */\n:where(.dark [data-react-fancy-field] > label:first-child) {\n color: #f4f4f5;\n}\n\n/* Checkbox & radio */\n:where(.dark [data-react-fancy-checkbox] input),\n:where(.dark [data-react-fancy-radio-group] input) {\n background-color: #1e1e24;\n border-color: #3f3f46;\n}\n\n/* Switch unchecked track */\n:where(.dark [data-react-fancy-switch] button[aria-checked=\"false\"]) {\n background-color: #3f3f46;\n}\n\n/* Input wrapper affixes */\n:where(.dark [data-react-fancy-input-wrapper] > span:first-child),\n:where(.dark [data-react-fancy-input-wrapper] > span:last-child) {\n border-color: #3f3f46;\n background-color: #27272a;\n}\n\n/* Date picker icon (calendar, clock) */\n:where(.dark [data-react-fancy-date-picker]::-webkit-calendar-picker-indicator) {\n filter: invert(0.8);\n}\n\n/* ─── Overlays — inherent dark surfaces ──────────────────────────────────────\n Dropdown / Menu / Popover / ContextMenu / MobileMenu flyout / Modal / Toast.\n Mirrors the components' own `dark:` utilities (zinc-900 surface, zinc-700\n border, zinc-300 text) so overlays render correctly in dark mode WITHOUT the\n consumer @sourcing react-fancy. When those utilities ARE generated they win\n (specificity 0 here), so there's no drift or double-styling. */\n:where(.dark [data-react-fancy-dropdown]),\n:where(.dark [data-react-fancy-menu]),\n:where(.dark [data-react-fancy-popover]),\n:where(.dark [data-react-fancy-context-menu]),\n:where(.dark [data-react-fancy-context-menu-sub-content]),\n:where(.dark [data-react-fancy-mobile-menu-flyout]),\n:where(.dark [data-react-fancy-modal]),\n:where(.dark [data-react-fancy-toast-item]) {\n background-color: #18181b; /* zinc-900 */\n border-color: #3f3f46; /* zinc-700 */\n color: #d4d4d8; /* zinc-300 */\n}\n\n/* Overlay item hover states */\n:where(.dark [data-react-fancy-dropdown-item]:hover),\n:where(.dark [data-react-fancy-menu-item]:hover),\n:where(.dark [data-react-fancy-context-menu-item]:hover) {\n background-color: #27272a; /* zinc-800 */\n}\n\n/* Overlay separators */\n:where(.dark [data-react-fancy-dropdown-separator]),\n:where(.dark [data-react-fancy-context-menu-separator]) {\n background-color: #3f3f46; /* zinc-700 */\n}\n\n/* ─── Media viewer — transparency checkerboard ───────────────────────────────\n Backdrop for <ImageViewer> / <MediaViewer> so transparent images read clearly.\n Light + dark variants; the dark rule is wrapped in :where() (zero specificity)\n so it ships out of the box without the consumer @sourcing react-fancy. */\n.fancy-checkerboard {\n background-color: #ffffff;\n background-image:\n linear-gradient(45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(-45deg, #e5e7eb 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #e5e7eb 75%),\n linear-gradient(-45deg, transparent 75%, #e5e7eb 75%);\n background-size: 16px 16px;\n background-position: 0 0, 0 8px, 8px -8px, -8px 0;\n}\n\n:where(.dark) .fancy-checkerboard {\n background-color: #18181b; /* zinc-900 */\n background-image:\n linear-gradient(45deg, #27272a 25%, transparent 25%),\n linear-gradient(-45deg, #27272a 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #27272a 75%),\n linear-gradient(-45deg, transparent 75%, #27272a 75%);\n}\n}\n\n\n@keyframes fancy-fade-in {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-left {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-right {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@layer base {\n\n\n.fancy-fade-in {\n animation: fancy-fade-in 0.2s ease-out;\n}\n\n.fancy-slide-left {\n animation: fancy-slide-left 0.3s ease-out;\n}\n\n.fancy-slide-right {\n animation: fancy-slide-right 0.3s ease-out;\n}\n}\n\n\n/* Overlay / floating animations */\n\n@keyframes fancy-scale-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes fancy-slide-up {\n from {\n opacity: 0;\n transform: translateY(16px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n@keyframes fancy-toast-in {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-collapse-open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n\n@keyframes fancy-collapse-close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n\n@layer base {\n\n\n.fancy-scale-in {\n animation: fancy-scale-in 0.15s ease-out;\n}\n\n.fancy-slide-up {\n animation: fancy-slide-up 0.2s ease-out;\n}\n\n.fancy-fade-out {\n animation: fancy-fade-out 0.15s ease-in forwards;\n}\n\n.fancy-toast-in {\n animation: fancy-toast-in 0.3s ease-out;\n}\n\n.fancy-collapse-open {\n animation: fancy-collapse-open 0.2s ease-out forwards;\n}\n\n.fancy-collapse-close {\n animation: fancy-collapse-close 0.15s ease-in forwards;\n}\n}\n\n\n/* Mobile flyout slide animations */\n\n@keyframes fancy-slide-in-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes fancy-slide-out-left {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n}\n\n@keyframes fancy-slide-in-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n/* Avatar glow — a looping halo ring (box-shadow only, no reflow). Color comes\n from the --fancy-glow custom property set on the element. */\n@keyframes fancy-avatar-glow {\n 0% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 55%, transparent);\n opacity: 0.9;\n }\n 70% {\n box-shadow: 0 0 0 6px color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.5;\n }\n 100% {\n box-shadow: 0 0 0 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 0%, transparent);\n opacity: 0.9;\n }\n}\n\n@layer base {\n\n\n.fancy-avatar-glow {\n position: absolute;\n inset: 0;\n border-radius: 9999px;\n pointer-events: none;\n box-shadow:\n 0 0 0 2px color-mix(in srgb, var(--fancy-glow, #a855f7) 70%, transparent),\n 0 0 10px 0 color-mix(in srgb, var(--fancy-glow, #a855f7) 45%, transparent);\n animation: fancy-avatar-glow 1.6s ease-out infinite;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-avatar-glow {\n animation: none;\n }\n}\n}\n\n\n@keyframes fancy-slide-out-right {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n@layer base {\n\n\n.fancy-slide-in-left {\n animation: fancy-slide-in-left 0.25s ease-out;\n}\n\n.fancy-slide-out-left {\n animation: fancy-slide-out-left 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-right {\n animation: fancy-slide-in-right 0.25s ease-out;\n}\n\n.fancy-slide-out-right {\n animation: fancy-slide-out-right 0.2s ease-in forwards;\n}\n}\n\n\n/* Vertical drawer edges. The horizontal pair above predates Drawer (it was\n built for MobileMenu.Flyout, which only ever opened left/right); these\n complete the set so `side=\"top\"`/`side=\"bottom\"` animate rather than pop. */\n\n@keyframes fancy-slide-in-top {\n from {\n transform: translateY(-100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-top {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n}\n\n@keyframes fancy-slide-in-bottom {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes fancy-slide-out-bottom {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n}\n\n@layer base {\n\n\n.fancy-slide-in-top {\n animation: fancy-slide-in-top 0.25s ease-out;\n}\n\n.fancy-slide-out-top {\n animation: fancy-slide-out-top 0.2s ease-in forwards;\n}\n\n.fancy-slide-in-bottom {\n animation: fancy-slide-in-bottom 0.25s ease-out;\n}\n\n.fancy-slide-out-bottom {\n animation: fancy-slide-out-bottom 0.2s ease-in forwards;\n}\n\n/* Reduced motion collapses the travel — but must NOT use `animation: none`.\n `useAnimation` unmounts on `animationend`, so removing the animation removes\n the event, and a closed drawer would stay in the DOM forever. A ~0 duration\n still fires it. */\n@media (prefers-reduced-motion: reduce) {\n .fancy-slide-in-left,\n .fancy-slide-out-left,\n .fancy-slide-in-right,\n .fancy-slide-out-right,\n .fancy-slide-in-top,\n .fancy-slide-out-top,\n .fancy-slide-in-bottom,\n .fancy-slide-out-bottom {\n animation-duration: 0.01ms;\n }\n}\n\n/* ─── Marquee ────────────────────────────────────────────────────────────────\n Edge-to-edge auto-scrolling strip. The track holds two identical copies of\n the content; translateX(-50%) over one loop shifts exactly one copy, so the\n wrap is seamless. Duration/gap/fade arrive as custom properties set by the\n component. No animation under prefers-reduced-motion.\n ──────────────────────────────────────────────────────────────────────────── */\n\n[data-react-fancy-marquee] {\n overflow: hidden;\n width: 100%;\n}\n\n.fancy-marquee--fade {\n -webkit-mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n mask-image: linear-gradient(\n to right,\n transparent,\n black var(--fancy-marquee-fade, 48px),\n black calc(100% - var(--fancy-marquee-fade, 48px)),\n transparent\n );\n}\n\n.fancy-marquee__track {\n display: flex;\n width: max-content;\n animation: fancy-marquee var(--fancy-marquee-duration, 40s) linear infinite;\n will-change: transform;\n}\n\n[data-react-fancy-marquee][data-direction=\"right\"] .fancy-marquee__track {\n animation-direction: reverse;\n}\n\n.fancy-marquee--pause-hover:hover .fancy-marquee__track,\n[data-react-fancy-marquee][data-paused] .fancy-marquee__track {\n animation-play-state: paused;\n}\n\n.fancy-marquee__group {\n display: flex;\n flex: none;\n}\n\n.fancy-marquee__unit {\n display: flex;\n flex: none;\n align-items: center;\n gap: var(--fancy-marquee-gap, 40px);\n padding-inline-end: var(--fancy-marquee-gap, 40px);\n white-space: nowrap;\n}\n\n.fancy-marquee__item,\n.fancy-marquee__separator {\n flex: none;\n}\n}\n\n\n@keyframes fancy-marquee {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-50%);\n }\n}\n\n@layer base {\n\n\n@media (prefers-reduced-motion: reduce) {\n .fancy-marquee__track {\n animation: none;\n }\n}\n}\n\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@particle-academy/react-fancy",
3
- "version": "5.16.0",
3
+ "version": "5.17.1",
4
4
  "description": "React UI component library for Human+ UX — controlled, agent-bridgeable primitives",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Modal/Modal.context.ts","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/Modal.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"chunk-MYF2PDTU.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ModalContextValue } from \"./Modal.types\";\n\nexport const ModalContext = createContext<ModalContextValue | null>(null);\n\nexport function useModal(): ModalContextValue {\n const ctx = useContext(ModalContext);\n if (!ctx) {\n throw new Error(\"Modal compound components must be used within <Modal>\");\n }\n return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useModal } from \"./Modal.context\";\nimport type { ModalHeaderProps } from \"./Modal.types\";\n\nexport function ModalHeader({ children, className }: ModalHeaderProps) {\n const { close } = useModal();\n\n return (\n <div\n data-react-fancy-modal-header=\"\"\n className={cn(\n \"flex items-center justify-between border-b border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n <div className=\"text-lg font-semibold text-zinc-900 dark:text-zinc-100\">{children}</div>\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={20} />\n </button>\n </div>\n );\n}\n\nModalHeader.displayName = \"ModalHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalBodyProps } from \"./Modal.types\";\n\nexport function ModalBody({ children, className }: ModalBodyProps) {\n return (\n <div data-react-fancy-modal-body=\"\" className={cn(\"flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300\", className)}>\n {children}\n </div>\n );\n}\n\nModalBody.displayName = \"ModalBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalFooterProps } from \"./Modal.types\";\n\nexport function ModalFooter({ children, className }: ModalFooterProps) {\n return (\n <div\n data-react-fancy-modal-footer=\"\"\n className={cn(\n \"flex items-center justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nModalFooter.displayName = \"ModalFooter\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ModalContext } from \"./Modal.context\";\nimport { ModalHeader } from \"./ModalHeader\";\nimport { ModalBody } from \"./ModalBody\";\nimport { ModalFooter } from \"./ModalFooter\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { ModalProps } from \"./Modal.types\";\n\nconst SIZE_MAP = {\n sm: \"max-w-sm\",\n md: \"max-w-lg\",\n lg: \"max-w-2xl\",\n xl: \"max-w-4xl\",\n full: \"max-w-[calc(100vw-2rem)] max-h-[calc(100vh-2rem)]\",\n} as const;\n\nfunction ModalRoot({\n children,\n open,\n onClose,\n size = \"md\",\n className,\n ...rest\n}: ModalProps) {\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => onClose(), [onClose]);\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Body scroll lock\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(() => ({ open, close }), [open, close]);\n\n if (!mounted) return null;\n\n return (\n <ModalContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n {/* Backdrop */}\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n {/* Panel */}\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-modal=\"\"\n role=\"dialog\"\n aria-modal=\"true\"\n {...rest}\n className={cn(\n \"relative flex w-full flex-col overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900\",\n SIZE_MAP[size],\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </ModalContext.Provider>\n );\n}\n\nexport const Modal = Object.assign(ModalRoot, {\n Header: ModalHeader,\n Body: ModalBody,\n Footer: ModalFooter,\n});\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Modal/Modal.context.ts","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/Modal.tsx"],"names":["createContext","useContext","jsxs","cn","jsx","X","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useAnimation","useMemo","Portal"],"mappings":"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","file":"chunk-TZKZ2LUF.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ModalContextValue } from \"./Modal.types\";\n\nexport const ModalContext = createContext<ModalContextValue | null>(null);\n\nexport function useModal(): ModalContextValue {\n const ctx = useContext(ModalContext);\n if (!ctx) {\n throw new Error(\"Modal compound components must be used within <Modal>\");\n }\n return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useModal } from \"./Modal.context\";\nimport type { ModalHeaderProps } from \"./Modal.types\";\n\nexport function ModalHeader({ children, className }: ModalHeaderProps) {\n const { close } = useModal();\n\n return (\n <div\n data-react-fancy-modal-header=\"\"\n className={cn(\n \"flex items-center justify-between border-b border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n <div className=\"text-lg font-semibold text-zinc-900 dark:text-zinc-100\">{children}</div>\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={20} />\n </button>\n </div>\n );\n}\n\nModalHeader.displayName = \"ModalHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalBodyProps } from \"./Modal.types\";\n\nexport function ModalBody({ children, className }: ModalBodyProps) {\n return (\n <div data-react-fancy-modal-body=\"\" className={cn(\"flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300\", className)}>\n {children}\n </div>\n );\n}\n\nModalBody.displayName = \"ModalBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalFooterProps } from \"./Modal.types\";\n\nexport function ModalFooter({ children, className }: ModalFooterProps) {\n return (\n <div\n data-react-fancy-modal-footer=\"\"\n className={cn(\n \"flex items-center justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700\",\n className,\n )}\n >\n {children}\n </div>\n );\n}\n\nModalFooter.displayName = \"ModalFooter\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ModalContext } from \"./Modal.context\";\nimport { ModalHeader } from \"./ModalHeader\";\nimport { ModalBody } from \"./ModalBody\";\nimport { ModalFooter } from \"./ModalFooter\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { ModalProps } from \"./Modal.types\";\n\nconst SIZE_MAP = {\n sm: \"max-w-sm\",\n md: \"max-w-lg\",\n lg: \"max-w-2xl\",\n xl: \"max-w-4xl\",\n full: \"max-w-[calc(100vw-2rem)] max-h-[calc(100vh-2rem)]\",\n} as const;\n\nfunction ModalRoot({\n children,\n open,\n onClose,\n size = \"md\",\n className,\n ...rest\n}: ModalProps) {\n const panelRef = useRef<HTMLDivElement>(null);\n\n const close = useCallback(() => onClose(), [onClose]);\n useEscapeKey(close, open);\n useFocusTrap(panelRef, open);\n\n // Body scroll lock\n useEffect(() => {\n if (open) {\n const original = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n return () => {\n document.body.style.overflow = original;\n };\n }\n }, [open]);\n\n const { mounted, className: animClass, ref: animRef } = useAnimation({\n open,\n enterClass: \"fancy-slide-up\",\n exitClass: \"fancy-fade-out\",\n });\n\n const ctx = useMemo(() => ({ open, close }), [open, close]);\n\n if (!mounted) return null;\n\n return (\n <ModalContext.Provider value={ctx}>\n <Portal>\n <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n {/* Backdrop */}\n <div\n className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n onClick={close}\n aria-hidden=\"true\"\n />\n {/* Panel */}\n <div\n ref={(node) => {\n panelRef.current = node;\n (animRef as React.MutableRefObject<HTMLElement | null>).current =\n node;\n }}\n data-react-fancy-modal=\"\"\n role=\"dialog\"\n aria-modal=\"true\"\n {...rest}\n className={cn(\n \"relative flex w-full flex-col overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900\",\n SIZE_MAP[size],\n animClass,\n className,\n )}\n >\n {children}\n </div>\n </div>\n </Portal>\n </ModalContext.Provider>\n );\n}\n\nexport const Modal = Object.assign(ModalRoot, {\n Header: ModalHeader,\n Body: ModalBody,\n Footer: ModalFooter,\n});\n"]}