layplux 0.0.1

package/dist/esm/managers/area.mjs

@@ -0,0 +1,12 @@
+import {} from "./widget-container";
+function useArea(skeleton, name, handle) {
+  const container = skeleton.createContainer(name, handle);
+  function add(config) {
+    const item = container.add(config);
+    return item;
+  }
+  return { add, container };
+}
+export {
+  useArea
+};

package/dist/esm/managers/index.mjs

@@ -0,0 +1,3 @@
+export * from "./skeleton";
+export * from "./area";
+export * from "./widget";

package/dist/esm/managers/pane.mjs

@@ -0,0 +1,14 @@
+import { ref } from "vue";
+function usePane(defaultViewMode = "DockPinned") {
+  const viewMode = ref(defaultViewMode);
+  function setViewMode(mode) {
+    viewMode.value = mode;
+  }
+  return {
+    viewMode,
+    setViewMode
+  };
+}
+export {
+  usePane
+};

package/dist/esm/managers/skeleton.mjs

@@ -0,0 +1,192 @@
+import { ref } from "vue";
+import { useArea } from "./area";
+import { isWidget, useWidget } from "./widget";
+import { useWidgetContainer } from "./widget-container";
+import {
+  FocusTracker,
+  createPluginEventBus,
+  getBuiltInLocale
+} from "../utils";
+import { injectThemeCSS } from "./theme";
+function useSkeleton() {
+  const widgets = [];
+  const self = {};
+  const containers = /* @__PURE__ */ new Map();
+  const focusTracker = new FocusTracker();
+  const event = createPluginEventBus("skeleton");
+  const locale = ref(getBuiltInLocale("zh-CN"));
+  function setLocale(name) {
+    locale.value = getBuiltInLocale(name);
+  }
+  const theme = ref("system");
+  const systemDark = ref(
+    typeof window !== "undefined" ? window.matchMedia("(prefers-color-scheme: dark)").matches : false
+  );
+  function resolveTheme() {
+    if (theme.value === "system") {
+      return systemDark.value ? "dark" : "light";
+    }
+    return theme.value;
+  }
+  function isDark() {
+    return resolveTheme() === "dark";
+  }
+  function setTheme(t) {
+    theme.value = t;
+  }
+  const themeName = ref("default");
+  function setThemeName(name) {
+    themeName.value = name;
+  }
+  function registerTheme(name, vars) {
+    injectThemeCSS(name, vars);
+  }
+  if (typeof window !== "undefined") {
+    window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (e) => {
+      systemDark.value = e.matches;
+    });
+  }
+  const topArea = useArea(
+    {
+      createContainer
+    },
+    "topArea",
+    (config, container) => createWidget(config, container)
+  );
+  const bottomArea = useArea(
+    {
+      createContainer
+    },
+    "bottomArea",
+    (config, container) => createWidget(config, container)
+  );
+  const leftTopArea = useArea(
+    {
+      createContainer
+    },
+    "leftTopArea",
+    (config, container) => createWidget(config, container)
+  );
+  const leftBottomArea = useArea(
+    {
+      createContainer
+    },
+    "leftBottomArea",
+    (config, container) => createWidget(config, container)
+  );
+  const rightTopArea = useArea(
+    { createContainer },
+    "rightTopArea",
+    (config, container) => createWidget(config, container)
+  );
+  const rightBottomArea = useArea(
+    { createContainer },
+    "rightBottomArea",
+    (config, container) => createWidget(config, container)
+  );
+  const bottomRightArea = useArea(
+    { createContainer },
+    "bottomRightArea",
+    (config, container) => createWidget(config, container)
+  );
+  const bottomLeftArea = useArea(
+    {
+      createContainer
+    },
+    "bottomLeftArea",
+    (config, container) => createWidget(config, container)
+  );
+  const centerArea = useArea(
+    { createContainer },
+    "centerArea",
+    (config, container) => createWidget(config, container)
+  );
+  function createWidget(config, container) {
+    if (isWidget(config)) {
+      return config;
+    }
+    const widget = useWidget(config, container, self);
+    widgets.push(widget);
+    event.emitGlobal("skeleton:widget-added", { widget });
+    return widget;
+  }
+  const focusedId = ref(null);
+  function toggleFocus(id) {
+    if (focusedId.value === id) {
+      blur();
+    } else {
+      focus(id);
+    }
+  }
+  function focus(id) {
+    focusedId.value = id;
+    event.emitGlobal("skeleton:focus-changed", { focusedId: id });
+  }
+  function blur() {
+    focusedId.value = null;
+    event.emitGlobal("skeleton:focus-changed", { focusedId: null });
+  }
+  function add(config, extraConfig) {
+    if (extraConfig) {
+      config = { ...config, ...extraConfig };
+    }
+    const { area } = config;
+    if (area === "topArea") {
+      topArea.add(config);
+    } else if (area === "bottomArea") {
+      bottomArea.add(config);
+    } else if (area === "leftTopArea") {
+      leftTopArea.add(config);
+    } else if (area === "leftBottomArea") {
+      leftBottomArea.add(config);
+    } else if (area === "bottomLeftArea") {
+      bottomLeftArea.add(config);
+    } else if (area === "rightTopArea") {
+      rightTopArea.add(config);
+    } else if (area === "rightBottomArea") {
+      rightBottomArea.add(config);
+    } else if (area === "bottomRightArea") {
+      bottomRightArea.add(config);
+    } else if (area === "centerArea") {
+      centerArea.add(config);
+    }
+  }
+  function createContainer(name, handle) {
+    const container = useWidgetContainer(handle, self);
+    containers.set(name, container);
+    return container;
+  }
+  Object.assign(self, {
+    widgets,
+    topArea,
+    bottomArea,
+    leftTopArea,
+    leftBottomArea,
+    rightTopArea,
+    rightBottomArea,
+    bottomRightArea,
+    bottomLeftArea,
+    centerArea,
+    focusedId,
+    focusTracker,
+    event,
+    locale,
+    setLocale,
+    theme,
+    resolveTheme,
+    isDark,
+    setTheme,
+    themeName,
+    setThemeName,
+    registerTheme,
+    toggleFocus,
+    focus,
+    blur,
+    add,
+    createContainer
+  });
+  return self;
+}
+export {
+  useSkeleton
+};

