@epxing/dashboard 0.0.0-stage → 5.3.0-beta.1

package/dist/src/grid/gridstackParams.js

@@ -0,0 +1,69 @@
+function px(n) {
+  return `${n}px`;
+}
+function toGridstackOptions(resolved, { float = false, engineClass, staticGrid = false } = {}) {
+  const { colNum, rowHeight, gapX, gapY } = resolved;
+  const mx = gapX / 2;
+  const my = gapY / 2;
+  const options = {
+    column: colNum,
+    cellHeight: rowHeight + gapY,
+    margin: `${px(my)} ${px(mx)} ${px(my)} ${px(mx)}`,
+    float,
+    staticGrid,
+    // R23：被推挤的项走库的 .grid-stack-animate 过渡（旧库也有 200ms transform 过渡，关掉会显得生硬）；
+    // 库在从空 load / 跨网格 drop 时会自行临时关闭再恢复
+    animate: true,
+    resizable: { handles: "all" },
+    // 把手常驻 DOM（库按 !alwaysShowResizeHandle 决定 autoHide、会覆盖 resizable.autoHide；autoHide 靠壳的 mouseover 摘类，
+    // 嵌套网格下 overResizeElement 被子项先占住就摘不掉）；把手透明，视觉由 epx-dashboard-design-item 的圆点负责
+    alwaysShowResizeHandle: true,
+    // 整卡可拖（R22，与旧版 dragIgnoreFrom=".resize-point" 的手感一致）：handle 用库默认的内容盒；
+    // cancel 排除操作条（库内置已跳过 input / textarea / button / select / option / contenteditable / .ui-resizable-handle），
+    // 以及子网格里按在锁定项上时子实例给所在层根元素打的「按下」标记（锁定的是子项、容器不因此起拖，任何嵌套层级都适用；
+    // 子网格空白处按下不打标记、容器由此起拖。不能直接写 .grid-stack——cancel 是 e.target.closest()，任何项的祖先链都含自己所在的网格，写了就全都拖不动）
+    // pause（库为嵌套网格设计的全局开关，写进 DDManager.pauseDrag）：这里显式关掉、占位块实时跟手；DesignGrid 在拖拽中按「被拖的壳是否碰到
+    // 还没进入的容器」动态打开 100ms 停顿（NEAR_CONTAINER_PAUSE）——不停顿的话碰撞会先把容器推开、指针永远进不去（R27 实测），常开又手感拖沓
+    // appendTo 只对 helper: 'clone' 生效（库只在 helper 没有父节点时才 appendTo）；本项目拖的是壳本体、无 clone helper，此项实际不起作用，
+    // 不要把它当成起手成本的来源（Task 9 审查 M5 注记，值不改）
+    draggable: { handle: ".grid-stack-item-content", appendTo: "body", cancel: ".epx-dashboard-design-item__operates, .epx-dashboard-design-grid__stack--pressed", pause: false }
+  };
+  if (engineClass) options.engineClass = engineClass;
+  return options;
+}
+function rootStyle(resolved) {
+  const { containerWidth, gapX, gapY, padX, padY } = resolved;
+  return {
+    width: px(containerWidth - 2 * padX + gapX),
+    marginLeft: px(padX - gapX / 2),
+    marginRight: px(padX - gapX / 2),
+    marginTop: px(padY - gapY / 2)
+  };
+}
+function toWidget(item) {
+  const w = { id: String(item.id), x: Number(item.x) || 0, y: Number(item.y) || 0, w: Number(item.w) || 1, h: Number(item.h) || 1 };
+  for (const k of ["minW", "maxW", "minH", "maxH"]) if (item[k] != null) w[k] = Number(item[k]);
+  if (item.static) {
+    w.locked = true;
+    w.noMove = true;
+    w.noResize = true;
+  }
+  return w;
+}
+function gridLineStyle(resolved, color = "rgba(0,0,0,.025)") {
+  const { containerWidth, gapX, padX, colNum, rowHeight, gapY, padY } = resolved;
+  const colPitch = (containerWidth - 2 * padX + gapX) / colNum;
+  const bandX = gapX > 0 ? gapX : 1;
+  const bandY = gapY > 0 ? gapY : 1;
+  return {
+    backgroundImage: `linear-gradient(to right, ${color} ${px(bandX)}, transparent ${px(bandX)}), linear-gradient(to bottom, ${color} ${px(bandY)}, transparent ${px(bandY)})`,
+    backgroundSize: `${colPitch}px ${rowHeight + gapY}px`,
+    backgroundPosition: `${px(padX - bandX)} ${px(padY - bandY)}`
+  };
+}
+export {
+  gridLineStyle,
+  rootStyle,
+  toGridstackOptions,
+  toWidget
+};

