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

package/dist/src/Widget.js

@@ -0,0 +1,267 @@
+import '../style.css';
+import DashboardGrid from "./DashboardGrid.js";
+import chartRequestScope from "./chart-request-scope.js";
+import { evalWith } from "@epxing/utils/src/eval-with";
+import component from "@epxing/core/src/mixins/component";
+import { pageGridMixin } from "./grid/mixins.js";
+import { stackMobileLayout } from "./layout-util.js";
+import { indexDashboardItems, resolveMobileItem } from "./mobile-design.js";
+import { getPageGrid, isLegacyConfig } from "./grid/model.js";
+import { mapState } from "vuex";
+import { resolveComponent, openBlock, createElementBlock, normalizeStyle, normalizeClass, createElementVNode, createVNode, withCtx, mergeProps, createCommentVNode } from "vue";
+/* empty css           */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+function refesh() {
+  this.resolveChartRequestBroker().invalidate();
+  this._epxWalkChildren((child) => {
+    if (child.$options.$componentType === "component" && child.$refesh) child.$refesh();
+  });
+}
+const _sfc_main = {
+  name: "epx-dashboard-widget",
+  mixins: [component, pageGridMixin, chartRequestScope],
+  components: { [DashboardGrid.name]: DashboardGrid },
+  $componentType: "component",
+  navConfigs: {
+    flag: false
+  },
+  style: {},
+  layout: "grid",
+  // 组件列表
+  items: [],
+  // 组件配置
+  itemConfigs: {},
+  props: {
+    inline: Boolean,
+    routeKey: [String, Number],
+    routes: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  data() {
+    return {
+      headerTitle: null,
+      pageParams: {},
+      model: {},
+      // 组件全局data
+      pageEvents: {},
+      searchScopeParams: []
+    };
+  },
+  computed: {
+    ...mapState({
+      showMenu: (state) => state.config.showMenu,
+      showAppNav: (state) => state.config.showAppNav
+    }),
+    pageTitle() {
+      return this.headerTitle || this.page && this.page.title || this.meta && this.meta.name;
+    },
+    components() {
+      const { items = [], mItems } = this.$component;
+      let list;
+      if (this.mobileDashboard) {
+        list = items.filter((item) => !item.mobileHidden);
+      } else if (this.$isMobile) {
+        if (mItems && mItems.length) {
+          const pcIndex = indexDashboardItems(items);
+          list = mItems.filter((c) => !c.mobileHidden && pcIndex.has(String(c.id))).map((c) => resolveMobileItem(c, pcIndex));
+        } else {
+          const { mobileAutoStack = true } = this.$configs;
+          list = mobileAutoStack ? stackMobileLayout(items, 48) : items;
+        }
+      } else {
+        list = items;
+      }
+      list.forEach((item) => {
+        if (item && item.i == null && item.id != null) item.i = item.id;
+      });
+      return list;
+    },
+    theme() {
+      const { theme } = this.$configs;
+      return theme;
+    },
+    // Widget 原本没有移动端收紧间距的分支（与页面版 Dashboard 不同），按「旧配置像素一致」保留原语义，覆盖 pageGridMixin 的 gridParams
+    gridParams() {
+      const grid = getPageGrid(this.$configs);
+      return this.mobileDashboard ? { ...grid, gap: [8, 8], padding: null } : grid;
+    },
+    colAttribute() {
+      return (component2 = {}) => {
+        const { xsspan = 24, ...other } = component2;
+        const colAttribute = {
+          ...other,
+          xs: {
+            span: xsspan
+          }
+        };
+        delete colAttribute.id;
+        delete colAttribute.style;
+        delete colAttribute.title;
+        return colAttribute;
+      };
+    },
+    pageStyle() {
+      const { layout = "grid", direction = "row", justify = "flex-start", align = "top" } = this.$configs;
+      if (layout === "flex") {
+        return { display: "flex", "flex-direction": direction, "justify-content": justify, "align-items": align };
+      } else {
+        return {};
+      }
+    },
+    componentStyle() {
+      return (component2) => {
+        const { layout } = this.$configs;
+        const { flex } = component2;
+        const compoentStyle = {};
+        if (layout === "flex" && flex) {
+          compoentStyle.flex = 1;
+        }
+        return compoentStyle;
+      };
+    },
+    scopeParams() {
+      const { globalScopeParams: configScopeParams = [] } = this.$configs;
+      const { scopeParams: queryScopeParams = [] } = this.$configs;
+      const _scopeParams = this.$_.cloneDeep([...configScopeParams, ...queryScopeParams, ...this.searchScopeParams]);
+      const that = this;
+      for (const scopeKey in _scopeParams) {
+        const scope = _scopeParams[scopeKey];
+        if (!scope) continue;
+        let values = scope.values;
+        if (/\$\[(.+)\]/.test(values)) {
+          values = values.replace(/\$\[(.+)\]/, (match, key) => {
+            try {
+              return evalWith(`that.${key}`, { that }) || evalWith(`that.$query.${key}`, { that }) || evalWith(`that.$tab.${key}`, { that }) || "";
+            } catch (error) {
+              return scope.values;
+            }
+          });
+        }
+        if (/#\{(.+)\}/.test(values)) {
+          values = values.replace(/#\{(.+)\}/, (match, key) => {
+            try {
+              return evalWith(`that.$query.${key}`, { that }) || evalWith(`that.$tab.${key}`, { that }) || "";
+            } catch (error) {
+              return scope.values;
+            }
+          });
+        }
+        scope.values = values;
+      }
+      return _scopeParams;
+    }
+  },
+  watch: {
+    pageTitle: {
+      handler(v) {
+        this.$emit("change-route", this.routeKey, { title: v });
+      },
+      immediate: true
+    },
+    scopeParams: {
+      deep: true,
+      handler(v) {
+        this.pageParams.scopeParams = v;
+      },
+      immediate: true
+    }
+  },
+  provide() {
+    const gridProvide = {
+      getMobileDashboard: () => this.mobileDashboard,
+      getDashboardLoadWay: () => this.loadWay,
+      getDashboardLegacy: () => isLegacyConfig(this.$configs)
+    };
+    if (this.isPage) {
+      return {
+        ...gridProvide,
+        upPage: this,
+        pageId: this.page ? this.page.pageId : "",
+        // 当前页面id
+        pageMetaId: this.isPage ? this.$metaId || (this.page ? this.page.metaId : "") : null
+        // 当前页面对象id
+      };
+    }
+    return gridProvide;
+  },
+  methods: {
+    $refesh() {
+      refesh.apply(this);
+    },
+    openFullScreen() {
+      if (this.$refs.dashboard.requestFullscreen) {
+        this.$refs.dashboard.requestFullscreen();
+      }
+    },
+    search(v) {
+      this.searchScopeParams = v;
+    }
+  },
+  created() {
+    const grid = this.gridParams;
+    if (grid.rowHeight === "auto" || grid.gap === "auto") {
+      window.addEventListener("resize", this.updateBodyHeight);
+    }
+  },
+  beforeUnmount() {
+    window.removeEventListener("resize", this.updateBodyHeight);
+  }
+};
+const _hoisted_1 = {
+  key: 0,
+  class: "dashboard-component"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_epx_component = resolveComponent("epx-component");
+  const _component_epx_dashboard_grid = resolveComponent("epx-dashboard-grid");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(["dashboard", "dashboard--" + $options.theme, { "dashboard--hidden-scroll-bar": _ctx.$configs.scrollBarHidden }]),
+    style: normalizeStyle(_ctx.$component.style),
+    ref: "container"
+  }, [
+    createElementVNode("div", {
+      ref: "dashboard",
+      class: "dashboard-container",
+      style: normalizeStyle(_ctx.mobileDashboard ? { width: "100%", maxWidth: (Number(_ctx.$configs.mobileCanvasWidth) || 375) + "px", margin: "0 auto", flex: "none" } : {})
+    }, [
+      createVNode(_component_epx_dashboard_grid, {
+        items: $options.components,
+        grid: $options.gridParams,
+        "load-way": _ctx.loadWay,
+        "body-height": _ctx.bodyHeight,
+        "scroll-root-selector": ".dashboard-container"
+      }, {
+        item: withCtx(({ item: component2 }) => [
+          component2.contentType ? (openBlock(), createElementBlock("div", _hoisted_1, [
+            createVNode(_component_epx_component, mergeProps(_ctx.isPage ? _ctx.$forwardAttrs(_ctx.$attrs) : {}, {
+              class: "component epx-dashboard__component",
+              name: component2.contentType,
+              "is-dashboard": "",
+              "content-type": component2.contentType,
+              "dashboard-id": _ctx.$component.id,
+              "comp-id": _ctx.getComponentId(component2),
+              "comp-title": component2.title,
+              items: component2.items,
+              itemConfigs: _ctx.$component.itemConfigs,
+              "comp-style": component2.style,
+              "comp-configs": component2.configs,
+              "mobile-appearance": _ctx.mobileRendering ? component2.mobileAppearance : void 0,
+              "comp-grid": _ctx.containerGrid(component2),
+              "chart-cache": _ctx.$configs.chartCache,
+              theme: $options.theme
+            }), null, 16, ["name", "content-type", "dashboard-id", "comp-id", "comp-title", "items", "itemConfigs", "comp-style", "comp-configs", "mobile-appearance", "comp-grid", "chart-cache", "theme"])
+          ])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["items", "grid", "load-way", "body-height"])
+    ], 4)
+  ], 6);
+}
+const DashboardWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d068f7d2"]]);
+export {
+  DashboardWidget as default
+};

package/dist/src/chart-request-scope.js

@@ -0,0 +1,33 @@
+import '../style.css';
+import { markRaw } from "vue";
+import { createChartRequestBroker } from "@epxing/utils/src/chart-request-broker";
+const chartRequestScope = {
+  inject: { getParentChartRequestBroker: { from: "getChartRequestBroker", default: null } },
+  data() {
+    return { ownedChartRequestBroker: null };
+  },
+  provide() {
+    return { getChartRequestBroker: () => this.resolveChartRequestBroker() };
+  },
+  watch: {
+    "$route.query.pageId"() {
+      var _a;
+      (_a = this.ownedChartRequestBroker) == null ? void 0 : _a.dispose();
+      this.ownedChartRequestBroker = null;
+    }
+  },
+  methods: {
+    resolveChartRequestBroker() {
+      if (this.getParentChartRequestBroker) return this.getParentChartRequestBroker();
+      if (!this.ownedChartRequestBroker) this.ownedChartRequestBroker = markRaw(createChartRequestBroker());
+      return this.ownedChartRequestBroker;
+    }
+  },
+  beforeUnmount() {
+    var _a;
+    (_a = this.ownedChartRequestBroker) == null ? void 0 : _a.dispose();
+  }
+};
+export {
+  chartRequestScope as default
+};

package/dist/src/design-target.js

@@ -0,0 +1,58 @@
+import '../style.css';
+import { stackMobileLayout } from "./layout-util.js";
+const DEFAULT_DASHBOARD_THEME = "light";
+function getDashboardDesignTarget(config = {}) {
+  return config.designTarget === "mobile" ? "mobile" : "pc";
+}
+function createDashboardConfig(config = {}, target = "pc") {
+  var _a;
+  const configuredColNum = Number((_a = config.grid) == null ? void 0 : _a.colNum);
+  const colNum = Number.isInteger(configuredColNum) && configuredColNum > 0 ? configuredColNum : (config.items || []).length ? 48 : 24;
+  const out = {
+    ...config,
+    grid: { ...config.grid, colNum },
+    theme: config.theme || DEFAULT_DASHBOARD_THEME,
+    designTarget: getDashboardDesignTarget({ designTarget: target }),
+    ...target === "mobile" ? { mobileCanvasWidth: 375, autoHeight: false, grid: { ...config.grid, colNum, rowHeight: 10, gap: [8, 8], padding: null } } : {}
+  };
+  if (target === "mobile") {
+    delete out.mItems;
+    const mobileItems = (items) => {
+      const list = JSON.parse(JSON.stringify(items || []));
+      for (const item of list) {
+        if (item.contentType === "dashboard-tabs") {
+          item.mobileExpand = false;
+          for (const tab of item.items || []) tab.items = mobileItems(tab.items);
+        } else if (item.contentType === "dashboard-div") {
+          item.mobileExpand = false;
+          item.items = mobileItems(item.items);
+        }
+      }
+      return stackMobileLayout(list, colNum, { keepStyle: true });
+    };
+    out.items = mobileItems(config.items);
+  }
+  return out;
+}
+function removeDashboardItem(items, id, configs) {
+  for (let i = 0; i < items.length; i++) {
+    const item = items[i];
+    if (String(item.id) === String(id)) {
+      const clear = (node) => {
+        delete configs[node.id];
+        for (const child of node.items || []) clear(child);
+      };
+      clear(item);
+      items.splice(i, 1);
+      return true;
+    }
+    if (item.items && removeDashboardItem(item.items, id, configs)) return true;
+  }
+  return false;
+}
+export {
+  DEFAULT_DASHBOARD_THEME,
+  createDashboardConfig,
+  getDashboardDesignTarget,
+  removeDashboardItem
+};

package/dist/src/grid/compact.js

@@ -0,0 +1,69 @@
+import '../../style.css';
+function collides(l1, l2) {
+  if (l1 === l2) return false;
+  if (l1.x + l1.w <= l2.x) return false;
+  if (l1.x >= l2.x + l2.w) return false;
+  if (l1.y + l1.h <= l2.y) return false;
+  if (l1.y >= l2.y + l2.h) return false;
+  return true;
+}
+function getFirstCollision(layout, item) {
+  for (let i = 0, len = layout.length; i < len; i++) {
+    if (collides(layout[i], item)) return layout[i];
+  }
+}
+function sortLayoutItemsByRowCol(layout) {
+  return Array.from(layout).sort((a, b) => {
+    if (a.y === b.y && a.x === b.x) return 0;
+    if (a.y > b.y || a.y === b.y && a.x > b.x) return 1;
+    return -1;
+  });
+}
+function compactItem(compareWith, item, verticalCompact = true) {
+  if (verticalCompact) {
+    while (item.y > 0 && !getFirstCollision(compareWith, item)) item.y--;
+  }
+  let collision;
+  while (collision = getFirstCollision(compareWith, item)) item.y = collision.y + collision.h;
+  return item;
+}
+function cloneItem(item) {
+  return {
+    ...item,
+    x: Number(item.x) || 0,
+    y: Number(item.y) || 0,
+    w: Math.max(1, Number(item.w) || 1),
+    h: Math.max(1, Number(item.h) || 1)
+  };
+}
+function compact(layout, verticalCompact = true) {
+  const source = Array.isArray(layout) ? layout.filter(Boolean) : [];
+  const out = new Array(source.length);
+  const indexOf = /* @__PURE__ */ new Map();
+  const flow = [];
+  source.forEach((item, idx) => {
+    const copy = cloneItem(item);
+    if (copy.float) {
+      out[idx] = copy;
+      return;
+    }
+    indexOf.set(copy, idx);
+    flow.push(copy);
+  });
+  const compareWith = flow.filter((item) => item.static);
+  for (const item of sortLayoutItemsByRowCol(flow)) {
+    if (!item.static) {
+      compactItem(compareWith, item, verticalCompact);
+      compareWith.push(item);
+    }
+    out[indexOf.get(item)] = item;
+  }
+  return out;
+}
+export {
+  collides,
+  compact,
+  compactItem,
+  getFirstCollision,
+  sortLayoutItemsByRowCol
+};

package/dist/src/grid/compat/GridItem.js

@@ -0,0 +1,36 @@
+import '../../../style.css';
+import { rectStyle, itemRect } from "../geometry.js";
+import { openBlock, createElementBlock, normalizeStyle, renderSlot } from "vue";
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  // 组件 name 走仓库命名规范（epx- 前缀）；全局注册名仍用 'GridItem'（见 index.js）
+  name: "epx-grid-compat-grid-item",
+  inheritAttrs: false,
+  props: {
+    x: { type: Number, default: 0 },
+    y: { type: Number, default: 0 },
+    w: { type: Number, default: 1 },
+    h: { type: Number, default: 1 },
+    i: { type: [String, Number], default: "" }
+  },
+  inject: { epxCompatGrid: { default: null } },
+  computed: {
+    style() {
+      if (!this.epxCompatGrid) return void 0;
+      const pos = this.epxCompatGrid.positions[String(this.i)] || { x: this.x, y: this.y, w: this.w, h: this.h };
+      return { position: "absolute", ...rectStyle(itemRect(pos, this.epxCompatGrid.resolved)) };
+    }
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: "vgl-item vgl-item--static",
+    style: normalizeStyle($options.style)
+  }, [
+    renderSlot(_ctx.$slots, "default")
+  ], 4);
+}
+const CompatGridItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  CompatGridItem as default
+};

