@smwb/ui-react 2.8.0 → 2.9.0

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/utils/keyboardShortcut.d.ts

@@ -0,0 +1,12 @@
+import { type KbdPlatform } from "../components/dataDisplay/kbd/kbdKeys";
+type ShortcutEvent = Pick<KeyboardEvent, "key" | "code" | "ctrlKey" | "metaKey" | "altKey" | "shiftKey">;
+/**
+ * Whether a keyboard event is the shortcut `keys` (in `Kbd` key names, e.g. `["Mod", "K"]`).
+ * `Mod` is Meta on `mac` and Ctrl elsewhere. The modifiers must match exactly, so Mod+K does not
+ * match Mod+Shift+K. The list needs exactly one key that is not a modifier. It is compared with
+ * `event.key` ignoring case; a single ASCII letter or digit also matches `event.code`
+ * (`KeyK`, `Digit1`), so a shortcut keeps working on a layout that types other letters.
+ * `platform` is the running browser's by default.
+ */
+export declare function matchesKeyboardShortcut(event: ShortcutEvent, keys: string[], platform?: KbdPlatform): boolean;
+export {};

package/dist/utils/keyboardShortcut.js

@@ -0,0 +1,49 @@
+import { detectKbdPlatform as d } from "../components/dataDisplay/kbd/kbdKeys.js";
+const p = {
+  mod: "mod",
+  ctrl: "ctrl",
+  control: "ctrl",
+  alt: "alt",
+  option: "alt",
+  shift: "shift",
+  meta: "meta",
+  cmd: "meta",
+  command: "meta"
+}, h = {
+  esc: "escape",
+  space: " ",
+  spacebar: " ",
+  up: "arrowup",
+  down: "arrowdown",
+  left: "arrowleft",
+  right: "arrowright",
+  plus: "+",
+  return: "enter",
+  del: "delete"
+};
+function y(t, m, n = d()) {
+  var i, c;
+  let l = !1, s = !1, f = !1, a = !1, e = null;
+  for (const u of m) {
+    const o = u.trim().toLowerCase() || u, r = p[o];
+    if (r === "mod")
+      n === "mac" ? a = !0 : l = !0;
+    else if (r === "ctrl")
+      l = !0;
+    else if (r === "alt")
+      s = !0;
+    else if (r === "shift")
+      f = !0;
+    else if (r === "meta")
+      a = !0;
+    else if (e === null)
+      e = (i = h[o]) != null ? i : o;
+    else
+      return !1;
+  }
+  return e === null || t.ctrlKey !== l || t.altKey !== s || t.shiftKey !== f || t.metaKey !== a ? !1 : ((c = t.key) != null ? c : "").toLowerCase() === e ? !0 : /^[a-z]$/.test(e) ? t.code === `Key${e.toUpperCase()}` : /^[0-9]$/.test(e) ? t.code === `Digit${e}` : !1;
+}
+export {
+  y as matchesKeyboardShortcut
+};
+//# sourceMappingURL=keyboardShortcut.js.map

