@lytjs/plugin-theme 4.0.5 → 4.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1 -1
- package/dist/types/index.d.ts +71 -0
- package/dist/types/index.d.ts.map +1 -0
- package/package.json +8 -6
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
var p=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.prototype.hasOwnProperty;var z=(i,n)=>{for(var l in n)p(i,l,{get:n[l],enumerable:!0})},B=(i,n,l,f)=>{if(n&&typeof n=="object"||typeof n=="function")for(let g of K(n))!Q.call(i,g)&&g!==l&&p(i,g,{get:()=>n[g],enumerable:!(f=H(n,g))||f.enumerable});return i};var R=i=>B(p({},"__esModule",{value:!0}),i);var G={};z(G,{BUILT_IN_THEMES:()=>$,createTheme:()=>q});module.exports=R(G);var $={light:{"--bg":"#ffffff","--bg-secondary":"#f5f5f5","--text":"#333333","--text-secondary":"#666666","--text-muted":"#999999","--primary":"#42b883","--primary-hover":"#3aa876","--secondary":"#35495e","--success":"#10b981","--warning":"#f59e0b","--error":"#ef4444","--info":"#3b82f6","--border":"#e5e7eb","--shadow":"rgba(0, 0, 0, 0.1)"},dark:{"--bg":"#1a1a1a","--bg-secondary":"#2d2d2d","--text":"#e5e5e5","--text-secondary":"#a3a3a3","--text-muted":"#737373","--primary":"#42b883","--primary-hover":"#3aa876","--secondary":"#94a3b8","--success":"#10b981","--warning":"#f59e0b","--error":"#ef4444","--info":"#3b82f6","--border":"#404040","--shadow":"rgba(0, 0, 0, 0.3)"}};function y(){return document.documentElement}function U(i){return(...n)=>{}}function q(i={}){let{default:n="light",storageKey:l="lyt_theme",themes:f={},onChange:g,autoDetect:w=!0,useDataAttribute:C=!0,cssPrefix:h="--lyt-",debug:x=!1}=i,o=U(x),s={...$,...f},a=n,d={};function k(){try{let e=localStorage.getItem(l);if(e&&s[e])return e}catch(e){}return null}function E(e){try{localStorage.setItem(l,e)}catch(t){}}function P(){var e;return typeof window=="undefined"?"light":(e=window.matchMedia)!=null&&e.call(window,"(prefers-color-scheme: dark)").matches?"dark":"light"}function V(e){if(typeof window=="undefined"||!window.matchMedia)return()=>{};let t=window.matchMedia("(prefers-color-scheme: dark)");function r(c){e(c.matches?"dark":"light")}return t.addEventListener("change",r),()=>t.removeEventListener("change",r)}function u(e){let t=y(),r=s[e];if(!r){o(`theme '${e}' not found`);return}o(`applying theme '${e}'`,r),Object.entries(r).forEach(([c,v])=>{let T=c.startsWith("--")?c:`${h}${c}`;t.style.setProperty(T,v)}),Object.entries(d).forEach(([c,v])=>{let T=c.startsWith("--")?c:`${h}${c}`;t.style.setProperty(T,v)}),C&&t.setAttribute("data-theme",e),t.style.setProperty("color-scheme",e==="dark"?"dark":"light")}function m(e){if(!s[e]){o(`theme '${e}' not found, available:`,Object.keys(s));return}let t=a;t!==e&&(a=e,u(e),E(e),g&&g(e,t),o(`theme changed from '${t}' to '${e}'`))}function O(){let e=Object.keys(s),r=(e.indexOf(a)+1)%e.length;m(e[r])}function S(){m(n)}function j(){return Object.keys(s)}function I(e,t){s[e]=t,o(`added/updated theme '${e}'`,t),a===e&&u(e)}function L(e){if(e===n){o("cannot remove default theme");return}delete s[e],a===e&&m(n),o(`removed theme '${e}'`)}function M(){return s[a]||null}function D(e){return s[e]||null}function W(e,t){let r=e.startsWith("--")?e:`${h}${e}`;d[r]=t,y().style.setProperty(r,t),o(`set variable '${r}' = '${t}'`)}function _(e){let t=e.startsWith("--")?e:`${h}${e}`;delete d[t],y().style.removeProperty(t),o(`cleared variable '${t}'`)}function A(){Object.keys(d).forEach(e=>{y().style.removeProperty(e)}),Object.keys(d).forEach(e=>delete d[e]),u(a),o("cleared all dynamic variables")}function F(){let e=k();if(!e&&w){let t=P();e=s[t]?t:n}e||(e=n),o(`initializing with theme '${e}'`),a=e,u(e)}F();let b={install(e,t){e.config=e.config||{},e.config.globalProperties=e.config.globalProperties||{},e.config.globalProperties.$theme=b,typeof e.provide=="function"&&e.provide("theme",b)},get current(){return a},set:m,toggle:O,reset:S,list:j,addTheme:I,removeTheme:L,getConfig:M,getConfigFor:D,setVariable:W,clearVariable:_,clearVariables:A,getSystemPreference:P,watchSystemPreference:V};return b}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/** 主题配置 */
|
|
2
|
+
interface ThemeConfig {
|
|
3
|
+
/** CSS 变量键值对 */
|
|
4
|
+
[key: string]: string;
|
|
5
|
+
}
|
|
6
|
+
/** 主题插件配置选项 */
|
|
7
|
+
interface ThemeOptions {
|
|
8
|
+
/** 默认主题，默认 'light' */
|
|
9
|
+
default?: string;
|
|
10
|
+
/** localStorage 中存储主题的 key，默认 'lyt_theme' */
|
|
11
|
+
storageKey?: string;
|
|
12
|
+
/** 主题配置对象 */
|
|
13
|
+
themes?: {
|
|
14
|
+
[themeName: string]: ThemeConfig;
|
|
15
|
+
};
|
|
16
|
+
/** 主题切换时的回调 */
|
|
17
|
+
onChange?: (newTheme: string, oldTheme: string) => void;
|
|
18
|
+
/** 是否自动检测系统主题偏好 */
|
|
19
|
+
autoDetect?: boolean;
|
|
20
|
+
/** 是否添加 data-theme 属性到 html 标签 */
|
|
21
|
+
useDataAttribute?: boolean;
|
|
22
|
+
/** 自定义 CSS 变量前缀，默认 '--lyt-' */
|
|
23
|
+
cssPrefix?: string;
|
|
24
|
+
/** 是否开启调试模式 */
|
|
25
|
+
debug?: boolean;
|
|
26
|
+
}
|
|
27
|
+
/** 主题插件实例 */
|
|
28
|
+
interface ThemePlugin {
|
|
29
|
+
/** 安装到 Lyt 应用 */
|
|
30
|
+
install: (app: any, options?: any) => void;
|
|
31
|
+
/** 当前主题名称 */
|
|
32
|
+
readonly current: string;
|
|
33
|
+
/** 切换到指定主题 */
|
|
34
|
+
set(themeName: string): void;
|
|
35
|
+
/** 切换主题（在预设主题间循环） */
|
|
36
|
+
toggle(): void;
|
|
37
|
+
/** 重置为默认主题 */
|
|
38
|
+
reset(): void;
|
|
39
|
+
/** 获取所有可用主题列表 */
|
|
40
|
+
list(): string[];
|
|
41
|
+
/** 动态添加/更新主题 */
|
|
42
|
+
addTheme(name: string, config: ThemeConfig): void;
|
|
43
|
+
/** 移除主题 */
|
|
44
|
+
removeTheme(name: string): void;
|
|
45
|
+
/** 获取当前主题的 CSS 变量配置 */
|
|
46
|
+
getConfig(): ThemeConfig | null;
|
|
47
|
+
/** 获取指定主题的 CSS 变量配置 */
|
|
48
|
+
getConfigFor(themeName: string): ThemeConfig | null;
|
|
49
|
+
/** 动态设置 CSS 变量（不保存到持久化） */
|
|
50
|
+
setVariable(key: string, value: string): void;
|
|
51
|
+
/** 清除动态设置的 CSS 变量 */
|
|
52
|
+
clearVariable(key: string): void;
|
|
53
|
+
/** 清除所有动态变量 */
|
|
54
|
+
clearVariables(): void;
|
|
55
|
+
/** 获取系统偏好主题（'light' 或 'dark'） */
|
|
56
|
+
getSystemPreference(): 'light' | 'dark';
|
|
57
|
+
/** 监听系统主题变化 */
|
|
58
|
+
watchSystemPreference(callback: (theme: 'light' | 'dark') => void): () => void;
|
|
59
|
+
}
|
|
60
|
+
declare const BUILT_IN_THEMES: {
|
|
61
|
+
[key: string]: ThemeConfig;
|
|
62
|
+
};
|
|
63
|
+
/**
|
|
64
|
+
* 创建主题切换插件实例
|
|
65
|
+
* @param options 主题配置
|
|
66
|
+
* @returns ThemePlugin 插件实例
|
|
67
|
+
*/
|
|
68
|
+
declare function createTheme(options?: ThemeOptions): ThemePlugin;
|
|
69
|
+
export { createTheme, BUILT_IN_THEMES };
|
|
70
|
+
export type { ThemeOptions, ThemePlugin, ThemeConfig };
|
|
71
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAmBA,WAAW;AACX,UAAU,WAAW;IACnB,gBAAgB;IAChB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CACtB;AAED,eAAe;AACf,UAAU,YAAY;IACpB,sBAAsB;IACtB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa;IACb,MAAM,CAAC,EAAE;QACP,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;KACjC,CAAA;IACD,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,mBAAmB;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,kCAAkC;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,aAAa;AACb,UAAU,WAAW;IACnB,iBAAiB;IACjB,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,IAAI,CAAA;IAC1C,aAAa;IACb,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,cAAc;IACd,GAAG,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,qBAAqB;IACrB,MAAM,IAAI,IAAI,CAAA;IACd,cAAc;IACd,KAAK,IAAI,IAAI,CAAA;IACb,iBAAiB;IACjB,IAAI,IAAI,MAAM,EAAE,CAAA;IAChB,gBAAgB;IAChB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,GAAG,IAAI,CAAA;IACjD,WAAW;IACX,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,uBAAuB;IACvB,SAAS,IAAI,WAAW,GAAG,IAAI,CAAA;IAC/B,uBAAuB;IACvB,YAAY,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAA;IACnD,2BAA2B;IAC3B,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7C,qBAAqB;IACrB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;IAChC,eAAe;IACf,cAAc,IAAI,IAAI,CAAA;IACtB,iCAAiC;IACjC,mBAAmB,IAAI,OAAO,GAAG,MAAM,CAAA;IACvC,eAAe;IACf,qBAAqB,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,KAAK,IAAI,GAAG,MAAM,IAAI,CAAA;CAC/E;AAID,QAAA,MAAM,eAAe,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAA;CAiClD,CAAA;AAwBD;;;;GAIG;AACH,iBAAS,WAAW,CAAC,OAAO,GAAE,YAAiB,GAAG,WAAW,CAuS5D;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAA;AACvC,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lytjs/plugin-theme",
|
|
3
|
-
"version": "4.0
|
|
3
|
+
"version": "4.2.0",
|
|
4
4
|
"description": "Lyt.js 主题切换插件 - 支持亮色/暗色主题和自定义主题",
|
|
5
|
-
"main": "./
|
|
6
|
-
"module": "./
|
|
5
|
+
"main": "./dist/index.cjs",
|
|
6
|
+
"module": "./dist/index.mjs",
|
|
7
|
+
"types": "./dist/types/index.d.ts",
|
|
7
8
|
"exports": {
|
|
8
9
|
".": {
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"types": "./dist/types/index.d.ts",
|
|
11
|
+
"import": "./dist/index.mjs",
|
|
12
|
+
"require": "./dist/index.cjs",
|
|
13
|
+
"default": "./dist/index.mjs"
|
|
12
14
|
}
|
|
13
15
|
},
|
|
14
16
|
"sideEffects": false,
|