@cerberus-design/react 0.23.0 → 0.24.0

package/dist/node_modules/.pnpm/@zag-js_presence@1.29.1/node_modules/@zag-js/presence/dist/index.cjs

@@ -0,0 +1,196 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const index = require('../../../../../@zag-js_core@1.29.1/node_modules/@zag-js/core/dist/index.cjs');
+const index$1 = require('../../../../../@zag-js_dom-query@1.29.1/node_modules/@zag-js/dom-query/dist/index.cjs');
+const index$2 = require('../../../../../@zag-js_types@1.29.1/node_modules/@zag-js/types/dist/index.cjs');
+
+// src/presence.connect.ts
+function connect(service, _normalize) {
+  const { state, send, context } = service;
+  const present = state.matches("mounted", "unmountSuspended");
+  return {
+    skip: !context.get("initial"),
+    present,
+    setNode(node) {
+      if (!node) return;
+      send({ type: "NODE.SET", node });
+    },
+    unmount() {
+      send({ type: "UNMOUNT" });
+    }
+  };
+}
+var machine = index.createMachine({
+  props({ props: props2 }) {
+    return { ...props2, present: !!props2.present };
+  },
+  initialState({ prop }) {
+    return prop("present") ? "mounted" : "unmounted";
+  },
+  refs() {
+    return {
+      node: null,
+      styles: null
+    };
+  },
+  context({ bindable }) {
+    return {
+      unmountAnimationName: bindable(() => ({ defaultValue: null })),
+      prevAnimationName: bindable(() => ({ defaultValue: null })),
+      present: bindable(() => ({ defaultValue: false })),
+      initial: bindable(() => ({
+        sync: true,
+        defaultValue: false
+      }))
+    };
+  },
+  exit: ["clearInitial", "cleanupNode"],
+  watch({ track, prop, send }) {
+    track([() => prop("present")], () => {
+      send({ type: "PRESENCE.CHANGED" });
+    });
+  },
+  on: {
+    "NODE.SET": {
+      actions: ["setupNode"]
+    },
+    "PRESENCE.CHANGED": {
+      actions: ["setInitial", "syncPresence"]
+    }
+  },
+  states: {
+    mounted: {
+      on: {
+        UNMOUNT: {
+          target: "unmounted",
+          actions: ["clearPrevAnimationName", "invokeOnExitComplete"]
+        },
+        "UNMOUNT.SUSPEND": {
+          target: "unmountSuspended"
+        }
+      }
+    },
+    unmountSuspended: {
+      effects: ["trackAnimationEvents"],
+      on: {
+        MOUNT: {
+          target: "mounted",
+          actions: ["setPrevAnimationName"]
+        },
+        UNMOUNT: {
+          target: "unmounted",
+          actions: ["clearPrevAnimationName", "invokeOnExitComplete"]
+        }
+      }
+    },
+    unmounted: {
+      on: {
+        MOUNT: {
+          target: "mounted",
+          actions: ["setPrevAnimationName"]
+        }
+      }
+    }
+  },
+  implementations: {
+    actions: {
+      setInitial: ({ context }) => {
+        if (context.get("initial")) return;
+        queueMicrotask(() => {
+          context.set("initial", true);
+        });
+      },
+      clearInitial: ({ context }) => {
+        context.set("initial", false);
+      },
+      invokeOnExitComplete: ({ prop, refs }) => {
+        prop("onExitComplete")?.();
+        const node = refs.get("node");
+        if (!node) return;
+        const win = index$1.getWindow(node);
+        const event = new win.CustomEvent("exitcomplete", { bubbles: false });
+        node.dispatchEvent(event);
+      },
+      setupNode: ({ refs, event }) => {
+        if (refs.get("node") === event.node) return;
+        refs.set("node", event.node);
+        refs.set("styles", index$1.getComputedStyle(event.node));
+      },
+      cleanupNode: ({ refs }) => {
+        refs.set("node", null);
+        refs.set("styles", null);
+      },
+      syncPresence: ({ context, refs, send, prop }) => {
+        const presentProp = prop("present");
+        if (presentProp) {
+          return send({ type: "MOUNT", src: "presence.changed" });
+        }
+        const node = refs.get("node");
+        if (!presentProp && node?.ownerDocument.visibilityState === "hidden") {
+          return send({ type: "UNMOUNT", src: "visibilitychange" });
+        }
+        index$1.raf(() => {
+          const animationName = getAnimationName(refs.get("styles"));
+          context.set("unmountAnimationName", animationName);
+          if (animationName === "none" || animationName === context.get("prevAnimationName") || refs.get("styles")?.display === "none" || refs.get("styles")?.animationDuration === "0s") {
+            send({ type: "UNMOUNT", src: "presence.changed" });
+          } else {
+            send({ type: "UNMOUNT.SUSPEND" });
+          }
+        });
+      },
+      setPrevAnimationName: ({ context, refs }) => {
+        index$1.raf(() => {
+          context.set("prevAnimationName", getAnimationName(refs.get("styles")));
+        });
+      },
+      clearPrevAnimationName: ({ context }) => {
+        context.set("prevAnimationName", null);
+      }
+    },
+    effects: {
+      trackAnimationEvents: ({ context, refs, send, prop }) => {
+        const node = refs.get("node");
+        if (!node) return;
+        const onStart = (event) => {
+          const target = event.composedPath?.()?.[0] ?? event.target;
+          if (target === node) {
+            context.set("prevAnimationName", getAnimationName(refs.get("styles")));
+          }
+        };
+        const onEnd = (event) => {
+          const animationName = getAnimationName(refs.get("styles"));
+          const target = index$1.getEventTarget(event);
+          if (target === node && animationName === context.get("unmountAnimationName") && !prop("present")) {
+            send({ type: "UNMOUNT", src: "animationend" });
+          }
+        };
+        const onCancel = (event) => {
+          const target = index$1.getEventTarget(event);
+          if (target === node && !prop("present")) {
+            send({ type: "UNMOUNT", src: "animationcancel" });
+          }
+        };
+        node.addEventListener("animationstart", onStart);
+        node.addEventListener("animationcancel", onCancel);
+        node.addEventListener("animationend", onEnd);
+        const cleanupStyles = index$1.setStyle(node, { animationFillMode: "forwards" });
+        return () => {
+          node.removeEventListener("animationstart", onStart);
+          node.removeEventListener("animationcancel", onCancel);
+          node.removeEventListener("animationend", onEnd);
+          index$1.nextTick(() => cleanupStyles());
+        };
+      }
+    }
+  }
+});
+function getAnimationName(styles) {
+  return styles?.animationName || "none";
+}
+index$2.createProps()(["onExitComplete", "present", "immediate"]);
+
+exports.connect = connect;
+exports.machine = machine;

