@smwb/ui-react 2.8.0 → 2.9.0

package/dist/headless/components/dataDisplay/list/listItem.js

@@ -1,37 +1,60 @@
-import { jsxs as f, jsx as i } from "react/jsx-runtime";
-import { forwardRef as b } from "react";
-import c from "clsx";
-const N = b(function({ className: r, children: _, disabled: s, selected: m, dense: d, divider: n, startAdornment: l, endAdornment: o, onClick: t }, w) {
-  const a = !!t && !s;
-  return /* @__PURE__ */ f(
+import { jsx as n, jsxs as a, Fragment as w } from "react/jsx-runtime";
+import { forwardRef as R, useRef as y } from "react";
+import I from "clsx";
+import { resolveLinkRel as j, resolveLinkTarget as D } from "../../../utils/linkAttrs.js";
+const A = R(function({ className: p, children: b, disabled: i, selected: r, dense: h, divider: u, startAdornment: g, endAdornment: k, href: m, target: N, rel: x, onClick: t }, L) {
+  const s = !!m, l = !!t && !i && !s, _ = D(N), o = y(null), d = /* @__PURE__ */ n("span", { className: "smwb-list__item__start", children: g }), c = /* @__PURE__ */ n("span", { className: "smwb-list__item__main", children: b }), f = /* @__PURE__ */ n("span", { className: "smwb-list__item__end", children: k });
+  return /* @__PURE__ */ n(
     "li",
     {
-      ref: w,
+      ref: L,
       role: "listitem",
-      tabIndex: a ? 0 : void 0,
-      "aria-disabled": s || void 0,
-      "aria-selected": m || void 0,
-      onClick: s ? void 0 : t,
-      onKeyDown: a ? (e) => {
+      tabIndex: l ? 0 : void 0,
+      "aria-disabled": i || void 0,
+      "aria-selected": !s && r || void 0,
+      onClick: i || !t ? void 0 : s ? (e) => {
+        var v;
+        (v = o.current) != null && v.contains(e.target) && t(e);
+      } : t,
+      onKeyDown: l ? (e) => {
         (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t == null || t(e));
       } : void 0,
-      className: c("smwb-list__item", r, {
-        "smwb-disabled": s,
-        "smwb-selected": m,
-        "smwb-list__item_dense": d,
-        "smwb-list__item_divider": n
+      className: I("smwb-list__item", p, {
+        "smwb-disabled": i,
+        "smwb-selected": r,
+        "smwb-list__item_link": s,
+        "smwb-list__item_dense": h,
+        "smwb-list__item_divider": u
       }),
       "data-testid": "list-item",
-      children: [
-        /* @__PURE__ */ i("span", { className: "smwb-list__item__start", children: l }),
-        /* @__PURE__ */ i("span", { className: "smwb-list__item__main", children: _ }),
-        /* @__PURE__ */ i("span", { className: "smwb-list__item__end", children: o })
-      ]
+      children: s ? /* @__PURE__ */ a(w, { children: [
+        /* @__PURE__ */ a(
+          "a",
+          {
+            ref: o,
+            className: "smwb-list__item__link",
+            "data-testid": "list-item-link",
+            "aria-current": r ? "page" : void 0,
+            href: i ? void 0 : m,
+            target: _,
+            rel: j(x, _),
+            children: [
+              d,
+              c
+            ]
+          }
+        ),
+        f
+      ] }) : /* @__PURE__ */ a(w, { children: [
+        d,
+        c,
+        f
+      ] })
     }
   );
 });
 export {
-  N as ListItem,
-  N as default
+  A as ListItem,
+  A as default
 };
 //# sourceMappingURL=listItem.js.map

package/dist/headless/components/dataDisplay/list/listItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"listItem.js","sources":["../../../../../src/components/dataDisplay/list/listItem.tsx"],"sourcesContent":["import React, { forwardRef, PropsWithChildren } from \"react\";\nimport cn from \"clsx\";\n\nexport interface ListItemProps {\n  disabled?: boolean;\n  className?: string;\n  selected?: boolean;\n  /** Compact row. */\n  dense?: boolean;\n  /** Render a bottom divider. */\n  divider?: boolean;\n  startAdornment?: React.ReactNode;\n  endAdornment?: React.ReactNode;\n  onClick?: React.MouseEventHandler<HTMLLIElement>;\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, PropsWithChildren<ListItemProps>>(function ListItem(\n  { className, children, disabled, selected, dense, divider, startAdornment, endAdornment, onClick },\n  ref\n) {\n  const interactive = !!onClick && !disabled;\n\n  return (\n    <li\n      ref={ref}\n      role=\"listitem\"\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      aria-selected={selected || undefined}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={\n        interactive\n          ? (e) => {\n              if (e.key === \"Enter\" || e.key === \" \") {\n                e.preventDefault();\n                onClick?.(e as unknown as React.MouseEvent<HTMLLIElement>);\n              }\n            }\n          : undefined\n      }\n      className={cn(\"smwb-list__item\", className, {\n        \"smwb-disabled\": disabled,\n        \"smwb-selected\": selected,\n        \"smwb-list__item_dense\": dense,\n        \"smwb-list__item_divider\": divider,\n      })}\n      data-testid=\"list-item\"\n    >\n      <span className=\"smwb-list__item__start\">{startAdornment}</span>\n      <span className=\"smwb-list__item__main\">{children}</span>\n      <span className=\"smwb-list__item__end\">{endAdornment}</span>\n    </li>\n  );\n});\n\nexport default ListItem;\n"],"names":["ListItem","forwardRef","className","children","disabled","selected","dense","divider","startAdornment","endAdornment","onClick","ref","interactive","jsxs","cn","jsx"],"mappings":";;;AAgBO,MAAMA,IAAWC,EAA4D,SAClF,EAAE,WAAAC,GAAW,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,SAAAC,GAAS,gBAAAC,GAAgB,cAAAC,GAAc,SAAAC,EAAA,GACzFC,GACA;AACA,QAAMC,IAAc,CAAC,CAACF,KAAW,CAACN;AAElC,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,MAAK;AAAA,MACL,UAAUC,IAAc,IAAI;AAAA,MAC5B,iBAAeR,KAAY;AAAA,MAC3B,iBAAeC,KAAY;AAAA,MAC3B,SAASD,IAAW,SAAYM;AAAA,MAChC,WACEE,IACI,CAAC,MAAM;AACL,SAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,eAAA,GACFF,KAAA,QAAAA,EAAU;AAAA,MAEd,IACA;AAAA,MAEN,WAAWI,EAAG,mBAAmBZ,GAAW;AAAA,QAC1C,iBAAiBE;AAAA,QACjB,iBAAiBC;AAAA,QACjB,yBAAyBC;AAAA,QACzB,2BAA2BC;AAAA,MAAA,CAC5B;AAAA,MACD,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAQ,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAAP,GAAe;AAAA,QACzD,gBAAAO,EAAC,QAAA,EAAK,WAAU,yBAAyB,UAAAZ,EAAA,CAAS;AAAA,QAClD,gBAAAY,EAAC,QAAA,EAAK,WAAU,wBAAwB,UAAAN,EAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG3D,CAAC;"}
+{"version":3,"file":"listItem.js","sources":["../../../../../src/components/dataDisplay/list/listItem.tsx"],"sourcesContent":["import React, { forwardRef, PropsWithChildren, useRef } from \"react\";\nimport cn from \"clsx\";\nimport { resolveLinkRel, resolveLinkTarget } from \"../../../utils/linkAttrs\";\n\nexport interface ListItemProps {\n  disabled?: boolean;\n  className?: string;\n  /**\n   * Paints the row as the current one. On a link row (with `href`) it also marks the link as the current page\n   * with `aria-current=\"page\"`, because `aria-selected` is not a state a list item can have; on another row it\n   * stays `aria-selected`.\n   */\n  selected?: boolean;\n  /** Compact row. */\n  dense?: boolean;\n  /** Render a bottom divider. */\n  divider?: boolean;\n  startAdornment?: React.ReactNode;\n  /**\n   * Trailing content. On a link row (with `href`) it sits beside the link, not inside it, so it can hold a control\n   * (a pin button, a toggle) without nesting it in the `<a>`; a click on it does not reach `onClick`.\n   */\n  endAdornment?: React.ReactNode;\n  /**\n   * Makes the row a link: the `startAdornment` and the children sit in an `<a href>` that fills the row, so it can be\n   * focused with Tab, opened with middle click or copied. Keep the `startAdornment` non-interactive; a control\n   * belongs in the `endAdornment`. A disabled row has no `href`. A router takes the\n   * plain click in `onClick` with `event.preventDefault()`, and leaves a modified one (Ctrl, Meta, Shift,\n   * Alt, or a button other than the main one) to the browser, as a router's `Link` does.\n   */\n  href?: string;\n  /**\n   * Where the link (with `href`) opens. By default `\"_blank\"`: a new tab, as for `Button`. Pass `null` for an\n   * internal link: the `target` attribute is left out and the link opens in place. An empty string does the same; any other\n   * string is used as is.\n   */\n  target?: string | null;\n  /**\n   * The `rel` of the link (with `href`). By default `\"noreferrer\"` for a link that opens another tab or window,\n   * and none for one that opens in place. Your own value replaces the default, so add `noreferrer` yourself\n   * if you still want it; an empty string drops the attribute.\n   */\n  rel?: string;\n  /**\n   * Click handler of the row. With an `href` it runs for a click on the link (not on the `endAdornment`), before the\n   * browser follows it, so `event.preventDefault()` cancels the navigation; the row then is not a Tab stop of its\n   * own, the link is.\n   */\n  onClick?: React.MouseEventHandler<HTMLLIElement>;\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, PropsWithChildren<ListItemProps>>(function ListItem(\n  { className, children, disabled, selected, dense, divider, startAdornment, endAdornment, href, target, rel, onClick },\n  ref\n) {\n  const link = !!href;\n  // A link row is focused through its anchor, which Enter follows by itself.\n  const interactive = !!onClick && !disabled && !link;\n  const linkTarget = resolveLinkTarget(target);\n  const linkRef = useRef<HTMLAnchorElement>(null);\n  const start = <span className=\"smwb-list__item__start\">{startAdornment}</span>;\n  const main = <span className=\"smwb-list__item__main\">{children}</span>;\n  const end = <span className=\"smwb-list__item__end\">{endAdornment}</span>;\n  const handleClick: React.MouseEventHandler<HTMLLIElement> | undefined =\n    disabled || !onClick\n      ? undefined\n      : link\n        ? (e) => {\n            // The end adornment is beside the link, and its own clicks are not the row's.\n            if (linkRef.current?.contains(e.target as Node)) onClick(e);\n          }\n        : onClick;\n\n  return (\n    <li\n      ref={ref}\n      role=\"listitem\"\n      tabIndex={interactive ? 0 : undefined}\n      aria-disabled={disabled || undefined}\n      aria-selected={(!link && selected) || undefined}\n      onClick={handleClick}\n      onKeyDown={\n        interactive\n          ? (e) => {\n              if (e.key === \"Enter\" || e.key === \" \") {\n                e.preventDefault();\n                onClick?.(e as unknown as React.MouseEvent<HTMLLIElement>);\n              }\n            }\n          : undefined\n      }\n      className={cn(\"smwb-list__item\", className, {\n        \"smwb-disabled\": disabled,\n        \"smwb-selected\": selected,\n        \"smwb-list__item_link\": link,\n        \"smwb-list__item_dense\": dense,\n        \"smwb-list__item_divider\": divider,\n      })}\n      data-testid=\"list-item\"\n    >\n      {link ? (\n        <>\n          <a\n            ref={linkRef}\n            className=\"smwb-list__item__link\"\n            data-testid=\"list-item-link\"\n            aria-current={selected ? \"page\" : undefined}\n            // A disabled link has no href, so it is no link to follow or to focus.\n            href={disabled ? undefined : href}\n            target={linkTarget}\n            rel={resolveLinkRel(rel, linkTarget)}\n          >\n            {start}\n            {main}\n          </a>\n          {end}\n        </>\n      ) : (\n        <>\n          {start}\n          {main}\n          {end}\n        </>\n      )}\n    </li>\n  );\n});\n\nexport default ListItem;\n"],"names":["ListItem","forwardRef","className","children","disabled","selected","dense","divider","startAdornment","endAdornment","href","target","rel","onClick","ref","link","interactive","linkTarget","resolveLinkTarget","linkRef","useRef","start","jsx","main","end","_a","cn","jsxs","Fragment","resolveLinkRel"],"mappings":";;;;AAmDO,MAAMA,IAAWC,EAA4D,SAClF,EAAE,WAAAC,GAAW,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,SAAAC,GAAS,gBAAAC,GAAgB,cAAAC,GAAc,MAAAC,GAAM,QAAAC,GAAQ,KAAAC,GAAK,SAAAC,EAAA,GAC5GC,GACA;AACA,QAAMC,IAAO,CAAC,CAACL,GAETM,IAAc,CAAC,CAACH,KAAW,CAACT,KAAY,CAACW,GACzCE,IAAaC,EAAkBP,CAAM,GACrCQ,IAAUC,EAA0B,IAAI,GACxCC,IAAQ,gBAAAC,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAAd,GAAe,GACjEe,IAAO,gBAAAD,EAAC,QAAA,EAAK,WAAU,yBAAyB,UAAAnB,GAAS,GACzDqB,IAAM,gBAAAF,EAAC,QAAA,EAAK,WAAU,wBAAwB,UAAAb,GAAa;AAWjE,SACE,gBAAAa;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAR;AAAA,MACA,MAAK;AAAA,MACL,UAAUE,IAAc,IAAI;AAAA,MAC5B,iBAAeZ,KAAY;AAAA,MAC3B,iBAAgB,CAACW,KAAQV,KAAa;AAAA,MACtC,SAhBFD,KAAY,CAACS,IACT,SACAE,IACE,CAAC,MAAM;;AAEL,SAAIU,IAAAN,EAAQ,YAAR,QAAAM,EAAiB,SAAS,EAAE,aAAyB,CAAC;AAAA,MAC5D,IACAZ;AAAA,MAUJ,WACEG,IACI,CAAC,MAAM;AACL,SAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,eAAA,GACFH,KAAA,QAAAA,EAAU;AAAA,MAEd,IACA;AAAA,MAEN,WAAWa,EAAG,mBAAmBxB,GAAW;AAAA,QAC1C,iBAAiBE;AAAA,QACjB,iBAAiBC;AAAA,QACjB,wBAAwBU;AAAA,QACxB,yBAAyBT;AAAA,QACzB,2BAA2BC;AAAA,MAAA,CAC5B;AAAA,MACD,eAAY;AAAA,MAEX,cACC,gBAAAoB,EAAAC,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAD;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKR;AAAA,YACL,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,gBAAcd,IAAW,SAAS;AAAA,YAElC,MAAMD,IAAW,SAAYM;AAAA,YAC7B,QAAQO;AAAA,YACR,KAAKY,EAAejB,GAAKK,CAAU;AAAA,YAElC,UAAA;AAAA,cAAAI;AAAA,cACAE;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEFC;AAAA,MAAA,EAAA,CACH,IAEA,gBAAAG,EAAAC,GAAA,EACG,UAAA;AAAA,QAAAP;AAAA,QACAE;AAAA,QACAC;AAAA,MAAA,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}

package/dist/headless/components/dataDisplay/qrCode/qrCode.js

@@ -0,0 +1,76 @@
+import { jsxs as f, jsx as d } from "react/jsx-runtime";
+import { forwardRef as A, useMemo as E } from "react";
+import N from "clsx";
+import { encode as q } from "uqr";
+import { qrCodePath as v } from "./qrCodePath.js";
+const x = {
+  "too-long": "QR code: value too long",
+  "encode-failed": "QR code: value could not be encoded"
+}, M = 32, w = 256;
+var _;
+const r = (_ = globalThis.__smwbQrCodeWarnings) != null ? _ : globalThis.__smwbQrCodeWarnings = /* @__PURE__ */ new Set(), b = (e, o) => {
+  r.has(e) || r.size >= M || (r.add(e), console.error(`[smwb] QrCode: ${o}`));
+}, S = (e, o) => {
+  if (e instanceof RangeError && /too long/i.test(e.message)) {
+    const s = Math.ceil(o.length / w);
+    return b(
+      `too-long:${s}`,
+      `value is too long to encode as a QR code (${o.length} characters; this notice is once per ${w}-character band)`
+    ), "too-long";
+  }
+  const n = e instanceof Error ? `${e.name}: ${e.message}` : String(e);
+  return b(`failed:${n}`, `value could not be encoded as a QR code (${n})`), "encode-failed";
+}, P = A(function({
+  className: o,
+  value: n,
+  size: s = 192,
+  caption: l,
+  label: p = "QR code",
+  errorCorrection: i = "M",
+  quietZone: m = 4,
+  "data-testid": C = "qr-code",
+  ...R
+}, $) {
+  var u, h;
+  const a = E(() => {
+    try {
+      return { modules: q(n, { ecc: i, border: 0 }).data, failure: null };
+    } catch (Q) {
+      return { modules: null, failure: S(Q, n) };
+    }
+  }, [n, i]), c = ((h = (u = a.modules) == null ? void 0 : u.length) != null ? h : 0) + 2 * m, g = a.modules ? v(a.modules, m) : "", t = a.failure;
+  return /* @__PURE__ */ f(
+    "figure",
+    {
+      ...R,
+      ref: $,
+      "data-testid": C,
+      "data-error": t != null ? t : void 0,
+      className: N("smwb-qr-code", o),
+      children: [
+        /* @__PURE__ */ f(
+          "svg",
+          {
+            className: "smwb-qr-code__image",
+            role: "img",
+            "aria-label": t === null ? p : x[t],
+            viewBox: `0 0 ${c} ${c}`,
+            width: s,
+            height: s,
+            shapeRendering: "crispEdges",
+            xmlns: "http://www.w3.org/2000/svg",
+            children: [
+              /* @__PURE__ */ d("rect", { className: "smwb-qr-code__light", width: c, height: c, fill: "rgb(255,255,255)" }),
+              g && /* @__PURE__ */ d("path", { className: "smwb-qr-code__dark", d: g, fill: "rgb(0,0,0)" })
+            ]
+          }
+        ),
+        l ? /* @__PURE__ */ d("figcaption", { className: "smwb-qr-code__caption", children: l }) : null
+      ]
+    }
+  );
+});
+export {
+  P as QrCode
+};
+//# sourceMappingURL=qrCode.js.map

package/dist/headless/components/dataDisplay/qrCode/qrCode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"qrCode.js","sources":["../../../../../src/components/dataDisplay/qrCode/qrCode.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport cn from \"clsx\";\nimport { encode } from \"uqr\";\nimport { qrCodePath } from \"./qrCodePath\";\n\n/** Error-correction level: L 7%, M 15%, Q 25%, H 30% of the code may be damaged or covered. */\nexport type QrCodeErrorCorrection = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QrCodeProps extends Omit<React.HTMLAttributes<HTMLElement>, \"children\" | \"role\"> {\n  /** Text encoded in the code (a URL, a pairing token). Encoded as UTF-8 bytes. */\n  value: string;\n  /** Side of the code, quiet zone included, in pixels. Default 192. */\n  size?: number | undefined;\n  /** Shown under the code (a `<figcaption>`), e.g. \"Scan with the phone app\". */\n  caption?: React.ReactNode;\n  /** Accessible name of the image. Default \"QR code\". */\n  label?: string | undefined;\n  /** Error-correction level: L 7%, M 15% (default), Q 25%, H 30% of the code may be damaged or covered. */\n  errorCorrection?: QrCodeErrorCorrection | undefined;\n  /** Light margin around the code in modules. Default 4, the minimum the QR spec asks for; smaller values hurt scanning. */\n  quietZone?: number | undefined;\n  /** Test id of the root; `qr-code` unless given. */\n  \"data-testid\"?: string | undefined;\n}\n\n// Why the encoding failed, as the root's `data-error`, and the name the image takes then.\ntype QrCodeFailure = \"too-long\" | \"encode-failed\";\nconst FAILURE_LABEL: Record<QrCodeFailure, string> = {\n  \"too-long\": \"QR code: value too long\",\n  \"encode-failed\": \"QR code: value could not be encoded\",\n};\n\n// Warns once per distinct cause, never per value: the registry keys on the cause the\n// message reports — a capacity band, or the error text — not on the value, so a\n// `QrCode` bound to a text field neither keeps a multi-KB string alive per keystroke nor\n// logs a new line for every character typed. The cap bounds the registry itself: past it\n// the warning stays quiet instead of growing. It lives on globalThis so the server bundle\n// and the client module of one SSR runtime share it: the cause logs once per runtime, not\n// once per bundle. A process.env guard is deliberately not used — like dagView.tsx it\n// would silence only dev SSR.\nconst MAX_WARNED_CAUSES = 32;\nconst CAPACITY_BAND = 256; // characters: one notice per band, not per length\nconst warnedCauses = ((globalThis as { __smwbQrCodeWarnings?: Set<string> }).__smwbQrCodeWarnings ??= new Set());\nconst warnOnce = (cause: string, message: string): void => {\n  if (warnedCauses.has(cause) || warnedCauses.size >= MAX_WARNED_CAUSES) {\n    return;\n  }\n  warnedCauses.add(cause);\n  // eslint-disable-next-line no-console\n  console.error(`[smwb] QrCode: ${message}`);\n};\n\n// `uqr` reports a value past the QR capacity as a RangeError(\"Data too long\"); it throws\n// other errors for other inputs (a lone surrogate fails in `encodeURI`, an untyped\n// `errorCorrection` fails in its own lookup). Only the first of those is \"too long\", so\n// the failure is read off the error instead of assumed, and the rest are named as what\n// they are.\nconst noteEncodeFailure = (error: unknown, value: string): QrCodeFailure => {\n  if (error instanceof RangeError && /too long/i.test(error.message)) {\n    const band = Math.ceil(value.length / CAPACITY_BAND);\n    warnOnce(\n      `too-long:${band}`,\n      `value is too long to encode as a QR code (${value.length} characters; this notice is once per ` +\n        `${CAPACITY_BAND}-character band)`\n    );\n    return \"too-long\";\n  }\n  const reason = error instanceof Error ? `${error.name}: ${error.message}` : String(error);\n  warnOnce(`failed:${reason}`, `value could not be encoded as a QR code (${reason})`);\n  return \"encode-failed\";\n};\n\n/**\n * A QR code of `value` as an SVG image (role=img): dark modules on a white square —\n * including the quiet zone — in every theme, so a phone camera reads it in dark mode\n * too. With `caption` the code sits in a `<figure>` named by the caption. A `value`\n * past the QR capacity renders an empty white square with `data-error=\"too-long\"`,\n * any other encode failure with `data-error=\"encode-failed\"`, instead of throwing.\n */\nexport const QrCode = forwardRef<HTMLElement, QrCodeProps>(function QrCode(\n  {\n    className,\n    value,\n    size = 192,\n    caption,\n    label = \"QR code\",\n    errorCorrection = \"M\",\n    quietZone = 4,\n    \"data-testid\": dataTestId = \"qr-code\",\n    ...rest\n  },\n  ref\n) {\n  const encoded = useMemo(() => {\n    try {\n      return { modules: encode(value, { ecc: errorCorrection, border: 0 }).data, failure: null };\n    } catch (error) {\n      return { modules: null, failure: noteEncodeFailure(error, value) };\n    }\n  }, [value, errorCorrection]);\n\n  // N: the whole canvas in modules — matrix plus the quiet zone on every side.\n  const moduleCount = encoded.modules?.length ?? 0;\n  const canvas = moduleCount + 2 * quietZone;\n  const path = encoded.modules ? qrCodePath(encoded.modules, quietZone) : \"\";\n  const failure = encoded.failure;\n\n  return (\n    <figure\n      {...rest}\n      ref={ref}\n      data-testid={dataTestId}\n      data-error={failure ?? undefined}\n      className={cn(\"smwb-qr-code\", className)}\n    >\n      <svg\n        className=\"smwb-qr-code__image\"\n        role=\"img\"\n        aria-label={failure === null ? label : FAILURE_LABEL[failure]}\n        viewBox={`0 0 ${canvas} ${canvas}`}\n        width={size}\n        height={size}\n        shapeRendering=\"crispEdges\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect className=\"smwb-qr-code__light\" width={canvas} height={canvas} fill=\"rgb(255,255,255)\" />\n        {path && <path className=\"smwb-qr-code__dark\" d={path} fill=\"rgb(0,0,0)\" />}\n      </svg>\n      {caption ? <figcaption className=\"smwb-qr-code__caption\">{caption}</figcaption> : null}\n    </figure>\n  );\n});\n\nexport default QrCode;\n"],"names":["FAILURE_LABEL","MAX_WARNED_CAUSES","CAPACITY_BAND","warnedCauses","_a","warnOnce","cause","message","noteEncodeFailure","error","value","band","reason","QrCode","forwardRef","className","size","caption","label","errorCorrection","quietZone","dataTestId","rest","ref","encoded","useMemo","encode","canvas","_b","path","qrCodePath","failure","jsxs","cn","jsx"],"mappings":";;;;;AA2BA,MAAMA,IAA+C;AAAA,EACnD,YAAY;AAAA,EACZ,iBAAiB;AACnB,GAUMC,IAAoB,IACpBC,IAAgB;;AACtB,MAAMC,KAAiBC,IAAA,WAAsD,yBAAtD,OAAAA,IAAA,WAAsD,uBAAyB,oBAAI,IAAA,GACpGC,IAAW,CAACC,GAAeC,MAA0B;AACzD,EAAIJ,EAAa,IAAIG,CAAK,KAAKH,EAAa,QAAQF,MAGpDE,EAAa,IAAIG,CAAK,GAEtB,QAAQ,MAAM,kBAAkBC,CAAO,EAAE;AAC3C,GAOMC,IAAoB,CAACC,GAAgBC,MAAiC;AAC1E,MAAID,aAAiB,cAAc,YAAY,KAAKA,EAAM,OAAO,GAAG;AAClE,UAAME,IAAO,KAAK,KAAKD,EAAM,SAASR,CAAa;AACnD,WAAAG;AAAA,MACE,YAAYM,CAAI;AAAA,MAChB,6CAA6CD,EAAM,MAAM,wCACpDR,CAAa;AAAA,IAAA,GAEb;AAAA,EACT;AACA,QAAMU,IAASH,aAAiB,QAAQ,GAAGA,EAAM,IAAI,KAAKA,EAAM,OAAO,KAAK,OAAOA,CAAK;AACxF,SAAAJ,EAAS,UAAUO,CAAM,IAAI,4CAA4CA,CAAM,GAAG,GAC3E;AACT,GASaC,IAASC,EAAqC,SACzD;AAAA,EACE,WAAAC;AAAA,EACA,OAAAL;AAAA,EACA,MAAAM,IAAO;AAAA,EACP,SAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,iBAAAC,IAAkB;AAAA,EAClB,WAAAC,IAAY;AAAA,EACZ,eAAeC,IAAa;AAAA,EAC5B,GAAGC;AACL,GACAC,GACA;;AACA,QAAMC,IAAUC,EAAQ,MAAM;AAC5B,QAAI;AACF,aAAO,EAAE,SAASC,EAAOhB,GAAO,EAAE,KAAKS,GAAiB,QAAQ,EAAA,CAAG,EAAE,MAAM,SAAS,KAAA;AAAA,IACtF,SAASV,GAAO;AACd,aAAO,EAAE,SAAS,MAAM,SAASD,EAAkBC,GAAOC,CAAK,EAAA;AAAA,IACjE;AAAA,EACF,GAAG,CAACA,GAAOS,CAAe,CAAC,GAIrBQ,MADcC,KAAAxB,IAAAoB,EAAQ,YAAR,gBAAApB,EAAiB,WAAjB,OAAAwB,IAA2B,KAClB,IAAIR,GAC3BS,IAAOL,EAAQ,UAAUM,EAAWN,EAAQ,SAASJ,CAAS,IAAI,IAClEW,IAAUP,EAAQ;AAExB,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGV;AAAA,MACJ,KAAAC;AAAA,MACA,eAAaF;AAAA,MACb,cAAYU,KAAA,OAAAA,IAAW;AAAA,MACvB,WAAWE,EAAG,gBAAgBlB,CAAS;AAAA,MAEvC,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,cAAYD,MAAY,OAAOb,IAAQlB,EAAc+B,CAAO;AAAA,YAC5D,SAAS,OAAOJ,CAAM,IAAIA,CAAM;AAAA,YAChC,OAAOX;AAAA,YACP,QAAQA;AAAA,YACR,gBAAe;AAAA,YACf,OAAM;AAAA,YAEN,UAAA;AAAA,cAAA,gBAAAkB,EAAC,QAAA,EAAK,WAAU,uBAAsB,OAAOP,GAAQ,QAAQA,GAAQ,MAAK,mBAAA,CAAmB;AAAA,cAC5FE,uBAAS,QAAA,EAAK,WAAU,sBAAqB,GAAGA,GAAM,MAAK,aAAA,CAAa;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAE1EZ,IAAU,gBAAAiB,EAAC,cAAA,EAAW,WAAU,yBAAyB,aAAQ,IAAgB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGxF,CAAC;"}

package/dist/headless/components/dataDisplay/qrCode/qrCodePath.js

@@ -0,0 +1,20 @@
+function i(n, o) {
+  const r = [];
+  for (let l = 0; l < n.length; l += 1) {
+    const h = n[l];
+    let e = 0;
+    for (; h !== void 0 && e < h.length; )
+      if (h[e]) {
+        let t = 1;
+        for (; e + t < h.length && h[e + t]; )
+          t += 1;
+        r.push(`M${e + o} ${l + o}h${t}v1h-${t}z`), e += t;
+      } else
+        e += 1;
+  }
+  return r.join("");
+}
+export {
+  i as qrCodePath
+};
+//# sourceMappingURL=qrCodePath.js.map

package/dist/headless/components/dataDisplay/qrCode/qrCodePath.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"qrCodePath.js","sources":["../../../../../src/components/dataDisplay/qrCode/qrCodePath.ts"],"sourcesContent":["/**\n * The `d` string of the QR code's dark modules: one run-length subpath per horizontal\n * run of dark modules (`M{x} {y}h{n}v1h-{n}z`), in row order and offset by the quiet\n * zone. Pure and deterministic — the same matrix always yields the same string, on the\n * server and in the browser, in ui-react and ui-solid.\n */\nexport function qrCodePath(data: readonly (readonly boolean[])[], quietZone: number): string {\n  const parts: string[] = [];\n  for (let y = 0; y < data.length; y += 1) {\n    const row = data[y];\n    let x = 0;\n    while (row !== undefined && x < row.length) {\n      if (row[x]) {\n        let run = 1;\n        while (x + run < row.length && row[x + run]) {\n          run += 1;\n        }\n        parts.push(`M${x + quietZone} ${y + quietZone}h${run}v1h-${run}z`);\n        x += run;\n      } else {\n        x += 1;\n      }\n    }\n  }\n  return parts.join(\"\");\n}\n"],"names":["qrCodePath","data","quietZone","parts","y","row","x","run"],"mappings":"AAMO,SAASA,EAAWC,GAAuCC,GAA2B;AAC3F,QAAMC,IAAkB,CAAA;AACxB,WAASC,IAAI,GAAGA,IAAIH,EAAK,QAAQG,KAAK,GAAG;AACvC,UAAMC,IAAMJ,EAAKG,CAAC;AAClB,QAAIE,IAAI;AACR,WAAOD,MAAQ,UAAaC,IAAID,EAAI;AAClC,UAAIA,EAAIC,CAAC,GAAG;AACV,YAAIC,IAAM;AACV,eAAOD,IAAIC,IAAMF,EAAI,UAAUA,EAAIC,IAAIC,CAAG;AACxC,UAAAA,KAAO;AAET,QAAAJ,EAAM,KAAK,IAAIG,IAAIJ,CAAS,IAAIE,IAAIF,CAAS,IAAIK,CAAG,OAAOA,CAAG,GAAG,GACjED,KAAKC;AAAA,MACP;AACE,QAAAD,KAAK;AAAA,EAGX;AACA,SAAOH,EAAM,KAAK,EAAE;AACtB;"}

package/dist/headless/components/dataDisplay/statusDot/statusDot.js

@@ -0,0 +1,28 @@
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as b } from "react";
+import f from "clsx";
+const $ = b(function({ className: d, status: t, color: o, size: m = "md", pulse: s, label: i, "data-testid": r = "status-dot", ...n }, w) {
+  const a = t != null ? t : o === void 0 ? "unknown" : void 0;
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      ...n,
+      ref: w,
+      role: "img",
+      "aria-label": i,
+      "data-testid": r,
+      className: f(
+        "smwb-status-dot",
+        `smwb-status-dot_size-${m}`,
+        a && `smwb-status-dot_status-${a}`,
+        o && `smwb-status-dot_color-${o}`,
+        { "smwb-status-dot_pulse": s != null ? s : t === "active" },
+        d
+      )
+    }
+  );
+});
+export {
+  $ as StatusDot
+};
+//# sourceMappingURL=statusDot.js.map

package/dist/headless/components/dataDisplay/statusDot/statusDot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"statusDot.js","sources":["../../../../../src/components/dataDisplay/statusDot/statusDot.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes } from \"react\";\nimport cn from \"clsx\";\n\n/** What the marker says: `active` is under way, `attention` waits for someone, `idle` rests, `done` is finished. */\nexport type StatusDotStatus = \"active\" | \"attention\" | \"idle\" | \"done\" | \"error\" | \"unknown\";\n\n/** The theme colour names `Chip` takes; `default` is the neutral on-surface colour. */\nexport type StatusDotColor = \"default\" | \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport type StatusDotSize = \"sm\" | \"md\";\n\nexport interface StatusDotProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"role\" | \"children\" | \"aria-label\"> {\n  /** Class name(s) for the dot's root `<span>`. */\n  className?: string;\n  /**\n   * What the dot says, and so its colour: `active` info, `attention` warning, `idle` neutral, `done` success,\n   * `error` error. `unknown` is a ring in the outline colour. Without `status` (and without `color`) the dot is\n   * `unknown`.\n   */\n  status?: StatusDotStatus | undefined;\n  /**\n   * A theme colour instead of the status's own, or on its own with no `status` (a plain disc). Given with a\n   * `status`, the status still sets the shape.\n   */\n  color?: StatusDotColor | undefined;\n  /** `md` (12px) unless given; `sm` is 8px. */\n  size?: StatusDotSize | undefined;\n  /**\n   * A ring spreads from the dot. On unless given for `active`, off for every other status. Never drawn while the\n   * user prefers reduced motion.\n   */\n  pulse?: boolean | undefined;\n  /** What the dot means in words, e.g. \"Working\": the accessible name, read by assistive technology. */\n  label: string;\n  /** Test id of the root; `status-dot` unless given. */\n  \"data-testid\"?: string | undefined;\n}\n\n/** A small status marker: a dot coloured and shaped by `status`, named by `label`. */\nexport const StatusDot = forwardRef<HTMLSpanElement, StatusDotProps>(function StatusDot(\n  { className, status, color, size = \"md\", pulse, label, \"data-testid\": dataTestId = \"status-dot\", ...rest },\n  ref\n) {\n  // A bare colour is a plain disc; with neither, the dot is \"unknown\".\n  const shown = status ?? (color === undefined ? \"unknown\" : undefined);\n  return (\n    <span\n      {...rest}\n      ref={ref}\n      role=\"img\"\n      aria-label={label}\n      data-testid={dataTestId}\n      className={cn(\n        \"smwb-status-dot\",\n        `smwb-status-dot_size-${size}`,\n        shown && `smwb-status-dot_status-${shown}`,\n        color && `smwb-status-dot_color-${color}`,\n        { \"smwb-status-dot_pulse\": pulse ?? status === \"active\" },\n        className\n      )}\n    />\n  );\n});\n\nexport default StatusDot;\n"],"names":["StatusDot","forwardRef","className","status","color","size","pulse","label","dataTestId","rest","ref","shown","jsx","cn"],"mappings":";;;AAuCO,MAAMA,IAAYC,EAA4C,SACnE,EAAE,WAAAC,GAAW,QAAAC,GAAQ,OAAAC,GAAO,MAAAC,IAAO,MAAM,OAAAC,GAAO,OAAAC,GAAO,eAAeC,IAAa,cAAc,GAAGC,EAAA,GACpGC,GACA;AAEA,QAAMC,IAAQR,KAAA,OAAAA,IAAWC,MAAU,SAAY,YAAY;AAC3D,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGH;AAAA,MACJ,KAAAC;AAAA,MACA,MAAK;AAAA,MACL,cAAYH;AAAA,MACZ,eAAaC;AAAA,MACb,WAAWK;AAAA,QACT;AAAA,QACA,wBAAwBR,CAAI;AAAA,QAC5BM,KAAS,0BAA0BA,CAAK;AAAA,QACxCP,KAAS,yBAAyBA,CAAK;AAAA,QACvC,EAAE,yBAAyBE,KAAA,OAAAA,IAASH,MAAW,SAAA;AAAA,QAC/CD;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN,CAAC;"}

