@ttoss/ui 1.30.8 → 1.30.10

package/dist/esm/index.js

@@ -417,10 +417,24 @@ var BruttalTheme = {
   },
   forms: {
     label: {
-      "&:has(+ div > input:invalid)": {
+      "&:has(+ div > input.error)": {
         "span > iconify-icon": {
           color: "danger"
         }
+      },
+      '&:has(input[type="checkbox"]:disabled)': {
+        color: "onMuted"
+      }
+    },
+    checkbox: {
+      "input:not(:checked) ~ &": {
+        color: "primary"
+      },
+      "input:disabled ~ &": {
+        color: "muted"
+      },
+      "input:disabled ~ & path": {
+        backgroundColor: "onMuted"
       }
     },
     input: {
@@ -576,7 +590,9 @@ var defaultIconSizeCustomisations = Object.freeze({
   height: null
 });
 var defaultIconCustomisations = Object.freeze({
+  // Dimensions
   ...defaultIconSizeCustomisations,
+  // Transformations
   ...defaultIconTransformations
 });
 function rotateFromString(value, defaultValue = 0) {
@@ -664,6 +680,7 @@ var stringToIcon = (value, validate, allowSimpleName, provider = "") => {
     const name2 = colonSeparated.pop();
     const prefix = colonSeparated.pop();
     const result = {
+      // Allow provider without '@': "provider:prefix:name"
       provider: colonSeparated.length > 0 ? colonSeparated[0] : provider,
       prefix,
       name: name2
@@ -2187,7 +2204,7 @@ for (const prefix in propsToAddTo) {
   }
 }
 function fixSize(value) {
-  return value + (value.match(/^[-0-9.]+$/) ? "px" : "");
+  return value ? value + (value.match(/^[-0-9.]+$/) ? "px" : "") : "inherit";
 }
 function renderSPAN(data, icon, useMask) {
   const node = document.createElement("span");
@@ -2216,7 +2233,18 @@ function renderSPAN(data, icon, useMask) {
 }
 function renderSVG(data) {
   const node = document.createElement("span");
-  node.innerHTML = iconToHTML(data.body, data.attributes);
+  const attr = data.attributes;
+  let style = "";
+  if (!attr.width) {
+    style = "width: inherit;";
+  }
+  if (!attr.height) {
+    style += "height: inherit;";
+  }
+  if (style) {
+    attr.style = style;
+  }
+  node.innerHTML = iconToHTML(data.body, attr);
   return node.firstChild;
 }
 function renderIcon(parent, state) {
@@ -2777,6 +2805,6 @@ iconify-icon/dist/iconify-icon.mjs:
   * Licensed under MIT.
   *
   * @license MIT
-  * @version 1.0.5
+  * @version 1.0.7
   *)
 */

package/dist/index.js

@@ -455,10 +455,24 @@ var BruttalTheme = {
   },
   forms: {
     label: {
-      "&:has(+ div > input:invalid)": {
+      "&:has(+ div > input.error)": {
         "span > iconify-icon": {
           color: "danger"
         }
+      },
+      '&:has(input[type="checkbox"]:disabled)': {
+        color: "onMuted"
+      }
+    },
+    checkbox: {
+      "input:not(:checked) ~ &": {
+        color: "primary"
+      },
+      "input:disabled ~ &": {
+        color: "muted"
+      },
+      "input:disabled ~ & path": {
+        backgroundColor: "onMuted"
       }
     },
     input: {
@@ -612,7 +626,9 @@ var defaultIconSizeCustomisations = Object.freeze({
   height: null
 });
 var defaultIconCustomisations = Object.freeze({
+  // Dimensions
   ...defaultIconSizeCustomisations,
+  // Transformations
   ...defaultIconTransformations
 });
 function rotateFromString(value, defaultValue = 0) {
@@ -700,6 +716,7 @@ var stringToIcon = (value, validate, allowSimpleName, provider = "") => {
     const name2 = colonSeparated.pop();
     const prefix = colonSeparated.pop();
     const result = {
+      // Allow provider without '@': "provider:prefix:name"
       provider: colonSeparated.length > 0 ? colonSeparated[0] : provider,
       prefix,
       name: name2
@@ -2223,7 +2240,7 @@ for (const prefix in propsToAddTo) {
   }
 }
 function fixSize(value) {
-  return value + (value.match(/^[-0-9.]+$/) ? "px" : "");
+  return value ? value + (value.match(/^[-0-9.]+$/) ? "px" : "") : "inherit";
 }
 function renderSPAN(data, icon, useMask) {
   const node = document.createElement("span");
@@ -2252,7 +2269,18 @@ function renderSPAN(data, icon, useMask) {
 }
 function renderSVG(data) {
   const node = document.createElement("span");
-  node.innerHTML = iconToHTML(data.body, data.attributes);
+  const attr = data.attributes;
+  let style = "";
+  if (!attr.width) {
+    style = "width: inherit;";
+  }
+  if (!attr.height) {
+    style += "height: inherit;";
+  }
+  if (style) {
+    attr.style = style;
+  }
+  node.innerHTML = iconToHTML(data.body, attr);
   return node.firstChild;
 }
 function renderIcon(parent, state) {
@@ -2812,6 +2840,6 @@ iconify-icon/dist/iconify-icon.mjs:
   * Licensed under MIT.
   *
   * @license MIT
-  * @version 1.0.5
+  * @version 1.0.7
   *)
 */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/ui",
-  "version": "1.30.8",
+  "version": "1.30.10",
   "description": "Primitive layout, typographic, and other components for styling applications.",
   "license": "UNLICENSED",
   "author": "ttoss",
@@ -32,7 +32,7 @@
     "@iconify-icon/react": "^1.0.5",
     "@ttoss/config": "^1.28.3",
     "@ttoss/test-utils": "^1.20.5",
-    "@ttoss/theme": "^1.2.7",
+    "@ttoss/theme": "^1.2.9",
     "@types/jest": "^29.4.0",
     "jest": "^29.5.0",
     "tsup": "^6.6.3"
@@ -45,5 +45,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "cfce5715810a5f7a5ced96a319d2275779bae92e"
+  "gitHead": "5a7f5a875b4474af9c78bbec65355cde6e6a7c81"
 }