package/dist/node_modules/.pnpm/@zag-js_presence@1.29.1/node_modules/@zag-js/presence/dist/index.js

@@ -0,0 +1,191 @@
+import { createMachine } from '../../../../../@zag-js_core@1.29.1/node_modules/@zag-js/core/dist/index.js';
+import { setStyle, nextTick, raf, getComputedStyle, getWindow, getEventTarget } from '../../../../../@zag-js_dom-query@1.29.1/node_modules/@zag-js/dom-query/dist/index.js';
+import { createProps } from '../../../../../@zag-js_types@1.29.1/node_modules/@zag-js/types/dist/index.js';
+
+// src/presence.connect.ts
+function connect(service, _normalize) {
+  const { state, send, context } = service;
+  const present = state.matches("mounted", "unmountSuspended");
+  return {
+    skip: !context.get("initial"),
+    present,
+    setNode(node) {
+      if (!node) return;
+      send({ type: "NODE.SET", node });
+    },
+    unmount() {
+      send({ type: "UNMOUNT" });
+    }
+  };
+}
+var machine = createMachine({
+  props({ props: props2 }) {
+    return { ...props2, present: !!props2.present };
+  },
+  initialState({ prop }) {
+    return prop("present") ? "mounted" : "unmounted";
+  },
+  refs() {
+    return {
+      node: null,
+      styles: null
+    };
+  },
+  context({ bindable }) {
+    return {
+      unmountAnimationName: bindable(() => ({ defaultValue: null })),
+      prevAnimationName: bindable(() => ({ defaultValue: null })),
+      present: bindable(() => ({ defaultValue: false })),
+      initial: bindable(() => ({
+        sync: true,
+        defaultValue: false
+      }))
+    };
+  },
+  exit: ["clearInitial", "cleanupNode"],
+  watch({ track, prop, send }) {
+    track([() => prop("present")], () => {
+      send({ type: "PRESENCE.CHANGED" });
+    });
+  },
+  on: {
+    "NODE.SET": {
+      actions: ["setupNode"]
+    },
+    "PRESENCE.CHANGED": {
+      actions: ["setInitial", "syncPresence"]
+    }
+  },
+  states: {
+    mounted: {
+      on: {
+        UNMOUNT: {
+          target: "unmounted",
+          actions: ["clearPrevAnimationName", "invokeOnExitComplete"]
+        },
+        "UNMOUNT.SUSPEND": {
+          target: "unmountSuspended"
+        }
+      }
+    },
+    unmountSuspended: {
+      effects: ["trackAnimationEvents"],
+      on: {
+        MOUNT: {
+          target: "mounted",
+          actions: ["setPrevAnimationName"]
+        },
+        UNMOUNT: {
+          target: "unmounted",
+          actions: ["clearPrevAnimationName", "invokeOnExitComplete"]
+        }
+      }
+    },
+    unmounted: {
+      on: {
+        MOUNT: {
+          target: "mounted",
+          actions: ["setPrevAnimationName"]
+        }
+      }
+    }
+  },
+  implementations: {
+    actions: {
+      setInitial: ({ context }) => {
+        if (context.get("initial")) return;
+        queueMicrotask(() => {
+          context.set("initial", true);
+        });
+      },
+      clearInitial: ({ context }) => {
+        context.set("initial", false);
+      },
+      invokeOnExitComplete: ({ prop, refs }) => {
+        prop("onExitComplete")?.();
+        const node = refs.get("node");
+        if (!node) return;
+        const win = getWindow(node);
+        const event = new win.CustomEvent("exitcomplete", { bubbles: false });
+        node.dispatchEvent(event);
+      },
+      setupNode: ({ refs, event }) => {
+        if (refs.get("node") === event.node) return;
+        refs.set("node", event.node);
+        refs.set("styles", getComputedStyle(event.node));
+      },
+      cleanupNode: ({ refs }) => {
+        refs.set("node", null);
+        refs.set("styles", null);
+      },
+      syncPresence: ({ context, refs, send, prop }) => {
+        const presentProp = prop("present");
+        if (presentProp) {
+          return send({ type: "MOUNT", src: "presence.changed" });
+        }
+        const node = refs.get("node");
+        if (!presentProp && node?.ownerDocument.visibilityState === "hidden") {
+          return send({ type: "UNMOUNT", src: "visibilitychange" });
+        }
+        raf(() => {
+          const animationName = getAnimationName(refs.get("styles"));
+          context.set("unmountAnimationName", animationName);
+          if (animationName === "none" || animationName === context.get("prevAnimationName") || refs.get("styles")?.display === "none" || refs.get("styles")?.animationDuration === "0s") {
+            send({ type: "UNMOUNT", src: "presence.changed" });
+          } else {
+            send({ type: "UNMOUNT.SUSPEND" });
+          }
+        });
+      },
+      setPrevAnimationName: ({ context, refs }) => {
+        raf(() => {
+          context.set("prevAnimationName", getAnimationName(refs.get("styles")));
+        });
+      },
+      clearPrevAnimationName: ({ context }) => {
+        context.set("prevAnimationName", null);
+      }
+    },
+    effects: {
+      trackAnimationEvents: ({ context, refs, send, prop }) => {
+        const node = refs.get("node");
+        if (!node) return;
+        const onStart = (event) => {
+          const target = event.composedPath?.()?.[0] ?? event.target;
+          if (target === node) {
+            context.set("prevAnimationName", getAnimationName(refs.get("styles")));
+          }
+        };
+        const onEnd = (event) => {
+          const animationName = getAnimationName(refs.get("styles"));
+          const target = getEventTarget(event);
+          if (target === node && animationName === context.get("unmountAnimationName") && !prop("present")) {
+            send({ type: "UNMOUNT", src: "animationend" });
+          }
+        };
+        const onCancel = (event) => {
+          const target = getEventTarget(event);
+          if (target === node && !prop("present")) {
+            send({ type: "UNMOUNT", src: "animationcancel" });
+          }
+        };
+        node.addEventListener("animationstart", onStart);
+        node.addEventListener("animationcancel", onCancel);
+        node.addEventListener("animationend", onEnd);
+        const cleanupStyles = setStyle(node, { animationFillMode: "forwards" });
+        return () => {
+          node.removeEventListener("animationstart", onStart);
+          node.removeEventListener("animationcancel", onCancel);
+          node.removeEventListener("animationend", onEnd);
+          nextTick(() => cleanupStyles());
+        };
+      }
+    }
+  }
+});
+function getAnimationName(styles) {
+  return styles?.animationName || "none";
+}
+createProps()(["onExitComplete", "present", "immediate"]);
+
+export { connect, machine };

