@lybx-leyw/dsh-pages 0.0.0-stage → 0.1.0

package/lib/client.js

@@ -0,0 +1,958 @@
+window.__ModuleLoader__.load({id:"@lybx-leyw/dsh-pages",factory:(require)=>{var module={exports:{}};var exports=module.exports;
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/client.jsx
+var client_exports = {};
+__export(client_exports, {
+  apply: () => apply,
+  applyWithConfig: () => applyWithConfig,
+  inject: () => inject,
+  installPageShell: () => installPageShell,
+  name: () => name,
+  normalizeConfig: () => normalizeConfig
+});
+module.exports = __toCommonJS(client_exports);
+
+// src/state.js
+function isLocalizedText(value) {
+  return value !== null && typeof value === "object" && typeof value.en === "string" && Object.values(value).every((entry) => typeof entry === "string");
+}
+function normalizeConfig(input = {}) {
+  const text = (key, fallback) => {
+    const value = input[key] ?? fallback;
+    if (typeof value === "string" && value.length > 0 || isLocalizedText(value)) return value;
+    throw new Error(`dsh-pages: \`${key}\` must be a non-empty string or LocalizedText`);
+  };
+  const id = (key, fallback) => {
+    const value = input[key] ?? fallback;
+    if (typeof value !== "string" || value.length === 0) throw new Error(`dsh-pages: \`${key}\` must be a non-empty string`);
+    return value;
+  };
+  const homePage = id("homePage", "home");
+  const managerPage = id("managerPage", "pages");
+  const pageSlot = id("pageSlot", "page.content");
+  if (!pageSlot.startsWith("page.")) throw new Error("dsh-pages: `pageSlot` must start with page.");
+  if (homePage === managerPage) throw new Error("dsh-pages: `managerPage` must differ from `homePage`");
+  return {
+    homePage,
+    managerPage,
+    pageSlot,
+    classPrefix: id("classPrefix", "dsh-pages"),
+    navigationSlot: id("navigationSlot", "page.navigation"),
+    homeLabel: text("homeLabel", { en: "DSH workbench", zh: "DSH \u5DE5\u4F5C\u53F0" }),
+    managerLabel: text("managerLabel", { en: "Pages", zh: "\u9875\u9762\u7BA1\u7406" }),
+    homeIcon: input.homeIcon,
+    managerIcon: input.managerIcon
+  };
+}
+var PAGE_REGIONS = Object.freeze(["top", "overflow", "bottom"]);
+var RAIL_WIDTH = Object.freeze({ min: 40, max: 96, default: 64 });
+function validRailWidth(width) {
+  return Number.isInteger(width) && width >= RAIL_WIDTH.min && width <= RAIL_WIDTH.max;
+}
+function createPagesState(config, initialPage = config.homePage, { preferences } = {}) {
+  let snapshot = { railWidth: preferences?.getRailWidth?.() ?? RAIL_WIDTH.default, activePage: initialPage, pages: Object.freeze([]) };
+  const listeners = /* @__PURE__ */ new Set();
+  const pages = /* @__PURE__ */ new Map();
+  const registrations = /* @__PURE__ */ new Map();
+  let sequence = 0;
+  const publish = (patch) => {
+    if (Object.entries(patch).every(([key, value]) => snapshot[key] === value)) return;
+    snapshot = { ...snapshot, ...patch };
+    for (const listener of [...listeners]) listener();
+  };
+  const publishPages = (patch = {}) => publish({
+    ...patch,
+    pages: Object.freeze([...pages.values()].sort((a, b) => a.order - b.order || a.seq - b.seq).map((entry) => Object.freeze({ ...entry })))
+  });
+  const validateRegion = (region) => {
+    if (!PAGE_REGIONS.includes(region)) throw new Error(`dsh-pages: page \`region\` must be one of ${PAGE_REGIONS.join(", ")}`);
+  };
+  return {
+    getSnapshot: () => snapshot,
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    selectPage(activePage) {
+      if (!pages.has(activePage)) throw new Error(`dsh-pages: unknown page "${activePage}"`);
+      publish({ activePage });
+    },
+    setRailWidth(width) {
+      if (!validRailWidth(width)) throw new RangeError("dsh-pages: navigation width must be an integer between 40 and 96");
+      preferences?.setRailWidth?.(width);
+      publish({ railWidth: width });
+    },
+    /** The returned disposer removes only this live registration, never a later one. */
+    registerPage(spec) {
+      if (spec === null || typeof spec !== "object") throw new TypeError("dsh-pages: registerPage() needs a spec object");
+      const { id, label, icon } = spec;
+      if (typeof id !== "string" || !id) throw new Error("dsh-pages: page `id` must be a non-empty string");
+      if (!(typeof label === "string" && label.length > 0) && !isLocalizedText(label)) throw new Error("dsh-pages: page `label` must be a non-empty string or LocalizedText");
+      if (pages.has(id)) throw new Error(`dsh-pages: page "${id}" is already registered`);
+      const region = spec.region ?? "top";
+      validateRegion(region);
+      const order = spec.order ?? 0;
+      if (!Number.isFinite(order)) throw new Error("dsh-pages: page `order` must be a finite number");
+      if (icon !== void 0 && typeof icon !== "function" && (icon === null || typeof icon !== "object")) throw new Error("dsh-pages: page `icon` must be a component");
+      const entry = { id, label, icon, glyph: spec.glyph ?? "\u25CF", region, order, seq: ++sequence, ...preferences?.getArrangement(id) };
+      pages.set(id, entry);
+      registrations.set(id, entry);
+      publishPages();
+      let live = true;
+      return () => {
+        if (!live) return;
+        live = false;
+        if (registrations.get(id) !== entry) return;
+        pages.delete(id);
+        registrations.delete(id);
+        publishPages(snapshot.activePage === id ? { activePage: config.homePage } : {});
+      };
+    },
+    setPageRegion(id, region) {
+      validateRegion(region);
+      const entry = pages.get(id);
+      if (!entry) return false;
+      preferences?.setArrangement(id, { region });
+      if (entry.region === region) return false;
+      if (entry.pinned) preferences?.setArrangement(id, { pinned: false, pinOrder: 0 });
+      pages.set(id, { ...entry, region, pinned: false, pinOrder: 0 });
+      publishPages();
+      return true;
+    },
+    /** Append/remove a shortcut; do not change recycle membership or register a page. */
+    setPagePinned(id, pinned) {
+      const entry = pages.get(id);
+      if (!entry || entry.region !== "overflow" || Boolean(entry.pinned) === Boolean(pinned)) return false;
+      const pinOrder = pinned ? Math.max(0, ...[...pages.values()].map((page) => page.pinOrder || 0)) + 1 : 0;
+      const patch = { pinned: Boolean(pinned), pinOrder };
+      preferences?.setArrangement(id, { region: "overflow", ...patch });
+      pages.set(id, { ...entry, ...patch });
+      publishPages();
+      return true;
+    },
+    setPageOrder(id, order) {
+      if (!Number.isFinite(order)) throw new Error("dsh-pages: page `order` must be a finite number");
+      const entry = pages.get(id);
+      if (!entry) return false;
+      preferences?.setArrangement(id, { order });
+      if (entry.order === order) return false;
+      pages.set(id, { ...entry, order });
+      publishPages();
+      return true;
+    },
+    /** Move to the front of the default top group, distinct from pinning. */
+    promotePage(id) {
+      const entry = pages.get(id);
+      if (!entry) return false;
+      const others = [...pages.values()].filter((page) => page.region === "top" && page.id !== id);
+      const first = others.length ? Math.min(...others.map((page) => page.order)) : void 0;
+      if (entry.region === "top" && (first === void 0 || entry.order < first)) {
+        preferences?.setArrangement(id, { region: "top", order: entry.order });
+        return false;
+      }
+      const patch = { region: "top", order: first === void 0 ? 0 : first - 1, pinned: false, pinOrder: 0 };
+      pages.set(id, { ...entry, ...patch });
+      preferences?.setArrangement(id, patch);
+      publishPages();
+      return true;
+    }
+  };
+}
+
+// src/page-shell.jsx
+var import_react2 = __toESM(require("react"), 1);
+
+// src/preferences.js
+var VERSION = 1;
+var isRecord = (value) => value !== null && typeof value === "object" && !Array.isArray(value);
+var empty = () => ({ version: VERSION, pages: /* @__PURE__ */ Object.create(null) });
+function preferencesStorageKey(config) {
+  return "dsh-pages:preferences:v1:" + encodeURIComponent(JSON.stringify([
+    config.navigationSlot,
+    config.pageSlot,
+    config.classPrefix,
+    config.homePage
+  ]));
+}
+function decodePreferences(value) {
+  if (!isRecord(value) || value.version !== VERSION || !isRecord(value.pages)) throw new Error("unsupported preferences document");
+  const result = empty();
+  if (validRailWidth(value.railWidth)) result.railWidth = value.railWidth;
+  for (const [id, arrangement] of Object.entries(value.pages)) {
+    if (!id || !isRecord(arrangement)) continue;
+    const saved = {};
+    if (PAGE_REGIONS.includes(arrangement.region)) saved.region = arrangement.region;
+    if (Number.isFinite(arrangement.order)) saved.order = arrangement.order;
+    if (typeof arrangement.pinned === "boolean") saved.pinned = arrangement.pinned;
+    if (Number.isFinite(arrangement.pinOrder) && arrangement.pinOrder >= 0) saved.pinOrder = arrangement.pinOrder;
+    if (Object.keys(saved).length) result.pages[id] = saved;
+  }
+  return result;
+}
+function createBrowserPreferences(config, { getStorage = () => globalThis.localStorage, warn = (...args) => console.warn(...args) } = {}) {
+  const key = preferencesStorageKey(config);
+  let document2 = empty();
+  const report = (error) => warn("dsh-pages: browser preferences unavailable or invalid; continuing with in-memory settings.", error);
+  try {
+    const storage = getStorage();
+    if (!storage) throw new Error("localStorage is unavailable");
+    const raw = storage.getItem(key);
+    if (raw !== null && raw !== void 0) document2 = decodePreferences(JSON.parse(raw));
+  } catch (error) {
+    report(error);
+  }
+  const save = () => {
+    try {
+      const storage = getStorage();
+      if (!storage) throw new Error("localStorage is unavailable");
+      storage.setItem(key, JSON.stringify(document2));
+    } catch (error) {
+      report(error);
+    }
+  };
+  return {
+    key,
+    getRailWidth() {
+      return document2.railWidth ?? RAIL_WIDTH.default;
+    },
+    setRailWidth(width) {
+      if (!validRailWidth(width)) throw new RangeError("dsh-pages: navigation width must be an integer between 40 and 96");
+      document2.railWidth = width;
+      save();
+    },
+    getArrangement(id) {
+      return { ...document2.pages[id] };
+    },
+    setArrangement(id, patch) {
+      const next = { ...document2.pages[id], ...patch };
+      const valid = {};
+      if (PAGE_REGIONS.includes(next.region)) valid.region = next.region;
+      if (Number.isFinite(next.order)) valid.order = next.order;
+      if (typeof next.pinned === "boolean") valid.pinned = next.pinned;
+      if (Number.isFinite(next.pinOrder) && next.pinOrder >= 0) valid.pinOrder = next.pinOrder;
+      document2.pages[id] = valid;
+      save();
+    }
+  };
+}
+
+// src/pages-service.js
+function createPages(input = {}, options = {}) {
+  const config = normalizeConfig(input);
+  const preferences = options.preferences ?? (typeof window !== "undefined" ? createBrowserPreferences(config) : void 0);
+  const state = createPagesState(config, config.homePage, { preferences });
+  const cleanups = [
+    state.registerPage({ id: config.homePage, label: config.homeLabel, icon: config.homeIcon, glyph: "\u2302", order: 0 }),
+    state.registerPage({ id: config.managerPage, label: config.managerLabel, icon: config.managerIcon, glyph: "\u25A6", order: 90, region: "bottom" })
+  ];
+  return {
+    state,
+    service: {
+      config,
+      getSnapshot: state.getSnapshot,
+      subscribe: state.subscribe,
+      selectPage: state.selectPage,
+      registerPage: state.registerPage,
+      setPageRegion: state.setPageRegion,
+      setPagePinned: state.setPagePinned,
+      setRailWidth: state.setRailWidth,
+      setPageOrder: state.setPageOrder,
+      promotePage: state.promotePage
+    },
+    dispose() {
+      for (const cleanup of cleanups.splice(0).reverse()) cleanup();
+    }
+  };
+}
+
+// src/page-manager.jsx
+var import_react = __toESM(require("react"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+var REGIONS = ["top", "overflow", "bottom"];
+var DRAG_TYPE = "application/x-dsh-pages-manager";
+var styles = `
+[data-pages-manager]{box-sizing:border-box;width:100%;max-width:960px;min-width:0;margin:0 auto;padding:clamp(16px,4vw,40px);color:var(--dsw-alias-label-primary,#101318);font:inherit;overflow-wrap:anywhere}
+[data-pages-manager] *{box-sizing:border-box;min-width:0}
+[data-pages-manager] h2{margin:0;font-size:24px;letter-spacing:-.04em;font-weight:600}
+[data-pages-manager] header p{margin:8px 0 28px;color:var(--dsw-alias-label-secondary,#6b7178);font-size:13px;line-height:1.6}
+[data-pages-manager] section{margin:0 0 26px}
+[data-pages-manager] h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--dsw-alias-label-secondary,#6b7178)}
+[data-pages-manager] h3 span{font:11px ui-monospace,monospace;opacity:.6}
+[data-pages-manager] ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;min-height:48px;border-radius:8px}
+[data-pages-manager] li{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--dsw-alias-settings-card-stroke,#00000014);border-radius:8px;background:var(--dsw-alias-settings-card-fill,#00000005)}
+[data-pages-manager] li[draggable=true]{cursor:grab}
+[data-pages-manager] li[data-dragging=true]{opacity:.4}
+[data-pages-manager] li[data-insert=before]{box-shadow:inset 0 3px var(--dsw-alias-brand-primary,#2f6fed)}
+[data-pages-manager] li[data-insert=after]{box-shadow:inset 0 -3px var(--dsw-alias-brand-primary,#2f6fed)}
+[data-pages-manager] ul[data-drop=true]{outline:2px dashed var(--dsw-alias-brand-primary,#2f6fed);outline-offset:3px}
+[data-pages-manager] .pm-identity{display:flex;align-items:center;gap:10px;flex:1 1 180px}
+[data-pages-manager] .pm-grip{color:var(--dsw-alias-label-caption,#8a9099);user-select:none}
+[data-pages-manager] .pm-icon{display:grid;place-items:center;width:22px;height:22px;flex:none}
+[data-pages-manager] .pm-icon svg{width:20px;height:20px}
+[data-pages-manager] .pm-name{font-size:13px;font-weight:500}
+[data-pages-manager] .pm-id{display:block;margin-top:2px;font:10px ui-monospace,monospace;color:var(--dsw-alias-label-caption,#8a9099)}
+[data-pages-manager] .pm-actions{display:flex;flex:0 1 auto;flex-wrap:wrap;align-items:center;gap:6px;max-width:100%}
+[data-pages-manager] button,[data-pages-manager] select{min-height:32px;max-width:100%;border:1px solid var(--dsw-alias-settings-card-stroke,#0000001f);border-radius:5px;background:var(--dsw-alias-bg-base,#f4f5f7);color:var(--dsw-alias-label-secondary,#4b5058);font:inherit;font-size:12px;padding:4px 8px;cursor:pointer}
+[data-pages-manager] button{min-width:32px;white-space:normal;overflow-wrap:anywhere}
+[data-pages-manager] button:hover:not(:disabled){background:var(--dsw-alias-button-elevated-fill,#0000000f)}
+[data-pages-manager] :is(button,select):focus-visible{outline:2px solid var(--dsw-alias-brand-primary,#2f6fed);outline-offset:2px}
+[data-pages-manager] button:disabled{opacity:.35;cursor:not-allowed}
+[data-pages-manager] button[role=switch][aria-checked=false]{color:var(--dsw-alias-label-caption,#8a9099)}
+[data-pages-manager] .pm-empty{display:flex;align-items:center;border-style:dashed;color:var(--dsw-alias-label-caption,#8a9099);font-size:12px;min-height:48px}
+@media(max-width:560px){[data-pages-manager] .pm-identity{flex-basis:100%}[data-pages-manager] .pm-actions{flex:1 1 100%}[data-pages-manager] li{padding:10px}}
+`;
+function PageManager({ entries, railWidth = 64, resolveLabel, actions, t }) {
+  const [dragging, setDragging] = import_react.default.useState(null);
+  const [dropAt, setDropAt] = import_react.default.useState(null);
+  const regionOf = (entry) => REGIONS.includes(entry.region) ? entry.region : "overflow";
+  const ordered = [...entries].sort((a, b) => (Number.isFinite(a.order) ? a.order : 0) - (Number.isFinite(b.order) ? b.order : 0));
+  const groups = Object.fromEntries(REGIONS.map((region) => [region, ordered.filter((entry) => regionOf(entry) === region)]));
+  const endDrag = () => {
+    setDragging(null);
+    setDropAt(null);
+  };
+  const normalize = (list) => list.forEach((entry, index) => actions.setPageOrder(entry.id, index));
+  const relocate = (id, region, targetId = null, side = "after", promote = false) => {
+    const entry = entries.find((item) => item.id === id);
+    if (!entry || id === targetId) return;
+    const source = regionOf(entry);
+    const destination = groups[region].filter((item) => item.id !== id);
+    const targetIndex = destination.findIndex((item) => item.id === targetId);
+    const index = promote ? 0 : targetIndex < 0 ? destination.length : targetIndex + (side === "after" ? 1 : 0);
+    destination.splice(index, 0, entry);
+    if (promote) actions.promotePage(id);
+    else if (source !== region) actions.setPageRegion(id, region);
+    if (source !== region) normalize(groups[source].filter((item) => item.id !== id));
+    normalize(destination);
+  };
+  const move = (entry, region, delta) => {
+    const list = [...groups[region]];
+    const index = list.findIndex((item) => item.id === entry.id);
+    if (index < 0 || index + delta < 0 || index + delta >= list.length) return;
+    [list[index], list[index + delta]] = [list[index + delta], list[index]];
+    normalize(list);
+  };
+  const carriedId = (event) => {
+    const transferred = event.dataTransfer?.getData(DRAG_TYPE) || event.dataTransfer?.getData("text/plain");
+    return entries.some((entry) => entry.id === transferred) ? transferred : dragging;
+  };
+  const canDrop = () => dragging !== null;
+  const regionTitle = (region) => t(region === "top" ? "managerTop" : region === "bottom" ? "managerBottom" : "managerHidden");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { "data-pages-manager": "", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { "data-pages-manager-style": "", children: styles }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: t("managerTitle") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: t("managerHint") })
+    ] }),
+    actions.setRailWidth && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("section", { "aria-label": t("navigationWidth"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { style: { display: "flex", alignItems: "center", gap: 12, flexWrap: "wrap" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: t("navigationWidth") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          "aria-label": t("navigationWidth"),
+          type: "range",
+          min: "40",
+          max: "96",
+          step: "1",
+          value: railWidth,
+          onChange: (event) => actions.setRailWidth(Number(event.target.value))
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("output", { children: [
+        railWidth,
+        " px"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", onClick: () => actions.setRailWidth(64), children: t("resetWidth") })
+    ] }) }),
+    REGIONS.map((region) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { "aria-label": regionTitle(region), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h3", { children: [
+        regionTitle(region),
+        " ",
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "aria-hidden": "true", children: groups[region].length })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "ul",
+        {
+          "aria-label": regionTitle(region),
+          "data-group": region,
+          "data-drop": dropAt?.region === region && dropAt.id === null,
+          onDragOver: (event) => {
+            if (!canDrop(region) || event.target !== event.currentTarget && groups[region].length) return;
+            event.preventDefault();
+            event.dataTransfer.dropEffect = "move";
+            setDropAt({ region, id: null, side: "after" });
+          },
+          onDragLeave: (event) => {
+            if (!event.currentTarget.contains(event.relatedTarget)) setDropAt(null);
+          },
+          onDrop: (event) => {
+            event.preventDefault();
+            const id = carriedId(event);
+            if (id !== null) relocate(id, region);
+            endDrag();
+          },
+          children: [
+            groups[region].length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { className: "pm-empty", children: t("managerEmpty") }),
+            groups[region].map((entry, index) => {
+              const label = resolveLabel(entry);
+              const visible = region !== "overflow";
+              const visibilityKey = visible ? "managerHide" : "managerShow";
+              const Icon = entry.icon;
+              return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                "li",
+                {
+                  "aria-label": label,
+                  draggable: true,
+                  "data-dragging": dragging === entry.id,
+                  "data-insert": dropAt?.region === region && dropAt.id === entry.id ? dropAt.side : void 0,
+                  onDragStart: (event) => {
+                    if (event.target.closest?.("button,select")) {
+                      event.preventDefault();
+                      return;
+                    }
+                    event.dataTransfer.setData(DRAG_TYPE, entry.id);
+                    event.dataTransfer.setData("text/plain", entry.id);
+                    event.dataTransfer.effectAllowed = "move";
+                    setDragging(entry.id);
+                  },
+                  onDragEnd: endDrag,
+                  onDragOver: (event) => {
+                    event.stopPropagation();
+                    if (!canDrop(region) || dragging === entry.id) return;
+                    event.preventDefault();
+                    event.dataTransfer.dropEffect = "move";
+                    const bounds = event.currentTarget.getBoundingClientRect();
+                    setDropAt({ region, id: entry.id, side: event.clientY < bounds.top + bounds.height / 2 ? "before" : "after" });
+                  },
+                  onDrop: (event) => {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    const bounds = event.currentTarget.getBoundingClientRect();
+                    relocate(carriedId(event), region, entry.id, event.clientY < bounds.top + bounds.height / 2 ? "before" : "after");
+                    endDrag();
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pm-identity", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pm-grip", "aria-hidden": "true", children: "\u283F" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pm-icon", "aria-hidden": "true", children: Icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {}) : entry.glyph }),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pm-name", children: label }),
+                        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pm-id", children: entry.id })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pm-actions", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        "select",
+                        {
+                          "aria-label": `${t("managerGroup")} ${label}`,
+                          value: region,
+                          onChange: (event) => relocate(entry.id, event.target.value),
+                          children: REGIONS.map((value) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value, children: regionTitle(value) }, value))
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        "button",
+                        {
+                          type: "button",
+                          role: "switch",
+                          "aria-checked": visible,
+                          "aria-label": `${t(visibilityKey)} ${label}`,
+                          onClick: () => relocate(entry.id, visible ? "overflow" : "top"),
+                          children: t(visibilityKey)
+                        }
+                      ),
+                      region === "overflow" && actions.setPagePinned && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        "button",
+                        {
+                          type: "button",
+                          "aria-pressed": Boolean(entry.pinned),
+                          "aria-label": `${t(entry.pinned ? "unpin" : "pin")} ${label}`,
+                          onClick: () => actions.setPagePinned(entry.id, !entry.pinned),
+                          children: t(entry.pinned ? "unpin" : "pin")
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", "aria-label": `${t("managerUp")} ${label}`, disabled: index === 0, onClick: () => move(entry, region, -1), children: "\u2191" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", "aria-label": `${t("managerDown")} ${label}`, disabled: index === groups[region].length - 1, onClick: () => move(entry, region, 1), children: "\u2193" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                        "button",
+                        {
+                          type: "button",
+                          "aria-label": `${t("managerPin")} ${label}`,
+                          disabled: region === "top" && index === 0,
+                          onClick: () => relocate(entry.id, "top", null, "before", true),
+                          children: "\u21C8"
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", "aria-label": `${t("managerOpen")} ${label}`, onClick: () => actions.selectPage(entry.id), children: t("managerOpen") })
+                    ] })
+                  ]
+                },
+                entry.id
+              );
+            })
+          ]
+        }
+      )
+    ] }, region))
+  ] });
+}
+
+// src/page-shell.jsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var namespace = "dsh-pages";
+var translations = {
+  en: {
+    navigation: "Pages",
+    back: "Back to workbench",
+    more: "More pages",
+    pin: "Pin to top group",
+    unpin: "Unpin",
+    managerTitle: "Page manager",
+    managerHint: "Arrange the top, recycle and bottom groups. Recycled pages remain accessible in \u2026; pin them to append shortcuts after \u2026 in the top group.",
+    managerTop: "Top group",
+    managerBottom: "Bottom group",
+    managerHidden: "Recycle group",
+    managerEmpty: "No pages here.",
+    managerUp: "Move up",
+    managerDown: "Move down",
+    managerShow: "Show",
+    managerHide: "Hide",
+    navigationWidth: "Navigation width",
+    resetWidth: "Reset width",
+    managerPin: "Move to top",
+    managerOpen: "Open",
+    managerGroup: "Group"
+  },
+  zh: {
+    navigation: "\u9875\u9762",
+    back: "\u8FD4\u56DE\u5DE5\u4F5C\u53F0",
+    more: "\u66F4\u591A\u9875\u9762",
+    pin: "\u56FA\u5B9A\u5230\u9876\u90E8\u7EC4\u672B\u5C3E",
+    unpin: "\u53D6\u6D88\u56FA\u5B9A",
+    managerTitle: "\u9875\u9762\u7BA1\u7406",
+    managerHint: "\u7BA1\u7406\u9876\u90E8\u9ED8\u8BA4\u7EC4\u3001\u56DE\u6536\u7EC4\u548C\u5E95\u90E8\u7EC4\u3002\u6536\u8D77\u7684\u9875\u9762\u4ECD\u53EF\u4ECE \u2026 \u6253\u5F00\uFF1B\u56FA\u5B9A\u540E\u5728\u9876\u90E8\u7EC4\u7684 \u2026 \u4E0B\u65B9\u8FFD\u52A0\u5165\u53E3\u3002",
+    managerTop: "\u9876\u90E8\u7EC4",
+    managerBottom: "\u5E95\u90E8\u7EC4",
+    managerHidden: "\u56DE\u6536\u7EC4",
+    managerEmpty: "\u8FD9\u91CC\u6CA1\u6709\u9875\u9762\u3002",
+    managerUp: "\u4E0A\u79FB",
+    managerDown: "\u4E0B\u79FB",
+    managerShow: "\u663E\u793A",
+    managerHide: "\u9690\u85CF",
+    navigationWidth: "\u5BFC\u822A\u5BBD\u5EA6",
+    resetWidth: "\u6062\u590D\u9ED8\u8BA4\u5BBD\u5EA6",
+    managerPin: "\u79FB\u5230\u6700\u524D",
+    managerOpen: "\u6253\u5F00",
+    managerGroup: "\u5206\u7EC4"
+  }
+};
+var secondary = "var(--dsw-alias-label-secondary, #aaa)";
+var border = "1px solid var(--dsw-alias-border-l2, #555)";
+var surface = "var(--dsw-alias-bg-layer-2, #181818)";
+var foreground = "var(--dsw-alias-label-primary, #ddd)";
+var button = {
+  font: "inherit",
+  fontSize: 13,
+  color: foreground,
+  background: surface,
+  border,
+  borderRadius: 6,
+  padding: "9px 14px",
+  cursor: "pointer"
+};
+var layoutCss = (width) => `
+#root:has([data-dsh-pages-shell]) { box-sizing: border-box; padding-left: ${width}px; }
+[data-dsh-pages-rail] button:hover { background: var(--dsw-alias-interactive-bg-hover, #333); }
+[data-dsh-pages-shell] button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
+`;
+function RailIcon({ width, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "data-dsh-pages-rail-icon": "", "aria-hidden": "true", style: {
+    display: "grid",
+    gridTemplateColumns: "23px",
+    gridTemplateRows: "23px",
+    placeItems: "center",
+    width: 23,
+    height: 23,
+    lineHeight: 1,
+    transform: `scale(${width / 64})`,
+    transformOrigin: "center"
+  }, children });
+}
+function PageIcon({ entry, home }) {
+  if (entry.icon) return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(entry.icon, {});
+  if (entry.id === home) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "23", height: "23", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.65", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m3 10 9-7 9 7M6 9v12h12V9M10 21v-7h4v7" }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "23", height: "23", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.65", "aria-hidden": "true", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: "3", y: "4", width: "7", height: "7", rx: "1.6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: "14", y: "4", width: "7", height: "7", rx: "1.6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: "3", y: "13", width: "7", height: "7", rx: "1.6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { x: "14", y: "13", width: "7", height: "7", rx: "1.6" })
+  ] });
+}
+function PageShell(props) {
+  const snapshot = props.usePages((value) => value);
+  const railWidth = snapshot.railWidth ?? 64;
+  const scale = railWidth / 64;
+  const railButton = {
+    width: 46 * scale,
+    height: 46 * scale,
+    minHeight: 46 * scale,
+    padding: 0,
+    boxSizing: "border-box",
+    display: "grid",
+    placeItems: "center",
+    flexShrink: 0,
+    border: "none",
+    borderRadius: 9 * scale,
+    cursor: "pointer",
+    font: "inherit",
+    lineHeight: 1
+  };
+  const home = props.homePage;
+  const open = snapshot.activePage !== home;
+  const manager = snapshot.activePage === props.managerPage;
+  const close = (0, import_react2.useRef)(null);
+  const shell = (0, import_react2.useRef)(null);
+  const moreButton = (0, import_react2.useRef)(null);
+  const contentId = (0, import_react2.useId)();
+  const [menu, setMenu] = (0, import_react2.useState)(null);
+  const active = snapshot.pages.find((entry) => entry.id === snapshot.activePage);
+  const top = snapshot.pages.filter((entry) => entry.region === "top");
+  const parked = snapshot.pages.filter((entry) => entry.region === "overflow");
+  const menuTop = menu === "more" && moreButton.current !== null ? Math.max(12, Math.min(moreButton.current.getBoundingClientRect().top, globalThis.innerHeight - 260)) : 12;
+  const dismiss = () => props.selectPage(home);
+  (0, import_react2.useEffect)(() => {
+    if (!open) return;
+    close.current?.focus();
+    const containFocus = (event) => {
+      if (!shell.current?.contains(event.target)) close.current?.focus();
+    };
+    document.addEventListener("focusin", containFocus);
+    return () => document.removeEventListener("focusin", containFocus);
+  }, [open, snapshot.activePage]);
+  (0, import_react2.useEffect)(() => {
+    if (menu === null) return void 0;
+    const onPointer = (event) => {
+      if (event.target.closest?.("[data-dsh-pages-more], [data-dsh-pages-more-panel]")) return;
+      setMenu(null);
+    };
+    const onKey = (event) => {
+      if (event.key === "Escape") setMenu(null);
+    };
+    document.addEventListener("pointerdown", onPointer, true);
+    document.addEventListener("keydown", onKey, true);
+    return () => {
+      document.removeEventListener("pointerdown", onPointer, true);
+      document.removeEventListener("keydown", onKey, true);
+    };
+  }, [menu]);
+  const keyDown = (event) => {
+    if (!open) return;
+    event.stopPropagation();
+    if (event.key === "Escape") {
+      event.preventDefault();
+      dismiss();
+    } else if (event.key === "Tab") {
+      const controls = Array.from(shell.current.querySelectorAll('button:not(:disabled), input:not(:disabled), select:not(:disabled), a[href], [tabindex="0"]')).filter((node) => node.getClientRects().length > 0);
+      const index = controls.indexOf(document.activeElement);
+      const next = event.shiftKey ? index <= 0 ? controls.length - 1 : index - 1 : (index + 1) % controls.length;
+      event.preventDefault();
+      (controls[next] || shell.current).focus();
+    }
+  };
+  const navItem = (entry) => {
+    const selected = entry.id === snapshot.activePage;
+    const label = props.resolveLabel(entry.label);
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "button",
+      {
+        type: "button",
+        title: label,
+        "aria-label": label,
+        "aria-current": selected ? "page" : void 0,
+        "aria-controls": entry.id === home ? void 0 : contentId,
+        onClick: () => props.selectPage(entry.id),
+        style: {
+          ...railButton,
+          color: selected ? foreground : secondary,
+          background: selected ? "var(--dsw-alias-interactive-bg-hover, #333)" : "transparent",
+          boxShadow: selected ? "inset 2px 0 0 currentColor" : "none"
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RailIcon, { width: railWidth, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PageIcon, { entry, home }) })
+      },
+      entry.id
+    );
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      ref: shell,
+      "data-dsh-pages-shell": "",
+      "data-active-page": snapshot.activePage,
+      role: open ? "dialog" : void 0,
+      "aria-modal": open ? true : void 0,
+      "aria-label": open ? props.resolveLabel(active?.label ?? "") : void 0,
+      tabIndex: open ? -1 : void 0,
+      style: { position: "fixed", inset: 0, zIndex: 1e3, pointerEvents: "none", color: foreground, fontFamily: "inherit" },
+      onKeyDown: keyDown,
+      onKeyUp: (event) => {
+        if (open) event.stopPropagation();
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("style", { "data-dsh-pages-layout": "", children: layoutCss(railWidth) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("nav", { "data-dsh-pages-rail": "", "aria-label": props.t("navigation"), style: {
+          position: "absolute",
+          inset: "0 auto 0 0",
+          width: railWidth,
+          boxSizing: "border-box",
+          background: surface,
+          borderRight: border,
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          gap: 8 * scale,
+          padding: `${16 * scale}px ${8 * scale}px`,
+          pointerEvents: "auto",
+          overflowY: "auto",
+          overflowX: "hidden"
+        }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": "true", style: { display: "grid", placeItems: "center", flexShrink: 0, width: 46 * scale, fontSize: 11 * scale, lineHeight: 1, letterSpacing: "0.08em", fontWeight: 700, padding: `${4 * scale}px 0 ${20 * scale}px`, color: secondary }, children: "P /" }),
+          top.map(navItem),
+          parked.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "button",
+            {
+              ref: moreButton,
+              type: "button",
+              "data-dsh-pages-more": "",
+              title: props.t("more"),
+              "aria-label": props.t("more"),
+              "aria-expanded": menu === "more",
+              "aria-haspopup": "menu",
+              onClick: () => setMenu(menu === "more" ? null : "more"),
+              style: {
+                ...railButton,
+                color: parked.some((entry) => entry.id === snapshot.activePage) ? foreground : secondary,
+                background: menu === "more" ? "var(--dsw-alias-interactive-bg-hover, #333)" : "transparent"
+              },
+              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RailIcon, { width: railWidth, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "23", height: "23", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "5", cy: "12", r: "1.9" }),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "1.9" }),
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "19", cy: "12", r: "1.9" })
+              ] }) })
+            }
+          ),
+          parked.some((entry) => entry.pinned) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "data-dsh-pages-pin-divider": "", style: { display: "block", flexShrink: 0, width: 28 * scale, borderTop: border } }),
+          parked.filter((entry) => entry.pinned).sort((a, b) => a.pinOrder - b.pinOrder).map(navItem),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: { flex: 1 } }),
+          snapshot.pages.filter((entry) => entry.region === "bottom").map(navItem)
+        ] }),
+        menu === "more" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { "data-dsh-pages-more-panel": "", role: "menu", "aria-label": props.t("more"), style: {
+          position: "fixed",
+          top: menuTop,
+          left: railWidth + 8,
+          zIndex: 1001,
+          minWidth: 200,
+          maxHeight: "60vh",
+          overflowY: "auto",
+          padding: 6,
+          boxSizing: "border-box",
+          pointerEvents: "auto",
+          background: surface,
+          border,
+          borderRadius: 10,
+          boxShadow: "0 10px 32px #0007"
+        }, children: parked.map((entry) => {
+          const label = props.resolveLabel(entry.label);
+          const selected = entry.id === snapshot.activePage;
+          return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { "data-dsh-pages-more-row": "", style: { display: "flex", alignItems: "center", gap: 4 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                "aria-current": selected ? "page" : void 0,
+                onClick: () => {
+                  setMenu(null);
+                  props.selectPage(entry.id);
+                },
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 10,
+                  flex: 1,
+                  minWidth: 0,
+                  minHeight: 36,
+                  padding: "0 10px",
+                  border: "none",
+                  borderRadius: 7,
+                  cursor: "pointer",
+                  font: "inherit",
+                  textAlign: "left",
+                  color: selected ? foreground : secondary,
+                  background: selected ? "var(--dsw-alias-interactive-bg-hover, #333)" : "transparent"
+                },
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: { display: "grid", placeItems: "center", width: 20, height: 20 }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PageIcon, { entry, home }) }),
+                  label
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "button",
+              {
+                type: "button",
+                title: props.t(entry.pinned ? "unpin" : "pin"),
+                "aria-label": `${props.t(entry.pinned ? "unpin" : "pin")} ${label}`,
+                "data-dsh-pages-pin": "",
+                "aria-pressed": Boolean(entry.pinned),
+                onClick: () => props.setPagePinned(entry.id, !entry.pinned),
+                style: {
+                  width: 32,
+                  minHeight: 32,
+                  display: "grid",
+                  placeItems: "center",
+                  flexShrink: 0,
+                  border: "none",
+                  borderRadius: 6,
+                  cursor: "pointer",
+                  font: "inherit",
+                  color: secondary,
+                  background: "transparent"
+                },
+                children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M14 2 22 10l-2.6 2.6-1.4-1.4-3.5 3.5.7 4.3-2.1 2.1-3.5-3.5L4 23l-1-1 4.5-5.5L4 13l2.1-2.1 4.3.7 3.5-3.5-1.4-1.4z" }) })
+              }
+            )
+          ] }, entry.id);
+        }) }),
+        open && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { id: contentId, "aria-labelledby": contentId, style: {
+          position: "absolute",
+          inset: `0 0 0 ${railWidth}px`,
+          overflow: "auto",
+          boxSizing: "border-box",
+          pointerEvents: "auto",
+          background: surface,
+          color: foreground,
+          fontSize: 14,
+          lineHeight: 1.6,
+          padding: "24px clamp(16px, 5vw, 80px)"
+        }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("header", { style: { borderBottom: border, paddingBottom: 24, display: "flex", flexWrap: "wrap", alignItems: "center", justifyContent: "space-between", gap: 16 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("button", { type: "button", ref: close, style: button, onClick: dismiss, children: [
+              "\u2190 ",
+              props.t("back")
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: { color: secondary, fontSize: 11, letterSpacing: "0.12em" }, children: props.resolveLabel(active?.label ?? "") })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { maxWidth: 760, margin: "clamp(32px, 8vh, 100px) auto" }, children: manager ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            PageManager,
+            {
+              entries: snapshot.pages,
+              railWidth,
+              resolveLabel: (entry) => props.resolveLabel(entry.label),
+              t: props.t,
+              actions: {
+                selectPage: props.selectPage,
+                setPageRegion: props.setPageRegion,
+                setPagePinned: props.setPagePinned,
+                setRailWidth: props.setRailWidth,
+                setPageOrder: props.setPageOrder,
+                promotePage: props.promotePage
+              }
+            }
+          ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react2.default.Fragment, { children: props.renderSlot(props.pageSlot, {}, { entryKey: snapshot.activePage }) }, snapshot.activePage) })
+        ] })
+      ]
+    }
+  );
+}
+function installPageShell(ctx, config = {}) {
+  const { slots } = ctx;
+  const cleanups = [];
+  let disposed = false;
+  const dispose = () => {
+    if (disposed) return;
+    disposed = true;
+    let failure;
+    for (const cleanup of cleanups.splice(0).reverse()) {
+      try {
+        cleanup();
+      } catch (error) {
+        failure ??= error;
+      }
+    }
+    if (failure) throw failure;
+  };
+  return ctx.effect(() => {
+    try {
+      const pages = createPages(config);
+      cleanups.push(() => pages.dispose());
+      cleanups.push(ctx.reflect.provide("pages", pages.service));
+      cleanups.push(ctx.locale.register(namespace, translations));
+      cleanups.push(slots.inject("shell.overlay", () => slots.register({
+        name: "shell.overlay",
+        id: "dsh-pages.rail",
+        children: { [pages.service.config.pageSlot]: { kind: "keyed", scope: "root" } },
+        inject: () => ({
+          hooks: { pages: { getSnapshot: pages.state.getSnapshot, subscribe: pages.state.subscribe } },
+          homePage: pages.service.config.homePage,
+          managerPage: pages.service.config.managerPage,
+          pageSlot: pages.service.config.pageSlot,
+          selectPage: pages.service.selectPage,
+          setPageRegion: pages.service.setPageRegion,
+          setPagePinned: pages.service.setPagePinned,
+          setRailWidth: pages.service.setRailWidth,
+          setPageOrder: pages.service.setPageOrder,
+          promotePage: pages.service.promotePage,
+          resolveLabel: (value) => typeof value === "string" ? value : ctx.locale.resolveText(value)
+        }),
+        locale: namespace
+      }, PageShell)));
+      return dispose;
+    } catch (error) {
+      try {
+        dispose();
+      } catch {
+      }
+      throw error;
+    }
+  }, "dsh-pages: page shell");
+}
+
+// src/client.jsx
+var name = "dsh-pages-client";
+var inject = { slots: { required: true }, locale: { required: true } };
+function apply(ctx, config = {}) {
+  return applyWithConfig(ctx, config);
+}
+function applyWithConfig(ctx, config = {}) {
+  return installPageShell(ctx, normalizeConfig(config));
+}
+return module.exports;}});