@enigmax/primitives 0.17.0 → 0.19.0

package/dist/chunk-UOSSNUSC.js

@@ -0,0 +1,309 @@
+// src/core/marquee.ts
+var DEFAULT_DECAY = 0.12;
+var DRAG_THRESHOLD = 6;
+var STILL_MS = 90;
+var MAX_DT = 0.05;
+var VELOCITY_SMOOTHING = 0.6;
+var TOUCH_HOVER_SUPPRESS_MS = 1e3;
+var IDLE_EPSILON = 0.01;
+var DEFAULTS = {
+  speed: 60,
+  reverse: false,
+  vertical: false,
+  draggable: true,
+  hover: "off",
+  decay: DEFAULT_DECAY,
+  manageStyles: true,
+  copies: "clone"
+};
+var MAX_COPIES = 24;
+function createMarquee(lane, track, options = {}) {
+  let opts = { ...DEFAULTS, ...options };
+  let period = 0;
+  let copyCount = Math.max(2, track.children.length);
+  let offset = 0;
+  let velocity = 0;
+  let running = false;
+  let paused = false;
+  let destroyed = false;
+  let frame = 0;
+  let lastTime = 0;
+  let dragging = false;
+  let pointerId = null;
+  let lastPointer = 0;
+  let startPointer = 0;
+  let lastMoveTime = 0;
+  let maxTravel = 0;
+  let hovering = false;
+  let lastTouchAt = 0;
+  const motionQuery = typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)") : null;
+  let reducedMotion = motionQuery?.matches ?? false;
+  function hoverTarget(cruise) {
+    const hover = opts.hover ?? "off";
+    if (hover === "off") return cruise;
+    if (hover === "pause") return 0;
+    if (typeof hover === "number") return cruise * hover;
+    return (cruise < 0 ? -1 : 1) * Math.abs(hover.speed);
+  }
+  function target() {
+    if (reducedMotion || paused) return 0;
+    const cruise = opts.reverse ? -opts.speed : opts.speed;
+    return hovering ? hoverTarget(cruise) : cruise;
+  }
+  function axisSize(element) {
+    return opts.vertical ? element.offsetHeight : element.offsetWidth;
+  }
+  function axisStart(element) {
+    return opts.vertical ? element.offsetTop : element.offsetLeft;
+  }
+  function applyStyles() {
+    if (!opts.manageStyles) return;
+    lane.style.overflow = "hidden";
+    lane.style.touchAction = opts.vertical ? "pan-x" : "pan-y";
+    lane.style.userSelect = "none";
+    lane.style.webkitUserSelect = "none";
+    track.style.willChange = "transform";
+  }
+  function render() {
+    const x = opts.vertical ? 0 : -offset;
+    const y = opts.vertical ? -offset : 0;
+    track.style.transform = `translate3d(${x}px, ${y}px, 0)`;
+  }
+  function readPeriod() {
+    const first = track.children[0];
+    const second = track.children[1];
+    if (!first) return 0;
+    if (second) {
+      const step = axisStart(second) - axisStart(first);
+      if (step > 0) return step;
+    }
+    return axisSize(first);
+  }
+  function requiredCopies(measured) {
+    if (measured <= 0) return 2;
+    return Math.min(MAX_COPIES, Math.max(2, Math.ceil(axisSize(lane) / measured) + 1));
+  }
+  function syncClones(count) {
+    const source = track.children[0];
+    if (!source) return;
+    while (track.children.length > count) track.removeChild(track.lastElementChild);
+    while (track.children.length < count) {
+      const clone = source.cloneNode(true);
+      clone.setAttribute("aria-hidden", "true");
+      clone.dataset.enigmaMarqueeCopy = String(track.children.length);
+      track.appendChild(clone);
+    }
+  }
+  function measure() {
+    if (destroyed) return;
+    const cloning = opts.copies === "clone";
+    if (cloning && track.children.length < 2) syncClones(2);
+    let measured = readPeriod();
+    let needed = requiredCopies(measured);
+    if (cloning && track.children.length !== needed) {
+      syncClones(needed);
+      measured = readPeriod();
+      needed = requiredCopies(measured);
+    }
+    const changed = measured !== period || needed !== copyCount;
+    period = measured;
+    if (needed !== copyCount) {
+      copyCount = needed;
+      opts.onCopyCountChange?.(needed);
+    }
+    if (period > 0) offset = wrap(offset);
+    render();
+    if (changed) opts.onMeasure?.(period, copyCount);
+    start();
+  }
+  function wrap(value) {
+    if (period <= 0) return value;
+    return (value % period + period) % period;
+  }
+  function tick(now) {
+    frame = 0;
+    if (destroyed) return;
+    const dt = Math.min((now - lastTime) / 1e3, MAX_DT);
+    lastTime = now;
+    if (!dragging) {
+      velocity += (target() - velocity) * (1 - Math.pow(opts.decay, dt));
+      offset = wrap(offset + velocity * dt);
+    }
+    render();
+    const idle = !dragging && Math.abs(velocity) < IDLE_EPSILON && Math.abs(target()) < IDLE_EPSILON;
+    if (idle) {
+      velocity = 0;
+      running = false;
+      return;
+    }
+    frame = requestAnimationFrame(tick);
+  }
+  function start() {
+    if (destroyed || running) return;
+    running = true;
+    lastTime = performance.now();
+    frame = requestAnimationFrame(tick);
+  }
+  function pointerDelta(event) {
+    return opts.vertical ? event.clientY : event.clientX;
+  }
+  function onPointerDown(event) {
+    if (event.pointerType !== "mouse") noteTouch();
+    if (!opts.draggable || event.button > 0 || pointerId !== null) return;
+    pointerId = event.pointerId;
+    dragging = true;
+    lastPointer = pointerDelta(event);
+    startPointer = lastPointer;
+    lastMoveTime = event.timeStamp;
+    maxTravel = 0;
+    lane.dataset.dragging = "true";
+    window.addEventListener("pointermove", onPointerMove);
+    window.addEventListener("pointerup", onPointerUp);
+    window.addEventListener("pointercancel", onPointerUp);
+    start();
+  }
+  function onPointerMove(event) {
+    if (event.pointerId !== pointerId) return;
+    const position = pointerDelta(event);
+    const delta = position - lastPointer;
+    lastPointer = position;
+    const dt = Math.max((event.timeStamp - lastMoveTime) / 1e3, 1e-3);
+    lastMoveTime = event.timeStamp;
+    maxTravel = Math.max(maxTravel, Math.abs(position - startPointer));
+    offset = wrap(offset - delta);
+    const instant = -delta / dt;
+    velocity = velocity * VELOCITY_SMOOTHING + instant * (1 - VELOCITY_SMOOTHING);
+  }
+  function onPointerUp(event) {
+    if (event.pointerId !== pointerId) return;
+    pointerId = null;
+    dragging = false;
+    delete lane.dataset.dragging;
+    window.removeEventListener("pointermove", onPointerMove);
+    window.removeEventListener("pointerup", onPointerUp);
+    window.removeEventListener("pointercancel", onPointerUp);
+    if (event.timeStamp - lastMoveTime > STILL_MS) velocity = 0;
+    start();
+  }
+  function onClickCapture(event) {
+    if (maxTravel <= DRAG_THRESHOLD) return;
+    event.preventDefault();
+    event.stopPropagation();
+  }
+  function onClick(event) {
+    if (maxTravel > DRAG_THRESHOLD) return;
+    opts.onItemClick?.(event);
+  }
+  function onPointerEnter(event) {
+    if (event.pointerType !== "mouse") {
+      noteTouch();
+      return;
+    }
+    if (Date.now() - lastTouchAt < TOUCH_HOVER_SUPPRESS_MS) return;
+    hovering = true;
+    lane.dataset.hovering = "true";
+    start();
+  }
+  function onPointerLeave() {
+    hovering = false;
+    delete lane.dataset.hovering;
+    start();
+  }
+  function noteTouch() {
+    lastTouchAt = Date.now();
+    if (!hovering) return;
+    hovering = false;
+    delete lane.dataset.hovering;
+    start();
+  }
+  function onMotionChange(event) {
+    reducedMotion = event.matches;
+    lane.dataset.reducedMotion = String(reducedMotion);
+    start();
+  }
+  const resizeObserver = typeof ResizeObserver === "function" ? new ResizeObserver(() => measure()) : null;
+  function init() {
+    applyStyles();
+    lane.dataset.enigmaMarquee = "";
+    lane.dataset.reducedMotion = String(reducedMotion);
+    track.dataset.enigmaMarqueeTrack = "";
+    for (const child of Array.from(track.children)) {
+      child.dataset.enigmaMarqueeCopy ??= "0";
+    }
+    lane.addEventListener("pointerdown", onPointerDown);
+    lane.addEventListener("pointerenter", onPointerEnter);
+    lane.addEventListener("pointerleave", onPointerLeave);
+    lane.addEventListener("touchstart", noteTouch, { passive: true });
+    lane.addEventListener("click", onClickCapture, true);
+    lane.addEventListener("click", onClick);
+    motionQuery?.addEventListener("change", onMotionChange);
+    resizeObserver?.observe(lane);
+    const first = track.children[0];
+    if (first) resizeObserver?.observe(first);
+    measure();
+    void document.fonts?.ready.then(() => measure());
+    remeasureOnImageLoad();
+  }
+  function remeasureOnImageLoad() {
+    for (const image of track.querySelectorAll("img")) {
+      if (image.complete) continue;
+      const done = () => {
+        image.removeEventListener("load", done);
+        image.removeEventListener("error", done);
+        if (!destroyed) measure();
+      };
+      image.addEventListener("load", done);
+      image.addEventListener("error", done);
+    }
+  }
+  init();
+  return {
+    get offset() {
+      return offset;
+    },
+    get period() {
+      return period;
+    },
+    get copyCount() {
+      return copyCount;
+    },
+    get dragging() {
+      return dragging;
+    },
+    get reducedMotion() {
+      return reducedMotion;
+    },
+    update(next) {
+      const styleKeys = next.vertical !== void 0 || next.manageStyles !== void 0;
+      opts = { ...opts, ...next };
+      if (styleKeys) applyStyles();
+      measure();
+    },
+    measure,
+    pause() {
+      paused = true;
+      start();
+    },
+    resume() {
+      paused = false;
+      start();
+    },
+    destroy() {
+      destroyed = true;
+      if (frame) cancelAnimationFrame(frame);
+      resizeObserver?.disconnect();
+      motionQuery?.removeEventListener("change", onMotionChange);
+      lane.removeEventListener("pointerdown", onPointerDown);
+      lane.removeEventListener("pointerenter", onPointerEnter);
+      lane.removeEventListener("pointerleave", onPointerLeave);
+      lane.removeEventListener("touchstart", noteTouch);
+      lane.removeEventListener("click", onClickCapture, true);
+      lane.removeEventListener("click", onClick);
+      window.removeEventListener("pointermove", onPointerMove);
+      window.removeEventListener("pointerup", onPointerUp);
+      window.removeEventListener("pointercancel", onPointerUp);
+    }
+  };
+}
+
+export { createMarquee };

