@apipass/design-system 7.4.7 → 8.1.0

package/dist/lib/ui/components/FormModal/FormModal.js

@@ -1,42 +1,43 @@
-import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 /* empty css              */
-import { DialogModal as h, Dialog as u, DialogTitle as D, DialogClose as y, DialogBody as P } from "../../primitives/Dialog/Dialog.js";
-import { Flex as o } from "../../layout/Flex/Flex.js";
-import { Button as n } from "../../primitives/Button/Button.js";
+import { DialogModal as h, Dialog as u, DialogTitle as D, DialogClose as P, DialogBody as y } from "../../primitives/Dialog/Dialog.js";
+import { Flex as a } from "../../layout/Flex/Flex.js";
+import { Button as l } from "../../primitives/Button/Button.js";
 function B({
-  isOpen: l,
+  isOpen: o,
   title: m,
-  submitLabel: t = "Save",
-  cancelLabel: c = "Cancel",
-  isLoading: e = !1,
-  isSubmitDisabled: d = !1,
+  submitLabel: d = "Save",
+  cancelLabel: t = "Cancel",
+  isLoading: n = !1,
+  isSubmitDisabled: c = !1,
   size: s = "medium",
   onSubmit: f,
-  onClose: i,
-  children: p
+  onClose: e,
+  children: g
 }) {
-  return l ? /* @__PURE__ */ r(h, { isOpen: l, onOpenChange: (g) => !g && i(), children: /* @__PURE__ */ a(u, { className: "form-modal", size: s, children: [
-    /* @__PURE__ */ a(o, { direction: "row", alignPrimary: "space-between", alignSecondary: "center", children: [
+  return o ? /* @__PURE__ */ r(h, { isOpen: o, onOpenChange: (p) => !p && e(), children: /* @__PURE__ */ i(u, { className: "form-modal", size: s, children: [
+    /* @__PURE__ */ i(a, { direction: "row", alignPrimary: "space-between", alignSecondary: "center", children: [
       /* @__PURE__ */ r(D, { children: m }),
-      /* @__PURE__ */ r(y, { onPress: i })
+      /* @__PURE__ */ r(P, { onPress: e })
     ] }),
-    /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(o, { direction: "column", gap: "300", children: p }) }),
-    /* @__PURE__ */ a(
-      o,
+    /* @__PURE__ */ r(y, { children: /* @__PURE__ */ r(a, { direction: "column", gap: "300", children: g }) }),
+    /* @__PURE__ */ i(
+      a,
       {
         direction: "row",
         gap: "200",
         alignPrimary: "end",
         className: "form-modal-footer",
         children: [
-          /* @__PURE__ */ r(n, { variant: "neutral", onPress: i, isDisabled: e, children: c }),
+          /* @__PURE__ */ r(l, { variant: "neutral", onPress: e, isDisabled: n, children: t }),
           /* @__PURE__ */ r(
-            n,
+            l,
             {
               variant: "primary",
               onPress: f,
-              isDisabled: d || e,
-              children: e ? "..." : t
+              isDisabled: c,
+              isPending: n,
+              children: d
             }
           )
         ]

package/dist/lib/ui/components/FormModal/FormModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormModal.js","sources":["../../../../../src/ui/components/FormModal/FormModal.tsx"],"sourcesContent":["import {\n  Button,\n  Dialog,\n  DialogBody,\n  DialogClose,\n  DialogModal,\n  DialogTitle,\n  type DialogSize,\n} from \"primitives\";\nimport { Flex } from \"layout\";\nimport type { ReactNode } from \"react\";\nimport \"./formmodal.css\";\n\nexport type FormModalSize = DialogSize;\n\nexport interface FormModalProps {\n  isOpen: boolean;\n  title: string;\n  submitLabel?: string;\n  cancelLabel?: string;\n  isLoading?: boolean;\n  isSubmitDisabled?: boolean;\n  /**\n   * Maximum width of the dialog. Defaults to `\"medium\"`, which preserves the\n   * previous fixed width. Use `\"large\"`/`\"xlarge\"` for forms that embed wide\n   * content such as tables.\n   */\n  size?: FormModalSize;\n  onSubmit: () => void;\n  onClose: () => void;\n  children: ReactNode;\n}\n\nexport function FormModal({\n  isOpen,\n  title,\n  submitLabel = \"Save\",\n  cancelLabel = \"Cancel\",\n  isLoading = false,\n  isSubmitDisabled = false,\n  size = \"medium\",\n  onSubmit,\n  onClose,\n  children,\n}: FormModalProps) {\n  if (!isOpen) return null;\n\n  return (\n    <DialogModal isOpen={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <Dialog className=\"form-modal\" size={size}>\n        <Flex direction=\"row\" alignPrimary=\"space-between\" alignSecondary=\"center\">\n          <DialogTitle>{title}</DialogTitle>\n          <DialogClose onPress={onClose} />\n        </Flex>\n        <DialogBody>\n          <Flex direction=\"column\" gap=\"300\">\n            {children}\n          </Flex>\n        </DialogBody>\n        <Flex\n          direction=\"row\"\n          gap=\"200\"\n          alignPrimary=\"end\"\n          className=\"form-modal-footer\"\n        >\n          <Button variant=\"neutral\" onPress={onClose} isDisabled={isLoading}>\n            {cancelLabel}\n          </Button>\n          <Button\n            variant=\"primary\"\n            onPress={onSubmit}\n            isDisabled={isSubmitDisabled || isLoading}\n          >\n            {isLoading ? \"...\" : submitLabel}\n          </Button>\n        </Flex>\n      </Dialog>\n    </DialogModal>\n  );\n}\n"],"names":["FormModal","isOpen","title","submitLabel","cancelLabel","isLoading","isSubmitDisabled","size","onSubmit","onClose","children","jsx","DialogModal","open","jsxs","Dialog","Flex","DialogTitle","DialogClose","DialogBody","Button"],"mappings":";;;;;AAiCO,SAASA,EAAU;AAAA,EACxB,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,kBAAAC,IAAmB;AAAA,EACnB,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AACF,GAAmB;AACjB,SAAKT,IAGH,gBAAAU,EAACC,GAAA,EAAY,QAAAX,GAAgB,cAAc,CAACY,MAAS,CAACA,KAAQJ,EAAA,GAC5D,UAAA,gBAAAK,EAACC,GAAA,EAAO,WAAU,cAAa,MAAAR,GAC7B,UAAA;AAAA,IAAA,gBAAAO,EAACE,KAAK,WAAU,OAAM,cAAa,iBAAgB,gBAAe,UAChE,UAAA;AAAA,MAAA,gBAAAL,EAACM,KAAa,UAAAf,EAAA,CAAM;AAAA,MACpB,gBAAAS,EAACO,GAAA,EAAY,SAAST,EAAA,CAAS;AAAA,IAAA,GACjC;AAAA,IACA,gBAAAE,EAACQ,KACC,UAAA,gBAAAR,EAACK,GAAA,EAAK,WAAU,UAAS,KAAI,OAC1B,UAAAN,EAAA,CACH,EAAA,CACF;AAAA,IACA,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,KAAI;AAAA,QACJ,cAAa;AAAA,QACb,WAAU;AAAA,QAEV,UAAA;AAAA,UAAA,gBAAAL,EAACS,KAAO,SAAQ,WAAU,SAASX,GAAS,YAAYJ,GACrD,UAAAD,EAAA,CACH;AAAA,UACA,gBAAAO;AAAA,YAACS;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,SAASZ;AAAA,cACT,YAAYF,KAAoBD;AAAA,cAE/B,cAAY,QAAQF;AAAA,YAAA;AAAA,UAAA;AAAA,QACvB;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CACF,EAAA,CACF,IAhCkB;AAkCtB;"}
+{"version":3,"file":"FormModal.js","sources":["../../../../../src/ui/components/FormModal/FormModal.tsx"],"sourcesContent":["import {\n  Button,\n  Dialog,\n  DialogBody,\n  DialogClose,\n  DialogModal,\n  DialogTitle,\n  type DialogSize,\n} from \"primitives\";\nimport { Flex } from \"layout\";\nimport type { ReactNode } from \"react\";\nimport \"./formmodal.css\";\n\nexport type FormModalSize = DialogSize;\n\nexport interface FormModalProps {\n  isOpen: boolean;\n  title: string;\n  submitLabel?: string;\n  cancelLabel?: string;\n  isLoading?: boolean;\n  isSubmitDisabled?: boolean;\n  /**\n   * Maximum width of the dialog. Defaults to `\"medium\"`, which preserves the\n   * previous fixed width. Use `\"large\"`/`\"xlarge\"` for forms that embed wide\n   * content such as tables.\n   */\n  size?: FormModalSize;\n  onSubmit: () => void;\n  onClose: () => void;\n  children: ReactNode;\n}\n\nexport function FormModal({\n  isOpen,\n  title,\n  submitLabel = \"Save\",\n  cancelLabel = \"Cancel\",\n  isLoading = false,\n  isSubmitDisabled = false,\n  size = \"medium\",\n  onSubmit,\n  onClose,\n  children,\n}: FormModalProps) {\n  if (!isOpen) return null;\n\n  return (\n    <DialogModal isOpen={isOpen} onOpenChange={(open) => !open && onClose()}>\n      <Dialog className=\"form-modal\" size={size}>\n        <Flex direction=\"row\" alignPrimary=\"space-between\" alignSecondary=\"center\">\n          <DialogTitle>{title}</DialogTitle>\n          <DialogClose onPress={onClose} />\n        </Flex>\n        <DialogBody>\n          <Flex direction=\"column\" gap=\"300\">\n            {children}\n          </Flex>\n        </DialogBody>\n        <Flex\n          direction=\"row\"\n          gap=\"200\"\n          alignPrimary=\"end\"\n          className=\"form-modal-footer\"\n        >\n          <Button variant=\"neutral\" onPress={onClose} isDisabled={isLoading}>\n            {cancelLabel}\n          </Button>\n          <Button\n            variant=\"primary\"\n            onPress={onSubmit}\n            isDisabled={isSubmitDisabled}\n            isPending={isLoading}\n          >\n            {submitLabel}\n          </Button>\n        </Flex>\n      </Dialog>\n    </DialogModal>\n  );\n}\n"],"names":["FormModal","isOpen","title","submitLabel","cancelLabel","isLoading","isSubmitDisabled","size","onSubmit","onClose","children","jsx","DialogModal","open","jsxs","Dialog","Flex","DialogTitle","DialogClose","DialogBody","Button"],"mappings":";;;;;AAiCO,SAASA,EAAU;AAAA,EACxB,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,kBAAAC,IAAmB;AAAA,EACnB,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AACF,GAAmB;AACjB,SAAKT,IAGH,gBAAAU,EAACC,GAAA,EAAY,QAAAX,GAAgB,cAAc,CAACY,MAAS,CAACA,KAAQJ,EAAA,GAC5D,UAAA,gBAAAK,EAACC,GAAA,EAAO,WAAU,cAAa,MAAAR,GAC7B,UAAA;AAAA,IAAA,gBAAAO,EAACE,KAAK,WAAU,OAAM,cAAa,iBAAgB,gBAAe,UAChE,UAAA;AAAA,MAAA,gBAAAL,EAACM,KAAa,UAAAf,EAAA,CAAM;AAAA,MACpB,gBAAAS,EAACO,GAAA,EAAY,SAAST,EAAA,CAAS;AAAA,IAAA,GACjC;AAAA,IACA,gBAAAE,EAACQ,KACC,UAAA,gBAAAR,EAACK,GAAA,EAAK,WAAU,UAAS,KAAI,OAC1B,UAAAN,EAAA,CACH,EAAA,CACF;AAAA,IACA,gBAAAI;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,KAAI;AAAA,QACJ,cAAa;AAAA,QACb,WAAU;AAAA,QAEV,UAAA;AAAA,UAAA,gBAAAL,EAACS,KAAO,SAAQ,WAAU,SAASX,GAAS,YAAYJ,GACrD,UAAAD,EAAA,CACH;AAAA,UACA,gBAAAO;AAAA,YAACS;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,SAASZ;AAAA,cACT,YAAYF;AAAA,cACZ,WAAWD;AAAA,cAEV,UAAAF;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CACF,EAAA,CACF,IAjCkB;AAmCtB;"}

package/dist/lib/ui/components/LoadingOverlay/LoadingOverlay.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../../vendor/clsx/dist/clsx.cjs"),g=require("react-aria-components");;/* empty css                      */const i=require("../../hooks/useLoadingVisibility.cjs"),y=require("../../primitives/Dialog/Dialog.cjs"),b=require("../../primitives/BrandLoader/BrandLoader.cjs");function m({isOpen:r,label:s,message:a,variant:n="trace",size:o="64",delayMs:l=i.defaultLoadingDelayMs,minVisibleMs:t=i.defaultLoadingMinVisibleMs,className:d}){const c=i.useLoadingVisibility(r,{delayMs:l,minVisibleMs:t});return e.jsx(y.DialogModal,{isOpen:c,isDismissable:!1,isKeyboardDismissDisabled:!0,className:u.clsx("loading-overlay",d),children:e.jsxs(g.Dialog,{"aria-label":s,className:"loading-overlay-content",children:[e.jsx(b.BrandLoader,{label:s,variant:n,size:o}),a&&e.jsx("span",{className:"loading-overlay-message",children:a})]})})}exports.LoadingOverlay=m;
+//# sourceMappingURL=LoadingOverlay.cjs.map

package/dist/lib/ui/components/LoadingOverlay/LoadingOverlay.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingOverlay.cjs","sources":["../../../../../src/ui/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n  defaultLoadingDelayMs,\n  defaultLoadingMinVisibleMs,\n  useLoadingVisibility,\n} from \"hooks\";\nimport {\n  BrandLoader,\n  DialogModal,\n  type BrandLoaderSize,\n  type BrandLoaderVariant,\n} from \"primitives\";\nimport { Dialog as RACDialog } from \"react-aria-components\";\nimport \"./loading-overlay.css\";\n\nexport type LoadingOverlayProps = {\n  isOpen: boolean;\n  label: string;\n  message?: string;\n  variant?: BrandLoaderVariant;\n  size?: BrandLoaderSize;\n  delayMs?: number;\n  minVisibleMs?: number;\n  className?: string;\n};\n\nexport function LoadingOverlay({\n  isOpen,\n  label,\n  message,\n  variant = \"trace\",\n  size = \"64\",\n  delayMs = defaultLoadingDelayMs,\n  minVisibleMs = defaultLoadingMinVisibleMs,\n  className,\n}: LoadingOverlayProps) {\n  const isVisible = useLoadingVisibility(isOpen, { delayMs, minVisibleMs });\n\n  return (\n    <DialogModal\n      isOpen={isVisible}\n      isDismissable={false}\n      isKeyboardDismissDisabled\n      className={clsx(\"loading-overlay\", className)}\n    >\n      <RACDialog aria-label={label} className=\"loading-overlay-content\">\n        <BrandLoader label={label} variant={variant} size={size} />\n        {message && <span className=\"loading-overlay-message\">{message}</span>}\n      </RACDialog>\n    </DialogModal>\n  );\n}\n"],"names":["LoadingOverlay","isOpen","label","message","variant","size","delayMs","defaultLoadingDelayMs","minVisibleMs","defaultLoadingMinVisibleMs","className","isVisible","useLoadingVisibility","jsx","DialogModal","clsx","jsxs","RACDialog","BrandLoader"],"mappings":"+YA0BO,SAASA,EAAe,CAC7B,OAAAC,EACA,MAAAC,EACA,QAAAC,EACA,QAAAC,EAAU,QACV,KAAAC,EAAO,KACP,QAAAC,EAAUC,EAAAA,sBACV,aAAAC,EAAeC,EAAAA,2BACf,UAAAC,CACF,EAAwB,CACtB,MAAMC,EAAYC,EAAAA,qBAAqBX,EAAQ,CAAE,QAAAK,EAAS,aAAAE,EAAc,EAExE,OACEK,EAAAA,IAACC,EAAAA,YAAA,CACC,OAAQH,EACR,cAAe,GACf,0BAAyB,GACzB,UAAWI,EAAAA,KAAK,kBAAmBL,CAAS,EAE5C,SAAAM,EAAAA,KAACC,EAAAA,OAAA,CAAU,aAAYf,EAAO,UAAU,0BACtC,SAAA,CAAAW,EAAAA,IAACK,EAAAA,YAAA,CAAY,MAAAhB,EAAc,QAAAE,EAAkB,KAAAC,CAAA,CAAY,EACxDF,GAAWU,EAAAA,IAAC,OAAA,CAAK,UAAU,0BAA2B,SAAAV,CAAA,CAAQ,CAAA,CAAA,CACjE,CAAA,CAAA,CAGN"}

package/dist/lib/ui/components/LoadingOverlay/LoadingOverlay.js

@@ -0,0 +1,36 @@
+import { jsx as i, jsxs as d } from "react/jsx-runtime";
+import { clsx as c } from "../../../vendor/clsx/dist/clsx.js";
+import { Dialog as f } from "react-aria-components";
+/* empty css                    */
+import { useLoadingVisibility as p, defaultLoadingDelayMs as g, defaultLoadingMinVisibleMs as y } from "../../hooks/useLoadingVisibility.js";
+import { DialogModal as b } from "../../primitives/Dialog/Dialog.js";
+import { BrandLoader as u } from "../../primitives/BrandLoader/BrandLoader.js";
+function V({
+  isOpen: s,
+  label: a,
+  message: o,
+  variant: r = "trace",
+  size: e = "64",
+  delayMs: l = g,
+  minVisibleMs: n = y,
+  className: m
+}) {
+  const t = p(s, { delayMs: l, minVisibleMs: n });
+  return /* @__PURE__ */ i(
+    b,
+    {
+      isOpen: t,
+      isDismissable: !1,
+      isKeyboardDismissDisabled: !0,
+      className: c("loading-overlay", m),
+      children: /* @__PURE__ */ d(f, { "aria-label": a, className: "loading-overlay-content", children: [
+        /* @__PURE__ */ i(u, { label: a, variant: r, size: e }),
+        o && /* @__PURE__ */ i("span", { className: "loading-overlay-message", children: o })
+      ] })
+    }
+  );
+}
+export {
+  V as LoadingOverlay
+};
+//# sourceMappingURL=LoadingOverlay.js.map

package/dist/lib/ui/components/LoadingOverlay/LoadingOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingOverlay.js","sources":["../../../../../src/ui/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n  defaultLoadingDelayMs,\n  defaultLoadingMinVisibleMs,\n  useLoadingVisibility,\n} from \"hooks\";\nimport {\n  BrandLoader,\n  DialogModal,\n  type BrandLoaderSize,\n  type BrandLoaderVariant,\n} from \"primitives\";\nimport { Dialog as RACDialog } from \"react-aria-components\";\nimport \"./loading-overlay.css\";\n\nexport type LoadingOverlayProps = {\n  isOpen: boolean;\n  label: string;\n  message?: string;\n  variant?: BrandLoaderVariant;\n  size?: BrandLoaderSize;\n  delayMs?: number;\n  minVisibleMs?: number;\n  className?: string;\n};\n\nexport function LoadingOverlay({\n  isOpen,\n  label,\n  message,\n  variant = \"trace\",\n  size = \"64\",\n  delayMs = defaultLoadingDelayMs,\n  minVisibleMs = defaultLoadingMinVisibleMs,\n  className,\n}: LoadingOverlayProps) {\n  const isVisible = useLoadingVisibility(isOpen, { delayMs, minVisibleMs });\n\n  return (\n    <DialogModal\n      isOpen={isVisible}\n      isDismissable={false}\n      isKeyboardDismissDisabled\n      className={clsx(\"loading-overlay\", className)}\n    >\n      <RACDialog aria-label={label} className=\"loading-overlay-content\">\n        <BrandLoader label={label} variant={variant} size={size} />\n        {message && <span className=\"loading-overlay-message\">{message}</span>}\n      </RACDialog>\n    </DialogModal>\n  );\n}\n"],"names":["LoadingOverlay","isOpen","label","message","variant","size","delayMs","defaultLoadingDelayMs","minVisibleMs","defaultLoadingMinVisibleMs","className","isVisible","useLoadingVisibility","jsx","DialogModal","clsx","jsxs","RACDialog","BrandLoader"],"mappings":";;;;;;;AA0BO,SAASA,EAAe;AAAA,EAC7B,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAUC;AAAA,EACV,cAAAC,IAAeC;AAAA,EACf,WAAAC;AACF,GAAwB;AACtB,QAAMC,IAAYC,EAAqBX,GAAQ,EAAE,SAAAK,GAAS,cAAAE,GAAc;AAExE,SACE,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQH;AAAA,MACR,eAAe;AAAA,MACf,2BAAyB;AAAA,MACzB,WAAWI,EAAK,mBAAmBL,CAAS;AAAA,MAE5C,UAAA,gBAAAM,EAACC,GAAA,EAAU,cAAYf,GAAO,WAAU,2BACtC,UAAA;AAAA,QAAA,gBAAAW,EAACK,GAAA,EAAY,OAAAhB,GAAc,SAAAE,GAAkB,MAAAC,EAAA,CAAY;AAAA,QACxDF,KAAW,gBAAAU,EAAC,QAAA,EAAK,WAAU,2BAA2B,UAAAV,EAAA,CAAQ;AAAA,MAAA,EAAA,CACjE;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/lib/ui/components/PageLoadingState/PageLoadingState.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("../../../vendor/clsx/dist/clsx.cjs");;/* empty css                         */const n=require("../../primitives/LoadingState/LoadingState.cjs");function r({className:e,...t}){return a.jsx(n.LoadingState,{size:"64",className:i.clsx("page-loading-state",e),...t})}exports.PageLoadingState=r;
+//# sourceMappingURL=PageLoadingState.cjs.map

package/dist/lib/ui/components/PageLoadingState/PageLoadingState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLoadingState.cjs","sources":["../../../../../src/ui/components/PageLoadingState/PageLoadingState.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { LoadingState, type LoadingStateProps } from \"primitives\";\nimport \"./page-loading-state.css\";\n\nexport type PageLoadingStateProps = Omit<LoadingStateProps, \"size\">;\n\nexport function PageLoadingState({ className, ...props }: PageLoadingStateProps) {\n  return (\n    <LoadingState\n      size=\"64\"\n      className={clsx(\"page-loading-state\", className)}\n      {...props}\n    />\n  );\n}\n"],"names":["PageLoadingState","className","props","jsx","LoadingState","clsx"],"mappings":"+QAMO,SAASA,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAgC,CAC/E,OACEC,EAAAA,IAACC,EAAAA,aAAA,CACC,KAAK,KACL,UAAWC,EAAAA,KAAK,qBAAsBJ,CAAS,EAC9C,GAAGC,CAAA,CAAA,CAGV"}

package/dist/lib/ui/components/PageLoadingState/PageLoadingState.js

@@ -0,0 +1,18 @@
+import { jsx as a } from "react/jsx-runtime";
+import { clsx as r } from "../../../vendor/clsx/dist/clsx.js";
+/* empty css                       */
+import { LoadingState as e } from "../../primitives/LoadingState/LoadingState.js";
+function s({ className: t, ...o }) {
+  return /* @__PURE__ */ a(
+    e,
+    {
+      size: "64",
+      className: r("page-loading-state", t),
+      ...o
+    }
+  );
+}
+export {
+  s as PageLoadingState
+};
+//# sourceMappingURL=PageLoadingState.js.map

package/dist/lib/ui/components/PageLoadingState/PageLoadingState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLoadingState.js","sources":["../../../../../src/ui/components/PageLoadingState/PageLoadingState.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { LoadingState, type LoadingStateProps } from \"primitives\";\nimport \"./page-loading-state.css\";\n\nexport type PageLoadingStateProps = Omit<LoadingStateProps, \"size\">;\n\nexport function PageLoadingState({ className, ...props }: PageLoadingStateProps) {\n  return (\n    <LoadingState\n      size=\"64\"\n      className={clsx(\"page-loading-state\", className)}\n      {...props}\n    />\n  );\n}\n"],"names":["PageLoadingState","className","props","jsx","LoadingState","clsx"],"mappings":";;;;AAMO,SAASA,EAAiB,EAAE,WAAAC,GAAW,GAAGC,KAAgC;AAC/E,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAWC,EAAK,sBAAsBJ,CAAS;AAAA,MAC9C,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/lib/ui/hooks/useAnimationFrame.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),t=new Set;let n=null;function a(e){n=requestAnimationFrame(a),t.forEach(r=>r(e))}function o(e){return t.add(e),n===null&&(n=requestAnimationFrame(a)),()=>{t.delete(e),t.size===0&&n!==null&&(cancelAnimationFrame(n),n=null)}}function f(e,r=!0){const i=u.useRef(e);u.useEffect(()=>{i.current=e}),u.useEffect(()=>{if(r)return o(c=>i.current(c))},[r])}exports.useAnimationFrame=f;
+//# sourceMappingURL=useAnimationFrame.cjs.map

package/dist/lib/ui/hooks/useAnimationFrame.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimationFrame.cjs","sources":["../../../../src/ui/hooks/useAnimationFrame.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\ntype FrameSubscriber = (now: number) => void;\n\nconst frameSubscribers = new Set<FrameSubscriber>();\nlet pendingFrameId: number | null = null;\n\nfunction runFrame(now: number) {\n  pendingFrameId = requestAnimationFrame(runFrame);\n  frameSubscribers.forEach((subscriber) => subscriber(now));\n}\n\nfunction subscribeToFrames(subscriber: FrameSubscriber) {\n  frameSubscribers.add(subscriber);\n  if (pendingFrameId === null) {\n    pendingFrameId = requestAnimationFrame(runFrame);\n  }\n  return () => {\n    frameSubscribers.delete(subscriber);\n    if (frameSubscribers.size === 0 && pendingFrameId !== null) {\n      cancelAnimationFrame(pendingFrameId);\n      pendingFrameId = null;\n    }\n  };\n}\n\nexport function useAnimationFrame(onFrame: FrameSubscriber, isEnabled = true) {\n  const onFrameRef = useRef(onFrame);\n\n  useEffect(() => {\n    onFrameRef.current = onFrame;\n  });\n\n  useEffect(() => {\n    if (!isEnabled) return;\n    return subscribeToFrames((now) => onFrameRef.current(now));\n  }, [isEnabled]);\n}\n"],"names":["frameSubscribers","pendingFrameId","runFrame","now","subscriber","subscribeToFrames","useAnimationFrame","onFrame","isEnabled","onFrameRef","useRef","useEffect"],"mappings":"yGAIMA,MAAuB,IAC7B,IAAIC,EAAgC,KAEpC,SAASC,EAASC,EAAa,CAC7BF,EAAiB,sBAAsBC,CAAQ,EAC/CF,EAAiB,QAASI,GAAeA,EAAWD,CAAG,CAAC,CAC1D,CAEA,SAASE,EAAkBD,EAA6B,CACtD,OAAAJ,EAAiB,IAAII,CAAU,EAC3BH,IAAmB,OACrBA,EAAiB,sBAAsBC,CAAQ,GAE1C,IAAM,CACXF,EAAiB,OAAOI,CAAU,EAC9BJ,EAAiB,OAAS,GAAKC,IAAmB,OACpD,qBAAqBA,CAAc,EACnCA,EAAiB,KAErB,CACF,CAEO,SAASK,EAAkBC,EAA0BC,EAAY,GAAM,CAC5E,MAAMC,EAAaC,EAAAA,OAAOH,CAAO,EAEjCI,EAAAA,UAAU,IAAM,CACdF,EAAW,QAAUF,CACvB,CAAC,EAEDI,EAAAA,UAAU,IAAM,CACd,GAAKH,EACL,OAAOH,EAAmBF,GAAQM,EAAW,QAAQN,CAAG,CAAC,CAC3D,EAAG,CAACK,CAAS,CAAC,CAChB"}

package/dist/lib/ui/hooks/useAnimationFrame.js

@@ -0,0 +1,24 @@
+import { useRef as o, useEffect as i } from "react";
+const t = /* @__PURE__ */ new Set();
+let n = null;
+function a(e) {
+  n = requestAnimationFrame(a), t.forEach((r) => r(e));
+}
+function f(e) {
+  return t.add(e), n === null && (n = requestAnimationFrame(a)), () => {
+    t.delete(e), t.size === 0 && n !== null && (cancelAnimationFrame(n), n = null);
+  };
+}
+function l(e, r = !0) {
+  const u = o(e);
+  i(() => {
+    u.current = e;
+  }), i(() => {
+    if (r)
+      return f((m) => u.current(m));
+  }, [r]);
+}
+export {
+  l as useAnimationFrame
+};
+//# sourceMappingURL=useAnimationFrame.js.map

package/dist/lib/ui/hooks/useAnimationFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimationFrame.js","sources":["../../../../src/ui/hooks/useAnimationFrame.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\ntype FrameSubscriber = (now: number) => void;\n\nconst frameSubscribers = new Set<FrameSubscriber>();\nlet pendingFrameId: number | null = null;\n\nfunction runFrame(now: number) {\n  pendingFrameId = requestAnimationFrame(runFrame);\n  frameSubscribers.forEach((subscriber) => subscriber(now));\n}\n\nfunction subscribeToFrames(subscriber: FrameSubscriber) {\n  frameSubscribers.add(subscriber);\n  if (pendingFrameId === null) {\n    pendingFrameId = requestAnimationFrame(runFrame);\n  }\n  return () => {\n    frameSubscribers.delete(subscriber);\n    if (frameSubscribers.size === 0 && pendingFrameId !== null) {\n      cancelAnimationFrame(pendingFrameId);\n      pendingFrameId = null;\n    }\n  };\n}\n\nexport function useAnimationFrame(onFrame: FrameSubscriber, isEnabled = true) {\n  const onFrameRef = useRef(onFrame);\n\n  useEffect(() => {\n    onFrameRef.current = onFrame;\n  });\n\n  useEffect(() => {\n    if (!isEnabled) return;\n    return subscribeToFrames((now) => onFrameRef.current(now));\n  }, [isEnabled]);\n}\n"],"names":["frameSubscribers","pendingFrameId","runFrame","now","subscriber","subscribeToFrames","useAnimationFrame","onFrame","isEnabled","onFrameRef","useRef","useEffect"],"mappings":";AAIA,MAAMA,wBAAuB,IAAA;AAC7B,IAAIC,IAAgC;AAEpC,SAASC,EAASC,GAAa;AAC7B,EAAAF,IAAiB,sBAAsBC,CAAQ,GAC/CF,EAAiB,QAAQ,CAACI,MAAeA,EAAWD,CAAG,CAAC;AAC1D;AAEA,SAASE,EAAkBD,GAA6B;AACtD,SAAAJ,EAAiB,IAAII,CAAU,GAC3BH,MAAmB,SACrBA,IAAiB,sBAAsBC,CAAQ,IAE1C,MAAM;AACX,IAAAF,EAAiB,OAAOI,CAAU,GAC9BJ,EAAiB,SAAS,KAAKC,MAAmB,SACpD,qBAAqBA,CAAc,GACnCA,IAAiB;AAAA,EAErB;AACF;AAEO,SAASK,EAAkBC,GAA0BC,IAAY,IAAM;AAC5E,QAAMC,IAAaC,EAAOH,CAAO;AAEjC,EAAAI,EAAU,MAAM;AACd,IAAAF,EAAW,UAAUF;AAAA,EACvB,CAAC,GAEDI,EAAU,MAAM;AACd,QAAKH;AACL,aAAOH,EAAkB,CAACF,MAAQM,EAAW,QAAQN,CAAG,CAAC;AAAA,EAC3D,GAAG,CAACK,CAAS,CAAC;AAChB;"}

package/dist/lib/ui/hooks/useLoadingVisibility.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),a=200,c=400;function b(t,{delayMs:i=a,minVisibleMs:o=c}={}){const[e,n]=s.useState(t&&i<=0),r=s.useRef(e?Date.now():null);return s.useEffect(()=>{if(t){if(e){r.current=Date.now();return}const d=setTimeout(()=>{r.current=Date.now(),n(!0)},Math.max(i,0));return()=>clearTimeout(d)}if(!e)return;const l=Date.now()-(r.current??0),u=o-l;if(u<=0){n(!1);return}const f=setTimeout(()=>n(!1),u);return()=>clearTimeout(f)},[t,e,i,o]),e}exports.defaultLoadingDelayMs=a;exports.defaultLoadingMinVisibleMs=c;exports.useLoadingVisibility=b;
+//# sourceMappingURL=useLoadingVisibility.cjs.map

package/dist/lib/ui/hooks/useLoadingVisibility.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoadingVisibility.cjs","sources":["../../../../src/ui/hooks/useLoadingVisibility.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nexport type LoadingVisibilityOptions = {\n  delayMs?: number;\n  minVisibleMs?: number;\n};\n\nexport const defaultLoadingDelayMs = 200;\nexport const defaultLoadingMinVisibleMs = 400;\n\nexport function useLoadingVisibility(\n  isLoading: boolean,\n  {\n    delayMs = defaultLoadingDelayMs,\n    minVisibleMs = defaultLoadingMinVisibleMs,\n  }: LoadingVisibilityOptions = {},\n) {\n  const [isVisible, setIsVisible] = useState(isLoading && delayMs <= 0);\n  const shownAtRef = useRef<number | null>(isVisible ? Date.now() : null);\n\n  useEffect(() => {\n    if (isLoading) {\n      if (isVisible) {\n        shownAtRef.current = Date.now();\n        return;\n      }\n      const showTimer = setTimeout(() => {\n        shownAtRef.current = Date.now();\n        setIsVisible(true);\n      }, Math.max(delayMs, 0));\n      return () => clearTimeout(showTimer);\n    }\n\n    if (!isVisible) return;\n    const visibleFor = Date.now() - (shownAtRef.current ?? 0);\n    const remaining = minVisibleMs - visibleFor;\n    if (remaining <= 0) {\n      setIsVisible(false);\n      return;\n    }\n    const hideTimer = setTimeout(() => setIsVisible(false), remaining);\n    return () => clearTimeout(hideTimer);\n  }, [isLoading, isVisible, delayMs, minVisibleMs]);\n\n  return isVisible;\n}\n"],"names":["defaultLoadingDelayMs","defaultLoadingMinVisibleMs","useLoadingVisibility","isLoading","delayMs","minVisibleMs","isVisible","setIsVisible","useState","shownAtRef","useRef","useEffect","showTimer","visibleFor","remaining","hideTimer"],"mappings":"yGAOaA,EAAwB,IACxBC,EAA6B,IAEnC,SAASC,EACdC,EACA,CACE,QAAAC,EAAUJ,EACV,aAAAK,EAAeJ,CACjB,EAA8B,GAC9B,CACA,KAAM,CAACK,EAAWC,CAAY,EAAIC,EAAAA,SAASL,GAAaC,GAAW,CAAC,EAC9DK,EAAaC,EAAAA,OAAsBJ,EAAY,KAAK,IAAA,EAAQ,IAAI,EAEtEK,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAIR,EAAW,CACb,GAAIG,EAAW,CACbG,EAAW,QAAU,KAAK,IAAA,EAC1B,MACF,CACA,MAAMG,EAAY,WAAW,IAAM,CACjCH,EAAW,QAAU,KAAK,IAAA,EAC1BF,EAAa,EAAI,CACnB,EAAG,KAAK,IAAIH,EAAS,CAAC,CAAC,EACvB,MAAO,IAAM,aAAaQ,CAAS,CACrC,CAEA,GAAI,CAACN,EAAW,OAChB,MAAMO,EAAa,KAAK,IAAA,GAASJ,EAAW,SAAW,GACjDK,EAAYT,EAAeQ,EACjC,GAAIC,GAAa,EAAG,CAClBP,EAAa,EAAK,EAClB,MACF,CACA,MAAMQ,EAAY,WAAW,IAAMR,EAAa,EAAK,EAAGO,CAAS,EACjE,MAAO,IAAM,aAAaC,CAAS,CACrC,EAAG,CAACZ,EAAWG,EAAWF,EAASC,CAAY,CAAC,EAEzCC,CACT"}

package/dist/lib/ui/hooks/useLoadingVisibility.js

@@ -0,0 +1,34 @@
+import { useState as f, useRef as l, useEffect as m } from "react";
+const w = 200, T = 400;
+function b(t, {
+  delayMs: n = w,
+  minVisibleMs: o = T
+} = {}) {
+  const [e, r] = f(t && n <= 0), i = l(e ? Date.now() : null);
+  return m(() => {
+    if (t) {
+      if (e) {
+        i.current = Date.now();
+        return;
+      }
+      const a = setTimeout(() => {
+        i.current = Date.now(), r(!0);
+      }, Math.max(n, 0));
+      return () => clearTimeout(a);
+    }
+    if (!e) return;
+    const u = Date.now() - (i.current ?? 0), s = o - u;
+    if (s <= 0) {
+      r(!1);
+      return;
+    }
+    const c = setTimeout(() => r(!1), s);
+    return () => clearTimeout(c);
+  }, [t, e, n, o]), e;
+}
+export {
+  w as defaultLoadingDelayMs,
+  T as defaultLoadingMinVisibleMs,
+  b as useLoadingVisibility
+};
+//# sourceMappingURL=useLoadingVisibility.js.map

package/dist/lib/ui/hooks/useLoadingVisibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoadingVisibility.js","sources":["../../../../src/ui/hooks/useLoadingVisibility.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nexport type LoadingVisibilityOptions = {\n  delayMs?: number;\n  minVisibleMs?: number;\n};\n\nexport const defaultLoadingDelayMs = 200;\nexport const defaultLoadingMinVisibleMs = 400;\n\nexport function useLoadingVisibility(\n  isLoading: boolean,\n  {\n    delayMs = defaultLoadingDelayMs,\n    minVisibleMs = defaultLoadingMinVisibleMs,\n  }: LoadingVisibilityOptions = {},\n) {\n  const [isVisible, setIsVisible] = useState(isLoading && delayMs <= 0);\n  const shownAtRef = useRef<number | null>(isVisible ? Date.now() : null);\n\n  useEffect(() => {\n    if (isLoading) {\n      if (isVisible) {\n        shownAtRef.current = Date.now();\n        return;\n      }\n      const showTimer = setTimeout(() => {\n        shownAtRef.current = Date.now();\n        setIsVisible(true);\n      }, Math.max(delayMs, 0));\n      return () => clearTimeout(showTimer);\n    }\n\n    if (!isVisible) return;\n    const visibleFor = Date.now() - (shownAtRef.current ?? 0);\n    const remaining = minVisibleMs - visibleFor;\n    if (remaining <= 0) {\n      setIsVisible(false);\n      return;\n    }\n    const hideTimer = setTimeout(() => setIsVisible(false), remaining);\n    return () => clearTimeout(hideTimer);\n  }, [isLoading, isVisible, delayMs, minVisibleMs]);\n\n  return isVisible;\n}\n"],"names":["defaultLoadingDelayMs","defaultLoadingMinVisibleMs","useLoadingVisibility","isLoading","delayMs","minVisibleMs","isVisible","setIsVisible","useState","shownAtRef","useRef","useEffect","showTimer","visibleFor","remaining","hideTimer"],"mappings":";AAOO,MAAMA,IAAwB,KACxBC,IAA6B;AAEnC,SAASC,EACdC,GACA;AAAA,EACE,SAAAC,IAAUJ;AAAA,EACV,cAAAK,IAAeJ;AACjB,IAA8B,IAC9B;AACA,QAAM,CAACK,GAAWC,CAAY,IAAIC,EAASL,KAAaC,KAAW,CAAC,GAC9DK,IAAaC,EAAsBJ,IAAY,KAAK,IAAA,IAAQ,IAAI;AAEtE,SAAAK,EAAU,MAAM;AACd,QAAIR,GAAW;AACb,UAAIG,GAAW;AACb,QAAAG,EAAW,UAAU,KAAK,IAAA;AAC1B;AAAA,MACF;AACA,YAAMG,IAAY,WAAW,MAAM;AACjC,QAAAH,EAAW,UAAU,KAAK,IAAA,GAC1BF,EAAa,EAAI;AAAA,MACnB,GAAG,KAAK,IAAIH,GAAS,CAAC,CAAC;AACvB,aAAO,MAAM,aAAaQ,CAAS;AAAA,IACrC;AAEA,QAAI,CAACN,EAAW;AAChB,UAAMO,IAAa,KAAK,IAAA,KAASJ,EAAW,WAAW,IACjDK,IAAYT,IAAeQ;AACjC,QAAIC,KAAa,GAAG;AAClB,MAAAP,EAAa,EAAK;AAClB;AAAA,IACF;AACA,UAAMQ,IAAY,WAAW,MAAMR,EAAa,EAAK,GAAGO,CAAS;AACjE,WAAO,MAAM,aAAaC,CAAS;AAAA,EACrC,GAAG,CAACZ,GAAWG,GAAWF,GAASC,CAAY,CAAC,GAEzCC;AACT;"}

package/dist/lib/ui/hooks/useMediaQuery.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),e={tablet:600,desktop:1024};function s(n){const[o,i]=r.useMemo(()=>{const t=globalThis.matchMedia(n);function a(c){return t.addEventListener("change",c),()=>t.removeEventListener("change",c)}return[a,()=>t.matches]},[n]);return r.useSyncExternalStore(o,i)}const d=()=>{const n=s(`(max-width: ${e.tablet-1}px)`),o=s(`(min-width: ${e.tablet}px) and (max-width: ${e.desktop-1}px)`),i=s(`(min-width: ${e.desktop}px)`),t=s(`(min-width: ${e.tablet}px)`),a=s(`(max-width: ${e.desktop-1}px)`);return r.useMemo(()=>({isMobile:n,isTablet:o,isDesktop:i,isTabletUp:t,isTabletDown:a}),[n,o,i,t,a])};exports.useCustomMediaQuery=s;exports.useMediaQuery=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),e={tablet:600,desktop:1024};function s(n){const[i,o]=r.useMemo(()=>{if(typeof globalThis.matchMedia!="function")return[()=>()=>{},()=>!1];const t=globalThis.matchMedia(n);function a(c){return t.addEventListener("change",c),()=>t.removeEventListener("change",c)}return[a,()=>t.matches]},[n]);return r.useSyncExternalStore(i,o)}const d=()=>{const n=s(`(max-width: ${e.tablet-1}px)`),i=s(`(min-width: ${e.tablet}px) and (max-width: ${e.desktop-1}px)`),o=s(`(min-width: ${e.desktop}px)`),t=s(`(min-width: ${e.tablet}px)`),a=s(`(max-width: ${e.desktop-1}px)`);return r.useMemo(()=>({isMobile:n,isTablet:i,isDesktop:o,isTabletUp:t,isTabletDown:a}),[n,i,o,t,a])};exports.useCustomMediaQuery=s;exports.useMediaQuery=d;
 //# sourceMappingURL=useMediaQuery.cjs.map

package/dist/lib/ui/hooks/useMediaQuery.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMediaQuery.cjs","sources":["../../../../src/ui/hooks/useMediaQuery.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore } from \"react\";\n\nconst breakpoints = {\n  mobile: 375,\n  tablet: 600,\n  desktop: 1024,\n};\n\nexport function useCustomMediaQuery(mediaQuery: string): boolean {\n  const [subscribe, getSnapshot] = useMemo(() => {\n    const mediaQueryList = globalThis.matchMedia(mediaQuery);\n\n    function subscribe(onStoreChange: () => void) {\n      mediaQueryList.addEventListener(\"change\", onStoreChange);\n      return () => mediaQueryList.removeEventListener(\"change\", onStoreChange);\n    }\n\n    const getSnapshot = () => mediaQueryList.matches;\n\n    return [subscribe, getSnapshot];\n  }, [mediaQuery]);\n\n  return useSyncExternalStore(subscribe, getSnapshot);\n}\n\nexport const useMediaQuery = () => {\n  const isMobile = useCustomMediaQuery(\n    `(max-width: ${breakpoints.tablet - 1}px)`,\n  );\n  const isTablet = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px) and (max-width: ${breakpoints.desktop - 1}px)`,\n  );\n  const isDesktop = useCustomMediaQuery(\n    `(min-width: ${breakpoints.desktop}px)`,\n  );\n  const isTabletUp = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px)`,\n  );\n  const isTabletDown = useCustomMediaQuery(\n    `(max-width: ${breakpoints.desktop - 1}px)`,\n  );\n\n  const matches = useMemo(() => {\n    return {\n      isMobile,\n      isTablet,\n      isDesktop,\n      isTabletUp,\n      isTabletDown,\n    };\n  }, [isMobile, isTablet, isDesktop, isTabletUp, isTabletDown]);\n\n  return matches;\n};\n"],"names":["breakpoints","useCustomMediaQuery","mediaQuery","subscribe","getSnapshot","useMemo","mediaQueryList","onStoreChange","useSyncExternalStore","useMediaQuery","isMobile","isTablet","isDesktop","isTabletUp","isTabletDown"],"mappings":"yGAEMA,EAAc,CAElB,OAAQ,IACR,QAAS,IACX,EAEO,SAASC,EAAoBC,EAA6B,CAC/D,KAAM,CAACC,EAAWC,CAAW,EAAIC,EAAAA,QAAQ,IAAM,CAC7C,MAAMC,EAAiB,WAAW,WAAWJ,CAAU,EAEvD,SAASC,EAAUI,EAA2B,CAC5C,OAAAD,EAAe,iBAAiB,SAAUC,CAAa,EAChD,IAAMD,EAAe,oBAAoB,SAAUC,CAAa,CACzE,CAIA,MAAO,CAACJ,EAFY,IAAMG,EAAe,OAEX,CAChC,EAAG,CAACJ,CAAU,CAAC,EAEf,OAAOM,EAAAA,qBAAqBL,EAAWC,CAAW,CACpD,CAEO,MAAMK,EAAgB,IAAM,CACjC,MAAMC,EAAWT,EACf,eAAeD,EAAY,OAAS,CAAC,KAAA,EAEjCW,EAAWV,EACf,eAAeD,EAAY,MAAM,uBAAuBA,EAAY,QAAU,CAAC,KAAA,EAE3EY,EAAYX,EAChB,eAAeD,EAAY,OAAO,KAAA,EAE9Ba,EAAaZ,EACjB,eAAeD,EAAY,MAAM,KAAA,EAE7Bc,EAAeb,EACnB,eAAeD,EAAY,QAAU,CAAC,KAAA,EAaxC,OAVgBK,EAAAA,QAAQ,KACf,CACL,SAAAK,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EACA,aAAAC,CAAA,GAED,CAACJ,EAAUC,EAAUC,EAAWC,EAAYC,CAAY,CAAC,CAG9D"}
+{"version":3,"file":"useMediaQuery.cjs","sources":["../../../../src/ui/hooks/useMediaQuery.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore } from \"react\";\n\nconst breakpoints = {\n  mobile: 375,\n  tablet: 600,\n  desktop: 1024,\n};\n\nexport function useCustomMediaQuery(mediaQuery: string): boolean {\n  const [subscribe, getSnapshot] = useMemo(() => {\n    if (typeof globalThis.matchMedia !== \"function\") {\n      return [() => () => {}, () => false] as const;\n    }\n    const mediaQueryList = globalThis.matchMedia(mediaQuery);\n\n    function subscribe(onStoreChange: () => void) {\n      mediaQueryList.addEventListener(\"change\", onStoreChange);\n      return () => mediaQueryList.removeEventListener(\"change\", onStoreChange);\n    }\n\n    const getSnapshot = () => mediaQueryList.matches;\n\n    return [subscribe, getSnapshot];\n  }, [mediaQuery]);\n\n  return useSyncExternalStore(subscribe, getSnapshot);\n}\n\nexport const useMediaQuery = () => {\n  const isMobile = useCustomMediaQuery(\n    `(max-width: ${breakpoints.tablet - 1}px)`,\n  );\n  const isTablet = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px) and (max-width: ${breakpoints.desktop - 1}px)`,\n  );\n  const isDesktop = useCustomMediaQuery(\n    `(min-width: ${breakpoints.desktop}px)`,\n  );\n  const isTabletUp = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px)`,\n  );\n  const isTabletDown = useCustomMediaQuery(\n    `(max-width: ${breakpoints.desktop - 1}px)`,\n  );\n\n  const matches = useMemo(() => {\n    return {\n      isMobile,\n      isTablet,\n      isDesktop,\n      isTabletUp,\n      isTabletDown,\n    };\n  }, [isMobile, isTablet, isDesktop, isTabletUp, isTabletDown]);\n\n  return matches;\n};\n"],"names":["breakpoints","useCustomMediaQuery","mediaQuery","subscribe","getSnapshot","useMemo","mediaQueryList","onStoreChange","useSyncExternalStore","useMediaQuery","isMobile","isTablet","isDesktop","isTabletUp","isTabletDown"],"mappings":"yGAEMA,EAAc,CAElB,OAAQ,IACR,QAAS,IACX,EAEO,SAASC,EAAoBC,EAA6B,CAC/D,KAAM,CAACC,EAAWC,CAAW,EAAIC,EAAAA,QAAQ,IAAM,CAC7C,GAAI,OAAO,WAAW,YAAe,WACnC,MAAO,CAAC,IAAM,IAAM,CAAC,EAAG,IAAM,EAAK,EAErC,MAAMC,EAAiB,WAAW,WAAWJ,CAAU,EAEvD,SAASC,EAAUI,EAA2B,CAC5C,OAAAD,EAAe,iBAAiB,SAAUC,CAAa,EAChD,IAAMD,EAAe,oBAAoB,SAAUC,CAAa,CACzE,CAIA,MAAO,CAACJ,EAFY,IAAMG,EAAe,OAEX,CAChC,EAAG,CAACJ,CAAU,CAAC,EAEf,OAAOM,EAAAA,qBAAqBL,EAAWC,CAAW,CACpD,CAEO,MAAMK,EAAgB,IAAM,CACjC,MAAMC,EAAWT,EACf,eAAeD,EAAY,OAAS,CAAC,KAAA,EAEjCW,EAAWV,EACf,eAAeD,EAAY,MAAM,uBAAuBA,EAAY,QAAU,CAAC,KAAA,EAE3EY,EAAYX,EAChB,eAAeD,EAAY,OAAO,KAAA,EAE9Ba,EAAaZ,EACjB,eAAeD,EAAY,MAAM,KAAA,EAE7Bc,EAAeb,EACnB,eAAeD,EAAY,QAAU,CAAC,KAAA,EAaxC,OAVgBK,EAAAA,QAAQ,KACf,CACL,SAAAK,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EACA,aAAAC,CAAA,GAED,CAACJ,EAAUC,EAAUC,EAAWC,EAAYC,CAAY,CAAC,CAG9D"}

