react-miui 0.20.0 → 0.21.0

package/esm/theme.d.ts

@@ -66,17 +66,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
         tableStripedBg: string;
     };
 }, import("@stitches/react/types/config").DefaultThemeMap, {
-    mx: (value: string) => {
-        marginLeft: string;
-        marginRight: string;
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
     };
-    my: (value: string) => {
-        marginTop: string;
-        marginBottom: string;
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
     };
-    size: (value: string) => {
-        width: string;
-        height: string;
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
+    };
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
     };
 }>>(type: Type, ...composers: { [K in keyof Composers]: string extends Composers[K] ? Composers[K] : Composers[K] extends string | import("react").ComponentType<any> | import("@stitches/react/types/util").Function ? Composers[K] : import("@stitches/react/types/stitches").RemoveIndex<CSS> & {
     variants?: {
@@ -85,11 +93,11 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
             [x: number]: CSS;
         };
     };
-    compoundVariants?: (("variants" extends keyof Composers[K] ? Composers[K][keyof Composers[K] & "variants"] extends infer T ? { [Name in keyof T]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name]>; } : never : import("@stitches/react/types/util").WideObject) & {
+    compoundVariants?: (("variants" extends keyof Composers[K] ? { [Name in keyof Composers[K][keyof Composers[K] & "variants"]]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name]>; } : import("@stitches/react/types/util").WideObject) & {
         css: CSS;
     })[];
-    defaultVariants?: "variants" extends keyof Composers[K] ? Composers[K][keyof Composers[K] & "variants"] extends infer T_1 ? { [Name_1 in keyof T_1]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name_1]>; } : never : import("@stitches/react/types/util").WideObject;
-} & CSS & (Composers[K] extends infer T_2 ? { [K2 in keyof T_2]: K2 extends "compoundVariants" | "defaultVariants" | "variants" ? unknown : K2 extends keyof CSS ? CSS[K2] : unknown; } : never); }) => StyledComponent<Type, import("@stitches/react/types/styled-component").StyledComponentProps<Composers>, {}, import("@stitches/react/types/css-util").CSS<{}, {
+    defaultVariants?: "variants" extends keyof Composers[K] ? { [Name_1 in keyof Composers[K][keyof Composers[K] & "variants"]]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name_1]>; } : import("@stitches/react/types/util").WideObject;
+} & CSS & { [K2 in keyof Composers[K]]: K2 extends "compoundVariants" | "defaultVariants" | "variants" ? unknown : K2 extends keyof CSS ? CSS[K2] : unknown; }; }) => StyledComponent<Type, import("@stitches/react/types/styled-component").StyledComponentProps<Composers>, {}, import("@stitches/react/types/css-util").CSS<{}, {
     colors: {
         background: string;
         mainColor: string;
@@ -148,17 +156,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
         tableStripedBg: string;
     };
 }, import("@stitches/react/types/config").DefaultThemeMap, {
-    mx: (value: string) => {
-        marginLeft: string;
-        marginRight: string;
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
+    };
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
+    };
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
     };
-    my: (value: string) => {
-        marginTop: string;
-        marginBottom: string;
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
     };