package/dist/utils/keyboardShortcut.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboardShortcut.js","sources":["../../src/utils/keyboardShortcut.ts"],"sourcesContent":["import { detectKbdPlatform, type KbdPlatform } from \"../components/dataDisplay/kbd/kbdKeys\";\n\ntype ShortcutEvent = Pick<KeyboardEvent, \"key\" | \"code\" | \"ctrlKey\" | \"metaKey\" | \"altKey\" | \"shiftKey\">;\n\n// Modifier names (lower case) and the flag each one asks for. `mod` is resolved per platform.\nconst MODIFIERS: Record<string, \"mod\" | \"ctrl\" | \"alt\" | \"shift\" | \"meta\"> = {\n  mod: \"mod\",\n  ctrl: \"ctrl\",\n  control: \"ctrl\",\n  alt: \"alt\",\n  option: \"alt\",\n  shift: \"shift\",\n  meta: \"meta\",\n  cmd: \"meta\",\n  command: \"meta\",\n};\n\n// Names (lower case) that stand for another `KeyboardEvent.key`.\nconst KEY_ALIASES: Record<string, string> = {\n  esc: \"escape\",\n  space: \" \",\n  spacebar: \" \",\n  up: \"arrowup\",\n  down: \"arrowdown\",\n  left: \"arrowleft\",\n  right: \"arrowright\",\n  plus: \"+\",\n  return: \"enter\",\n  del: \"delete\",\n};\n\n/**\n * Whether a keyboard event is the shortcut `keys` (in `Kbd` key names, e.g. `[\"Mod\", \"K\"]`).\n * `Mod` is Meta on `mac` and Ctrl elsewhere. The modifiers must match exactly, so Mod+K does not\n * match Mod+Shift+K. The list needs exactly one key that is not a modifier. It is compared with\n * `event.key` ignoring case; a single ASCII letter or digit also matches `event.code`\n * (`KeyK`, `Digit1`), so a shortcut keeps working on a layout that types other letters.\n * `platform` is the running browser's by default.\n */\nexport function matchesKeyboardShortcut(\n  event: ShortcutEvent,\n  keys: string[],\n  platform: KbdPlatform = detectKbdPlatform()\n): boolean {\n  let ctrl = false;\n  let alt = false;\n  let shift = false;\n  let meta = false;\n  let main: string | null = null;\n  for (const key of keys) {\n    const lower = key.trim().toLowerCase() || key; // a lone \" \" is the space bar\n    const modifier = MODIFIERS[lower];\n    if (modifier === \"mod\") {\n      if (platform === \"mac\") {\n        meta = true;\n      } else {\n        ctrl = true;\n      }\n    } else if (modifier === \"ctrl\") {\n      ctrl = true;\n    } else if (modifier === \"alt\") {\n      alt = true;\n    } else if (modifier === \"shift\") {\n      shift = true;\n    } else if (modifier === \"meta\") {\n      meta = true;\n    } else if (main === null) {\n      main = KEY_ALIASES[lower] ?? lower;\n    } else {\n      return false;\n    }\n  }\n  if (main === null) {\n    return false;\n  }\n  if (event.ctrlKey !== ctrl || event.altKey !== alt || event.shiftKey !== shift || event.metaKey !== meta) {\n    return false;\n  }\n  if ((event.key ?? \"\").toLowerCase() === main) {\n    return true;\n  }\n  if (/^[a-z]$/.test(main)) {\n    return event.code === `Key${main.toUpperCase()}`;\n  }\n  if (/^[0-9]$/.test(main)) {\n    return event.code === `Digit${main}`;\n  }\n  return false;\n}\n"],"names":["MODIFIERS","KEY_ALIASES","matchesKeyboardShortcut","event","keys","platform","detectKbdPlatform","ctrl","alt","shift","meta","main","key","lower","modifier","_a","_b"],"mappings":";AAKA,MAAMA,IAAuE;AAAA,EAC3E,KAAK;AAAA,EACL,MAAM;AAAA,EACN,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,KAAK;AAAA,EACL,SAAS;AACX,GAGMC,IAAsC;AAAA,EAC1C,KAAK;AAAA,EACL,OAAO;AAAA,EACP,UAAU;AAAA,EACV,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,KAAK;AACP;AAUO,SAASC,EACdC,GACAC,GACAC,IAAwBC,KACf;;AACT,MAAIC,IAAO,IACPC,IAAM,IACNC,IAAQ,IACRC,IAAO,IACPC,IAAsB;AAC1B,aAAWC,KAAOR,GAAM;AACtB,UAAMS,IAAQD,EAAI,KAAA,EAAO,iBAAiBA,GACpCE,IAAWd,EAAUa,CAAK;AAChC,QAAIC,MAAa;AACf,MAAIT,MAAa,QACfK,IAAO,KAEPH,IAAO;AAAA,aAEAO,MAAa;AACtB,MAAAP,IAAO;AAAA,aACEO,MAAa;AACtB,MAAAN,IAAM;AAAA,aACGM,MAAa;AACtB,MAAAL,IAAQ;AAAA,aACCK,MAAa;AACtB,MAAAJ,IAAO;AAAA,aACEC,MAAS;AAClB,MAAAA,KAAOI,IAAAd,EAAYY,CAAK,MAAjB,OAAAE,IAAsBF;AAAA;AAE7B,aAAO;AAAA,EAEX;AAIA,SAHIF,MAAS,QAGTR,EAAM,YAAYI,KAAQJ,EAAM,WAAWK,KAAOL,EAAM,aAAaM,KAASN,EAAM,YAAYO,IAC3F,OAEJM,IAAAb,EAAM,QAAN,OAAAa,IAAa,IAAI,YAAA,MAAkBL,IAC/B,KAEL,UAAU,KAAKA,CAAI,IACdR,EAAM,SAAS,MAAMQ,EAAK,aAAa,KAE5C,UAAU,KAAKA,CAAI,IACdR,EAAM,SAAS,QAAQQ,CAAI,KAE7B;AACT;"}