package/dist/lib/ui/hooks/useMediaQuery.js

@@ -1,17 +1,20 @@
-import { useMemo as r, useSyncExternalStore as d } from "react";
+import { useMemo as r, useSyncExternalStore as u } from "react";
 const e = {
   tablet: 600,
   desktop: 1024
 };
 function n(s) {
   const [o, i] = r(() => {
+    if (typeof globalThis.matchMedia != "function")
+      return [() => () => {
+      }, () => !1];
     const t = globalThis.matchMedia(s);
     function a(c) {
       return t.addEventListener("change", c), () => t.removeEventListener("change", c);
     }
     return [a, () => t.matches];
   }, [s]);
-  return d(o, i);
+  return u(o, i);
 }
 const h = () => {
   const s = n(

package/dist/lib/ui/hooks/useMediaQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMediaQuery.js","sources":["../../../../src/ui/hooks/useMediaQuery.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore } from \"react\";\n\nconst breakpoints = {\n  mobile: 375,\n  tablet: 600,\n  desktop: 1024,\n};\n\nexport function useCustomMediaQuery(mediaQuery: string): boolean {\n  const [subscribe, getSnapshot] = useMemo(() => {\n    const mediaQueryList = globalThis.matchMedia(mediaQuery);\n\n    function subscribe(onStoreChange: () => void) {\n      mediaQueryList.addEventListener(\"change\", onStoreChange);\n      return () => mediaQueryList.removeEventListener(\"change\", onStoreChange);\n    }\n\n    const getSnapshot = () => mediaQueryList.matches;\n\n    return [subscribe, getSnapshot];\n  }, [mediaQuery]);\n\n  return useSyncExternalStore(subscribe, getSnapshot);\n}\n\nexport const useMediaQuery = () => {\n  const isMobile = useCustomMediaQuery(\n    `(max-width: ${breakpoints.tablet - 1}px)`,\n  );\n  const isTablet = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px) and (max-width: ${breakpoints.desktop - 1}px)`,\n  );\n  const isDesktop = useCustomMediaQuery(\n    `(min-width: ${breakpoints.desktop}px)`,\n  );\n  const isTabletUp = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px)`,\n  );\n  const isTabletDown = useCustomMediaQuery(\n    `(max-width: ${breakpoints.desktop - 1}px)`,\n  );\n\n  const matches = useMemo(() => {\n    return {\n      isMobile,\n      isTablet,\n      isDesktop,\n      isTabletUp,\n      isTabletDown,\n    };\n  }, [isMobile, isTablet, isDesktop, isTabletUp, isTabletDown]);\n\n  return matches;\n};\n"],"names":["breakpoints","useCustomMediaQuery","mediaQuery","subscribe","getSnapshot","useMemo","mediaQueryList","onStoreChange","useSyncExternalStore","useMediaQuery","isMobile","isTablet","isDesktop","isTabletUp","isTabletDown"],"mappings":";AAEA,MAAMA,IAAc;AAAA,EAElB,QAAQ;AAAA,EACR,SAAS;AACX;AAEO,SAASC,EAAoBC,GAA6B;AAC/D,QAAM,CAACC,GAAWC,CAAW,IAAIC,EAAQ,MAAM;AAC7C,UAAMC,IAAiB,WAAW,WAAWJ,CAAU;AAEvD,aAASC,EAAUI,GAA2B;AAC5C,aAAAD,EAAe,iBAAiB,UAAUC,CAAa,GAChD,MAAMD,EAAe,oBAAoB,UAAUC,CAAa;AAAA,IACzE;AAIA,WAAO,CAACJ,GAFY,MAAMG,EAAe,OAEX;AAAA,EAChC,GAAG,CAACJ,CAAU,CAAC;AAEf,SAAOM,EAAqBL,GAAWC,CAAW;AACpD;AAEO,MAAMK,IAAgB,MAAM;AACjC,QAAMC,IAAWT;AAAA,IACf,eAAeD,EAAY,SAAS,CAAC;AAAA,EAAA,GAEjCW,IAAWV;AAAA,IACf,eAAeD,EAAY,MAAM,uBAAuBA,EAAY,UAAU,CAAC;AAAA,EAAA,GAE3EY,IAAYX;AAAA,IAChB,eAAeD,EAAY,OAAO;AAAA,EAAA,GAE9Ba,IAAaZ;AAAA,IACjB,eAAeD,EAAY,MAAM;AAAA,EAAA,GAE7Bc,IAAeb;AAAA,IACnB,eAAeD,EAAY,UAAU,CAAC;AAAA,EAAA;AAaxC,SAVgBK,EAAQ,OACf;AAAA,IACL,UAAAK;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,IAED,CAACJ,GAAUC,GAAUC,GAAWC,GAAYC,CAAY,CAAC;AAG9D;"}
+{"version":3,"file":"useMediaQuery.js","sources":["../../../../src/ui/hooks/useMediaQuery.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore } from \"react\";\n\nconst breakpoints = {\n  mobile: 375,\n  tablet: 600,\n  desktop: 1024,\n};\n\nexport function useCustomMediaQuery(mediaQuery: string): boolean {\n  const [subscribe, getSnapshot] = useMemo(() => {\n    if (typeof globalThis.matchMedia !== \"function\") {\n      return [() => () => {}, () => false] as const;\n    }\n    const mediaQueryList = globalThis.matchMedia(mediaQuery);\n\n    function subscribe(onStoreChange: () => void) {\n      mediaQueryList.addEventListener(\"change\", onStoreChange);\n      return () => mediaQueryList.removeEventListener(\"change\", onStoreChange);\n    }\n\n    const getSnapshot = () => mediaQueryList.matches;\n\n    return [subscribe, getSnapshot];\n  }, [mediaQuery]);\n\n  return useSyncExternalStore(subscribe, getSnapshot);\n}\n\nexport const useMediaQuery = () => {\n  const isMobile = useCustomMediaQuery(\n    `(max-width: ${breakpoints.tablet - 1}px)`,\n  );\n  const isTablet = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px) and (max-width: ${breakpoints.desktop - 1}px)`,\n  );\n  const isDesktop = useCustomMediaQuery(\n    `(min-width: ${breakpoints.desktop}px)`,\n  );\n  const isTabletUp = useCustomMediaQuery(\n    `(min-width: ${breakpoints.tablet}px)`,\n  );\n  const isTabletDown = useCustomMediaQuery(\n    `(max-width: ${breakpoints.desktop - 1}px)`,\n  );\n\n  const matches = useMemo(() => {\n    return {\n      isMobile,\n      isTablet,\n      isDesktop,\n      isTabletUp,\n      isTabletDown,\n    };\n  }, [isMobile, isTablet, isDesktop, isTabletUp, isTabletDown]);\n\n  return matches;\n};\n"],"names":["breakpoints","useCustomMediaQuery","mediaQuery","subscribe","getSnapshot","useMemo","mediaQueryList","onStoreChange","useSyncExternalStore","useMediaQuery","isMobile","isTablet","isDesktop","isTabletUp","isTabletDown"],"mappings":";AAEA,MAAMA,IAAc;AAAA,EAElB,QAAQ;AAAA,EACR,SAAS;AACX;AAEO,SAASC,EAAoBC,GAA6B;AAC/D,QAAM,CAACC,GAAWC,CAAW,IAAIC,EAAQ,MAAM;AAC7C,QAAI,OAAO,WAAW,cAAe;AACnC,aAAO,CAAC,MAAM,MAAM;AAAA,MAAC,GAAG,MAAM,EAAK;AAErC,UAAMC,IAAiB,WAAW,WAAWJ,CAAU;AAEvD,aAASC,EAAUI,GAA2B;AAC5C,aAAAD,EAAe,iBAAiB,UAAUC,CAAa,GAChD,MAAMD,EAAe,oBAAoB,UAAUC,CAAa;AAAA,IACzE;AAIA,WAAO,CAACJ,GAFY,MAAMG,EAAe,OAEX;AAAA,EAChC,GAAG,CAACJ,CAAU,CAAC;AAEf,SAAOM,EAAqBL,GAAWC,CAAW;AACpD;AAEO,MAAMK,IAAgB,MAAM;AACjC,QAAMC,IAAWT;AAAA,IACf,eAAeD,EAAY,SAAS,CAAC;AAAA,EAAA,GAEjCW,IAAWV;AAAA,IACf,eAAeD,EAAY,MAAM,uBAAuBA,EAAY,UAAU,CAAC;AAAA,EAAA,GAE3EY,IAAYX;AAAA,IAChB,eAAeD,EAAY,OAAO;AAAA,EAAA,GAE9Ba,IAAaZ;AAAA,IACjB,eAAeD,EAAY,MAAM;AAAA,EAAA,GAE7Bc,IAAeb;AAAA,IACnB,eAAeD,EAAY,UAAU,CAAC;AAAA,EAAA;AAaxC,SAVgBK,EAAQ,OACf;AAAA,IACL,UAAAK;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,IAED,CAACJ,GAAUC,GAAUC,GAAWC,GAAYC,CAAY,CAAC;AAG9D;"}