package/dist/esm/managers/theme.mjs

@@ -0,0 +1,17 @@
+function injectThemeCSS(name, vars) {
+  const styleId = `layplux-theme-${name}`;
+  let styleEl = document.getElementById(styleId);
+  if (!styleEl) {
+    styleEl = document.createElement("style");
+    styleEl.id = styleId;
+    document.head.appendChild(styleEl);
+  }
+  const varLines = Object.entries(vars).map(([key, value]) => `    ${key}: ${value};`).join("\n");
+  styleEl.textContent = `.layplux-root[data-theme='${name}'] {
+${varLines}
+}
+`;
+}
+export {
+  injectThemeCSS
+};

package/dist/esm/managers/widget-container.mjs

@@ -0,0 +1,76 @@
+import { ref } from "vue";
+function useWidgetContainer(handle, skeleton) {
+  const maps = {};
+  const items = ref([]);
+  const activeId = ref(null);
+  const self = {
+    items,
+    activeId,
+    add,
+    get,
+    getAt,
+    indexOf,
+    remove,
+    activate,
+    deactivate,
+    toggleActive
+  };
+  function add(item) {
+    const nItem = handle(item, self);
+    const origin = get(nItem.name);
+    if (origin === nItem) return origin;
+    const i = origin ? items.value.indexOf(origin) : -1;
+    if (i > -1) {
+      items.value.splice(i, 1, nItem);
+    } else {
+      items.value.push(nItem);
+    }
+    maps[nItem.name] = nItem;
+    return nItem;
+  }
+  function get(name) {
+    return maps[name] || null;
+  }
+  function getAt(index) {
+    return items.value[index] || null;
+  }
+  function indexOf(item) {
+    return items.value.indexOf(item);
+  }
+  function remove(name) {
+    const item = maps[name];
+    if (!item) return null;
+    const i = items.value.indexOf(item);
+    if (i > -1) items.value.splice(i, 1);
+    delete maps[name];
+    skeleton.event.emitGlobal("skeleton:widget-removed", { name });
+    return item;
+  }
+  function activate(id) {
+    if (!maps[id]) return;
+    activeId.value = id;
+    skeleton.focus(id);
+    maps[id].focusable.active();
+    skeleton.event.emitGlobal(`widget:${id}:activated`, { widget: maps[id] });
+  }
+  function deactivate() {
+    const current = activeId.value;
+    activeId.value = null;
+    skeleton.blur();
+    if (current && maps[current]) {
+      maps[current].focusable.suspense();
+      skeleton.event.emitGlobal(`widget:${current}:deactivated`, { widget: maps[current] });
+    }
+  }
+  function toggleActive(id) {
+    if (activeId.value === id) {
+      deactivate();
+    } else {
+      activate(id);
+    }
+  }
+  return self;
+}
+export {
+  useWidgetContainer
+};