package/dist/utils/linkAttrs.d.ts

@@ -0,0 +1,13 @@
+/** Where a link opens unless its `target` says otherwise. */
+export declare const DEFAULT_LINK_TARGET = "_blank";
+/**
+ * The `target` attribute for a link: `undefined` (not given) keeps `"_blank"`, `null` (or an
+ * empty string) leaves the attribute out so the link opens in place, any other string is used as is.
+ */
+export declare function resolveLinkTarget(target: string | null | undefined): string | undefined;
+/**
+ * The `rel` attribute for a link: the caller's wins (an empty string drops it), `undefined` keeps the
+ * default. The default is `"noreferrer"` for a link that opens another browsing context (a new tab or
+ * a named window), which also implies `noopener`, and none for a link that opens in place.
+ */
+export declare function resolveLinkRel(rel: string | undefined, target: string | undefined): string | undefined;

package/dist/utils/linkAttrs.js

@@ -0,0 +1,13 @@
+const o = "_blank";
+function r(e) {
+  return e === void 0 ? o : e === null || e === "" ? void 0 : e;
+}
+function l(e, n) {
+  return e !== void 0 ? e || void 0 : n !== void 0 && n !== "_self" && n !== "_parent" && n !== "_top" ? "noreferrer" : void 0;
+}
+export {
+  o as DEFAULT_LINK_TARGET,
+  l as resolveLinkRel,
+  r as resolveLinkTarget
+};
+//# sourceMappingURL=linkAttrs.js.map

package/dist/utils/linkAttrs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"linkAttrs.js","sources":["../../src/utils/linkAttrs.ts"],"sourcesContent":["/** Where a link opens unless its `target` says otherwise. */\nexport const DEFAULT_LINK_TARGET = \"_blank\";\n\n/**\n * The `target` attribute for a link: `undefined` (not given) keeps `\"_blank\"`, `null` (or an\n * empty string) leaves the attribute out so the link opens in place, any other string is used as is.\n */\nexport function resolveLinkTarget(target: string | null | undefined): string | undefined {\n  if (target === undefined) return DEFAULT_LINK_TARGET;\n  return target === null || target === \"\" ? undefined : target;\n}\n\n/**\n * The `rel` attribute for a link: the caller's wins (an empty string drops it), `undefined` keeps the\n * default. The default is `\"noreferrer\"` for a link that opens another browsing context (a new tab or\n * a named window), which also implies `noopener`, and none for a link that opens in place.\n */\nexport function resolveLinkRel(rel: string | undefined, target: string | undefined): string | undefined {\n  if (rel !== undefined) return rel || undefined;\n  const elsewhere = target !== undefined && target !== \"_self\" && target !== \"_parent\" && target !== \"_top\";\n  return elsewhere ? \"noreferrer\" : undefined;\n}\n"],"names":["DEFAULT_LINK_TARGET","resolveLinkTarget","target","resolveLinkRel","rel"],"mappings":"AACO,MAAMA,IAAsB;AAM5B,SAASC,EAAkBC,GAAuD;AACvF,SAAIA,MAAW,SAAkBF,IAC1BE,MAAW,QAAQA,MAAW,KAAK,SAAYA;AACxD;AAOO,SAASC,EAAeC,GAAyBF,GAAgD;AACtG,SAAIE,MAAQ,SAAkBA,KAAO,SACnBF,MAAW,UAAaA,MAAW,WAAWA,MAAW,aAAaA,MAAW,SAChF,eAAe;AACpC;"}

