@ttoss/theme 1.4.13 → 1.4.15

package/dist/esm/{chunk-STTOSDFS.js → chunk-NYJWOJA3.js}

@@ -12,6 +12,7 @@ import chevronLeftIcon from "@iconify/icons-carbon/chevron-left";
 import chevronRightIcon from "@iconify/icons-carbon/chevron-right";
 import chevronUpIcon from "@iconify/icons-carbon/chevron-up";
 import closeFilledIcon from "@iconify/icons-carbon/close-filled";
+import closeIcon from "@iconify/icons-carbon/close";
 import copyIcon from "@iconify/icons-carbon/copy";
 import errorFilledIcon from "@iconify/icons-carbon/error-filled";
 import informationFilledIcon from "@iconify/icons-carbon/information-filled";
@@ -39,7 +40,7 @@ addIcon("calendar", calendarIcon);
 addIcon("checkbox-checked", checkboxCheckedFilled);
 addIcon("checkbox-indeterminate", checkboxIndeterminateFilledIcon);
 addIcon("checkbox-unchecked", checkboxIcon);
-addIcon("close", closeFilledIcon);
+addIcon("close", closeIcon);
 addIcon("copy", copyIcon);
 addIcon("delete", trashCanIcon);
 addIcon("error", errorFilledIcon);