package/dist/esm/managers/widget.mjs

@@ -0,0 +1,83 @@
+import { computed, h, watch } from "vue";
+import { createContent, uniqueId } from "../utils";
+import { WidgetTitleView, WidgetView } from "../components";
+import { usePane } from "./pane";
+function useWidget(config, container, skeleton) {
+  const { name, props, type } = config;
+  const active = computed(() => container?.activeId.value === name);
+  const focused = computed(() => skeleton?.focusedId.value === name);
+  const id = uniqueId(type);
+  const align = props?.align ?? "left";
+  const pane = usePane();
+  const focusable = skeleton.focusTracker.create({
+    range: (e) => {
+      const target = e.target;
+      if (!target) {
+        return false;
+      }
+      const el = document.getElementById(id);
+      if (el?.contains(target)) {
+        return true;
+      }
+      if (target.classList.contains("layplux-resize-handle")) {
+        return true;
+      }
+      return false;
+    },
+    onActive: () => {
+      widget.container?.activate(name);
+      skeleton.event?.emitGlobal(`widget:${name}:focus`, { widget });
+    },
+    onBlur: () => {
+      skeleton.blur();
+      skeleton.event?.emitGlobal(`widget:${name}:blur`, { widget });
+      if (pane.viewMode.value === "DockUnpinned" || pane.viewMode.value === "Undock") {
+        container?.deactivate();
+      }
+    }
+  });
+  function renderBody() {
+    const { content, contentProps } = config;
+    return createContent(content, { ...contentProps, config, event: widget.event });
+  }
+  function renderContent() {
+    return h(WidgetView, { key: id, widget });
+  }
+  function renderTitle() {
+    return h(WidgetTitleView, { key: id, widget });
+  }
+  const widget = {
+    id,
+    type,
+    isWidget: true,
+    name,
+    align,
+    config,
+    active,
+    focused,
+    container,
+    pane,
+    focusable,
+    event: skeleton.event,
+    renderBody,
+    renderContent,
+    renderTitle
+  };
+  props?.onInit?.(widget);
+  if (skeleton?.event) {
+    watch(
+      () => pane.viewMode.value,
+      (mode) => {
+        skeleton.event.emitGlobal(`widget:${name}:view-mode-changed`, { widget, mode });
+      }
+    );
+  }
+  return widget;
+}
+function isWidget(obj) {
+  return obj && obj.isWidget;
+}
+export {
+  isWidget,
+  useWidget
+};

package/dist/esm/types/index.mjs

@@ -0,0 +1 @@
+export * from "./config";

package/dist/esm/utils/event-bus.mjs

