@epxing/dashboard 5.3.0-beta.1 → 5.3.0-beta.3

package/API.md

@@ -2,19 +2,18 @@
 
 看板根容器、分组标签、标题、内容区和挂件组件。
 
-本页对应包版本 `5.3.0-beta.1`。导出名、子路径和签名从当前源码、package.json 与类型声明生成。
+本页对应包版本 `5.3.0-beta.3`。导出名、子路径和签名从当前源码、package.json 与类型声明生成。
 
 ## 安装与使用
 
 
 ```sh
-pnpm add @epxing/dashboard
+pnpm add @epxing/dashboard@5.3.0-beta.2
 ```
 
 
 ```js
 import DashboardPlugin, { Dashboard, DashboardWidget } from '@epxing/dashboard'
-import '@epxing/dashboard/style.css'
 
 // app 已初始化 core 和基础组件
 app.use(DashboardPlugin)
@@ -25,6 +24,8 @@ app.component('ProductDashboard', Dashboard)
 
 default 与具名 Dashboard 是同一根组件；其 install 会注册配套组件、预览和网格兼容组件。布局、请求与保存依赖平台运行环境。Tabs/Title/Div/Widget 稳定子路径均为 default 组件导出。
 
+本版 JS 入口自动加载本包聚合样式，根导入和稳定子路径均无需手动 import style.css；保留显式样式入口以兼容旧代码。样式按包加载，产品覆盖样式放在框架导入之后。
+
 ## 根入口完整导出
 
 | 导出名 | 形态 | 用途 | 参数 / 配置 / 事件 |
@@ -50,7 +51,7 @@ default 与具名 Dashboard 是同一根组件；其 install 会注册配套组
 | `@epxing/dashboard/title` | `default` | 看板标题组件，展示标题和相关样式。 [详细参考](../../docs/revision/dashboard/Title.md) |
 | `@epxing/dashboard/div` | `default` | 看板内容容器，承载嵌套内容和布局。 [详细参考](../../docs/revision/dashboard/Div.md) |
 | `@epxing/dashboard/widget` | `default` | 看板挂件容器，负责挂件内容与布局交互。 [详细参考](../../docs/revision/dashboard/Widget.md) |
-| `@epxing/dashboard/style.css` | 样式副作用入口 | 在产品入口引入一次。 |
+| `@epxing/dashboard/style.css` | 可选的显式样式入口 | JS 入口自动加载本包样式；保留此路径以兼容旧代码。 |
 
 ## 源码兼容与其他入口
 

package/README.md

@@ -1,41 +1,42 @@
-# @epxing/dashboard
-
-[完整公开 API、导入方式与示例](./API.md)
-
-数据看板包 - **可视化看板搭建，拖拽组件组成仪表盘大屏（按需加载）**。
-
-## 范围
-
-- `src/frame/packages/dashboard/`（Dashboard.vue / Widget.vue / Tabs.vue / Div.vue / Header.vue）
-- `src/frame/packages/visual-config-page/Dashboard*.vue`
-- `src/frame/packages/visual-config-page/DashboardDesign.vue`
-- `src/frame/packages/visual-config-page/dashboard-theme-setting/`（Background / Border / Index）
-
-## 依赖
-
-- `@epxing/utils`
-- `@epxing/theme`
-- `@epxing/core`
-- `@epxing/components`
-- echarts / d3（本包独占重依赖）
-
-## 加载策略
-
-`apps/platform` 路由层 `() => import('@epxing/dashboard')` 懒加载。
-
-## 状态
-
-🟡 stub - 实际迁移在 T20。
-
-
-## 独立包公共入口（2026-10-22）
-
-根入口及稳定子路径提供类型声明。先安装 core 与需要的 component，再按需安装本包。
-
-```js
-import plugin from '@epxing/dashboard'
-import '@epxing/dashboard/style.css'
-app.use(plugin)
-```
-
-工作区构建：`pnpm --filter @epxing/dashboard build`。pack/publish 的 prepack 会重建；版本由 Changesets 独立管理。旧 `/src/*` 入口保留。完整初始化、打包与远程共享流程见 docs/build-and-publish.md。
+# @epxing/dashboard
+
+[完整公开 API、导入方式与示例](./API.md)
+
+从 5.3.0-beta.2 起，导入本包 JS 时自动加载包级样式，根入口和稳定子路径均无需手动引入 style.css。显式样式入口继续兼容旧代码；产品覆盖样式放在框架导入之后。
+
+数据看板包 - **可视化看板搭建，拖拽组件组成仪表盘大屏（按需加载）**。
+
+## 范围
+
+- `src/frame/packages/dashboard/`（Dashboard.vue / Widget.vue / Tabs.vue / Div.vue / Header.vue）
+- `src/frame/packages/visual-config-page/Dashboard*.vue`
+- `src/frame/packages/visual-config-page/DashboardDesign.vue`
+- `src/frame/packages/visual-config-page/dashboard-theme-setting/`（Background / Border / Index）
+
+## 依赖
+
+- `@epxing/utils`
+- `@epxing/theme`
+- `@epxing/core`
+- `@epxing/components`
+- echarts / d3（本包独占重依赖）
+
+## 加载策略
+
+`apps/platform` 路由层 `() => import('@epxing/dashboard')` 懒加载。
+
+## 状态
+
+🟡 stub - 实际迁移在 T20。
+
+
+## 独立包公共入口（2026-10-22）
+
+根入口及稳定子路径提供类型声明。先安装 core 与需要的 component，再按需安装本包。
+
+```js
+import plugin from '@epxing/dashboard'
+app.use(plugin)
+```
+
+工作区构建：`pnpm --filter @epxing/dashboard build`。pack/publish 的 prepack 会重建；版本由 Changesets 独立管理。旧 `/src/*` 入口保留。完整初始化、打包与远程共享流程见 docs/build-and-publish.md。

package/dist/src/Dashboard.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import DashboardHeader from "./Header.js";
 import DashboardGrid from "./DashboardGrid.js";
 import chartRequestScope from "./chart-request-scope.js";
@@ -326,7 +327,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 6)
   ], 6);
 }
-const Dashboard = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-2bc41af0"]]);
+const Dashboard = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c85a2bef"]]);
 export {
   Dashboard as default
 };

package/dist/src/DashboardGrid.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { isContainerType, normalizeGridParams } from "./grid/model.js";
 import { normalizeGridItem } from "./layout-util.js";
 import { layoutHeight, itemRect, rectStyle, resolveGrid } from "./grid/geometry.js";

package/dist/src/DesignGrid.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { openBlock, createElementBlock, withModifiers, normalizeStyle, normalizeClass, createElementVNode, Fragment, renderList, createBlock, Teleport, renderSlot, createCommentVNode, markRaw } from "vue";
 import { DDManager, GridStack } from "gridstack";
 import "gridstack/dist/gridstack.min.css";

package/dist/src/DesignItem.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { openBlock, createElementBlock, withModifiers, normalizeClass, createElementVNode, renderSlot, Fragment, renderList, createCommentVNode } from "vue";
 /* empty css               */
 import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";

