@pubinfo/config 2.0.0-beta.3 → 2.0.0-beta.31

package/src/themes/system/dark/night.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'night',
+  colors: {
+    'label': '夜蓝梦',
+    // 颜色主题
+    'color-scheme': 'dark',
+    // 内置 UI
+    '--ui-primary': '#0ca6e9',
+    '--ui-text': '#242b33',
+    // 主体
+    '--g-bg': '#0f1729',
+    '--g-container-bg': '#1d283a',
+    '--g-border-color': '#191E24',
+    // 头部
+    '--g-header-bg': '#0f1729',
+    '--g-header-color': '#c8cad0',
+    '--g-header-menu-color': '#a6adbb',
+    '--g-header-menu-hover-color': '#c8cad0',
+    '--g-header-menu-hover-bg': '#1d283a',
+    '--g-header-menu-active-color': '#c8cad0',
+    '--g-header-menu-active-bg': '#1d283a',
+    // 主导航
+    '--g-main-sidebar-bg': '#0f1729',
+    '--g-main-sidebar-menu-color': '#a6adbb',
+    '--g-main-sidebar-menu-hover-color': '#c8cad0',
+    '--g-main-sidebar-menu-hover-bg': '#1d283a',
+    '--g-main-sidebar-menu-active-color': '#c8cad0',
+    '--g-main-sidebar-menu-active-bg': '#1d283a',
+    // 次导航
+    '--g-sub-sidebar-bg': '#1d283a',
+    '--g-sub-sidebar-logo-color': '#1d232a',
+    '--g-sub-sidebar-logo-bg': '#a6adbb',
+    '--g-sub-sidebar-menu-color': '#a6adbb',
+    '--g-sub-sidebar-menu-hover-color': '#c8cad0',
+    '--g-sub-sidebar-menu-hover-bg': '#273449',
+    '--g-sub-sidebar-menu-active-color': '#c8cad0',
+    '--g-sub-sidebar-menu-active-bg': '#0f1729',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a6adbb',
+    '--g-tabbar-tab-color': '#a6adbb',
+    '--g-tabbar-tab-hover-color': '#c8cad0',
+    '--g-tabbar-tab-hover-bg': '#242b33',
+    '--g-tabbar-tab-active-color': '#c8cad0',
+  },
+});

package/src/themes/system/dark/stone.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'stone',
+  colors: {
+    'label': '石青润',
+    // 颜色主题
+    'color-scheme': 'dark',
+    // 内置 UI
+    '--ui-primary': '#68d1bf',
+    '--ui-text': '#1b1a18',
+    // 主体
+    '--g-bg': '#1b1917',
+    '--g-container-bg': '#282524',
+    '--g-border-color': '#43403c',
+    // 头部
+    '--g-header-bg': '#1b1917',
+    '--g-header-color': '#e7e5e4',
+    '--g-header-menu-color': '#e7e5e4',
+    '--g-header-menu-hover-color': '#e7e5e4',
+    '--g-header-menu-hover-bg': '#282524',
+    '--g-header-menu-active-color': '#e7e5e4',
+    '--g-header-menu-active-bg': '#282524',
+    // 主导航
+    '--g-main-sidebar-bg': '#1b1917',
+    '--g-main-sidebar-menu-color': '#e7e5e4',
+    '--g-main-sidebar-menu-hover-color': '#e7e5e4',
+    '--g-main-sidebar-menu-hover-bg': '#282524',
+    '--g-main-sidebar-menu-active-color': '#e7e5e4',
+    '--g-main-sidebar-menu-active-bg': '#282524',
+    // 次导航
+    '--g-sub-sidebar-bg': '#282524',
+    '--g-sub-sidebar-logo-color': '#e7e5e4',
+    '--g-sub-sidebar-logo-bg': '#1a103c',
+    '--g-sub-sidebar-menu-color': '#e7e5e4',
+    '--g-sub-sidebar-menu-hover-color': '#e7e5e4',
+    '--g-sub-sidebar-menu-hover-bg': '#1b1917',
+    '--g-sub-sidebar-menu-active-color': '#e7e5e4',
+    '--g-sub-sidebar-menu-active-bg': '#1b1917',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a6adbb',
+    '--g-tabbar-tab-color': '#a6adbb',
+    '--g-tabbar-tab-hover-color': '#c8cad0',
+    '--g-tabbar-tab-hover-bg': '#282524',
+    '--g-tabbar-tab-active-color': '#c8cad0',
+  },
+});