@@ -0,0 +1,124 @@
+import EventEmitter2, {} from "eventemitter2";
+const globalEmitter = new EventEmitter2({
+  wildcard: true,
+  // 开启通配符
+  delimiter: ":",
+  // 命名空间分隔符，与原版 createModuleEventBus 保持一致
+  newListener: false,
+  // 不触发 newListener 事件，减少不必要开销
+  maxListeners: 200,
+  // 对标原版 createModuleEventBus(pluginName, 200) 的容量参数
+  verboseMemoryLeak: true
+  // 超出 maxListeners 时打印详细的内存泄漏警告
+});
+function createPluginEventBus(namespace) {
+  const privateEmitter = new EventEmitter2({
+    wildcard: true,
+    delimiter: ":",
+    newListener: false,
+    maxListeners: 200,
+    verboseMemoryLeak: true
+  });
+  const prefixed = (event) => `${namespace}:${event}`;
+  return {
+    // ── 私有事件（自动加 namespace 前缀）──────────────────────────
+    emit(event, payload) {
+      privateEmitter.emit(prefixed(event), payload);
+    },
+    /**
+     * 订阅私有事件，返回取消订阅函数。
+     * 利用 EventEmitter2 的 Listener 对象的 .off() 方法，
+     * 无需调用方保存 handler 引用。
+     */
+    on(event, handler) {
+      const listener = privateEmitter.on(
+        prefixed(event),
+        handler,
+        { objectify: true }
+        // 返回 Listener 对象而非 emitter 本身
+      );
+      return () => listener.off();
+    },
+    off(event, handler) {
+      privateEmitter.off(prefixed(event), handler);
+    },
+    /**
+     * 订阅一次后自动取消
+     */
+    once(event, handler) {
+      const listener = privateEmitter.once(prefixed(event), handler, {
+        objectify: true
+      });
+      return () => listener.off();
+    },
+    // ── 全局事件（跨插件通信，走 globalEmitter）────────────────────
+    emitGlobal(event, payload) {
+      globalEmitter.emit(event, payload);
+    },
+    /**
+     * 订阅全局事件，支持通配符：
+     *   onGlobal('layout:*', fn)       → 订阅所有 layout 事件
+     *   onGlobal('layout:panel-**', fn)→ 订阅所有 layout:panel 开头的事件
+     *   onGlobal('**', fn)             → 订阅所有全局事件（慎用）
+     */
+    onGlobal(event, handler) {
+      const listener = globalEmitter.on(event, handler, {
+        objectify: true
+      });
+      return () => listener.off();
+    },
+    offGlobal(event, handler) {
+      globalEmitter.off(event, handler);
+    },
+    onGlobalOnce(event, handler) {
+      const listener = globalEmitter.once(event, handler, {
+        objectify: true
+      });
+      return () => listener.off();
+    },
+    /**
+     * 等待某个全局事件触发，返回 Promise（EventEmitter2 原生支持）
+     * 适合插件 setup 中等待其他插件就绪的场景：
+     *   await ctx.event.waitForGlobal('explorer:ready', 5000)
+     */
+    waitForGlobal(event, timeoutMs) {
+      return new Promise((resolve, reject) => {
+        const timer = timeoutMs ? setTimeout(() => {
+          globalEmitter.off(event, onEvent);
+          reject(new Error(`[EventBus] Timeout waiting for "${event}" after ${timeoutMs}ms`));
+        }, timeoutMs) : null;
+        function onEvent(payload) {
+          if (timer) clearTimeout(timer);
+          resolve(payload);
+        }
+        globalEmitter.once(event, onEvent);
+      });
+    },
+    // ── 清理（插件 destroy 时调用）─────────────────────────────────
+    /**
+     * 移除该插件私有 emitter 上的所有监听器。
+     * 全局监听器需要单独 offGlobal（插件应在 teardown 中手动清理）。
+     */
+    removeAllListeners() {
+      privateEmitter.removeAllListeners();
+    }
+  };
+}
+function emitSystemEvent(event, payload) {
+  globalEmitter.emit(event, payload);
+}
+function onSystemEvent(event, handler) {
+  const listener = globalEmitter.on(event, handler, {
+    objectify: true
+  });
+  return () => listener.off();
+}
+function getGlobalEmitter() {
+  return globalEmitter;
+}
+export {
+  createPluginEventBus,
+  emitSystemEvent,
+  getGlobalEmitter,
+  onSystemEvent
+};

package/dist/esm/utils/focus-tracker.mjs