package/dist/src/Div.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { __vitePreload as __epxPackagePreload } from "../_virtual/preload-helper.js";
 import { defineAsyncComponent, resolveComponent, openBlock, createElementBlock, normalizeStyle, normalizeClass, createElementVNode, Fragment, createCommentVNode, toDisplayString, createBlock, withCtx, resolveDynamicComponent, createVNode, createTextVNode } from "vue";
 import { normalizeGridItem } from "./layout-util.js";

package/dist/src/Header.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import Header from "@epxing/components/src/header";
 import { evalWith } from "@epxing/utils/src/eval-with";
 import { MobileSheet } from "@epxing/components/src/mobile";

package/dist/src/Preview.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { openBlock, createElementBlock } from "vue";
 import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
 const _sfc_main = {

package/dist/src/Tabs.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { __vitePreload as __epxPackagePreload } from "../_virtual/preload-helper.js";
 import { defineAsyncComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createCommentVNode, Fragment, renderList, withModifiers, withDirectives, vModelText, toDisplayString, normalizeStyle, createBlock, withCtx, resolveDynamicComponent, createVNode, createTextVNode } from "vue";
 import { normalizeGridItem } from "./layout-util.js";

package/dist/src/Title.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import component from "@epxing/core/src/mixins/component";
 import { openBlock, createElementBlock, normalizeStyle, normalizeClass, createCommentVNode, createTextVNode, toDisplayString } from "vue";
 /* empty css          */

package/dist/src/Widget.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import DashboardGrid from "./DashboardGrid.js";
 import chartRequestScope from "./chart-request-scope.js";
 import { evalWith } from "@epxing/utils/src/eval-with";
@@ -260,7 +261,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 4)
   ], 6);
 }