package/dist/headless/components/dataDisplay/swimlanes/swimlanes.js

@@ -0,0 +1,355 @@
+import { jsx as F, jsxs as Me } from "react/jsx-runtime";
+import s from "react";
+import ie from "clsx";
+import { useControllableState as He } from "../../../hooks/useControllableState.js";
+import { useEventCallback as Q } from "../../../hooks/useEventCallback.js";
+import { useForkRef as Te } from "../../../hooks/useForkRef.js";
+import { useSafeLayoutEffect as D } from "../../../hooks/useSafeLayoutEffect.js";
+import { useVirtualList as Ce } from "../../../hooks/useVirtualList.js";
+import { isOwnClick as Le } from "../../../utils/ownClick.js";
+const ke = 64, Ke = 480, De = 4, Fe = 'a[href], button, input, select, textarea, iframe, summary, audio[controls], video[controls], [tabindex], [contenteditable]:not([contenteditable="false"])', X = (w) => typeof w == "number" ? `${w}px` : w, Ne = (w, c) => w.length === c.length && w.every((a, p) => a === c[p]);
+function ze(w, c, a, p) {
+  const x = p.count - 1;
+  if (x < 0) return null;
+  const u = (d) => Math.min(x, Math.max(0, d)), h = (d) => d === a.index ? null : { index: d, col: a.col }, b = (d) => d === a.col ? null : { index: a.index, col: d };
+  if (c.ctrlKey || c.metaKey || c.altKey)
+    return !c.ctrlKey || c.metaKey || c.altKey ? null : w === "Home" ? h(0) : w === "End" ? h(x) : null;
+  switch (w) {
+    case "ArrowDown":
+      return h(u(a.index + 1));
+    case "ArrowUp":
+      return h(u(a.index - 1));
+    case "ArrowRight":
+      return b(1);
+    case "ArrowLeft":
+      return b(0);
+    case "Home":
+      return b(0);
+    case "End":
+      return b(1);
+    case "PageDown":
+      return h(u(a.index + p.pageSize));
+    case "PageUp":
+      return h(u(a.index - p.pageSize));
+    default:
+      return null;
+  }
+}
+const Oe = s.memo(function({
+  lane: c,
+  index: a,
+  selected: p,
+  selectable: x,
+  tabCol: u,
+  rowHeight: h,
+  handlers: b
+}) {
+  const d = (C, M, g, L) => /* @__PURE__ */ F(
+    "div",
+    {
+      className: M,
+      role: C,
+      tabIndex: u === g ? 0 : -1,
+      onClick: (R) => b.onCellClick(R, c.id, g),
+      onFocus: (R) => b.onCellFocus(R, c.id, g),
+      children: L
+    }
+  );
+  return /* @__PURE__ */ Me(
+    "div",
+    {
+      className: ie("smwb-swimlanes__row", {
+        "smwb-swimlanes__row_selected": p,
+        "smwb-swimlanes__row_disabled": !!c.disabled
+      }),
+      role: "row",
+      "aria-rowindex": a + 1,
+      "aria-selected": x ? p : void 0,
+      "aria-disabled": c.disabled ? !0 : void 0,
+      "data-lane-id": c.id,
+      style: { top: a * h },
+      ref: (C) => {
+        b.registerRow(c.id, C);
+      },
+      children: [
+        d("rowheader", "smwb-swimlanes__header", 0, c.header),
+        d("gridcell", "smwb-swimlanes__content", 1, c.content)
+      ]
+    }
+  );
+}), Pe = s.forwardRef(function(c, a) {
+  const {
+    className: p,
+    style: x,
+    lanes: u,
+    label: h,
+    selectedId: b,
+    defaultSelectedId: d,
+    onSelectedChange: C,
+    selectable: M = !0,
+    rowHeight: g = ke,
+    headerWidth: L,
+    contentMinWidth: R,
+    height: k,
+    overscan: ue = De,
+    emptyLabel: ae,
+    onScroll: B,
+    onKeyDown: V,
+    "data-testid": de = "swimlanes",
+    ...fe
+  } = c, H = s.useRef(null), j = s.useRef(null), N = s.useRef(/* @__PURE__ */ new Map()), me = Te(a, H), G = u.length === 0, y = s.useMemo(() => {
+    const e = /* @__PURE__ */ new Map();
+    return u.forEach((t, n) => {
+      e.has(t.id) || e.set(t.id, n);
+    }), e;
+  }, [u]), $ = s.useMemo(() => [...y.keys()], [y]), q = s.useRef($);
+  Ne(q.current, $) || (q.current = $);
+  const E = q.current, [we, Y] = He({
+    value: b,
+    defaultValue: d != null ? d : null,
+    onChange: C
+  }), _ = M ? we : null, [T, z] = s.useState(null), S = s.useMemo(() => {
+    if (T !== null && y.has(T.laneId)) return T;
+    if (_ !== null && y.has(_)) return { laneId: _, col: 0 };
+    const e = E[0];
+    return e === void 0 ? null : { laneId: e, col: 0 };
+  }, [T, _, y, E]), Z = s.useRef(S);
+  Z.current = S;
+  const he = typeof k == "number" ? k : Ke, [ee, pe] = s.useState(0), J = ee > 0 ? ee : he, I = Ce({
+    itemCount: u.length,
+    itemHeight: g,
+    viewportHeight: J,
+    overscan: ue
+  }), P = s.useMemo(() => {
+    const e = /* @__PURE__ */ new Set();
+    for (let t = I.startIndex; t < I.endIndex; t++) e.add(t);
+    if (S !== null) {
+      const t = y.get(S.laneId);
+      t !== void 0 && e.add(t);
+    }
+    return [...e].sort((t, n) => t - n);
+  }, [I.startIndex, I.endIndex, S, y]), be = s.useMemo(() => P.map((e) => {
+    var t, n;
+    return (n = (t = u[e]) == null ? void 0 : t.id) != null ? n : "";
+  }).join("|"), [P, u]), f = s.useRef({
+    selectable: M,
+    selected: _,
+    setSelected: Y,
+    active: T,
+    viewportHeight: J,
+    rowHeight: g,
+    lanes: u,
+    indexById: y,
+    onScroll: I.onScroll
+  });
+  f.current = {
+    selectable: M,
+    selected: _,
+    setSelected: Y,
+    active: T,
+    viewportHeight: J,
+    rowHeight: g,
+    lanes: u,
+    indexById: y,
+    onScroll: I.onScroll
+  };
+  const ge = (e, t) => {
+    var o;
+    const n = (o = N.current.get(e)) == null ? void 0 : o.children[t];
+    return n instanceof HTMLElement ? n : null;
+  }, ye = (e) => {
+    const t = H.current, n = j.current;
+    if (t === null || n === null || !(e instanceof Element)) return null;
+    const o = e.getAttribute("role");
+    if (o !== "rowheader" && o !== "gridcell") return null;
+    const i = o === "rowheader" ? 0 : 1, r = e.parentElement;
+    if (r === null || r.parentElement !== n || n.parentElement !== t) return null;
+    const l = r.dataset.laneId;
+    return l === void 0 ? null : { laneId: l, col: i };
+  }, O = s.useRef(null), Se = (e) => {
+    const t = H.current;
+    if (t === null) return;
+    const { rowHeight: n, viewportHeight: o } = f.current, i = t.clientHeight || o, r = e * n, l = r < t.scrollTop ? r : r + n > t.scrollTop + i ? r + n - i : t.scrollTop;
+    l !== t.scrollTop && (t.scrollTop = l, f.current.onScroll({ currentTarget: { scrollTop: l } }));
+  }, ve = (e, t) => {
+    const n = f.current.lanes[e];
+    n !== void 0 && (Se(e), z({ laneId: n.id, col: t }), O.current = { laneId: n.id, col: t });
+  }, xe = () => {
+    var o;
+    const { rowHeight: e, viewportHeight: t } = f.current, n = ((o = H.current) == null ? void 0 : o.clientHeight) || t;
+    return Math.max(1, Math.floor(n / e) - 1);
+  }, te = (e) => {
+    const { selectable: t, selected: n, setSelected: o } = f.current;
+    if (!t) return;
+    const i = f.current.indexById.get(e), r = i === void 0 ? void 0 : f.current.lanes[i];
+    r === void 0 || r.disabled || n !== e && o(e);
+  }, ne = Q(
+    (e, t, n) => {
+      Le(e, e.currentTarget) && (z({ laneId: t, col: n }), te(t));
+    }
+  ), re = Q(
+    (e, t, n) => {
+      e.currentTarget.contains(e.target) && z({ laneId: t, col: n });
+    }
+  ), oe = Q((e, t) => {
+    t !== null ? N.current.set(e, t) : N.current.delete(e);
+  }), Ie = s.useMemo(
+    () => ({ onCellClick: ne, onCellFocus: re, registerRow: oe }),
+    [ne, re, oe]
+  ), Re = (e) => {
+    V == null || V(e);
+    const t = ye(e.target);
+    if (t === null) return;
+    const { ctrlKey: n, metaKey: o, altKey: i } = e;
+    if (!n && !o && !i) {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault(), te(t.laneId);
+        return;
+      }
+      if (e.key === "Escape") {
+        if (f.current.selected === null) return;
+        e.preventDefault(), f.current.setSelected(null);
+        return;
+      }
+    }
+    const r = f.current.indexById.get(t.laneId);
+    if (r === void 0) return;
+    const l = ze(
+      e.key,
+      { ctrlKey: n, metaKey: o, altKey: i },
+      { index: r, col: t.col },
+      { count: f.current.lanes.length, pageSize: xe() }
+    );
+    l !== null && (e.preventDefault(), ve(l.index, l.col));
+  }, Ee = (e) => {
+    B == null || B(e), I.onScroll(e);
+  };
+  D(() => {
+    const e = H.current;
+    if (e === null || typeof ResizeObserver != "function") return;
+    const t = new ResizeObserver(() => {
+      pe(e.clientHeight);
+    });
+    return t.observe(e), () => t.disconnect();
+  }, []), D(() => {
+    var t;
+    const e = O.current;
+    e !== null && (O.current = null, (t = ge(e.laneId, e.col)) == null || t.focus({ preventScroll: !0 }));
+  });
+  const se = s.useRef(null);
+  D(() => {
+    var v;
+    const e = se.current;
+    if (se.current = E, e === null || e === E) return;
+    const t = new Set(E), { selected: n, setSelected: o, active: i } = f.current, r = n !== null && !t.has(n) && e.includes(n);
+    if (r && o(null), i === null || t.has(i.laneId)) return;
+    z(null);
+    const l = (v = H.current) == null ? void 0 : v.ownerDocument;
+    if (l === void 0 || l.activeElement !== null && l.activeElement !== l.body) return;
+    const A = !r && n !== null && t.has(n) ? n : E[0];
+    A !== void 0 && (O.current = { laneId: A, col: 0 });
+  }, [E]);
+  const le = s.useRef(/* @__PURE__ */ new WeakMap()), ce = s.useRef(/* @__PURE__ */ new WeakMap()), W = s.useCallback(() => {
+    var o, i, r, l;
+    const e = (i = (o = Z.current) == null ? void 0 : o.laneId) != null ? i : null, t = le.current, n = ce.current;
+    for (const [A, v] of N.current)
+      for (const U of Array.from(v.children))
+        for (const m of U.querySelectorAll(Fe)) {
+          t.has(m) || t.set(m, m.getAttribute("tabindex")), m.getAttribute("tabindex") !== ((r = n.get(m)) != null ? r : null) && t.set(m, m.getAttribute("tabindex"));
+          const K = A === e ? (l = t.get(m)) != null ? l : null : "-1";
+          if (m.getAttribute("tabindex") === K) {
+            n.set(m, K);
+            continue;
+          }
+          K === null ? m.removeAttribute("tabindex") : m.setAttribute("tabindex", K), n.set(m, K);
+        }
+  }, []);
+  D(() => {
+    W();
+  }, [S, be, W]), D(() => {
+    const e = j.current;
+    if (e === null || typeof MutationObserver != "function") return;
+    const t = new MutationObserver((n) => {
+      var l;
+      const o = le.current, i = ce.current;
+      let r = !1;
+      for (const A of n) {
+        if (A.type !== "attributes") {
+          r = !0;
+          continue;
+        }
+        const v = A.target;
+        if (!i.has(v)) continue;
+        const U = v.getAttribute("tabindex");
+        U !== ((l = i.get(v)) != null ? l : null) && (o.set(v, U), r = !0);
+      }
+      r && W();
+    });
+    return t.observe(e, {
+      childList: !0,
+      subtree: !0,
+      attributes: !0,
+      attributeFilter: ["tabindex"]
+    }), () => t.disconnect();
+  }, [W]);
+  const _e = G ? {} : {
+    role: "grid",
+    "aria-rowcount": u.length,
+    "aria-colcount": 2,
+    ...h === void 0 ? {} : { "aria-label": h }
+  }, Ae = s.useMemo(() => {
+    const e = {};
+    k !== void 0 && (e.height = X(k));
+    const t = e;
+    return t["--smwb-swimlanes-row-height"] = `${g}px`, L !== void 0 && (t["--smwb-swimlanes-header-width"] = X(L)), R !== void 0 && (t["--smwb-swimlanes-content-min-width"] = X(R)), { ...e, ...x };
+  }, [k, g, L, R, x]);
+  return /* @__PURE__ */ F(
+    "div",
+    {
+      ...fe,
+      ref: me,
+      "data-testid": de,
+      className: ie("smwb-swimlanes", { "smwb-swimlanes_empty": G }, p),
+      style: Ae,
+      ..._e,
+      onScroll: Ee,
+      onKeyDown: Re,
+      children: G ? (
+        // No grid role and no row count: an empty grid has no rows, which fails
+        // the role's required children.
+        /* @__PURE__ */ F("div", { className: "smwb-swimlanes__empty", children: ae })
+      ) : /* @__PURE__ */ F(
+        "div",
+        {
+          className: "smwb-swimlanes__sizer",
+          role: "presentation",
+          ref: j,
+          style: { height: I.totalHeight },
+          children: P.map((e) => {
+            const t = u[e];
+            return t === void 0 ? null : /* @__PURE__ */ F(
+              Oe,
+              {
+                lane: t,
+                index: e,
+                selected: _ === t.id,
+                selectable: M,
+                tabCol: S !== null && S.laneId === t.id ? S.col : -1,
+                rowHeight: g,
+                handlers: Ie
+              },
+              t.id
+            );
+          })
+        }
+      )
+    }
+  );
+});
+export {
+  Ke as SWIMLANES_DEFAULT_HEIGHT,
+  De as SWIMLANES_DEFAULT_OVERSCAN,
+  ke as SWIMLANES_DEFAULT_ROW_HEIGHT,
+  Pe as Swimlanes
+};
+//# sourceMappingURL=swimlanes.js.map