package/dist/src/grid/compat/GridLayout.js

@@ -0,0 +1,77 @@
+import '../../../style.css';
+import { layoutHeight, resolveGrid } from "../geometry.js";
+import { compact } from "../compact.js";
+import { openBlock, createElementBlock, normalizeStyle, renderSlot } from "vue";
+/* empty css               */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  // 组件 name 走仓库命名规范（epx- 前缀）；全局注册名仍用 'GridLayout'（见 index.js），
+  // 保证旧模板里直接写的 <grid-layout> 标签能解析到——标签解析走注册名，不走这里的 name
+  name: "epx-grid-compat-grid-layout",
+  inheritAttrs: false,
+  props: {
+    layout: { type: Array, default: () => [] },
+    colNum: { type: Number, default: 12 },
+    rowHeight: { type: Number, default: 150 },
+    margin: { type: Array, default: () => [10, 10] },
+    // 显式宽度（测试 / 无 ResizeObserver 环境）；缺省由 ResizeObserver 测量
+    width: { type: Number, default: 0 }
+  },
+  provide() {
+    return { epxCompatGrid: this };
+  },
+  data() {
+    return { measuredWidth: 0 };
+  },
+  computed: {
+    resolved() {
+      const gap = [Number(this.margin[0]) || 0, Number(this.margin[1]) || 0];
+      return resolveGrid({ colNum: this.colNum, rowHeight: this.rowHeight, gap, padding: null }, { containerWidth: this.width || this.measuredWidth });
+    },
+    // 与旧布局库一致：layout 先 compact（空隙上移、重叠推下），grid-item 按 i 取压紧后的坐标；不写回 layout
+    compacted() {
+      return compact(this.layout);
+    },
+    // i（缺省用 id）→ 压紧后的项，供子 grid-item 取坐标；键统一转字符串，避免数字 / 字符串 id 不等
+    positions() {
+      const map = {};
+      for (const item of this.compacted) {
+        const key = item.i != null ? item.i : item.id;
+        if (key != null) map[String(key)] = item;
+      }
+      return map;
+    },
+    height() {
+      return layoutHeight(this.compacted, this.resolved);
+    }
+  },
+  methods: {
+    measure() {
+      if (this.$refs.root) this.measuredWidth = this.$refs.root.offsetWidth;
+    }
+  },
+  mounted() {
+    if (this.width) return;
+    this.measure();
+    if (typeof ResizeObserver !== "undefined") {
+      this.resizeObserver = new ResizeObserver(() => this.measure());
+      this.resizeObserver.observe(this.$refs.root);
+    }
+  },
+  beforeUnmount() {
+    if (this.resizeObserver) this.resizeObserver.disconnect();
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    ref: "root",
+    class: "vgl-layout epx-dashboard-grid-compat",
+    style: normalizeStyle({ height: $options.height + "px" })
+  }, [
+    renderSlot(_ctx.$slots, "default")
+  ], 4);
+}
+const CompatGridLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  CompatGridLayout as default
+};

