@alfakit/react 0.0.0-stage → 0.1.0

package/dist/components/panel/shortcut-keys.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shortcut-keys.d.ts","names":[],"sources":["../../../src/components/panel/shortcut-keys.tsx"],"mappings":";;;;;wBASgB,eAAe,SAAS;EAAe;EAAiB;oBAAoB,IAAA"}

package/dist/components/panel/shortcut-keys.js

@@ -0,0 +1,33 @@
+import { useT } from "../../context.js";
+import { cn } from "../../lib/utils.js";
+import { useHydrated } from "../../hooks/use-hydrated.js";
+import { shortcutSteps } from "@alfakit/core";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/panel/shortcut-keys.tsx
+/**
+* A key binding as `<kbd>` keys (`G` then `D`, `⌘K`). The keys depend on the visitor's
+* platform (⌘ or Ctrl), so they render after hydration.
+*/
+function ShortcutKeys({ binding, className }) {
+	const t = useT();
+	if (!useHydrated()) return null;
+	const steps = shortcutSteps(binding);
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "shortcut-keys",
+		className: cn("inline-flex items-center gap-1", className),
+		children: steps.map((step, index) => /* @__PURE__ */ jsxs("span", {
+			className: "inline-flex items-center gap-1",
+			children: [index > 0 && /* @__PURE__ */ jsx("span", {
+				className: "text-muted-foreground text-[10px]",
+				children: t("shortcuts.then", {}, "then")
+			}), /* @__PURE__ */ jsx("kbd", {
+				className: "bg-muted text-muted-foreground rounded border px-1.5 font-mono text-[10px] leading-5",
+				children: step
+			})]
+		}, index))
+	});
+}
+//#endregion
+export { ShortcutKeys };
+
+//# sourceMappingURL=shortcut-keys.js.map

package/dist/components/panel/shortcut-keys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shortcut-keys.js","names":[],"sources":["../../../src/components/panel/shortcut-keys.tsx"],"sourcesContent":["import { shortcutSteps } from '@alfakit/core'\nimport { useT } from '../../context'\nimport { useHydrated } from '../../hooks/use-hydrated'\nimport { cn } from '../../lib/utils'\n\n/**\n * A key binding as `<kbd>` keys (`G` then `D`, `⌘K`). The keys depend on the visitor's\n * platform (⌘ or Ctrl), so they render after hydration.\n */\nexport function ShortcutKeys({ binding, className }: { binding: string; className?: string }) {\n  const t = useT()\n  const hydrated = useHydrated()\n\n  if (!hydrated) return null\n\n  const steps = shortcutSteps(binding)\n\n  return (\n    <span data-slot=\"shortcut-keys\" className={cn('inline-flex items-center gap-1', className)}>\n      {steps.map((step, index) => (\n        <span key={index} className=\"inline-flex items-center gap-1\">\n          {index > 0 && (\n            <span className=\"text-muted-foreground text-[10px]\">\n              {t('shortcuts.then', {}, 'then')}\n            </span>\n          )}\n          <kbd className=\"bg-muted text-muted-foreground rounded border px-1.5 font-mono text-[10px] leading-5\">\n            {step}\n          </kbd>\n        </span>\n      ))}\n    </span>\n  )\n}\n"],"mappings":";;;;;;;;;;AASA,SAAgB,aAAa,EAAE,SAAS,aAAsD;CAC5F,MAAM,IAAI,KAAK;CAGf,IAAI,CAFa,YAEL,GAAG,OAAO;CAEtB,MAAM,QAAQ,cAAc,OAAO;CAEnC,OACE,oBAAC,QAAD;EAAM,aAAU;EAAgB,WAAW,GAAG,kCAAkC,SAAS;EACtF,UAAA,MAAM,KAAK,MAAM,UAChB,qBAAC,QAAD;GAAkB,WAAU;GAA5B,UAAA,CACG,QAAQ,KACP,oBAAC,QAAD;IAAM,WAAU;IACb,UAAA,EAAE,kBAAkB,CAAC,GAAG,MAAM;GAC3B,CAAA,GAER,oBAAC,OAAD;IAAK,WAAU;IACZ,UAAA;GACE,CAAA,CACD;EATK,GAAA,KASL,CACP;CACG,CAAA;AAEV"}

package/dist/components/panel/shortcuts-overlay.d.ts

@@ -0,0 +1,13 @@
+//#region src/components/panel/shortcuts-overlay.d.ts
+/**
+ * The `?` overlay: every shortcut available on the page, grouped; users may change their
+ * keys (stored on the server). `KeyboardShortcuts` loads it the first time it opens.
+ */
+export declare function ShortcutsOverlay({ open, onOpenChange, customizable, endpoint }: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  customizable: boolean;
+  endpoint?: string;
+}): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=shortcuts-overlay.d.ts.map