package/dist/lib/ui/primitives/BrandLoader/BrandLoader.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("../../../vendor/clsx/dist/clsx.cjs"),r=require("react"),N=require("../../hooks/useAnimationFrame.cjs"),n=require("./brandLoaderVariants.cjs"),q=require("./brandLoaderSymbolContext.cjs");;/* empty css                   */const A=require("../../hooks/useMediaQuery.cjs");function B(){return typeof window<"u"&&typeof window.requestAnimationFrame=="function"&&typeof SVGPathElement<"u"&&typeof SVGPathElement.prototype.getPointAtLength=="function"}function S(s,o){return typeof s.getTotalLength=="function"?s.getTotalLength():o}function $({label:s,"aria-hidden":o,variant:t="trace",size:a="32",tone:i="accent",speed:b=1,isPaused:f=!1,symbol:p,className:h,...m}){const g=q.useBrandLoaderSymbol(),c=p??g,x=A.useCustomMediaQuery("(prefers-reduced-motion: reduce)"),d=!f&&!x;return e.jsx("span",{role:o?void 0:"status","aria-label":s,"aria-hidden":o||void 0,className:w.clsx("brand-loader",`brand-loader-size-${a}`,`brand-loader-tone-${i}`,`brand-loader-${c}`,`brand-loader-variant-${t}`,!d&&"brand-loader-paused",h),...m,children:c==="neutral"?e.jsx(C,{}):e.jsx(E,{variant:t,speed:b,isAnimating:d&&B()},t)})}function C(){return e.jsxs("svg",{className:"brand-loader-neutral-glyph",viewBox:"0 0 24 24","aria-hidden":"true",focusable:"false",children:[e.jsx("circle",{className:"brand-loader-neutral-track",cx:"12",cy:"12",r:"9"}),e.jsx("circle",{className:"brand-loader-neutral-arc",cx:"12",cy:"12",r:"9",pathLength:100})]})}function E({variant:s,speed:o,isAnimating:t}){const a=n.brandLoaderVariants[s],i=`brand-loader-sweep-${r.useId().replace(/:/g,"")}`,b=r.useRef(null),f=r.useRef(null),p=r.useRef(null),h=r.useRef(null),m=r.useRef(null),g=r.useRef(null),c=r.useRef(null),x=r.useRef(null),d=r.useRef(0),y=r.useRef(null),P=()=>d.current%a.period/a.period;return r.useLayoutEffect(()=>{const u=b.current,l=f.current,L=p.current,R=h.current;if(!u||!l||!L||!R)return;const j={strokes:u,slash:l,big:L,tri:R,ball:m.current,sweepClip:g.current,sweepEdge:c.current,lengths:{slash:S(l,n.brandLoaderPathLengths.slash),big:S(L,n.brandLoaderPathLengths.big),tri:S(R,n.brandLoaderPathLengths.tri)}};x.current=j,y.current=null,t?a.render(d.current%a.period/a.period,j):a.renderRest(j)},[a,t]),N.useAnimationFrame(u=>{const l=x.current;l&&(y.current!==null&&(d.current+=(u-y.current)*o),y.current=u,a.render(P(),l))},t),e.jsxs("svg",{className:"brand-loader-symbol",viewBox:n.brandLoaderViewBox,"aria-hidden":"true",focusable:"false",children:[s==="sweep"&&e.jsx("defs",{children:e.jsx("clipPath",{id:i,children:e.jsx("polygon",{ref:g})})}),e.jsxs("g",{ref:b,className:"brand-loader-strokes",clipPath:s==="sweep"?`url(#${i})`:void 0,children:[s==="comet"&&e.jsxs("g",{className:"brand-loader-ghost",children:[e.jsx("path",{d:n.brandLoaderSymbolPaths.slash}),e.jsx("path",{d:n.brandLoaderSymbolPaths.big}),e.jsx("path",{d:n.brandLoaderSymbolPaths.tri})]}),e.jsx("path",{ref:f,className:"brand-loader-piece brand-loader-slash",d:n.brandLoaderSymbolPaths.slash}),e.jsx("path",{ref:p,className:"brand-loader-piece brand-loader-big",d:n.brandLoaderSymbolPaths.big}),e.jsx("path",{ref:h,className:"brand-loader-piece brand-loader-tri",d:n.brandLoaderSymbolPaths.tri})]}),s==="bounce"&&e.jsx("ellipse",{ref:m,className:"brand-loader-ball"}),s==="sweep"&&e.jsx("line",{ref:c,className:"brand-loader-sweep-edge"})]})}exports.BrandLoader=$;
+//# sourceMappingURL=BrandLoader.cjs.map

