@umami/react-zen 0.50.0 → 0.52.0

package/dist/index.css

@@ -2253,7 +2253,7 @@
 }
 
 /* virtual-css:css:616ae3b49446388ff62e911490fa55d8 */
-.Button_button__NjVkM {
+.Button_button__N2JkN {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2271,85 +2271,85 @@
   cursor: pointer;
   line-height: 1;
 }
-.Button_button__NjVkM:disabled {
+.Button_button__N2JkN:disabled {
   color: var(--font-color-muted);
   pointer-events: none;
 }
-.Button_button__NjVkM:hover {
+.Button_button__N2JkN:hover {
   background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
 }
-.Button_button__NjVkM[data-pressed] {
+.Button_button__N2JkN[data-pressed] {
   background: color-mix(in srgb, var(--input-color), 10% var(--font-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z {
-  color: var(--primary-font-color);
+.Button_button__N2JkN.Button_primary__YjA5Y {
+  color: var(--primary-font-color) !important;
   background: var(--primary-color);
 }
-.Button_button__NjVkM.Button_primary__ODE0Z:hover {
+.Button_button__N2JkN.Button_primary__YjA5Y:hover {
   background: color-mix(in srgb, var(--primary-color), 10% var(--background-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z[data-pressed] {
+.Button_button__N2JkN.Button_primary__YjA5Y[data-pressed] {
   background: color-mix(in srgb, var(--primary-color), 20% var(--background-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z:disabled {
+.Button_button__N2JkN.Button_primary__YjA5Y:disabled {
   color: var(--primary-font-color);
   background: var(--base-color-500);
 }
-.Button_button__NjVkM.Button_outline__YWI2M {
+.Button_button__N2JkN.Button_outline__ZGQwY {
   background: transparent;
   border: var(--border);
   box-shadow: var(--box-shadow-1);
 }
-.Button_button__NjVkM.Button_outline__YWI2M:hover {
-  background: var(--input-color);
+.Button_button__N2JkN.Button_outline__ZGQwY:hover {
+  background: var(--highlight-color);
 }
-.Button_button__NjVkM.Button_outline__YWI2M[data-pressed] {
-  background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
+.Button_button__N2JkN.Button_outline__ZGQwY[data-pressed] {
+  background: color-mix(in srgb, var(--highlight-color), 5% var(--font-color));
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N {
+.Button_button__N2JkN.Button_quiet__OWQ4O {
   background: transparent;
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N:hover {
-  background: var(--input-color);
+.Button_button__N2JkN.Button_quiet__OWQ4O:hover {
+  background: var(--highlight-color);
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N[data-pressed] {
-  background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
+.Button_button__N2JkN.Button_quiet__OWQ4O[data-pressed] {
+  background: color-mix(in srgb, var(--highlight-color), 5% var(--font-color));
 }
-.Button_button__NjVkM.Button_danger__YTliM {
+.Button_button__N2JkN.Button_danger__MzdiN {
   color: var(--light-color);
   background: var(--danger-color);
 }
-.Button_button__NjVkM.Button_danger__YTliM:hover {
+.Button_button__N2JkN.Button_danger__MzdiN:hover {
   background: color-mix(in srgb, var(--danger-color), 6% black);
 }
-.Button_button__NjVkM.Button_danger__YTliM[data-pressed] {
+.Button_button__N2JkN.Button_danger__MzdiN[data-pressed] {
   background: color-mix(in srgb, var(--danger-color), 12% black);
 }
-.Button_button__NjVkM.Button_danger__YTliM:disabled {
+.Button_button__N2JkN.Button_danger__MzdiN:disabled {
   color: var(--primary-font-color);
   background: var(--base-color-500);
 }
-.Button_button__NjVkM.Button_xs__ZjFkY {
+.Button_button__N2JkN.Button_xs__NmJiZ {
   font-size: .8rem;
   padding: 0.5rem 0.75rem;
 }
-.Button_button__NjVkM.Button_sm__OGEyM {
+.Button_button__N2JkN.Button_sm__ZTVhM {
   font-size: .9rem;
   padding: 0.5rem 0.75rem;
 }
-.Button_button__NjVkM.Button_md__OWE1Y {
+.Button_button__N2JkN.Button_md__OWQ4Y {
   font-size: 1rem;
   padding: 0.75rem 1rem;
 }
-.Button_button__NjVkM.Button_lg__NDAzN {
+.Button_button__N2JkN.Button_lg__YzY5N {
   font-size: 1.1rem;
   padding: 1rem 1.25rem;
 }
-.Button_button__NjVkM.Button_xl__ZmJkO {
+.Button_button__N2JkN.Button_xl__ODMyN {
   font-size: 1.3rem;
   padding: 1.25rem 1.5rem;
 }
-body a.Button_button__NjVkM {
+body a.Button_button__N2JkN {
   color: inherit;
   text-decoration: none;
 }

package/dist/index.js

@@ -39405,7 +39405,7 @@ var import_react246 = require("react");
 var import_classnames8 = __toESM(require_classnames());
 
 // css-modules:E:\dev\umami-react-zen\src\components\Button.module.css
-var Button_default = { "button": "Button_button__NjVkM", "primary": "Button_primary__ODE0Z", "outline": "Button_outline__YWI2M", "quiet": "Button_quiet__ZjE5N", "danger": "Button_danger__YTliM", "xs": "Button_xs__ZjFkY", "sm": "Button_sm__OGEyM", "md": "Button_md__OWE1Y", "lg": "Button_lg__NDAzN", "xl": "Button_xl__ZmJkO" };
+var Button_default = { "button": "Button_button__N2JkN", "primary": "Button_primary__YjA5Y", "outline": "Button_outline__ZGQwY", "quiet": "Button_quiet__OWQ4O", "danger": "Button_danger__MzdiN", "xs": "Button_xs__NmJiZ", "sm": "Button_sm__ZTVhM", "md": "Button_md__OWQ4Y", "lg": "Button_lg__YzY5N", "xl": "Button_xl__ODMyN" };
 
 // src/components/Button.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
@@ -43290,7 +43290,7 @@ var initialState2 = {
 var store2 = create(() => ({ ...initialState2 }));
 function setTheme(theme) {
   store2.setState({ theme });
-  document.body.setAttribute("data-theme", theme);
+  document.documentElement.setAttribute("data-theme", theme);
 }
 function useTheme() {
   const { theme } = store2();

package/dist/index.mjs

@@ -39303,7 +39303,7 @@ import { forwardRef as forwardRef2 } from "react";
 var import_classnames8 = __toESM(require_classnames());
 
 // css-modules:E:\dev\umami-react-zen\src\components\Button.module.css
-var Button_default = { "button": "Button_button__NjVkM", "primary": "Button_primary__ODE0Z", "outline": "Button_outline__YWI2M", "quiet": "Button_quiet__ZjE5N", "danger": "Button_danger__YTliM", "xs": "Button_xs__ZjFkY", "sm": "Button_sm__OGEyM", "md": "Button_md__OWE1Y", "lg": "Button_lg__NDAzN", "xl": "Button_xl__ZmJkO" };
+var Button_default = { "button": "Button_button__N2JkN", "primary": "Button_primary__YjA5Y", "outline": "Button_outline__ZGQwY", "quiet": "Button_quiet__OWQ4O", "danger": "Button_danger__MzdiN", "xs": "Button_xs__NmJiZ", "sm": "Button_sm__ZTVhM", "md": "Button_md__OWQ4Y", "lg": "Button_lg__YzY5N", "xl": "Button_xl__ODMyN" };
 
 // src/components/Button.tsx
 import { jsx as jsx11 } from "react/jsx-runtime";
@@ -43188,7 +43188,7 @@ var initialState2 = {
 var store2 = create(() => ({ ...initialState2 }));
 function setTheme(theme) {
   store2.setState({ theme });
-  document.body.setAttribute("data-theme", theme);
+  document.documentElement.setAttribute("data-theme", theme);
 }
 function useTheme() {
   const { theme } = store2();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umami/react-zen",
-  "version": "0.50.0",
+  "version": "0.52.0",
   "description": "React components built by Umami",
   "author": "Umami <hello@umami.is>",
   "license": "MIT",
@@ -48,7 +48,6 @@
     "@fontsource/jetbrains-mono": "^5.0.18",
     "@react-spring/web": "^9.7.5",
     "classnames": "^2.5.1",
-    "dts-bundle": "^0.7.3",
     "glob": "^11.0.1",
     "next": "15.1.3",
     "react": "^19.0.0",
@@ -75,6 +74,7 @@
     "@umami/shiso": "^0.39.0",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-syntax-hermes-parser": "^0.26.0",
+    "dts-bundle": "^0.7.3",
     "esbuild": "^0.24.2",
     "esbuild-css-modules-plugin": "^3.1.2",
     "esbuild-plugin-svgr": "^3.1.0",

package/styles.css

@@ -172,30 +172,30 @@
 
   --highlight-color: var(--base-color-50);
   --highlight-font-color: var(--font-color);
+}
 
-  [data-theme='dark'] {
-    --background-color: #0f0f0f;
+html[data-theme='dark'] {
+  --background-color: #0f0f0f;
 
-    --font-color: var(--base-color-200);
-    --font-color-muted: var(--base-color-400);
-    --font-color-disabled: var(--base-color-500);
+  --font-color: var(--base-color-200);
+  --font-color-muted: var(--base-color-400);
+  --font-color-disabled: var(--base-color-500);
 
-    --border-color: var(--base-color-700);
-    --border: var(--border-width) solid var(--border-color);
+  --border-color: var(--base-color-700);
+  --border: var(--border-width) solid var(--border-color);
 
-    --outline-color: var(--base-color-600);
-    --outline: var(--border-width) solid var(--outline-color);
+  --outline-color: var(--base-color-600);
+  --outline: var(--border-width) solid var(--outline-color);
 
-    --primary-color: var(--base-color-50);
-    --primary-font-color: var(--base-color-900);
+  --primary-color: var(--base-color-50);
+  --primary-font-color: var(--base-color-900);
 
-    --input-color: var(--base-color-700);
-    --input-font-color: var(--font-color);
-    --input-disabled-color: var(--base-color-800);
+  --input-color: var(--base-color-700);
+  --input-font-color: var(--font-color);
+  --input-disabled-color: var(--base-color-800);
 
-    --highlight-color: var(--base-color-800);
-    --highlight-font-color: var(--font-color);
-  }
+  --highlight-color: var(--base-color-800);
+  --highlight-font-color: var(--font-color);
 }
 
 *, *::before, *::after {
@@ -2521,7 +2521,7 @@ li {
 }
 
 /* virtual-css:css:616ae3b49446388ff62e911490fa55d8 */
-.Button_button__NjVkM {
+.Button_button__N2JkN {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -2539,85 +2539,85 @@ li {
   cursor: pointer;
   line-height: 1;
 }
-.Button_button__NjVkM:disabled {
+.Button_button__N2JkN:disabled {
   color: var(--font-color-muted);
   pointer-events: none;
 }
-.Button_button__NjVkM:hover {
+.Button_button__N2JkN:hover {
   background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
 }
-.Button_button__NjVkM[data-pressed] {
+.Button_button__N2JkN[data-pressed] {
   background: color-mix(in srgb, var(--input-color), 10% var(--font-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z {
-  color: var(--primary-font-color);
+.Button_button__N2JkN.Button_primary__YjA5Y {
+  color: var(--primary-font-color) !important;
   background: var(--primary-color);
 }
-.Button_button__NjVkM.Button_primary__ODE0Z:hover {
+.Button_button__N2JkN.Button_primary__YjA5Y:hover {
   background: color-mix(in srgb, var(--primary-color), 10% var(--background-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z[data-pressed] {
+.Button_button__N2JkN.Button_primary__YjA5Y[data-pressed] {
   background: color-mix(in srgb, var(--primary-color), 20% var(--background-color));
 }
-.Button_button__NjVkM.Button_primary__ODE0Z:disabled {
+.Button_button__N2JkN.Button_primary__YjA5Y:disabled {
   color: var(--primary-font-color);
   background: var(--base-color-500);
 }
-.Button_button__NjVkM.Button_outline__YWI2M {
+.Button_button__N2JkN.Button_outline__ZGQwY {
   background: transparent;
   border: var(--border);
   box-shadow: var(--box-shadow-1);
 }
-.Button_button__NjVkM.Button_outline__YWI2M:hover {
-  background: var(--input-color);
+.Button_button__N2JkN.Button_outline__ZGQwY:hover {
+  background: var(--highlight-color);
 }
-.Button_button__NjVkM.Button_outline__YWI2M[data-pressed] {
-  background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
+.Button_button__N2JkN.Button_outline__ZGQwY[data-pressed] {
+  background: color-mix(in srgb, var(--highlight-color), 5% var(--font-color));
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N {
+.Button_button__N2JkN.Button_quiet__OWQ4O {
   background: transparent;
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N:hover {
-  background: var(--input-color);
+.Button_button__N2JkN.Button_quiet__OWQ4O:hover {
+  background: var(--highlight-color);
 }
-.Button_button__NjVkM.Button_quiet__ZjE5N[data-pressed] {
-  background: color-mix(in srgb, var(--input-color), 5% var(--font-color));
+.Button_button__N2JkN.Button_quiet__OWQ4O[data-pressed] {
+  background: color-mix(in srgb, var(--highlight-color), 5% var(--font-color));
 }
-.Button_button__NjVkM.Button_danger__YTliM {
+.Button_button__N2JkN.Button_danger__MzdiN {
   color: var(--light-color);
   background: var(--danger-color);
 }
-.Button_button__NjVkM.Button_danger__YTliM:hover {
+.Button_button__N2JkN.Button_danger__MzdiN:hover {
   background: color-mix(in srgb, var(--danger-color), 6% black);
 }
-.Button_button__NjVkM.Button_danger__YTliM[data-pressed] {
+.Button_button__N2JkN.Button_danger__MzdiN[data-pressed] {
   background: color-mix(in srgb, var(--danger-color), 12% black);
 }
-.Button_button__NjVkM.Button_danger__YTliM:disabled {
+.Button_button__N2JkN.Button_danger__MzdiN:disabled {
   color: var(--primary-font-color);
   background: var(--base-color-500);
 }
-.Button_button__NjVkM.Button_xs__ZjFkY {
+.Button_button__N2JkN.Button_xs__NmJiZ {
   font-size: .8rem;
   padding: 0.5rem 0.75rem;
 }
-.Button_button__NjVkM.Button_sm__OGEyM {
+.Button_button__N2JkN.Button_sm__ZTVhM {
   font-size: .9rem;
   padding: 0.5rem 0.75rem;
 }
-.Button_button__NjVkM.Button_md__OWE1Y {
+.Button_button__N2JkN.Button_md__OWQ4Y {
   font-size: 1rem;
   padding: 0.75rem 1rem;
 }
-.Button_button__NjVkM.Button_lg__NDAzN {
+.Button_button__N2JkN.Button_lg__YzY5N {
   font-size: 1.1rem;
   padding: 1rem 1.25rem;
 }
-.Button_button__NjVkM.Button_xl__ZmJkO {
+.Button_button__N2JkN.Button_xl__ODMyN {
   font-size: 1.3rem;
   padding: 1.25rem 1.5rem;
 }
-body a.Button_button__NjVkM {
+body a.Button_button__N2JkN {
   color: inherit;
   text-decoration: none;
 }