@@ -362,6 +363,22 @@ var BruttalTheme = {
     danger: {
       color: "onDanger",
       backgroundColor: "danger"
+    },
+    closeButton: {
+      backgroundColor: "transparent",
+      color: "text",
+      fontSize: "xs",
+      display: "inline-flex",
+      alignItems: "center",
+      cursor: "pointer",
+      ":disabled": {
+        color: "muted",
+        cursor: "not-allowed"
+      },
+      ":is(:focus-within, :hover):not(:disabled)": {
+        color: "accent",
+        outlineColor: "transparent"
+      }
     }
   },
   cards: {
@@ -458,6 +475,42 @@ var BruttalTheme = {
       '&[aria-invalid="true"] ~ span.error-icon': {
         color: "danger"
       }
+    },
+    textarea: {
+      fontFamily: "body",
+      color: "text",
+      border: "interaction",
+      borderColor: "onMuted",
+      backgroundColor: "surface",
+      paddingY: "lg",
+      paddingX: "xl",
+      borderRadius: "action",
+      ":focus-within": {
+        outlineColor: "primary"
+      },
+      ":disabled::placeholder": {
+        color: "muted"
+      },
+      ":disabled": {
+        borderColor: "onMuted",
+        border: "muted",
+        color: "muted"
+      },
+      ":disabled+span>iconify-icon": {
+        color: "muted"
+      },
+      '&[aria-invalid="true"]': {
+        borderColor: "danger"
+      },
+      "&.success+span>iconify-icon": {
+        color: "positive"
+      },
+      '&[aria-invalid="true"]+span>iconify-icon': {
+        color: "danger"
+      },
+      '&[aria-invalid="true"]::placeholder': {
+        color: "danger"
+      }
     }
   },
   text: {

package/dist/esm/index.js

@@ -1,5 +1,5 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { BruttalTheme } from "./chunk-STTOSDFS.js";
+import { BruttalTheme } from "./chunk-NYJWOJA3.js";
 
 // src/createTheme.ts
 import deepmerge from "deepmerge";

package/dist/esm/themes/Bruttal/Bruttal.js

@@ -1,3 +1,3 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { BruttalFonts, BruttalTheme } from "../../chunk-STTOSDFS.js";
+import { BruttalFonts, BruttalTheme } from "../../chunk-NYJWOJA3.js";
 export { BruttalFonts, BruttalTheme };

package/dist/index.js

@@ -54,6 +54,7 @@ var import_chevron_left = __toESM(require("@iconify/icons-carbon/chevron-left"))
 var import_chevron_right = __toESM(require("@iconify/icons-carbon/chevron-right"));
 var import_chevron_up = __toESM(require("@iconify/icons-carbon/chevron-up"));
 var import_close_filled = __toESM(require("@iconify/icons-carbon/close-filled"));
+var import_close = __toESM(require("@iconify/icons-carbon/close"));
 var import_copy = __toESM(require("@iconify/icons-carbon/copy"));
 var import_error_filled = __toESM(require("@iconify/icons-carbon/error-filled"));
 var import_information_filled = __toESM(require("@iconify/icons-carbon/information-filled"));
@@ -81,7 +82,7 @@ var replicateIcon = {
 (0, import_react.addIcon)("checkbox-checked", import_checkbox_checked_filled.default);
 (0, import_react.addIcon)("checkbox-indeterminate", import_checkbox_indeterminate_filled.default);
 (0, import_react.addIcon)("checkbox-unchecked", import_checkbox.default);
-(0, import_react.addIcon)("close", import_close_filled.default);
+(0, import_react.addIcon)("close", import_close.default);
 (0, import_react.addIcon)("copy", import_copy.default);
 (0, import_react.addIcon)("delete", import_trash_can.default);
 (0, import_react.addIcon)("error", import_error_filled.default);
@@ -401,6 +402,22 @@ var BruttalTheme = {
     danger: {
       color: "onDanger",
       backgroundColor: "danger"
+    },
+    closeButton: {
+      backgroundColor: "transparent",
+      color: "text",
+      fontSize: "xs",
+      display: "inline-flex",
+      alignItems: "center",
+      cursor: "pointer",
+      ":disabled": {
+        color: "muted",
+        cursor: "not-allowed"
+      },
+      ":is(:focus-within, :hover):not(:disabled)": {
+        color: "accent",
+        outlineColor: "transparent"
+      }
     }
   },
   cards: {
@@ -497,6 +514,42 @@ var BruttalTheme = {
       '&[aria-invalid="true"] ~ span.error-icon': {
         color: "danger"
       }
+    },
+    textarea: {
+      fontFamily: "body",
+      color: "text",
+      border: "interaction",
+      borderColor: "onMuted",
+      backgroundColor: "surface",
+      paddingY: "lg",
+      paddingX: "xl",
+      borderRadius: "action",
+      ":focus-within": {
+        outlineColor: "primary"
+      },
+      ":disabled::placeholder": {
+        color: "muted"
+      },
+      ":disabled": {
+        borderColor: "onMuted",
+        border: "muted",
+        color: "muted"
+      },
+      ":disabled+span>iconify-icon": {
+        color: "muted"
+      },
+      '&[aria-invalid="true"]': {
+        borderColor: "danger"
+      },
+      "&.success+span>iconify-icon": {
+        color: "positive"
+      },
+      '&[aria-invalid="true"]+span>iconify-icon': {
+        color: "danger"
+      },
+      '&[aria-invalid="true"]::placeholder': {
+        color: "danger"
+      }
     }
   },
   text: {

package/dist/themes/Bruttal/Bruttal.js

@@ -55,6 +55,7 @@ var import_chevron_left = __toESM(require("@iconify/icons-carbon/chevron-left"))
 var import_chevron_right = __toESM(require("@iconify/icons-carbon/chevron-right"));
 var import_chevron_up = __toESM(require("@iconify/icons-carbon/chevron-up"));
 var import_close_filled = __toESM(require("@iconify/icons-carbon/close-filled"));
+var import_close = __toESM(require("@iconify/icons-carbon/close"));
 var import_copy = __toESM(require("@iconify/icons-carbon/copy"));
 var import_error_filled = __toESM(require("@iconify/icons-carbon/error-filled"));
 var import_information_filled = __toESM(require("@iconify/icons-carbon/information-filled"));
@@ -82,7 +83,7 @@ var replicateIcon = {
 (0, import_react.addIcon)("checkbox-checked", import_checkbox_checked_filled.default);
 (0, import_react.addIcon)("checkbox-indeterminate", import_checkbox_indeterminate_filled.default);
 (0, import_react.addIcon)("checkbox-unchecked", import_checkbox.default);
-(0, import_react.addIcon)("close", import_close_filled.default);
+(0, import_react.addIcon)("close", import_close.default);
 (0, import_react.addIcon)("copy", import_copy.default);
 (0, import_react.addIcon)("delete", import_trash_can.default);
 (0, import_react.addIcon)("error", import_error_filled.default);
@@ -405,6 +406,22 @@ var BruttalTheme = {
     danger: {
       color: "onDanger",
       backgroundColor: "danger"
+    },
+    closeButton: {
+      backgroundColor: "transparent",
+      color: "text",
+      fontSize: "xs",
+      display: "inline-flex",
+      alignItems: "center",
+      cursor: "pointer",
+      ":disabled": {
+        color: "muted",
+        cursor: "not-allowed"
+      },
+      ":is(:focus-within, :hover):not(:disabled)": {
+        color: "accent",
+        outlineColor: "transparent"
+      }
     }
   },
   cards: {
@@ -501,6 +518,42 @@ var BruttalTheme = {
       '&[aria-invalid="true"] ~ span.error-icon': {
         color: "danger"
       }
+    },
+    textarea: {
+      fontFamily: "body",
+      color: "text",
+      border: "interaction",
+      borderColor: "onMuted",
+      backgroundColor: "surface",
+      paddingY: "lg",
+      paddingX: "xl",
+      borderRadius: "action",
+      ":focus-within": {
+        outlineColor: "primary"
+      },
+      ":disabled::placeholder": {
+        color: "muted"
+      },
+      ":disabled": {
+        borderColor: "onMuted",
+        border: "muted",
+        color: "muted"
+      },
+      ":disabled+span>iconify-icon": {
+        color: "muted"
+      },
+      '&[aria-invalid="true"]': {
+        borderColor: "danger"
+      },
+      "&.success+span>iconify-icon": {
+        color: "positive"
+      },
+      '&[aria-invalid="true"]+span>iconify-icon': {
+        color: "danger"
+      },
+      '&[aria-invalid="true"]::placeholder': {
+        color: "danger"
+      }
     }
   },
   text: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/theme",
-  "version": "1.4.13",
+  "version": "1.4.15",
   "description": "Theme for packages.",
   "license": "UNLICENSED",
   "author": "ttoss",
@@ -53,5 +53,5 @@
       ]
     }
   },
-  "gitHead": "8572bc7e98343a9780146a604b0d2f04ca4388e6"
+  "gitHead": "3f398d2717a3ac8f7fecf4c79c028b35f0ef45fb"
 }