package/dist/utils/restoreFocus.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Hands focus back to `opener`, the element that had it when an overlay opened, once the
+ * overlay `root` closes. Focus the app moved elsewhere on purpose stays where it is: it
+ * is restored only while it is still inside `root` or has been dropped on the body (the
+ * root is gone, or the element that had it was removed). An opener that left the document
+ * is skipped, and one that cannot take focus (disabled, hidden) simply ignores the call.
+ */
+export declare function restoreFocus(opener: Element | null, root: Element | null | undefined): void;

package/dist/utils/restoreFocus.js

@@ -0,0 +1,10 @@
+function c(e, n) {
+  if (!(e instanceof HTMLElement) || e === document.body || !e.isConnected)
+    return;
+  const t = document.activeElement;
+  t && t !== document.body && !(n != null && n.contains(t)) || e.focus({ preventScroll: !0 });
+}
+export {
+  c as restoreFocus
+};
+//# sourceMappingURL=restoreFocus.js.map

package/dist/utils/restoreFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"restoreFocus.js","sources":["../../src/utils/restoreFocus.ts"],"sourcesContent":["/**\n * Hands focus back to `opener`, the element that had it when an overlay opened, once the\n * overlay `root` closes. Focus the app moved elsewhere on purpose stays where it is: it\n * is restored only while it is still inside `root` or has been dropped on the body (the\n * root is gone, or the element that had it was removed). An opener that left the document\n * is skipped, and one that cannot take focus (disabled, hidden) simply ignores the call.\n */\nexport function restoreFocus(opener: Element | null, root: Element | null | undefined): void {\n  if (!(opener instanceof HTMLElement) || opener === document.body || !opener.isConnected) {\n    return;\n  }\n  const active = document.activeElement;\n  if (active && active !== document.body && !root?.contains(active)) {\n    return;\n  }\n  opener.focus({ preventScroll: true });\n}\n"],"names":["restoreFocus","opener","root","active"],"mappings":"AAOO,SAASA,EAAaC,GAAwBC,GAAwC;AAC3F,MAAI,EAAED,aAAkB,gBAAgBA,MAAW,SAAS,QAAQ,CAACA,EAAO;AAC1E;AAEF,QAAME,IAAS,SAAS;AACxB,EAAIA,KAAUA,MAAW,SAAS,QAAQ,EAACD,KAAA,QAAAA,EAAM,SAASC,OAG1DF,EAAO,MAAM,EAAE,eAAe,GAAA,CAAM;AACtC;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@smwb/ui-react",
   "main": "./dist/index.cjs",
-  "version": "2.8.0",
+  "version": "2.9.0",
   "license": "MIT",
   "engines": {
     "node": ">=20"
@@ -14,7 +14,7 @@
     "test": "npm run lint && npm run jest",
     "jest": "vitest run",
     "test:storybook": "test-storybook --url http://127.0.0.1:6006",
-    "test:storybook:ci": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"npm run build-storybook -- --quiet && npx http-server storybook-static --port 6006 --silent\" \"npx wait-on tcp:6006 && npm run test:storybook\"",
+    "test:storybook:ci": "node ../../scripts/storybook-test-ci.mjs",
     "eject": "react-scripts eject",
     "lint": "eslint . --max-warnings=0",
     "prettier:check": "npx prettier --check .",
@@ -44,6 +44,7 @@
     "clsx": "^2.1.1",
     "react-transition-group": "^4.4.5",
     "rifm": "^0.12.1",
+    "uqr": "^0.1.3",
     "uuid": "^11.1.1",
     "zod": "^4.4.3"
   },
@@ -52,7 +53,7 @@
     "@babel/preset-typescript": "^7.28.5",
     "@chromatic-com/storybook": "^5.2.1",
     "@eslint/js": "^10.0.1",
-    "@smwb/ui-styles": "^1.6.0",
+    "@smwb/ui-styles": "^2.0.0",
     "@storybook/addon-docs": "^10.4.0",
     "@storybook/addon-links": "^10.4.0",
     "@storybook/react": "^10.4.0",
@@ -80,6 +81,7 @@
     "globals": "^17.6.0",
     "http-server": "^14.1.1",
     "jsdom": "^26.1.0",
+    "jsqr": "^1.4.0",
     "less": "^4.6.4",
     "path-browserify": "^1.0.1",
     "playwright": "^1.60.0",