@k2b/ui 0.20.0 → 0.22.0

package/dist/browser/layout/navigation-model.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["layout/navigation-model.ts"],"sourcesContent":["import type { LinkNavigateEvent, NavigationScrollMode } from \"@k2b/ssr/nav\";\nimport type { Accessor } from \"solid-js\";\nimport type { IntentTone } from \"../semantics\";\n\n/** A status icon at a row's end, such as \"running\". `label` names it for screen readers and as its tooltip. */\nexport type NavigationStatus = { icon: string; label: string; tone?: IntentTone };\n\ntype NavigationEntry = {\n  id: string;\n  label: string;\n  icon?: string;\n  /** Names a meaningful icon for screen readers, such as \"Homepage\"; without it the icon is decorative. */\n  iconLabel?: string;\n  badge?: string | number;\n  description?: string;\n  /**\n   * Status icon in a fixed-size slot at the row's end. Set `null` on a row whose status comes and goes: the empty slot\n   * keeps its place, so a status change never rewraps the label or moves the rows below.\n   */\n  status?: NavigationStatus | null;\n  active?: boolean;\n  disabled?: boolean;\n  color?: string;\n  children?: readonly NavigationItem[];\n  /** Initial disclosure state; subsequent toggles remain local to the renderer. */\n  defaultExpanded?: boolean;\n  /** Owner-held disclosure state. The renderer shows it and reports toggles through `onExpandedChange`. */\n  expanded?: boolean;\n  actions?: readonly NavigationItem[];\n  /**\n   * Square icon buttons in the row, before the `actions` menu. They run an `action`; a destination belongs in a row,\n   * where its link keeps modified clicks and new tabs.\n   */\n  inlineActions?: readonly { id: string; label: string; icon: string; action: string; disabled?: boolean }[];\n};\n\n/** Serializable presentation. Functions stay with the controller's owning island. */\nexport type NavigationItem = NavigationEntry &\n  (\n    | { href: string; action?: string; navigation?: \"document\" | \"enhanced\"; scroll?: NavigationScrollMode; section?: never }\n    | { action: string; href?: never; navigation?: never; scroll?: never; section?: never }\n    | {\n        href?: never;\n        action?: never;\n        navigation?: never;\n        scroll?: never;\n        children: readonly NavigationItem[];\n        /** Shows the group as a plain heading over its rows, always open and not indented, instead of a disclosure. */\n        section?: boolean;\n      }\n  );\n\nexport type NavigationOptions = {\n  items: Accessor<readonly NavigationItem[]>;\n  onAction?: (action: string) => void | Promise<void>;\n  onNavigate?: (event: LinkNavigateEvent) => void | Promise<void>;\n  /** Receives disclosure toggles of items that carry `expanded`; the owner decides the next state. */\n  onExpandedChange?: (id: string, expanded: boolean) => void;\n};\n\nexport function findNavigationItem(items: readonly NavigationItem[], id: string): NavigationItem | undefined {\n  for (const item of items) {\n    if (item.disabled) continue;\n    if (item.id === id) return item;\n    const found =\n      findNavigationItem(item.children ?? [], id) ??\n      findNavigationItem(item.inlineActions ?? [], id) ??\n      findNavigationItem(item.actions ?? [], id);\n    if (found) return found;\n  }\n}\n\n/** One live source for renderers; no router, registry, fetching or persisted state. */\nexport function createNavigation(options: NavigationOptions) {\n  return {\n    items: options.items,\n    onNavigate: options.onNavigate,\n    onExpandedChange: options.onExpandedChange,\n    async activate(id: string) {\n      const item = findNavigationItem(options.items(), id);\n      if (item?.action) await options.onAction?.(item.action);\n    },\n  };\n}\n\nexport type NavigationController = ReturnType<typeof createNavigation>;\n"],"mappings":"AAIA;;AAgCA;;AAwBA,OAAO,SAAS,kBAAkB,CAAC,KAAgC,EAAE,EAAU,EAA8B;EAC3G,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;IACxB,IAAI,IAAI,CAAC,QAAQ,EAAE;IACnB,IAAI,IAAI,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,IAAI;IAC/B,MAAM,KAAK,GACT,kBAAkB,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,EAAE,EAAE,CAAC,IAC3C,kBAAkB,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,EAAE,EAAE,CAAC,IAChD,kBAAkB,CAAC,IAAI,CAAC,OAAO,IAAI,EAAE,EAAE,EAAE,CAAC;IAC5C,IAAI,KAAK,EAAE,OAAO,KAAK;EACzB;AACF;;AAEA;AACA,OAAO,SAAS,gBAAgB,CAAC,OAA0B,EAAE;EAC3D,OAAO;IACL,KAAK,EAAE,OAAO,CAAC,KAAK;IACpB,UAAU,EAAE,OAAO,CAAC,UAAU;IAC9B,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;IAC1C,MAAM,QAAQ,CAAC,EAAU,EAAE;MACzB,MAAM,IAAI,GAAG,kBAAkB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC;MACpD,IAAI,IAAI,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC;IACzD;EACF,CAAC;AACH","ignoreList":[]}
+{"version":3,"names":[],"sources":["layout/navigation-model.ts"],"sourcesContent":["import type { LinkNavigateEvent, NavigationScrollMode } from \"@k2b/ssr/nav\";\nimport type { Accessor } from \"solid-js\";\nimport type { IntentTone } from \"../semantics\";\n\n/** A status icon at a row's end, such as \"running\". `label` names it for screen readers and as its tooltip. */\nexport type NavigationStatus = { icon: string; label: string; tone?: IntentTone };\n\ntype NavigationEntry = {\n  id: string;\n  label: string;\n  icon?: string;\n  /** Names a meaningful icon for screen readers, such as \"Homepage\"; without it the icon is decorative. */\n  iconLabel?: string;\n  badge?: string | number;\n  description?: string;\n  /**\n   * Status icon in a fixed-size slot at the row's end. Set `null` on a row whose status comes and goes: the empty slot\n   * keeps its place, so a status change never rewraps the label or moves the rows below.\n   */\n  status?: NavigationStatus | null;\n  active?: boolean;\n  disabled?: boolean;\n  color?: string;\n  children?: readonly NavigationItem[];\n  /** Initial disclosure state; subsequent toggles remain local to the renderer. */\n  defaultExpanded?: boolean;\n  /** Owner-held disclosure state. The renderer shows it and reports toggles through `onExpandedChange`. */\n  expanded?: boolean;\n  actions?: readonly NavigationItem[];\n  /**\n   * Square icon buttons in the row, before the `actions` menu. They run an `action`; a destination belongs in a row,\n   * where its link keeps modified clicks and new tabs.\n   */\n  inlineActions?: readonly { id: string; label: string; icon: string; action: string; disabled?: boolean }[];\n};\n\n/** Serializable presentation. Functions stay with the controller's owning island. */\nexport type NavigationItem = NavigationEntry &\n  (\n    | {\n        href: string;\n        action?: string;\n        navigation?: \"document\" | \"enhanced\";\n        scroll?: NavigationScrollMode;\n        section?: never;\n        keepOpen?: never;\n      }\n    | {\n        action: string;\n        href?: never;\n        navigation?: never;\n        scroll?: never;\n        section?: never;\n        /**\n         * Runs the action while the host's menu stays open, without `beforeSelect`. Only for an action that changes\n         * what the menu shows, such as a filter or a sort order; an action that opens something lets the menu close.\n         */\n        keepOpen?: boolean;\n      }\n    | {\n        href?: never;\n        action?: never;\n        navigation?: never;\n        scroll?: never;\n        keepOpen?: never;\n        children: readonly NavigationItem[];\n        /** Shows the group as a plain heading over its rows, always open and not indented, instead of a disclosure. */\n        section?: boolean;\n      }\n  );\n\nexport type NavigationOptions = {\n  items: Accessor<readonly NavigationItem[]>;\n  onAction?: (action: string) => void | Promise<void>;\n  onNavigate?: (event: LinkNavigateEvent) => void | Promise<void>;\n  /** Receives disclosure toggles of items that carry `expanded`; the owner decides the next state. */\n  onExpandedChange?: (id: string, expanded: boolean) => void;\n};\n\nexport function findNavigationItem(items: readonly NavigationItem[], id: string): NavigationItem | undefined {\n  for (const item of items) {\n    if (item.disabled) continue;\n    if (item.id === id) return item;\n    const found =\n      findNavigationItem(item.children ?? [], id) ??\n      findNavigationItem(item.inlineActions ?? [], id) ??\n      findNavigationItem(item.actions ?? [], id);\n    if (found) return found;\n  }\n}\n\n/** One live source for renderers; no router, registry, fetching or persisted state. */\nexport function createNavigation(options: NavigationOptions) {\n  return {\n    items: options.items,\n    onNavigate: options.onNavigate,\n    onExpandedChange: options.onExpandedChange,\n    async activate(id: string) {\n      const item = findNavigationItem(options.items(), id);\n      if (item?.action) await options.onAction?.(item.action);\n    },\n  };\n}\n\nexport type NavigationController = ReturnType<typeof createNavigation>;\n"],"mappings":"AAIA;;AAgCA;;AA2CA,OAAO,SAAS,kBAAkB,CAAC,KAAgC,EAAE,EAAU,EAA8B;EAC3G,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;IACxB,IAAI,IAAI,CAAC,QAAQ,EAAE;IACnB,IAAI,IAAI,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,IAAI;IAC/B,MAAM,KAAK,GACT,kBAAkB,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,EAAE,EAAE,CAAC,IAC3C,kBAAkB,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,EAAE,EAAE,CAAC,IAChD,kBAAkB,CAAC,IAAI,CAAC,OAAO,IAAI,EAAE,EAAE,EAAE,CAAC;IAC5C,IAAI,KAAK,EAAE,OAAO,KAAK;EACzB;AACF;;AAEA;AACA,OAAO,SAAS,gBAAgB,CAAC,OAA0B,EAAE;EAC3D,OAAO;IACL,KAAK,EAAE,OAAO,CAAC,KAAK;IACpB,UAAU,EAAE,OAAO,CAAC,UAAU;IAC9B,gBAAgB,EAAE,OAAO,CAAC,gBAAgB;IAC1C,MAAM,QAAQ,CAAC,EAAU,EAAE;MACzB,MAAM,IAAI,GAAG,kBAAkB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC;MACpD,IAAI,IAAI,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC;IACzD;EACF,CAAC;AACH","ignoreList":[]}

