@a-type/ui 6.0.56 → 6.0.58

package/dist/components/box/Box.module.css

@@ -195,6 +195,10 @@
 			@apply --mx-bg-faded(80%);
 			@apply --mx-borderColor-faded(80%);
 		}
+		/* reduce specificity so surface styles override */
+		&:where([data-dim='true']) {
+			@apply --mx-fg(var(--m-color-neutral-ink));
+		}
 		&[data-dim='true'] {
 			@apply --mx-fg-lighter(2.5);
 		}

package/dist/components/box/Box.stories.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from '../button/Button.js';
 import { Checkbox } from '../checkbox/Checkbox.js';
+import { Icon } from '../icon/Icon.js';
 import { Progress } from '../progress/Progress.js';
 import { Slider } from '../slider/Slider.js';
 import { Switch } from '../switch/Switch.js';
@@ -85,7 +86,7 @@ export const Surfaces = {
 };
 export const DimComparison = {
     render(args) {
-        return (_jsxs(Box, { gap: true, children: [_jsx(Box, { surface: "ambient", dim: true, children: "Dimmed box" }), _jsx(Box, { surface: "ambient", children: _jsx(Text, { dim: true, children: "Dimmed text" }) })] }));
+        return (_jsxs(Box, { gap: true, children: [_jsxs(Box, { dim: true, children: ["Dimmed non-surface", _jsx(Text, { children: "Text" }), _jsx(Icon, { name: "placeholder" })] }), _jsxs(Box, { surface: "ambient", dim: true, children: ["Dimmed box", _jsx(Text, { children: "Text" }), _jsx(Icon, { name: "placeholder" })] }), _jsxs(Box, { surface: "primary", dim: true, children: ["Dimmed box", _jsx(Text, { children: "Text" }), _jsx(Icon, { name: "placeholder" })] }), _jsx(Box, { surface: "ambient", children: _jsx(Text, { dim: true, children: "Dimmed text" }) })] }));
     },
 };
 //# sourceMappingURL=Box.stories.js.map