package/dist/lib/ui/primitives/BrandLoader/BrandLoader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandLoader.cjs","sources":["../../../../../src/ui/primitives/BrandLoader/BrandLoader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useCustomMediaQuery } from \"hooks\";\nimport {\n  type ComponentPropsWithoutRef,\n  useId,\n  useLayoutEffect,\n  useRef,\n} from \"react\";\nimport { useAnimationFrame } from \"../../hooks/useAnimationFrame\";\nimport {\n  brandLoaderPathLengths,\n  brandLoaderSymbolPaths,\n  brandLoaderVariants,\n  brandLoaderViewBox,\n  type BrandLoaderElements,\n  type BrandLoaderVariant,\n} from \"./brandLoaderVariants\";\nimport { type BrandLoaderSymbol, useBrandLoaderSymbol } from \"./brandLoaderSymbolContext\";\nimport \"./brand-loader.css\";\n\nexport type { BrandLoaderVariant } from \"./brandLoaderVariants\";\nexport { BrandLoaderProvider, type BrandLoaderProviderProps } from \"./BrandLoaderProvider\";\nexport type { BrandLoaderSymbol } from \"./brandLoaderSymbolContext\";\n\nexport type BrandLoaderSize = \"16\" | \"24\" | \"32\" | \"64\";\n\nexport type BrandLoaderTone = \"accent\" | \"brand\" | \"current\";\n\ntype BrandLoaderAccessibilityProps =\n  | { label: string; \"aria-hidden\"?: false }\n  | { label?: undefined; \"aria-hidden\": true };\n\nexport type BrandLoaderProps = Omit<\n  ComponentPropsWithoutRef<\"span\">,\n  \"children\" | \"aria-hidden\"\n> &\n  BrandLoaderAccessibilityProps & {\n    variant?: BrandLoaderVariant;\n    size?: BrandLoaderSize;\n    tone?: BrandLoaderTone;\n    speed?: number;\n    isPaused?: boolean;\n    symbol?: BrandLoaderSymbol;\n  };\n\nfunction supportsScriptedSvgAnimation() {\n  return (\n    typeof window !== \"undefined\" &&\n    typeof window.requestAnimationFrame === \"function\" &&\n    typeof SVGPathElement !== \"undefined\" &&\n    typeof SVGPathElement.prototype.getPointAtLength === \"function\"\n  );\n}\n\nfunction measurePath(path: SVGPathElement, fallbackLength: number) {\n  return typeof path.getTotalLength === \"function\"\n    ? path.getTotalLength()\n    : fallbackLength;\n}\n\nexport function BrandLoader({\n  label,\n  \"aria-hidden\": isDecorative,\n  variant = \"trace\",\n  size = \"32\",\n  tone = \"accent\",\n  speed = 1,\n  isPaused = false,\n  symbol,\n  className,\n  ...props\n}: BrandLoaderProps) {\n  const providedSymbol = useBrandLoaderSymbol();\n  const resolvedSymbol = symbol ?? providedSymbol;\n  const prefersReducedMotion = useCustomMediaQuery(\n    \"(prefers-reduced-motion: reduce)\",\n  );\n  const isAnimating = !isPaused && !prefersReducedMotion;\n\n  return (\n    <span\n      role={isDecorative ? undefined : \"status\"}\n      aria-label={label}\n      aria-hidden={isDecorative || undefined}\n      className={clsx(\n        \"brand-loader\",\n        `brand-loader-size-${size}`,\n        `brand-loader-tone-${tone}`,\n        `brand-loader-${resolvedSymbol}`,\n        `brand-loader-variant-${variant}`,\n        !isAnimating && \"brand-loader-paused\",\n        className,\n      )}\n      {...props}\n    >\n      {resolvedSymbol === \"neutral\" ? (\n        <NeutralSymbol />\n      ) : (\n        <ApipassSymbol\n          key={variant}\n          variant={variant}\n          speed={speed}\n          isAnimating={isAnimating && supportsScriptedSvgAnimation()}\n        />\n      )}\n    </span>\n  );\n}\n\nfunction NeutralSymbol() {\n  return (\n    <svg\n      className=\"brand-loader-neutral-glyph\"\n      viewBox=\"0 0 24 24\"\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      <circle className=\"brand-loader-neutral-track\" cx=\"12\" cy=\"12\" r=\"9\" />\n      <circle\n        className=\"brand-loader-neutral-arc\"\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9\"\n        pathLength={100}\n      />\n    </svg>\n  );\n}\n\ntype ApipassSymbolProps = {\n  variant: BrandLoaderVariant;\n  speed: number;\n  isAnimating: boolean;\n};\n\nfunction ApipassSymbol({ variant, speed, isAnimating }: ApipassSymbolProps) {\n  const definition = brandLoaderVariants[variant];\n  const sweepClipId = `brand-loader-sweep-${useId().replace(/:/g, \"\")}`;\n\n  const strokesRef = useRef<SVGGElement>(null);\n  const slashRef = useRef<SVGPathElement>(null);\n  const bigRef = useRef<SVGPathElement>(null);\n  const triRef = useRef<SVGPathElement>(null);\n  const ballRef = useRef<SVGEllipseElement>(null);\n  const sweepClipRef = useRef<SVGPolygonElement>(null);\n  const sweepEdgeRef = useRef<SVGLineElement>(null);\n\n  const elementsRef = useRef<BrandLoaderElements | null>(null);\n  const elapsedRef = useRef(0);\n  const lastFrameRef = useRef<number | null>(null);\n\n  const currentProgress = () =>\n    (elapsedRef.current % definition.period) / definition.period;\n\n  useLayoutEffect(() => {\n    const strokes = strokesRef.current;\n    const slash = slashRef.current;\n    const big = bigRef.current;\n    const tri = triRef.current;\n    if (!strokes || !slash || !big || !tri) return;\n\n    const elements: BrandLoaderElements = {\n      strokes,\n      slash,\n      big,\n      tri,\n      ball: ballRef.current,\n      sweepClip: sweepClipRef.current,\n      sweepEdge: sweepEdgeRef.current,\n      lengths: {\n        slash: measurePath(slash, brandLoaderPathLengths.slash),\n        big: measurePath(big, brandLoaderPathLengths.big),\n        tri: measurePath(tri, brandLoaderPathLengths.tri),\n      },\n    };\n    elementsRef.current = elements;\n    lastFrameRef.current = null;\n\n    if (isAnimating) {\n      definition.render(\n        (elapsedRef.current % definition.period) / definition.period,\n        elements,\n      );\n    } else {\n      definition.renderRest(elements);\n    }\n  }, [definition, isAnimating]);\n\n  useAnimationFrame((now) => {\n    const elements = elementsRef.current;\n    if (!elements) return;\n    if (lastFrameRef.current !== null) {\n      elapsedRef.current += (now - lastFrameRef.current) * speed;\n    }\n    lastFrameRef.current = now;\n    definition.render(currentProgress(), elements);\n  }, isAnimating);\n\n  return (\n    <svg\n      className=\"brand-loader-symbol\"\n      viewBox={brandLoaderViewBox}\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      {variant === \"sweep\" && (\n        <defs>\n          <clipPath id={sweepClipId}>\n            <polygon ref={sweepClipRef} />\n          </clipPath>\n        </defs>\n      )}\n      <g\n        ref={strokesRef}\n        className=\"brand-loader-strokes\"\n        clipPath={variant === \"sweep\" ? `url(#${sweepClipId})` : undefined}\n      >\n        {variant === \"comet\" && (\n          <g className=\"brand-loader-ghost\">\n            <path d={brandLoaderSymbolPaths.slash} />\n            <path d={brandLoaderSymbolPaths.big} />\n            <path d={brandLoaderSymbolPaths.tri} />\n          </g>\n        )}\n        <path\n          ref={slashRef}\n          className=\"brand-loader-piece brand-loader-slash\"\n          d={brandLoaderSymbolPaths.slash}\n        />\n        <path\n          ref={bigRef}\n          className=\"brand-loader-piece brand-loader-big\"\n          d={brandLoaderSymbolPaths.big}\n        />\n        <path\n          ref={triRef}\n          className=\"brand-loader-piece brand-loader-tri\"\n          d={brandLoaderSymbolPaths.tri}\n        />\n      </g>\n      {variant === \"bounce\" && (\n        <ellipse ref={ballRef} className=\"brand-loader-ball\" />\n      )}\n      {variant === \"sweep\" && (\n        <line ref={sweepEdgeRef} className=\"brand-loader-sweep-edge\" />\n      )}\n    </svg>\n  );\n}\n"],"names":["supportsScriptedSvgAnimation","measurePath","path","fallbackLength","BrandLoader","label","isDecorative","variant","size","tone","speed","isPaused","symbol","className","props","providedSymbol","useBrandLoaderSymbol","resolvedSymbol","prefersReducedMotion","useCustomMediaQuery","isAnimating","jsx","clsx","NeutralSymbol","ApipassSymbol","jsxs","definition","brandLoaderVariants","sweepClipId","useId","strokesRef","useRef","slashRef","bigRef","triRef","ballRef","sweepClipRef","sweepEdgeRef","elementsRef","elapsedRef","lastFrameRef","currentProgress","useLayoutEffect","strokes","slash","big","tri","elements","brandLoaderPathLengths","useAnimationFrame","now","brandLoaderViewBox","brandLoaderSymbolPaths"],"mappings":"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"}

