@alfadocs/ui-kit-debug 1.73.3 → 1.74.0

package/dist/_chunks/brand-mark-DLk9kD8g.js

@@ -0,0 +1,63 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useRef as m, useState as l, useEffect as f } from "react";
+import { c as u } from "./index-D2ZczOXr.js";
+import { A as b, P as v } from "./mark-pieces-m_rn1mAc.js";
+const x = u(
+  "ds:w-24 ds:shrink-0 ds:select-none ds:text-[color:var(--primary)] ds:forced-colors:text-[CanvasText]"
+), _ = {
+  assemble: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*12)_ease-in-out_1]",
+  spin: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*8)_ease-in-out_1]",
+  pulse: "ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-pulse_calc(var(--animation-duration)*6)_ease-in-out_3]",
+  none: void 0
+}, g = {
+  top: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-top_calc(var(--animation-duration)*12)_ease-in-out_1]",
+  right: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-right_calc(var(--animation-duration)*12)_ease-in-out_1]",
+  left: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-left_calc(var(--animation-duration)*12)_ease-in-out_1]",
+  bottom: "ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-bottom_calc(var(--animation-duration)*12)_ease-in-out_1]"
+};
+function E({
+  motion: t = "assemble",
+  label: e,
+  className: s
+}) {
+  const n = m(null), [i, d] = l(0);
+  return f(() => {
+    const a = n.current;
+    if (!a) return;
+    const o = () => d((c) => c + 1);
+    return a.addEventListener("click", o), () => a.removeEventListener("click", o);
+  }, []), /* @__PURE__ */ r(
+    "div",
+    {
+      ref: n,
+      "data-brand-mark": "",
+      "data-motion": t,
+      role: e ? "img" : void 0,
+      "aria-label": e,
+      "aria-hidden": e ? void 0 : !0,
+      className: x({ className: s }),
+      children: /* @__PURE__ */ r(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "-26 -26 200 200",
+          fill: "currentColor",
+          "aria-hidden": "true",
+          className: "ds:block ds:h-auto ds:w-full ds:overflow-visible",
+          children: /* @__PURE__ */ r("g", { className: _[t], children: b.map((a) => /* @__PURE__ */ r(
+            "g",
+            {
+              className: t === "assemble" ? g[a] : void 0,
+              children: /* @__PURE__ */ r(v, { name: a })
+            },
+            a
+          )) }, i)
+        }
+      )
+    }
+  );
+}
+export {
+  E as B
+};
+//# sourceMappingURL=brand-mark-DLk9kD8g.js.map