package/dist/src/grid/designState.js

@@ -0,0 +1,22 @@
+import '../../style.css';
+import { reactive } from "vue";
+function createDesignState() {
+  const state = reactive({ activeId: null, activeItem: null, activeOwner: null });
+  return {
+    state,
+    select(item, owner) {
+      state.activeId = item ? item.id : null;
+      state.activeItem = item || null;
+      state.activeOwner = owner || null;
+    },
+    clear() {
+      this.select(null, null);
+    },
+    isActive(item) {
+      return !!item && state.activeId === item.id;
+    }
+  };
+}
+export {
+  createDesignState
+};

package/dist/src/grid/engines.js

@@ -0,0 +1,26 @@
+import '../../style.css';
+import { GridStackEngine } from "gridstack";
+class NoCollideEngine extends GridStackEngine {
+  collide() {
+    return void 0;
+  }
+  collideAll() {
+    return [];
+  }
+  // 基类在有 maxRow 时会用「基类引擎」克隆一份模拟移动（碰撞检测随之回来：覆盖过半的项被推挤、不足半的移动被拒），
+  // 无碰撞时不存在「推挤后超出 maxRow」的情形，直接走基类无 maxRow 的简单路径：moveNode 里的 nodeBoundFix 把节点夹在 maxRow 内即可
+  moveNodeCheck(node, o) {
+    if (!this.changedPosConstrain(node, o)) return false;
+    o.pack = true;
+    return this.moveNode(node, o);
+  }
+}
+class PushOnlyEngine extends GridStackEngine {
+  swap() {
+    return false;
+  }
+}
+export {
+  NoCollideEngine,
+  PushOnlyEngine
+};