-    size: (value: string) => {
-        width: string;
-        height: string;
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
     };
 }>>, css: <Composers extends (string | import("react").JSXElementConstructor<any> | import("react").ExoticComponent<any> | import("@stitches/react/types/util").Function | {
     [name: string]: unknown;
@@ -221,17 +237,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
         tableStripedBg: string;
     };
 }, import("@stitches/react/types/config").DefaultThemeMap, {
-    mx: (value: string) => {
-        marginLeft: string;
-        marginRight: string;
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
     };
-    my: (value: string) => {
-        marginTop: string;
-        marginBottom: string;
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
     };
-    size: (value: string) => {
-        width: string;
-        height: string;
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
+    };
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
     };
 }>>(...composers: { [K in keyof Composers]: string extends Composers[K] ? Composers[K] : Composers[K] extends string | import("react").JSXElementConstructor<any> | import("react").ExoticComponent<any> | import("@stitches/react/types/util").Function ? Composers[K] : import("@stitches/react/types/stitches").RemoveIndex<CSS> & {
     variants?: {
@@ -240,11 +264,11 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
             [x: number]: CSS;
         };
     };
-    compoundVariants?: (("variants" extends keyof Composers[K] ? Composers[K][keyof Composers[K] & "variants"] extends infer T ? { [Name in keyof T]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name]>; } : never : import("@stitches/react/types/util").WideObject) & {
+    compoundVariants?: (("variants" extends keyof Composers[K] ? { [Name in keyof Composers[K][keyof Composers[K] & "variants"]]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name]>; } : import("@stitches/react/types/util").WideObject) & {
         css: CSS;
     })[];
-    defaultVariants?: "variants" extends keyof Composers[K] ? Composers[K][keyof Composers[K] & "variants"] extends infer T_1 ? { [Name_1 in keyof T_1]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name_1]>; } : never : import("@stitches/react/types/util").WideObject;
-} & CSS & (Composers[K] extends infer T_2 ? { [K2 in keyof T_2]: K2 extends "compoundVariants" | "defaultVariants" | "variants" ? unknown : K2 extends keyof CSS ? CSS[K2] : unknown; } : never); }) => import("@stitches/react/types/styled-component").CssComponent<import("@stitches/react/types/styled-component").StyledComponentType<Composers>, import("@stitches/react/types/styled-component").StyledComponentProps<Composers>, {}, CSS>, globalCss: <Styles extends {
+    defaultVariants?: "variants" extends keyof Composers[K] ? { [Name_1 in keyof Composers[K][keyof Composers[K] & "variants"]]?: import("@stitches/react/types/util").String | import("@stitches/react/types/util").Widen<keyof Composers[K][keyof Composers[K] & "variants"][Name_1]>; } : import("@stitches/react/types/util").WideObject;
+} & CSS & { [K2 in keyof Composers[K]]: K2 extends "compoundVariants" | "defaultVariants" | "variants" ? unknown : K2 extends keyof CSS ? CSS[K2] : unknown; }; }) => import("@stitches/react/types/styled-component").CssComponent<import("@stitches/react/types/styled-component").StyledComponentType<Composers>, import("@stitches/react/types/styled-component").StyledComponentProps<Composers>, {}, CSS>, globalCss: <Styles extends {
     [K: string]: any;
 }>(...styles: ({
     '@import'?: unknown;
@@ -309,17 +333,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
             tableStripedBg: string;
         };
     }, import("@stitches/react/types/config").DefaultThemeMap, {
-        mx: (value: string) => {
-            marginLeft: string;
-            marginRight: string;
+        mx: (value: string | number) => {
+            marginLeft: string | number;
+            marginRight: string | number;
+        };
+        my: (value: string | number) => {
+            marginTop: string | number;
+            marginBottom: string | number;
         };
-        my: (value: string) => {
-            marginTop: string;
-            marginBottom: string;
+        px: (value: string | number) => {
+            paddingLeft: string | number;
+            paddingRight: string | number;
         };
-        size: (value: string) => {
-            width: string;
-            height: string;
+        py: (value: string | number) => {
+            paddingTop: string | number;
+            paddingBottom: string | number;
+        };
+        size: (value: string | number) => {
+            width: string | number;
+            height: string | number;
         };
     }>;
 } : K extends `@property ${string}` ? import("@stitches/react/types/css").AtRule.Property : import("@stitches/react/types/css-util").CSS<{}, {
@@ -381,17 +413,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
         tableStripedBg: string;
     };
 }, import("@stitches/react/types/config").DefaultThemeMap, {
-    mx: (value: string) => {
-        marginLeft: string;
-        marginRight: string;
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
+    };
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
     };
-    my: (value: string) => {
-        marginTop: string;
-        marginBottom: string;
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
     };
-    size: (value: string) => {
-        width: string;
-        height: string;
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
     };
 }>; })[]) => () => string, keyframes: (style: {
     [offset: string]: import("@stitches/react/types/css-util").CSS<{}, {
@@ -453,17 +493,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
             tableStripedBg: string;
         };
     }, import("@stitches/react/types/config").DefaultThemeMap, {
-        mx: (value: string) => {
-            marginLeft: string;
-            marginRight: string;
+        mx: (value: string | number) => {
+            marginLeft: string | number;
+            marginRight: string | number;
+        };
+        my: (value: string | number) => {
+            marginTop: string | number;
+            marginBottom: string | number;
         };
-        my: (value: string) => {
-            marginTop: string;
-            marginBottom: string;
+        px: (value: string | number) => {
+            paddingLeft: string | number;
+            paddingRight: string | number;
         };
-        size: (value: string) => {
-            width: string;
-            height: string;
+        py: (value: string | number) => {
+            paddingTop: string | number;
+            paddingBottom: string | number;
+        };
+        size: (value: string | number) => {
+            width: string | number;
+            height: string | number;
         };
     }>;
 }) => {
@@ -723,17 +771,25 @@ declare const styled: <Type extends import("react").ComponentType<any> | keyof J
     };
     themeMap: import("@stitches/react/types/config").DefaultThemeMap;
     utils: {
-        mx: (value: string) => {
-            marginLeft: string;
-            marginRight: string;
+        mx: (value: string | number) => {
+            marginLeft: string | number;
+            marginRight: string | number;
+        };
+        my: (value: string | number) => {
+            marginTop: string | number;
+            marginBottom: string | number;
+        };
+        px: (value: string | number) => {
+            paddingLeft: string | number;
+            paddingRight: string | number;
         };
-        my: (value: string) => {
-            marginTop: string;
-            marginBottom: string;
+        py: (value: string | number) => {
+            paddingTop: string | number;
+            paddingBottom: string | number;
         };
-        size: (value: string) => {
-            width: string;
-            height: string;
+        size: (value: string | number) => {
+            width: string | number;
+            height: string | number;
         };
     };
 };

package/esm/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAC;AAC9E,OAAO,KAAK,EAAE,GAAG,IAAI,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAS1D,QAAA,MAAM,OAAO,OAAQ,MAAM,WAAoB,CAAC;AAChD,QAAA,MAAM,iBAAiB,OAAQ,MAAM,WAAoC,CAAC;AAC1E,QAAA,MAAM,aAAa,OAAQ,MAAM,WAAgC,CAAC;AAClE,QAAA,MAAM,WAAW,OAAQ,MAAM,WAA8B,CAAC;AAE9D,QAAA,MACI,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAkFU,MAAM;;;;gBACN,MAAM;;;;kBACJ,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAFR,MAAM;;;;gBACN,MAAM;;;;kBACJ,MAAM;;;;KAnFxB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAiFa,MAAM;;;;gBACN,MAAM;;;;kBACJ,MAAM;;;;;;;;;;;;;;;mbAlFxB,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAgFO,MAAM;;;;oBACN,MAAM;;;;sBACJ,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAFR,MAAM;;;;gBACN,MAAM;;;;kBACJ,MAAM;;;;2BAjFxB,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA+EO,MAAM;;;;oBACN,MAAM;;;;sBACJ,MAAM;;;;;;;;GAhFxB,UAAU,gBACV,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GACL,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4KACX,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBA2EU,MAAM;;;;oBACN,MAAM;;;;sBACJ,MAAM;;;;;CAE1B,CAAC;AAEH,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,MAAM,CAAC,CAAC;AAE3C,KAAK,cAAc,CAEf,CAAC,SAAS,eAAe,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,EAExD,KAAK,EAAE,IAAI,GAAG,GAAG,EAAE,QAAQ,GAAG,GAAG,EAAE,KAAK,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,IAC5D,eAAe,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;AAEhD,YAAY,EACR,QAAQ,EACR,cAAc,GACjB,CAAC;AAEF,OAAO,EACH,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAEzE,OAAO,EACP,iBAAiB,EACjB,aAAa,EACb,WAAW,GACd,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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"}

package/esm/theme.js

@@ -71,6 +71,8 @@ const { styled, css, globalCss, keyframes, getCssText, theme, createTheme, confi
     utils: {
         mx: (value) => ({ marginLeft: value, marginRight: value }),
         my: (value) => ({ marginTop: value, marginBottom: value }),
+        px: (value) => ({ paddingLeft: value, paddingRight: value }),
+        py: (value) => ({ paddingTop: value, paddingBottom: value }),
         size: (value) => ({ width: value, height: value }),
     },
 });

package/esm/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-miui",
-  "version": "0.20.0",
+  "version": "0.21.0",
   "author": "Jacek Nowacki",
   "license": "MIT",
   "scripts": {
@@ -15,6 +15,7 @@
     "prepack": "yarn compile",
     "prepublishOnly": "yarn audit && yarn lint && yarn test && yarn docs",
     "start:dev": "yarn storybook",
+    "start:dev:legacy": "next dev",
     "deploy:dev": "next build && next export && netlify deploy --dir out",
     "updates": "npx --yes npm-check-updates --dep prod",
     "updates:dev": "npx --yes npm-check-updates --dep dev",
@@ -39,9 +40,9 @@
     "oop-timers": "^5.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.21.4",
-    "@babel/preset-env": "^7.21.4",
-    "@babel/preset-typescript": "^7.21.4",
+    "@babel/core": "^7.22.5",
+    "@babel/preset-env": "^7.22.5",
+    "@babel/preset-typescript": "^7.22.5",
     "@dzek69/eslint-config-base": "^2.4.0",
     "@dzek69/eslint-config-import": "^1.2.0",
     "@dzek69/eslint-config-import-typescript": "^1.0.0",
@@ -71,7 +72,7 @@
     "fs-extra": "^11.1.1",
     "jest": "^29.5.0",
     "must": "^0.13.4",
-    "next": "^13.1.6",
+    "next": "^13.4.4",
     "nodemon": "^2.0.22",
     "prettier": "^2.8.7",
     "react": "^18.2.0",
@@ -81,7 +82,7 @@
     "storybook": "^7.0.11",
     "ts-node": "^10.9.1",
     "typedoc": "^0.23.28",
-    "typescript": "^5.0.4"
+    "typescript": "^5.1.3"
   },
   "peerDependencies": {
     "react": "^18.2.0",

package/src/components/form/input/Input.css.ts

@@ -0,0 +1,60 @@
+// import type { ThemeCSS } from "../../../theme"; TODO restore
+
+import { dimensionsPxToRem, fontPxToRem, borderPxToRem } from "../../../theme.js";
+
+const input = {
+    "height": dimensionsPxToRem(103),
+    "fontSize": fontPxToRem(25),
+    "color": "$text",
+    "border": "none",
+    "display": "block",
+    "width": "100%",
+    "background": "none",
+    "fontFamily": "inherit",
+    "padding": "1.2em 0",
+    "flex": 1,
+
+    "&::placeholder": {
+        color: "$sub",
+    },
+
+    "&:read-only, &:disabled": {
+        color: "inherit",
+    },
+};
+// satisfies ThemeCSS; @TODO restore
+
+const wrapper = {
+    background: "white",
+    display: "inline-flex",
+    width: "100%",
+    borderRadius: "2px",
+    padding: `0 ${dimensionsPxToRem(36)}`,
+    border: `${borderPxToRem(1)} solid $border`,
+    alignItems: "center",
+
+    variants: {
+        disabled: {
+            true: {
+                background: "$inputDisabledBg",
+                color: "$inputDisabledText",
+            },
+        },
+        readOnly: {
+            true: {
+                color: "$inputDisabledText",
+            },
+        },
+        focused: {
+            true: {
+                borderColor: "$focusColor",
+            },
+        },
+    },
+};
+// satisfies ThemeCSS; TODO restore
+
+export {
+    input,
+    wrapper,
+};

package/src/components/form/input/Input.styled.ts

@@ -1,58 +1,10 @@
-import { borderPxToRem, dimensionsPxToRem, fontPxToRem, styled } from "../../../theme.js";
+import { dimensionsPxToRem, styled } from "../../../theme.js";
 
-const StyledInput = styled("input", {
-    "height": dimensionsPxToRem(103),
-    "fontSize": fontPxToRem(34),
-    "color": "$text",
-    "border": "none",
-    "display": "block",
-    "width": "100%",
-    "background": "none",
-    "fontFamily": "inherit",
-    "padding": "1.2em 0",
-    "flex": 1,
+import { input, wrapper } from "./Input.css.js";
 
-    "&::placeholder": {
-        color: "$sub",
-    },
-});
-
-const StyledWrapper = styled("div", {
-    background: "white",
-    display: "inline-flex",
-    width: "100%",
-    borderRadius: "2px",
-    padding: `0 ${dimensionsPxToRem(36)}`,
-    border: `${borderPxToRem(1)} solid $border`,
-    alignItems: "center",
-
-    variants: {
-        disabled: {
-            true: {
-                background: "$inputDisabledBg",
-                color: "$inputDisabledText",
+const StyledInput = styled("input", input);
 
-                [StyledInput.toString()]: {
-                    color: "$inputDisabledText",
-                },
-            },
-        },
-        readOnly: {
-            true: {
-                color: "$inputDisabledText",
-
-                [StyledInput.toString()]: {
-                    color: "$inputDisabledText",
-                },
-            },
-        },
-        focused: {
-            true: {
-                borderColor: "$focusColor",
-            },
-        },
-    },
-});
+const StyledWrapper = styled("div", wrapper);
 
 const StyledPrefix = styled("div", {
     marginRight: dimensionsPxToRem(36),

package/src/components/form/textarea/TextArea.stories.tsx

@@ -0,0 +1,21 @@
+import type { StoryObj, Meta } from "@storybook/react";
+
+import { TextArea } from "./TextArea.js";
+
+const meta: Meta = {
+    title: "Components/Form/TextArea",
+    component: TextArea,
+    tags: ["autodocs", "form"],
+};
+
+type Story = StoryObj<typeof TextArea>;
+
+const Primary: Story = {
+    args: {},
+};
+
+export {
+    Primary,
+};
+
+export default meta;

package/src/components/form/textarea/TextArea.styled.ts

@@ -0,0 +1,19 @@
+import { dimensionsPxToRem, styled } from "../../../theme.js";
+import { input, wrapper } from "../input/Input.css";
+import { miuiScrollbars } from "../../../scrollbars.css";
+
+const StyledTextArea = styled("textarea", {
+    ...miuiScrollbars,
+    ...input,
+    ...wrapper,
+
+    padding: `1.2em ${dimensionsPxToRem(36)}`,
+    height: "unset",
+    resize: "vertical",
+    minHeight: dimensionsPxToRem(103),
+
+});
+
+export {
+    StyledTextArea,
+};

package/src/components/form/{TextArea.tsx → textarea/TextArea.tsx}

@@ -1,15 +1,13 @@
 import React, { useCallback, useState } from "react";
 
-import classnames from "classnames";
-
-import styles from "./input/Input.module.scss";
+import { StyledTextArea } from "./TextArea.styled";
 
 interface Props {
     children?: never;
 }
 
 const TextArea: React.FC<React.TextareaHTMLAttributes<HTMLTextAreaElement> & Props> = ({
-    className, children,
+    children,
     onFocus, onBlur,
     ...props
 }) => {
@@ -25,12 +23,15 @@ const TextArea: React.FC<React.TextareaHTMLAttributes<HTMLTextAreaElement> & Pro
         onBlur?.(e);
     }, [onBlur]);
 
-    const cls = classnames(styles.wrapper, {
-        [styles.wrapperFocused]: focused,
-    }, styles.input, styles.textarea, className);
-
     return (
-        <textarea {...props} onFocus={handleFocus} onBlur={handleBlur} className={cls} />
+        <StyledTextArea
+            {...props}
+            disabled={Boolean(props.disabled)}
+            readOnly={Boolean(props.readOnly)}
+            focused={focused}
+            onFocus={handleFocus}
+            onBlur={handleBlur}
+        />
     );
 };
 

package/src/components/layout/list/Header.stories.tsx

@@ -0,0 +1,40 @@
+import React from "react";
+
+import type { StoryObj, Meta } from "@storybook/react";
+
+import { Header } from "./Header.js";
+import { List } from "./List.js";
+
+const meta: Meta = {
+    title: "Components/Layout/List/Header",
+    component: Header,
+    tags: ["autodocs", "layout"],
+};
+
+type Story = StoryObj<typeof Header>;
+
+const Primary: Story = {
+    args: {
+        children: "Section name",
+    },
+    render: (args) => {
+        return (
+            <List>
+                <Header {...args} />
+                <List.Item>Item 1</List.Item>
+                <List.Item>Item 2</List.Item>
+                <List.Item>Item 3</List.Item>
+                <Header {...args} />
+                <List.Item>Item 1</List.Item>
+                <List.Item>Item 2</List.Item>
+                <List.Item>Item 3</List.Item>
+            </List>
+        );
+    },
+};
+
+export {
+    Primary,
+};
+
+export default meta;