@zyncat/ui 0.11.0 → 0.12.0

package/dist/toast.js

@@ -1,14 +1,15 @@
 'use client';import { DEFAULT_TOASTER_CONFIG, UIToast } from './chunk-TYHR4VNM.js';
 export { toast } from './chunk-TYHR4VNM.js';
 import { tokenPx } from './chunk-UE63OOVG.js';
-import { Presence } from './chunk-NGTA34V2.js';
-import { Motion } from './chunk-2QWJ6FAX.js';
-import './chunk-XWUWYSCT.js';
-import { animate, startDrag } from './chunk-YGCVWGUG.js';
-import { Icon } from './chunk-3SBCBYB7.js';
-import { fireGlint } from './chunk-S7B34VGN.js';
-import { UIMotion } from './chunk-S5ZTZANS.js';
-import { Button } from './chunk-2F5PITAO.js';
+import { popOut } from './chunk-HDSFWZ7L.js';
+import { Presence } from './chunk-DDRSMHN4.js';
+import { Motion } from './chunk-5PZ43DCG.js';
+import './chunk-M43IOM5C.js';
+import { animate, startDrag } from './chunk-IJS7TPGV.js';
+import { Icon } from './chunk-EAI4POPB.js';
+import { fireGlint } from './chunk-OWNMRMPN.js';
+import { UIMotion } from './chunk-7IZJERGA.js';
+import { Button } from './chunk-HY5MPISE.js';
 import { cx } from './chunk-QGNC7LH5.js';
 import './toast.css';
 import { useEffect, useSyncExternalStore, useState, useRef, useLayoutEffect } from 'react';
@@ -20,6 +21,7 @@ var store = UIToast;
 var COLLAPSE_GRACE = 140;
 var SWIPE_X = 64;
 var SWIPE_V = 480;