package/dist/node_modules/.pnpm/@zag-js_progress@1.29.1/node_modules/@zag-js/progress/dist/index.cjs

@@ -0,0 +1,304 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const index$2 = require('../../../../../@zag-js_anatomy@1.29.1/node_modules/@zag-js/anatomy/dist/index.cjs');
+const index = require('../../../../../@zag-js_core@1.29.1/node_modules/@zag-js/core/dist/index.cjs');
+const index$1 = require('../../../../../@zag-js_utils@1.29.1/node_modules/@zag-js/utils/dist/index.cjs');
+const index$3 = require('../../../../../@zag-js_types@1.29.1/node_modules/@zag-js/types/dist/index.cjs');
+
+// src/progress.anatomy.ts
+var anatomy = index$2.createAnatomy("progress").parts(
+  "root",
+  "label",
+  "track",
+  "range",
+  "valueText",
+  "view",
+  "circle",
+  "circleTrack",
+  "circleRange"
+);
+var parts = anatomy.build();
+
+// src/progress.dom.ts
+var getRootId = (ctx) => ctx.ids?.root ?? `progress-${ctx.id}`;
+var getTrackId = (ctx) => ctx.ids?.track ?? `progress-${ctx.id}-track`;
+var getLabelId = (ctx) => ctx.ids?.label ?? `progress-${ctx.id}-label`;
+var getCircleId = (ctx) => ctx.ids?.circle ?? `progress-${ctx.id}-circle`;
+
+// src/progress.connect.ts
+function connect(service, normalize) {
+  const { context, computed, prop, send, scope } = service;
+  const percent = computed("percent");
+  const percentAsString = computed("isIndeterminate") ? "" : computed("formatter").format(percent / 100);
+  const max = prop("max");
+  const min = prop("min");
+  const orientation = prop("orientation");
+  const translations = prop("translations");
+  const indeterminate = computed("isIndeterminate");
+  const value = context.get("value");
+  const valueAsString = translations?.value({ value, max, percent, min, formatter: computed("formatter") }) ?? "";
+  const progressState = getProgressState(value, max);
+  const progressbarProps = {
+    role: "progressbar",
+    "aria-label": valueAsString,
+    "data-max": max,
+    "aria-valuemin": min,
+    "aria-valuemax": max,
+    "aria-valuenow": value ?? void 0,
+    "data-orientation": orientation,
+    "data-state": progressState
+  };
+  const circleProps2 = getCircleProps(service);
+  return {
+    value,
+    valueAsString,
+    min,
+    max,
+    percent,
+    percentAsString,
+    indeterminate,
+    setValue(value2) {
+      send({ type: "VALUE.SET", value: value2 });
+    },
+    setToMax() {
+      send({ type: "VALUE.SET", value: max });
+    },
+    setToMin() {
+      send({ type: "VALUE.SET", value: min });
+    },
+    getRootProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        ...parts.root.attrs,
+        id: getRootId(scope),
+        "data-max": max,
+        "data-value": value ?? void 0,
+        "data-state": progressState,
+        "data-orientation": orientation,
+        style: {
+          "--percent": indeterminate ? void 0 : percent
+        }
+      });
+    },
+    getLabelProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        id: getLabelId(scope),
+        ...parts.label.attrs,
+        "data-orientation": orientation
+      });
+    },
+    getValueTextProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        "aria-live": "polite",
+        ...parts.valueText.attrs
+      });
+    },
+    getTrackProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        id: getTrackId(scope),
+        ...parts.track.attrs,
+        ...progressbarProps
+      });
+    },
+    getRangeProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        ...parts.range.attrs,
+        "data-orientation": orientation,
+        "data-state": progressState,
+        style: {
+          [computed("isHorizontal") ? "width" : "height"]: indeterminate ? void 0 : `${percent}%`
+        }
+      });
+    },
+    getCircleProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        id: getCircleId(scope),
+        ...parts.circle.attrs,
+        ...progressbarProps,
+        ...circleProps2.root
+      });
+    },
+    getCircleTrackProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        "data-orientation": orientation,
+        ...parts.circleTrack.attrs,
+        ...circleProps2.track
+      });
+    },
+    getCircleRangeProps() {
+      return normalize.element({
+        dir: prop("dir"),
+        ...parts.circleRange.attrs,
+        ...circleProps2.range,
+        "data-state": progressState
+      });
+    },
+    getViewProps(props2) {
+      return normalize.element({
+        dir: prop("dir"),
+        ...parts.view.attrs,
+        "data-state": props2.state,
+        hidden: props2.state !== progressState
+      });
+    }
+  };
+}
+function getProgressState(value, maxValue) {
+  return value == null ? "indeterminate" : value === maxValue ? "complete" : "loading";
+}
+var circleProps = {
+  style: {
+    "--radius": "calc(var(--size) / 2 - var(--thickness) / 2)",
+    cx: "calc(var(--size) / 2)",
+    cy: "calc(var(--size) / 2)",
+    r: "var(--radius)",
+    fill: "transparent",
+    strokeWidth: "var(--thickness)"
+  }
+};
+var rootProps = {
+  style: {
+    width: "var(--size)",
+    height: "var(--size)"
+  }
+};
+function getCircleProps(service) {
+  const { context, computed } = service;
+  return {
+    root: rootProps,
+    track: circleProps,
+    range: {
+      opacity: context.get("value") === 0 ? 0 : void 0,
+      style: {
+        ...circleProps.style,
+        "--percent": computed("percent"),
+        "--circumference": `calc(2 * 3.14159 * var(--radius))`,
+        "--offset": `calc(var(--circumference) * (100 - var(--percent)) / 100)`,
+        strokeDashoffset: `calc(var(--circumference) * ((100 - var(--percent)) / 100))`,
+        strokeDasharray: computed("isIndeterminate") ? void 0 : `var(--circumference)`,
+        transformOrigin: "center",
+        transform: "rotate(-90deg)"
+      }
+    }
+  };
+}
+var machine = index.createMachine({
+  props({ props: props2 }) {
+    const min = props2.min ?? 0;
+    const max = props2.max ?? 100;
+    return {
+      orientation: "horizontal",
+      ...props2,
+      max,
+      min,
+      defaultValue: props2.defaultValue !== void 0 ? props2.defaultValue : midValue(min, max),
+      formatOptions: {
+        style: "percent",
+        ...props2.formatOptions
+      },
+      translations: {
+        value: ({ value, percent, formatter }) => {
+          if (value === null) return "loading...";
+          if (formatter) {
+            const formatOptions = formatter.resolvedOptions();
+            const num = formatOptions.style === "percent" ? percent / 100 : value;
+            return formatter.format(num);
+          }
+          return value.toString();
+        },
+        ...props2.translations
+      }
+    };
+  },
+  initialState() {
+    return "idle";
+  },
+  entry: ["validateContext"],
+  context({ bindable, prop }) {
+    return {
+      value: bindable(() => ({
+        defaultValue: prop("defaultValue"),
+        value: prop("value"),
+        onChange(value) {
+          prop("onValueChange")?.({ value });
+        }
+      }))
+    };
+  },
+  computed: {
+    isIndeterminate: ({ context }) => context.get("value") === null,
+    percent({ context, prop }) {
+      const value = context.get("value");
+      if (!index$1.isNumber(value)) return -1;
+      return index$1.getValuePercent(value, prop("min"), prop("max")) * 100;
+    },
+    formatter: index.memo(
+      ({ prop }) => [prop("locale"), prop("formatOptions")],
+      ([locale, formatOptions]) => new Intl.NumberFormat(locale, formatOptions)
+    ),
+    isHorizontal: ({ prop }) => prop("orientation") === "horizontal"
+  },
+  states: {
+    idle: {
+      on: {
+        "VALUE.SET": {
+          actions: ["setValue"]
+        }
+      }
+    }
+  },
+  implementations: {
+    actions: {
+      setValue: ({ context, event, prop }) => {
+        const value = event.value === null ? null : Math.max(0, Math.min(event.value, prop("max")));
+        context.set("value", value);
+      },
+      validateContext: ({ context, prop }) => {
+        const max = prop("max");
+        const min = prop("min");
+        const value = context.get("value");
+        if (value == null) return;
+        if (!isValidNumber(max)) {
+          throw new Error(`[progress] The max value passed \`${max}\` is not a valid number`);
+        }
+        if (!isValidMax(value, max)) {
+          throw new Error(`[progress] The value passed \`${value}\` exceeds the max value \`${max}\``);
+        }
+        if (!isValidMin(value, min)) {
+          throw new Error(`[progress] The value passed \`${value}\` exceeds the min value \`${min}\``);
+        }
+      }
+    }
+  }
+});
+var isValidNumber = (max) => index$1.isNumber(max) && !isNaN(max);
+var isValidMax = (value, max) => isValidNumber(value) && value <= max;
+var isValidMin = (value, min) => isValidNumber(value) && value >= min;
+var midValue = (min, max) => min + (max - min) / 2;
+index$3.createProps()([
+  "dir",
+  "getRootNode",
+  "id",
+  "ids",
+  "max",
+  "min",
+  "orientation",
+  "translations",
+  "value",
+  "onValueChange",
+  "defaultValue",
+  "formatOptions",
+  "locale"
+]);
+
+exports.anatomy = anatomy;
+exports.connect = connect;
+exports.machine = machine;