package/dist/lib/ui/primitives/BrandLoader/BrandLoader.js

@@ -0,0 +1,165 @@
+import { jsx as e, jsxs as N } from "react/jsx-runtime";
+import { clsx as A } from "../../../vendor/clsx/dist/clsx.js";
+import { useId as B, useRef as t, useLayoutEffect as E } from "react";
+import { useAnimationFrame as k } from "../../hooks/useAnimationFrame.js";
+import { brandLoaderVariants as C, brandLoaderViewBox as V, brandLoaderSymbolPaths as d, brandLoaderPathLengths as x } from "./brandLoaderVariants.js";
+import { useBrandLoaderSymbol as v } from "./brandLoaderSymbolContext.js";
+/* empty css                 */
+import { useCustomMediaQuery as F } from "../../hooks/useMediaQuery.js";
+function j() {
+  return typeof window < "u" && typeof window.requestAnimationFrame == "function" && typeof SVGPathElement < "u" && typeof SVGPathElement.prototype.getPointAtLength == "function";
+}
+function P(r, o) {
+  return typeof r.getTotalLength == "function" ? r.getTotalLength() : o;
+}
+function O({
+  label: r,
+  "aria-hidden": o,
+  variant: a = "trace",
+  size: n = "32",
+  tone: u = "accent",
+  speed: p = 1,
+  isPaused: f = !1,
+  symbol: m,
+  className: b,
+  ...h
+}) {
+  const g = v(), c = m ?? g, y = F(
+    "(prefers-reduced-motion: reduce)"
+  ), s = !f && !y;
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      role: o ? void 0 : "status",
+      "aria-label": r,
+      "aria-hidden": o || void 0,
+      className: A(
+        "brand-loader",
+        `brand-loader-size-${n}`,
+        `brand-loader-tone-${u}`,
+        `brand-loader-${c}`,
+        `brand-loader-variant-${a}`,
+        !s && "brand-loader-paused",
+        b
+      ),
+      ...h,
+      children: c === "neutral" ? /* @__PURE__ */ e(G, {}) : /* @__PURE__ */ e(
+        I,
+        {
+          variant: a,
+          speed: p,
+          isAnimating: s && j()
+        },
+        a
+      )
+    }
+  );
+}
+function G() {
+  return /* @__PURE__ */ N(
+    "svg",
+    {
+      className: "brand-loader-neutral-glyph",
+      viewBox: "0 0 24 24",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ e("circle", { className: "brand-loader-neutral-track", cx: "12", cy: "12", r: "9" }),
+        /* @__PURE__ */ e(
+          "circle",
+          {
+            className: "brand-loader-neutral-arc",
+            cx: "12",
+            cy: "12",
+            r: "9",
+            pathLength: 100
+          }
+        )
+      ]
+    }
+  );
+}
+function I({ variant: r, speed: o, isAnimating: a }) {
+  const n = C[r], u = `brand-loader-sweep-${B().replace(/:/g, "")}`, p = t(null), f = t(null), m = t(null), b = t(null), h = t(null), g = t(null), c = t(null), y = t(null), s = t(0), w = t(null), $ = () => s.current % n.period / n.period;
+  return E(() => {
+    const i = p.current, l = f.current, R = m.current, L = b.current;
+    if (!i || !l || !R || !L) return;
+    const S = {
+      strokes: i,
+      slash: l,
+      big: R,
+      tri: L,
+      ball: h.current,
+      sweepClip: g.current,
+      sweepEdge: c.current,
+      lengths: {
+        slash: P(l, x.slash),
+        big: P(R, x.big),
+        tri: P(L, x.tri)
+      }
+    };
+    y.current = S, w.current = null, a ? n.render(
+      s.current % n.period / n.period,
+      S
+    ) : n.renderRest(S);
+  }, [n, a]), k((i) => {
+    const l = y.current;
+    l && (w.current !== null && (s.current += (i - w.current) * o), w.current = i, n.render($(), l));
+  }, a), /* @__PURE__ */ N(
+    "svg",
+    {
+      className: "brand-loader-symbol",
+      viewBox: V,
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        r === "sweep" && /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("clipPath", { id: u, children: /* @__PURE__ */ e("polygon", { ref: g }) }) }),
+        /* @__PURE__ */ N(
+          "g",
+          {
+            ref: p,
+            className: "brand-loader-strokes",
+            clipPath: r === "sweep" ? `url(#${u})` : void 0,
+            children: [
+              r === "comet" && /* @__PURE__ */ N("g", { className: "brand-loader-ghost", children: [
+                /* @__PURE__ */ e("path", { d: d.slash }),
+                /* @__PURE__ */ e("path", { d: d.big }),
+                /* @__PURE__ */ e("path", { d: d.tri })
+              ] }),
+              /* @__PURE__ */ e(
+                "path",
+                {
+                  ref: f,
+                  className: "brand-loader-piece brand-loader-slash",
+                  d: d.slash
+                }
+              ),
+              /* @__PURE__ */ e(
+                "path",
+                {
+                  ref: m,
+                  className: "brand-loader-piece brand-loader-big",
+                  d: d.big
+                }
+              ),
+              /* @__PURE__ */ e(
+                "path",
+                {
+                  ref: b,
+                  className: "brand-loader-piece brand-loader-tri",
+                  d: d.tri
+                }
+              )
+            ]
+          }
+        ),
+        r === "bounce" && /* @__PURE__ */ e("ellipse", { ref: h, className: "brand-loader-ball" }),
+        r === "sweep" && /* @__PURE__ */ e("line", { ref: c, className: "brand-loader-sweep-edge" })
+      ]
+    }
+  );
+}
+export {
+  O as BrandLoader
+};
+//# sourceMappingURL=BrandLoader.js.map

