@ttoss/theme 1.4.32 → 1.4.34

package/dist/esm/{chunk-NGT4BFCW.js → chunk-MT6XFJ5D.js}

@@ -394,34 +394,16 @@ var BruttalTheme = {
     positive: {
       color: "onPositive",
       bg: "positive",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     negative: {
       color: "onDanger",
       bg: "danger",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     neutral: {
       color: "onSecondary",
       bg: "secondary",
-      fontFamily: "caption",
-      fontSize: "xs",
-      fontWeight: "normal",
-      lineHeight: "base",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative",
       border: "muted",
       borderColor: "onMuted"
@@ -429,23 +411,11 @@ var BruttalTheme = {
     informative: {
       color: "onNotice",
       bg: "notice",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     muted: {
       color: "onMuted",
       bg: "muted",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "xs"
     }
   },
@@ -516,17 +486,9 @@ var BruttalTheme = {
     },
     closeButton: {
       backgroundColor: "background",
-      fontFamily: "caption",
       color: "primary",
-      fontSize: "xs",
-      display: "inline-flex",
-      alignItems: "center",
-      cursor: "pointer",
-      gap: "sm",
-      padding: "sm",
       border: "default",
       borderColor: "primary",
-      width: "fit-content",
       ":disabled": {
         border: "muted",
         backgroundColor: "muted",
@@ -555,9 +517,6 @@ var BruttalTheme = {
   forms: {
     label: {
       color: "text",
-      fontFamily: "caption",
-      alignItems: "center",
-      fontSize: "sm",
       '&:is([aria-disabled="true"])': {
         color: "onMuted"
       },
@@ -618,13 +577,10 @@ var BruttalTheme = {
       }
     },
     input: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       backgroundColor: "surface",
       "::placeholder": {
         color: "onMuted"
@@ -637,21 +593,18 @@ var BruttalTheme = {
         border: "muted",
         borderColor: "onMuted"
       },
-      "&.error": {
+      '&[aria-invalid="true"]': {
         borderColor: "danger"
       },
-      "&.error+span>iconify-icon": {
+      '&[aria-invalid="true"]+span>iconify-icon': {
         color: "danger"
       }
     },
     inputNumber: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       ":disabled": {
         border: "muted",
         borderColor: "onMuted",
@@ -685,13 +638,9 @@ var BruttalTheme = {
     },
     select: {
       color: "text",
-      fontFamily: "body",
       backgroundColor: "surface",
       border: "interaction",
       borderColor: "onMuted",
-      width: "100%",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":disabled": {
         border: "muted",
@@ -712,13 +661,10 @@ var BruttalTheme = {
       }
     },
     textarea: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       backgroundColor: "surface",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":focus-within": {
         outlineColor: "primary"
@@ -753,16 +699,12 @@ var BruttalTheme = {
       lineSpace: "3.5"
     },
     help: {
-      fontFamily: "caption",
       color: "text",
-      fontSize: "xs",
       '&[aria-disabled="true"]': {
         color: "onMuted"
       },
       negative: {
         color: "danger",
-        fontFamily: "caption",
-        fontSize: "xs",
         '&[aria-disabled="true"]': {
           color: "onMuted"
         }

package/dist/esm/index.js

@@ -1,5 +1,5 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { BruttalTheme } from "./chunk-NGT4BFCW.js";
+import { BruttalTheme } from "./chunk-MT6XFJ5D.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-NGT4BFCW.js";
+import { BruttalFonts, BruttalTheme } from "../../chunk-MT6XFJ5D.js";
 export { BruttalFonts, BruttalTheme };

package/dist/index.js

@@ -409,34 +409,16 @@ var BruttalTheme = {
     positive: {
       color: "onPositive",
       bg: "positive",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     negative: {
       color: "onDanger",
       bg: "danger",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     neutral: {
       color: "onSecondary",
       bg: "secondary",
-      fontFamily: "caption",
-      fontSize: "xs",
-      fontWeight: "normal",
-      lineHeight: "base",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative",
       border: "muted",
       borderColor: "onMuted"
@@ -444,23 +426,11 @@ var BruttalTheme = {
     informative: {
       color: "onNotice",
       bg: "notice",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     muted: {
       color: "onMuted",
       bg: "muted",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "xs"
     }
   },
@@ -531,17 +501,9 @@ var BruttalTheme = {
     },
     closeButton: {
       backgroundColor: "background",
-      fontFamily: "caption",
       color: "primary",
-      fontSize: "xs",
-      display: "inline-flex",
-      alignItems: "center",
-      cursor: "pointer",
-      gap: "sm",
-      padding: "sm",
       border: "default",
       borderColor: "primary",
-      width: "fit-content",
       ":disabled": {
         border: "muted",
         backgroundColor: "muted",
@@ -570,9 +532,6 @@ var BruttalTheme = {
   forms: {
     label: {
       color: "text",
-      fontFamily: "caption",
-      alignItems: "center",
-      fontSize: "sm",
       '&:is([aria-disabled="true"])': {
         color: "onMuted"
       },
@@ -633,13 +592,10 @@ var BruttalTheme = {
       }
     },
     input: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       backgroundColor: "surface",
       "::placeholder": {
         color: "onMuted"
@@ -652,21 +608,18 @@ var BruttalTheme = {
         border: "muted",
         borderColor: "onMuted"
       },
-      "&.error": {
+      '&[aria-invalid="true"]': {
         borderColor: "danger"
       },
-      "&.error+span>iconify-icon": {
+      '&[aria-invalid="true"]+span>iconify-icon': {
         color: "danger"
       }
     },
     inputNumber: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       ":disabled": {
         border: "muted",
         borderColor: "onMuted",
@@ -700,13 +653,9 @@ var BruttalTheme = {
     },
     select: {
       color: "text",
-      fontFamily: "body",
       backgroundColor: "surface",
       border: "interaction",
       borderColor: "onMuted",
-      width: "100%",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":disabled": {
         border: "muted",
@@ -727,13 +676,10 @@ var BruttalTheme = {
       }
     },
     textarea: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       backgroundColor: "surface",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":focus-within": {
         outlineColor: "primary"
@@ -768,16 +714,12 @@ var BruttalTheme = {
       lineSpace: "3.5"
     },
     help: {
-      fontFamily: "caption",
       color: "text",
-      fontSize: "xs",
       '&[aria-disabled="true"]': {
         color: "onMuted"
       },
       negative: {
         color: "danger",
-        fontFamily: "caption",
-        fontSize: "xs",
         '&[aria-disabled="true"]': {
           color: "onMuted"
         }

package/dist/themes/Bruttal/Bruttal.js

@@ -413,34 +413,16 @@ var BruttalTheme = {
     positive: {
       color: "onPositive",
       bg: "positive",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     negative: {
       color: "onDanger",
       bg: "danger",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     neutral: {
       color: "onSecondary",
       bg: "secondary",
-      fontFamily: "caption",
-      fontSize: "xs",
-      fontWeight: "normal",
-      lineHeight: "base",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative",
       border: "muted",
       borderColor: "onMuted"
@@ -448,23 +430,11 @@ var BruttalTheme = {
     informative: {
       color: "onNotice",
       bg: "notice",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "informative"
     },
     muted: {
       color: "onMuted",
       bg: "muted",
-      fontFamily: "caption",
-      fontWeight: "normal",
-      lineHeight: "base",
-      fontSize: "xs",
-      paddingX: "xs",
-      paddingY: "2xs",
       borderRadius: "xs"
     }
   },
@@ -535,17 +505,9 @@ var BruttalTheme = {
     },
     closeButton: {
       backgroundColor: "background",
-      fontFamily: "caption",
       color: "primary",
-      fontSize: "xs",
-      display: "inline-flex",
-      alignItems: "center",
-      cursor: "pointer",
-      gap: "sm",
-      padding: "sm",
       border: "default",
       borderColor: "primary",
-      width: "fit-content",
       ":disabled": {
         border: "muted",
         backgroundColor: "muted",
@@ -574,9 +536,6 @@ var BruttalTheme = {
   forms: {
     label: {
       color: "text",
-      fontFamily: "caption",
-      alignItems: "center",
-      fontSize: "sm",
       '&:is([aria-disabled="true"])': {
         color: "onMuted"
       },
@@ -637,13 +596,10 @@ var BruttalTheme = {
       }
     },
     input: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       backgroundColor: "surface",
       "::placeholder": {
         color: "onMuted"
@@ -656,21 +612,18 @@ var BruttalTheme = {
         border: "muted",
         borderColor: "onMuted"
       },
-      "&.error": {
+      '&[aria-invalid="true"]': {
         borderColor: "danger"
       },
-      "&.error+span>iconify-icon": {
+      '&[aria-invalid="true"]+span>iconify-icon': {
         color: "danger"
       }
     },
     inputNumber: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       borderRadius: "action",
-      paddingY: "lg",
-      paddingX: "xl",
       ":disabled": {
         border: "muted",
         borderColor: "onMuted",
@@ -704,13 +657,9 @@ var BruttalTheme = {
     },
     select: {
       color: "text",
-      fontFamily: "body",
       backgroundColor: "surface",
       border: "interaction",
       borderColor: "onMuted",
-      width: "100%",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":disabled": {
         border: "muted",
@@ -731,13 +680,10 @@ var BruttalTheme = {
       }
     },
     textarea: {
-      fontFamily: "body",
       color: "text",
       border: "interaction",
       borderColor: "onMuted",
       backgroundColor: "surface",
-      paddingY: "lg",
-      paddingX: "xl",
       borderRadius: "action",
       ":focus-within": {
         outlineColor: "primary"
@@ -772,16 +718,12 @@ var BruttalTheme = {
       lineSpace: "3.5"
     },
     help: {
-      fontFamily: "caption",
       color: "text",
-      fontSize: "xs",
       '&[aria-disabled="true"]': {
         color: "onMuted"
       },
       negative: {
         color: "danger",
-        fontFamily: "caption",
-        fontSize: "xs",
         '&[aria-disabled="true"]': {
           color: "onMuted"
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/theme",
-  "version": "1.4.32",
+  "version": "1.4.34",
   "description": "Theme for packages.",
   "license": "UNLICENSED",
   "author": "ttoss",

package/src/themes/Bruttal/BruttalTheme.ts

@@ -172,34 +172,16 @@ export const BruttalTheme: Theme = {
     positive: {
       color: 'onPositive',
       bg: 'positive',
-      fontFamily: 'caption',
-      fontWeight: 'normal',
-      lineHeight: 'base',
-      fontSize: 'xs',
-      paddingX: 'xs',
-      paddingY: '2xs',
       borderRadius: 'informative',
     },
     negative: {
       color: 'onDanger',
       bg: 'danger',
-      fontFamily: 'caption',
-      fontWeight: 'normal',
-      lineHeight: 'base',
-      fontSize: 'xs',
-      paddingX: 'xs',
-      paddingY: '2xs',
       borderRadius: 'informative',
     },
     neutral: {
       color: 'onSecondary',
       bg: 'secondary',
-      fontFamily: 'caption',
-      fontSize: 'xs',
-      fontWeight: 'normal',
-      lineHeight: 'base',
-      paddingX: 'xs',
-      paddingY: '2xs',
       borderRadius: 'informative',
       border: 'muted',
       borderColor: 'onMuted',
@@ -207,23 +189,11 @@ export const BruttalTheme: Theme = {
     informative: {
       color: 'onNotice',
       bg: 'notice',
-      fontFamily: 'caption',
-      fontWeight: 'normal',
-      lineHeight: 'base',
-      fontSize: 'xs',
-      paddingX: 'xs',
-      paddingY: '2xs',
       borderRadius: 'informative',
     },
     muted: {
       color: 'onMuted',
       bg: 'muted',
-      fontFamily: 'caption',
-      fontWeight: 'normal',
-      lineHeight: 'base',
-      fontSize: 'xs',
-      paddingX: 'xs',
-      paddingY: '2xs',
       borderRadius: 'xs',
     },
   },
@@ -294,17 +264,9 @@ export const BruttalTheme: Theme = {
     },
     closeButton: {
       backgroundColor: 'background',
-      fontFamily: 'caption',
       color: 'primary',
-      fontSize: 'xs',
-      display: 'inline-flex',
-      alignItems: 'center',
-      cursor: 'pointer',
-      gap: 'sm',
-      padding: 'sm',
       border: 'default',
       borderColor: 'primary',
-      width: 'fit-content',
       ':disabled': {
         border: 'muted',
         backgroundColor: 'muted',
@@ -333,9 +295,6 @@ export const BruttalTheme: Theme = {
   forms: {
     label: {
       color: 'text',
-      fontFamily: 'caption',
-      alignItems: 'center',
-      fontSize: 'sm',
       '&:is([aria-disabled="true"])': {
         color: 'onMuted',
       },
@@ -396,13 +355,10 @@ export const BruttalTheme: Theme = {
       },
     },
     input: {
-      fontFamily: 'body',
       color: 'text',
       border: 'interaction',
       borderColor: 'onMuted',
       borderRadius: 'action',
-      paddingY: 'lg',
-      paddingX: 'xl',
       backgroundColor: 'surface',
       '::placeholder': {
         color: 'onMuted',
@@ -415,21 +371,18 @@ export const BruttalTheme: Theme = {
         border: 'muted',
         borderColor: 'onMuted',
       },
-      '&.error': {
+      '&[aria-invalid="true"]': {
         borderColor: 'danger',
       },
-      '&.error+span>iconify-icon': {
+      '&[aria-invalid="true"]+span>iconify-icon': {
         color: 'danger',
       },
     },
     inputNumber: {
-      fontFamily: 'body',
       color: 'text',
       border: 'interaction',
       borderColor: 'onMuted',
       borderRadius: 'action',
-      paddingY: 'lg',
-      paddingX: 'xl',
       ':disabled': {
         border: 'muted',
         borderColor: 'onMuted',
@@ -463,13 +416,9 @@ export const BruttalTheme: Theme = {
     },
     select: {
       color: 'text',
-      fontFamily: 'body',
       backgroundColor: 'surface',
       border: 'interaction',
       borderColor: 'onMuted',
-      width: '100%',
-      paddingY: 'lg',
-      paddingX: 'xl',
       borderRadius: 'action',
       ':disabled': {
         border: 'muted',
@@ -490,13 +439,10 @@ export const BruttalTheme: Theme = {
       },
     },
     textarea: {
-      fontFamily: 'body',
       color: 'text',
       border: 'interaction',
       borderColor: 'onMuted',
       backgroundColor: 'surface',
-      paddingY: 'lg',
-      paddingX: 'xl',
       borderRadius: 'action',
       ':focus-within': {
         outlineColor: 'primary',
@@ -510,7 +456,6 @@ export const BruttalTheme: Theme = {
         border: 'muted',
         color: 'onMuted',
       },
-
       '&[aria-invalid="true"]': {
         borderColor: 'danger',
         outlineColor: 'danger',
@@ -532,16 +477,12 @@ export const BruttalTheme: Theme = {
       lineSpace: '3.5',
     },
     help: {
-      fontFamily: 'caption',
       color: 'text',
-      fontSize: 'xs',
       '&[aria-disabled="true"]': {
         color: 'onMuted',
       },
       negative: {
         color: 'danger',
-        fontFamily: 'caption',
-        fontSize: 'xs',
         '&[aria-disabled="true"]': {
           color: 'onMuted',
         },