package/src/themes/Bruttal/BruttalIcons.ts

@@ -9,6 +9,7 @@ import chevronLeftIcon from '@iconify/icons-carbon/chevron-left';
 import chevronRightIcon from '@iconify/icons-carbon/chevron-right';
 import chevronUpIcon from '@iconify/icons-carbon/chevron-up';
 import closeFilledIcon from '@iconify/icons-carbon/close-filled';
+import closeIcon from '@iconify/icons-carbon/close';
 import copyIcon from '@iconify/icons-carbon/copy';
 import errorFilledIcon from '@iconify/icons-carbon/error-filled';
 import informationFilledIcon from '@iconify/icons-carbon/information-filled';
@@ -39,7 +40,7 @@ addIcon('calendar', calendarIcon);
 addIcon('checkbox-checked', checkboxCheckedFilled);
 addIcon('checkbox-indeterminate', checkboxIndeterminateFilledIcon);
 addIcon('checkbox-unchecked', checkboxIcon);
-addIcon('close', closeFilledIcon);
+addIcon('close', closeIcon);
 addIcon('copy', copyIcon);
 addIcon('delete', trashCanIcon);
 addIcon('error', errorFilledIcon);

package/src/themes/Bruttal/BruttalTheme.ts

@@ -252,6 +252,22 @@ export const BruttalTheme: Theme = {
       color: 'onDanger',
       backgroundColor: 'danger',
     },
+    closeButton: {
+      backgroundColor: 'transparent',
+      color: 'text',
+      fontSize: 'xs',
+      display: 'inline-flex',
+      alignItems: 'center',
+      cursor: 'pointer',
+      ':disabled': {
+        color: 'muted',
+        cursor: 'not-allowed',
+      },
+      ':is(:focus-within, :hover):not(:disabled)': {
+        color: 'accent',
+        outlineColor: 'transparent',
+      },
+    },
   },
   cards: {
     primary: {
@@ -348,6 +364,42 @@ export const BruttalTheme: Theme = {
         color: 'danger',
       },
     },
+    textarea: {
+      fontFamily: 'body',
+      color: 'text',
+      border: 'interaction',
+      borderColor: 'onMuted',
+      backgroundColor: 'surface',
+      paddingY: 'lg',
+      paddingX: 'xl',
+      borderRadius: 'action',
+      ':focus-within': {
+        outlineColor: 'primary',
+      },
+      ':disabled::placeholder': {
+        color: 'muted',
+      },
+      ':disabled': {
+        borderColor: 'onMuted',
+        border: 'muted',
+        color: 'muted',
+      },
+      ':disabled+span>iconify-icon': {
+        color: 'muted',
+      },
+      '&[aria-invalid="true"]': {
+        borderColor: 'danger',
+      },
+      '&.success+span>iconify-icon': {
+        color: 'positive',
+      },
+      '&[aria-invalid="true"]+span>iconify-icon': {
+        color: 'danger',
+      },
+      '&[aria-invalid="true"]::placeholder': {
+        color: 'danger',
+      },
+    },
   },
   text: {
     default: {