package/dist/lib/ui/primitives/BrandLoader/BrandLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandLoader.js","sources":["../../../../../src/ui/primitives/BrandLoader/BrandLoader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useCustomMediaQuery } from \"hooks\";\nimport {\n  type ComponentPropsWithoutRef,\n  useId,\n  useLayoutEffect,\n  useRef,\n} from \"react\";\nimport { useAnimationFrame } from \"../../hooks/useAnimationFrame\";\nimport {\n  brandLoaderPathLengths,\n  brandLoaderSymbolPaths,\n  brandLoaderVariants,\n  brandLoaderViewBox,\n  type BrandLoaderElements,\n  type BrandLoaderVariant,\n} from \"./brandLoaderVariants\";\nimport { type BrandLoaderSymbol, useBrandLoaderSymbol } from \"./brandLoaderSymbolContext\";\nimport \"./brand-loader.css\";\n\nexport type { BrandLoaderVariant } from \"./brandLoaderVariants\";\nexport { BrandLoaderProvider, type BrandLoaderProviderProps } from \"./BrandLoaderProvider\";\nexport type { BrandLoaderSymbol } from \"./brandLoaderSymbolContext\";\n\nexport type BrandLoaderSize = \"16\" | \"24\" | \"32\" | \"64\";\n\nexport type BrandLoaderTone = \"accent\" | \"brand\" | \"current\";\n\ntype BrandLoaderAccessibilityProps =\n  | { label: string; \"aria-hidden\"?: false }\n  | { label?: undefined; \"aria-hidden\": true };\n\nexport type BrandLoaderProps = Omit<\n  ComponentPropsWithoutRef<\"span\">,\n  \"children\" | \"aria-hidden\"\n> &\n  BrandLoaderAccessibilityProps & {\n    variant?: BrandLoaderVariant;\n    size?: BrandLoaderSize;\n    tone?: BrandLoaderTone;\n    speed?: number;\n    isPaused?: boolean;\n    symbol?: BrandLoaderSymbol;\n  };\n\nfunction supportsScriptedSvgAnimation() {\n  return (\n    typeof window !== \"undefined\" &&\n    typeof window.requestAnimationFrame === \"function\" &&\n    typeof SVGPathElement !== \"undefined\" &&\n    typeof SVGPathElement.prototype.getPointAtLength === \"function\"\n  );\n}\n\nfunction measurePath(path: SVGPathElement, fallbackLength: number) {\n  return typeof path.getTotalLength === \"function\"\n    ? path.getTotalLength()\n    : fallbackLength;\n}\n\nexport function BrandLoader({\n  label,\n  \"aria-hidden\": isDecorative,\n  variant = \"trace\",\n  size = \"32\",\n  tone = \"accent\",\n  speed = 1,\n  isPaused = false,\n  symbol,\n  className,\n  ...props\n}: BrandLoaderProps) {\n  const providedSymbol = useBrandLoaderSymbol();\n  const resolvedSymbol = symbol ?? providedSymbol;\n  const prefersReducedMotion = useCustomMediaQuery(\n    \"(prefers-reduced-motion: reduce)\",\n  );\n  const isAnimating = !isPaused && !prefersReducedMotion;\n\n  return (\n    <span\n      role={isDecorative ? undefined : \"status\"}\n      aria-label={label}\n      aria-hidden={isDecorative || undefined}\n      className={clsx(\n        \"brand-loader\",\n        `brand-loader-size-${size}`,\n        `brand-loader-tone-${tone}`,\n        `brand-loader-${resolvedSymbol}`,\n        `brand-loader-variant-${variant}`,\n        !isAnimating && \"brand-loader-paused\",\n        className,\n      )}\n      {...props}\n    >\n      {resolvedSymbol === \"neutral\" ? (\n        <NeutralSymbol />\n      ) : (\n        <ApipassSymbol\n          key={variant}\n          variant={variant}\n          speed={speed}\n          isAnimating={isAnimating && supportsScriptedSvgAnimation()}\n        />\n      )}\n    </span>\n  );\n}\n\nfunction NeutralSymbol() {\n  return (\n    <svg\n      className=\"brand-loader-neutral-glyph\"\n      viewBox=\"0 0 24 24\"\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      <circle className=\"brand-loader-neutral-track\" cx=\"12\" cy=\"12\" r=\"9\" />\n      <circle\n        className=\"brand-loader-neutral-arc\"\n        cx=\"12\"\n        cy=\"12\"\n        r=\"9\"\n        pathLength={100}\n      />\n    </svg>\n  );\n}\n\ntype ApipassSymbolProps = {\n  variant: BrandLoaderVariant;\n  speed: number;\n  isAnimating: boolean;\n};\n\nfunction ApipassSymbol({ variant, speed, isAnimating }: ApipassSymbolProps) {\n  const definition = brandLoaderVariants[variant];\n  const sweepClipId = `brand-loader-sweep-${useId().replace(/:/g, \"\")}`;\n\n  const strokesRef = useRef<SVGGElement>(null);\n  const slashRef = useRef<SVGPathElement>(null);\n  const bigRef = useRef<SVGPathElement>(null);\n  const triRef = useRef<SVGPathElement>(null);\n  const ballRef = useRef<SVGEllipseElement>(null);\n  const sweepClipRef = useRef<SVGPolygonElement>(null);\n  const sweepEdgeRef = useRef<SVGLineElement>(null);\n\n  const elementsRef = useRef<BrandLoaderElements | null>(null);\n  const elapsedRef = useRef(0);\n  const lastFrameRef = useRef<number | null>(null);\n\n  const currentProgress = () =>\n    (elapsedRef.current % definition.period) / definition.period;\n\n  useLayoutEffect(() => {\n    const strokes = strokesRef.current;\n    const slash = slashRef.current;\n    const big = bigRef.current;\n    const tri = triRef.current;\n    if (!strokes || !slash || !big || !tri) return;\n\n    const elements: BrandLoaderElements = {\n      strokes,\n      slash,\n      big,\n      tri,\n      ball: ballRef.current,\n      sweepClip: sweepClipRef.current,\n      sweepEdge: sweepEdgeRef.current,\n      lengths: {\n        slash: measurePath(slash, brandLoaderPathLengths.slash),\n        big: measurePath(big, brandLoaderPathLengths.big),\n        tri: measurePath(tri, brandLoaderPathLengths.tri),\n      },\n    };\n    elementsRef.current = elements;\n    lastFrameRef.current = null;\n\n    if (isAnimating) {\n      definition.render(\n        (elapsedRef.current % definition.period) / definition.period,\n        elements,\n      );\n    } else {\n      definition.renderRest(elements);\n    }\n  }, [definition, isAnimating]);\n\n  useAnimationFrame((now) => {\n    const elements = elementsRef.current;\n    if (!elements) return;\n    if (lastFrameRef.current !== null) {\n      elapsedRef.current += (now - lastFrameRef.current) * speed;\n    }\n    lastFrameRef.current = now;\n    definition.render(currentProgress(), elements);\n  }, isAnimating);\n\n  return (\n    <svg\n      className=\"brand-loader-symbol\"\n      viewBox={brandLoaderViewBox}\n      aria-hidden=\"true\"\n      focusable=\"false\"\n    >\n      {variant === \"sweep\" && (\n        <defs>\n          <clipPath id={sweepClipId}>\n            <polygon ref={sweepClipRef} />\n          </clipPath>\n        </defs>\n      )}\n      <g\n        ref={strokesRef}\n        className=\"brand-loader-strokes\"\n        clipPath={variant === \"sweep\" ? `url(#${sweepClipId})` : undefined}\n      >\n        {variant === \"comet\" && (\n          <g className=\"brand-loader-ghost\">\n            <path d={brandLoaderSymbolPaths.slash} />\n            <path d={brandLoaderSymbolPaths.big} />\n            <path d={brandLoaderSymbolPaths.tri} />\n          </g>\n        )}\n        <path\n          ref={slashRef}\n          className=\"brand-loader-piece brand-loader-slash\"\n          d={brandLoaderSymbolPaths.slash}\n        />\n        <path\n          ref={bigRef}\n          className=\"brand-loader-piece brand-loader-big\"\n          d={brandLoaderSymbolPaths.big}\n        />\n        <path\n          ref={triRef}\n          className=\"brand-loader-piece brand-loader-tri\"\n          d={brandLoaderSymbolPaths.tri}\n        />\n      </g>\n      {variant === \"bounce\" && (\n        <ellipse ref={ballRef} className=\"brand-loader-ball\" />\n      )}\n      {variant === \"sweep\" && (\n        <line ref={sweepEdgeRef} className=\"brand-loader-sweep-edge\" />\n      )}\n    </svg>\n  );\n}\n"],"names":["supportsScriptedSvgAnimation","measurePath","path","fallbackLength","BrandLoader","label","isDecorative","variant","size","tone","speed","isPaused","symbol","className","props","providedSymbol","useBrandLoaderSymbol","resolvedSymbol","prefersReducedMotion","useCustomMediaQuery","isAnimating","jsx","clsx","NeutralSymbol","ApipassSymbol","jsxs","definition","brandLoaderVariants","sweepClipId","useId","strokesRef","useRef","slashRef","bigRef","triRef","ballRef","sweepClipRef","sweepEdgeRef","elementsRef","elapsedRef","lastFrameRef","currentProgress","useLayoutEffect","strokes","slash","big","tri","elements","brandLoaderPathLengths","useAnimationFrame","now","brandLoaderViewBox","brandLoaderSymbolPaths"],"mappings":"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"}