+var SWIPE_FLING_X = 420;
 var GAP = 0;
 function stackGap() {
   if (!GAP) GAP = tokenPx("--space-3") || 12;
@@ -32,33 +34,24 @@ var TONE_ICON = {
   info: "info"
 };
 function useToneGesture(tone, ref) {
-  const prevTone = useRef(null);
   useEffect(() => {
-    const prev = prevTone.current;
-    prevTone.current = tone;
-    if (tone === prev) return;
     if (tone === "success") return fireGlint(ref.current);
     if (tone === "danger" && ref.current) {
-      const shake = ref.current.firstElementChild;
-      if (!shake) return;
-      const fall = animate(shake, {
+      const fall = animate(ref.current, {
         x: [0, -7, 5, -2, 0],
-        timing: { duration: SM.dur.slow, ease: SM.ease.standard, delay: SM.dur.base }
+        timing: { duration: SM.dur.slow, ease: SM.ease.standard, delay: SM.dur.base, fill: "none" },
+        composite: "add"
       });
-      fall.finished.then(() => fall.stop());
       return () => fall.stop();
     }
   }, [tone]);
 }
-function useReplay(token, build) {
-  const ref = useRef(null);
-  const latest = useRef(build);
-  latest.current = build;
-  useLayoutEffect(() => {
-    if (ref.current) animate(ref.current, ...latest.current());
-  }, [token]);
-  return ref;
-}
+var GLYPH_POP = [
+  { scale: [0.5, 1], timing: SM.t.settle },
+  { opacity: [0, 1], timing: SM.t.enter }
+];
+var TEXT_FADE = [{ opacity: [0, 1], timing: SM.t.enter }];
+var COUNT_POP = [{ scale: [0.6, 1], timing: SM.t.settle }];
 function ToastItem({
   t,
   depth,
@@ -72,6 +65,8 @@ function ToastItem({
   const ref = useRef(null);
   const settled = useRef(false);
   const swipeBack = useRef(null);
+  const swipeX = useRef(0);
+  const restY = useRef(0);
   useToneGesture(t.tone, ref);
   useLayoutEffect(() => {
     if (ref.current && ref.current.firstElementChild)
@@ -83,10 +78,11 @@ function ToastItem({
     el.style.pointerEvents = hidden ? "none" : "auto";
     const y = isTop ? offset : -offset;
     const scale = 1 - depth * 0.05;
+    restY.current = y;
     if (settled.current) {
       animate(
         el,
-        { y: [y], scale: [scale], height: [frameHeight ?? "auto"], timing: SM.t.settle },
+        { x: [swipeX.current], y: [y], scale: [scale], height: [frameHeight ?? "auto"], timing: SM.t.settle },
         { opacity: [hidden ? 0 : 1], timing: SM.t.enter }
       );
       return;
@@ -94,27 +90,35 @@ function ToastItem({
     settled.current = true;
     animate(
       el,
-      { y: [isTop ? -24 : 24, y], scale: [0.97, scale], timing: SM.t.settle },
+      { y: [isTop ? -SM.dist.lg : SM.dist.lg, y], scale: [SM.scale.floating, scale], timing: SM.t.settle },
       { opacity: [0, hidden ? 0 : 1], timing: SM.t.enter }
     );
   }, [offset, depth, hidden, frameHeight, isTop]);
   const onPointerDown = (e) => {
-    const inner = ref.current?.firstElementChild;
-    if (!t.dismissible || e.button !== 0 || !inner) return;
+    const el = ref.current;
+    if (!t.dismissible || e.button !== 0 || !el) return;
     swipeBack.current?.stop();
+    swipeBack.current = null;
+    const place = (x) => {
+      swipeX.current = x;
+      animate(el, { x: [x], y: [restY.current], timing: { duration: 0 } });
+    };
+    place(swipeX.current);
     startDrag(e, {
       onMove: (info) => {
         const dx = info.offset.x;
-        inner.style.translate = `${dx > 0 ? dx * 0.9 : dx * 0.04}px 0px`;
+        place(dx > 0 ? dx * 0.9 : dx * 0.04);
       },
       onEnd: (info) => {
         if (info.offset.x > SWIPE_X || info.velocity.x > SWIPE_V) {
-          animate(inner, { x: [420], timing: SM.t.exit }).finished.then(() => store.dismiss(t.id));
+          swipeX.current = SWIPE_FLING_X;
+          animate(el, { x: [SWIPE_FLING_X], y: [restY.current], timing: SM.t.exit }).finished.then(
+            () => store.dismiss(t.id)
+          );
           return;
         }
-        const back = animate(inner, { x: [0], timing: SM.t.settle });
-        swipeBack.current = back;
-        back.finished.then(() => back.stop());
+        swipeX.current = 0;
+        swipeBack.current = animate(el, { x: [0], y: [restY.current], timing: SM.t.settle });
       }
     });
   };
@@ -123,7 +127,7 @@ function ToastItem({
     {
       as: "li",
       ref,
-      exit: { opacity: [0], scale: [0.96], timing: SM.t.exit },
+      exit: popOut(SM.scale.floating, SM.t.exit),
       className: "toast glass",
       "data-tone": t.tone,
       "data-behind": behind ? "" : void 0,
@@ -138,17 +142,9 @@ function ToastItem({
   );
 }
 function ToastBody({ t }) {
-  const glyphRef = useReplay(t.tone, () => [
-    { scale: [0.5, 1], timing: SM.t.settle },
-    { opacity: [0, 1], timing: SM.t.enter }
-  ]);
-  const textRef = useReplay(String(t.message) + "-" + String(t.description), () => [
-    { opacity: [0, 1], timing: SM.t.enter }
-  ]);
-  const countRef = useReplay(t.count, () => [{ scale: [0.6, 1], timing: SM.t.settle }]);
   return /* @__PURE__ */ jsxs("div", { className: "toast__inner", children: [
     (t.tone !== "default" || isFinite(t.duration)) && /* @__PURE__ */ jsxs("span", { className: "toast__icon", children: [
-      t.tone !== "default" && /* @__PURE__ */ jsx("span", { ref: glyphRef, className: "toast__icon-glyph", children: t.tone === "loading" ? /* @__PURE__ */ jsx("span", { className: "toast__spinner", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Icon, { name: TONE_ICON[t.tone] || "info", weight: "fill" }) }),
+      t.tone !== "default" && /* @__PURE__ */ jsx(Motion, { as: "span", className: "toast__icon-glyph", animate: GLYPH_POP, deps: [t.tone], children: t.tone === "loading" ? /* @__PURE__ */ jsx("span", { className: "toast__spinner", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Icon, { name: TONE_ICON[t.tone] || "info", weight: "fill" }) }),
       isFinite(t.duration) && /* @__PURE__ */ jsxs("svg", { className: "toast__ring", viewBox: "0 0 36 36", "aria-hidden": "true", children: [
         /* @__PURE__ */ jsx("circle", { className: "toast__ring-track", cx: "18", cy: "18", r: "16.5" }),
         /* @__PURE__ */ jsx(
@@ -164,11 +160,11 @@ function ToastBody({ t }) {
         )
       ] }, "ring-" + t.timerKey)
     ] }),
-    /* @__PURE__ */ jsxs("div", { ref: textRef, className: "toast__text", children: [
+    /* @__PURE__ */ jsxs(Motion, { className: "toast__text", animate: TEXT_FADE, deps: [String(t.message) + "-" + String(t.description)], children: [
       /* @__PURE__ */ jsx("p", { className: "toast__message", children: t.message }),
       t.description != null && /* @__PURE__ */ jsx("p", { className: "toast__desc", children: t.description })
     ] }),
-    t.count > 1 && /* @__PURE__ */ jsxs("span", { ref: countRef, className: "toast__count", children: [
+    t.count > 1 && /* @__PURE__ */ jsxs(Motion, { as: "span", className: "toast__count", animate: COUNT_POP, deps: [t.count], children: [
       "\xD7",
       t.count
     ] }),

package/dist/toast.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/composites/toast/Toast.tsx"],"names":[],"mappings":"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","file":"toast.js","sourcesContent":["'use client';\n\nimport './toast.css';\nimport {\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type CSSProperties,\n  type FocusEvent as ReactFocusEvent,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type PointerEvent as ReactPointerEvent,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type RefObject,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { animate, startDrag, type Layer, type Playback } from '../../../engine';\nimport { Presence } from '../../../motion/presence';\nimport { Motion } from '../../../motion/element';\nimport { UIMotion } from '../../../tokens/motion-tokens';\nimport { fireGlint } from '../../internal/glass/glint';\nimport { tokenPx } from '../../internal/utils/token-px';\nimport { Icon, type IconName } from '../../internal/icon/Icon';\nimport { Button } from '../../primitives/button/Button';\nimport { UIToast, DEFAULT_TOASTER_CONFIG, type ToastRecord, type ToastTone, type ToasterConfig } from './toast-store';\nimport type { DataAttributes } from '../../../dom-props';\nimport { cx } from '../../internal/utils/cx';\n\nconst SM = UIMotion;\nconst store = UIToast;\n\nconst COLLAPSE_GRACE = 140;\nconst SWIPE_X = 64;\nconst SWIPE_V = 480;\n\nlet GAP = 0;\nfunction stackGap() {\n  if (!GAP) GAP = tokenPx('--space-3') || 12;\n  return GAP;\n}\n\nconst TONE_ICON: Partial<Record<ToastTone, IconName>> = {\n  success: 'check-circle',\n  danger: 'warning-circle',\n  warning: 'warning',\n  info: 'info',\n};\n\nfunction useToneGesture(tone: ToastTone, ref: RefObject<HTMLElement>) {\n  const prevTone = useRef<ToastTone | null>(null);\n  useEffect(() => {\n    const prev = prevTone.current;\n    prevTone.current = tone;\n    if (tone === prev) return;\n    if (tone === 'success') return fireGlint(ref.current);\n    if (tone === 'danger' && ref.current) {\n      const shake = ref.current.firstElementChild as HTMLElement | null;\n      if (!shake) return;\n      const fall = animate(shake, {\n        x: [0, -7, 5, -2, 0],\n        timing: { duration: SM.dur.slow, ease: SM.ease.standard, delay: SM.dur.base },\n      });\n      fall.finished.then(() => fall.stop());\n      return () => fall.stop();\n    }\n  }, [tone]);\n}\n\nfunction useReplay<T extends HTMLElement>(token: unknown, build: () => Layer[]) {\n  const ref = useRef<T>(null);\n  const latest = useRef(build);\n  latest.current = build;\n  useLayoutEffect(() => {\n    if (ref.current) animate(ref.current, ...latest.current());\n  }, [token]);\n  return ref;\n}\n\nfunction ToastItem({\n  t,\n  depth,\n  offset,\n  hidden,\n  behind,\n  frameHeight,\n  isTop,\n  onHeight,\n}: {\n  t: ToastRecord;\n  depth: number;\n  offset: number;\n  hidden: boolean;\n  behind: boolean;\n  frameHeight: number | null;\n  isTop: boolean;\n  onHeight: (id: string, h: number) => void;\n}) {\n  const ref = useRef<HTMLLIElement>(null);\n  const settled = useRef(false);\n  const swipeBack = useRef<Playback | null>(null);\n  useToneGesture(t.tone, ref);\n\n  useLayoutEffect(() => {\n    if (ref.current && ref.current.firstElementChild)\n      onHeight(t.id, (ref.current.firstElementChild as HTMLElement).offsetHeight);\n  });\n\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    el.style.pointerEvents = hidden ? 'none' : 'auto';\n    const y = isTop ? offset : -offset;\n    const scale = 1 - depth * 0.05;\n    if (settled.current) {\n      animate(\n        el,\n        { y: [y], scale: [scale], height: [frameHeight ?? 'auto'], timing: SM.t.settle },\n        { opacity: [hidden ? 0 : 1], timing: SM.t.enter },\n      );\n      return;\n    }\n    settled.current = true;\n    animate(\n      el,\n      { y: [isTop ? -24 : 24, y], scale: [0.97, scale], timing: SM.t.settle },\n      { opacity: [0, hidden ? 0 : 1], timing: SM.t.enter },\n    );\n  }, [offset, depth, hidden, frameHeight, isTop]);\n\n  const onPointerDown = (e: ReactPointerEvent) => {\n    const inner = ref.current?.firstElementChild as HTMLElement | null;\n    if (!t.dismissible || e.button !== 0 || !inner) return;\n    swipeBack.current?.stop();\n    startDrag(e, {\n      onMove: (info) => {\n        const dx = info.offset.x;\n        inner.style.translate = `${dx > 0 ? dx * 0.9 : dx * 0.04}px 0px`;\n      },\n      onEnd: (info) => {\n        if (info.offset.x > SWIPE_X || info.velocity.x > SWIPE_V) {\n          animate(inner, { x: [420], timing: SM.t.exit }).finished.then(() => store.dismiss(t.id));\n          return;\n        }\n        const back = animate(inner, { x: [0], timing: SM.t.settle });\n        swipeBack.current = back;\n        back.finished.then(() => back.stop());\n      },\n    });\n  };\n\n  return (\n    <Motion\n      as=\"li\"\n      ref={ref}\n      exit={{ opacity: [0], scale: [0.96], timing: SM.t.exit }}\n      className=\"toast glass\"\n      data-tone={t.tone}\n      data-behind={behind ? '' : undefined}\n      role={t.tone === 'danger' ? 'alert' : 'status'}\n      aria-atomic=\"true\"\n      onPointerDown={onPointerDown}\n      onKeyDown={(e: ReactKeyboardEvent) => {\n        if (e.key === 'Escape' && t.dismissible) store.dismiss(t.id);\n      }}\n    >\n      {t.node ? <div className=\"toast__custom\">{t.node as ReactNode}</div> : <ToastBody t={t} />}\n    </Motion>\n  );\n}\n\nfunction ToastBody({ t }: { t: ToastRecord }) {\n  const glyphRef = useReplay<HTMLSpanElement>(t.tone, () => [\n    { scale: [0.5, 1], timing: SM.t.settle },\n    { opacity: [0, 1], timing: SM.t.enter },\n  ]);\n  const textRef = useReplay<HTMLDivElement>(String(t.message) + '-' + String(t.description), () => [\n    { opacity: [0, 1], timing: SM.t.enter },\n  ]);\n  const countRef = useReplay<HTMLSpanElement>(t.count, () => [{ scale: [0.6, 1], timing: SM.t.settle }]);\n\n  return (\n    <div className=\"toast__inner\">\n      {(t.tone !== 'default' || isFinite(t.duration)) && (\n        <span className=\"toast__icon\">\n          {t.tone !== 'default' && (\n            <span ref={glyphRef} className=\"toast__icon-glyph\">\n              {t.tone === 'loading' ? (\n                <span className=\"toast__spinner\" aria-hidden=\"true\"></span>\n              ) : (\n                <Icon name={TONE_ICON[t.tone] || 'info'} weight=\"fill\" />\n              )}\n            </span>\n          )}\n          {isFinite(t.duration) && (\n            <svg key={'ring-' + t.timerKey} className=\"toast__ring\" viewBox=\"0 0 36 36\" aria-hidden=\"true\">\n              <circle className=\"toast__ring-track\" cx=\"18\" cy=\"18\" r=\"16.5\"></circle>\n              <circle\n                className=\"toast__ring-arc\"\n                cx=\"18\"\n                cy=\"18\"\n                r=\"16.5\"\n                pathLength={1}\n                style={{ animationDuration: t.duration + 'ms' }}\n              ></circle>\n            </svg>\n          )}\n        </span>\n      )}\n      <div ref={textRef} className=\"toast__text\">\n        <p className=\"toast__message\">{t.message}</p>\n        {t.description != null && <p className=\"toast__desc\">{t.description}</p>}\n      </div>\n      {t.count > 1 && (\n        <span ref={countRef} className=\"toast__count\">\n          ×{t.count}\n        </span>\n      )}\n      {t.action && (\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          className=\"toast__action\"\n          onClick={() => {\n            if (t.action.onClick) t.action.onClick();\n            store.dismiss(t.id);\n          }}\n        >\n          {t.action.label}\n        </Button>\n      )}\n      {t.dismissible && (\n        <button type=\"button\" className=\"toast__close\" aria-label=\"Dismiss\" onClick={() => store.dismiss(t.id)}>\n          <Icon name=\"close\" size=\"sm\" />\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction ToastHost({ config, htmlProps }: { config: ToasterConfig; htmlProps?: HTMLAttributes<HTMLOListElement> }) {\n  const { toasts, paused, expanded: hoverExpanded } = useSyncExternalStore(store.subscribe, store.get, store.get);\n  const [heights, setHeights] = useState<Record<string, number>>({});\n  const [ready, setReady] = useState(false);\n  const collapseTimer = useRef<ReturnType<typeof setTimeout> | 0>(0);\n  const hovering = useRef(false);\n\n  useEffect(() => setReady(true), []);\n\n  const onHeight = (id: string, h: number) => setHeights((prev) => (prev[id] === h ? prev : { ...prev, [id]: h }));\n\n  const onHold = () => {\n    hovering.current = true;\n    clearTimeout(collapseTimer.current);\n    store.setExpanded(true);\n    store.pause();\n  };\n  const onRelease = (graced: boolean) => {\n    hovering.current = false;\n    clearTimeout(collapseTimer.current);\n    collapseTimer.current = setTimeout(\n      () => {\n        store.setExpanded(false);\n        store.resume();\n      },\n      graced ? COLLAPSE_GRACE : 0,\n    );\n  };\n\n  useEffect(() => {\n    const onVis = () => {\n      if (document.hidden) store.pause();\n      else if (!hovering.current) store.resume();\n    };\n    document.addEventListener('visibilitychange', onVis);\n    return () => document.removeEventListener('visibilitychange', onVis);\n  }, []);\n\n  useEffect(() => {\n    if (toasts.length === 0) {\n      hovering.current = false;\n      clearTimeout(collapseTimer.current);\n      store.setExpanded(false);\n      store.resume();\n    }\n  }, [toasts.length]);\n\n  if (!ready) return null;\n\n  const isTop = config.position.startsWith('top');\n  const visible = config.visibleToasts;\n  const rendered = visible * 2;\n  const gap = config.gap || stackGap();\n  const expanded = config.expand || hoverExpanded;\n\n  const slice = toasts.slice(-rendered);\n  const n = slice.length;\n  const frontH = n ? heights[slice[n - 1].id] || 0 : 0;\n\n  return createPortal(\n    <ol\n      {...htmlProps}\n      className={cx('toast-viewport', paused && 'is-paused', htmlProps?.className)}\n      data-position={config.position}\n      style={\n        config.offset\n          ? ({ ...htmlProps?.style, '--toast-offset': `${config.offset}px` } as CSSProperties)\n          : htmlProps?.style\n      }\n      aria-label=\"Notifications\"\n      onPointerOver={(e: ReactPointerEvent<HTMLOListElement>) => {\n        if (e.pointerType !== 'touch') onHold();\n      }}\n      onPointerOut={(e: ReactPointerEvent<HTMLOListElement>) => {\n        if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget as Node)) onRelease(true);\n      }}\n      onFocus={onHold}\n      onBlur={(e: ReactFocusEvent<HTMLOListElement>) => {\n        if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget as Node)) onRelease(false);\n      }}\n    >\n      <Presence>\n        {slice.map((t, i) => {\n          const depth = n - 1 - i;\n          let offset = depth * gap;\n          if (expanded) {\n            offset = 0;\n            for (let j = i + 1; j < n; j++) offset += (heights[slice[j].id] || 0) + gap;\n          }\n          return (\n            <ToastItem\n              key={t.id}\n              t={t}\n              depth={expanded ? 0 : depth}\n              offset={offset}\n              hidden={!expanded && depth >= visible}\n              behind={!expanded && depth > 0}\n              frameHeight={!expanded && depth > 0 && frontH ? frontH : null}\n              isTop={isTop}\n              onHeight={onHeight}\n            />\n          );\n        })}\n      </Presence>\n    </ol>,\n    document.body,\n  );\n}\n\nfunction stripUndefined<T extends object>(o: T): Partial<T> {\n  const out: Partial<T> = {};\n  (Object.keys(o) as (keyof T)[]).forEach((k) => {\n    if (o[k] !== undefined) out[k] = o[k];\n  });\n  return out;\n}\n\nexport interface ToasterProps extends Partial<ToasterConfig> {\n  /** Standard <ol> attributes (className, style, data-*, ...) forwarded to the toast viewport. */\n  htmlProps?: HTMLAttributes<HTMLOListElement> & DataAttributes;\n}\n\nexport function Toaster({ htmlProps, ...props }: ToasterProps): ReactElement {\n  const config: ToasterConfig = { ...DEFAULT_TOASTER_CONFIG, ...stripUndefined(props) };\n\n  useEffect(() => {\n    store.config = config;\n    store.mounted = true;\n    if (config.expand) store.setExpanded(true);\n    return () => {\n      store.mounted = false;\n    };\n  }, [config.position, config.duration, config.visibleToasts, config.gap, config.offset, config.expand]);\n\n  return <ToastHost config={config} htmlProps={htmlProps} />;\n}\n\nexport { toast } from './toast-store';\n"]}
+{"version":3,"sources":["../src/components/composites/toast/Toast.tsx"],"names":[],"mappings":"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","file":"toast.js","sourcesContent":["'use client';\n\nimport './toast.css';\n\nimport {\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactElement,\n  type FocusEvent as ReactFocusEvent,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n  type PointerEvent as ReactPointerEvent,\n  type RefObject,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport type { DataAttributes } from '../../../dom-props';\nimport { animate, startDrag, type Layer, type Playback } from '../../../engine';\nimport { Motion } from '../../../motion/element';\nimport { Presence } from '../../../motion/presence';\nimport { popOut } from '../../../motion/presets';\nimport { UIMotion } from '../../../tokens/motion-tokens';\nimport { fireGlint } from '../../internal/glass/glint';\nimport { Icon, type IconName } from '../../internal/icon/Icon';\nimport { cx } from '../../internal/utils/cx';\nimport { tokenPx } from '../../internal/utils/token-px';\nimport { Button } from '../../primitives/button/Button';\nimport { DEFAULT_TOASTER_CONFIG, UIToast, type ToasterConfig, type ToastRecord, type ToastTone } from './toast-store';\n\nconst SM = UIMotion;\nconst store = UIToast;\n\nconst COLLAPSE_GRACE = 140;\nconst SWIPE_X = 64;\nconst SWIPE_V = 480;\nconst SWIPE_FLING_X = 420;\n\nlet GAP = 0;\nfunction stackGap() {\n  if (!GAP) GAP = tokenPx('--space-3') || 12;\n  return GAP;\n}\n\nconst TONE_ICON: Partial<Record<ToastTone, IconName>> = {\n  success: 'check-circle',\n  danger: 'warning-circle',\n  warning: 'warning',\n  info: 'info',\n};\n\nfunction useToneGesture(tone: ToastTone, ref: RefObject<HTMLElement>) {\n  useEffect(() => {\n    if (tone === 'success') return fireGlint(ref.current);\n    if (tone === 'danger' && ref.current) {\n      const fall = animate(ref.current, {\n        x: [0, -7, 5, -2, 0],\n        timing: { duration: SM.dur.slow, ease: SM.ease.standard, delay: SM.dur.base, fill: 'none' },\n        composite: 'add',\n      });\n      return () => fall.stop();\n    }\n  }, [tone]);\n}\n\nconst GLYPH_POP: Layer[] = [\n  { scale: [0.5, 1], timing: SM.t.settle },\n  { opacity: [0, 1], timing: SM.t.enter },\n];\nconst TEXT_FADE: Layer[] = [{ opacity: [0, 1], timing: SM.t.enter }];\nconst COUNT_POP: Layer[] = [{ scale: [0.6, 1], timing: SM.t.settle }];\n\nfunction ToastItem({\n  t,\n  depth,\n  offset,\n  hidden,\n  behind,\n  frameHeight,\n  isTop,\n  onHeight,\n}: {\n  t: ToastRecord;\n  depth: number;\n  offset: number;\n  hidden: boolean;\n  behind: boolean;\n  frameHeight: number | null;\n  isTop: boolean;\n  onHeight: (id: string, h: number) => void;\n}) {\n  const ref = useRef<HTMLLIElement>(null);\n  const settled = useRef(false);\n  const swipeBack = useRef<Playback | null>(null);\n  const swipeX = useRef(0);\n  const restY = useRef(0);\n  useToneGesture(t.tone, ref);\n\n  useLayoutEffect(() => {\n    if (ref.current && ref.current.firstElementChild)\n      onHeight(t.id, (ref.current.firstElementChild as HTMLElement).offsetHeight);\n  });\n\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    el.style.pointerEvents = hidden ? 'none' : 'auto';\n    const y = isTop ? offset : -offset;\n    const scale = 1 - depth * 0.05;\n    restY.current = y;\n    if (settled.current) {\n      animate(\n        el,\n        { x: [swipeX.current], y: [y], scale: [scale], height: [frameHeight ?? 'auto'], timing: SM.t.settle },\n        { opacity: [hidden ? 0 : 1], timing: SM.t.enter },\n      );\n      return;\n    }\n    settled.current = true;\n    animate(\n      el,\n      { y: [isTop ? -SM.dist.lg : SM.dist.lg, y], scale: [SM.scale.floating, scale], timing: SM.t.settle },\n      { opacity: [0, hidden ? 0 : 1], timing: SM.t.enter },\n    );\n  }, [offset, depth, hidden, frameHeight, isTop]);\n\n  const onPointerDown = (e: ReactPointerEvent) => {\n    const el = ref.current;\n    if (!t.dismissible || e.button !== 0 || !el) return;\n    swipeBack.current?.stop();\n    swipeBack.current = null;\n    const place = (x: number) => {\n      swipeX.current = x;\n      animate(el, { x: [x], y: [restY.current], timing: { duration: 0 } });\n    };\n    place(swipeX.current);\n    startDrag(e, {\n      onMove: (info) => {\n        const dx = info.offset.x;\n        place(dx > 0 ? dx * 0.9 : dx * 0.04);\n      },\n      onEnd: (info) => {\n        if (info.offset.x > SWIPE_X || info.velocity.x > SWIPE_V) {\n          swipeX.current = SWIPE_FLING_X;\n          animate(el, { x: [SWIPE_FLING_X], y: [restY.current], timing: SM.t.exit }).finished.then(() =>\n            store.dismiss(t.id),\n          );\n          return;\n        }\n        swipeX.current = 0;\n        swipeBack.current = animate(el, { x: [0], y: [restY.current], timing: SM.t.settle });\n      },\n    });\n  };\n\n  return (\n    <Motion\n      as=\"li\"\n      ref={ref}\n      exit={popOut(SM.scale.floating, SM.t.exit)}\n      className=\"toast glass\"\n      data-tone={t.tone}\n      data-behind={behind ? '' : undefined}\n      role={t.tone === 'danger' ? 'alert' : 'status'}\n      aria-atomic=\"true\"\n      onPointerDown={onPointerDown}\n      onKeyDown={(e: ReactKeyboardEvent) => {\n        if (e.key === 'Escape' && t.dismissible) store.dismiss(t.id);\n      }}\n    >\n      {t.node ? <div className=\"toast__custom\">{t.node as ReactNode}</div> : <ToastBody t={t} />}\n    </Motion>\n  );\n}\n\nfunction ToastBody({ t }: { t: ToastRecord }) {\n  return (\n    <div className=\"toast__inner\">\n      {(t.tone !== 'default' || isFinite(t.duration)) && (\n        <span className=\"toast__icon\">\n          {t.tone !== 'default' && (\n            <Motion as=\"span\" className=\"toast__icon-glyph\" animate={GLYPH_POP} deps={[t.tone]}>\n              {t.tone === 'loading' ? (\n                <span className=\"toast__spinner\" aria-hidden=\"true\"></span>\n              ) : (\n                <Icon name={TONE_ICON[t.tone] || 'info'} weight=\"fill\" />\n              )}\n            </Motion>\n          )}\n          {isFinite(t.duration) && (\n            <svg key={'ring-' + t.timerKey} className=\"toast__ring\" viewBox=\"0 0 36 36\" aria-hidden=\"true\">\n              <circle className=\"toast__ring-track\" cx=\"18\" cy=\"18\" r=\"16.5\"></circle>\n              <circle\n                className=\"toast__ring-arc\"\n                cx=\"18\"\n                cy=\"18\"\n                r=\"16.5\"\n                pathLength={1}\n                style={{ animationDuration: t.duration + 'ms' }}\n              ></circle>\n            </svg>\n          )}\n        </span>\n      )}\n      <Motion className=\"toast__text\" animate={TEXT_FADE} deps={[String(t.message) + '-' + String(t.description)]}>\n        <p className=\"toast__message\">{t.message}</p>\n        {t.description != null && <p className=\"toast__desc\">{t.description}</p>}\n      </Motion>\n      {t.count > 1 && (\n        <Motion as=\"span\" className=\"toast__count\" animate={COUNT_POP} deps={[t.count]}>\n          ×{t.count}\n        </Motion>\n      )}\n      {t.action && (\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          className=\"toast__action\"\n          onClick={() => {\n            if (t.action.onClick) t.action.onClick();\n            store.dismiss(t.id);\n          }}\n        >\n          {t.action.label}\n        </Button>\n      )}\n      {t.dismissible && (\n        <button type=\"button\" className=\"toast__close\" aria-label=\"Dismiss\" onClick={() => store.dismiss(t.id)}>\n          <Icon name=\"close\" size=\"sm\" />\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction ToastHost({ config, htmlProps }: { config: ToasterConfig; htmlProps?: HTMLAttributes<HTMLOListElement> }) {\n  const { toasts, paused, expanded: hoverExpanded } = useSyncExternalStore(store.subscribe, store.get, store.get);\n  const [heights, setHeights] = useState<Record<string, number>>({});\n  const [ready, setReady] = useState(false);\n  const collapseTimer = useRef<ReturnType<typeof setTimeout> | 0>(0);\n  const hovering = useRef(false);\n\n  useEffect(() => setReady(true), []);\n\n  const onHeight = (id: string, h: number) => setHeights((prev) => (prev[id] === h ? prev : { ...prev, [id]: h }));\n\n  const onHold = () => {\n    hovering.current = true;\n    clearTimeout(collapseTimer.current);\n    store.setExpanded(true);\n    store.pause();\n  };\n  const onRelease = (graced: boolean) => {\n    hovering.current = false;\n    clearTimeout(collapseTimer.current);\n    collapseTimer.current = setTimeout(\n      () => {\n        store.setExpanded(false);\n        store.resume();\n      },\n      graced ? COLLAPSE_GRACE : 0,\n    );\n  };\n\n  useEffect(() => {\n    const onVis = () => {\n      if (document.hidden) store.pause();\n      else if (!hovering.current) store.resume();\n    };\n    document.addEventListener('visibilitychange', onVis);\n    return () => document.removeEventListener('visibilitychange', onVis);\n  }, []);\n\n  useEffect(() => {\n    if (toasts.length === 0) {\n      hovering.current = false;\n      clearTimeout(collapseTimer.current);\n      store.setExpanded(false);\n      store.resume();\n    }\n  }, [toasts.length]);\n\n  if (!ready) return null;\n\n  const isTop = config.position.startsWith('top');\n  const visible = config.visibleToasts;\n  const rendered = visible * 2;\n  const gap = config.gap || stackGap();\n  const expanded = config.expand || hoverExpanded;\n\n  const slice = toasts.slice(-rendered);\n  const n = slice.length;\n  const frontH = n ? heights[slice[n - 1].id] || 0 : 0;\n\n  return createPortal(\n    <ol\n      {...htmlProps}\n      className={cx('toast-viewport', paused && 'is-paused', htmlProps?.className)}\n      data-position={config.position}\n      style={\n        config.offset\n          ? ({ ...htmlProps?.style, '--toast-offset': `${config.offset}px` } as CSSProperties)\n          : htmlProps?.style\n      }\n      aria-label=\"Notifications\"\n      onPointerOver={(e: ReactPointerEvent<HTMLOListElement>) => {\n        if (e.pointerType !== 'touch') onHold();\n      }}\n      onPointerOut={(e: ReactPointerEvent<HTMLOListElement>) => {\n        if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget as Node)) onRelease(true);\n      }}\n      onFocus={onHold}\n      onBlur={(e: ReactFocusEvent<HTMLOListElement>) => {\n        if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget as Node)) onRelease(false);\n      }}\n    >\n      <Presence>\n        {slice.map((t, i) => {\n          const depth = n - 1 - i;\n          let offset = depth * gap;\n          if (expanded) {\n            offset = 0;\n            for (let j = i + 1; j < n; j++) offset += (heights[slice[j].id] || 0) + gap;\n          }\n          return (\n            <ToastItem\n              key={t.id}\n              t={t}\n              depth={expanded ? 0 : depth}\n              offset={offset}\n              hidden={!expanded && depth >= visible}\n              behind={!expanded && depth > 0}\n              frameHeight={!expanded && depth > 0 && frontH ? frontH : null}\n              isTop={isTop}\n              onHeight={onHeight}\n            />\n          );\n        })}\n      </Presence>\n    </ol>,\n    document.body,\n  );\n}\n\nfunction stripUndefined<T extends object>(o: T): Partial<T> {\n  const out: Partial<T> = {};\n  (Object.keys(o) as (keyof T)[]).forEach((k) => {\n    if (o[k] !== undefined) out[k] = o[k];\n  });\n  return out;\n}\n\nexport interface ToasterProps extends Partial<ToasterConfig> {\n  /** Standard <ol> attributes (className, style, data-*, ...) forwarded to the toast viewport. */\n  htmlProps?: HTMLAttributes<HTMLOListElement> & DataAttributes;\n}\n\nexport function Toaster({ htmlProps, ...props }: ToasterProps): ReactElement {\n  const config: ToasterConfig = { ...DEFAULT_TOASTER_CONFIG, ...stripUndefined(props) };\n\n  useEffect(() => {\n    store.config = config;\n    store.mounted = true;\n    if (config.expand) store.setExpanded(true);\n    return () => {\n      store.mounted = false;\n    };\n  }, [config.position, config.duration, config.visibleToasts, config.gap, config.offset, config.expand]);\n\n  return <ToastHost config={config} htmlProps={htmlProps} />;\n}\n\nexport { toast } from './toast-store';\n"]}

package/dist/toggle-tag.js

@@ -1,4 +1,4 @@
-'use client';import { IconSlot } from './chunk-2ERBBFZS.js';
+'use client';import { IconSlot } from './chunk-3MPF7FZV.js';
 import { useControllable } from './chunk-MMRIQNEN.js';
 import { cx } from './chunk-QGNC7LH5.js';
 import './tag.css';

package/dist/toggle-tag.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/primitives/tag/ToggleTag.tsx"],"names":[],"mappings":";;;;;;;AAuCA,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA0B;AAC1D,EAAA,uBACE,GAAA,CAAC,UAAK,SAAA,EAAU,qBAAA,EAAsB,aAAU,OAAA,EAAQ,WAAA,EAAW,WAAW,MAAA,GAAS,OAAA,EAAS,eAAY,MAAA,EAC1G,QAAA,kBAAA,GAAA,CAAC,UAAK,SAAA,EAAU,iBAAA,EACd,8BAAC,KAAA,EAAA,EAAI,OAAA,EAAQ,WAAA,EAAY,IAAA,EAAK,MAAA,EAC5B,QAAA,kBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,CAAA,EAAE,wBAAA;AAAA,MACF,UAAA,EAAW,GAAA;AAAA,MACX,WAAA,EAAY,KAAA;AAAA,MACZ,aAAA,EAAc,OAAA;AAAA,MACd,cAAA,EAAe;AAAA;AAAA,GACjB,EACF,GACF,CAAA,EACF,CAAA;AAEJ;AAEO,SAAS,SAAA,CAAU;AAAA,EACxB,QAAA;AAAA,EACA,QAAA,EAAU,YAAA;AAAA,EACV,eAAA,GAAkB,KAAA;AAAA,EAClB,QAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,KAAA,GAAQ,IAAA;AAAA,EACR,IAAA,GAAO,IAAA;AAAA,EACP,QAAA,GAAW,KAAA;AAAA,EACX,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA;AACF,CAAA,EAAmB;AACjB,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,IAAI,eAAA,CAAgB,YAAA,EAAc,iBAAiB,QAAQ,CAAA;AACvF,EAAA,MAAM,MAAA,GAAS,MAAM,WAAA,CAAY,CAAC,QAAQ,CAAA;AAE1C,EAAA,MAAM,MAAM,EAAA,CAAG,KAAA,EAAO,eAAe,IAAA,KAAS,IAAA,IAAQ,WAAW,SAAS,CAAA;AAE1E,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,GAAA;AAAA,MACX,KAAA;AAAA,MACA,cAAA,EAAc,QAAA;AAAA,MACd,QAAA;AAAA,MACA,OAAA,EAAS,MAAA;AAAA,MACR,GAAG,SAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,IAAA,mBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,WAAA,EACd,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAK,IAAA,EAAM,QAAA,EAAA,IAAA,EAAK,CAAA,EAC5B,CAAA,mBAEA,GAAA,CAAC,iBAAc,QAAA,EAAoB,CAAA;AAAA,wBAErC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,YAAA,EAAc,QAAA,EAAS,CAAA;AAAA,QACtC,SAAS,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,cAAc,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GACxD;AAEJ","file":"toggle-tag.js","sourcesContent":["'use client';\n\nimport './tag.css';\nimport '../collapse/collapse.css';\nimport type { ButtonHTMLAttributes, CSSProperties, ReactNode } from 'react';\nimport { IconSlot } from '../../internal/icon/IconSlot';\nimport { useControllable } from '../../internal/hooks/use-controllable';\nimport type { DataAttributes } from '../../../dom-props';\nimport { cx } from '../../internal/utils/cx';\n\ninterface ToggleTagOwnProps {\n  /** Chip content; the label shown beside the tick or `icon`. */\n  children: ReactNode;\n  /** Controlled selected value. Omit for uncontrolled. */\n  selected?: boolean;\n  /** Uncontrolled initial value. */\n  defaultSelected?: boolean;\n  /** Fires with the next value on every toggle. */\n  onChange?: (selected: boolean) => void;\n  /** Your own icon node; replaces the tick. Selected state reads from the wash. */\n  icon?: ReactNode | null;\n  /** Optional result count - rendered mono/tabular. */\n  count?: ReactNode;\n  /** 'md' = 28px (default) - 'sm' = 24px for dense rows. */\n  size?: 'md' | 'sm';\n  /** Disable the button, blocking toggles. @default false */\n  disabled?: boolean;\n  /** Extra class(es) merged onto the root element. */\n  className?: string;\n  /** Inline styles merged onto the root element. */\n  style?: CSSProperties;\n}\n\n/** ToggleTag - the on/off filter chip (<button aria-pressed>). */\nexport interface ToggleTagProps extends ToggleTagOwnProps {\n  /** Standard <button> attributes forwarded to the chip. */\n  htmlProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof ToggleTagOwnProps> & DataAttributes;\n}\n\nfunction ToggleTagTick({ selected }: { selected: boolean }) {\n  return (\n    <span className=\"tag__check collapse\" data-axis=\"width\" data-open={selected ? 'true' : 'false'} aria-hidden=\"true\">\n      <span className=\"collapse__inner\">\n        <svg viewBox=\"0 0 12 12\" fill=\"none\">\n          <path\n            d=\"M2.5 6.5 L5 9 L9.5 3.5\"\n            pathLength=\"1\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      </span>\n    </span>\n  );\n}\n\nexport function ToggleTag({\n  children,\n  selected: selectedProp,\n  defaultSelected = false,\n  onChange,\n  icon = null,\n  count = null,\n  size = 'md',\n  disabled = false,\n  className = '',\n  style,\n  htmlProps,\n}: ToggleTagProps) {\n  const [selected, setSelected] = useControllable(selectedProp, defaultSelected, onChange);\n  const toggle = () => setSelected(!selected);\n\n  const cls = cx('tag', 'tag--toggle', size === 'sm' && 'tag--sm', className);\n\n  return (\n    <button\n      type=\"button\"\n      className={cls}\n      style={style}\n      aria-pressed={selected}\n      disabled={disabled}\n      onClick={toggle}\n      {...htmlProps}\n    >\n      {icon ? (\n        <span className=\"tag__icon\">\n          <IconSlot size=\"sm\">{icon}</IconSlot>\n        </span>\n      ) : (\n        <ToggleTagTick selected={selected} />\n      )}\n      <span className=\"tag__label\">{children}</span>\n      {count != null && <span className=\"tag__count\">{count}</span>}\n    </button>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/primitives/tag/ToggleTag.tsx"],"names":[],"mappings":";;;;;;;AAyCA,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA0B;AAC1D,EAAA,uBACE,GAAA,CAAC,UAAK,SAAA,EAAU,qBAAA,EAAsB,aAAU,OAAA,EAAQ,WAAA,EAAW,WAAW,MAAA,GAAS,OAAA,EAAS,eAAY,MAAA,EAC1G,QAAA,kBAAA,GAAA,CAAC,UAAK,SAAA,EAAU,iBAAA,EACd,8BAAC,KAAA,EAAA,EAAI,OAAA,EAAQ,WAAA,EAAY,IAAA,EAAK,MAAA,EAC5B,QAAA,kBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,CAAA,EAAE,wBAAA;AAAA,MACF,UAAA,EAAW,GAAA;AAAA,MACX,WAAA,EAAY,KAAA;AAAA,MACZ,aAAA,EAAc,OAAA;AAAA,MACd,cAAA,EAAe;AAAA;AAAA,GACjB,EACF,GACF,CAAA,EACF,CAAA;AAEJ;AAEO,SAAS,SAAA,CAAU;AAAA,EACxB,QAAA;AAAA,EACA,QAAA,EAAU,YAAA;AAAA,EACV,eAAA,GAAkB,KAAA;AAAA,EAClB,QAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,KAAA,GAAQ,IAAA;AAAA,EACR,IAAA,GAAO,IAAA;AAAA,EACP,QAAA,GAAW,KAAA;AAAA,EACX,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA;AACF,CAAA,EAAmB;AACjB,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,IAAI,eAAA,CAAgB,YAAA,EAAc,iBAAiB,QAAQ,CAAA;AACvF,EAAA,MAAM,MAAA,GAAS,MAAM,WAAA,CAAY,CAAC,QAAQ,CAAA;AAE1C,EAAA,MAAM,MAAM,EAAA,CAAG,KAAA,EAAO,eAAe,IAAA,KAAS,IAAA,IAAQ,WAAW,SAAS,CAAA;AAE1E,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,GAAA;AAAA,MACX,KAAA;AAAA,MACA,cAAA,EAAc,QAAA;AAAA,MACd,QAAA;AAAA,MACA,OAAA,EAAS,MAAA;AAAA,MACR,GAAG,SAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,IAAA,mBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,WAAA,EACd,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAK,IAAA,EAAM,QAAA,EAAA,IAAA,EAAK,CAAA,EAC5B,CAAA,mBAEA,GAAA,CAAC,iBAAc,QAAA,EAAoB,CAAA;AAAA,wBAErC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,YAAA,EAAc,QAAA,EAAS,CAAA;AAAA,QACtC,SAAS,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,cAAc,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GACxD;AAEJ","file":"toggle-tag.js","sourcesContent":["'use client';\n\nimport './tag.css';\nimport '../collapse/collapse.css';\n\nimport type { ButtonHTMLAttributes, CSSProperties, ReactNode } from 'react';\n\nimport type { DataAttributes } from '../../../dom-props';\nimport { useControllable } from '../../internal/hooks/use-controllable';\nimport { IconSlot } from '../../internal/icon/IconSlot';\nimport { cx } from '../../internal/utils/cx';\n\ninterface ToggleTagOwnProps {\n  /** Chip content; the label shown beside the tick or `icon`. */\n  children: ReactNode;\n  /** Controlled selected value. Omit for uncontrolled. */\n  selected?: boolean;\n  /** Uncontrolled initial value. */\n  defaultSelected?: boolean;\n  /** Fires with the next value on every toggle. */\n  onChange?: (selected: boolean) => void;\n  /** Your own icon node; replaces the tick. Selected state reads from the wash. */\n  icon?: ReactNode | null;\n  /** Optional result count - rendered mono/tabular. */\n  count?: ReactNode;\n  /** 'md' = 28px (default) - 'sm' = 24px for dense rows. */\n  size?: 'md' | 'sm';\n  /** Disable the button, blocking toggles. @default false */\n  disabled?: boolean;\n  /** Extra class(es) merged onto the root element. */\n  className?: string;\n  /** Inline styles merged onto the root element. */\n  style?: CSSProperties;\n}\n\n/** ToggleTag - the on/off filter chip (<button aria-pressed>). */\nexport interface ToggleTagProps extends ToggleTagOwnProps {\n  /** Standard <button> attributes forwarded to the chip. */\n  htmlProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof ToggleTagOwnProps> & DataAttributes;\n}\n\nfunction ToggleTagTick({ selected }: { selected: boolean }) {\n  return (\n    <span className=\"tag__check collapse\" data-axis=\"width\" data-open={selected ? 'true' : 'false'} aria-hidden=\"true\">\n      <span className=\"collapse__inner\">\n        <svg viewBox=\"0 0 12 12\" fill=\"none\">\n          <path\n            d=\"M2.5 6.5 L5 9 L9.5 3.5\"\n            pathLength=\"1\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      </span>\n    </span>\n  );\n}\n\nexport function ToggleTag({\n  children,\n  selected: selectedProp,\n  defaultSelected = false,\n  onChange,\n  icon = null,\n  count = null,\n  size = 'md',\n  disabled = false,\n  className = '',\n  style,\n  htmlProps,\n}: ToggleTagProps) {\n  const [selected, setSelected] = useControllable(selectedProp, defaultSelected, onChange);\n  const toggle = () => setSelected(!selected);\n\n  const cls = cx('tag', 'tag--toggle', size === 'sm' && 'tag--sm', className);\n\n  return (\n    <button\n      type=\"button\"\n      className={cls}\n      style={style}\n      aria-pressed={selected}\n      disabled={disabled}\n      onClick={toggle}\n      {...htmlProps}\n    >\n      {icon ? (\n        <span className=\"tag__icon\">\n          <IconSlot size=\"sm\">{icon}</IconSlot>\n        </span>\n      ) : (\n        <ToggleTagTick selected={selected} />\n      )}\n      <span className=\"tag__label\">{children}</span>\n      {count != null && <span className=\"tag__count\">{count}</span>}\n    </button>\n  );\n}\n"]}

package/dist/toggle.css

@@ -1,152 +1,156 @@
-/* Toggle (switch) - immediate on/off; native input hidden, track + thumb painted, thumb travels on a CSS spring. */
+@layer zyncat.tokens, zyncat.components;
 
-.sw {
-  --sw-on-fill: linear-gradient(180deg, var(--accent), var(--accent-hover));
-  --sw-off-fill: var(--bg-muted);
-  --sw-on-border: var(--accent);
-  --sw-off-border: var(--border-strong);
-  --sw-ring: var(--ring-accent);
-  /* track size is the only input; thumb + travel derive from it */
-  --sw-w: var(--control-height);
-  --sw-h: var(--control-switch);
-  --sw-inset: calc(2 * var(--space-px));
-  /* inner track height minus both borders and the gap each side, so the inset is uniform on all edges */
-  --sw-thumb: calc(var(--sw-h) - 2 * var(--border-hairline) - 2 * var(--sw-inset));
-  /* colors read this flag; the thumb is moved by transform, not by it */
-  --on: 0;
+@layer zyncat.components {
+  /* Toggle (switch) - immediate on/off; native input hidden, track + thumb painted, thumb travels on a CSS spring. */
 
-  display: inline-flex;
-  align-items: flex-start;
-  gap: var(--space-3);
-  padding: var(--space-2);
-  border-radius: var(--radius-md);
-  cursor: pointer;
-  -webkit-tap-highlight-color: transparent;
-  transition: background-color var(--duration-fast) var(--ease-standard);
+  .sw {
+    --sw-on-fill: linear-gradient(180deg, var(--accent), var(--accent-hover));
+    --sw-off-fill: var(--bg-muted);
+    --sw-on-border: var(--accent);
+    --sw-off-border: var(--border-strong);
+    --sw-ring: var(--ring-accent);
+    /* track size is the only input; thumb + travel derive from it */
+    --sw-w: var(--control-height);
+    --sw-h: var(--control-switch);
+    --sw-inset: calc(2 * var(--space-px));
+    /* inner track height minus both borders and the gap each side, so the inset is uniform on all edges */
+    --sw-thumb: calc(var(--sw-h) - 2 * var(--border-hairline) - 2 * var(--sw-inset));
+    /* colors read this flag; the thumb is moved by transform, not by it */
+    --sw-checked: 0;
 
-  &:has(:checked) {
-    --on: 1;
-  }
+    display: inline-flex;
+    align-items: flex-start;
+    gap: var(--space-3);
+    padding: var(--space-2);
+    border-radius: var(--radius-md);
+    cursor: pointer;
+    -webkit-tap-highlight-color: transparent;
+    transition: background-color var(--duration-fast) var(--ease-standard);
 
-  &:not(.sw--disabled):hover {
-    background: var(--bg-muted);
-  }
-  &:not(.sw--disabled):hover:not(:has(:checked)) {
-    --sw-off-border: var(--text-subtle);
-  }
-  &:has(:focus-visible) .sw__track {
-    box-shadow: var(--sw-ring);
-  }
-}
-
-.sw__input {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  margin: 0;
-  padding: 0;
-  border: 0;
-  opacity: 0;
-  clip-path: inset(50%);
-  white-space: nowrap;
-  overflow: hidden;
-}
+    &:has(:checked) {
+      --sw-checked: 1;
+    }
 
-.sw__track {
-  position: relative;
-  flex: none;
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  padding: var(--sw-inset);
-  width: var(--sw-w);
-  height: var(--sw-h);
-  margin-top: calc((var(--leading-body) - var(--sw-h)) / 2);
-  border: var(--border-hairline) solid
-    color-mix(in oklab, var(--sw-on-border) calc(var(--on) * 100%), var(--sw-off-border));
-  border-radius: var(--radius-full);
-  background: var(--sw-off-fill);
-  transform: scale(1);
-  transition:
-    border-color var(--duration-base) var(--ease-standard),
-    background-color var(--duration-base) var(--ease-standard),
-    box-shadow var(--duration-fast) var(--ease-standard),
-    transform var(--duration-fast) var(--ease-spring);
+    &:not(.sw--disabled):hover {
+      background: var(--bg-muted);
+    }
+    &:not(.sw--disabled):hover:not(:has(:checked)) {
+      --sw-off-border: var(--text-subtle);
+    }
+    &:has(:focus-visible) .sw__track {
+      box-shadow: var(--sw-ring);
+    }
+  }
 
-  &::before {
-    content: '';
+  .sw__input {
     position: absolute;
-    inset: 0;
-    border-radius: inherit;
-    background: var(--sw-on-fill);
-    opacity: var(--on);
-    transition: opacity var(--duration-base) var(--ease-standard);
+    width: 1px;
+    height: 1px;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    opacity: 0;
+    clip-path: inset(50%);
+    white-space: nowrap;
+    overflow: hidden;
   }
-}
-/* --tx (travel) + --sx (press-stretch) compose one transform, so press and travel never fight over it */
-.sw__thumb {
-  --tx: 0px;
-  --sx: 1;
-  position: relative;
-  z-index: 1;
-  flex: none;
-  width: var(--sw-thumb);
-  height: var(--sw-thumb);
-  border-radius: var(--radius-full);
-  background: var(--bg-surface);
-  box-shadow: var(--shadow-sm);
-  transform: translateX(var(--tx)) scaleX(var(--sx));
-  transition: transform var(--duration-base) var(--ease-spring);
-}
-/* React-set [data-on] drives travel - no :has() twin to move the thumb out from under the spring and snap it */
-.sw__track[data-on='true'] .sw__thumb {
-  --tx: calc(var(--sw-w) - var(--sw-h));
-}
-.sw__track[data-pressed='true'] {
-  transform: scale(0.96);
-}
-.sw__track[data-pressed='true'] .sw__thumb {
-  --sx: 1.16;
-}
 
-.sw__text {
-  display: grid;
-  gap: var(--space-1);
-}
-.sw__label {
-  font: var(--type-label);
-  color: var(--text-strong);
-}
-.sw__desc {
-  font: var(--type-caption);
-  color: var(--text-muted);
-}
+  .sw__track {
+    position: relative;
+    flex: none;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    padding: var(--sw-inset);
+    width: var(--sw-w);
+    height: var(--sw-h);
+    margin-top: calc((var(--leading-body) - var(--sw-h)) / 2);
+    border: var(--border-hairline) solid
+      color-mix(in oklab, var(--sw-on-border) calc(var(--sw-checked) * 100%), var(--sw-off-border));
+    border-radius: var(--radius-full);
+    background: var(--sw-off-fill);
+    transform: scale(1);
+    transition:
+      border-color var(--duration-base) var(--ease-standard),
+      background-color var(--duration-base) var(--ease-standard),
+      box-shadow var(--duration-fast) var(--ease-standard),
+      transform var(--duration-fast) var(--ease-spring);
 
-.sw--sm {
-  --sw-w: var(--control-height-sm);
-  --sw-h: var(--space-4);
-  & .sw__label {
-    font: var(--type-caption);
-    font-weight: var(--weight-medium);
+    &::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      border-radius: inherit;
+      background: var(--sw-on-fill);
+      opacity: var(--sw-checked);
+      transition: opacity var(--duration-base) var(--ease-standard);
+    }
+  }
+  /* --sw-tx (travel) + --sw-sx (press-stretch) compose one transform, so press and travel never fight over it */
+  .sw__thumb {
+    --sw-tx: 0px;
+    --sw-sx: 1;
+    position: relative;
+    z-index: 1;
+    flex: none;
+    width: var(--sw-thumb);
+    height: var(--sw-thumb);
+    border-radius: var(--radius-full);
+    background: var(--bg-surface);
+    box-shadow: var(--shadow-sm);
+    transform: translateX(var(--sw-tx)) scaleX(var(--sw-sx));
+    transition: transform var(--duration-base) var(--ease-spring);
+  }
+  /* React-set [data-on] drives travel - no :has() twin to move the thumb out from under the spring and snap it */
+  .sw__track[data-on='true'] .sw__thumb {
+    --sw-tx: calc(var(--sw-w) - var(--sw-h));
+  }
+  .sw__track[data-pressed='true'] {
+    transform: scale(0.96);
+  }
+  .sw__track[data-pressed='true'] .sw__thumb {
+    --sw-sx: 1.16;
+  }
+
+  .sw__text {
+    display: grid;
+    gap: var(--space-1);
+  }
+  .sw__label {
+    font: var(--type-label);
     color: var(--text-strong);
   }
-  & .sw__track {
-    margin-top: calc((var(--leading-caption) - var(--sw-h)) / 2);
+  .sw__desc {
+    font: var(--type-caption);
+    color: var(--text-muted);
   }
-}
 
-/* disabled leaves the flag untouched, so the thumb keeps its correct position */
-.sw--disabled {
-  cursor: not-allowed;
-  --sw-on-fill: var(--accent-disabled);
-  --sw-off-fill: var(--bg-muted);
-  --sw-on-border: var(--accent-disabled);
-  --sw-off-border: var(--border-default);
-  & .sw__thumb {
-    box-shadow: var(--shadow-xs);
+  .sw--sm {
+    --sw-w: var(--control-height-sm);
+    --sw-h: var(--space-4);
+    & .sw__label {
+      font: var(--type-caption);
+      font-weight: var(--weight-medium);
+      color: var(--text-strong);
+    }
+    & .sw__track {
+      margin-top: calc((var(--leading-caption) - var(--sw-h)) / 2);
+    }
   }
-  & .sw__label,
-  & .sw__desc {
-    color: var(--text-disabled);
+
+  /* disabled leaves the flag untouched, so the thumb keeps its correct position */
+  .sw--disabled {
+    cursor: not-allowed;
+    --sw-on-fill: var(--accent-disabled);
+    --sw-off-fill: var(--bg-muted);
+    --sw-on-border: var(--accent-disabled);
+    --sw-off-border: var(--border-default);
+    & .sw__thumb {
+      box-shadow: var(--shadow-xs);
+    }
+    & .sw__label,
+    & .sw__desc {
+      color: var(--text-disabled);
+    }
   }
 }