package/src/themes/system/dark/synthwave.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'synthwave',
+  colors: {
+    'label': '紫电流',
+    // 颜色主题
+    'color-scheme': 'dark',
+    // 内置 UI
+    '--ui-primary': '#58c7f3',
+    '--ui-text': '#1a272e',
+    // 主体
+    '--g-bg': '#1a103c',
+    '--g-container-bg': '#221551',
+    '--g-border-color': '#191E24',
+    // 头部
+    '--g-header-bg': '#1a103c',
+    '--g-header-color': '#f9f7fd',
+    '--g-header-menu-color': '#f9f7fd',
+    '--g-header-menu-hover-color': '#f9f7fd',
+    '--g-header-menu-hover-bg': '#221551',
+    '--g-header-menu-active-color': '#f9f7fd',
+    '--g-header-menu-active-bg': '#221551',
+    // 主导航
+    '--g-main-sidebar-bg': '#1a103c',
+    '--g-main-sidebar-menu-color': '#f9f7fd',
+    '--g-main-sidebar-menu-hover-color': '#f9f7fd',
+    '--g-main-sidebar-menu-hover-bg': '#221551',
+    '--g-main-sidebar-menu-active-color': '#f9f7fd',
+    '--g-main-sidebar-menu-active-bg': '#221551',
+    // 次导航
+    '--g-sub-sidebar-bg': '#221551',
+    '--g-sub-sidebar-logo-color': '#f9f7fd',
+    '--g-sub-sidebar-logo-bg': '#1a103c',
+    '--g-sub-sidebar-menu-color': '#f9f7fd',
+    '--g-sub-sidebar-menu-hover-color': '#f9f7fd',
+    '--g-sub-sidebar-menu-hover-bg': '#160e35',
+    '--g-sub-sidebar-menu-active-color': '#f9f7fd',
+    '--g-sub-sidebar-menu-active-bg': '#160e35',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a6adbb',
+    '--g-tabbar-tab-color': '#a6adbb',
+    '--g-tabbar-tab-hover-color': '#c8cad0',
+    '--g-tabbar-tab-hover-bg': '#242b33',
+    '--g-tabbar-tab-active-color': '#c8cad0',
+  },
+});