package/dist/components/panel/shortcuts-overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shortcuts-overlay.d.ts","names":[],"sources":["../../../src/components/panel/shortcuts-overlay.tsx"],"mappings":";;;;;wBAqBgB,mBACd,MACA,cACA,cACA;EAEA;EACA,eAAe;EACf;EACA;oBACD,IAAA"}

package/dist/components/panel/shortcuts-overlay.js

@@ -0,0 +1,159 @@
+import { usePageSchema, useT } from "../../context.js";
+import { Button } from "../ui/button.js";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "../ui/dialog.js";
+import { ShortcutKeys } from "./shortcut-keys.js";
+import { bindingFromEvent, flattenActionGroup, saveShortcutOverrides, shortcutOverlayGroups, shortcuts } from "@alfakit/core";
+import { useEffect, useState, useSyncExternalStore } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/panel/shortcuts-overlay.tsx
+const subscribe = (listener) => shortcuts.subscribe(listener);
+const version = () => shortcuts.getVersion();
+/**
+* The `?` overlay: every shortcut available on the page, grouped; users may change their
+* keys (stored on the server). `KeyboardShortcuts` loads it the first time it opens.
+*/
+function ShortcutsOverlay({ open, onOpenChange, customizable, endpoint }) {
+	const t = useT();
+	const page = usePageSchema();
+	useSyncExternalStore(subscribe, version, version);
+	const [recording, setRecording] = useState(null);
+	const [message, setMessage] = useState("");
+	const groups = shortcutOverlayGroups(shortcuts.list(), flattenActionGroup(page?.headerActions ?? []));
+	const save = async (id, keys) => {
+		if (!endpoint) return;
+		try {
+			shortcuts.setOverrides(await saveShortcutOverrides(endpoint, { [id]: keys }));
+			setMessage(t("shortcuts.saved", {}, "Shortcut saved."));
+		} catch {
+			setMessage(t("shortcuts.save_failed", {}, "The shortcut could not be saved."));
+		}
+	};
+	useEffect(() => {
+		if (!recording) return;
+		shortcuts.setPaused(true);
+		const listener = (event) => {
+			event.preventDefault();
+			event.stopPropagation();
+			if (event.key === "Escape") {
+				setRecording(null);
+				setMessage(t("shortcuts.cancelled", {}, "Change cancelled."));
+				return;
+			}
+			const binding = bindingFromEvent(event);
+			if (!binding) return;
+			const conflict = shortcuts.conflict([binding], recording);
+			setRecording(null);
+			if (conflict) {
+				setMessage(t("shortcuts.conflict", { label: conflict.label }, `Already used by “${conflict.label}”.`));
+				return;
+			}
+			save(recording, [binding]);
+		};
+		window.addEventListener("keydown", listener, true);
+		return () => {
+			window.removeEventListener("keydown", listener, true);
+			shortcuts.setPaused(false);
+		};
+	}, [recording]);
+	const groupLabel = (group) => ({
+		general: t("shortcuts.groups.general", {}, "General"),
+		navigation: t("shortcuts.groups.navigation", {}, "Navigation"),
+		commands: t("shortcuts.groups.commands", {}, "Commands"),
+		actions: t("shortcuts.groups.actions", {}, "Actions on this page")
+	})[group];
+	const change = (item) => {
+		setMessage(t("shortcuts.recording", { label: item.label }, `Press the new keys for “${item.label}”. Escape cancels.`));
+		setRecording(item.id);
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open,
+		onOpenChange: (next) => {
+			setRecording(null);
+			setMessage("");
+			onOpenChange(next);
+		},
+		children: /* @__PURE__ */ jsx(DialogContent, {
+			className: "max-h-[85vh] overflow-y-auto sm:max-w-lg",
+			children: /* @__PURE__ */ jsxs("div", {
+				"data-slot": "shortcuts-overlay",
+				className: "flex flex-col gap-4",
+				children: [
+					/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: t("shortcuts.title", {}, "Keyboard shortcuts") }), /* @__PURE__ */ jsx(DialogDescription, { children: t("shortcuts.description", {}, "Shortcuts available on this page.") })] }),
+					/* @__PURE__ */ jsx("div", {
+						role: "status",
+						"aria-live": "polite",
+						className: "text-muted-foreground min-h-5 text-sm",
+						children: message
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "flex flex-col gap-5",
+						children: groups.map((group) => /* @__PURE__ */ jsxs("section", {
+							"data-group": group.group,
+							"aria-labelledby": `shortcuts-${group.group}`,
+							children: [/* @__PURE__ */ jsx("h3", {
+								id: `shortcuts-${group.group}`,
+								className: "text-muted-foreground mb-2 text-xs font-medium uppercase",
+								children: groupLabel(group.group)
+							}), /* @__PURE__ */ jsx("ul", {
+								className: "flex flex-col divide-y rounded-md border",
+								children: group.items.map((item) => /* @__PURE__ */ jsxs("li", {
+									"data-shortcut": item.id,
+									className: "flex items-center gap-3 px-3 py-2 text-sm",
+									children: [
+										/* @__PURE__ */ jsx("span", {
+											className: "min-w-0 flex-1 truncate",
+											children: item.label
+										}),
+										recording === item.id ? /* @__PURE__ */ jsx("span", {
+											className: "text-primary text-xs",
+											children: t("shortcuts.press_keys", {}, "Press keys…")
+										}) : item.keys.length === 0 ? /* @__PURE__ */ jsx("span", {
+											className: "text-muted-foreground text-xs",
+											children: t("shortcuts.off", {}, "Off")
+										}) : /* @__PURE__ */ jsx("span", {
+											className: "flex flex-wrap items-center justify-end gap-2",
+											children: item.keys.map((key) => /* @__PURE__ */ jsx(ShortcutKeys, { binding: key }, key))
+										}),
+										customizable && item.customizable && /* @__PURE__ */ jsxs("span", {
+											className: "flex shrink-0 gap-1",
+											children: [
+												/* @__PURE__ */ jsx(Button, {
+													type: "button",
+													variant: "ghost",
+													size: "xs",
+													"aria-label": t("shortcuts.change_label", { label: item.label }, `Change the shortcut for ${item.label}`),
+													onClick: () => change(item),
+													children: t("shortcuts.change", {}, "Change")
+												}),
+												item.keys.length > 0 && /* @__PURE__ */ jsx(Button, {
+													type: "button",
+													variant: "ghost",
+													size: "xs",
+													"aria-label": t("shortcuts.turn_off_label", { label: item.label }, `Turn off the shortcut for ${item.label}`),
+													onClick: () => void save(item.id, []),
+													children: t("shortcuts.turn_off", {}, "Turn off")
+												}),
+												item.customized && /* @__PURE__ */ jsx(Button, {
+													type: "button",
+													variant: "ghost",
+													size: "xs",
+													"aria-label": t("shortcuts.reset_label", { label: item.label }, `Restore the default shortcut for ${item.label}`),
+													onClick: () => void save(item.id, null),
+													children: t("shortcuts.reset", {}, "Reset")
+												})
+											]
+										})
+									]
+								}, item.id))
+							})]
+						}, group.group))
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+export { ShortcutsOverlay };
+
+//# sourceMappingURL=shortcuts-overlay.js.map

package/dist/components/panel/shortcuts-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shortcuts-overlay.js","names":[],"sources":["../../../src/components/panel/shortcuts-overlay.tsx"],"sourcesContent":["import type { ShortcutListGroup, ShortcutListItem } from '@alfakit/core'\nimport {\n  bindingFromEvent,\n  flattenActionGroup,\n  saveShortcutOverrides,\n  shortcutOverlayGroups,\n  shortcuts,\n} from '@alfakit/core'\nimport { useEffect, useState, useSyncExternalStore } from 'react'\nimport { usePageSchema, useT } from '../../context'\nimport { Button } from '../ui/button'\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '../ui/dialog'\nimport { ShortcutKeys } from './shortcut-keys'\n\nconst subscribe = (listener: () => void) => shortcuts.subscribe(listener)\nconst version = () => shortcuts.getVersion()\n\n/**\n * The `?` overlay: every shortcut available on the page, grouped; users may change their\n * keys (stored on the server). `KeyboardShortcuts` loads it the first time it opens.\n */\nexport function ShortcutsOverlay({\n  open,\n  onOpenChange,\n  customizable,\n  endpoint,\n}: {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  customizable: boolean\n  endpoint?: string\n}) {\n  const t = useT()\n  const page = usePageSchema()\n  useSyncExternalStore(subscribe, version, version)\n  const [recording, setRecording] = useState<string | null>(null)\n  const [message, setMessage] = useState('')\n\n  const groups = shortcutOverlayGroups(\n    shortcuts.list(),\n    flattenActionGroup(page?.headerActions ?? []),\n  )\n\n  const save = async (id: string, keys: string[] | null) => {\n    if (!endpoint) return\n\n    try {\n      shortcuts.setOverrides(await saveShortcutOverrides(endpoint, { [id]: keys }))\n      setMessage(t('shortcuts.saved', {}, 'Shortcut saved.'))\n    } catch {\n      setMessage(t('shortcuts.save_failed', {}, 'The shortcut could not be saved.'))\n    }\n  }\n\n  // While recording, the next key press is the new binding (Escape cancels). Listening in the\n  // capture phase keeps the key from closing the dialog or running another shortcut.\n  useEffect(() => {\n    if (!recording) return\n\n    shortcuts.setPaused(true)\n\n    const listener = (event: KeyboardEvent) => {\n      event.preventDefault()\n      event.stopPropagation()\n\n      if (event.key === 'Escape') {\n        setRecording(null)\n        setMessage(t('shortcuts.cancelled', {}, 'Change cancelled.'))\n\n        return\n      }\n\n      const binding = bindingFromEvent(event)\n\n      if (!binding) return\n\n      const conflict = shortcuts.conflict([binding], recording)\n\n      setRecording(null)\n\n      if (conflict) {\n        setMessage(\n          t(\n            'shortcuts.conflict',\n            { label: conflict.label },\n            `Already used by “${conflict.label}”.`,\n          ),\n        )\n\n        return\n      }\n\n      void save(recording, [binding])\n    }\n\n    window.addEventListener('keydown', listener, true)\n\n    return () => {\n      window.removeEventListener('keydown', listener, true)\n      shortcuts.setPaused(false)\n    }\n    // `save` and `t` only change with the endpoint and the locale.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [recording])\n\n  const groupLabel = (group: ShortcutListGroup['group']) =>\n    ({\n      general: t('shortcuts.groups.general', {}, 'General'),\n      navigation: t('shortcuts.groups.navigation', {}, 'Navigation'),\n      commands: t('shortcuts.groups.commands', {}, 'Commands'),\n      actions: t('shortcuts.groups.actions', {}, 'Actions on this page'),\n    })[group]\n\n  const change = (item: ShortcutListItem) => {\n    setMessage(\n      t(\n        'shortcuts.recording',\n        { label: item.label },\n        `Press the new keys for “${item.label}”. Escape cancels.`,\n      ),\n    )\n    setRecording(item.id)\n  }\n\n  return (\n    <Dialog\n      open={open}\n      onOpenChange={(next) => {\n        setRecording(null)\n        setMessage('')\n        onOpenChange(next)\n      }}\n    >\n      <DialogContent className=\"max-h-[85vh] overflow-y-auto sm:max-w-lg\">\n        <div data-slot=\"shortcuts-overlay\" className=\"flex flex-col gap-4\">\n          <DialogHeader>\n            <DialogTitle>{t('shortcuts.title', {}, 'Keyboard shortcuts')}</DialogTitle>\n            <DialogDescription>\n              {t('shortcuts.description', {}, 'Shortcuts available on this page.')}\n            </DialogDescription>\n          </DialogHeader>\n          <div role=\"status\" aria-live=\"polite\" className=\"text-muted-foreground min-h-5 text-sm\">\n            {message}\n          </div>\n          <div className=\"flex flex-col gap-5\">\n            {groups.map((group) => (\n              <section\n                key={group.group}\n                data-group={group.group}\n                aria-labelledby={`shortcuts-${group.group}`}\n              >\n                <h3\n                  id={`shortcuts-${group.group}`}\n                  className=\"text-muted-foreground mb-2 text-xs font-medium uppercase\"\n                >\n                  {groupLabel(group.group)}\n                </h3>\n                <ul className=\"flex flex-col divide-y rounded-md border\">\n                  {group.items.map((item) => (\n                    <li\n                      key={item.id}\n                      data-shortcut={item.id}\n                      className=\"flex items-center gap-3 px-3 py-2 text-sm\"\n                    >\n                      <span className=\"min-w-0 flex-1 truncate\">{item.label}</span>\n                      {recording === item.id ? (\n                        <span className=\"text-primary text-xs\">\n                          {t('shortcuts.press_keys', {}, 'Press keys…')}\n                        </span>\n                      ) : item.keys.length === 0 ? (\n                        <span className=\"text-muted-foreground text-xs\">\n                          {t('shortcuts.off', {}, 'Off')}\n                        </span>\n                      ) : (\n                        <span className=\"flex flex-wrap items-center justify-end gap-2\">\n                          {item.keys.map((key) => (\n                            <ShortcutKeys key={key} binding={key} />\n                          ))}\n                        </span>\n                      )}\n                      {customizable && item.customizable && (\n                        <span className=\"flex shrink-0 gap-1\">\n                          <Button\n                            type=\"button\"\n                            variant=\"ghost\"\n                            size=\"xs\"\n                            aria-label={t(\n                              'shortcuts.change_label',\n                              { label: item.label },\n                              `Change the shortcut for ${item.label}`,\n                            )}\n                            onClick={() => change(item)}\n                          >\n                            {t('shortcuts.change', {}, 'Change')}\n                          </Button>\n                          {item.keys.length > 0 && (\n                            <Button\n                              type=\"button\"\n                              variant=\"ghost\"\n                              size=\"xs\"\n                              aria-label={t(\n                                'shortcuts.turn_off_label',\n                                { label: item.label },\n                                `Turn off the shortcut for ${item.label}`,\n                              )}\n                              onClick={() => void save(item.id, [])}\n                            >\n                              {t('shortcuts.turn_off', {}, 'Turn off')}\n                            </Button>\n                          )}\n                          {item.customized && (\n                            <Button\n                              type=\"button\"\n                              variant=\"ghost\"\n                              size=\"xs\"\n                              aria-label={t(\n                                'shortcuts.reset_label',\n                                { label: item.label },\n                                `Restore the default shortcut for ${item.label}`,\n                              )}\n                              onClick={() => void save(item.id, null)}\n                            >\n                              {t('shortcuts.reset', {}, 'Reset')}\n                            </Button>\n                          )}\n                        </span>\n                      )}\n                    </li>\n                  ))}\n                </ul>\n              </section>\n            ))}\n          </div>\n        </div>\n      </DialogContent>\n    </Dialog>\n  )\n}\n"],"mappings":"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"}

package/dist/components/panel/slot.d.ts

@@ -0,0 +1,18 @@
+//#region src/components/panel/slot.d.ts
+/**
+ * Renders content added with `Panel::slot('name', …)` or `Slots::register()` on the
+ * server: HTML or schema components (`Text`, `Html`, `View`, …). Renders nothing when the
+ * slot is empty. `scope` is the component key (`relationManager:<class>`, `widget:<id>`)
+ * of the table, relation manager or widget the slot belongs to: content scoped to
+ * components only renders in their slots. `data` is what this render is about (the
+ * column of a header cell, the action of a modal): items registered with
+ * `when: ['column' => 'title']` only render where it matches.
+ */
+export declare function Slot({ name, scope, data, className }: {
+  name: string;
+  scope?: string | null;
+  data?: Record<string, unknown> | null;
+  className?: string;
+}): import("react").JSX.Element | null;
+//#endregion
+//# sourceMappingURL=slot.d.ts.map

package/dist/components/panel/slot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.d.ts","names":[],"sources":["../../../src/components/panel/slot.tsx"],"mappings":";;;;;;;;;;wBAcgB,OACd,MACA,OACA,MACA;EAEA;EACA;EACA,OAAO;EACP;oBACD,IAAA"}

package/dist/components/panel/slot.js

@@ -0,0 +1,31 @@
+import { usePanel } from "../../context.js";
+import { cn } from "../../lib/utils.js";
+import { RenderComponent } from "../schema/schema-renderer.js";
+import { slotItems } from "@alfakit/core";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/panel/slot.tsx
+/**
+* Renders content added with `Panel::slot('name', …)` or `Slots::register()` on the
+* server: HTML or schema components (`Text`, `Html`, `View`, …). Renders nothing when the
+* slot is empty. `scope` is the component key (`relationManager:<class>`, `widget:<id>`)
+* of the table, relation manager or widget the slot belongs to: content scoped to
+* components only renders in their slots. `data` is what this render is about (the
+* column of a header cell, the action of a modal): items registered with
+* `when: ['column' => 'title']` only render where it matches.
+*/
+function Slot({ name, scope, data, className }) {
+	const items = slotItems(usePanel().slots, name, scope, data);
+	if (items.length === 0) return null;
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot-name": name,
+		className: cn("contents", className),
+		children: items.map((item, index) => item.type === "html" ? /* @__PURE__ */ jsx("div", {
+			className: "contents",
+			dangerouslySetInnerHTML: { __html: item.html }
+		}, index) : /* @__PURE__ */ jsx(RenderComponent, { component: item.component }, index))
+	});
+}
+//#endregion
+export { Slot };
+
+//# sourceMappingURL=slot.js.map

package/dist/components/panel/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","names":[],"sources":["../../../src/components/panel/slot.tsx"],"sourcesContent":["import { slotItems } from '@alfakit/core'\nimport { usePanel } from '../../context'\nimport { cn } from '../../lib/utils'\nimport { RenderComponent } from '../schema/schema-renderer'\n\n/**\n * Renders content added with `Panel::slot('name', …)` or `Slots::register()` on the\n * server: HTML or schema components (`Text`, `Html`, `View`, …). Renders nothing when the\n * slot is empty. `scope` is the component key (`relationManager:<class>`, `widget:<id>`)\n * of the table, relation manager or widget the slot belongs to: content scoped to\n * components only renders in their slots. `data` is what this render is about (the\n * column of a header cell, the action of a modal): items registered with\n * `when: ['column' => 'title']` only render where it matches.\n */\nexport function Slot({\n  name,\n  scope,\n  data,\n  className,\n}: {\n  name: string\n  scope?: string | null\n  data?: Record<string, unknown> | null\n  className?: string\n}) {\n  const items = slotItems(usePanel().slots, name, scope, data)\n\n  if (items.length === 0) {\n    return null\n  }\n\n  return (\n    <div data-slot-name={name} className={cn('contents', className)}>\n      {items.map((item, index) =>\n        item.type === 'html' ? (\n          <div key={index} className=\"contents\" dangerouslySetInnerHTML={{ __html: item.html }} />\n        ) : (\n          <RenderComponent key={index} component={item.component} />\n        ),\n      )}\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAcA,SAAgB,KAAK,EACnB,MACA,OACA,MACA,aAMC;CACD,MAAM,QAAQ,UAAU,SAAS,CAAC,CAAC,OAAO,MAAM,OAAO,IAAI;CAE3D,IAAI,MAAM,WAAW,GACnB,OAAO;CAGT,OACE,oBAAC,OAAD;EAAK,kBAAgB;EAAM,WAAW,GAAG,YAAY,SAAS;EAC3D,UAAA,MAAM,KAAK,MAAM,UAChB,KAAK,SAAS,SACZ,oBAAC,OAAD;GAAiB,WAAU;GAAW,yBAAyB,EAAE,QAAQ,KAAK,KAAK;EAAI,GAA7E,KAA6E,IAEvF,oBAAC,iBAAD,EAA6B,WAAW,KAAK,UAAY,GAAnC,KAAmC,CAE7D;CACG,CAAA;AAET"}

package/dist/components/panel/sub-navigation.js

@@ -0,0 +1,125 @@
+import { useRegistry, useT } from "../../context.js";
+import { cn } from "../../lib/utils.js";
+import { Icon } from "../../lib/icons.js";
+import { Badge } from "../ui/badge.js";
+import { extraProps } from "../../lib/attributes.js";
+import { Slot } from "./slot.js";
+import { NavLabel } from "./nav-label.js";
+import { Link } from "@inertiajs/react";
+import { createElement } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/panel/sub-navigation.tsx
+function SubNavigationLink({ item, tab }) {
+	const attributes = (className) => extraProps(item.extraAttributes, className);
+	const className = cn("flex items-center gap-2 rounded-md px-3 py-2 text-sm transition-colors", tab ? "shrink-0 whitespace-nowrap" : "w-full", item.active ? "bg-accent text-accent-foreground font-medium" : "text-muted-foreground hover:bg-accent/60 hover:text-foreground");
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		item.icon && /* @__PURE__ */ jsx(Icon, { name: item.icon }),
+		/* @__PURE__ */ jsx(NavLabel, {
+			item,
+			className: "truncate"
+		}),
+		item.badge !== void 0 && item.badge !== null && /* @__PURE__ */ jsx(Badge, {
+			variant: "secondary",
+			className: "ms-auto px-1.5 py-0",
+			title: item.badgeTooltip,
+			children: item.badge
+		})
+	] });
+	if (!item.url) return /* @__PURE__ */ jsx("span", {
+		...attributes(className),
+		children: content
+	});
+	if (item.openInNewTab) return /* @__PURE__ */ jsx("a", {
+		...attributes(className),
+		href: item.url,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		children: content
+	});
+	return /* @__PURE__ */ jsx(Link, {
+		...attributes(className),
+		href: item.url,
+		"aria-current": item.active ? "page" : void 0,
+		children: content
+	});
+}
+/** The links of a page's sub-navigation (cluster pages or record pages). */
+function SubNavigation({ navigation }) {
+	const label = useT()("sub_navigation", {}, "Page navigation");
+	if (navigation.position === "top") {
+		const items = navigation.groups.flatMap((group) => group.items);
+		return /* @__PURE__ */ jsx("nav", {
+			"aria-label": label,
+			"data-slot": "sub-navigation",
+			"data-position": "top",
+			className: "relative flex gap-1 overflow-x-auto border-b pb-2",
+			children: items.map((item) => /* @__PURE__ */ jsx(SubNavigationLink, {
+				item,
+				tab: true
+			}, `${item.label}-${item.url ?? ""}`))
+		});
+	}
+	return /* @__PURE__ */ jsxs("nav", {
+		"aria-label": label,
+		"data-slot": "sub-navigation",
+		"data-position": navigation.position,
+		className: "flex w-full shrink-0 flex-col gap-4 md:w-56",
+		children: [
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.sidebar.before" }),
+			navigation.groups.map((group, index) => /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-1",
+				children: [group.label && /* @__PURE__ */ jsxs("p", {
+					className: "text-muted-foreground flex items-center gap-1.5 px-3 text-xs font-medium",
+					children: [group.icon && /* @__PURE__ */ jsx(Icon, {
+						name: group.icon,
+						className: "size-3.5"
+					}), group.label]
+				}), /* @__PURE__ */ jsx("ul", {
+					className: "flex flex-col gap-0.5",
+					children: group.items.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(SubNavigationLink, {
+						item,
+						tab: false
+					}) }, `${item.label}-${item.url ?? ""}`))
+				})]
+			}, group.label ?? `group-${index}`)),
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.sidebar.after" })
+		]
+	});
+}
+/**
+* Places the sub-navigation next to (`start`/`end`) or above (`top`) the page content.
+* Replace the navigation with `createAlfakit({ components: { 'panel:sub-navigation': … } })`.
+*/
+function SubNavigationLayout({ navigation, children }) {
+	const registry = useRegistry();
+	const nav = createElement(registry.resolve("panel:sub-navigation") ?? SubNavigation, { navigation });
+	if (navigation.position === "top") return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.top.before" }),
+		nav,
+		/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.top.after" }),
+		children
+	] });
+	const content = /* @__PURE__ */ jsx("div", {
+		className: "flex min-w-0 flex-1 flex-col gap-6",
+		children
+	});
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sub-navigation-layout",
+		className: "flex flex-col gap-6 md:flex-row md:items-start",
+		children: navigation.position === "end" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			content,
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.end.before" }),
+			nav,
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.end.after" })
+		] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.start.before" }),
+			nav,
+			/* @__PURE__ */ jsx(Slot, { name: "page.sub-navigation.start.after" }),
+			content
+		] })
+	});
+}
+//#endregion
+export { SubNavigation, SubNavigationLayout };
+
+//# sourceMappingURL=sub-navigation.js.map