package/dist/src/grid/mixins.js

@@ -0,0 +1,108 @@
+import { isContainerType, getContainerGrid, isLegacyConfig, getPageGrid, MOBILE_GRID, normalizeGridParams, LEGACY_CONTAINER_GRID } from "./model.js";
+import { stackMobileLayout } from "../layout-util.js";
+const pageGridMixin = {
+  data() {
+    return {
+      // rowHeight / gap 为 'auto'（旧 autoHeight）时的换算基准，随 window resize 更新
+      bodyHeight: typeof document !== "undefined" ? document.body.offsetHeight : 0,
+      // 以下两项是兼容别名：仅供复刻旧模板的产品子类（extends: Dashboard 且复刻了 <grid-layout> 模板）使用，运行态自身不用。
+      // 旧模板写 v-if="loadPlugin"（原来等 import('grid-layout-plus') 完成后置 true）与 v-if="!load"；
+      // 垫片 GridLayout / GridItem 在包安装时已同步注册，这里直接给出「已就绪」的终值
+      loadPlugin: true,
+      load: false
+    };
+  },
+  computed: {
+    mobileDashboard() {
+      return this.$configs.designTarget === "mobile";
+    },
+    mobileRendering() {
+      return !!(this.$isMobile || this.mobileDashboard);
+    },
+    // 图表加载方式：all 全部挂载 / current 进入可视区后挂载不卸载 / viewport 进入挂载远离卸载
+    loadWay() {
+      const v = this.$configs.loadWay;
+      return v === "current" || v === "viewport" ? v : "all";
+    },
+    // 页面级网格参数：旧配置按 autoHeight 推导；移动端只把间距收紧成堆叠参数（原 gridMargin 的移动端分支），行高语义沿用页面
+    gridParams() {
+      const page = getPageGrid(this.$configs);
+      return this.$isMobile || this.mobileDashboard ? { ...page, gap: MOBILE_GRID.gap, padding: null } : page;
+    },
+    // 容器项（dashboard-div / dashboard-tabs）内部网格参数，透传给容器组件；非容器返回 undefined
+    containerGrid() {
+      return (component) => isContainerType(component.contentType) ? getContainerGrid(component, this.gridParams, isLegacyConfig(this.$configs)) : void 0;
+    },
+    // 以下三项是兼容别名：仅供复刻旧模板的产品子类（extends: Dashboard 且复刻了 <grid-layout> 模板）使用，运行态自身不用。
+    // 旧模板 :row-height="rowHeight"：'auto'（旧 autoHeight）时按原 calculateHeight 的 body 高 / 1000 * 10（勿化简，保证浮点逐位一致），否则取配置数值
+    rowHeight() {
+      const { rowHeight } = this.gridParams;
+      return rowHeight === "auto" ? this.bodyHeight / 1e3 * 10 : rowHeight;
+    },
+    // 旧模板 :margin="gridMargin"：移动端 [8, 8]；间距 'auto' 时 [rowHeight × 2, rowHeight × 2]（原 gridMargin 语义），否则取配置间距
+    gridMargin() {
+      if (this.mobileRendering) return [8, 8];
+      const { gap } = this.gridParams;
+      return gap === "auto" ? [this.rowHeight * 2, this.rowHeight * 2] : gap;
+    },
+    // 旧模板 v-if="loadComponent(component.id)"：复刻模板走垫片、没有可视区门控，恒为「挂载」（等价于 loadWay 'all'）
+    loadComponent() {
+      return () => true;
+    }
+  },
+  methods: {
+    updateBodyHeight() {
+      this.bodyHeight = document.body.offsetHeight;
+    }
+  }
+};
+const containerGridMixin = {
+  inject: {
+    // 页面级门控策略与配置版本标记；产品复刻模板 / 独立挂载时可能没有提供方，缺省按「全部挂载 + 旧配置」
+    getDashboardLoadWay: { default: () => () => "all" },
+    getDashboardLegacy: { default: () => () => true },
+    // 移动端设计器（DashboardMobile）的手机框预览标记：它跑在 PC 端（$isMobile 为 false），容器内部要和真机一样按堆叠渲染
+    epxMobilePreview: { default: false },
+    getMobileDashboard: { default: () => () => false }
+  },
+  props: {
+    // 本容器的内部网格参数（由父看板按配置版本算好传入；没传按历史写死值）
+    compGrid: { type: Object, default: null }
+  },
+  data() {
+    return {
+      // rowHeight / gap 为 'auto' 时的换算基准
+      bodyHeight: typeof document !== "undefined" ? document.body.offsetHeight : 0
+    };
+  },
+  computed: {
+    // 移动端渲染（真机或手机框预览）：容器内子项按堆叠算法重排、间距收紧成堆叠参数
+    mobileStacked() {
+      return !!(this.$isMobile || this.epxMobilePreview || this.getMobileDashboard());
+    },
+    gridParams() {
+      const base = normalizeGridParams(this.compGrid, LEGACY_CONTAINER_GRID);
+      return this.mobileStacked ? { ...base, gap: MOBILE_GRID.gap, padding: null } : base;
+    },
+    loadWay() {
+      return this.getDashboardLoadWay();
+    },
+    // 嵌套容器：v3 继承本容器网格，旧配置仍用历史写死值（是否旧版由页面 provide 下发）；非容器返回 undefined
+    childGrid() {
+      return (item) => isContainerType(item.contentType) ? getContainerGrid(item, this.gridParams, this.getDashboardLegacy()) : void 0;
+    }
+  },
+  methods: {
+    // 容器子项在移动端的渲染列表：真机 / 手机框预览时按堆叠算法重排（整块保留的容器内部同样堆叠，不再按 PC 的列布局压缩），
+    // 保留子项 style（容器内没有「移动端样式覆盖层」）；PC 原样返回
+    mobileItems(items) {
+      const list = items || [];
+      if (this.getMobileDashboard()) return list.filter((item) => !item.mobileHidden);
+      return this.mobileStacked ? stackMobileLayout(list.filter((item) => !item.mobileHidden), this.gridParams.colNum, { keepStyle: true }) : list;
+    }
+  }
+};
+export {
+  containerGridMixin,
+  pageGridMixin
+};

