@varlet/cli 2.16.0-alpha.1693855048345 → 2.16.0

package/lib/client/index.d.ts

@@ -1,4 +1,5 @@
 import AppType from './appType';
+import { StyleProvider } from '@varlet/ui';
 interface PCLocationInfo {
     language: string;
     menuName: string;
@@ -6,7 +7,6 @@ interface PCLocationInfo {
 }
 export type Theme = 'lightTheme' | 'darkTheme';
 export type StyleVars = Record<string, string>;
-export declare function StyleProvider(styleVars?: StyleVars | null): void;
 export declare function getPCLocationInfo(): PCLocationInfo;
 export declare function getBrowserTheme(): Theme;
 export declare function watchLang(cb: (lang: string) => void, platform?: 'pc' | 'mobile'): void;
@@ -16,4 +16,4 @@ export declare function useRouteListener(cb: () => void): void;
 export declare function watchDarkMode(dark: StyleVars, cb?: (theme: Theme) => void): void;
 export declare function setColorScheme(theme: Theme): void;
 export declare function watchTheme(cb: (theme: Theme, from: 'pc' | 'mobile' | 'default' | 'playground') => void, shouldUnmount?: boolean): void;
-export { AppType };
+export { AppType, StyleProvider };

package/lib/client/index.js

@@ -1,25 +1,8 @@
 import config from '@config';
 import AppType from './appType';
+import { Themes, StyleProvider } from '@varlet/ui';
 import { onMounted, onUnmounted } from 'vue';
-import { kebabCase } from '@varlet/shared';
 import { get } from 'lodash-es';
-const mountedVarKeys = [];
-function formatStyleVars(styleVars) {
-    return Object.entries(styleVars !== null && styleVars !== void 0 ? styleVars : {}).reduce((styles, [key, value]) => {
-        const cssVar = key.startsWith('--') ? key : `--${kebabCase(key)}`;
-        styles[cssVar] = value;
-        return styles;
-    }, {});
-}
-export function StyleProvider(styleVars = {}) {
-    mountedVarKeys.forEach((key) => document.documentElement.style.removeProperty(key));
-    mountedVarKeys.length = 0;
-    const styles = formatStyleVars(styleVars);
-    Object.entries(styles).forEach(([key, value]) => {
-        document.documentElement.style.setProperty(key, value);
-        mountedVarKeys.push(key);
-    });
-}
 export function getPCLocationInfo() {
     var _a;
     const [, language, path] = window.location.hash.split('/');
@@ -87,7 +70,7 @@ export function useRouteListener(cb) {
 export function watchDarkMode(dark, cb) {
     watchTheme((theme) => {
         const siteStyleVars = withSiteConfigNamespace(get(config, theme, {}));
-        const darkStyleVars = Object.assign(Object.assign({}, siteStyleVars), dark);
+        const darkStyleVars = Object.assign(Object.assign(Object.assign({}, siteStyleVars), Themes.dark), dark);
         StyleProvider(theme === 'darkTheme' ? darkStyleVars : siteStyleVars);
         setColorScheme(theme);
         cb === null || cb === void 0 ? void 0 : cb(theme);
@@ -111,4 +94,4 @@ export function watchTheme(cb, shouldUnmount = true) {
     }
     cb(getBrowserTheme(), 'default');
 }
-export { AppType };
+export { AppType, StyleProvider };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/cli",
-  "version": "2.16.0-alpha.1693855048345",
+  "version": "2.16.0",
   "type": "module",
   "description": "cli of varlet",
   "bin": {
@@ -67,8 +67,8 @@
     "vite": "4.3.5",
     "vue": "3.3.4",
     "webfont": "^9.0.0",
-    "@varlet/shared": "2.16.0-alpha.1693855048345",
-    "@varlet/vite-plugins": "2.16.0-alpha.1693855048345"
+    "@varlet/shared": "2.16.0",
+    "@varlet/vite-plugins": "2.16.0"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.1",
@@ -83,9 +83,9 @@
     "@types/semver": "^7.3.9",
     "@types/sharp": "0.31.1",
     "rimraf": "^5.0.1",
-    "@varlet/icons": "2.16.0-alpha.1693855048345",
-    "@varlet/ui": "2.16.0-alpha.1693855048345",
-    "@varlet/touch-emulator": "2.16.0-alpha.1693855048345"
+    "@varlet/ui": "2.16.0",
+    "@varlet/icons": "2.16.0",
+    "@varlet/touch-emulator": "2.16.0"
   },
   "peerDependencies": {
     "@vue/runtime-core": "3.3.4",
@@ -98,8 +98,9 @@
     "lodash-es": "^4.17.21",
     "vue": "3.3.4",
     "vue-router": "4.2.0",
-    "@varlet/icons": "2.16.0-alpha.1693855048345",
-    "@varlet/touch-emulator": "2.16.0-alpha.1693855048345"
+    "@varlet/icons": "2.16.0",
+    "@varlet/touch-emulator": "2.16.0",
+    "@varlet/ui": "2.16.0"
   },
   "scripts": {
     "dev": "tsc --watch",

package/site/mobile/App.vue

@@ -149,16 +149,15 @@ export default defineComponent({
     }
 
     const toggleTheme = () => {
-        setCurrentTheme(currentTheme.value === 'darkTheme' ? 'lightTheme' : 'darkTheme')
-        window.postMessage(getThemeMessage(), '*')
+      setCurrentTheme(currentTheme.value === 'darkTheme' ? 'lightTheme' : 'darkTheme')
+      window.postMessage(getThemeMessage(), '*')
 
-        if (!isPhone() && inIframe()) {
-          ;(window.top as any).postMessage(getThemeMessage(), '*')
-        }
+      if (!isPhone() && inIframe()) {
+        ;(window.top as any).postMessage(getThemeMessage(), '*')
       }
+    }
 
     ;(window as any).toggleTheme = toggleTheme
-
     setTheme(config, currentTheme.value)
     window.postMessage(getThemeMessage(), '*')
 

package/site/utils.ts

@@ -1,4 +1,5 @@
 import { get } from 'lodash-es'
+import { Themes } from '@varlet/ui'
 import { StyleProvider, type Theme, withSiteConfigNamespace, setColorScheme } from '@varlet/cli/client'
 
 export interface Menu {
@@ -32,8 +33,7 @@ export function inIframe() {
 
 export function setTheme(config: Record<string, any>, theme: Theme) {
   const styleVars = withSiteConfigNamespace(get(config, theme, {}))
-
-  StyleProvider(styleVars)
+  StyleProvider({ ...styleVars, ...(theme === 'darkTheme' ? Themes.dark : {}) })
   setColorScheme(theme)
 }