package/dist/src/grid/geometry.js

@@ -0,0 +1,45 @@
+import '../../style.css';
+function resolveGrid(grid, { containerWidth = 0, bodyHeight = 0 } = {}) {
+  const colNum = grid.colNum;
+  const rowHeight = grid.rowHeight === "auto" ? Math.max(1, bodyHeight / 1e3 * 10) : grid.rowHeight;
+  const autoGap = [rowHeight * 2, rowHeight * 2];
+  const gap = grid.gap === "auto" ? autoGap : grid.gap;
+  const padding = grid.padding == null ? gap : grid.padding === "auto" ? autoGap : grid.padding;
+  const [gapX, gapY] = gap;
+  const [padX, padY] = padding;
+  const rawColWidth = padX === gapX ? (containerWidth - gapX * (colNum + 1)) / colNum : (containerWidth - padX * 2 - gapX * (colNum - 1)) / colNum;
+  const colWidth = containerWidth > 0 ? rawColWidth : 0;
+  return { colNum, rowHeight, gapX, gapY, padX, padY, colWidth, containerWidth };
+}
+function itemRect(item, r) {
+  const x = Number(item.x) || 0;
+  const y = Number(item.y) || 0;
+  const w = Math.max(1, Number(item.w) || 1);
+  const h = Math.max(1, Number(item.h) || 1);
+  return {
+    left: Math.round(r.colWidth * x + (x + 1) * r.gapX + (r.padX - r.gapX)),
+    top: Math.round(r.rowHeight * y + (y + 1) * r.gapY + (r.padY - r.gapY)),
+    width: Math.round(r.colWidth * w + Math.max(0, w - 1) * r.gapX),
+    height: Math.round(r.rowHeight * h + Math.max(0, h - 1) * r.gapY)
+  };
+}
+function layoutHeight(items, r) {
+  let bottom = 0;
+  for (const item of items || []) {
+    if (!item) continue;
+    const b = (Number(item.y) || 0) + Math.max(1, Number(item.h) || 1);
+    if (b > bottom) bottom = b;
+  }
+  if (!bottom) return 0;
+  if (r.padY === r.gapY) return bottom * (r.rowHeight + r.gapY) + r.gapY;
+  return r.padY * 2 + bottom * (r.rowHeight + r.gapY) - r.gapY;
+}
+function rectStyle(rect) {
+  return { left: rect.left + "px", top: rect.top + "px", width: rect.width + "px", height: rect.height + "px" };
+}
+export {
+  itemRect,
+  layoutHeight,
+  rectStyle,
+  resolveGrid
+};