package/dist/src/grid/model.js

@@ -0,0 +1,223 @@
+import { normalizeGridItem } from "../layout-util.js";
+const CONFIG_VERSION = "3.0";
+const CONTAINER_TYPES = ["dashboard-div", "dashboard-tabs"];
+const GRID_FLAT_KEYS = ["gridColNum", "gridRowHeight", "gridGap", "gridPadding", "gridMode"];
+const ITEM_LAYOUT_KEYS = ["x", "y", "w", "h", "i", "float", "z", "static", "minW", "minH", "maxW", "maxH"];
+const DEFAULT_GRID = Object.freeze({ colNum: 48, rowHeight: 10, gap: [20, 20], padding: null, mode: "grid", canvas: "fluid" });
+const LEGACY_CONTAINER_GRID = Object.freeze({ colNum: 48, rowHeight: 30, gap: [10, 10], padding: null, mode: "grid", canvas: "fluid" });
+const MOBILE_GRID = Object.freeze({ colNum: 48, rowHeight: 10, gap: [8, 8], padding: null, mode: "grid", canvas: "fluid" });
+const isPosInt = (v) => Number.isInteger(v) && v > 0;
+const nonNeg = (v) => v !== null && v !== "" && !Array.isArray(v) && Number.isFinite(Number(v)) && Number(v) >= 0;
+function pair(v, fallback) {
+  if (v === "auto") return "auto";
+  if (Array.isArray(v) && v.length === 2 && v.every(nonNeg)) return [Number(v[0]), Number(v[1])];
+  if (nonNeg(v)) return [Number(v), Number(v)];
+  return fallback;
+}
+function isContainerType(contentType) {
+  return CONTAINER_TYPES.includes(contentType);
+}
+function normalizeGridParams(grid, fallback = DEFAULT_GRID) {
+  const g = grid && typeof grid === "object" ? grid : {};
+  const colNum = isPosInt(Number(g.colNum)) ? Number(g.colNum) : fallback.colNum;
+  let rowHeight = fallback.rowHeight;
+  if (g.rowHeight === "auto") rowHeight = "auto";
+  else if (nonNeg(g.rowHeight) && Number(g.rowHeight) > 0) rowHeight = Number(g.rowHeight);
+  const gap = pair(g.gap, fallback.gap);
+  const padding = g.padding == null ? fallback.padding == null ? null : fallback.padding : pair(g.padding, fallback.padding);
+  const mode = g.mode === "float" ? "float" : "grid";
+  const canvas = g.canvas === "fixed" ? "fixed" : "fluid";
+  const out = { colNum, rowHeight, gap, padding, mode, canvas };
+  if (canvas === "fixed") out.size = pair(g.size, [1920, 1080]);
+  return out;
+}
+function isLegacyConfig(config = {}) {
+  return !config || !(parseFloat(config.version) >= 3);
+}
+function legacyPageGrid(config = {}) {
+  return config.autoHeight ? { ...DEFAULT_GRID, rowHeight: "auto", gap: "auto" } : { ...DEFAULT_GRID };
+}
+function getPageGrid(config = {}) {
+  const c = config || {};
+  return isLegacyConfig(c) ? normalizeGridParams(c.grid, legacyPageGrid(c)) : normalizeGridParams(c.grid);
+}
+function getContainerGrid(item = {}, parentGrid = DEFAULT_GRID, legacy = false) {
+  const base = legacy ? LEGACY_CONTAINER_GRID : parentGrid;
+  if (item && item.grid) return normalizeGridParams(item.grid, base);
+  return base;
+}
+function walkItems(items, fn, parent = null) {
+  if (!Array.isArray(items)) return;
+  for (const item of items) {
+    if (!item || typeof item !== "object" || !item.contentType) continue;
+    fn(item, parent);
+    if (item.contentType === "dashboard-tabs") {
+      for (const tab of item.items || []) walkItems(tab && tab.items, fn, item);
+    } else {
+      walkItems(item.items, fn, item);
+    }
+  }
+}
+function normalizeDashboardConfig(config = {}) {
+  const out = JSON.parse(JSON.stringify(config || {}));
+  out.designTarget = out.designTarget === "mobile" ? "mobile" : "pc";
+  const legacy = isLegacyConfig(out);
+  out.grid = getPageGrid(out);
+  walkItems(out.items, (item, parent) => {
+    normalizeGridItem(item);
+    if (item.float !== void 0) item.float = !!item.float;
+    if (item.static !== void 0) item.static = !!item.static;
+    if (isContainerType(item.contentType)) {
+      const parentGrid = parent && parent.grid ? parent.grid : out.grid;
+      item.grid = { ...getContainerGrid(item, parentGrid, legacy) };
+    }
+  });
+  out.version = CONFIG_VERSION;
+  return out;
+}
+function stripDashboardConfig(config = {}) {
+  const out = JSON.parse(JSON.stringify(config || {}));
+  const itemIds = /* @__PURE__ */ new Set();
+  const containerIds = /* @__PURE__ */ new Set();
+  walkItems(out.items, (item) => {
+    delete item.i;
+    itemIds.add(String(item.id));
+    if (isContainerType(item.contentType)) containerIds.add(String(item.id));
+    if (item.contentType === "dashboard-tabs") {
+      for (const tab of item.items || []) if (tab) delete tab.i;
+    }
+  });
+  const itemConfigs = out.itemConfigs;
+  if (itemConfigs && typeof itemConfigs === "object") {
+    for (const id in itemConfigs) {
+      const cfg = itemConfigs[id];
+      if (!cfg || typeof cfg !== "object" || !itemIds.has(id)) continue;
+      for (const key of ITEM_LAYOUT_KEYS) delete cfg[key];
+      if (containerIds.has(id)) delete cfg.grid;
+    }
+  }
+  return out;
+}
+function gridPitch(grid) {
+  if (!grid || grid.rowHeight === "auto") return null;
+  return grid.rowHeight + (grid.gap === "auto" ? 0 : grid.gap[1]);
+}
+function maxGapForPitch(pitch) {
+  return pitch == null ? Infinity : Math.max(0, pitch - 1);
+}
+function fromGrid(grid) {
+  const g = normalizeGridParams(grid);
+  return {
+    gridColNum: g.colNum,
+    gridRowHeight: gridPitch(g),
+    gridGap: g.gap === "auto" ? null : g.gap[0],
+    gridPadding: g.padding == null || g.padding === "auto" ? null : g.padding[0],
+    gridMode: g.mode
+  };
+}
+const numOr = (v, fallback) => v == null || v === "" || !Number.isFinite(Number(v)) ? fallback : Number(v);
+const nonNegOr = (v, fallback) => numOr(v, -1) < 0 ? fallback : Number(v);
+function toGrid(configs = {}, grid = DEFAULT_GRID) {
+  const c = configs || {};
+  const auto = !!c.autoHeight;
+  const padding = numOr(c.gridPadding, null);
+  const pitch = Math.max(1, numOr(c.gridRowHeight, gridPitch(DEFAULT_GRID)));
+  const gap = Math.min(nonNegOr(c.gridGap, DEFAULT_GRID.gap[0]), maxGapForPitch(pitch));
+  return normalizeGridParams({
+    ...grid || {},
+    colNum: numOr(c.gridColNum, DEFAULT_GRID.colNum),
+    rowHeight: auto ? "auto" : pitch - gap,
+    gap: auto ? "auto" : [gap, gap],
+    padding: padding == null ? null : [padding, padding],
+    mode: c.gridMode || DEFAULT_GRID.mode
+  });
+}
+function mergeGridConfigs(globalConfigs = {}, patch = {}) {
+  const next = { ...globalConfigs || {}, ...patch || {} };
+  const current = getPageGrid(next);
+  const touched = Object.keys(patch || {}).some((key) => key === "autoHeight" || GRID_FLAT_KEYS.includes(key));
+  let grid = current;
+  if (touched) {
+    const flat = { ...fromGrid(current) };
+    for (const key of GRID_FLAT_KEYS) if (key in patch) flat[key] = patch[key];
+    grid = toGrid({ ...flat, autoHeight: next.autoHeight }, current);
+  }
+  next.grid = grid;
+  const auto = grid.rowHeight === "auto";
+  if (auto !== !!next.autoHeight) next.autoHeight = auto;
+  for (const key of GRID_FLAT_KEYS) delete next[key];
+  return { configs: next, colNum: current.colNum !== grid.colNum ? { from: current.colNum, to: grid.colNum } : null };
+}
+function rescaleItemsToColNum(items, from, to) {
+  if (!(from > 0) || !(to > 0) || from === to) return items;
+  const ratio = to / from;
+  const stopped = /* @__PURE__ */ new Set();
+  walkItems(items, (item, parent) => {
+    if (parent && stopped.has(parent)) {
+      stopped.add(item);
+      return;
+    }
+    const w = Math.min(to, Math.max(1, Math.round((Number(item.w) || 1) * ratio)));
+    item.x = Math.max(0, Math.min(Math.round((Number(item.x) || 0) * ratio), to - w));
+    item.w = w;
+    for (const key of ["minW", "maxW"]) {
+      if (item[key] != null && item[key] !== "" && Number.isFinite(Number(item[key]))) item[key] = Math.max(1, Math.round(Number(item[key]) * ratio));
+    }
+    if (isContainerType(item.contentType) && item.grid && isPosInt(Number(item.grid.colNum))) stopped.add(item);
+  });
+  return items;
+}
+function resolveContainerGrid(items, id, pageGrid = DEFAULT_GRID, legacy = false) {
+  let found = null;
+  const grids = /* @__PURE__ */ new Map();
+  walkItems(items, (item, parent) => {
+    if (found || !isContainerType(item.contentType)) return;
+    const parentGrid = parent && grids.has(parent) ? grids.get(parent) : pageGrid;
+    const grid = getContainerGrid(item, parentGrid, legacy);
+    grids.set(item, grid);
+    if (String(item.id) === String(id)) found = { item, grid, parentGrid, explicit: !!(item.grid && typeof item.grid === "object") };
+  });
+  return found;
+}
+function partitionItems(items = []) {
+  const flow = [];
+  const float = [];
+  for (const item of items || []) {
+    if (!item) continue;
+    (item.float ? float : flow).push(item);
+  }
+  return { flow, float };
+}
+function convertItemBetweenGrids(item, from, to) {
+  const px = item.w * from.colWidth + (item.w - 1) * from.gapX;
+  const py = item.h * from.rowHeight + (item.h - 1) * from.gapY;
+  const w = Math.max(1, Math.round((px + to.gapX) / (to.colWidth + to.gapX)));
+  const h = Math.max(1, Math.round((py + to.gapY) / (to.rowHeight + to.gapY)));
+  return { ...item, w: Math.min(w, to.colNum), h };
+}
+export {
+  CONFIG_VERSION,
+  CONTAINER_TYPES,
+  DEFAULT_GRID,
+  GRID_FLAT_KEYS,
+  ITEM_LAYOUT_KEYS,
+  LEGACY_CONTAINER_GRID,
+  MOBILE_GRID,
+  convertItemBetweenGrids,
+  fromGrid,
+  getContainerGrid,
+  getPageGrid,
+  gridPitch,
+  isContainerType,
+  isLegacyConfig,
+  maxGapForPitch,
+  mergeGridConfigs,
+  normalizeDashboardConfig,
+  normalizeGridParams,
+  partitionItems,
+  rescaleItemsToColNum,
+  resolveContainerGrid,
+  stripDashboardConfig,
+  toGrid,
+  walkItems
+};