package/dist/lib/ui/primitives/BrandLoader/BrandLoaderProvider.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),t=require("./brandLoaderSymbolContext.cjs");function n({symbol:r,children:e}){return o.jsx(t.BrandLoaderSymbolContext.Provider,{value:r,children:e})}exports.BrandLoaderProvider=n;
+//# sourceMappingURL=BrandLoaderProvider.cjs.map

package/dist/lib/ui/primitives/BrandLoader/BrandLoaderProvider.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandLoaderProvider.cjs","sources":["../../../../../src/ui/primitives/BrandLoader/BrandLoaderProvider.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { BrandLoaderSymbolContext, type BrandLoaderSymbol } from \"./brandLoaderSymbolContext\";\n\nexport type BrandLoaderProviderProps = {\n  symbol: BrandLoaderSymbol;\n  children: ReactNode;\n};\n\nexport function BrandLoaderProvider({ symbol, children }: BrandLoaderProviderProps) {\n  return (\n    <BrandLoaderSymbolContext.Provider value={symbol}>\n      {children}\n    </BrandLoaderSymbolContext.Provider>\n  );\n}\n"],"names":["BrandLoaderProvider","symbol","children","BrandLoaderSymbolContext"],"mappings":"iKAQO,SAASA,EAAoB,CAAE,OAAAC,EAAQ,SAAAC,GAAsC,CAClF,aACGC,EAAAA,yBAAyB,SAAzB,CAAkC,MAAOF,EACvC,SAAAC,EACH,CAEJ"}

package/dist/lib/ui/primitives/BrandLoader/BrandLoaderProvider.js

@@ -0,0 +1,9 @@
+import { jsx as e } from "react/jsx-runtime";
+import { BrandLoaderSymbolContext as t } from "./brandLoaderSymbolContext.js";
+function a({ symbol: r, children: o }) {
+  return /* @__PURE__ */ e(t.Provider, { value: r, children: o });
+}
+export {
+  a as BrandLoaderProvider
+};
+//# sourceMappingURL=BrandLoaderProvider.js.map