package/src/themes/system/light/barbie.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'barbie',
+  colors: {
+    'label': '梦露粉',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#ff43bc',
+    '--ui-text': '#fcfcfc',
+    // 主体
+    '--g-bg': '#f2f2f2',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#ff43bc',
+    '--g-header-color': '#fff',
+    '--g-header-menu-color': '#fff',
+    '--g-header-menu-hover-bg': '#dd39a3',
+    '--g-header-menu-hover-color': '#fff',
+    '--g-header-menu-active-bg': '#dd39a3',
+    '--g-header-menu-active-color': '#fff',
+    // 主导航
+    '--g-main-sidebar-bg': '#ff43bc',
+    '--g-main-sidebar-menu-color': '#fff',
+    '--g-main-sidebar-menu-hover-bg': '#dd39a3',
+    '--g-main-sidebar-menu-hover-color': '#fff',
+    '--g-main-sidebar-menu-active-bg': '#dd39a3',
+    '--g-main-sidebar-menu-active-color': '#fff',
+    // 次导航
+    '--g-sub-sidebar-bg': '#fff',
+    '--g-sub-sidebar-logo-bg': '#ff43bc',
+    '--g-sub-sidebar-logo-color': '#fff',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#dd39a3',
+    '--g-sub-sidebar-menu-hover-color': '#fff',
+    '--g-sub-sidebar-menu-active-bg': '#dd39a3',
+    '--g-sub-sidebar-menu-active-color': '#fff',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/system/light/classic.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'classic',
+  colors: {
+    'label': '蓝古雅',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#1677ff',
+    '--ui-text': '#fcfcfc',
+    // 主体
+    '--g-bg': '#F5F8FE',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#2264F1',
+    '--g-header-color': '#fff',
+    '--g-header-menu-color': '#fff',
+    '--g-header-menu-hover-bg': '#57A1F7',
+    '--g-header-menu-hover-color': '#fff',
+    '--g-header-menu-active-bg': '#57A1F7',
+    '--g-header-menu-active-color': '#fff',
+    // 主导航
+    '--g-main-sidebar-bg': '#222b45',
+    '--g-main-sidebar-menu-color': '#fff',
+    '--g-main-sidebar-menu-hover-bg': '#334067',
+    '--g-main-sidebar-menu-hover-color': '#fff',
+    '--g-main-sidebar-menu-active-bg': '#334067',
+    '--g-main-sidebar-menu-active-color': '#fff',
+    // 次导航
+    '--g-sub-sidebar-bg': '#F5F8FE',
+    '--g-sub-sidebar-logo-bg': '#F5F8FE',
+    '--g-sub-sidebar-logo-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#dde1e3',
+    '--g-sub-sidebar-menu-hover-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-active-bg': '#F8FAFE',
+    '--g-sub-sidebar-menu-active-color': '#2264F1',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/system/light/cyberpunk.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'cyberpunk',
+  colors: {
+    'label': '黄未来',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#dbcb00',
+    '--ui-text': '#0f0f0f',
+    // 主体
+    '--g-bg': '#f2f2f2',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#fff',
+    '--g-header-color': '#302d12',
+    '--g-header-menu-color': '#302d12',
+    '--g-header-menu-hover-bg': '#dbcb00',
+    '--g-header-menu-hover-color': '#302d12',
+    '--g-header-menu-active-bg': '#dbcb00',
+    '--g-header-menu-active-color': '#302d12',
+    // 主导航
+    '--g-main-sidebar-bg': '#f2f2f2',
+    '--g-main-sidebar-menu-color': '#302d12',
+    '--g-main-sidebar-menu-hover-bg': '#dbcb00',
+    '--g-main-sidebar-menu-hover-color': '#302d12',
+    '--g-main-sidebar-menu-active-bg': '#dbcb00',
+    '--g-main-sidebar-menu-active-color': '#302d12',
+    // 次导航
+    '--g-sub-sidebar-bg': '#fff',
+    '--g-sub-sidebar-logo-bg': '#dbcb00',
+    '--g-sub-sidebar-logo-color': '#302d12',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#dbcb00',
+    '--g-sub-sidebar-menu-hover-color': '#302d12',
+    '--g-sub-sidebar-menu-active-bg': '#dbcb00',
+    '--g-sub-sidebar-menu-active-color': '#302d12',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/system/light/light.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'light',
+  colors: {
+    'label': '幽影黑',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#1677ff',
+    '--ui-text': '#fcfcfc',
+    // 主体
+    '--g-bg': '#f2f2f2',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#222b45',
+    '--g-header-color': '#fff',
+    '--g-header-menu-color': '#fff',
+    '--g-header-menu-hover-bg': '#334067',
+    '--g-header-menu-hover-color': '#fff',
+    '--g-header-menu-active-bg': '#334067',
+    '--g-header-menu-active-color': '#fff',
+    // 主导航
+    '--g-main-sidebar-bg': '#222b45',
+    '--g-main-sidebar-menu-color': '#fff',
+    '--g-main-sidebar-menu-hover-bg': '#334067',
+    '--g-main-sidebar-menu-hover-color': '#fff',
+    '--g-main-sidebar-menu-active-bg': '#334067',
+    '--g-main-sidebar-menu-active-color': '#fff',
+    // 次导航
+    '--g-sub-sidebar-bg': '#fff',
+    '--g-sub-sidebar-logo-bg': '#222b45',
+    '--g-sub-sidebar-logo-color': '#fff',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#dde1e3',
+    '--g-sub-sidebar-menu-hover-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-active-bg': '#1677ff',
+    '--g-sub-sidebar-menu-active-color': '#fff',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/system/light/naive.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'naive',
+  colors: {
+    'label': '青宇古',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#18a058',
+    '--ui-text': '#fcfcfc',
+    // 主体
+    '--g-bg': '#f2f2f2',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#1d2935',
+    '--g-header-color': '#fff',
+    '--g-header-menu-color': '#fff',
+    '--g-header-menu-hover-bg': '#42b983',
+    '--g-header-menu-hover-color': '#fff',
+    '--g-header-menu-active-bg': '#18a058',
+    '--g-header-menu-active-color': '#fff',
+    // 主导航
+    '--g-main-sidebar-bg': '#1d2935',
+    '--g-main-sidebar-menu-color': '#fff',
+    '--g-main-sidebar-menu-hover-bg': '#42b983',
+    '--g-main-sidebar-menu-hover-color': '#fff',
+    '--g-main-sidebar-menu-active-bg': '#18a058',
+    '--g-main-sidebar-menu-active-color': '#fff',
+    // 次导航
+    '--g-sub-sidebar-bg': '#fff',
+    '--g-sub-sidebar-logo-bg': '#1d2935',
+    '--g-sub-sidebar-logo-color': '#fff',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#42b983',
+    '--g-sub-sidebar-menu-hover-color': '#fff',
+    '--g-sub-sidebar-menu-active-bg': '#18a058',
+    '--g-sub-sidebar-menu-active-color': '#fff',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/system/light/winter.ts

@@ -0,0 +1,47 @@
+import { defineTheme } from '../../utils';
+
+export default defineTheme({
+  name: 'winter',
+  colors: {
+    'label': '冰雪蓝',
+    // 颜色主题
+    'color-scheme': 'light',
+    // 内置 UI
+    '--ui-primary': '#a6e4f8',
+    '--ui-text': '#3e4e68',
+    // 主体
+    '--g-bg': '#f1f5fe',
+    '--g-container-bg': '#fff',
+    '--g-border-color': '#f2f2f2',
+    // 头部
+    '--g-header-bg': '#fff',
+    '--g-header-color': '#3e4e68',
+    '--g-header-menu-color': '#3e4e68',
+    '--g-header-menu-hover-bg': '#e3e8f2',
+    '--g-header-menu-hover-color': '#3e4e68',
+    '--g-header-menu-active-bg': '#a6e4f8',
+    '--g-header-menu-active-color': '#3e4e68',
+    // 主导航
+    '--g-main-sidebar-bg': '#f1f5fe',
+    '--g-main-sidebar-menu-color': '#3e4e68',
+    '--g-main-sidebar-menu-hover-bg': '#e3e8f2',
+    '--g-main-sidebar-menu-hover-color': '#3e4e68',
+    '--g-main-sidebar-menu-active-bg': '#a6e4f8',
+    '--g-main-sidebar-menu-active-color': '#3e4e68',
+    // 次导航
+    '--g-sub-sidebar-bg': '#fff',
+    '--g-sub-sidebar-logo-bg': '#e3e8f2',
+    '--g-sub-sidebar-logo-color': '#3e4e68',
+    '--g-sub-sidebar-menu-color': '#0f0f0f',
+    '--g-sub-sidebar-menu-hover-bg': '#e3e8f2',
+    '--g-sub-sidebar-menu-hover-color': '#3e4e68',
+    '--g-sub-sidebar-menu-active-bg': '#a6e4f8',
+    '--g-sub-sidebar-menu-active-color': '#3e4e68',
+    // 标签栏
+    '--g-tabbar-dividers-bg': '#a3a3a3',
+    '--g-tabbar-tab-color': '#a3a3a3',
+    '--g-tabbar-tab-hover-bg': '#e5e5e5',
+    '--g-tabbar-tab-hover-color': '#0f0f0f',
+    '--g-tabbar-tab-active-color': '#0f0f0f',
+  },
+});

package/src/themes/theme.ts

@@ -0,0 +1,18 @@
+/**
+ * ========================================================================
+ *                            system
+ *=========================================================================
+ */
+import './system/dark/dark';
+import './system/dark/dracula';
+import './system/dark/luxury';
+import './system/dark/night';
+import './system/dark/stone';
+
+import './system/dark/synthwave';
+import './system/light/barbie';
+import './system/light/classic';
+import './system/light/cyberpunk';
+import './system/light/light';
+import './system/light/naive';
+import './system/light/winter';

package/src/themes/unocss-utils.ts

@@ -0,0 +1,52 @@
+export type RGBAColorValue = [number, number, number, number] | [number, number, number];
+
+export function hex2rgba(hex = ''): RGBAColorValue | undefined {
+  const color = parseHexColor(hex);
+  if (color != null) {
+    const { components, alpha } = color;
+    if (alpha == null) {
+      return components as [number, number, number];
+    }
+    return [...components, alpha] as [number, number, number, number];
+  }
+}
+
+export interface CSSColorValue {
+  type: string
+  components: (string | number)[]
+  alpha: string | number | undefined
+}
+
+function parseHexColor(str: string): CSSColorValue | undefined {
+  const [, body] = str.match(/^#([\da-f]+)$/i) || [];
+  if (!body) {
+    return;
+  }
+
+  switch (body.length) {
+    case 3:
+    case 4: {
+      const digits = Array.from(body, s => Number.parseInt(s, 16)).map(n => (n << 4) | n);
+      return {
+        type: 'rgb',
+        components: digits.slice(0, 3),
+        alpha: body.length === 3
+          ? undefined
+          : Math.round(digits[3] / 255 * 100) / 100,
+      };
+    }
+
+    case 6:
+    case 8:{
+      const value = Number.parseInt(body, 16);
+      return {
+        type: 'rgb',
+        components: body.length === 6
+          ? [(value >> 16) & 0xFF, (value >> 8) & 0xFF, value & 0xFF]
+          : [(value >> 24) & 0xFF, (value >> 16) & 0xFF, (value >> 8) & 0xFF],
+        alpha: body.length === 6
+          ? undefined
+          : Math.round((value & 0xFF) / 255 * 100) / 100,
+      }; }
+  }
+}

package/src/themes/utils.ts

@@ -0,0 +1,81 @@
+import { hex2rgba } from './unocss-utils';
+
+type CSSColorValue = string;
+type manColor =
+  | 'bg'
+  | 'container-bg'
+  | 'border-color';
+
+type headerColor =
+  | 'header-bg'
+  | 'header-color'
+  | 'header-menu-color'
+  | 'header-menu-hover-bg'
+  | 'header-menu-hover-color'
+  | 'header-menu-active-bg'
+  | 'header-menu-active-color';
+
+type mainSidebarColor =
+  | 'main-sidebar-bg'
+  | 'main-sidebar-menu-color'
+  | 'main-sidebar-menu-hover-bg'
+  | 'main-sidebar-menu-hover-color'
+  | 'main-sidebar-menu-active-bg'
+  | 'main-sidebar-menu-active-color';
+
+type subSidebarColor =
+  | 'sub-sidebar-bg'
+  | 'sub-sidebar-logo-bg'
+  | 'sub-sidebar-logo-color'
+  | 'sub-sidebar-menu-color'
+  | 'sub-sidebar-menu-hover-bg'
+  | 'sub-sidebar-menu-hover-color'
+  | 'sub-sidebar-menu-active-bg'
+  | 'sub-sidebar-menu-active-color';
+
+type tabbarColor =
+  | 'tabbar-dividers-bg'
+  | 'tabbar-tab-color'
+  | 'tabbar-tab-hover-bg'
+  | 'tabbar-tab-hover-color'
+  | 'tabbar-tab-active-color';
+
+type themeScheme = 'light' | 'dark';
+type customColor = typeof customColorKey[number];
+type benchmark = `--g-${manColor | headerColor | mainSidebarColor | subSidebarColor | tabbarColor}`;
+export type cssVarKey = customColor | benchmark;
+
+export type colorScheme = Record<cssVarKey, CSSColorValue> & { 'color-scheme': themeScheme } & { label?: string };
+
+export interface themeOptions {
+  name: string
+  colors: colorScheme
+}
+
+export const customColorKey = ['--ui-primary', '--ui-text'] as const;
+
+export interface globalTheme {
+  [key: string]: colorScheme
+}
+
+let themeColorMap: globalTheme = {};
+
+export function getThemes() {
+  return themeColorMap;
+}
+
+function normalizeColor(colors: colorScheme) {
+  for (const key of customColorKey) {
+    const colorValue = colors[key];
+    colors[key] = hex2rgba(colorValue)!.join(' ');
+  }
+  return colors;
+}
+
+export function defineTheme(theme: themeOptions): globalTheme {
+  const { name, colors } = theme;
+  const colorScheme: globalTheme = Object.create(null);
+  colorScheme[name] = normalizeColor(colors);
+  themeColorMap = Object.assign(themeColorMap, colorScheme);
+  return colorScheme;
+}

package/src/unocss/index.ts

@@ -0,0 +1,61 @@
+import type { globalTheme } from '../themes';
+import {
+  definePreset,
+  presetAttributify,
+  presetIcons,
+  presetTypography,
+  presetUno,
+  transformerDirectives,
+} from 'unocss';
+import { presetThemes } from './presetThemes';
+
+export default definePreset<{ themes?: globalTheme[] }>((options) => {
+  return {
+    name: 'preset-pubinfo',
+    presets: [
+      presetThemes({ themes: options?.themes }),
+      presetUno(),
+      presetAttributify(),
+      presetTypography(),
+      presetIcons({
+        extraProperties: {
+          'display': 'inline-block',
+          'vertical-align': 'middle',
+        },
+      }),
+    ],
+    transformers: [
+      transformerDirectives(),
+    ],
+    shortcuts: [
+      {
+        'flex-center': 'flex justify-center items-center',
+        'flex-col-center': 'flex flex-col justify-center items-center',
+      },
+    ],
+    theme: {
+      colors: {
+        'ui-primary': 'rgb(var(--ui-primary))',
+        'ui-text': 'rgb(var(--ui-text))',
+      },
+      breakpoints: {
+        'sm': '768px',
+        'smd': '1024px',
+        'md': '1366px',
+        'lg': '1440px',
+        'xl': '1600px',
+        '2xl': '1920px',
+      },
+    },
+
+    // TOFIX 此文件中该配置不生效
+    content: {
+      pipeline: {
+        include: [
+          /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/,
+          'src/routes/**/*.ts',
+        ],
+      },
+    },
+  };
+});