package/dist/browser/layout/page-title-controller.js

@@ -0,0 +1,169 @@
+import { dropdownPosition } from "../actions/Dropdown";
+
+/**
+ * Marks the root of a controller. A controller owns the titles whose nearest
+ * marked ancestor is its root, so a title that installed its own controller
+ * before the document's keeps it, and a title inside a marked root installs
+ * none.
+ */
+export const PAGE_TITLE_CONTROLLER_ATTRIBUTE = "data-k2b-page-title-controller";
+const TRAIL = ".k2b-page-title__trail";
+const PATH = ".k2b-page-title__path";
+
+/**
+ * Shows the whole path when it fits. Otherwise the middle collapses into "…",
+ * from the second level towards the parent, then the first level too. The
+ * parent always stays, because it is where one step up leads. The path keeps
+ * its one-line height in every state, so collapsing never moves the title.
+ */
+const fit = path => {
+  const crumbs = [...path.querySelectorAll(":scope > .k2b-page-title__crumb")];
+  const more = path.querySelector(":scope > .k2b-page-title__more");
+  if (!more) return;
+  for (const crumb of crumbs) crumb.hidden = false;
+  more.hidden = true;
+  path.removeAttribute("data-tight");
+  if (!path.clientWidth) return;
+  const overflowing = () => path.scrollWidth > path.clientWidth + 0.5;
+  if (overflowing()) {
+    more.hidden = false;
+    for (let index = 1; index < crumbs.length - 1 && overflowing(); index += 1) crumbs[index].hidden = true;
+    if (overflowing()) crumbs[0].hidden = true;
+    // The parent alone still does not fit: it truncates instead.
+    if (overflowing()) path.setAttribute("data-tight", "");
+  }
+  const hidden = new Set(crumbs.filter(crumb => crumb.hidden).map(crumb => crumb.dataset.index));
+  const menu = path.closest(TRAIL)?.querySelector(".k2b-page-title__menu");
+  // The menu lists the hidden levels in order, each indented one step below the one before.
+  let level = 0;
+  for (const item of menu?.querySelectorAll("[data-index]") ?? []) {
+    item.hidden = !hidden.has(item.dataset.index);
+    if (!item.hidden) item.style.setProperty("--k2b-page-title-level", String(level++));
+  }
+  if (!hidden.size && menu?.matches(":popover-open")) menu.hidePopover();
+};
+const menuItems = menu => [...menu.querySelectorAll("a[data-index]:not([hidden])")];
+
+/** Below the row that holds the title, from the "…" button on, so the menu never covers the title. */
+const place = (menu, button) => {
+  const row = button.closest(".k2b-page-title")?.parentElement ?? button;
+  const anchor = button.getBoundingClientRect();
+  const below = new DOMRect(anchor.left, anchor.top, anchor.width, Math.max(anchor.bottom, row.getBoundingClientRect().bottom) - anchor.top);
+  const rect = dropdownPosition(below, menu.getBoundingClientRect(), "bottom-right", {
+    width: window.innerWidth,
+    height: window.innerHeight
+  });
+  menu.style.left = `${rect.left}px`;
+  menu.style.top = `${rect.top}px`;
+};
+
+/**
+ * Collapses every page title path under `root` to the space it has and runs
+ * the "…" menu of the hidden levels. Titles that appear later, for example
+ * when an island renders, are picked up as well. Returns the disposer.
+ */
+export const installPageTitleController = (root = document) => {
+  if (typeof ResizeObserver === "undefined") return () => {};
+  // A document by its node type (9): `Document` and `Node` are not globals in every DOM implementation.
+  const owner = root.nodeType === 9 ? root.documentElement : root;
+  owner.setAttribute(PAGE_TITLE_CONTROLLER_ATTRIBUTE, "");
+  const owns = element => element.closest(`[${PAGE_TITLE_CONTROLLER_ATTRIBUTE}]`) === owner;
+  const observed = new Set();
+  const resize = new ResizeObserver(entries => {
+    for (const entry of entries) {
+      const path = entry.target.querySelector(PATH);
+      if (path) fit(path);
+    }
+  });
+  /** Follows the paths that appeared, drops those that left, and fits the new ones and the `changed` ones. */
+  const scan = (changed = []) => {
+    for (const trail of observed) {
+      if (trail.isConnected) continue;
+      resize.unobserve(trail);
+      observed.delete(trail);
+    }
+    const due = new Set([...changed].filter(trail => observed.has(trail)));
+    for (const trail of root.querySelectorAll(TRAIL)) {
+      if (observed.has(trail) || !owns(trail) || !trail.querySelector(PATH)) continue;
+      observed.add(trail);
+      resize.observe(trail);
+      due.add(trail);
+    }
+    for (const trail of due) {
+      const path = trail.querySelector(PATH);
+      if (path) fit(path);
+    }
+  };
+  // Islands render after the document, and a trail can change its levels; only those changes need a fit. A
+  // trail's size changes reach the resize observer, so the rest of a busy page costs no layout.
+  const holdsTrail = node => node.nodeType === 1 && (node.matches(TRAIL) || !!node.querySelector(TRAIL));
+  const changed = new Set();
+  let arrivals = false;
+  let queued = false;
+  const mutations = new MutationObserver(records => {
+    for (const record of records) {
+      const target = record.target.nodeType === 1 ? record.target : record.target.parentElement;
+      const trail = target?.closest(TRAIL);
+      if (trail) changed.add(trail);else if (record.type === "childList") arrivals ||= [...record.addedNodes, ...record.removedNodes].some(holdsTrail);
+    }
+    if (queued || !arrivals && !changed.size) return;
+    queued = true;
+    requestAnimationFrame(() => {
+      queued = false;
+      arrivals = false;
+      const due = [...changed];
+      changed.clear();
+      scan(due);
+    });
+  });
+  mutations.observe(root, {
+    childList: true,
+    subtree: true,
+    characterData: true
+  });
+  scan();
+  const onClick = event => {
+    const button = event.target?.closest?.(".k2b-page-title__more-button");
+    const menu = button?.closest(TRAIL)?.querySelector(".k2b-page-title__menu");
+    if (!button || !menu || !owns(button)) return;
+    // The button names its menu through `popovertarget`; opening here places it before the first paint.
+    event.preventDefault();
+    if (menu.matches(":popover-open")) {
+      menu.hidePopover();
+      return;
+    }
+    menu.showPopover();
+    place(menu, button);
+    menuItems(menu)[0]?.focus();
+  };
+  const onKeyDown = event => {
+    const key = event.key;
+    const menu = event.target?.closest?.(".k2b-page-title__menu");
+    if (!menu || !owns(menu) || !["ArrowDown", "ArrowUp", "Home", "End"].includes(key)) return;
+    const items = menuItems(menu);
+    const current = items.indexOf(document.activeElement);
+    const next = key === "Home" ? 0 : key === "End" ? items.length - 1 : (current + (key === "ArrowDown" ? 1 : -1) + items.length) % items.length;
+    event.preventDefault();
+    items[next]?.focus();
+  };
+  const onToggle = event => {
+    const menu = event.target;
+    if (!menu.matches?.(".k2b-page-title__menu") || !owns(menu) || event.newState !== "closed") return;
+    // Escape and light dismiss return focus to the button that opened the menu.
+    const button = menu.closest(TRAIL)?.querySelector(".k2b-page-title__more-button");
+    if (button && (!document.activeElement || document.activeElement === document.body || menu.contains(document.activeElement))) button.focus();
+  };
+  root.addEventListener("click", onClick);
+  root.addEventListener("keydown", onKeyDown);
+  // `toggle` does not bubble; the capture phase still sees it.
+  root.addEventListener("toggle", onToggle, true);
+  return () => {
+    resize.disconnect();
+    mutations.disconnect();
+    root.removeEventListener("click", onClick);
+    root.removeEventListener("keydown", onKeyDown);
+    root.removeEventListener("toggle", onToggle, true);
+    owner.removeAttribute(PAGE_TITLE_CONTROLLER_ATTRIBUTE);
+  };
+};
+//# sourceMappingURL=page-title-controller.js.map

