@astral/ui 0.40.1 → 0.41.2

package/Button/Button.js

@@ -30,13 +30,13 @@ var ButtonBase_1 = require("../ButtonBase");
 var CircularProgress_1 = require("../CircularProgress");
 var constants_1 = require("../CircularProgress/constants");
 exports.Button = (0, react_1.forwardRef)(function (props, ref) {
-    var _a = props.variant, variant = _a === void 0 ? ButtonBase_1.ButtonVariants.CONTAINED : _a, restProps = __rest(props, ["variant"]);
+    var _a = props.variant, variant = _a === void 0 ? ButtonBase_1.ButtonVariants.CONTAINED : _a, _b = props.color, color = _b === void 0 ? ButtonBase_1.ButtonColors.PRIMARY : _b, restProps = __rest(props, ["variant", "color"]);
     var loadingIndicatorColor = (0, react_1.useMemo)(function () {
         if (variant !== ButtonBase_1.ButtonVariants.CONTAINED) {
             return constants_1.CircularProgressColors.PRIMARY;
         }
         return constants_1.CircularProgressColors.INVERTED;
     }, [variant]);
-    return ((0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ ref: ref }, restProps, { variant: variant, loadingIndicator: (0, jsx_runtime_1.jsx)(CircularProgress_1.CircularProgress, { color: loadingIndicatorColor, size: "small" }) })));
+    return ((0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ ref: ref }, restProps, { variant: variant, color: color, loadingIndicator: (0, jsx_runtime_1.jsx)(CircularProgress_1.CircularProgress, { color: loadingIndicatorColor, size: "small" }) })));
 });
 exports.default = exports.Button;

package/DataGrid/DataGrid.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { DataGridColumns, DataGridRow, DataGridSort } from './types';
-export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Data = keyof Data> = {
+export declare type DataGridProps<Data extends object = DataGridRow, SortField extends keyof Data = keyof Data> = {
     /**
      * @example <DataGrid rows={[{name: 'test'}]} />
      * Массив данных для таблицы
@@ -41,7 +41,7 @@ export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Da
      * @example <DataGrid onSort={({fieldId: 'test', sort: 'asc'}) => console.log('sorted')} />
      * Обработчик сортировки
      */
-    onSort: (sorting: DataGridSort<SortField>[]) => void;
+    onSort?: (sorting: DataGridSort<SortField>[]) => void;
     /**
      * @example <DataGrid  Footer={<DataGridPagination />} />
      * Компонент кастомного футера (н-р Pagination)
@@ -70,4 +70,4 @@ export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Da
      */
     minDisplayRows?: number;
 };
-export declare function DataGrid<Data extends object, SortField extends keyof Data>({ columns, rows, selectedRows, sorting, maxHeight, minDisplayRows, onRowClick, onSelectRow, Footer, loading, onSort, keyId, emptyCellValue, }: DataGridProps<Data, SortField>): JSX.Element;
+export declare function DataGrid<Data extends object = DataGridRow, SortField extends keyof Data = keyof Data>({ columns, rows, selectedRows, sorting, maxHeight, minDisplayRows, onRowClick, onSelectRow, Footer, loading, onSort, keyId, emptyCellValue, }: DataGridProps<Data, SortField>): JSX.Element;

package/DataGrid/DataGridHead/DataGridHead.d.ts

@@ -5,7 +5,7 @@ export declare type DataGridHeadProps<Data = DataGridRow, SortField extends keyo
     selectable: boolean;
     onSelectAllRows: (event: ChangeEvent<HTMLInputElement>) => void;
     sorting: DataGridSort<SortField>[];
-    onSort: (sorting: DataGridSort<SortField>[]) => void;
+    onSort?: (sorting: DataGridSort<SortField>[]) => void;
     uncheckedRowsCount: number;
     rowsCount: number;
 };

package/DataGrid/DataGridHead/DataGridHead.js