package/dist/src/grid/useViewportGate.js

@@ -0,0 +1,55 @@
+function createViewportGate({ root = null, mountMargin = "100%", unmountMargin = "200%", sticky = false, onChange } = {}) {
+  const IO = typeof window !== "undefined" ? window.IntersectionObserver : void 0;
+  if (typeof IO !== "function") {
+    return { supported: false, observe() {
+    }, unobserve() {
+    }, isActive: () => true, destroy() {
+    } };
+  }
+  const idOf = /* @__PURE__ */ new WeakMap();
+  const active = /* @__PURE__ */ new Set();
+  const emit = (id, on) => {
+    if (id == null) return;
+    if (on && !active.has(id)) {
+      active.add(id);
+      if (onChange) onChange(id, true);
+    } else if (!on && active.has(id)) {
+      active.delete(id);
+      if (onChange) onChange(id, false);
+    }
+  };
+  const near = new IO((entries) => {
+    for (const e of entries) if (e.isIntersecting) emit(idOf.get(e.target), true);
+  }, { root, rootMargin: `${mountMargin} 0px` });
+  const far = sticky ? null : new IO((entries) => {
+    for (const e of entries) if (!e.isIntersecting) emit(idOf.get(e.target), false);
+  }, { root, rootMargin: `${unmountMargin} 0px` });
+  return {
+    supported: true,
+    observe(el, id) {
+      const prevId = idOf.get(el);
+      if (prevId !== void 0 && prevId !== id) emit(prevId, false);
+      idOf.set(el, id);
+      near.observe(el);
+      if (far) far.observe(el);
+    },
+    unobserve(el) {
+      near.unobserve(el);
+      if (far) far.unobserve(el);
+      const id = idOf.get(el);
+      idOf.delete(el);
+      if (id != null) active.delete(id);
+    },
+    isActive(id) {
+      return active.has(id);
+    },
+    destroy() {
+      near.disconnect();
+      if (far) far.disconnect();
+      active.clear();
+    }
+  };
+}
+export {
+  createViewportGate
+};