@@ -0,0 +1,135 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+class FocusTracker {
+  constructor() {
+    /** 焦点栈，栈顶为当前聚焦项 */
+    __publicField(this, "actives", []);
+    /** modal 弹层注册表，用于检查是否有 modal 正在打开 */
+    __publicField(this, "modals", []);
+  }
+  /** 当前焦点栈顶 */
+  get first() {
+    return this.actives[0];
+  }
+  /** 注册一个 modal 弹层，用于 execSave 等时判断是否跳过 */
+  addModal(checkDown, checkOpen) {
+    this.modals.push({ checkDown, checkOpen });
+  }
+  /** 是否有 modal 弹层正在打开 */
+  checkModalOpen() {
+    return this.modals.some((item) => item.checkOpen());
+  }
+  /** 触发保存操作，有 modal 时跳过 */
+  execSave() {
+    if (this.checkModalOpen()) return;
+    if (this.first) this.first.internalTriggerSave();
+  }
+  /** 触发 ESC — 挂起栈顶并调用其 onEsc */
+  execEsc() {
+    const { first } = this;
+    if (first) {
+      this.internalSuspenseItem(first);
+      first.internalTriggerEsc();
+    }
+  }
+  /**
+   * 挂载全局点击监听
+   * 点击 document 时，如果点击目标不在 first 的 range 内，则挂起 first 并触发 blur
+   * @returns 卸载函数
+   */
+  mount(win) {
+    const checkDown = (e) => {
+      const { first } = this;
+      if (first && !first.internalCheckInRange(e)) {
+        this.internalSuspenseItem(first);
+        first.internalTriggerBlur();
+      }
+    };
+    win.document.addEventListener("click", checkDown, true);
+    return () => win.document.removeEventListener("click", checkDown, true);
+  }
+  /** 创建一个 Focusable 实例并绑定到当前 tracker */
+  create(config) {
+    return new Focusable(this, config);
+  }
+  /**
+   * 激活一个 Focusable — 将其推到栈顶
+   * 如果栈顶已有其他 Focusable 且新项不是 modal，则先触发旧栈顶的 blur
+   */
+  internalActiveItem(item) {
+    const first = this.actives[0];
+    if (first === item) return;
+    const i = this.actives.indexOf(item);
+    if (i > -1) this.actives.splice(i, 1);
+    this.actives.unshift(item);
+    if (!item.isModal && first) first.internalTriggerBlur();
+    item.internalTriggerActive();
+  }
+  /**
+   * 挂起一个 Focusable — 将其从栈中移除
+   * 移除后如果还有剩余项，激活新的栈顶
+   */
+  internalSuspenseItem(item) {
+    const i = this.actives.indexOf(item);
+    if (i > -1) {
+      this.actives.splice(i, 1);
+      this.first?.internalTriggerActive();
+    }
+  }
+}
+class Focusable {
+  constructor(tracker, config) {
+    this.tracker = tracker;
+    this.config = config;
+    __publicField(this, "isModal");
+    this.isModal = config.modal ?? false;
+  }
+  /** 激活当前 Focusable，推入焦点栈顶 */
+  active() {
+    this.tracker.internalActiveItem(this);
+  }
+  /** 挂起当前 Focusable，从焦点栈移除 */
+  suspense() {
+    this.tracker.internalSuspenseItem(this);
+  }
+  /** 销毁当前 Focusable（同 suspense，语义化别名） */
+  purge() {
+    this.tracker.internalSuspenseItem(this);
+  }
+  /** 挂载后把真实 DOM 注入，使 range 的 contains 判断生效 */
+  setRange(range) {
+    this.config.range = range;
+  }
+  /** 检查点击事件是否在 range 范围内 */
+  internalCheckInRange(e) {
+    const { range } = this.config;
+    if (!range) return false;
+    if (typeof range === "function") return range(e);
+    return range.contains(e.target);
+  }
+  /** 触发失焦回调 */
+  internalTriggerBlur() {
+    this.config.onBlur?.();
+  }
+  /** 触发保存回调，返回 true 表示已处理 */
+  internalTriggerSave() {
+    if (this.config.onSave) {
+      this.config.onSave();
+      return true;
+    }
+    return false;
+  }
+  /** 触发 ESC 回调 */
+  internalTriggerEsc() {
+    this.config.onEsc?.();
+  }
+  /** 触发激活回调 */
+  internalTriggerActive() {
+    this.config.onActive?.();
+  }
+}
+export {
+  FocusTracker,
+  Focusable
+};

package/dist/esm/utils/index.mjs

@@ -0,0 +1,10 @@
+export * from "./vue";
+export * from "./unique-id";
+export * from "./focus-tracker";
+export * from "./event-bus";
+import { getBuiltInLocale, zhCN, enUS } from "../locales";
+export {
+  enUS,
+  getBuiltInLocale,
+  zhCN
+};

package/dist/esm/utils/unique-id.mjs

@@ -0,0 +1,7 @@
+let guid = Date.now();
+function uniqueId(prefix = "") {
+  return `${prefix}${(guid++).toString(36).toLowerCase()}`;
+}
+export {
+  uniqueId
+};