package/dist/browser/layout/page-title-controller.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/page-title-controller.ts"],"sourcesContent":["import { dropdownPosition } from \"../actions/Dropdown\";\n\n/**\n * Marks the root of a controller. A controller owns the titles whose nearest\n * marked ancestor is its root, so a title that installed its own controller\n * before the document's keeps it, and a title inside a marked root installs\n * none.\n */\nexport const PAGE_TITLE_CONTROLLER_ATTRIBUTE = \"data-k2b-page-title-controller\";\n\nconst TRAIL = \".k2b-page-title__trail\";\nconst PATH = \".k2b-page-title__path\";\n\n/**\n * Shows the whole path when it fits. Otherwise the middle collapses into \"…\",\n * from the second level towards the parent, then the first level too. The\n * parent always stays, because it is where one step up leads. The path keeps\n * its one-line height in every state, so collapsing never moves the title.\n */\nconst fit = (path: HTMLElement) => {\n  const crumbs = [...path.querySelectorAll<HTMLElement>(\":scope > .k2b-page-title__crumb\")];\n  const more = path.querySelector<HTMLElement>(\":scope > .k2b-page-title__more\");\n  if (!more) return;\n  for (const crumb of crumbs) crumb.hidden = false;\n  more.hidden = true;\n  path.removeAttribute(\"data-tight\");\n  if (!path.clientWidth) return;\n  const overflowing = () => path.scrollWidth > path.clientWidth + 0.5;\n  if (overflowing()) {\n    more.hidden = false;\n    for (let index = 1; index < crumbs.length - 1 && overflowing(); index += 1) crumbs[index]!.hidden = true;\n    if (overflowing()) crumbs[0]!.hidden = true;\n    // The parent alone still does not fit: it truncates instead.\n    if (overflowing()) path.setAttribute(\"data-tight\", \"\");\n  }\n  const hidden = new Set(crumbs.filter((crumb) => crumb.hidden).map((crumb) => crumb.dataset.index));\n  const menu = path.closest(TRAIL)?.querySelector<HTMLElement>(\".k2b-page-title__menu\");\n  // The menu lists the hidden levels in order, each indented one step below the one before.\n  let level = 0;\n  for (const item of menu?.querySelectorAll<HTMLElement>(\"[data-index]\") ?? []) {\n    item.hidden = !hidden.has(item.dataset.index);\n    if (!item.hidden) item.style.setProperty(\"--k2b-page-title-level\", String(level++));\n  }\n  if (!hidden.size && menu?.matches(\":popover-open\")) menu.hidePopover();\n};\n\nconst menuItems = (menu: HTMLElement) => [...menu.querySelectorAll<HTMLElement>(\"a[data-index]:not([hidden])\")];\n\n/** Below the row that holds the title, from the \"…\" button on, so the menu never covers the title. */\nconst place = (menu: HTMLElement, button: HTMLElement) => {\n  const row = button.closest(\".k2b-page-title\")?.parentElement ?? button;\n  const anchor = button.getBoundingClientRect();\n  const below = new DOMRect(\n    anchor.left,\n    anchor.top,\n    anchor.width,\n    Math.max(anchor.bottom, row.getBoundingClientRect().bottom) - anchor.top,\n  );\n  const rect = dropdownPosition(below, menu.getBoundingClientRect(), \"bottom-right\", {\n    width: window.innerWidth,\n    height: window.innerHeight,\n  });\n  menu.style.left = `${rect.left}px`;\n  menu.style.top = `${rect.top}px`;\n};\n\n/**\n * Collapses every page title path under `root` to the space it has and runs\n * the \"…\" menu of the hidden levels. Titles that appear later, for example\n * when an island renders, are picked up as well. Returns the disposer.\n */\nexport const installPageTitleController = (root: Element | Document = document): (() => void) => {\n  if (typeof ResizeObserver === \"undefined\") return () => {};\n  // A document by its node type (9): `Document` and `Node` are not globals in every DOM implementation.\n  const owner = root.nodeType === 9 ? (root as Document).documentElement : (root as Element);\n  owner.setAttribute(PAGE_TITLE_CONTROLLER_ATTRIBUTE, \"\");\n  const owns = (element: Element) => element.closest(`[${PAGE_TITLE_CONTROLLER_ATTRIBUTE}]`) === owner;\n  const observed = new Set<Element>();\n  const resize = new ResizeObserver((entries) => {\n    for (const entry of entries) {\n      const path = entry.target.querySelector<HTMLElement>(PATH);\n      if (path) fit(path);\n    }\n  });\n  /** Follows the paths that appeared, drops those that left, and fits the new ones and the `changed` ones. */\n  const scan = (changed: Iterable<Element> = []) => {\n    for (const trail of observed) {\n      if (trail.isConnected) continue;\n      resize.unobserve(trail);\n      observed.delete(trail);\n    }\n    const due = new Set([...changed].filter((trail) => observed.has(trail)));\n    for (const trail of root.querySelectorAll<HTMLElement>(TRAIL)) {\n      if (observed.has(trail) || !owns(trail) || !trail.querySelector(PATH)) continue;\n      observed.add(trail);\n      resize.observe(trail);\n      due.add(trail);\n    }\n    for (const trail of due) {\n      const path = trail.querySelector<HTMLElement>(PATH);\n      if (path) fit(path);\n    }\n  };\n  // Islands render after the document, and a trail can change its levels; only those changes need a fit. A\n  // trail's size changes reach the resize observer, so the rest of a busy page costs no layout.\n  const holdsTrail = (node: Node) => node.nodeType === 1 && ((node as Element).matches(TRAIL) || !!(node as Element).querySelector(TRAIL));\n  const changed = new Set<Element>();\n  let arrivals = false;\n  let queued = false;\n  const mutations = new MutationObserver((records) => {\n    for (const record of records) {\n      const target = record.target.nodeType === 1 ? (record.target as Element) : record.target.parentElement;\n      const trail = target?.closest(TRAIL);\n      if (trail) changed.add(trail);\n      else if (record.type === \"childList\") arrivals ||= [...record.addedNodes, ...record.removedNodes].some(holdsTrail);\n    }\n    if (queued || (!arrivals && !changed.size)) return;\n    queued = true;\n    requestAnimationFrame(() => {\n      queued = false;\n      arrivals = false;\n      const due = [...changed];\n      changed.clear();\n      scan(due);\n    });\n  });\n  mutations.observe(root, { childList: true, subtree: true, characterData: true });\n  scan();\n\n  const onClick = (event: Event) => {\n    const button = (event.target as Element | null)?.closest?.<HTMLElement>(\".k2b-page-title__more-button\");\n    const menu = button?.closest(TRAIL)?.querySelector<HTMLElement>(\".k2b-page-title__menu\");\n    if (!button || !menu || !owns(button)) return;\n    // The button names its menu through `popovertarget`; opening here places it before the first paint.\n    event.preventDefault();\n    if (menu.matches(\":popover-open\")) {\n      menu.hidePopover();\n      return;\n    }\n    menu.showPopover();\n    place(menu, button);\n    menuItems(menu)[0]?.focus();\n  };\n  const onKeyDown = (event: Event) => {\n    const key = (event as KeyboardEvent).key;\n    const menu = (event.target as Element | null)?.closest?.<HTMLElement>(\".k2b-page-title__menu\");\n    if (!menu || !owns(menu) || ![\"ArrowDown\", \"ArrowUp\", \"Home\", \"End\"].includes(key)) return;\n    const items = menuItems(menu);\n    const current = items.indexOf(document.activeElement as HTMLElement);\n    const next =\n      key === \"Home\" ? 0 : key === \"End\" ? items.length - 1 : (current + (key === \"ArrowDown\" ? 1 : -1) + items.length) % items.length;\n    event.preventDefault();\n    items[next]?.focus();\n  };\n  const onToggle = (event: Event) => {\n    const menu = event.target as HTMLElement;\n    if (!menu.matches?.(\".k2b-page-title__menu\") || !owns(menu) || (event as ToggleEvent).newState !== \"closed\") return;\n    // Escape and light dismiss return focus to the button that opened the menu.\n    const button = menu.closest(TRAIL)?.querySelector<HTMLElement>(\".k2b-page-title__more-button\");\n    if (button && (!document.activeElement || document.activeElement === document.body || menu.contains(document.activeElement)))\n      button.focus();\n  };\n  root.addEventListener(\"click\", onClick);\n  root.addEventListener(\"keydown\", onKeyDown);\n  // `toggle` does not bubble; the capture phase still sees it.\n  root.addEventListener(\"toggle\", onToggle, true);\n  return () => {\n    resize.disconnect();\n    mutations.disconnect();\n    root.removeEventListener(\"click\", onClick);\n    root.removeEventListener(\"keydown\", onKeyDown);\n    root.removeEventListener(\"toggle\", onToggle, true);\n    owner.removeAttribute(PAGE_TITLE_CONTROLLER_ATTRIBUTE);\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/layout/panel-dialog-messages.js