package/dist/src/index.js

@@ -0,0 +1,26 @@
+import Dashboard from "./Dashboard.js";
+import DashboardTabs from "./Tabs.js";
+import DashboardTitle from "./Title.js";
+import DashboardDiv from "./Div.js";
+import DashboardWidget from "./Widget.js";
+import Preview from "./Preview.js";
+import CompatGridLayout from "./grid/compat/GridLayout.js";
+import CompatGridItem from "./grid/compat/GridItem.js";
+Dashboard.install = function install(Vue) {
+  Vue.component(Dashboard.name, Dashboard);
+  Vue.component(DashboardTabs.name, DashboardTabs);
+  Vue.component(DashboardTitle.name, DashboardTitle);
+  Vue.component(DashboardDiv.name, DashboardDiv);
+  Vue.component(DashboardWidget.name, DashboardWidget);
+  Vue.component(Dashboard.name + "--preview", Preview);
+  Vue.component("GridLayout", CompatGridLayout);
+  Vue.component("GridItem", CompatGridItem);
+};
+export {
+  Dashboard,
+  DashboardDiv,
+  DashboardTabs,
+  DashboardTitle,
+  DashboardWidget,
+  Dashboard as default
+};

package/dist/src/layout-util.js

@@ -0,0 +1,108 @@
+const DEFAULT_HALF_TYPES = [
+  "num-statistic",
+  "card-num",
+  "num",
+  "flow-num-statistic",
+  "flow-num-card",
+  "flow-num-item",
+  "task-num-card",
+  "num-item",
+  "num-sub-item"
+];
+const CONTAINER_TYPES = ["dashboard-div", "dashboard-tabs"];
+function mobileSpan(item, colNum, halfTypes) {
+  if (item.contentType === "chart" || item.contentType === "report-chart") return colNum;
+  const half = Math.floor(colNum / 2);
+  if (halfTypes.includes(item.contentType)) return half;
+  const w = Math.max(1, Number(item.w) || 1);
+  const ratio = w / colNum;
+  if (ratio <= 1 / 3) return Math.floor(colNum / 3);
+  if (ratio <= 1 / 2) return half;
+  return colNum;
+}
+function expandForMobile(items) {
+  const out = [];
+  for (const item of items || []) {
+    if (!item) continue;
+    if (CONTAINER_TYPES.includes(item.contentType) && item.mobileExpand !== false) {
+      const baseX = Number(item.x) || 0;
+      const baseY = Number(item.y) || 0;
+      const children = item.contentType === "dashboard-tabs" ? (item.items || []).reduce((acc, tab) => acc.concat(tab && tab.items || []), []) : item.items || [];
+      for (const c of children) {
+        if (!c) continue;
+        out.push({ ...c, x: (Number(c.x) || 0) + baseX, y: (Number(c.y) || 0) + baseY });
+      }
+    } else {
+      out.push(item);
+    }
+  }
+  return out;
+}
+const byYX = (a, b) => (Number(a.y) || 0) - (Number(b.y) || 0) || (Number(a.x) || 0) - (Number(b.x) || 0);
+function packStack(list, colNum, spanOf, minH) {
+  const result = [];
+  let y = 0;
+  let curX = 0;
+  let rowH = 0;
+  const closeRow = () => {
+    if (curX > 0) {
+      y += rowH;
+      curX = 0;
+      rowH = 0;
+    }
+  };
+  for (const item of list) {
+    const h = Math.max(Number(item.h) || minH, minH);
+    const span = Math.max(1, Math.min(colNum, spanOf(item)));
+    if (span >= colNum) {
+      closeRow();
+      result.push({ ...item, x: 0, y, w: colNum, h });
+      y += h;
+    } else {
+      if (curX + span > colNum) closeRow();
+      result.push({ ...item, x: curX, y, w: span, h });
+      curX += span;
+      rowH = Math.max(rowH, h);
+    }
+  }
+  closeRow();
+  return result;
+}
+function stackMobileLayout(items = [], colNum = 48, options = {}) {
+  const { minH = 3, halfTypes = DEFAULT_HALF_TYPES, keepStyle = false } = options;
+  const stripStyle = ({ style, ...rest }) => {
+    if (Array.isArray(rest.items)) rest.items = rest.items.map(stripStyle);
+    return rest;
+  };
+  const flat = expandForMobile(items).map(keepStyle ? (item) => item : stripStyle).sort(byYX);
+  const spanOf = (item) => CONTAINER_TYPES.includes(item.contentType) ? colNum : mobileSpan(item, colNum, halfTypes);
+  return packStack(flat, colNum, spanOf, minH);
+}
+function reorderStack(items = [], id, dir, colNum = 48, options = {}) {
+  const { minH = 3 } = options;
+  const order = (items || []).filter(Boolean).slice().sort(byYX);
+  const i = order.findIndex((it) => String(it.id) === String(id));
+  if (i < 0) return packStack(order, colNum, (item) => Math.max(1, Number(item.w) || 1), minH);
+  const [moved] = order.splice(i, 1);
+  if (dir === "top") order.unshift(moved);
+  else if (dir === "bottom") order.push(moved);
+  else if (dir === "down") order.splice(Math.min(order.length, i + 1), 0, moved);
+  else order.splice(Math.max(0, i - 1), 0, moved);
+  return packStack(order, colNum, (item) => Math.max(1, Number(item.w) || 1), minH);
+}
+function normalizeGridItem(item, defaults = {}) {
+  if (!item || typeof item !== "object") return item;
+  if (item.i == null && item.id != null) item.i = item.id;
+  const fallback = { x: 0, y: 0, w: 1, h: 1, ...defaults };
+  for (const key of ["x", "y", "w", "h"]) {
+    const raw = item[key];
+    const num = raw == null || raw === "" ? NaN : Number(raw);
+    item[key] = Number.isFinite(num) ? num : fallback[key];
+  }
+  return item;
+}
+export {
+  normalizeGridItem,
+  reorderStack,
+  stackMobileLayout
+};

