@das-fed/web 7.1.0-qatar.1 → 7.1.0-qatar.2

package/index.js

@@ -1,6 +1,6 @@
-import { K as e, B as t, D as n, C as i, E as r, e as u, m as o, x as m, q as p, n as g, f as D, k as l, w as L, z as b, A as c, h, i as A, H as T, I as y, r as R, F as W, G as I, L as M, J as F, s as V, j as d, o as f, v as k, y as v, t as w } from "./index-CzrFWqFK.js";
+import { L as s, C as t, E as n, D as i, F as r, e as u, m as o, x as m, q as l, n as p, f as g, k as D, w as L, z as b, A as h, h as T, i as c, I as A, J as R, r as y, G as M, H as W, M as I, K as F, B as V, s as d, j as f, o as k, v, y as w, t as x } from "./index-BaX9zH-6.js";
 export {
-  e as DasMainAppLayout,
+  s as DasMainAppLayout,
   t as DasWebLayout,
   n as DasWebMenu,
   i as DasWebNav,
@@ -8,26 +8,27 @@ export {
   u as createDasWebApp,
   o as currentLang,
   m as currentTheme,
-  p as customLangeData,
-  g as dir,
-  D as getI18nRule,
-  l as getLang,
+  l as customLangeData,
+  p as dir,
+  g as getI18nRule,
+  D as getLang,
   L as getThemeRule,
   b as getVar,
-  c as getVarValue,
-  h as i18n,
-  A as initI18n,
-  T as initMainApp,
-  y as initMicroApp,
-  R as initTheme,
-  W as layout,
-  I as layoutData,
-  M as mainAppFramework,
+  h as getVarValue,
+  T as i18n,
+  c as initI18n,
+  A as initMainApp,
+  R as initMicroApp,
+  y as initTheme,
+  M as layout,
+  W as layoutData,
+  I as mainAppFramework,
   F as microFrontend,
-  V as setI18nRule,
-  d as setLang,
-  f as setLangRule,
-  k as setTheme,
-  v as setThemeRule,
-  w as t
+  V as setGlobalThemeRule,
+  d as setI18nRule,
+  f as setLang,
+  k as setLangRule,
+  v as setTheme,
+  w as setThemeRule,
+  x as t
 };

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@das-fed/web",
-  "version": "7.1.0-qatar.1",
+  "version": "7.1.0-qatar.2",
   "type": "module",
   "main": "./index.js",
   "dependencies": {
-    "@das-fed/ui": "7.1.0-qatar.1",
-    "@das-fed/utils": "7.1.0-qatar.1",
-    "@das-fed/web": "7.1.0-qatar.1",
-    "@das-fed/web-components": "7.1.0-qatar.1",
+    "@das-fed/ui": "7.1.0-qatar.2",
+    "@das-fed/utils": "7.1.0-qatar.2",
+    "@das-fed/web": "7.1.0-qatar.2",
+    "@das-fed/web-components": "7.1.0-qatar.2",
     "@microsoft/signalr": "^8.0.7",
     "@vueuse/core": "^9.13.0",
     "animate.css": "^4.1.1",
@@ -19,7 +19,7 @@
     "vue-router": "^4.4.0"
   },
   "devDependencies": {
-    "@das-fed/cli": "7.1.0-qatar.1",
+    "@das-fed/cli": "7.1.0-qatar.2",
     "@types/crypto-js": "^4.2.2",
     "@types/lodash": "^4.14.194",
     "@types/lodash-es": "^4.17.12",

package/packages/theme/index.js

@@ -1,75 +1,198 @@
-import { ref as h, computed as b } from "vue";
-const d = h("light"), i = h({
+import { ref as u, computed as b } from "vue";
+import { setThemeRule as p } from "@das-fed/web/packages/theme/index";
+const f = {
+  "--das-color-brand-primary": "#348CAB",
+  // 品牌主色-默认
+  "--das-color-brand-primary-light": "#EBFAFF",
+  // 品牌主色-浅色背景
+  "--das-color-brand-primary-hover": "#53A2BE",
+  // 品牌主色-悬停
+  "--das-color-brand-primary-active": "#24718C",
+  // 品牌主色-激活
+  "--das-color-brand-primary-disabled": "#BEE4F1",
+  // 品牌主色-禁用
+  "--das-color-brand-primary-shadow": "rgba(52, 140, 171, 0.1)",
+  // 品牌主色-焦点阴影
+  "--das-color-brand-secondary": "#495CA6",
+  // 品牌辅助色-默认
+  "--das-color-brand-secondary-hover": "#6578C2",
+  // 品牌辅助色-悬停
+  "--das-color-brand-secondary-active": "#405192",
+  // 品牌辅助色-激活
+  "--das-color-brand-secondary-disabled": "#C8D2F1",
+  // 品牌辅助色-禁用
+  "--das-color-success": "#1BA854",
+  // 功能色-成功
+  "--das-color-info": "#276FF5",
+  // 功能色-信息
+  "--das-color-warning": "#FF991C",
+  // 功能色-警告
+  "--das-color-danger": "#FB2323",
+  // 功能色-危险
+  "--das-color-danger-light": "#FFDBE0",
+  // 功能色-危险浅色背景
+  "--das-color-text-title": "#212121",
+  // 文字色-标题
+  "--das-color-text-body": "#666666",
+  // 文字色-正文
+  "--das-color-text-subtle": "#999999",
+  // 文字色-辅助
+  "--das-color-text-caption": "#B2B2B2",
+  // 文字色-说明
+  "--das-color-bg-page": "#F2F7FF",
+  // 背景色-页面
+  "--das-color-bg-container": "#FFFFFF",
+  // 背景色-容器
+  "--das-color-bg-disabled": "#F5F5F5",
+  // 背景色-禁用
+  "--das-color-mask-dark": "#000000",
+  // 遮罩色-深色
+  "--das-color-mask-dark-opacity": "rgba(0, 0, 0, 0.5)",
+  // 遮罩色-深色半透明
+  "--das-color-border-light": "#FFFFFF",
+  // 描边色-弱
+  "--das-color-border-base": "#E5E5E5",
+  // 描边色-常规
+  "--das-color-border-strong": "#D9D9D9"
+  // 描边色-强调
+}, y = {
+  "--das-font-size-xxs": "10px",
+  // 极小字号，用于角标、辅助标识、弱提示等低层级信息
+  "--das-font-size-xs": "12px",
+  // 辅助字号，用于表格、说明文字、错误提示等紧凑信息
+  "--das-font-size-sm": "14px",
+  // 小字号，用于表单、列表、菜单等常规控件文字
+  "--das-font-size-md": "16px",
+  // 基础字号，用于正文、默认输入内容、常规阅读文本
+  "--das-font-size-lg": "18px",
+  // 大字号，用于模块标题、弹窗标题等强调文本
+  "--das-font-size-xl": "20px",
+  // 一级内容标题字号，用于页面内重要标题
+  "--das-font-size-2xl": "24px",
+  // 展示标题字号，用于重点数据、卡片标题等
+  "--das-font-size-3xl": "28px",
+  // 大展示标题字号，用于关键指标或大号标题
+  "--das-font-size-4xl": "32px",
+  // 页面标题字号，用于页面级标题
+  "--das-font-size-5xl": "40px",
+  // 大屏标题字号，用于运营屏、看板标题等展示场景
+  "--das-font-size-6xl": "48px",
+  // 超大展示字号，用于大屏核心数据或强视觉标题
+  "--das-font-size-7xl": "56px",
+  // 最大展示字号，用于超大屏核心数据或主视觉标题
+  "--das-line-height-xxs": "15px",
+  // 10px 字号对应行高
+  "--das-line-height-xs": "18px",
+  // 12px 字号对应行高
+  "--das-line-height-sm": "21px",
+  // 14px 字号对应行高
+  "--das-line-height-md": "24px",
+  // 16px 字号对应行高
+  "--das-line-height-lg": "27px",
+  // 18px 字号对应行高
+  "--das-line-height-xl": "30px",
+  // 20px 字号对应行高
+  "--das-line-height-2xl": "36px",
+  // 24px 字号对应行高
+  "--das-line-height-3xl": "42px",
+  // 28px 字号对应行高
+  "--das-line-height-4xl": "48px",
+  // 32px 字号对应行高
+  "--das-line-height-5xl": "60px",
+  // 40px 字号对应行高
+  "--das-line-height-6xl": "72px",
+  // 48px 字号对应行高
+  "--das-line-height-7xl": "84px"
+  // 56px 字号对应行高
+}, F = {
+  "--das-radius-none": "0px",
+  // 无圆角
+  "--das-radius-xs": "3px",
+  // 极小圆角，多选框表格、下拉多选、多选树、多选列表等
+  "--das-radius-sm": "4px",
+  // 小尺寸圆角，按钮、输入框、标签等
+  "--das-radius-md": "6px",
+  // 中尺寸圆角，搜索框、下拉面板等
+  "--das-radius-lg": "8px",
+  // 大尺寸圆角，卡片、弹窗、通知等
+  "--das-radius-xl": "12px",
+  // 超大尺寸圆角，强调容器或特殊面板
+  "--das-radius-pill": "999px"
+  // 胶囊圆角
+}, z = () => {
+  const s = /* @__PURE__ */ Object.assign({ "./module/color.ts": f, "./module/fontSize.ts": y, "./module/radius.ts": F });
+  Object.keys(s).map((e) => p(s[e]));
+}, r = u("light"), c = u({
   light: {},
   dark: {}
-}), u = h({
+}), m = u({
   light: {},
   dark: {}
-}), v = "dasTheme", r = "das-theme", y = (t) => {
+}), v = "dasTheme", h = "das-theme", T = (s) => {
   let e = {
     light: {},
     dark: {}
   };
-  if (!t) return e;
-  const { light: l = {}, dark: n = {}, base: a = {}, ...s } = t || {};
-  e.light = { ...l, ...a }, e.dark = n || {};
-  for (const o in s) {
-    const c = s[o];
-    if (typeof c == "string" && (e.light[o] = c), typeof c == "object")
-      for (const m in c)
-        e[m] || (e[m] = {}), e[m][o] || (e[m][o] = {}), e[m][o] = c[m];
+  if (!s) return e;
+  const { light: o = {}, dark: d = {}, base: a = {}, ...t } = s || {};
+  e.light = { ...o, ...a }, e.dark = d || {};
+  for (const l in t) {
+    const n = t[l];
+    if (typeof n == "string" && (e.light[l] = n), typeof n == "object")
+      for (const i in n)
+        e[i] || (e[i] = {}), e[i][l] || (e[i][l] = {}), e[i][l] = n[i];
   }
   return e;
 };
-function T(t) {
-  const e = "das-global-theme", l = "das-custom-theme";
-  if (!document.getElementById(l)) {
+function _(s) {
+  const e = "das-global-theme", o = "das-custom-theme";
+  if (!document.getElementById(o)) {
     const a = document.createElement("style");
-    a.appendChild(document.createTextNode("")), a.setAttribute("id", l), document.head.appendChild(a);
+    a.appendChild(document.createTextNode("")), a.setAttribute("id", o), document.head.appendChild(a);
   }
   if (!document.getElementById(e)) {
     const a = document.createElement("style");
     a.appendChild(document.createTextNode("")), a.setAttribute("id", e), document.head.appendChild(a);
   }
-  t || (t = "custom");
-  let n = document.getElementById(l);
-  return t === "global" && (n = document.getElementById(e)), n.sheet;
+  s || (s = "custom");
+  let d = document.getElementById(o);
+  return s === "global" && (d = document.getElementById(e)), d.sheet;
 }
-const g = (t, e) => {
+const g = (s, e) => {
   e || (e = "custom");
-  const l = T(e), n = y(t);
-  for (const s in n) {
-    const o = n[s];
-    for (const c in o) {
-      const m = o[c], f = `${r}-${s}`;
-      l.insertRule(`.${f} { ${c}:${m} } `, l.cssRules.length);
+  const o = _(e), d = T(s);
+  for (const t in d) {
+    const l = d[t];
+    for (const n in l) {
+      const i = l[n], x = `${h}-${t}`;
+      o.insertRule(`.${x} { ${n}:${i} } `, o.cssRules.length);
     }
-    e === "global" && (u.value[s] || (u.value[s] = {}), u.value[s] = { ...u.value[s], ...o }), e === "custom" && (i.value[s] || (i.value[s] = {}), i.value[s] = { ...i.value[s], ...o });
+    e === "global" && (m.value[t] || (m.value[t] = {}), m.value[t] = { ...m.value[t], ...l }), e === "custom" && (c.value[t] || (c.value[t] = {}), c.value[t] = { ...c.value[t], ...l });
   }
-  const a = `${r}-${d.value}`;
+  const a = `${h}-${r.value}`;
   document.body.classList.contains(a) || document.body.classList.add(a);
-}, D = async (t) => {
-  var n, a;
+}, C = async (s) => {
+  var d, a;
   const e = window[v];
   e && g(e, "global");
-  let l = Object.assign(((n = t == null ? void 0 : t.theme) == null ? void 0 : n.glob) || {});
-  (a = t == null ? void 0 : t.microApps) == null || a.map((s) => {
-    var o;
-    l = Object.assign(l, ((o = s.theme) == null ? void 0 : o.glob) || {});
-  }), Object.values(l).filter((s) => !!s).flat().map((s) => g(s));
-}, C = (t) => {
-  document.body.classList.add(`${r}-light`), t === "light" && document.body.classList.remove(`${r}-${d.value}`), d.value = t, document.body.classList.add(`${r}-${d.value}`);
-}, $ = (t) => b(() => {
-  var e, l, n, a;
-  return ((l = (e = u.value) == null ? void 0 : e[d.value]) == null ? void 0 : l[t]) || ((a = (n = i.value) == null ? void 0 : n[d.value]) == null ? void 0 : a[t]) || t;
-}), E = (t) => `var(${t})`, R = $, x = {};
+  let o = Object.assign(((d = s == null ? void 0 : s.theme) == null ? void 0 : d.glob) || {});
+  (a = s == null ? void 0 : s.microApps) == null || a.map((t) => {
+    var l;
+    o = Object.assign(o, ((l = t.theme) == null ? void 0 : l.glob) || {});
+  }), Object.values(o).filter((t) => !!t).flat().map((t) => g(t));
+}, D = (s) => {
+  document.body.classList.add(`${h}-light`), s === "light" && document.body.classList.remove(`${h}-${r.value}`), r.value = s, document.body.classList.add(`${h}-${r.value}`);
+}, B = (s) => b(() => {
+  var e, o, d, a;
+  return ((o = (e = m.value) == null ? void 0 : e[r.value]) == null ? void 0 : o[s]) || ((a = (d = c.value) == null ? void 0 : d[r.value]) == null ? void 0 : a[s]) || s;
+}), k = (s) => `var(${s})`, R = B;
 export {
-  d as currentTheme,
-  x as default,
-  $ as getThemeRule,
-  E as getVar,
+  r as currentTheme,
+  B as getThemeRule,
+  k as getVar,
   R as getVarValue,
-  D as initTheme,
-  C as setTheme,
+  C as initTheme,
+  z as setGlobalThemeRule,
+  D as setTheme,
   g as setThemeRule
 };

package/types/theme/global/index.d.ts

@@ -0,0 +1,2 @@
+declare const setGlobalThemeRule: () => void;
+export { setGlobalThemeRule };

package/types/theme/index.d.ts

@@ -1,3 +1,5 @@
+import { setGlobalThemeRule } from './global';
+
 declare const currentTheme: import('vue').Ref<any, any>;
 declare const setThemeRule: (data: any, type?: "global" | "custom") => void;
 declare const initTheme: (opt?: any) => any;
@@ -8,6 +10,4 @@ declare const getThemeRule: (key: string) => import('vue').ComputedRef<any>;
 declare const getVar: (key: string) => string;
 /** 获取css var实际值 */
 declare const getVarValue: (key: string) => import('vue').ComputedRef<any>;
-export { initTheme, setTheme, getThemeRule, currentTheme, setThemeRule, getVar, getVarValue };
-declare const _default: {};
-export default _default;
+export { initTheme, setTheme, getThemeRule, currentTheme, setThemeRule, getVar, getVarValue, setGlobalThemeRule };