-const DashboardWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d068f7d2"]]);
+const DashboardWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-651dd5dc"]]);
 export {
   DashboardWidget as default
 };

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

@@ -1,3 +1,4 @@
+import '../style.css';
 import { markRaw } from "vue";
 import { createChartRequestBroker } from "@epxing/utils/src/chart-request-broker";
 const chartRequestScope = {

package/dist/src/design-target.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { stackMobileLayout } from "./layout-util.js";
 const DEFAULT_DASHBOARD_THEME = "light";
 function getDashboardDesignTarget(config = {}) {

package/dist/src/grid/compact.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 function collides(l1, l2) {
   if (l1 === l2) return false;
   if (l1.x + l1.w <= l2.x) return false;

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

@@ -1,3 +1,4 @@
+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";

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

@@ -1,3 +1,4 @@
+import '../../../style.css';
 import { layoutHeight, resolveGrid } from "../geometry.js";
 import { compact } from "../compact.js";
 import { openBlock, createElementBlock, normalizeStyle, renderSlot } from "vue";

package/dist/src/grid/designState.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 import { reactive } from "vue";
 function createDesignState() {
   const state = reactive({ activeId: null, activeItem: null, activeOwner: null });

package/dist/src/grid/engines.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 import { GridStackEngine } from "gridstack";
 class NoCollideEngine extends GridStackEngine {
   collide() {

package/dist/src/grid/geometry.js

@@ -1,3 +1,4 @@
+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;

package/dist/src/grid/gridstackParams.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 function px(n) {
   return `${n}px`;
 }

package/dist/src/grid/mixins.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 import { isContainerType, getContainerGrid, isLegacyConfig, getPageGrid, MOBILE_GRID, normalizeGridParams, LEGACY_CONTAINER_GRID } from "./model.js";
 import { stackMobileLayout } from "../layout-util.js";
 const pageGridMixin = {

package/dist/src/grid/model.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 import { normalizeGridItem } from "../layout-util.js";
 const CONFIG_VERSION = "3.0";
 const CONTAINER_TYPES = ["dashboard-div", "dashboard-tabs"];

package/dist/src/grid/useViewportGate.js

@@ -1,3 +1,4 @@
+import '../../style.css';
 function createViewportGate({ root = null, mountMargin = "100%", unmountMargin = "200%", sticky = false, onChange } = {}) {
   const IO = typeof window !== "undefined" ? window.IntersectionObserver : void 0;
   if (typeof IO !== "function") {

package/dist/src/index.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import Dashboard from "./Dashboard.js";
 import DashboardTabs from "./Tabs.js";
 import DashboardTitle from "./Title.js";

package/dist/src/layout-util.js

@@ -1,3 +1,4 @@
+import '../style.css';
 const DEFAULT_HALF_TYPES = [
   "num-statistic",
   "card-num",

package/dist/src/mobile-design.js

@@ -1,3 +1,4 @@
+import '../style.css';
 import { stackMobileLayout } from "./layout-util.js";
 import { normalizeMobileAppearance } from "@epxing/utils/src/mobile-chart-appearance";
 function indexDashboardItems(items = [], result = /* @__PURE__ */ new Map()) {

package/dist/src/theme-style.js

@@ -1,3 +1,4 @@
+import '../style.css';
 const kebabCase = (key) => key.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
 const camelCase = (key) => key.replace(/-(\w)/g, (s, c) => c.toUpperCase());
 const ACCENT_BASE = {

package/dist/style.css

@@ -971,7 +971,7 @@ div.container[data-v-503fe9af] {
  -------------------------- */
 /* BEM
  -------------------------- */
-.dashboard[data-v-d068f7d2] {
+.dashboard[data-v-651dd5dc] {
   width: 100%;
   height: 100%;
   overflow: auto;
@@ -979,31 +979,31 @@ div.container[data-v-503fe9af] {
   display: flex;
   flex-direction: column;
 }
-.dashboard .base-page[data-v-d068f7d2] {
+.dashboard .base-page[data-v-651dd5dc] {
   position: static;
   overflow-x: hidden;
   padding: 0;
 }
-.dashboard--hidden-scroll-bar .dashboard-container[data-v-d068f7d2]::-webkit-scrollbar-thumb {
+.dashboard--hidden-scroll-bar .dashboard-container[data-v-651dd5dc]::-webkit-scrollbar-thumb {
   background: none;
 }
-.dashboard--hidden-scroll-bar .dashboard-container[data-v-d068f7d2]::-webkit-scrollbar-thumb:hover {
+.dashboard--hidden-scroll-bar .dashboard-container[data-v-651dd5dc]::-webkit-scrollbar-thumb:hover {
   background-color: rgba(95, 95, 95, 0.3);
 }
-.dashboard-container[data-v-d068f7d2] {
+.dashboard-container[data-v-651dd5dc] {
   width: 100%;
   flex: 1;
   overflow: auto;
 }
-.dashboard-component[data-v-d068f7d2] {
+.dashboard-component[data-v-651dd5dc] {
   width: 100%;
   height: 100%;
   overflow: auto;
 }
-.dashboard--dark .dashboard-container[data-v-d068f7d2] {
+.dashboard--dark .dashboard-container[data-v-651dd5dc] {
   background: #151C3D;
 }
-.dashboard--technology .dashboard-container[data-v-d068f7d2] {
+.dashboard--technology .dashboard-container[data-v-651dd5dc] {
   background: url("./assets/technology_bg-oWIS2awO.jpg") no-repeat center;
   background-size: cover;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epxing/dashboard",
-  "version": "5.3.0-beta.1",
+  "version": "5.3.0-beta.3",
   "description": "看板运行态渲染",
   "type": "module",
   "main": "./dist/src/index.js",
@@ -56,10 +56,10 @@
   ],
   "dependencies": {
     "gridstack": "13.3.0",
-    "@epxing/core": "^5.3.0-beta.1",
-    "@epxing/utils": "^5.3.0-beta.1",
-    "@epxing/components": "^5.3.0-beta.1",
-    "@epxing/theme": "^5.3.0-beta.1"
+    "@epxing/components": "^5.3.0-beta.3",
+    "@epxing/core": "^5.3.0-beta.3",
+    "@epxing/theme": "^5.3.0-beta.3",
+    "@epxing/utils": "^5.3.0-beta.3"
   },
   "peerDependencies": {
     "vue": "3.5.39",
@@ -76,7 +76,8 @@
     "./dist/src/store/**",
     "./dist/src/mixins/**",
     "./dist/src/runtime-utils/util.js",
-    "./dist/src/runtime-services.js"
+    "./dist/src/runtime-services.js",
+    "./dist/**/*.js"
   ],
   "publishConfig": {
     "access": "public",