package/dist/src/mobile-design.js

@@ -0,0 +1,50 @@
+import { stackMobileLayout } from "./layout-util.js";
+import { normalizeMobileAppearance } from "@epxing/utils/src/mobile-chart-appearance";
+function indexDashboardItems(items = [], result = /* @__PURE__ */ new Map()) {
+  for (const item of items) {
+    if (!item) continue;
+    if (item.id != null) result.set(String(item.id), item);
+    if (Array.isArray(item.items)) indexDashboardItems(item.items, result);
+  }
+  return result;
+}
+function resolveMobileItem(item, pcIndex) {
+  const pc = pcIndex.get(String(item.id)) || item;
+  const styleOverride = Object.fromEntries(Object.entries(item.style || {}).filter(([, value]) => value !== "" && value !== void 0 && value !== null));
+  const resolved = {
+    ...pc,
+    x: item.x,
+    y: item.y,
+    w: item.w,
+    h: item.h,
+    i: item.i || item.id,
+    mobileHidden: item.mobileHidden,
+    mobileAppearance: normalizeMobileAppearance(item.mobileAppearance),
+    style: { ...pc.style || {}, ...styleOverride }
+  };
+  if (Array.isArray(pc.items)) {
+    const saved = indexDashboardItems(item.items || []);
+    resolved.items = pc.items.map((child) => resolveMobileItem(saved.get(String(child.id)) || child, pcIndex));
+  }
+  return resolved;
+}
+function regenerateMobileDesign(pcItems, mobileItems, colNum = 48) {
+  const saved = indexDashboardItems(mobileItems);
+  const preserve = (item) => {
+    const old = saved.get(String(item.id));
+    const next = { ...item };
+    if (old) {
+      for (const key of ["style", "mobileHidden", "mobileAppearance"]) {
+        if (old[key] !== void 0) next[key] = key === "mobileAppearance" ? normalizeMobileAppearance(old[key]) : old[key];
+      }
+    }
+    if (Array.isArray(item.items)) next.items = item.items.map(preserve);
+    return next;
+  };
+  return stackMobileLayout(pcItems, colNum).map(preserve);
+}
+export {
+  indexDashboardItems,
+  regenerateMobileDesign,
+  resolveMobileItem
+};