@@ -32,33 +32,34 @@ function DataGridHead(_a) {
     var columns = _a.columns, selectable = _a.selectable, onSelectAllRows = _a.onSelectAllRows, rowsCount = _a.rowsCount, onSort = _a.onSort, _b = _a.sorting, sorting = _b === void 0 ? [] : _b, uncheckedRowsCount = _a.uncheckedRowsCount;
     var checked = (0, react_1.useMemo)(function () { return !Boolean(uncheckedRowsCount) && rowsCount > 0; }, [uncheckedRowsCount, rowsCount]);
     var indeterminate = (0, react_1.useMemo)(function () { return uncheckedRowsCount > 0 && uncheckedRowsCount < rowsCount; }, [uncheckedRowsCount, rowsCount]);
-    var handleSort = (0, react_1.useCallback)(function (field, sortable) {
-        if (sortable) {
-            var currentSort = sorting.find(function (_a) {
+    var handleSort = (0, react_1.useCallback)(function (field) {
+        if (!onSort) {
+            return;
+        }
+        var currentSort = sorting.find(function (_a) {
+            var fieldId = _a.fieldId;
+            return fieldId === field;
+        });
+        // если для выбранного столбца текущая сортировка ASC - меняем на DESC
+        if (currentSort && currentSort.sort === constants_1.SortStates.ASC) {
+            var newSorting = __spreadArray(__spreadArray([], sorting.filter(function (_a) {
+                var fieldId = _a.fieldId;
+                return fieldId !== field;
+            }), true), [
+                { fieldId: field, sort: constants_1.SortStates.DESC },
+            ], false);
+            return onSort(newSorting);
+            // если для выбранного столбца текущая сортировка DESC - убираем сортировку
+        }
+        else if (currentSort && currentSort.sort === constants_1.SortStates.DESC) {
+            var newSorting = sorting.filter(function (_a) {
                 var fieldId = _a.fieldId;
-                return fieldId === field;
+                return fieldId !== field;
             });
-            // если для выбранного столбца текущая сортировка ASC - меняем на DESC
-            if (currentSort && currentSort.sort === constants_1.SortStates.ASC) {
-                var newSorting = __spreadArray(__spreadArray([], sorting.filter(function (_a) {
-                    var fieldId = _a.fieldId;
-                    return fieldId !== field;
-                }), true), [
-                    { fieldId: field, sort: constants_1.SortStates.DESC },
-                ], false);
-                return onSort(newSorting);
-                // если для выбранного столбца текущая сортировка DESC - убираем сортировку
-            }
-            else if (currentSort && currentSort.sort === constants_1.SortStates.DESC) {
-                var newSorting = sorting.filter(function (_a) {
-                    var fieldId = _a.fieldId;
-                    return fieldId !== field;
-                });
-                return onSort(newSorting);
-            }
-            // если для выбранного столбца нет сортировки - добавляем сортировку ASC
-            onSort(__spreadArray(__spreadArray([], sorting, true), [{ fieldId: field, sort: constants_1.SortStates.ASC }], false));
+            return onSort(newSorting);
         }
+        // если для выбранного столбца нет сортировки - добавляем сортировку ASC
+        onSort(__spreadArray(__spreadArray([], sorting, true), [{ fieldId: field, sort: constants_1.SortStates.ASC }], false));
     }, [sorting, onSort]);
     var renderColumns = (0, react_1.useMemo)(function () {
         return columns.map(function (_a) {

package/DataGrid/DataGridHeadColumn/DataGridHeadColumn.d.ts

@@ -2,7 +2,7 @@ import { CSSProperties } from 'react';
 import { TableCellProps } from '@mui/material';
 import { DataGridRow, DataGridSort } from '../types';
 export declare type DataGridHeadColumnProps<Data = DataGridRow, SortField extends keyof Data = keyof Data> = {
-    onSort: (field: SortField, sortable?: boolean) => void;
+    onSort: (field: SortField) => void;
     sorting: DataGridSort<SortField>[];
     label?: string;
     sortable?: boolean;

package/DataGrid/DataGridHeadColumn/DataGridHeadColumn.js

@@ -26,10 +26,10 @@ function DataGridHeadColumn(_a) {
     var hideSortIcon = (0, react_1.useMemo)(function () { return !Boolean(sortParams); }, [sortParams]);
     var sortDirection = (0, react_1.useMemo)(function () { return (sortParams ? sortParams.sort : constants_1.SortStates.ASC); }, [sortParams]);
     var handleSortClick = function () {
-        if (field) {
-            onSort(field, sortable);
+        if (field && sortable) {
+            onSort(field);
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(styled_1.StyledTableCell, __assign({ onClick: handleSortClick, align: align, width: width }, { children: [(0, jsx_runtime_1.jsx)(Typography_1.Typography, __assign({ variant: "pointer" }, { children: label })), sortable && ((0, jsx_runtime_1.jsx)(styled_1.StyledTableSortLabel, { hideSortIcon: hideSortIcon, direction: sortDirection, active: true }))] })));
+    return ((0, jsx_runtime_1.jsxs)(styled_1.StyledTableCell, __assign({ onClick: handleSortClick, align: align, width: width, sortable: sortable }, { children: [(0, jsx_runtime_1.jsx)(Typography_1.Typography, __assign({ variant: "pointer" }, { children: label })), sortable && ((0, jsx_runtime_1.jsx)(styled_1.StyledTableSortLabel, { hideSortIcon: hideSortIcon, direction: sortDirection, active: true }))] })));
 }
 exports.DataGridHeadColumn = DataGridHeadColumn;

package/DataGrid/DataGridHeadColumn/styled.d.ts

@@ -35,4 +35,5 @@ export declare const StyledTableCell: import("@emotion/styled").StyledComponent<
     theme?: import("@emotion/react").Theme | undefined;
 } & {
     width?: CSSProperties['width'];
+    sortable?: boolean | undefined;
 }, {}, {}>;

package/DataGrid/DataGridHeadColumn/styled.js

@@ -13,8 +13,17 @@ exports.StyledTableSortLabel = (0, styles_1.styled)(Table_1.TableSortLabel)(temp
 });
 exports.StyledTableCell = (0, styles_1.styled)(Table_1.TableCell, {
     shouldForwardProp: function (prop) { return prop !== 'width'; },
-})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", ";\n\n  cursor: pointer;\n\n  user-select: none;\n"], ["\n  width: ", ";\n\n  cursor: pointer;\n\n  user-select: none;\n"])), function (_a) {
+})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", ";\n\n  cursor: ", ";\n  padding: ", ";\n  color: ", ";\n  user-select: none;\n"], ["\n  width: ", ";\n\n  cursor: ", ";\n  padding: ", ";\n  color: ", ";\n  user-select: none;\n"])), function (_a) {
     var _b = _a.width, width = _b === void 0 ? 'auto' : _b;
     return width;
+}, function (_a) {
+    var sortable = _a.sortable;
+    return (sortable ? 'pointer' : 'initial');
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(3, 4);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[700];
 });
 var templateObject_1, templateObject_2;

package/Notification/NotificationContainer/NotificationContainer.js

@@ -17,7 +17,9 @@ var react_toastify_1 = require("react-toastify");
 var inject_style_1 = require("react-toastify/dist/inject-style");
 var constants_1 = require("../constants");
 var styled_1 = require("./styled");
-(0, inject_style_1.injectStyle)();
+if (typeof window !== 'undefined') {
+    (0, inject_style_1.injectStyle)();
+}
 var NotificationContainer = function (props) {
     return ((0, jsx_runtime_1.jsx)(styled_1.ToastContainerStyled, { children: (0, jsx_runtime_1.jsx)(react_toastify_1.ToastContainer, __assign({ hideProgressBar: true, pauseOnFocusLoss: true, position: constants_1.NOTIFY_POSITIONS.BOTTOM_RIGHT, newestOnTop: false, closeOnClick: false, draggable: false, rtl: false }, props, { closeButton: false, bodyClassName: "notify__body", toastClassName: "notify", progressClassName: "notify__progress", className: "notify__container" })) }));
 };

package/esm/Button/Button.js

@@ -23,17 +23,17 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { LoadingButton } from '@mui/lab';
 import { forwardRef, useMemo } from 'react';
-import { ButtonVariants } from '../ButtonBase';
+import { ButtonColors, ButtonVariants } from '../ButtonBase';
 import { CircularProgress } from '../CircularProgress';
 import { CircularProgressColors } from '../CircularProgress/constants';
 export var Button = forwardRef(function (props, ref) {
-    var _a = props.variant, variant = _a === void 0 ? ButtonVariants.CONTAINED : _a, restProps = __rest(props, ["variant"]);
+    var _a = props.variant, variant = _a === void 0 ? ButtonVariants.CONTAINED : _a, _b = props.color, color = _b === void 0 ? ButtonColors.PRIMARY : _b, restProps = __rest(props, ["variant", "color"]);
     var loadingIndicatorColor = useMemo(function () {
         if (variant !== ButtonVariants.CONTAINED) {
             return CircularProgressColors.PRIMARY;
         }
         return CircularProgressColors.INVERTED;
     }, [variant]);
-    return (_jsx(LoadingButton, __assign({ ref: ref }, restProps, { variant: variant, loadingIndicator: _jsx(CircularProgress, { color: loadingIndicatorColor, size: "small" }) })));
+    return (_jsx(LoadingButton, __assign({ ref: ref }, restProps, { variant: variant, color: color, loadingIndicator: _jsx(CircularProgress, { color: loadingIndicatorColor, size: "small" }) })));
 });
 export default Button;

package/esm/DataGrid/DataGrid.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { DataGridColumns, DataGridRow, DataGridSort } from './types';
-export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Data = keyof Data> = {
+export declare type DataGridProps<Data extends object = DataGridRow, SortField extends keyof Data = keyof Data> = {
     /**
      * @example <DataGrid rows={[{name: 'test'}]} />
      * Массив данных для таблицы
@@ -41,7 +41,7 @@ export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Da
      * @example <DataGrid onSort={({fieldId: 'test', sort: 'asc'}) => console.log('sorted')} />
      * Обработчик сортировки
      */
-    onSort: (sorting: DataGridSort<SortField>[]) => void;
+    onSort?: (sorting: DataGridSort<SortField>[]) => void;
     /**
      * @example <DataGrid  Footer={<DataGridPagination />} />
      * Компонент кастомного футера (н-р Pagination)
@@ -70,4 +70,4 @@ export declare type DataGridProps<Data = DataGridRow, SortField extends keyof Da
      */
     minDisplayRows?: number;
 };
-export declare function DataGrid<Data extends object, SortField extends keyof Data>({ columns, rows, selectedRows, sorting, maxHeight, minDisplayRows, onRowClick, onSelectRow, Footer, loading, onSort, keyId, emptyCellValue, }: DataGridProps<Data, SortField>): JSX.Element;
+export declare function DataGrid<Data extends object = DataGridRow, SortField extends keyof Data = keyof Data>({ columns, rows, selectedRows, sorting, maxHeight, minDisplayRows, onRowClick, onSelectRow, Footer, loading, onSort, keyId, emptyCellValue, }: DataGridProps<Data, SortField>): JSX.Element;

package/esm/DataGrid/DataGridHead/DataGridHead.d.ts

@@ -5,7 +5,7 @@ export declare type DataGridHeadProps<Data = DataGridRow, SortField extends keyo
     selectable: boolean;
     onSelectAllRows: (event: ChangeEvent<HTMLInputElement>) => void;
     sorting: DataGridSort<SortField>[];
-    onSort: (sorting: DataGridSort<SortField>[]) => void;
+    onSort?: (sorting: DataGridSort<SortField>[]) => void;
     uncheckedRowsCount: number;
     rowsCount: number;
 };

package/esm/DataGrid/DataGridHead/DataGridHead.js

@@ -29,33 +29,34 @@ export function DataGridHead(_a) {
     var columns = _a.columns, selectable = _a.selectable, onSelectAllRows = _a.onSelectAllRows, rowsCount = _a.rowsCount, onSort = _a.onSort, _b = _a.sorting, sorting = _b === void 0 ? [] : _b, uncheckedRowsCount = _a.uncheckedRowsCount;
     var checked = useMemo(function () { return !Boolean(uncheckedRowsCount) && rowsCount > 0; }, [uncheckedRowsCount, rowsCount]);
     var indeterminate = useMemo(function () { return uncheckedRowsCount > 0 && uncheckedRowsCount < rowsCount; }, [uncheckedRowsCount, rowsCount]);
-    var handleSort = useCallback(function (field, sortable) {
-        if (sortable) {
-            var currentSort = sorting.find(function (_a) {
+    var handleSort = useCallback(function (field) {
+        if (!onSort) {
+            return;
+        }
+        var currentSort = sorting.find(function (_a) {
+            var fieldId = _a.fieldId;
+            return fieldId === field;
+        });
+        // если для выбранного столбца текущая сортировка ASC - меняем на DESC
+        if (currentSort && currentSort.sort === SortStates.ASC) {
+            var newSorting = __spreadArray(__spreadArray([], sorting.filter(function (_a) {
+                var fieldId = _a.fieldId;
+                return fieldId !== field;
+            }), true), [
+                { fieldId: field, sort: SortStates.DESC },
+            ], false);
+            return onSort(newSorting);
+            // если для выбранного столбца текущая сортировка DESC - убираем сортировку
+        }
+        else if (currentSort && currentSort.sort === SortStates.DESC) {
+            var newSorting = sorting.filter(function (_a) {
                 var fieldId = _a.fieldId;
-                return fieldId === field;
+                return fieldId !== field;
             });
-            // если для выбранного столбца текущая сортировка ASC - меняем на DESC
-            if (currentSort && currentSort.sort === SortStates.ASC) {
-                var newSorting = __spreadArray(__spreadArray([], sorting.filter(function (_a) {
-                    var fieldId = _a.fieldId;
-                    return fieldId !== field;
-                }), true), [
-                    { fieldId: field, sort: SortStates.DESC },
-                ], false);
-                return onSort(newSorting);
-                // если для выбранного столбца текущая сортировка DESC - убираем сортировку
-            }
-            else if (currentSort && currentSort.sort === SortStates.DESC) {
-                var newSorting = sorting.filter(function (_a) {
-                    var fieldId = _a.fieldId;
-                    return fieldId !== field;
-                });
-                return onSort(newSorting);
-            }
-            // если для выбранного столбца нет сортировки - добавляем сортировку ASC
-            onSort(__spreadArray(__spreadArray([], sorting, true), [{ fieldId: field, sort: SortStates.ASC }], false));
+            return onSort(newSorting);
         }
+        // если для выбранного столбца нет сортировки - добавляем сортировку ASC
+        onSort(__spreadArray(__spreadArray([], sorting, true), [{ fieldId: field, sort: SortStates.ASC }], false));
     }, [sorting, onSort]);
     var renderColumns = useMemo(function () {
         return columns.map(function (_a) {

package/esm/DataGrid/DataGridHeadColumn/DataGridHeadColumn.d.ts

@@ -2,7 +2,7 @@ import { CSSProperties } from 'react';
 import { TableCellProps } from '@mui/material';
 import { DataGridRow, DataGridSort } from '../types';
 export declare type DataGridHeadColumnProps<Data = DataGridRow, SortField extends keyof Data = keyof Data> = {
-    onSort: (field: SortField, sortable?: boolean) => void;
+    onSort: (field: SortField) => void;
     sorting: DataGridSort<SortField>[];
     label?: string;
     sortable?: boolean;

package/esm/DataGrid/DataGridHeadColumn/DataGridHeadColumn.js

@@ -23,9 +23,9 @@ export function DataGridHeadColumn(_a) {
     var hideSortIcon = useMemo(function () { return !Boolean(sortParams); }, [sortParams]);
     var sortDirection = useMemo(function () { return (sortParams ? sortParams.sort : SortStates.ASC); }, [sortParams]);
     var handleSortClick = function () {
-        if (field) {
-            onSort(field, sortable);
+        if (field && sortable) {
+            onSort(field);
         }
     };
-    return (_jsxs(StyledTableCell, __assign({ onClick: handleSortClick, align: align, width: width }, { children: [_jsx(Typography, __assign({ variant: "pointer" }, { children: label })), sortable && (_jsx(StyledTableSortLabel, { hideSortIcon: hideSortIcon, direction: sortDirection, active: true }))] })));
+    return (_jsxs(StyledTableCell, __assign({ onClick: handleSortClick, align: align, width: width, sortable: sortable }, { children: [_jsx(Typography, __assign({ variant: "pointer" }, { children: label })), sortable && (_jsx(StyledTableSortLabel, { hideSortIcon: hideSortIcon, direction: sortDirection, active: true }))] })));
 }

package/esm/DataGrid/DataGridHeadColumn/styled.d.ts

@@ -35,4 +35,5 @@ export declare const StyledTableCell: import("@emotion/styled").StyledComponent<
     theme?: import("@emotion/react").Theme | undefined;
 } & {
     width?: CSSProperties['width'];
+    sortable?: boolean | undefined;
 }, {}, {}>;

package/esm/DataGrid/DataGridHeadColumn/styled.js

@@ -10,8 +10,17 @@ export var StyledTableSortLabel = styled(TableSortLabel)(templateObject_1 || (te
 });
 export var StyledTableCell = styled(TableCell, {
     shouldForwardProp: function (prop) { return prop !== 'width'; },
-})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", ";\n\n  cursor: pointer;\n\n  user-select: none;\n"], ["\n  width: ", ";\n\n  cursor: pointer;\n\n  user-select: none;\n"])), function (_a) {
+})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: ", ";\n\n  cursor: ", ";\n  padding: ", ";\n  color: ", ";\n  user-select: none;\n"], ["\n  width: ", ";\n\n  cursor: ", ";\n  padding: ", ";\n  color: ", ";\n  user-select: none;\n"])), function (_a) {
     var _b = _a.width, width = _b === void 0 ? 'auto' : _b;
     return width;
+}, function (_a) {
+    var sortable = _a.sortable;
+    return (sortable ? 'pointer' : 'initial');
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(3, 4);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[700];
 });
 var templateObject_1, templateObject_2;

package/esm/Notification/NotificationContainer/NotificationContainer.js

@@ -14,7 +14,9 @@ import { ToastContainer } from 'react-toastify';
 import { injectStyle } from 'react-toastify/dist/inject-style';
 import { NOTIFY_POSITIONS } from '../constants';
 import { ToastContainerStyled } from './styled';
-injectStyle();
+if (typeof window !== 'undefined') {
+    injectStyle();
+}
 export var NotificationContainer = function (props) {
     return (_jsx(ToastContainerStyled, { children: _jsx(ToastContainer, __assign({ hideProgressBar: true, pauseOnFocusLoss: true, position: NOTIFY_POSITIONS.BOTTOM_RIGHT, newestOnTop: false, closeOnClick: false, draggable: false, rtl: false }, props, { closeButton: false, bodyClassName: "notify__body", toastClassName: "notify", progressClassName: "notify__progress", className: "notify__container" })) }));
 };

package/esm/theme/components/MuiOutlinedInput.js

@@ -33,6 +33,7 @@ export var MuiOutlinedInput = {
         input: function (_a) {
             var theme = _a.theme;
             return {
+                height: 20,
                 padding: theme.spacing(2.5, 2),
                 borderRadius: theme.shape.small,
                 '&:disabled': {
@@ -47,14 +48,14 @@ export var MuiOutlinedInput = {
         inputSizeSmall: function (_a) {
             var theme = _a.theme;
             return {
-                paddingBlock: theme.spacing(2),
-                paddingInline: theme.spacing(1.5),
+                paddingBlock: theme.spacing(1.5),
+                paddingInline: theme.spacing(2),
             };
         },
         notchedOutline: function (_a) {
             var theme = _a.theme;
             return {
-                borderWidth: '2px',
+                borderWidth: 2,
                 borderColor: theme.palette.grey[300],
             };
         },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "0.40.1",
+  "version": "0.41.2",
   "browser": "./src/index.ts",
   "jest": {
     "moduleNameMapper": {
@@ -8,7 +8,7 @@
     }
   },
   "dependencies": {
-    "@astral/icons": "^0.40.1",
+    "@astral/icons": "^0.41.2",
     "@emotion/cache": "11.7.1",
     "@emotion/react": "11.9.0",
     "@emotion/server": "11.4.0",

package/theme/components/MuiOutlinedInput.js

@@ -36,6 +36,7 @@ exports.MuiOutlinedInput = {
         input: function (_a) {
             var theme = _a.theme;
             return {
+                height: 20,
                 padding: theme.spacing(2.5, 2),
                 borderRadius: theme.shape.small,
                 '&:disabled': {
@@ -50,14 +51,14 @@ exports.MuiOutlinedInput = {
         inputSizeSmall: function (_a) {
             var theme = _a.theme;
             return {
-                paddingBlock: theme.spacing(2),
-                paddingInline: theme.spacing(1.5),
+                paddingBlock: theme.spacing(1.5),
+                paddingInline: theme.spacing(2),
             };
         },
         notchedOutline: function (_a) {
             var theme = _a.theme;
             return {
-                borderWidth: '2px',
+                borderWidth: 2,
                 borderColor: theme.palette.grey[300],
             };
         },