@enigmax/primitives 0.19.1 → 0.21.0

package/dist/chunk-JCCL7XKC.js

@@ -0,0 +1,465 @@
+import { defaultQueue } from './chunk-QYMUIW5I.js';
+import { useState, useRef, useLayoutEffect, useEffect, useCallback } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// src/react/toast-styles.ts
+var TOAST_STYLES = `
+[data-enigma-toaster] {
+    --enigma-toast-width: 356px;
+    --enigma-toast-edge: 24px;
+    --enigma-toast-gap: 14px;
+    --enigma-toast-peek: 14px;
+    --enigma-toast-scale-step: 0.06;
+    --enigma-toast-radius: 12px;
+    --enigma-toast-enter: 420ms;
+    --enigma-toast-exit: 350ms;
+
+    --enigma-toast-bg: #101010;
+    --enigma-toast-border: #2a2a2a;
+    --enigma-toast-text: #f5f5f5;
+    --enigma-toast-muted: #a3a3a3;
+    --enigma-toast-shadow: 0 6px 22px rgb(0 0 0 / 34%);
+
+    --enigma-toast-success: hsl(150 80% 72%);
+    --enigma-toast-success-bg: hsl(150 38% 9%);
+    --enigma-toast-success-border: hsl(147 55% 18%);
+    --enigma-toast-error: hsl(358 100% 82%);
+    --enigma-toast-error-bg: hsl(358 42% 12%);
+    --enigma-toast-error-border: hsl(357 55% 24%);
+    --enigma-toast-info: hsl(216 87% 74%);
+    --enigma-toast-info-bg: hsl(215 45% 11%);
+    --enigma-toast-info-border: hsl(223 50% 24%);
+    --enigma-toast-warning: hsl(46 87% 70%);
+    --enigma-toast-warning-bg: hsl(40 55% 9%);
+    --enigma-toast-warning-border: hsl(40 55% 20%);
+
+    position: fixed;
+    z-index: 999999;
+    width: var(--enigma-toast-width);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    outline: none;
+    font-family: inherit;
+    font-size: 13px;
+    /* The stack is a positioning context: every toast is absolute inside it, which is what
+       lets the ones behind be clipped to the front one's height. */
+    transition: transform 350ms ease;
+}
+
+@media (prefers-color-scheme: light) {
+    [data-enigma-toaster] {
+        --enigma-toast-bg: #ffffff;
+        --enigma-toast-border: #e5e5e5;
+        --enigma-toast-text: #171717;
+        --enigma-toast-muted: #737373;
+        --enigma-toast-shadow: 0 6px 22px rgb(0 0 0 / 12%);
+        --enigma-toast-success-bg: hsl(143 85% 96%);
+        --enigma-toast-success-border: hsl(145 92% 87%);
+        --enigma-toast-success: hsl(140 100% 27%);
+        --enigma-toast-error-bg: hsl(359 100% 97%);
+        --enigma-toast-error-border: hsl(359 100% 94%);
+        --enigma-toast-error: hsl(360 100% 45%);
+        --enigma-toast-info-bg: hsl(208 100% 97%);
+        --enigma-toast-info-border: hsl(221 91% 93%);
+        --enigma-toast-info: hsl(210 92% 45%);
+        --enigma-toast-warning-bg: hsl(49 100% 97%);
+        --enigma-toast-warning-border: hsl(49 91% 84%);
+        --enigma-toast-warning: hsl(31 92% 45%);
+    }
+}
+
+[data-enigma-toaster][data-position^="top"] { top: var(--enigma-toast-edge); }
+[data-enigma-toaster][data-position^="bottom"] { bottom: var(--enigma-toast-edge); }
+[data-enigma-toaster][data-position$="-right"] { right: var(--enigma-toast-edge); }
+[data-enigma-toaster][data-position$="-left"] { left: var(--enigma-toast-edge); }
+[data-enigma-toaster][data-position$="-center"] { left: 50%; transform: translateX(-50%); }
+/* The whole stack lifts a little when it fans out, so the front toast does not sit on the
+   exact pixel it did a moment ago. */
+[data-enigma-toaster][data-expanded][data-position^="bottom"] { transform: translateY(-6px); }
+[data-enigma-toaster][data-expanded][data-position^="top"] { transform: translateY(6px); }
+[data-enigma-toaster][data-expanded][data-position="bottom-center"] { transform: translateX(-50%) translateY(-6px); }
+[data-enigma-toaster][data-expanded][data-position="top-center"] { transform: translateX(-50%) translateY(6px); }
+
+[data-enigma-toast] {
+    position: absolute;
+    left: 0;
+    right: 0;
+    width: 100%;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 15px 16px;
+    color: var(--enigma-toast-text);
+    background: var(--enigma-toast-bg);
+    border: 1px solid var(--enigma-toast-border);
+    border-radius: var(--enigma-toast-radius);
+    box-shadow: var(--enigma-toast-shadow);
+    overflow-wrap: anywhere;
+    touch-action: none;
+    outline: none;
+    z-index: var(--enigma-toast-z, 1);
+    transition:
+        transform var(--enigma-toast-enter) cubic-bezier(0.21, 1.02, 0.73, 1),
+        opacity var(--enigma-toast-exit),
+        height 350ms;
+}
+
+[data-enigma-toaster][data-position^="bottom"] [data-enigma-toast] { bottom: 0; transform-origin: bottom center; }
+[data-enigma-toaster][data-position^="top"] [data-enigma-toast] { top: 0; transform-origin: top center; }
+
+/* Enter from off screen, in the direction the stack is pinned to. */
+[data-enigma-toaster][data-position^="bottom"] [data-enigma-toast] { transform: translateY(110%); opacity: 0; }
+[data-enigma-toaster][data-position^="top"] [data-enigma-toast] { transform: translateY(-110%); opacity: 0; }
+/* Scoped to the toaster so it OUTRANKS the enter rules above, which are scoped the same
+   way: at equal specificity the later rule wins, and a mounted toast that lost this one sat
+   at its entry offset forever - visible, and 110% of its own height off the bottom. */
+[data-enigma-toaster] [data-enigma-toast][data-mounted] { opacity: 1; transform: translateY(0); }
+
+/* Collapsed: the ones behind are clipped to the FRONT toast's height and scaled back, so
+   the stack reads as depth rather than as a list. Their content is hidden but present -
+   removing it would make the box jump when the stack expands. */
+[data-enigma-toaster]:not([data-expanded]) [data-enigma-toast][data-mounted]:not([data-front]) {
+    height: var(--enigma-toast-front-height);
+    transform: translateY(calc(var(--enigma-toast-before) * var(--enigma-toast-peek) * -1))
+        scale(calc(1 - var(--enigma-toast-before) * var(--enigma-toast-scale-step)));
+}
+[data-enigma-toaster][data-position^="top"]:not([data-expanded]) [data-enigma-toast][data-mounted]:not([data-front]) {
+    transform: translateY(calc(var(--enigma-toast-before) * var(--enigma-toast-peek)))
+        scale(calc(1 - var(--enigma-toast-before) * var(--enigma-toast-scale-step)));
+}
+[data-enigma-toaster]:not([data-expanded]) [data-enigma-toast]:not([data-front]) > * { opacity: 0; }
+[data-enigma-toast] > * { transition: opacity 350ms; }
+
+/* Expanded: each toast is lifted by the summed height of the ones in front of it. */
+[data-enigma-toaster][data-expanded][data-position^="bottom"] [data-enigma-toast][data-mounted] {
+    transform: translateY(calc(var(--enigma-toast-offset) * -1));
+}
+[data-enigma-toaster][data-expanded][data-position^="top"] [data-enigma-toast][data-mounted] {
+    transform: translateY(var(--enigma-toast-offset));
+}
+
+/* Past the visible count it is still in the DOM, still counted, and not on screen. */
+[data-enigma-toast][data-hidden] { opacity: 0; pointer-events: none; }
+
+[data-enigma-toast][data-state="leaving"] { opacity: 0; }
+[data-enigma-toaster]:not([data-expanded]) [data-enigma-toast][data-state="leaving"] { transform: translateY(150%) scale(0.9); }
+[data-enigma-toaster][data-expanded][data-position^="bottom"] [data-enigma-toast][data-state="leaving"] {
+    transform: translateY(calc(var(--enigma-toast-offset) * -1 + 110%));
+}
+
+/* While a finger is down the toast tracks it exactly: a transition here would lag behind the
+   pointer, which reads as a broken gesture rather than a smooth one. */
+[data-enigma-toast][data-swiping] {
+    transition: opacity 200ms;
+    transform: translateX(var(--enigma-toast-swipe, 0px));
+}
+
+[data-enigma-toast]:focus-visible { box-shadow: var(--enigma-toast-shadow), 0 0 0 2px var(--enigma-toast-info); }
+
+[data-enigma-toast][data-tone="success"] {
+    color: var(--enigma-toast-success);
+    background: var(--enigma-toast-success-bg);
+    border-color: var(--enigma-toast-success-border);
+}
+[data-enigma-toast][data-tone="error"] {
+    color: var(--enigma-toast-error);
+    background: var(--enigma-toast-error-bg);
+    border-color: var(--enigma-toast-error-border);
+}
+[data-enigma-toast][data-tone="info"] {
+    color: var(--enigma-toast-info);
+    background: var(--enigma-toast-info-bg);
+    border-color: var(--enigma-toast-info-border);
+}
+[data-enigma-toast][data-tone="warning"] {
+    color: var(--enigma-toast-warning);
+    background: var(--enigma-toast-warning-bg);
+    border-color: var(--enigma-toast-warning-border);
+}
+
+[data-enigma-toast-icon] { display: flex; flex-shrink: 0; width: 20px; height: 20px; }
+[data-enigma-toast-icon] svg { width: 20px; height: 20px; display: block; }
+[data-enigma-toast-icon][data-tone="loading"] svg { animation: enigma-toast-spin 900ms linear infinite; }
+@keyframes enigma-toast-spin { to { transform: rotate(360deg); } }
+
+[data-enigma-toast-content] { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
+[data-enigma-toast-title] { margin: 0; font-weight: 600; line-height: 1.4; }
+[data-enigma-toast-body] { margin: 0; font-size: 12px; line-height: 1.45; opacity: 0.75; }
+
+[data-enigma-toast-action] {
+    flex-shrink: 0;
+    padding: 5px 10px;
+    font: inherit;
+    font-size: 12px;
+    font-weight: 600;
+    color: var(--enigma-toast-bg);
+    background: currentColor;
+    border: 0;
+    border-radius: 6px;
+    cursor: pointer;
+}
+
+[data-enigma-toast-close] {
+    flex-shrink: 0;
+    display: grid;
+    place-items: center;
+    width: 20px;
+    height: 20px;
+    padding: 0;
+    color: inherit;
+    background: none;
+    border: 0;
+    border-radius: 5px;
+    cursor: pointer;
+    /* Shown on hover or focus, so it never covers the message while it is being read - but
+       always reachable by keyboard, which display:none would take away. */
+    opacity: 0;
+    transition: opacity 120ms ease-out;
+}
+[data-enigma-toast]:hover [data-enigma-toast-close],
+[data-enigma-toast-close]:focus-visible { opacity: 0.7; }
+[data-enigma-toast-close]:hover { opacity: 1; }
+
+@media (max-width: 600px) {
+    [data-enigma-toaster] { right: 14px; left: 14px; width: auto; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    /* The movement goes, the state change stays: a toast still appears and still leaves. */
+    [data-enigma-toast], [data-enigma-toast] > * { transition: opacity 200ms !important; }
+    [data-enigma-toast][data-mounted] { transform: none !important; }
+}
+`;
+var VISIBLE = 3;
+var injected = false;
+function injectStyles() {
+  if (injected || typeof document === "undefined") return;
+  injected = true;
+  if (document.querySelector("[data-enigma-toast-styles]")) return;
+  const element = document.createElement("style");
+  element.setAttribute("data-enigma-toast-styles", "");
+  element.textContent = TOAST_STYLES;
+  document.head.prepend(element);
+}
+var ICONS = {
+  success: /* @__PURE__ */ jsx("path", { d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.86-9.81a.75.75 0 00-1.22-.88l-3.48 4.79-1.88-1.88a.75.75 0 10-1.06 1.06l2.5 2.5a.75.75 0 001.14-.09l4-5.5z" }),
+  error: /* @__PURE__ */ jsx("path", { d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" }),
+  warning: /* @__PURE__ */ jsx("path", { d: "M9.4 3a1.5 1.5 0 012.6 0l7.36 12.75A1.5 1.5 0 0118.06 18H3.94a1.5 1.5 0 01-1.3-2.25L10 3zm.85 4.5a.75.75 0 00-1.5 0v4a.75.75 0 001.5 0v-4zM10 15a.9.9 0 100-1.8.9.9 0 000 1.8z" }),
+  info: /* @__PURE__ */ jsx("path", { d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.25a.25.25 0 01.25.3l-.46 2.07A1.75 1.75 0 0010.75 15H11a.75.75 0 000-1.5h-.25a.25.25 0 01-.25-.3l.46-2.07A1.75 1.75 0 009.25 9H9z" })
+};
+function ToneIcon({ tone }) {
+  if (!tone || tone === "default") return null;
+  if (tone === "loading") {
+    return /* @__PURE__ */ jsx("span", { "data-enigma-toast-icon": "", "data-tone": "loading", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-6.22-8.56", opacity: "0.85" }) }) });
+  }
+  const glyph = ICONS[tone];
+  if (!glyph) return null;
+  return /* @__PURE__ */ jsx("span", { "data-enigma-toast-icon": "", "data-tone": tone, children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: glyph }) });
+}
+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 = 350,
+  swipeThreshold = 60,
+  visibleCount = VISIBLE,
+  expand = false,
+  styles: withStyles = true,
+  children,
+  label = "Notifications",
+  className,
+  style
+}) {
+  const [rendered, setRendered] = useState(
+    () => queue.items.map((notification) => ({ notification, leaving: false }))
+  );
+  const timers = useRef(/* @__PURE__ */ new Map());
+  const [hovered, setHovered] = useState(false);
+  const [heights, setHeights] = useState({});
+  useLayoutEffect(() => {
+    if (withStyles) injectStyles();
+  }, [withStyles]);
+  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;
+  const expanded = expand || hovered;
+  const stack = [...rendered].reverse();
+  const frontHeight = heights[stack[0]?.notification.id ?? ""] ?? 0;
+  return /* @__PURE__ */ jsx(
+    "section",
+    {
+      "aria-label": label,
+      "data-enigma-toaster": "",
+      "data-position": position,
+      "data-expanded": expanded ? "" : void 0,
+      style: { ...style, "--enigma-toast-front-height": `${frontHeight}px` },
+      className,
+      onPointerEnter: () => {
+        queue.pause();
+        setHovered(true);
+      },
+      onPointerLeave: () => {
+        queue.resume();
+        setHovered(false);
+      },
+      onFocusCapture: () => {
+        queue.pause();
+        setHovered(true);
+      },
+      onBlurCapture: () => {
+        queue.resume();
+        setHovered(false);
+      },
+      children: stack.map((entry, index) => /* @__PURE__ */ jsx(
+        Toast,
+        {
+          entry,
+          index,
+          hidden: index >= visibleCount,
+          offset: stack.slice(0, index).reduce((total, row) => total + (heights[row.notification.id] ?? 0) + 14, 0),
+          onMeasure: (height) => setHeights((current) => current[entry.notification.id] === height ? current : { ...current, [entry.notification.id]: height }),
+          position,
+          swipeThreshold,
+          onDismiss: () => queue.dismiss(entry.notification.id),
+          render: children
+        },
+        entry.notification.id
+      ))
+    }
+  );
+}
+function Toast({ entry, index, hidden, offset: stackOffset, onMeasure, position, swipeThreshold, onDismiss, render }) {
+  const { notification, leaving } = entry;
+  const [offset, setOffset] = useState(0);
+  const [swiping, setSwiping] = useState(false);
+  const [mounted, setMounted] = useState(false);
+  const node = useRef(null);
+  const start = useRef(0);
+  const { axis, sign } = swipeAxis(position);
+  useLayoutEffect(() => {
+    const element = node.current;
+    if (!element) return;
+    const report = () => onMeasure(element.getBoundingClientRect().height);
+    report();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(report);
+    observer.observe(element);
+    return () => observer.disconnect();
+  }, [notification.title, notification.body]);
+  useEffect(() => {
+    const frame = requestAnimationFrame(() => setMounted(true));
+    return () => cancelAnimationFrame(frame);
+  }, []);
+  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",
+    {
+      ref: (element) => {
+        node.current = element;
+      },
+      "data-enigma-toast": "",
+      "data-tone": notification.tone,
+      "data-state": leaving ? "leaving" : "open",
+      "data-index": index,
+      "data-front": index === 0 ? "" : void 0,
+      "data-mounted": mounted && !leaving ? "" : void 0,
+      "data-hidden": hidden ? "" : 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 every transform stays the stylesheet's decision.
+        "--enigma-toast-swipe": `${offset}px`,
+        "--enigma-toast-index": index,
+        "--enigma-toast-before": index,
+        "--enigma-toast-offset": `${stackOffset}px`,
+        // The front toast is on top, and each one behind it a layer lower.
+        "--enigma-toast-z": 100 - index
+      },
+      children: render ? render(notification, controls) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(ToneIcon, { tone: notification.tone }),
+        /* @__PURE__ */ jsxs("span", { "data-enigma-toast-content": "", 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: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "12", height: "12", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) }) })
+      ] })
+    }
+  );
+}
+
+export { Toaster };