package/dist/components/box/Box.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Box.stories.js","sourceRoot":"","sources":["../../../src/components/box/Box.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,GAAG;IACd,QAAQ,EAAE;QACT,MAAM,EAAE;YACP,IAAI,EAAE,SAAS;YACf,YAAY,EAAE,KAAK;SACnB;QACD,OAAO,EAAE;YACR,IAAI,EAAE,SAAS;YACf,YAAY,EAAE,KAAK;SACnB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE;gBACR,IAAI;gBACJ,IAAI;gBACJ,IAAI;gBACJ,IAAI;gBACJ,KAAK;gBACL,KAAK;gBACL,KAAK;gBACL,KAAK;gBACL,OAAO;gBACP,OAAO;gBACP,OAAO;gBACP,OAAO;gBACP,QAAQ;gBACR,QAAQ;gBACR,QAAQ;gBACR,QAAQ;aACR;YACD,OAAO,EAAE;gBACR,IAAI,EAAE,QAAQ;aACd;SACD;QACD,MAAM,EAAE;YACP,IAAI,EAAE,QAAQ;SACd;QACD,IAAI,EAAE;YACL,IAAI,EAAE,SAAS;SACf;QACD,SAAS,EAAE;YACV,IAAI,EAAE,SAAS;SACf;QACD,QAAQ,EAAE;YACT,KAAK,EAAE;gBACN,OAAO,EAAE,IAAI;aACb;SACD;KACD;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC0B,CAAC;AAE7B,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,IAAI,EAAE;QACL,QAAQ,EAAE,CACT,8BACC,KAAC,MAAM,IAAC,QAAQ,EAAC,SAAS,wBAAiB,EAC3C,KAAC,MAAM,IAAC,QAAQ,EAAC,OAAO,sBAAe,EACvC,KAAC,MAAM,0BAAiB,IACtB,CACH;QACD,CAAC,EAAE,IAAI;QACP,GAAG,EAAE,IAAI;QACT,MAAM,EAAE,IAAI;KACZ;CACD,CAAC;AAEF,SAAS,cAAc,CAAC,EAAE,IAAI,EAAoB;IACjD,OAAO,CACN,8BACC,0BAAM,IAAI,gBAAe,EACzB,MAAC,GAAG,IAAC,GAAG,QAAC,MAAM,EAAC,cAAc,aAC7B,KAAC,MAAM,IAAC,QAAQ,EAAC,SAAS,wBAAiB,EAC3C,KAAC,MAAM,IAAC,QAAQ,EAAC,OAAO,sBAAe,EACvC,KAAC,QAAQ,IAAC,OAAO,SAAG,EACpB,KAAC,MAAM,IAAC,OAAO,SAAG,IACb,EACN,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,GAAI,EACjD,MAAC,WAAW,IAAC,YAAY,EAAE,CAAC,KAAK,CAAC,aACjC,KAAC,WAAW,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,oBAAuB,EACpD,KAAC,WAAW,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,oBAAuB,IACvC,EACd,KAAC,MAAM,IAAC,YAAY,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,GAAI,IACtD,CACH,CAAC;AACH,CAAC;AACD,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC9B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,6BACC,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE;gBACN,OAAO,EAAE,MAAM;gBACf,mBAAmB,EAAE,gBAAgB;gBACrC,GAAG,EAAE,mBAAmB;aACxB,IACG,IAAI,eAER,KAAC,GAAG,oBAAK,IAAI,IAAE,OAAO,EAAC,SAAS,EAAC,CAAC,EAAC,IAAI,EAAC,GAAG,QAAC,GAAG,kBAC9C,KAAC,cAAc,IAAC,IAAI,EAAC,SAAS,GAAG,IAC5B,EACN,KAAC,GAAG,oBACC,IAAI,IACR,OAAO,EAAC,SAAS,EACjB,SAAS,EAAC,eAAe,EACzB,CAAC,EAAC,IAAI,EACN,GAAG,QACH,GAAG,kBAEH,KAAC,cAAc,IAAC,IAAI,EAAC,SAAS,GAAG,IAC5B,EACN,KAAC,GAAG,oBACC,IAAI,IACR,OAAO,EAAC,WAAW,EACnB,SAAS,EAAC,eAAe,EACzB,CAAC,EAAC,IAAI,EACN,GAAG,QACH,GAAG,kBAEH,KAAC,cAAc,IAAC,IAAI,EAAC,WAAW,GAAG,IAC9B,EACN,KAAC,GAAG,oBAAK,IAAI,IAAE,OAAO,QAAC,SAAS,EAAC,cAAc,EAAC,CAAC,EAAC,IAAI,EAAC,GAAG,QAAC,GAAG,kBAC7D,KAAC,cAAc,IAAC,IAAI,EAAC,QAAQ,GAAG,IAC3B,EACN,KAAC,GAAG,oBAAK,IAAI,IAAE,OAAO,QAAC,SAAS,EAAC,eAAe,EAAC,CAAC,EAAC,IAAI,EAAC,GAAG,QAAC,GAAG,kBAC9D,KAAC,cAAc,IAAC,IAAI,EAAC,SAAS,GAAG,IAC5B,EACN,KAAC,GAAG,oBAAK,IAAI,IAAE,OAAO,QAAC,SAAS,EAAC,iBAAiB,EAAC,CAAC,EAAC,IAAI,EAAC,GAAG,QAAC,GAAG,kBAChE,KAAC,cAAc,IAAC,IAAI,EAAC,WAAW,GAAG,IAC9B,EACN,KAAC,GAAG,oBAAK,IAAI,IAAE,OAAO,QAAC,SAAS,EAAC,eAAe,EAAC,CAAC,EAAC,IAAI,EAAC,GAAG,QAAC,GAAG,kBAC9D,KAAC,cAAc,IAAC,IAAI,EAAC,SAAS,GAAG,IAC5B,KACD,CACN,CAAC;IACH,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAU;IACnC,MAAM,CAAC,IAAI;QACV,OAAO,CACN,MAAC,GAAG,IAAC,GAAG,mBACP,KAAC,GAAG,IAAC,OAAO,EAAC,SAAS,EAAC,GAAG,iCAEpB,EACN,KAAC,GAAG,IAAC,OAAO,EAAC,SAAS,YACrB,KAAC,IAAI,IAAC,GAAG,kCAAmB,GACvB,IACD,CACN,CAAC;IACH,CAAC;CACD,CAAC"}
+{"version":3,"file":"Box.stories.js","sourceRoot":"","sources":["../../../src/components/box/Box.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/textArea/TextArea.d.ts

@@ -9,7 +9,7 @@ export interface TextAreaProps extends InputProps {
     rows?: number;
 }
 declare function TextAreaInput({ ref, autoSize, padBottomPixels, onValueChange, className, rows, ...rest }: TextAreaProps): import("react/jsx-runtime").JSX.Element;
-export declare const TextArea: (({ className, ...rest }: TextAreaProps & {
+export declare const TextArea: (({ className, style, ...rest }: TextAreaProps & {
     ref?: React.Ref<any>;
 }) => import("react/jsx-runtime").JSX.Element) & {
     Border: import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;

package/dist/components/textArea/TextArea.js

@@ -46,8 +46,8 @@ function TextAreaInput(_a) {
 }
 const TextAreaBorder = withClassName(Input.Border, cls.border);
 const TextAreaDefault = function TextArea(_a) {
-    var { className } = _a, rest = __rest(_a, ["className"]);
-    return (_jsx(TextAreaBorder, { className: className, children: _jsx(TextAreaInput, Object.assign({}, rest)) }));
+    var { className, style } = _a, rest = __rest(_a, ["className", "style"]);
+    return (_jsx(TextAreaBorder, { className: className, style: style, children: _jsx(TextAreaInput, Object.assign({}, rest)) }));
 };
 export const TextArea = Object.assign(TextAreaDefault, {
     Border: TextAreaBorder,

package/dist/components/textArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/textArea/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAC9B,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,YAAY,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,KAAK,EAAc,MAAM,mBAAmB,CAAC;AACtD,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAexC,SAAS,aAAa,CAAC,EAQP;;QARO,EACtB,GAAG,EACH,QAAQ,GAAG,IAAI,EACf,eAAe,GAAG,CAAC,EACnB,aAAa,EACb,SAAS,EACT,IAAI,OAEW,EADZ,IAAI,cAPe,4EAQtB,CADO;IAEP,MAAM,QAAQ,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IACnC,MAAM,QAAQ,GAAG,YAAY,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IAE7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,MAAA,IAAI,CAAC,KAAK,mCAAI,UAAU,CAAC;IAE5C,gFAAgF;IAChF,eAAe,CAAC,GAAG,EAAE;QACpB,IAAI,CAAC,QAAQ;YAAE,OAAO;QACtB,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC;QACjC,IAAI,OAAO,EAAE,CAAC;YACb,IAAI,OAAO,CAAC,KAAK,KAAK,EAAE,IAAI,eAAe,EAAE,CAAC;gBAC7C,OAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;gBAC/B,MAAM,UAAU,GAAG,OAAO,CAAC,YAAY,CAAC;gBACxC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC;YAC5D,CAAC;QACF,CAAC;IACF,CAAC,EAAE,CAAC,QAAQ,EAAE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC;IAE5C,MAAM,iBAAiB,GAAG,WAAW,CACpC,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE;QACvB,aAAa,CAAC,KAAK,CAAC,CAAC;QACrB,IAAI,aAAa,EAAE,CAAC;YACnB,aAAa,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC;QACpC,CAAC;IACF,CAAC,EACD,CAAC,aAAa,CAAC,CACf,CAAC;IAEF,OAAO,CACN,KAAC,KAAK,CAAC,KAAK,kBACX,MAAM,EAAE,mBAAU,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAI,EAC/C,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,UAAU,CAAC,GAAG,CAAC,KAAK,EAAE,SAAS,CAAC,oBAC3B,QAAQ,EACxB,aAAa,EAAE,iBAAiB,IAC5B,IAAI,EACP,CACF,CAAC;AACH,CAAC;AAED,MAAM,cAAc,GAAG,aAAa,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;AAE/D,MAAM,eAAe,GAAG,SAAS,QAAQ,CAAC,EAKzC;QALyC,EACzC,SAAS,OAIT,EAHG,IAAI,cAFkC,aAGzC,CADO;IAIP,OAAO,CACN,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,YACnC,KAAC,aAAa,oBAAK,IAAI,EAAI,GACX,CACjB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IACtD,MAAM,EAAE,cAAc;IACtB,KAAK,EAAE,aAAa;CACpB,CAAC,CAAC"}
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/components/textArea/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAC9B,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,YAAY,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,KAAK,EAAc,MAAM,mBAAmB,CAAC;AACtD,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAexC,SAAS,aAAa,CAAC,EAQP;;QARO,EACtB,GAAG,EACH,QAAQ,GAAG,IAAI,EACf,eAAe,GAAG,CAAC,EACnB,aAAa,EACb,SAAS,EACT,IAAI,OAEW,EADZ,IAAI,cAPe,4EAQtB,CADO;IAEP,MAAM,QAAQ,GAAG,MAAM,CAAM,IAAI,CAAC,CAAC;IACnC,MAAM,QAAQ,GAAG,YAAY,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IAE7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,MAAA,IAAI,CAAC,KAAK,mCAAI,UAAU,CAAC;IAE5C,gFAAgF;IAChF,eAAe,CAAC,GAAG,EAAE;QACpB,IAAI,CAAC,QAAQ;YAAE,OAAO;QACtB,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC;QACjC,IAAI,OAAO,EAAE,CAAC;YACb,IAAI,OAAO,CAAC,KAAK,KAAK,EAAE,IAAI,eAAe,EAAE,CAAC;gBAC7C,OAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;gBAC/B,MAAM,UAAU,GAAG,OAAO,CAAC,YAAY,CAAC;gBACxC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,GAAG,eAAe,GAAG,IAAI,CAAC;YAC5D,CAAC;QACF,CAAC;IACF,CAAC,EAAE,CAAC,QAAQ,EAAE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC;IAE5C,MAAM,iBAAiB,GAAG,WAAW,CACpC,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE;QACvB,aAAa,CAAC,KAAK,CAAC,CAAC;QACrB,IAAI,aAAa,EAAE,CAAC;YACnB,aAAa,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC;QACpC,CAAC;IACF,CAAC,EACD,CAAC,aAAa,CAAC,CACf,CAAC;IAEF,OAAO,CACN,KAAC,KAAK,CAAC,KAAK,kBACX,MAAM,EAAE,mBAAU,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAI,EAC/C,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,UAAU,CAAC,GAAG,CAAC,KAAK,EAAE,SAAS,CAAC,oBAC3B,QAAQ,EACxB,aAAa,EAAE,iBAAiB,IAC5B,IAAI,EACP,CACF,CAAC;AACH,CAAC;AAED,MAAM,cAAc,GAAG,aAAa,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;AAE/D,MAAM,eAAe,GAAG,SAAS,QAAQ,CAAC,EAMzC;QANyC,EACzC,SAAS,EACT,KAAK,OAIL,EAHG,IAAI,cAHkC,sBAIzC,CADO;IAIP,OAAO,CACN,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,YACjD,KAAC,aAAa,oBAAK,IAAI,EAAI,GACX,CACjB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IACtD,MAAM,EAAE,cAAc;IACtB,KAAK,EAAE,aAAa;CACpB,CAAC,CAAC"}

package/dist/components/textArea/TextArea.stories.d.ts

@@ -2,7 +2,7 @@ import type { StoryObj } from '@storybook/react-vite';
 import { TextArea } from './TextArea.js';
 declare const meta: {
     title: string;
-    component: (({ className, ...rest }: import("./TextArea.js").TextAreaProps & {
+    component: (({ className, style, ...rest }: import("./TextArea.js").TextAreaProps & {
         ref?: React.Ref<any>;
     }) => import("react/jsx-runtime").JSX.Element) & {
         Border: import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;

package/dist/components/typography/typography.module.css

@@ -49,7 +49,8 @@
 	&[data-wrap] {
 		text-wrap: wrap;
 	}
-	&[data-dim] {
+	&[data-dim],
+	:where([data-dim='true']) & {
 		@apply --mx-fg-lighter(2.5);
 	}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a-type/ui",
-  "version": "6.0.56",
+  "version": "6.0.58",
   "type": "module",
   "repository": {
     "url": "https://github.com/a-type/ui"

package/src/components/box/Box.module.css

@@ -195,6 +195,10 @@
 			@apply --mx-bg-faded(80%);
 			@apply --mx-borderColor-faded(80%);
 		}
+		/* reduce specificity so surface styles override */
+		&:where([data-dim='true']) {
+			@apply --mx-fg(var(--m-color-neutral-ink));
+		}
 		&[data-dim='true'] {
 			@apply --mx-fg-lighter(2.5);
 		}

package/src/components/box/Box.stories.tsx

@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import { Button } from '../button/Button.js';
 import { Checkbox } from '../checkbox/Checkbox.js';
+import { Icon } from '../icon/Icon.js';
 import { Progress } from '../progress/Progress.js';
 import { Slider } from '../slider/Slider.js';
 import { Switch } from '../switch/Switch.js';
@@ -158,8 +159,20 @@ export const DimComparison: Story = {
 	render(args) {
 		return (
 			<Box gap>
+				<Box dim>
+					Dimmed non-surface
+					<Text>Text</Text>
+					<Icon name="placeholder" />
+				</Box>
 				<Box surface="ambient" dim>
 					Dimmed box
+					<Text>Text</Text>
+					<Icon name="placeholder" />
+				</Box>
+				<Box surface="primary" dim>
+					Dimmed box
+					<Text>Text</Text>
+					<Icon name="placeholder" />
 				</Box>
 				<Box surface="ambient">
 					<Text dim>Dimmed text</Text>

package/src/components/textArea/TextArea.tsx

@@ -72,12 +72,13 @@ const TextAreaBorder = withClassName(Input.Border, cls.border);
 
 const TextAreaDefault = function TextArea({
 	className,
+	style,
 	...rest
 }: TextAreaProps & {
 	ref?: React.Ref<any>;
 }) {
 	return (
-		<TextAreaBorder className={className}>
+		<TextAreaBorder className={className} style={style}>
 			<TextAreaInput {...rest} />
 		</TextAreaBorder>
 	);

package/src/components/typography/typography.module.css

@@ -49,7 +49,8 @@
 	&[data-wrap] {
 		text-wrap: wrap;
 	}
-	&[data-dim] {
+	&[data-dim],
+	:where([data-dim='true']) & {
 		@apply --mx-fg-lighter(2.5);
 	}