package/dist/components/panel/sub-navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sub-navigation.js","names":[],"sources":["../../../src/components/panel/sub-navigation.tsx"],"sourcesContent":["import type { NavigationItemSchema, SubNavigationSchema } from '@alfakit/core'\nimport { Link } from '@inertiajs/react'\nimport { createElement, type ReactNode } from 'react'\nimport { useRegistry, useT } from '../../context'\nimport { extraProps } from '../../lib/attributes'\nimport { Icon } from '../../lib/icons'\nimport { cn } from '../../lib/utils'\nimport { Badge } from '../ui/badge'\nimport { NavLabel } from './nav-label'\nimport { Slot } from './slot'\n\nfunction SubNavigationLink({ item, tab }: { item: NavigationItemSchema; tab: boolean }) {\n  // `NavigationItem::extraAttributes()`; `class` is merged with the link's own.\n  const attributes = (className: string) => extraProps(item.extraAttributes, className)\n  const className = cn(\n    'flex items-center gap-2 rounded-md px-3 py-2 text-sm transition-colors',\n    tab ? 'shrink-0 whitespace-nowrap' : 'w-full',\n    item.active\n      ? 'bg-accent text-accent-foreground font-medium'\n      : 'text-muted-foreground hover:bg-accent/60 hover:text-foreground',\n  )\n\n  const content = (\n    <>\n      {item.icon && <Icon name={item.icon} />}\n      <NavLabel item={item} className=\"truncate\" />\n      {item.badge !== undefined && item.badge !== null && (\n        <Badge variant=\"secondary\" className=\"ms-auto px-1.5 py-0\" title={item.badgeTooltip}>\n          {item.badge}\n        </Badge>\n      )}\n    </>\n  )\n\n  if (!item.url) {\n    return <span {...attributes(className)}>{content}</span>\n  }\n\n  if (item.openInNewTab) {\n    return (\n      <a {...attributes(className)} href={item.url} target=\"_blank\" rel=\"noopener noreferrer\">\n        {content}\n      </a>\n    )\n  }\n\n  return (\n    <Link\n      {...attributes(className)}\n      href={item.url}\n      aria-current={item.active ? 'page' : undefined}\n    >\n      {content}\n    </Link>\n  )\n}\n\n/** The links of a page's sub-navigation (cluster pages or record pages). */\nexport function SubNavigation({ navigation }: { navigation: SubNavigationSchema }) {\n  const t = useT()\n  const label = t('sub_navigation', {}, 'Page navigation')\n\n  if (navigation.position === 'top') {\n    const items = navigation.groups.flatMap((group) => group.items)\n\n    return (\n      <nav\n        aria-label={label}\n        data-slot=\"sub-navigation\"\n        data-position=\"top\"\n        className=\"relative flex gap-1 overflow-x-auto border-b pb-2\"\n      >\n        {items.map((item) => (\n          <SubNavigationLink key={`${item.label}-${item.url ?? ''}`} item={item} tab />\n        ))}\n      </nav>\n    )\n  }\n\n  return (\n    <nav\n      aria-label={label}\n      data-slot=\"sub-navigation\"\n      data-position={navigation.position}\n      className=\"flex w-full shrink-0 flex-col gap-4 md:w-56\"\n    >\n      <Slot name=\"page.sub-navigation.sidebar.before\" />\n      {navigation.groups.map((group, index) => (\n        <div key={group.label ?? `group-${index}`} className=\"flex flex-col gap-1\">\n          {group.label && (\n            <p className=\"text-muted-foreground flex items-center gap-1.5 px-3 text-xs font-medium\">\n              {group.icon && <Icon name={group.icon} className=\"size-3.5\" />}\n              {group.label}\n            </p>\n          )}\n          <ul className=\"flex flex-col gap-0.5\">\n            {group.items.map((item) => (\n              <li key={`${item.label}-${item.url ?? ''}`}>\n                <SubNavigationLink item={item} tab={false} />\n              </li>\n            ))}\n          </ul>\n        </div>\n      ))}\n      <Slot name=\"page.sub-navigation.sidebar.after\" />\n    </nav>\n  )\n}\n\n/**\n * Places the sub-navigation next to (`start`/`end`) or above (`top`) the page content.\n * Replace the navigation with `createAlfakit({ components: { 'panel:sub-navigation': … } })`.\n */\nexport function SubNavigationLayout({\n  navigation,\n  children,\n}: {\n  navigation: SubNavigationSchema\n  children: ReactNode\n}) {\n  const registry = useRegistry()\n  const nav = createElement(registry.resolve('panel:sub-navigation') ?? SubNavigation, {\n    navigation,\n  })\n\n  if (navigation.position === 'top') {\n    return (\n      <>\n        <Slot name=\"page.sub-navigation.top.before\" />\n        {nav}\n        <Slot name=\"page.sub-navigation.top.after\" />\n        {children}\n      </>\n    )\n  }\n\n  const content = <div className=\"flex min-w-0 flex-1 flex-col gap-6\">{children}</div>\n\n  return (\n    <div\n      data-slot=\"sub-navigation-layout\"\n      className=\"flex flex-col gap-6 md:flex-row md:items-start\"\n    >\n      {navigation.position === 'end' ? (\n        <>\n          {content}\n          <Slot name=\"page.sub-navigation.end.before\" />\n          {nav}\n          <Slot name=\"page.sub-navigation.end.after\" />\n        </>\n      ) : (\n        <>\n          <Slot name=\"page.sub-navigation.start.before\" />\n          {nav}\n          <Slot name=\"page.sub-navigation.start.after\" />\n          {content}\n        </>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/panel/tenant-menu.d.ts

@@ -0,0 +1,10 @@
+//#region src/components/panel/tenant-menu.d.ts
+/**
+ * The tenant switcher: a sidebar header button, or a compact button in the top bar of the
+ * `topbar` layout (`variant="topbar"`), where the store name shows from `lg` up.
+ */
+export declare function TenantMenu({ variant }: {
+  variant?: 'sidebar' | 'topbar';
+}): import("react").JSX.Element | null;
+//#endregion
+//# sourceMappingURL=tenant-menu.d.ts.map

package/dist/components/panel/tenant-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tenant-menu.d.ts","names":[],"sources":["../../../src/components/panel/tenant-menu.tsx"],"mappings":";;;;;wBAuBgB,aAAa;EAAyB;oBAAgC,IAAA"}