@@ -0,0 +1,20 @@
+import { i18n } from "@k2b/stdlib";
+import { useLocale } from "../intl/locale";
+const panelDialogMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      dialogTabs: "Dialog tabs"
+    },
+    de: {
+      dialogTabs: "Dialog-Tabs"
+    }
+  }
+});
+/** Resolved from the inherited render locale. */
+export const usePanelDialogMessages = () => {
+  const locale = useLocale();
+  return () => panelDialogMessages.resolve([locale()]).t;
+};
+export const checkPanelDialogMessages = () => panelDialogMessages.check();
+//# sourceMappingURL=panel-dialog-messages.js.map

package/dist/browser/layout/panel-dialog-messages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/panel-dialog-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst panelDialogMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      dialogTabs: \"Dialog tabs\",\n    },\n    de: {\n      dialogTabs: \"Dialog-Tabs\",\n    },\n  },\n});\n\nexport type PanelDialogMessages = ReturnType<(typeof panelDialogMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const usePanelDialogMessages = (): (() => PanelDialogMessages) => {\n  const locale = useLocale();\n  return () => panelDialogMessages.resolve([locale()]).t;\n};\n\nexport const checkPanelDialogMessages = () => panelDialogMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,mBAAmB,GAAG,IAAI,CAAC,MAAM,CAAC;EACtC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,UAAU,EAAE;IACd,CAAC;IACD,EAAE,EAAE;MACF,UAAU,EAAE;IACd;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,sBAAsB,GAAG,MAAmC;EACvE,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,mBAAmB,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACxD,CAAC;AAED,OAAO,MAAM,wBAAwB,GAAG,MAAM,mBAAmB,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/layout/panes-messages.js

@@ -0,0 +1,48 @@
+import { i18n } from "@k2b/stdlib";
+import { useLocale } from "../intl/locale";
+const panesMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      addPane: "Add pane",
+      addToNamed: ({
+        name
+      }) => `Add to ${name}`,
+      insertBeforeNamed: ({
+        name
+      }) => `Insert before ${name}`,
+      insertAtEnd: "Insert at end",
+      addPaneSide: ({
+        side,
+        name
+      }) => `Add ${side} of ${name}`,
+      paneTabs: "Pane tabs",
+      paneWorkspace: "Pane workspace",
+      resizePanes: "Resize panes"
+    },
+    de: {
+      addPane: "Bereich hinzufügen",
+      addToNamed: ({
+        name
+      }) => `Zu ${name} hinzufügen`,
+      insertBeforeNamed: ({
+        name
+      }) => `Vor ${name} einfügen`,
+      insertAtEnd: "Am Ende einfügen",
+      addPaneSide: ({
+        side,
+        name
+      }) => `${side === "left" ? "Links" : side === "right" ? "Rechts" : side === "top" ? "Oberhalb" : "Unterhalb"} von ${name} hinzufügen`,
+      paneTabs: "Bereichs-Tabs",
+      paneWorkspace: "Arbeitsbereich",
+      resizePanes: "Bereiche skalieren"
+    }
+  }
+});
+/** Resolved from the inherited render locale. */
+export const usePanesMessages = () => {
+  const locale = useLocale();
+  return () => panesMessages.resolve([locale()]).t;
+};
+export const checkPanesMessages = () => panesMessages.check();
+//# sourceMappingURL=panes-messages.js.map

package/dist/browser/layout/panes-messages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/panes-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst panesMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      addPane: \"Add pane\",\n      addToNamed: ({ name }: { name: string }) => `Add to ${name}`,\n      insertBeforeNamed: ({ name }: { name: string }) => `Insert before ${name}`,\n      insertAtEnd: \"Insert at end\",\n      addPaneSide: ({ side, name }: { side: \"left\" | \"right\" | \"top\" | \"bottom\"; name: string }) => `Add ${side} of ${name}`,\n      paneTabs: \"Pane tabs\",\n      paneWorkspace: \"Pane workspace\",\n      resizePanes: \"Resize panes\",\n    },\n    de: {\n      addPane: \"Bereich hinzufügen\",\n      addToNamed: ({ name }) => `Zu ${name} hinzufügen`,\n      insertBeforeNamed: ({ name }) => `Vor ${name} einfügen`,\n      insertAtEnd: \"Am Ende einfügen\",\n      addPaneSide: ({ side, name }) =>\n        `${side === \"left\" ? \"Links\" : side === \"right\" ? \"Rechts\" : side === \"top\" ? \"Oberhalb\" : \"Unterhalb\"} von ${name} hinzufügen`,\n      paneTabs: \"Bereichs-Tabs\",\n      paneWorkspace: \"Arbeitsbereich\",\n      resizePanes: \"Bereiche skalieren\",\n    },\n  },\n});\n\nexport type PanesMessages = ReturnType<(typeof panesMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const usePanesMessages = (): (() => PanesMessages) => {\n  const locale = useLocale();\n  return () => panesMessages.resolve([locale()]).t;\n};\n\nexport const checkPanesMessages = () => panesMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;EAChC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,OAAO,EAAE,UAAU;MACnB,UAAU,EAAE,CAAC;QAAE;MAAuB,CAAC,KAAK,UAAU,IAAI,EAAE;MAC5D,iBAAiB,EAAE,CAAC;QAAE;MAAuB,CAAC,KAAK,iBAAiB,IAAI,EAAE;MAC1E,WAAW,EAAE,eAAe;MAC5B,WAAW,EAAE,CAAC;QAAE,IAAI;QAAE;MAAkE,CAAC,KAAK,OAAO,IAAI,OAAO,IAAI,EAAE;MACtH,QAAQ,EAAE,WAAW;MACrB,aAAa,EAAE,gBAAgB;MAC/B,WAAW,EAAE;IACf,CAAC;IACD,EAAE,EAAE;MACF,OAAO,EAAE,oBAAoB;MAC7B,UAAU,EAAE,CAAC;QAAE;MAAK,CAAC,KAAK,MAAM,IAAI,aAAa;MACjD,iBAAiB,EAAE,CAAC;QAAE;MAAK,CAAC,KAAK,OAAO,IAAI,WAAW;MACvD,WAAW,EAAE,kBAAkB;MAC/B,WAAW,EAAE,CAAC;QAAE,IAAI;QAAE;MAAK,CAAC,KAC1B,GAAG,IAAI,KAAK,MAAM,GAAG,OAAO,GAAG,IAAI,KAAK,OAAO,GAAG,QAAQ,GAAG,IAAI,KAAK,KAAK,GAAG,UAAU,GAAG,WAAW,QAAQ,IAAI,aAAa;MACjI,QAAQ,EAAE,eAAe;MACzB,aAAa,EAAE,gBAAgB;MAC/B,WAAW,EAAE;IACf;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,gBAAgB,GAAG,MAA6B;EAC3D,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,aAAa,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAClD,CAAC;AAED,OAAO,MAAM,kBAAkB,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/layout/refresh-messages.js

