@varlet/ui 3.10.8 → 3.10.9

package/highlight/web-types.en-US.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
-  "version": "3.10.8",
+  "version": "3.10.9",
   "name": "VARLET",
   "contributions": {
     "html": {

package/highlight/web-types.zh-CN.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
-  "version": "3.10.8",
+  "version": "3.10.9",
   "name": "VARLET",
   "contributions": {
     "html": {

package/lib/varlet.cjs.js

@@ -27146,6 +27146,12 @@ withInstall(stdin_default$3i);
 withPropsDefaultsSetter(stdin_default$3i, props$3);
 const _TabsItemsComponent = stdin_default$3i;
 var stdin_default$3h = stdin_default$3i;
+function convert(theme, converter) {
+  return Object.entries(theme).reduce((target, [key3, value]) => {
+    target[key3] = value.includes("px") ? value.replace(/(\d+(\.\d+)?)px/g, (_, p1) => converter(p1)) : value;
+    return target;
+  }, {});
+}
 var stdin_default$3g = {
   "--action-sheet-background": "var(--color-surface-container-low)",
   "--action-sheet-title-color": "#aaa",
@@ -30259,17 +30265,15 @@ var stdin_default$8 = __spreadValues$1(__spreadValues$1(__spreadValues$1(__sprea
   "--shadow-key-penumbra-opacity": "rgba(0, 0, 0, 0.14)",
   "--shadow-key-ambient-opacity": "rgba(0, 0, 0, 0.12)"
 }, stdin_default$10), stdin_default$19), stdin_default$M), stdin_default$D), stdin_default$B), stdin_default$C), stdin_default$Q), stdin_default$11), stdin_default$H), stdin_default$_), stdin_default$x), stdin_default$17), stdin_default$P), stdin_default$Z), stdin_default$s), stdin_default$$), stdin_default$Y), stdin_default$b), stdin_default$d), stdin_default$f), stdin_default$e), stdin_default$W), stdin_default$q), stdin_default$13), stdin_default$12), stdin_default$k), stdin_default$1a), stdin_default$S), stdin_default$t), stdin_default$v), stdin_default$w), stdin_default$O), stdin_default$15), stdin_default$o), stdin_default$A), stdin_default$l), stdin_default$a), stdin_default$c), stdin_default$T), stdin_default$g), stdin_default$r), stdin_default$16), stdin_default$14), stdin_default$V), stdin_default$U), stdin_default$R), stdin_default$N), stdin_default$L), stdin_default$K), stdin_default$J), stdin_default$I), stdin_default$G), stdin_default$F), stdin_default$E), stdin_default$z), stdin_default$y), stdin_default$u), stdin_default$p), stdin_default$m), stdin_default$j), stdin_default$i), stdin_default$h), stdin_default$9), stdin_default$18), stdin_default$X), stdin_default$n);
+function toRem(theme, options = {}) {
+  const { rootFontSize = 16, unitPrecision = 6 } = options;
+  return convert(theme, (value) => `${Number((value / rootFontSize).toFixed(unitPrecision))}rem`);
+}
 function toViewport(theme, options = {}) {
   const { viewportWidth = 375, viewportUnit = "vmin", unitPrecision = 6 } = options;
-  return Object.entries(theme).reduce((target, [key3, value]) => {
-    target[key3] = value.includes("px") ? value.replace(
-      /(\d+(\.\d+)?)px/g,
-      (_, p1) => `${Number((p1 / viewportWidth * 100).toFixed(unitPrecision))}${viewportUnit}`
-    ) : value;
-    return target;
-  }, {});
+  return convert(theme, (value) => `${Number((value / viewportWidth * 100).toFixed(unitPrecision))}${viewportUnit}`);
 }
-const Themes = { dark: stdin_default$2e, md3Light: stdin_default$8, md3Dark: stdin_default$1b, toViewport };
+const Themes = { dark: stdin_default$2e, md3Light: stdin_default$8, md3Dark: stdin_default$1b, toViewport, toRem, convert };
 const _ThemesComponent = null;
 var stdin_default$7 = Themes;
 const hoursAmpm = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
@@ -32023,7 +32027,7 @@ withInstall(stdin_default$1);
 withPropsDefaultsSetter(stdin_default$1, props);
 const _WatermarkComponent = stdin_default$1;
 var stdin_default = stdin_default$1;
-const version = "3.10.8";
+const version = "3.10.9";
 function install(app) {
   stdin_default$60.install && app.use(stdin_default$60);
   stdin_default$5_.install && app.use(stdin_default$5_);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "3.10.8",
+  "version": "3.10.9",
   "description": "A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.",
   "keywords": [
     "Vue3",
@@ -44,9 +44,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/icons": "3.10.8",
-    "@varlet/shared": "3.10.8",
-    "@varlet/use": "3.10.8"
+    "@varlet/icons": "3.10.9",
+    "@varlet/use": "3.10.9",
+    "@varlet/shared": "3.10.9"
   },
   "devDependencies": {
     "@types/node": "^18.7.20",
@@ -62,9 +62,9 @@
     "vue": "3.5.13",
     "vue-router": "4.5.0",
     "zod": "^3.23.8",
-    "@varlet/cli": "3.10.8",
-    "@varlet/ui": "3.10.8",
-    "@varlet/touch-emulator": "3.10.8"
+    "@varlet/cli": "3.10.9",
+    "@varlet/ui": "3.10.9",
+    "@varlet/touch-emulator": "3.10.9"
   },
   "peerDependencies": {
     "vue": "^3.2.0"

package/types/themes.d.ts

@@ -6,12 +6,19 @@ export interface ThemesToViewportOptions {
   unitPrecision?: number
 }
 
+export interface ThemesToRemOptions {
+  rootFontSize?: number
+  unitPrecision?: number
+}
+
 interface Themes {
   dark: StyleVars
   md3Light: StyleVars
   md3Dark: StyleVars
 
+  convert(theme: StyleVars, converter: (value: number) => string): StyleVars
   toViewport(theme: StyleVars, options?: ThemesToViewportOptions): StyleVars
+  toRem(theme: StyleVars, options?: ThemesToRemOptions): StyleVars
 }
 
 export declare const Themes: Themes