@varlet/ui 3.0.1 → 3.0.2

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.0.1",
+  "version": "3.0.2",
   "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.0.1",
+  "version": "3.0.2",
   "name": "VARLET",
   "contributions": {
     "html": {

package/lib/varlet.cjs.js

@@ -26008,7 +26008,17 @@ 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$17), stdin_default$16), stdin_default$15), stdin_default$14), stdin_default$13), stdin_default$12), stdin_default$11), stdin_default$10), stdin_default$$), stdin_default$_), stdin_default$Z), stdin_default$Y), stdin_default$X), stdin_default$W), stdin_default$V), stdin_default$U), stdin_default$T), stdin_default$S), stdin_default$R), stdin_default$Q), stdin_default$P), stdin_default$O), stdin_default$N), stdin_default$M), stdin_default$L), stdin_default$K), stdin_default$J), stdin_default$I), stdin_default$H), stdin_default$G), stdin_default$F), stdin_default$E), stdin_default$D), stdin_default$C), stdin_default$B), stdin_default$A), stdin_default$z), stdin_default$y), stdin_default$x), stdin_default$w), stdin_default$v), stdin_default$u), stdin_default$t), stdin_default$s), stdin_default$r), stdin_default$q), stdin_default$p), stdin_default$o), stdin_default$n), stdin_default$m), stdin_default$l), stdin_default$k), stdin_default$j), stdin_default$i), stdin_default$h), stdin_default$g), stdin_default$f), stdin_default$e), stdin_default$d), stdin_default$c), stdin_default$b), stdin_default$a), stdin_default$9);
-const Themes = { dark: stdin_default$28, md3Light: stdin_default$18, md3Dark: stdin_default$8 };
+function toViewport(theme, options = {}) {
+  const { viewportWidth = 375, viewportUnit = "vmin", unitPrecision = 6 } = options;
+  return Object.entries(theme).reduce((target, [key, value]) => {
+    target[key] = value.includes("px") ? value.replace(
+      /(\d+(\.\d+)?)px/g,
+      (_, p1) => `${Number((p1 / viewportWidth * 100).toFixed(unitPrecision))}${viewportUnit}`
+    ) : value;
+    return target;
+  }, {});
+}
+const Themes = { dark: stdin_default$28, md3Light: stdin_default$18, md3Dark: stdin_default$8, toViewport };
 const _ThemesComponent = null;
 var stdin_default$7 = Themes;
 const hoursAmpm = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
@@ -27693,7 +27703,7 @@ withInstall(stdin_default$1);
 withPropsDefaultsSetter(stdin_default$1, props);
 const _WatermarkComponent = stdin_default$1;
 var stdin_default = stdin_default$1;
-const version = "3.0.1";
+const version = "3.0.2";
 function install(app) {
   stdin_default$5H.install && app.use(stdin_default$5H);
   stdin_default$5F.install && app.use(stdin_default$5F);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "A material like components library",
   "main": "lib/varlet.cjs.js",
   "module": "es/index.mjs",
@@ -48,9 +48,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/icons": "3.0.1",
-    "@varlet/shared": "3.0.1",
-    "@varlet/use": "3.0.1"
+    "@varlet/icons": "3.0.2",
+    "@varlet/shared": "3.0.2",
+    "@varlet/use": "3.0.2"
   },
   "devDependencies": {
     "@vue/runtime-core": "3.4.15",
@@ -66,9 +66,9 @@
     "typescript": "^5.1.5",
     "vue": "3.4.15",
     "vue-router": "4.2.0",
-    "@varlet/cli": "3.0.1",
-    "@varlet/ui": "3.0.1",
-    "@varlet/touch-emulator": "3.0.1"
+    "@varlet/cli": "3.0.2",
+    "@varlet/ui": "3.0.2",
+    "@varlet/touch-emulator": "3.0.2"
   },
   "scripts": {
     "dev": "varlet-cli dev",

package/types/themes.d.ts

@@ -1,9 +1,17 @@
 import { StyleVars } from './styleProvider'
 
+export interface ThemesToViewportOptions {
+  viewportWidth?: number
+  viewportUnit?: string
+  unitPrecision?: number
+}
+
 interface Themes {
   dark: StyleVars
   md3Light: StyleVars
   md3Dark: StyleVars
+
+  toViewport(theme: StyleVars, options?: ThemesToViewportOptions): StyleVars
 }
 
 export declare const Themes: Themes