@@ -0,0 +1,20 @@
+import { i18n } from "@k2b/stdlib";
+import { useLocale } from "../intl/locale";
+const refreshMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      refreshing: "Refreshing"
+    },
+    de: {
+      refreshing: "Wird aktualisiert"
+    }
+  }
+});
+/** Resolved from the inherited render locale. */
+export const useRefreshMessages = () => {
+  const locale = useLocale();
+  return () => refreshMessages.resolve([locale()]).t;
+};
+export const checkRefreshMessages = () => refreshMessages.check();
+//# sourceMappingURL=refresh-messages.js.map

package/dist/browser/layout/refresh-messages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/refresh-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst refreshMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      refreshing: \"Refreshing\",\n    },\n    de: {\n      refreshing: \"Wird aktualisiert\",\n    },\n  },\n});\n\nexport type RefreshMessages = ReturnType<(typeof refreshMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const useRefreshMessages = (): (() => RefreshMessages) => {\n  const locale = useLocale();\n  return () => refreshMessages.resolve([locale()]).t;\n};\n\nexport const checkRefreshMessages = () => refreshMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,eAAe,GAAG,IAAI,CAAC,MAAM,CAAC;EAClC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,UAAU,EAAE;IACd,CAAC;IACD,EAAE,EAAE;MACF,UAAU,EAAE;IACd;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,kBAAkB,GAAG,MAA+B;EAC/D,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,eAAe,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC;AAED,OAAO,MAAM,oBAAoB,GAAG,MAAM,eAAe,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/layout/settings-messages.js

@@ -0,0 +1,54 @@
+import { i18n } from "@k2b/stdlib";
+import { useLocale } from "../intl/locale";
+const settingsMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      sectionsLabel: ({
+        title
+      }) => `${title} sections`,
+      moveDown: "Move down",
+      moveUp: "Move up",
+      moveNamedDown: ({
+        label
+      }) => `Move ${label} down`,
+      moveNamedUp: ({
+        label
+      }) => `Move ${label} up`,
+      saveChanges: "Save changes",
+      saving: "Saving",
+      unsaved: "Unsaved",
+      unsavedChangeLabel: ({
+        count
+      }) => `unsaved ${count === 1 ? "change" : "changes"}`,
+      noUnsavedChanges: "No unsaved changes"
+    },
+    de: {
+      sectionsLabel: ({
+        title
+      }) => `Bereiche von ${title}`,
+      moveDown: "Nach unten",
+      moveUp: "Nach oben",
+      moveNamedDown: ({
+        label
+      }) => `${label} nach unten verschieben`,
+      moveNamedUp: ({
+        label
+      }) => `${label} nach oben verschieben`,
+      saveChanges: "Änderungen speichern",
+      saving: "Wird gespeichert",
+      unsaved: "Ungespeichert",
+      unsavedChangeLabel: ({
+        count
+      }) => `ungespeicherte ${count === 1 ? "Änderung" : "Änderungen"}`,
+      noUnsavedChanges: "Keine ungespeicherten Änderungen"
+    }
+  }
+});
+/** Resolved from the inherited render locale. */
+export const useSettingsMessages = () => {
+  const locale = useLocale();
+  return () => settingsMessages.resolve([locale()]).t;
+};
+export const checkSettingsMessages = () => settingsMessages.check();
+//# sourceMappingURL=settings-messages.js.map

package/dist/browser/layout/settings-messages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/settings-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst settingsMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      sectionsLabel: ({ title }: { title: string }) => `${title} sections`,\n      moveDown: \"Move down\",\n      moveUp: \"Move up\",\n      moveNamedDown: ({ label }: { label: string }) => `Move ${label} down`,\n      moveNamedUp: ({ label }: { label: string }) => `Move ${label} up`,\n      saveChanges: \"Save changes\",\n      saving: \"Saving\",\n      unsaved: \"Unsaved\",\n      unsavedChangeLabel: ({ count }: { count: number }) => `unsaved ${count === 1 ? \"change\" : \"changes\"}`,\n      noUnsavedChanges: \"No unsaved changes\",\n    },\n    de: {\n      sectionsLabel: ({ title }) => `Bereiche von ${title}`,\n      moveDown: \"Nach unten\",\n      moveUp: \"Nach oben\",\n      moveNamedDown: ({ label }) => `${label} nach unten verschieben`,\n      moveNamedUp: ({ label }) => `${label} nach oben verschieben`,\n      saveChanges: \"Änderungen speichern\",\n      saving: \"Wird gespeichert\",\n      unsaved: \"Ungespeichert\",\n      unsavedChangeLabel: ({ count }) => `ungespeicherte ${count === 1 ? \"Änderung\" : \"Änderungen\"}`,\n      noUnsavedChanges: \"Keine ungespeicherten Änderungen\",\n    },\n  },\n});\n\nexport type SettingsMessages = ReturnType<(typeof settingsMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const useSettingsMessages = (): (() => SettingsMessages) => {\n  const locale = useLocale();\n  return () => settingsMessages.resolve([locale()]).t;\n};\n\nexport const checkSettingsMessages = () => settingsMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC;EACnC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,aAAa,EAAE,CAAC;QAAE;MAAyB,CAAC,KAAK,GAAG,KAAK,WAAW;MACpE,QAAQ,EAAE,WAAW;MACrB,MAAM,EAAE,SAAS;MACjB,aAAa,EAAE,CAAC;QAAE;MAAyB,CAAC,KAAK,QAAQ,KAAK,OAAO;MACrE,WAAW,EAAE,CAAC;QAAE;MAAyB,CAAC,KAAK,QAAQ,KAAK,KAAK;MACjE,WAAW,EAAE,cAAc;MAC3B,MAAM,EAAE,QAAQ;MAChB,OAAO,EAAE,SAAS;MAClB,kBAAkB,EAAE,CAAC;QAAE;MAAyB,CAAC,KAAK,WAAW,KAAK,KAAK,CAAC,GAAG,QAAQ,GAAG,SAAS,EAAE;MACrG,gBAAgB,EAAE;IACpB,CAAC;IACD,EAAE,EAAE;MACF,aAAa,EAAE,CAAC;QAAE;MAAM,CAAC,KAAK,gBAAgB,KAAK,EAAE;MACrD,QAAQ,EAAE,YAAY;MACtB,MAAM,EAAE,WAAW;MACnB,aAAa,EAAE,CAAC;QAAE;MAAM,CAAC,KAAK,GAAG,KAAK,yBAAyB;MAC/D,WAAW,EAAE,CAAC;QAAE;MAAM,CAAC,KAAK,GAAG,KAAK,wBAAwB;MAC5D,WAAW,EAAE,sBAAsB;MACnC,MAAM,EAAE,kBAAkB;MAC1B,OAAO,EAAE,eAAe;MACxB,kBAAkB,EAAE,CAAC;QAAE;MAAM,CAAC,KAAK,kBAAkB,KAAK,KAAK,CAAC,GAAG,UAAU,GAAG,YAAY,EAAE;MAC9F,gBAAgB,EAAE;IACpB;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,mBAAmB,GAAG,MAAgC;EACjE,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,gBAAgB,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACrD,CAAC;AAED,OAAO,MAAM,qBAAqB,GAAG,MAAM,gBAAgB,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/layout/workspace-messages.js

@@ -0,0 +1,56 @@
+import { i18n } from "@k2b/stdlib";
+import { useLocale } from "../intl/locale";
+const workspaceMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      rowAction: "Row action",
+      sidebarUnread: ({
+        count
+      }) => `${count} unread`,
+      sidebarUnreadMany: "more than 99 unread",
+      sidebarNewActivity: "new activity",
+      sidebarMentioned: "mentions you",
+      sidebarMuted: "muted",
+      resizeNavigation: "Resize navigation",
+      resizeWorkspacePane: "Resize workspace pane",
+      resizeDetailPanel: "Resize detail panel",
+      detailFullHeight: "Full height",
+      resizeBottomDrawer: "Resize bottom drawer",
+      showNavigation: "Show navigation",
+      backTo: ({
+        page
+      }) => `Back to ${page}`,
+      path: "Path",
+      moreLevels: "More levels"
+    },
+    de: {
+      rowAction: "Zeilenaktion",
+      sidebarUnread: ({
+        count
+      }) => `${count} ungelesen`,
+      sidebarUnreadMany: "mehr als 99 ungelesen",
+      sidebarNewActivity: "neue Aktivität",
+      sidebarMentioned: "erwähnt dich",
+      sidebarMuted: "stummgeschaltet",
+      resizeNavigation: "Breite der Navigation ändern",
+      resizeWorkspacePane: "Breite des Arbeitsbereichs ändern",
+      resizeDetailPanel: "Breite des Detailbereichs ändern",
+      detailFullHeight: "Volle Höhe",
+      resizeBottomDrawer: "Höhe des unteren Bereichs ändern",
+      showNavigation: "Navigation anzeigen",
+      backTo: ({
+        page
+      }) => `Zurück zu ${page}`,
+      path: "Pfad",
+      moreLevels: "Weitere Ebenen"
+    }
+  }
+});
+/** Resolved from the inherited render locale. */
+export const useWorkspaceMessages = () => {
+  const locale = useLocale();
+  return () => workspaceMessages.resolve([locale()]).t;
+};
+export const checkWorkspaceMessages = () => workspaceMessages.check();
+//# sourceMappingURL=workspace-messages.js.map