package/dist/chunk-XNNQRA35.js

@@ -0,0 +1,31 @@
+import { flagView } from './chunk-AU3H5WIY.js';
+import { jsx } from 'react/jsx-runtime';
+
+function Flag({ code, label, decorative = false, locale, shape, format, source, basePath, size, fallback = null, ...rest }) {
+  const options = { shape, format, source, basePath, size, locale };
+  for (const key of Object.keys(options)) {
+    if (options[key] === void 0) delete options[key];
+  }
+  const view = flagView(code, options);
+  if (!view) return fallback;
+  const name = decorative ? "" : label?.trim() || view.name || "";
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: view.src,
+      alt: name,
+      width: view.width,
+      height: view.height,
+      loading: "lazy",
+      decoding: "async",
+      "aria-hidden": name ? void 0 : true,
+      suppressHydrationWarning: true,
+      "data-enigma-flag": "",
+      "data-flag-code": view.code,
+      "data-flag-shape": view.shape,
+      ...rest
+    }
+  );
+}
+
+export { Flag };

package/dist/chunk-XQHCZAPJ.js

@@ -0,0 +1,102 @@
+import { estimatePasswordStrength } from './chunk-HC2ME5PU.js';
+import { useMemo, useRef, useEffect, useState } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var SCORE_LABELS = ["Very weak", "Weak", "Fair", "Strong", "Very strong"];
+function PasswordExtras({
+  id,
+  value,
+  strength,
+  onStrengthChange,
+  onScore,
+  breach,
+  breachDelay,
+  onBreachChange,
+  classNames
+}) {
+  const estimateOptions = typeof strength === "object" ? strength : void 0;
+  const userInputs = estimateOptions?.userInputs;
+  const report = useMemo(
+    () => strength === false ? null : estimatePasswordStrength(value, { userInputs }),
+    // The array is compared by identity, so a literal would re-estimate every render.
+    [strength, value, userInputs]
+  );
+  const strengthListener = useRef(onStrengthChange);
+  strengthListener.current = onStrengthChange;
+  const scoreListener = useRef(onScore);
+  scoreListener.current = onScore;
+  useEffect(() => {
+    if (!report) return;
+    strengthListener.current?.(report);
+    scoreListener.current(report.empty ? null : report.score);
+  }, [report]);
+  const [breachState, setBreachState] = useState({ status: "idle", count: 0, error: null });
+  const breachListener = useRef(onBreachChange);
+  breachListener.current = onBreachChange;
+  useEffect(() => {
+    if (!breach || !value) {
+      setBreachState({ status: "idle", count: 0, error: null });
+      return;
+    }
+    const controller = new AbortController();
+    const timer = setTimeout(() => {
+      setBreachState({ status: "checking", count: 0, error: null });
+      breach(value, { signal: controller.signal }).then((result) => {
+        if (controller.signal.aborted) return;
+        setBreachState({ status: result.breached ? "breached" : "safe", count: result.count, error: null });
+      }).catch((error) => {
+        if (controller.signal.aborted) return;
+        setBreachState({ status: "error", count: 0, error });
+      });
+    }, breachDelay);
+    return () => {
+      clearTimeout(timer);
+      controller.abort();
+    };
+  }, [breach, value, breachDelay]);
+  useEffect(() => {
+    breachListener.current(breachState);
+  }, [breachState]);
+  if (!report) return null;
+  return /* @__PURE__ */ jsx(PasswordStrength, { id, report, classNames });
+}
+function PasswordStrength({
+  value = "",
+  report,
+  userInputs,
+  segments = 5,
+  labels = SCORE_LABELS,
+  showWarning = true,
+  classNames,
+  ...props
+}) {
+  const computed = useMemo(
+    () => report ?? estimatePasswordStrength(value, { userInputs }),
+    [report, value, userInputs]
+  );
+  const score = computed.score;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...props,
+      "data-enigma-password-strength": "",
+      "data-score": computed.empty ? void 0 : score,
+      "data-empty": computed.empty ? "" : void 0,
+      children: [
+        /* @__PURE__ */ jsx("div", { "data-enigma-password-strength-track": "", "aria-hidden": "true", className: classNames?.track, children: Array.from({ length: segments }, (unused, index) => /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-enigma-password-strength-segment": "",
+            className: classNames?.segment,
+            "data-filled": !computed.empty && index <= score ? "" : void 0
+          },
+          index
+        )) }),
+        /* @__PURE__ */ jsx("p", { "data-enigma-password-strength-label": "", role: "status", "aria-live": "polite", className: classNames?.label, children: computed.empty ? "" : labels[score] ?? "" }),
+        showWarning && !computed.empty && computed.warnings.length > 0 && /* @__PURE__ */ jsx("p", { "data-enigma-password-strength-warning": "", className: classNames?.warning, children: computed.warnings[0] })
+      ]
+    }
+  );
+}
+
+export { PasswordExtras, PasswordStrength };