package/dist/_chunks/brand-mark-DLk9kD8g.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-mark-DLk9kD8g.js","sources":["../../src/patterns/_shared/brand-mark.tsx"],"sourcesContent":["/* -------------------------------------------------------------------- */\n/* BrandMark — the Alfadocs mark, arriving.                               */\n/*                                                                        */\n/* The four pieces of the mark with a short motion when the page opens:  */\n/* they fly apart, turn and come back together (`assemble`), or the      */\n/* whole mark turns once (`spin`) or beats (`pulse`). It plays once and  */\n/* then rests, so nothing moves for more than a few seconds (WCAG        */\n/* 2.2.2); a click plays it again. Every motion scales off               */\n/* --animation-duration, so reduced motion and the accessible themes     */\n/* hold it still.                                                         */\n/* -------------------------------------------------------------------- */\n\nimport { useEffect, useRef, useState, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { ALL, Piece, type PieceName } from './mark-pieces';\n\nexport type BrandMarkMotion = 'assemble' | 'spin' | 'pulse' | 'none';\n\nexport interface BrandMarkProps {\n  /** How the mark arrives. Default `assemble`. */\n  motion?: BrandMarkMotion;\n  /**\n   * The mark's accessible name, e.g. \"Alfadocs\", when it is the page's\n   * logo. Without it the mark is decoration and hidden from screen\n   * readers.\n   */\n  label?: string;\n  className?: string;\n}\n\n// The width of the mark on the development login card. The mark draws in\n// `currentColor`, so the ink is set here: the primary colour, or under\n// forced colours (Windows high contrast) the system's text colour, as Logo\n// does. A fill written as a brand colour would not be replaced and could\n// all but vanish against the system background.\nconst brandMarkVariants = cva(\n  'ds:w-24 ds:shrink-0 ds:select-none ds:text-[color:var(--primary)] ds:forced-colors:text-[CanvasText]',\n);\n\n/* Every class is written out in full: Tailwind only generates the ones\n   it can read as a whole string. The whole mark turns about the centre\n   of the drawing; each piece moves about its own centre. */\nconst WHOLE: Record<BrandMarkMotion, string | undefined> = {\n  assemble:\n    'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  spin: 'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-turn_calc(var(--animation-duration)*8)_ease-in-out_1]',\n  pulse:\n    'ds:[transform-box:view-box] ds:origin-center ds:motion-safe:animate-[brand-mark-pulse_calc(var(--animation-duration)*6)_ease-in-out_3]',\n  none: undefined,\n};\nconst SCATTER: Record<PieceName, string> = {\n  top: 'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-top_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  right:\n    'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-right_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  left: 'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-left_calc(var(--animation-duration)*12)_ease-in-out_1]',\n  bottom:\n    'ds:[transform-box:fill-box] ds:origin-center ds:motion-safe:animate-[brand-mark-scatter-bottom_calc(var(--animation-duration)*12)_ease-in-out_1]',\n};\n\nexport function BrandMark({\n  motion = 'assemble',\n  label,\n  className,\n}: BrandMarkProps): ReactNode {\n  const ref = useRef<HTMLDivElement | null>(null);\n  const [plays, setPlays] = useState(0);\n\n  // A listener rather than onClick: the replay is for the pointer only,\n  // and the mark stays a plain image to assistive technology.\n  useEffect(() => {\n    const element = ref.current;\n    if (!element) return undefined;\n    const replay = () => setPlays((count) => count + 1);\n    element.addEventListener('click', replay);\n    return () => element.removeEventListener('click', replay);\n  }, []);\n\n  return (\n    <div\n      ref={ref}\n      data-brand-mark=\"\"\n      data-motion={motion}\n      role={label ? 'img' : undefined}\n      aria-label={label}\n      aria-hidden={label ? undefined : true}\n      className={brandMarkVariants({ className })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"-26 -26 200 200\"\n        fill=\"currentColor\"\n        aria-hidden=\"true\"\n        className=\"ds:block ds:h-auto ds:w-full ds:overflow-visible\"\n      >\n        {/* A new key starts the motion again from its first frame. */}\n        <g key={plays} className={WHOLE[motion]}>\n          {ALL.map((name) => (\n            <g\n              key={name}\n              className={motion === 'assemble' ? SCATTER[name] : undefined}\n            >\n              <Piece name={name} />\n            </g>\n          ))}\n        </g>\n      </svg>\n    </div>\n  );\n}\n"],"names":["brandMarkVariants","cva","WHOLE","SCATTER","BrandMark","motion","label","className","ref","useRef","plays","setPlays","useState","useEffect","element","replay","count","jsx","ALL","name","Piece"],"mappings":";;;;AAmCA,MAAMA,IAAoBC;AAAA,EACxB;AACF,GAKMC,IAAqD;AAAA,EACzD,UACE;AAAA,EACF,MAAM;AAAA,EACN,OACE;AAAA,EACF,MAAM;AACR,GACMC,IAAqC;AAAA,EACzC,KAAK;AAAA,EACL,OACE;AAAA,EACF,MAAM;AAAA,EACN,QACE;AACJ;AAEO,SAASC,EAAU;AAAA,EACxB,QAAAC,IAAS;AAAA,EACT,OAAAC;AAAA,EACA,WAAAC;AACF,GAA8B;AAC5B,QAAMC,IAAMC,EAA8B,IAAI,GACxC,CAACC,GAAOC,CAAQ,IAAIC,EAAS,CAAC;AAIpC,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAUN,EAAI;AACpB,QAAI,CAACM,EAAS;AACd,UAAMC,IAAS,MAAMJ,EAAS,CAACK,MAAUA,IAAQ,CAAC;AAClD,WAAAF,EAAQ,iBAAiB,SAASC,CAAM,GACjC,MAAMD,EAAQ,oBAAoB,SAASC,CAAM;AAAA,EAC1D,GAAG,CAAA,CAAE,GAGH,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAT;AAAA,MACA,mBAAgB;AAAA,MAChB,eAAaH;AAAA,MACb,MAAMC,IAAQ,QAAQ;AAAA,MACtB,cAAYA;AAAA,MACZ,eAAaA,IAAQ,SAAY;AAAA,MACjC,WAAWN,EAAkB,EAAE,WAAAO,GAAW;AAAA,MAE1C,UAAA,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,eAAY;AAAA,UACZ,WAAU;AAAA,UAGV,UAAA,gBAAAA,EAAC,OAAc,WAAWf,EAAMG,CAAM,GACnC,UAAAa,EAAI,IAAI,CAACC,MACR,gBAAAF;AAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAWZ,MAAW,aAAaF,EAAQgB,CAAI,IAAI;AAAA,cAEnD,UAAA,gBAAAF,EAACG,KAAM,MAAAD,EAAA,CAAY;AAAA,YAAA;AAAA,YAHdA;AAAA,UAAA,CAKR,KARKT,CASR;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;"}

package/dist/_chunks/{calendar-appointment-editor-dialog-Lji2y0qJ.js → calendar-appointment-editor-dialog-CctI6mpd.js}

@@ -2,21 +2,21 @@ import { jsxs as p, jsx as t, Fragment as Ue } from "react/jsx-runtime";
 import { createElement as wo, useContext as ki, createContext as Ii, useState as A, useCallback as Z, useMemo as ee, useRef as F, useEffect as oe, useId as St, forwardRef as Fr, Fragment as To, useLayoutEffect as Ks } from "react";
 import { useTranslation as $e } from "react-i18next";
 import { u as Lo } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
-import { A as Ao } from "./appointment-timeline-CKwMXUid.js";
+import { A as Ao } from "./appointment-timeline-1-Za2miy.js";
 import { a as yi } from "./workflow-status-Dc_CyEz5.js";
 import { A as dr, g as Eo } from "./avatar-BPiPL7ND.js";
 import { B as ot } from "./badge-BUk4RjTS.js";
 import { S as Hn, C as Ci } from "./skeleton-tTWJpvAq.js";
 import { S as Sr } from "./stethoscope-sZXGC43m.js";
 import { A as Gs, a as Ni } from "./entity-card-fpm-KUKc.js";
-import { T as Oo, P as Ro, E as xi, S as Mo } from "./task-editor-BTeUFGUX.js";
+import { T as Oo, P as Ro, E as xi, S as Mo } from "./task-editor-CRhfwP9T.js";
 import { C as Wo, a as Po, u as Di, d as Bo } from "./control-room-rail-CKZ2nemY.js";
 import { S as ms } from "./scroll-area-CY5SLYNw.js";
 import { d as vt, c as qs, b as ra } from "./toast-BNoN8Qjh.js";
 import { T as Ga, a as Si } from "./tooltip-uEBdD1-5.js";
 import { A as he } from "./alert-9kEwDza3.js";
 import { B as ge } from "./button-DohK_Ak_.js";
-import { f as ft, b as ja, c as _o, d as $o, e as zo, A as wi, u as Fo, R as wr, g as Ho, D as Ti, M as Vo, C as js, h as Uo, i as Ko, j as Go, k as qo, l as wa, I as jo, s as Yo } from "./use-appointment-details-read-BWbOiLVw.js";
+import { f as ft, b as ja, c as _o, d as $o, e as zo, A as wi, u as Fo, R as wr, g as Ho, D as Ti, M as Vo, C as js, h as Uo, i as Ko, j as Go, k as qo, l as wa, I as jo, s as Yo } from "./use-appointment-details-read-BFslxbRr.js";
 import { V as va } from "./visually-hidden-BHxEUGyT.js";
 import { C as Xo } from "./calendar-ClB-jWH1.js";
 import { C as lr } from "./card-BA4Ig_kn.js";
@@ -28,7 +28,7 @@ import { T as ur } from "./tag-DOZGz0fT.js";
 import { S as Zr } from "./switch-D--x7n6h.js";
 import { I as qe } from "./icon-button-S8_weU3g.js";
 import { B as Ma } from "./button-group-ZVb1Q-w4.js";
-import { D as sa } from "./date-picker-KcoNNsM0.js";
+import { D as sa } from "./date-picker-CdhXlgVI.js";
 import { D as dn } from "./dialog-C7RWaH08.js";
 import { D as U } from "./dropdown-menu-D1we7oAY.js";
 import { F as Ie } from "./form-field-Ani72sVY.js";
@@ -74,7 +74,7 @@ import { createPortal as lc } from "react-dom";
 import { G as Ya, h as Js, c as uc, A as hc, C as _i } from "./color-picker-AcaWuKah.js";
 import { s as mc, S as pc } from "./signature-status-chip-pIoQjvH8.js";
 import { b as gc } from "./appointment-workflow-status-DMjuIK90.js";
-import { N as vc } from "./notes-panel-C_QshXyI.js";
+import { N as vc } from "./notes-panel-CxjMovCh.js";
 import { C as vs } from "./combobox-vF9O-QoG.js";
 import { S as fc } from "./state-backed-text-input-Cgh4ms3p.js";
 import { N as ns } from "./number-input-CVwI1ltI.js";
@@ -83,8 +83,8 @@ import { D as kc } from "./data-table-DTKGWUQm.js";
 import { T as fs } from "./timestamp-DPLDWdxA.js";
 import { I as Zs } from "./icon-button-group-CRKFR48b.js";
 import { C as Ic, b as yc, a as Cc } from "./collapsible-DVPM46bq.js";
-import { g as Nc } from "./date-picker-variants-DN37Oj5-.js";
-import { f as xc } from "./format-D-1gTdHF.js";
+import { g as Nc } from "./date-picker-variants-Dt6UbonG.js";
+import { f as xc } from "./format--x5jypvH.js";
 import { R as Dc } from "./repeat-CvQa5rZt.js";
 import { T as Sc } from "./transaction-chip-CohY6sTA.js";
 import { V as wc } from "./video-BheNGvsu.js";
@@ -10983,4 +10983,4 @@ export {
   hp as r,
   Vn as u
 };
-//# sourceMappingURL=calendar-appointment-editor-dialog-Lji2y0qJ.js.map
+//# sourceMappingURL=calendar-appointment-editor-dialog-CctI6mpd.js.map