package/dist/{chunk-T4F3BWR5.js → chunk-LMZJBOZG.js}

@@ -22,9 +22,56 @@ function resetFlagConfig() {
 var FLAG_RATIO = { rect: 4 / 3, square: 1, circle: 1 };
 var EMOJI_FLAG = /^[\u{1F1E6}-\u{1F1FF}]{2}$/u;
 var LOCALE_TAG = /^([A-Za-z]{2,3})[-_]([A-Z]{2})$/;
-var FILE_CODE = /^[a-z]{2,}(?:[-_][a-z0-9]+)*$/;
+var FILE_CODE = /^[a-z]{2,}[-_][a-z0-9_-]+$/;
 var COUNTRY_CODE = /^[a-z]{2}$/;
-function normalizeFlagCode(value) {
+function fold(value) {
+  return value.normalize("NFD").replace(/\p{Diacritic}/gu, "").replace(/['‘’ʼ`´]/g, "").toLowerCase().replace(/&/g, " and ").replace(/\bst\.?\s/g, "saint ").replace(/^the\s+/, "").replace(/[.,]/g, "").replace(/\s+/g, " ").trim();
+}
+var nameIndexes = /* @__PURE__ */ new Map();
+function canonicalRegion(code) {
+  try {
+    return new Intl.Locale(`und-${code}`).region?.toLowerCase() ?? code.toLowerCase();
+  } catch {
+    return code.toLowerCase();
+  }
+}
+function unknownRegionName(names) {
+  return names.of("ZZ");
+}
+function regionsByName(locale) {
+  const cached = nameIndexes.get(locale);
+  if (cached !== void 0) return cached;
+  let index = null;
+  try {
+    const names = new Intl.DisplayNames([locale], { type: "region" });
+    const unknown = unknownRegionName(names);
+    index = /* @__PURE__ */ new Map();
+    for (let first = 65; first <= 90; first++) {
+      for (let second = 65; second <= 90; second++) {
+        const code = String.fromCharCode(first, second);
+        const name = names.of(code);
+        if (!name || name === code || name === unknown) continue;
+        const key = fold(name);
+        if (!index.has(key)) index.set(key, canonicalRegion(code));
+      }
+    }
+  } catch {
+    index = null;
+  }
+  nameIndexes.set(locale, index);
+  return index;
+}
+function isKnownRegion(code) {
+  try {
+    const names = new Intl.DisplayNames(["en"], { type: "region" });
+    const upper = code.toUpperCase();
+    const name = names.of(upper);
+    return Boolean(name) && name !== upper && name !== unknownRegionName(names);
+  } catch {
+    return true;
+  }
+}
+function normalizeFlagCode(value, locale) {
   if (!value) return null;
   const raw = value.trim();
   if (!raw) return null;
@@ -32,10 +79,18 @@ function normalizeFlagCode(value) {
     const letters = [...raw].map((char) => String.fromCharCode((char.codePointAt(0) ?? 0) - 127462 + 97));
     return letters.join("");
   }
-  const locale = LOCALE_TAG.exec(raw);
-  if (locale) return locale[2].toLowerCase();
-  const code = raw.toLowerCase();
-  return FILE_CODE.test(code) ? code : null;
+  const tag = LOCALE_TAG.exec(raw);
+  if (tag) return tag[2].toLowerCase();
+  const lower = raw.toLowerCase();
+  if (COUNTRY_CODE.test(lower)) return isKnownRegion(lower) ? canonicalRegion(lower) : null;
+  if (FILE_CODE.test(lower)) return lower;
+  const folded = fold(raw);
+  for (const candidate of [locale, documentLocale(), "en", runtimeLocale()]) {
+    if (!candidate) continue;
+    const found = regionsByName(candidate)?.get(folded);
+    if (found) return found;
+  }
+  return null;
 }
 function flagName(code, locale) {
   const normalized = normalizeFlagCode(code);
@@ -49,6 +104,13 @@ function flagName(code, locale) {
     return null;
   }
 }
+function runtimeLocale() {
+  try {
+    return Intl.DateTimeFormat().resolvedOptions().locale;
+  } catch {
+    return void 0;
+  }
+}
 function documentLocale() {
   if (typeof document === "undefined") return void 0;
   return document.documentElement.lang || void 0;

package/dist/{chunk-XPKWJD5O.js → chunk-NPHRS2Q7.js}

@@ -1,4 +1,4 @@
-import { flagView } from './chunk-T4F3BWR5.js';
+import { flagView } from './chunk-LMZJBOZG.js';
 import { jsx } from 'react/jsx-runtime';
 
 function Flag({ code, label, decorative = false, locale, shape, format, source, basePath, size, fallback = null, ...rest }) {

package/dist/{flags-fLwIl2hG.d.ts → flags-BQU1V9rE.d.ts}

@@ -71,12 +71,20 @@ declare const FLAG_RATIO: Record<FlagShape, number>;
 /**
  * Anything a codebase calls a country into the file name the sets use, or null.
  *
- * Null rather than a guess: a code this cannot resolve would otherwise become a 404 image
- * with no alt text, and a broken flag beside a country name is worse than no flag at all.
- * An emoji flag is accepted and converted, so migrating an existing picker is a rename of
- * the component and nothing else.
+ * What it accepts: a code (`es`, `ES`), a locale tag (`en-GB`, `es_ES`), a subdivision or
+ * named file (`gb-eng`, `au-nsw`, `easter_island`), the emoji flag you are replacing, and
+ * the country's NAME - in English or in the page's own language, accents optional, so
+ * `Spain`, `España` and `espana` all resolve. A name is what a database column or an API
+ * payload usually holds, and requiring the caller to convert it first is how a flag ends up
+ * not being rendered at all.
+ *
+ * Null rather than a guess, and that is the point of the strictness: `banana` used to pass
+ * as a file code and render as a 404 with no alt text, which is worse than no flag. A
+ * two-letter code is checked against the runtime's own region list, a bare word is resolved
+ * as a name or refused, and only a separator-carrying file name is taken on trust, because
+ * nothing can check those without shipping the whole directory listing.
  */
-declare function normalizeFlagCode(value: string | null | undefined): string | null;
+declare function normalizeFlagCode(value: string | null | undefined, locale?: string): string | null;
 /**
  * The country's name, in the reader's language, or null.
  *

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export { E as EstimateOptions, G as GeneratePasswordOptions, P as PasswordAlphab
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, d as Notifications, e as NotificationsOptions, P as PromiseMessages, f as createNotifications } from './notifications-BpVV6sel.js';
 export { N as NetworkMonitor, a as NetworkState, S as SERVER_NETWORK_STATE, c as createNetworkMonitor } from './network-D2LsBG_k.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense, e as RelativeTimeView, f as ensureZone, n as normalizeDate, p as parseDuration, r as relativeTimeAttributes, g as relativeTimeView } from './relative-time-YpRTG7YH.js';
-export { F as FLAG_CDN, a as FLAG_RATIO, b as FlagConfig, c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, g as FlagView, h as configureFlags, i as flagAttributes, j as flagConfig, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode, r as resetFlagConfig } from './flags-fLwIl2hG.js';
+export { F as FLAG_CDN, a as FLAG_RATIO, b as FlagConfig, c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, g as FlagView, h as configureFlags, i as flagAttributes, j as flagConfig, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode, r as resetFlagConfig } from './flags-BQU1V9rE.js';
 export { P as PaletteKey, a as PositionedRow, R as RecentEntry, b as RecentStore, c as RecentStoreOptions, d as RowGroup, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from './palette-D7iuQh_T.js';
 
 /**

package/dist/index.js

@@ -1,6 +1,6 @@
 export { createInput } from './chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from './chunk-HC2ME5PU.js';
-export { FLAG_CDN, FLAG_RATIO, configureFlags, flagAttributes, flagConfig, flagName, flagSrc, flagView, normalizeFlagCode, resetFlagConfig } from './chunk-T4F3BWR5.js';
+export { FLAG_CDN, FLAG_RATIO, configureFlags, flagAttributes, flagConfig, flagName, flagSrc, flagView, normalizeFlagCode, resetFlagConfig } from './chunk-LMZJBOZG.js';
 export { createMarquee } from './chunk-UOSSNUSC.js';
 export { SERVER_NETWORK_STATE, createNetworkMonitor } from './chunk-2QFTRNAZ.js';
 export { createNotifications } from './chunk-SNYUBXWQ.js';

package/dist/next/index.d.ts

@@ -18,7 +18,7 @@ export { RelativeTime, RelativeTimeProps } from '../react/relative-time.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense } from '../relative-time-YpRTG7YH.js';
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, e as NotificationsOptions } from '../notifications-BpVV6sel.js';
 export { Flag, FlagProps } from '../react/flag.js';
-export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-fLwIl2hG.js';
+export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-BQU1V9rE.js';
 export { PaletteContent, PaletteContextValue, PaletteField, PaletteFooter, PaletteItem, PaletteList, PaletteListProps, PaletteRoot, PaletteRootProps, PaletteRow, PaletteSection, PaletteTrigger, SearchPalette, SearchPaletteProps, usePaletteContext } from '../react/palette.js';
 export { R as RecentEntry, b as RecentStore, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from '../palette-D7iuQh_T.js';
 

package/dist/next/index.js

@@ -1,8 +1,8 @@
 "use client";
 export { useInput } from '../chunk-U3V4EHOB.js';
 export { PasswordStrength } from '../chunk-XQHCZAPJ.js';
-export { Flag } from '../chunk-XPKWJD5O.js';
-export { Toaster } from '../chunk-ZCUFYBPB.js';
+export { Flag } from '../chunk-NPHRS2Q7.js';
+export { Toaster } from '../chunk-JCCL7XKC.js';
 export { useMarquee } from '../chunk-ZWR2EXHQ.js';
 export { useSearch } from '../chunk-QQFNAKMY.js';
 export { useNetworkState } from '../chunk-S653GLSF.js';
@@ -10,7 +10,7 @@ export { createNotificationQueue, defaultQueue, useNotifications } from '../chun
 export { RelativeTime } from '../chunk-OCMI7R6H.js';
 import '../chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from '../chunk-HC2ME5PU.js';
-export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-T4F3BWR5.js';
+export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-LMZJBOZG.js';
 import '../chunk-UOSSNUSC.js';
 import '../chunk-2QFTRNAZ.js';
 import '../chunk-SNYUBXWQ.js';

package/dist/react/flag.d.ts

@@ -1,5 +1,5 @@
 import { ImgHTMLAttributes, ReactNode } from 'react';
-import { e as FlagShape, c as FlagFormat, f as FlagSource } from '../flags-fLwIl2hG.js';
+import { e as FlagShape, c as FlagFormat, f as FlagSource } from '../flags-BQU1V9rE.js';
 
 interface FlagProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "alt" | "width" | "height"> {
     /** `es`, `ES`, `en-GB`, `gb-eng`, or the emoji flag you are replacing. */

package/dist/react/flag.js

@@ -1,3 +1,3 @@
 "use client";
-export { Flag } from '../chunk-XPKWJD5O.js';
-import '../chunk-T4F3BWR5.js';
+export { Flag } from '../chunk-NPHRS2Q7.js';
+import '../chunk-LMZJBOZG.js';