package/dist/browser/layout/workspace-messages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["layout/workspace-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst workspaceMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      rowAction: \"Row action\",\n      sidebarUnread: ({ count }: { count: number }) => `${count} unread`,\n      sidebarUnreadMany: \"more than 99 unread\",\n      sidebarNewActivity: \"new activity\",\n      sidebarMentioned: \"mentions you\",\n      sidebarMuted: \"muted\",\n      resizeNavigation: \"Resize navigation\",\n      resizeWorkspacePane: \"Resize workspace pane\",\n      resizeDetailPanel: \"Resize detail panel\",\n      detailFullHeight: \"Full height\",\n      resizeBottomDrawer: \"Resize bottom drawer\",\n      showNavigation: \"Show navigation\",\n      backTo: ({ page }: { page: string }) => `Back to ${page}`,\n      path: \"Path\",\n      moreLevels: \"More levels\",\n    },\n    de: {\n      rowAction: \"Zeilenaktion\",\n      sidebarUnread: ({ count }) => `${count} ungelesen`,\n      sidebarUnreadMany: \"mehr als 99 ungelesen\",\n      sidebarNewActivity: \"neue Aktivität\",\n      sidebarMentioned: \"erwähnt dich\",\n      sidebarMuted: \"stummgeschaltet\",\n      resizeNavigation: \"Breite der Navigation ändern\",\n      resizeWorkspacePane: \"Breite des Arbeitsbereichs ändern\",\n      resizeDetailPanel: \"Breite des Detailbereichs ändern\",\n      detailFullHeight: \"Volle Höhe\",\n      resizeBottomDrawer: \"Höhe des unteren Bereichs ändern\",\n      showNavigation: \"Navigation anzeigen\",\n      backTo: ({ page }) => `Zurück zu ${page}`,\n      path: \"Pfad\",\n      moreLevels: \"Weitere Ebenen\",\n    },\n  },\n});\n\nexport type WorkspaceMessages = ReturnType<(typeof workspaceMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const useWorkspaceMessages = (): (() => WorkspaceMessages) => {\n  const locale = useLocale();\n  return () => workspaceMessages.resolve([locale()]).t;\n};\n\nexport const checkWorkspaceMessages = () => workspaceMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,iBAAiB,GAAG,IAAI,CAAC,MAAM,CAAC;EACpC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,SAAS,EAAE,YAAY;MACvB,aAAa,EAAE,CAAC;QAAE;MAAyB,CAAC,KAAK,GAAG,KAAK,SAAS;MAClE,iBAAiB,EAAE,qBAAqB;MACxC,kBAAkB,EAAE,cAAc;MAClC,gBAAgB,EAAE,cAAc;MAChC,YAAY,EAAE,OAAO;MACrB,gBAAgB,EAAE,mBAAmB;MACrC,mBAAmB,EAAE,uBAAuB;MAC5C,iBAAiB,EAAE,qBAAqB;MACxC,gBAAgB,EAAE,aAAa;MAC/B,kBAAkB,EAAE,sBAAsB;MAC1C,cAAc,EAAE,iBAAiB;MACjC,MAAM,EAAE,CAAC;QAAE;MAAuB,CAAC,KAAK,WAAW,IAAI,EAAE;MACzD,IAAI,EAAE,MAAM;MACZ,UAAU,EAAE;IACd,CAAC;IACD,EAAE,EAAE;MACF,SAAS,EAAE,cAAc;MACzB,aAAa,EAAE,CAAC;QAAE;MAAM,CAAC,KAAK,GAAG,KAAK,YAAY;MAClD,iBAAiB,EAAE,uBAAuB;MAC1C,kBAAkB,EAAE,gBAAgB;MACpC,gBAAgB,EAAE,cAAc;MAChC,YAAY,EAAE,iBAAiB;MAC/B,gBAAgB,EAAE,8BAA8B;MAChD,mBAAmB,EAAE,mCAAmC;MACxD,iBAAiB,EAAE,kCAAkC;MACrD,gBAAgB,EAAE,YAAY;MAC9B,kBAAkB,EAAE,kCAAkC;MACtD,cAAc,EAAE,qBAAqB;MACrC,MAAM,EAAE,CAAC;QAAE;MAAK,CAAC,KAAK,aAAa,IAAI,EAAE;MACzC,IAAI,EAAE,MAAM;MACZ,UAAU,EAAE;IACd;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,oBAAoB,GAAG,MAAiC;EACnE,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,iBAAiB,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACtD,CAAC;AAED,OAAO,MAAM,sBAAsB,GAAG,MAAM,iBAAiB,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/surfaces/Avatar.js

@@ -11,7 +11,7 @@ var _tmpl$ = /*#__PURE__*/_$template(`<i aria-hidden=true>`),
   _tmpl$2 = /*#__PURE__*/_$template(`<span role=img>`),
   _tmpl$3 = /*#__PURE__*/_$template(`<img decoding=async>`, true, false, false);
 import { createEffect, createSignal, on, Show } from "solid-js";
-import { useUiMessages } from "../intl/messages";
+import { useAvatarMessages } from "./avatar-messages";
 const initialsFor = name => {
   const parts = name.trim().split(/\s+/).filter(Boolean);
   if (parts.length === 0) return "?";
@@ -32,9 +32,9 @@ const tintFor = name => {
   return hash % TINTS;
 };
 export function Avatar(props) {
-  const messages = useUiMessages();
+  const avatarMessages = useAvatarMessages();
   const [failed, setFailed] = createSignal(false);
-  const label = () => props.name.trim() || messages().unknownUser;
+  const label = () => props.name.trim() || avatarMessages().unknownUser;
   // Derive initials from the given name, not from the accessible-name fallback:
   // an empty `name` must render "?" the way Cloud's avatar does, not "UU".
   const fallback = () => props.fallback ?? initialsFor(props.name);
@@ -60,7 +60,7 @@ export function Avatar(props) {
             _v$2 = props.size ?? "md",
             _v$3 = tintFor(props.name.trim()),
             _v$4 = props.style,
-            _v$5 = props.alt ?? messages().avatarLabel({
+            _v$5 = props.alt ?? avatarMessages().avatarLabel({
               name: label()
             });
           _v$ !== _p$.e && _$className(_el$2, _p$.e = _v$);
@@ -84,7 +84,7 @@ export function Avatar(props) {
       _el$3.addEventListener("error", () => setFailed(true));
       _$effect(_p$ => {
         var _v$6 = src(),
-          _v$7 = props.alt ?? messages().avatarLabel({
+          _v$7 = props.alt ?? avatarMessages().avatarLabel({
             name: label()
           }),
           _v$8 = className(),

package/dist/browser/surfaces/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["surfaces/Avatar.tsx"],"sourcesContent":["import { createEffect, createSignal, type JSX, on, Show } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport type AvatarProps = {\n  name: string;\n  src?: string | null;\n  icon?: string;\n  alt?: string;\n  fallback?: string;\n  size?: AvatarSize;\n  loading?: \"eager\" | \"lazy\";\n  class?: string;\n  style?: JSX.CSSProperties | string;\n};\n\nconst initialsFor = (name: string): string => {\n  const parts = name.trim().split(/\\s+/).filter(Boolean);\n  if (parts.length === 0) return \"?\";\n  if (parts.length === 1) return parts[0]?.slice(0, 2).toUpperCase() ?? \"?\";\n  return `${parts[0]?.[0] ?? \"\"}${parts.at(-1)?.[0] ?? \"\"}`.toUpperCase();\n};\n\n/** Tints behind initials, as many as `.k2b-avatar[data-tint]` rules in the stylesheet. */\nconst TINTS = 10;\n\n/**\n * The tint behind initials and icons, from the name, so the same name has one color wherever an avatar shows it. The\n * hash is the one of `@k2b/stdlib`'s generated avatar.\n */\nconst tintFor = (name: string): number => {\n  let hash = 0;\n  for (let index = 0; index < name.length; index++) hash = (hash * 31 + name.charCodeAt(index)) >>> 0;\n  return hash % TINTS;\n};\n\nexport function Avatar(props: AvatarProps): JSX.Element {\n  const messages = useUiMessages();\n  const [failed, setFailed] = createSignal(false);\n  const label = () => props.name.trim() || messages().unknownUser;\n  // Derive initials from the given name, not from the accessible-name fallback:\n  // an empty `name` must render \"?\" the way Cloud's avatar does, not \"UU\".\n  const fallback = () => props.fallback ?? initialsFor(props.name);\n  const fallbackContent = () => (props.icon ? <i class={props.icon} aria-hidden=\"true\" /> : fallback());\n  const className = () => `k2b-avatar ${props.class ?? \"\"}`;\n\n  createEffect(\n    on(\n      () => props.src,\n      () => setFailed(false),\n      { defer: true },\n    ),\n  );\n\n  return (\n    <Show\n      when={!failed() ? props.src || undefined : undefined}\n      fallback={\n        <span\n          class={className()}\n          data-size={props.size ?? \"md\"}\n          data-tint={tintFor(props.name.trim())}\n          style={props.style}\n          role=\"img\"\n          aria-label={props.alt ?? messages().avatarLabel({ name: label() })}\n        >\n          {fallbackContent()}\n        </span>\n      }\n    >\n      {(src) => (\n        <img\n          src={src()}\n          alt={props.alt ?? messages().avatarLabel({ name: label() })}\n          class={className()}\n          data-size={props.size ?? \"md\"}\n          style={props.style}\n          loading={props.loading ?? \"lazy\"}\n          decoding=\"async\"\n          onError={() => setFailed(true)}\n        />\n      )}\n    </Show>\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["surfaces/Avatar.tsx"],"sourcesContent":["import { createEffect, createSignal, type JSX, on, Show } from \"solid-js\";\nimport { useAvatarMessages } from \"./avatar-messages\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport type AvatarProps = {\n  name: string;\n  src?: string | null;\n  icon?: string;\n  alt?: string;\n  fallback?: string;\n  size?: AvatarSize;\n  loading?: \"eager\" | \"lazy\";\n  class?: string;\n  style?: JSX.CSSProperties | string;\n};\n\nconst initialsFor = (name: string): string => {\n  const parts = name.trim().split(/\\s+/).filter(Boolean);\n  if (parts.length === 0) return \"?\";\n  if (parts.length === 1) return parts[0]?.slice(0, 2).toUpperCase() ?? \"?\";\n  return `${parts[0]?.[0] ?? \"\"}${parts.at(-1)?.[0] ?? \"\"}`.toUpperCase();\n};\n\n/** Tints behind initials, as many as `.k2b-avatar[data-tint]` rules in the stylesheet. */\nconst TINTS = 10;\n\n/**\n * The tint behind initials and icons, from the name, so the same name has one color wherever an avatar shows it. The\n * hash is the one of `@k2b/stdlib`'s generated avatar.\n */\nconst tintFor = (name: string): number => {\n  let hash = 0;\n  for (let index = 0; index < name.length; index++) hash = (hash * 31 + name.charCodeAt(index)) >>> 0;\n  return hash % TINTS;\n};\n\nexport function Avatar(props: AvatarProps): JSX.Element {\n  const avatarMessages = useAvatarMessages();\n  const [failed, setFailed] = createSignal(false);\n  const label = () => props.name.trim() || avatarMessages().unknownUser;\n  // Derive initials from the given name, not from the accessible-name fallback:\n  // an empty `name` must render \"?\" the way Cloud's avatar does, not \"UU\".\n  const fallback = () => props.fallback ?? initialsFor(props.name);\n  const fallbackContent = () => (props.icon ? <i class={props.icon} aria-hidden=\"true\" /> : fallback());\n  const className = () => `k2b-avatar ${props.class ?? \"\"}`;\n\n  createEffect(\n    on(\n      () => props.src,\n      () => setFailed(false),\n      { defer: true },\n    ),\n  );\n\n  return (\n    <Show\n      when={!failed() ? props.src || undefined : undefined}\n      fallback={\n        <span\n          class={className()}\n          data-size={props.size ?? \"md\"}\n          data-tint={tintFor(props.name.trim())}\n          style={props.style}\n          role=\"img\"\n          aria-label={props.alt ?? avatarMessages().avatarLabel({ name: label() })}\n        >\n          {fallbackContent()}\n        </span>\n      }\n    >\n      {(src) => (\n        <img\n          src={src()}\n          alt={props.alt ?? avatarMessages().avatarLabel({ name: label() })}\n          class={className()}\n          data-size={props.size ?? \"md\"}\n          style={props.style}\n          loading={props.loading ?? \"lazy\"}\n          decoding=\"async\"\n          onError={() => setFailed(true)}\n        />\n      )}\n    </Show>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/surfaces/ResourceCard.js

@@ -21,6 +21,7 @@ var _tmpl$ = /*#__PURE__*/_$template(`<span class=k2b-resource-card__icon aria-h
   _tmpl$0 = /*#__PURE__*/_$template(`<button type=button>`);
 import { Match, Show, Switch } from "solid-js";
 import { useUiMessages } from "../intl/messages";
+import { useResourceMessages } from "./resource-messages";
 
 /**
  * What a card can show of the element it stands for: the element itself, a placeholder while it is being looked up, or
@@ -51,9 +52,10 @@ const linkUrl = href => {
  */
 export function ResourceCard(props) {
   const messages = useUiMessages();
+  const resourceMessages = useResourceMessages();
   const state = () => props.state ?? "ok";
   const ok = () => state() === "ok";
-  const title = () => props.title?.trim() ? props.title : messages().resourceUntitled;
+  const title = () => props.title?.trim() ? props.title : resourceMessages().resourceUntitled;
   const meta = () => [props.source, props.location].filter(part => part?.trim()).join(" · ");
   /** Why the element cannot be shown, outside `"ok"` and `"loading"`. */
   const reason = () => {
@@ -132,7 +134,7 @@ export function ResourceCard(props) {
             _el$17 = _el$16.firstChild;
           _$insert(_el$17, (() => {
             var _c$ = _$memo(() => reason() === "no_access");
-            return () => _c$() ? messages().resourceNoAccess : _$memo(() => reason() === "deleted")() ? messages().resourceDeleted : messages().resourceUnavailable;
+            return () => _c$() ? resourceMessages().resourceNoAccess : _$memo(() => reason() === "deleted")() ? resourceMessages().resourceDeleted : resourceMessages().resourceUnavailable;
           })());
           return _el$16;
         })()]

package/dist/browser/surfaces/ResourceCard.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["surfaces/ResourceCard.tsx"],"sourcesContent":["import { type JSX, Match, Show, Switch } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\n\n/**\n * What a card can show of the element it stands for: the element itself, a placeholder while it is being looked up, or\n * why it cannot be shown.\n */\nexport type ResourceCardState = \"ok\" | \"loading\" | \"no_access\" | \"deleted\" | \"unavailable\";\n\nexport type ResourceCardProps = {\n  /** Defaults to `\"ok\"`. Every state has the same size, so a card that changes state moves nothing around it. */\n  state?: ResourceCardState;\n  /** The element's name. Shown only in state `\"ok\"`, as \"Untitled\" when blank, so a card that opens always has a name. */\n  title?: string;\n  /** Icon class of the element's kind, for example `ti ti-notebook`. Shown only in state `\"ok\"`. */\n  icon?: string;\n  /** What the element belongs to, for example the application or service. Shown only in state `\"ok\"`. */\n  source?: string;\n  /** Where the element lives within its source, for example a folder or a project. Shown only in state `\"ok\"`. */\n  location?: string;\n  /** One line of plain text from the element. Shown only in state `\"ok\"`. */\n  preview?: string;\n  /** Opens the element, for example in a panel. Takes precedence over `href`. Only in state `\"ok\"`. */\n  onOpen?: () => void;\n  /** Opens the element. Absolute `https` or `http`, or relative. Only in state `\"ok\"`. */\n  href?: string;\n  class?: string;\n};\n\nconst DEFAULT_ICON = \"ti ti-file\";\nconst LINK_PROTOCOLS = new Set([\"https:\", \"http:\"]);\nconst STATE_ICONS = { no_access: \"ti ti-lock\", deleted: \"ti ti-trash\", unavailable: \"ti ti-cloud-off\" } as const;\n\n/** A link the card may open: absolute with an allowed scheme, or relative to the page. */\nconst linkUrl = (href: string | undefined): string | undefined => {\n  if (!href) return undefined;\n  try {\n    return LINK_PROTOCOLS.has(new URL(href, \"https://relative.invalid/\").protocol) ? href : undefined;\n  } catch {\n    return undefined;\n  }\n};\n\n/**\n * A card for an element that something refers to, such as a task or a document, with the same size in every state.\n * Outside state `\"ok\"`, it shows none of the element's fields and opens nothing, whatever the caller passes.\n */\nexport function ResourceCard(props: ResourceCardProps): JSX.Element {\n  const messages = useUiMessages();\n  const state = () => props.state ?? \"ok\";\n  const ok = () => state() === \"ok\";\n  const title = () => (props.title?.trim() ? props.title : messages().resourceUntitled);\n  const meta = () => [props.source, props.location].filter((part) => part?.trim()).join(\" · \");\n  /** Why the element cannot be shown, outside `\"ok\"` and `\"loading\"`. */\n  const reason = (): Exclude<ResourceCardState, \"ok\" | \"loading\"> | undefined => {\n    const current = state();\n    return current === \"ok\" || current === \"loading\" ? undefined : current;\n  };\n  const className = () => `k2b-resource-card${props.class ? ` ${props.class}` : \"\"}`;\n\n  const content = () => (\n    <Switch>\n      <Match when={ok()}>\n        <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\">\n          <i class={props.icon ?? DEFAULT_ICON} />\n        </span>\n        <span class=\"k2b-resource-card__copy\">\n          <span class=\"k2b-resource-card__title\">{title()}</span>\n          <Show when={meta()}>\n            <span class=\"k2b-resource-card__meta\">{meta()}</span>\n          </Show>\n          <Show when={props.preview?.trim()}>\n            <span class=\"k2b-resource-card__preview\">{props.preview}</span>\n          </Show>\n        </span>\n      </Match>\n      <Match when={state() === \"loading\"}>\n        <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\" />\n        <span class=\"k2b-resource-card__copy\">\n          <span class=\"k2b-resource-card__bar\" aria-hidden=\"true\" />\n          <span class=\"k2b-resource-card__bar\" aria-hidden=\"true\" />\n          <span class=\"k2b-sr-only\">{messages().loading}</span>\n        </span>\n      </Match>\n      <Match when={reason()}>\n        {(reason) => (\n          <>\n            <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\">\n              <i class={STATE_ICONS[reason()]} />\n            </span>\n            <span class=\"k2b-resource-card__copy\">\n              <span class=\"k2b-resource-card__label\">\n                {reason() === \"no_access\"\n                  ? messages().resourceNoAccess\n                  : reason() === \"deleted\"\n                    ? messages().resourceDeleted\n                    : messages().resourceUnavailable}\n              </span>\n            </span>\n          </>\n        )}\n      </Match>\n    </Switch>\n  );\n\n  return (\n    <Show\n      when={ok() && props.onOpen}\n      fallback={\n        <Show\n          when={ok() && linkUrl(props.href)}\n          fallback={\n            <div class={className()} data-state={state()} aria-busy={state() === \"loading\" ? \"true\" : undefined}>\n              {content()}\n            </div>\n          }\n        >\n          {(href) => (\n            <a class={className()} data-state={state()} href={href()}>\n              {content()}\n            </a>\n          )}\n        </Show>\n      }\n    >\n      {(open) => (\n        <button type=\"button\" class={className()} data-state={state()} onClick={() => open()()}>\n          {content()}\n        </button>\n      )}\n    </Show>\n  );\n}\n\nexport default ResourceCard;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["surfaces/ResourceCard.tsx"],"sourcesContent":["import { type JSX, Match, Show, Switch } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { useResourceMessages } from \"./resource-messages\";\n\n/**\n * What a card can show of the element it stands for: the element itself, a placeholder while it is being looked up, or\n * why it cannot be shown.\n */\nexport type ResourceCardState = \"ok\" | \"loading\" | \"no_access\" | \"deleted\" | \"unavailable\";\n\nexport type ResourceCardProps = {\n  /** Defaults to `\"ok\"`. Every state has the same size, so a card that changes state moves nothing around it. */\n  state?: ResourceCardState;\n  /** The element's name. Shown only in state `\"ok\"`, as \"Untitled\" when blank, so a card that opens always has a name. */\n  title?: string;\n  /** Icon class of the element's kind, for example `ti ti-notebook`. Shown only in state `\"ok\"`. */\n  icon?: string;\n  /** What the element belongs to, for example the application or service. Shown only in state `\"ok\"`. */\n  source?: string;\n  /** Where the element lives within its source, for example a folder or a project. Shown only in state `\"ok\"`. */\n  location?: string;\n  /** One line of plain text from the element. Shown only in state `\"ok\"`. */\n  preview?: string;\n  /** Opens the element, for example in a panel. Takes precedence over `href`. Only in state `\"ok\"`. */\n  onOpen?: () => void;\n  /** Opens the element. Absolute `https` or `http`, or relative. Only in state `\"ok\"`. */\n  href?: string;\n  class?: string;\n};\n\nconst DEFAULT_ICON = \"ti ti-file\";\nconst LINK_PROTOCOLS = new Set([\"https:\", \"http:\"]);\nconst STATE_ICONS = { no_access: \"ti ti-lock\", deleted: \"ti ti-trash\", unavailable: \"ti ti-cloud-off\" } as const;\n\n/** A link the card may open: absolute with an allowed scheme, or relative to the page. */\nconst linkUrl = (href: string | undefined): string | undefined => {\n  if (!href) return undefined;\n  try {\n    return LINK_PROTOCOLS.has(new URL(href, \"https://relative.invalid/\").protocol) ? href : undefined;\n  } catch {\n    return undefined;\n  }\n};\n\n/**\n * A card for an element that something refers to, such as a task or a document, with the same size in every state.\n * Outside state `\"ok\"`, it shows none of the element's fields and opens nothing, whatever the caller passes.\n */\nexport function ResourceCard(props: ResourceCardProps): JSX.Element {\n  const messages = useUiMessages();\n  const resourceMessages = useResourceMessages();\n  const state = () => props.state ?? \"ok\";\n  const ok = () => state() === \"ok\";\n  const title = () => (props.title?.trim() ? props.title : resourceMessages().resourceUntitled);\n  const meta = () => [props.source, props.location].filter((part) => part?.trim()).join(\" · \");\n  /** Why the element cannot be shown, outside `\"ok\"` and `\"loading\"`. */\n  const reason = (): Exclude<ResourceCardState, \"ok\" | \"loading\"> | undefined => {\n    const current = state();\n    return current === \"ok\" || current === \"loading\" ? undefined : current;\n  };\n  const className = () => `k2b-resource-card${props.class ? ` ${props.class}` : \"\"}`;\n\n  const content = () => (\n    <Switch>\n      <Match when={ok()}>\n        <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\">\n          <i class={props.icon ?? DEFAULT_ICON} />\n        </span>\n        <span class=\"k2b-resource-card__copy\">\n          <span class=\"k2b-resource-card__title\">{title()}</span>\n          <Show when={meta()}>\n            <span class=\"k2b-resource-card__meta\">{meta()}</span>\n          </Show>\n          <Show when={props.preview?.trim()}>\n            <span class=\"k2b-resource-card__preview\">{props.preview}</span>\n          </Show>\n        </span>\n      </Match>\n      <Match when={state() === \"loading\"}>\n        <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\" />\n        <span class=\"k2b-resource-card__copy\">\n          <span class=\"k2b-resource-card__bar\" aria-hidden=\"true\" />\n          <span class=\"k2b-resource-card__bar\" aria-hidden=\"true\" />\n          <span class=\"k2b-sr-only\">{messages().loading}</span>\n        </span>\n      </Match>\n      <Match when={reason()}>\n        {(reason) => (\n          <>\n            <span class=\"k2b-resource-card__icon\" aria-hidden=\"true\">\n              <i class={STATE_ICONS[reason()]} />\n            </span>\n            <span class=\"k2b-resource-card__copy\">\n              <span class=\"k2b-resource-card__label\">\n                {reason() === \"no_access\"\n                  ? resourceMessages().resourceNoAccess\n                  : reason() === \"deleted\"\n                    ? resourceMessages().resourceDeleted\n                    : resourceMessages().resourceUnavailable}\n              </span>\n            </span>\n          </>\n        )}\n      </Match>\n    </Switch>\n  );\n\n  return (\n    <Show\n      when={ok() && props.onOpen}\n      fallback={\n        <Show\n          when={ok() && linkUrl(props.href)}\n          fallback={\n            <div class={className()} data-state={state()} aria-busy={state() === \"loading\" ? \"true\" : undefined}>\n              {content()}\n            </div>\n          }\n        >\n          {(href) => (\n            <a class={className()} data-state={state()} href={href()}>\n              {content()}\n            </a>\n          )}\n        </Show>\n      }\n    >\n      {(open) => (\n        <button type=\"button\" class={className()} data-state={state()} onClick={() => open()()}>\n          {content()}\n        </button>\n      )}\n    </Show>\n  );\n}\n\nexport default ResourceCard;\n"],"mappings":"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","ignoreList":[]}