package/dist/chunk-ZCUFYBPB.js

@@ -0,0 +1,154 @@
+import { defaultQueue } from './chunk-QYMUIW5I.js';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function swipeAxis(position) {
+  if (position.endsWith("-center")) return { axis: "y", sign: position.startsWith("top") ? -1 : 1 };
+  return { axis: "x", sign: position.endsWith("-left") ? -1 : 1 };
+}
+function Toaster({
+  queue = defaultQueue,
+  position = "bottom-right",
+  exitDuration = 200,
+  swipeThreshold = 60,
+  children,
+  label = "Notifications",
+  className,
+  style
+}) {
+  const [rendered, setRendered] = useState(
+    () => queue.items.map((notification) => ({ notification, leaving: false }))
+  );
+  const timers = useRef(/* @__PURE__ */ new Map());
+  useEffect(() => {
+    const sync = (items) => {
+      setRendered((current) => {
+        const live = new Map(items.map((item) => [item.id, item]));
+        const kept = current.map((entry) => {
+          const still = live.get(entry.notification.id);
+          if (still) return { notification: still, leaving: false };
+          if (entry.leaving) return entry;
+          const timer = setTimeout(() => {
+            timers.current.delete(entry.notification.id);
+            setRendered((later) => later.filter((row) => row.notification.id !== entry.notification.id));
+          }, exitDuration);
+          timers.current.set(entry.notification.id, timer);
+          return { ...entry, leaving: true };
+        });
+        const seen = new Set(kept.map((entry) => entry.notification.id));
+        const added = items.filter((item) => !seen.has(item.id)).map((item) => ({ notification: item, leaving: false }));
+        return [...kept, ...added];
+      });
+    };
+    sync(queue.items);
+    return queue.subscribe(sync);
+  }, [queue, exitDuration]);
+  useEffect(() => {
+    const pending = timers.current;
+    return () => {
+      for (const timer of pending.values()) clearTimeout(timer);
+      pending.clear();
+    };
+  }, []);
+  if (!rendered.length) return null;
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      "aria-label": label,
+      "data-enigma-toaster": "",
+      "data-position": position,
+      className,
+      style,
+      onPointerEnter: () => queue.pause(),
+      onPointerLeave: () => queue.resume(),
+      onFocusCapture: () => queue.pause(),
+      onBlurCapture: () => queue.resume(),
+      children: rendered.map((entry, index) => /* @__PURE__ */ jsx(
+        Toast,
+        {
+          entry,
+          index: rendered.length - 1 - index,
+          position,
+          swipeThreshold,
+          onDismiss: () => queue.dismiss(entry.notification.id),
+          render: children
+        },
+        entry.notification.id
+      ))
+    }
+  );
+}
+function Toast({ entry, index, position, swipeThreshold, onDismiss, render }) {
+  const { notification, leaving } = entry;
+  const [offset, setOffset] = useState(0);
+  const [swiping, setSwiping] = useState(false);
+  const start = useRef(0);
+  const { axis, sign } = swipeAxis(position);
+  const onPointerDown = useCallback((event) => {
+    if (event.target.closest("button")) return;
+    if (event.pointerType === "mouse" && event.button !== 0) return;
+    event.currentTarget.setPointerCapture(event.pointerId);
+    start.current = axis === "x" ? event.clientX : event.clientY;
+    setSwiping(true);
+  }, [axis]);
+  const onPointerMove = useCallback((event) => {
+    if (!swiping) return;
+    const delta = (axis === "x" ? event.clientX : event.clientY) - start.current;
+    setOffset(sign > 0 ? Math.max(0, delta) : Math.min(0, delta));
+  }, [swiping, axis, sign]);
+  const onPointerUp = useCallback(() => {
+    if (!swiping) return;
+    setSwiping(false);
+    if (Math.abs(offset) >= swipeThreshold) {
+      onDismiss();
+      return;
+    }
+    setOffset(0);
+  }, [swiping, offset, swipeThreshold, onDismiss]);
+  const controls = { dismiss: onDismiss };
+  return /* @__PURE__ */ jsx(
+    "article",
+    {
+      "data-enigma-toast": "",
+      "data-tone": notification.tone,
+      "data-state": leaving ? "leaving" : "open",
+      "data-index": index,
+      "data-front": index === 0 ? "" : void 0,
+      "data-swiping": swiping ? "" : void 0,
+      role: notification.tone === "error" ? "alert" : "status",
+      "aria-live": notification.tone === "error" ? "assertive" : "polite",
+      tabIndex: 0,
+      onKeyDown: (event) => {
+        if (event.key === "Escape") onDismiss();
+      },
+      onPointerDown,
+      onPointerMove,
+      onPointerUp,
+      onPointerCancel: onPointerUp,
+      style: {
+        // Read by the theme, so the transform stays the stylesheet's decision.
+        "--enigma-toast-swipe": `${offset}px`,
+        "--enigma-toast-index": index
+      },
+      children: render ? render(notification, controls) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("p", { "data-enigma-toast-title": "", children: notification.title }),
+        notification.body && /* @__PURE__ */ jsx("p", { "data-enigma-toast-body": "", children: notification.body }),
+        notification.action && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-enigma-toast-action": "",
+            onClick: () => {
+              notification.action?.onSelect();
+              if (notification.action?.dismiss !== false) onDismiss();
+            },
+            children: notification.action.label
+          }
+        ),
+        /* @__PURE__ */ jsx("button", { type: "button", "data-enigma-toast-close": "", "aria-label": "Dismiss", onClick: onDismiss, children: "\xD7" })
+      ] })
+    }
+  );
+}
+
+export { Toaster };

package/dist/chunk-ZWR2EXHQ.js

@@ -0,0 +1,55 @@
+import { createMarquee } from './chunk-UOSSNUSC.js';
+import { useRef, useState, useEffect, useLayoutEffect } from 'react';
+
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
+function useMarquee(options = {}) {
+  const laneRef = useRef(null);
+  const trackRef = useRef(null);
+  const instanceRef = useRef(null);
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+  const [copies, setCopies] = useState(2);
+  const [dragging, setDragging] = useState(false);
+  const [period, setPeriod] = useState(0);
+  useIsomorphicLayoutEffect(() => {
+    const lane = laneRef.current;
+    const track = trackRef.current;
+    if (!lane || !track) return;
+    const instance = createMarquee(lane, track, {
+      ...optionsRef.current,
+      // React owns the DOM; cloning behind its back would be undone on render.
+      copies: "external",
+      onCopyCountChange: setCopies,
+      onMeasure: (measured) => setPeriod(measured),
+      onItemClick: (event) => optionsRef.current.onItemClick?.(event)
+    });
+    instanceRef.current = instance;
+    const syncDragging = () => setDragging(instance.dragging);
+    lane.addEventListener("pointerdown", syncDragging);
+    window.addEventListener("pointerup", syncDragging);
+    window.addEventListener("pointercancel", syncDragging);
+    return () => {
+      lane.removeEventListener("pointerdown", syncDragging);
+      window.removeEventListener("pointerup", syncDragging);
+      window.removeEventListener("pointercancel", syncDragging);
+      instance.destroy();
+      instanceRef.current = null;
+    };
+  }, []);
+  useIsomorphicLayoutEffect(() => {
+    instanceRef.current?.update(options);
+  }, [options.speed, options.reverse, options.vertical, options.draggable, options.hover, options.decay]);
+  useIsomorphicLayoutEffect(() => {
+    instanceRef.current?.measure();
+  }, [copies]);
+  return {
+    laneRef,
+    trackRef,
+    copies,
+    dragging,
+    period,
+    measure: () => instanceRef.current?.measure()
+  };
+}
+
+export { useMarquee };