@astral/ui 0.1.1 → 0.1.2-beta.1

package/cjs/src/TextField/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/cjs/src/Typography/Typography.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { TypographyProps as MuiTypographyProps } from '@mui/material/Typography';
 import { Variant } from '@mui/material/styles/createTypography';
 export declare type TypographyProps = Omit<MuiTypographyProps, 'variant'> & {

package/cjs/src/index.d.ts

@@ -2,7 +2,12 @@ export * from './Button';
 export * from './ButtonBase';
 export * from './IconButton';
 export * from './Badge';
+export * from './Checkbox';
+export * from './FormControlLabel';
 export * from './Typography';
+export * from './Menu';
+export * from './MenuItem';
+export * from './MenuList';
 export * from './theme';
 export * from './styles';
 export * from './ThemeProvider';

package/cjs/src/index.js

@@ -14,7 +14,12 @@ __exportStar(require("./Button"), exports);
 __exportStar(require("./ButtonBase"), exports);
 __exportStar(require("./IconButton"), exports);
 __exportStar(require("./Badge"), exports);
+__exportStar(require("./Checkbox"), exports);
+__exportStar(require("./FormControlLabel"), exports);
 __exportStar(require("./Typography"), exports);
+__exportStar(require("./Menu"), exports);
+__exportStar(require("./MenuItem"), exports);
+__exportStar(require("./MenuList"), exports);
 __exportStar(require("./theme"), exports);
 __exportStar(require("./styles"), exports);
 __exportStar(require("./ThemeProvider"), exports);

package/cjs/src/theme/__tests__/BaseTheme.test.js

@@ -51,6 +51,6 @@ describe('createTheme', function () {
     });
     it('Theme has elevation params', function () {
         var theme = (0, baseTheme_1.createTheme)({ brand: constants_1.Brand.SIGN, fontsUrls: fontsUrls });
-        expect(theme.elevation[100]).toBe('box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 1px 1px 0px #072D5740;');
+        expect(theme.elevation[100]).toBe('0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;');
     });
 });

package/cjs/src/theme/baseTheme.d.ts

@@ -1,16 +1,17 @@
 import { Palette as MuiPalette, Theme as MuiTheme, PaletteColor, ThemeOptions } from '@mui/material/styles';
 import { TypographyThemeOptions } from './typography';
-import { Color } from './palette';
+import { Background, Color } from './palette';
 import { FontsUrls } from './components';
 import { Brand } from './constants';
 import { Elevation } from './elevation';
 import { Shape } from './shape';
-export declare type Palette = Omit<MuiPalette, 'grey'> & {
+export declare type Palette = Omit<MuiPalette, 'grey' | 'background'> & {
     red: Color;
     green: Color;
     yellow: Color;
     grey: Color;
     primary: PaletteColor & Color;
+    background: Background;
 };
 export declare type Theme = Omit<MuiTheme, 'shadows' | 'palette' | 'shape' | 'typography'> & {
     elevation: Elevation;
@@ -23,5 +24,5 @@ declare type CreateThemeParams = {
     options?: ThemeOptions;
     fontsUrls: FontsUrls;
 };
-export declare const createTheme: ({ brand, options, fontsUrls, }: CreateThemeParams) => Theme;
+export declare const createTheme: (params: CreateThemeParams) => Theme;
 export {};

package/cjs/src/theme/baseTheme.js

@@ -9,8 +9,8 @@ var components_1 = require("./components");
 var constants_1 = require("./constants");
 var elevation_1 = require("./elevation");
 var shape_1 = require("./shape");
-var createTheme = function (_a) {
-    var brand = _a.brand, options = _a.options, fontsUrls = _a.fontsUrls;
+var createTheme = function (params) {
+    var brand = params.brand, options = params.options, fontsUrls = params.fontsUrls;
     var themeOptions = {
         typography: typography_1.typography,
         spacing: constants_1.SPACING,

package/cjs/src/theme/components/MuiFormHelperText.d.ts

@@ -0,0 +1,4 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiFormHelperText: Components<Theme>['MuiFormHelperText'];
+export default MuiFormHelperText;

package/cjs/src/theme/components/MuiFormHelperText.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiFormHelperText = void 0;
+exports.MuiFormHelperText = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                margin: theme.spacing(1, 0, 0),
+                lineHeight: theme.typography.pxToRem(16),
+                '&.Mui-error': {
+                    color: theme.palette.error.dark,
+                },
+            };
+        },
+    },
+};
+exports.default = exports.MuiFormHelperText;

package/cjs/src/theme/components/MuiFormLabel.d.ts

@@ -0,0 +1,4 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiFormLabel: Components<Theme>['MuiFormLabel'];
+export default MuiFormLabel;

package/cjs/src/theme/components/MuiFormLabel.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiFormLabel = void 0;
+exports.MuiFormLabel = {
+    styleOverrides: {
+        root: function () {
+            return {
+                position: 'relative',
+                transform: 'none',
+            };
+        },
+    },
+};
+exports.default = exports.MuiFormLabel;

package/cjs/src/theme/components/MuiInputBase.d.ts

@@ -0,0 +1,4 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiInputBase: Components<Theme>['MuiInputBase'];
+export default MuiInputBase;

package/cjs/src/theme/components/MuiInputBase.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiInputBase = void 0;
+exports.MuiInputBase = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                '&.MuiInputBase-colorSuccess + .MuiFormHelperText-root': {
+                    color: theme.palette.green[800],
+                },
+            };
+        },
+    },
+};
+exports.default = exports.MuiInputBase;

package/cjs/src/theme/components/MuiInputLabel.d.ts

@@ -0,0 +1,4 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiInputLabel: Components<Theme>['MuiInputLabel'];
+export default MuiInputLabel;

package/cjs/src/theme/components/MuiInputLabel.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiInputLabel = void 0;
+exports.MuiInputLabel = {
+    defaultProps: {
+        shrink: true,
+    },
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                position: 'relative',
+                transform: 'none',
+                color: theme.palette.grey[700],
+                fontWeight: theme.typography.fontWeightMedium,
+                fontSize: theme.typography.pxToRem(12),
+                lineHeight: theme.typography.pxToRem(16),
+                marginBottom: theme.spacing(1),
+                '&.Mui-focused': {
+                    color: theme.palette.grey[700],
+                },
+                '&.Mui-error': {
+                    color: theme.palette.grey[700],
+                },
+                '&.Mui-disabled': {
+                    color: theme.palette.grey[600],
+                },
+            };
+        },
+    },
+};
+exports.default = exports.MuiInputLabel;

package/cjs/src/theme/components/MuiOutlinedInput.d.ts

@@ -0,0 +1,4 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiOutlinedInput: Components<Theme>['MuiOutlinedInput'];
+export default MuiOutlinedInput;

package/cjs/src/theme/components/MuiOutlinedInput.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiOutlinedInput = void 0;
+exports.MuiOutlinedInput = {
+    defaultProps: {
+        notched: false,
+    },
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                fontSize: theme.typography.pxToRem(14),
+                borderRadius: theme.shape.small,
+                color: theme.palette.grey[900],
+                background: theme.palette.background.element,
+                '&:hover': {
+                    // FIXME: to theme
+                    background: '#EEF1F4',
+                },
+                '&:hover .MuiOutlinedInput-notchedOutline': {
+                    borderColor: theme.palette.grey[300],
+                },
+                '&.Mui-disabled .MuiOutlinedInput-notchedOutline': {
+                    borderColor: theme.palette.background.element,
+                },
+                '&.Mui-error .MuiOutlinedInput-notchedOutline': {
+                    borderColor: theme.palette.error.dark,
+                },
+                '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
+                    borderColor: theme.palette.primary[700],
+                },
+            };
+        },
+        input: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(2.5, 2),
+                borderRadius: theme.shape.small,
+                '&:disabled': {
+                    background: theme.palette.background.element,
+                },
+                '&::placeholder': {
+                    opacity: 1,
+                    color: theme.palette.grey[600],
+                },
+            };
+        },
+        inputSizeSmall: function (_a) {
+            var theme = _a.theme;
+            return {
+                paddingBlock: theme.spacing(2),
+                paddingInline: theme.spacing(1.5),
+            };
+        },
+        notchedOutline: function (_a) {
+            var theme = _a.theme;
+            return {
+                borderWidth: '2px',
+                borderColor: theme.palette.grey[300],
+            };
+        },
+    },
+};
+exports.default = exports.MuiOutlinedInput;

package/cjs/src/theme/components/MuiTypography.d.ts

@@ -0,0 +1,21 @@
+import { Components } from '@mui/material';
+export declare type FontsUrls = {
+    bold: {
+        woff: string;
+        woff2: string;
+    };
+    light: {
+        woff: string;
+        woff2: string;
+    };
+    medium: {
+        woff: string;
+        woff2: string;
+    };
+    regular: {
+        woff: string;
+        woff2: string;
+    };
+};
+export declare const MuiTypography: Components['MuiTypography'];
+export default MuiTypography;

package/cjs/src/theme/components/MuiTypography.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiTypography = void 0;
+exports.MuiTypography = {
+    variants: [
+        {
+            props: { variant: 'button' },
+            style: {
+                textTransform: 'capitalize',
+            },
+        },
+    ],
+    defaultProps: {
+        // TODO: необходимо кастомизировать типы Components['MuiTypography']
+        variantMapping: {
+            link: 'a',
+            code: 'code',
+        },
+    },
+};
+exports.default = exports.MuiTypography;

package/cjs/src/theme/{components.d.ts → components/components.d.ts}

@@ -1,4 +1,5 @@
 import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
 export declare type FontsUrls = {
     bold: {
         woff: string;
@@ -17,4 +18,4 @@ export declare type FontsUrls = {
         woff2: string;
     };
 };
-export declare const getComponents: (fontUrls: FontsUrls) => Components;
+export declare const getComponents: (fontUrls: FontsUrls) => Components<Theme>;

package/cjs/src/theme/components/components.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getComponents = void 0;
+var MuiInputBase_1 = require("./MuiInputBase");
+var MuiFormHelperText_1 = require("./MuiFormHelperText");
+var MuiFormLabel_1 = require("./MuiFormLabel");
+var MuiInputLabel_1 = require("./MuiInputLabel");
+var MuiOutlinedInput_1 = require("./MuiOutlinedInput");
+var MuiTypography_1 = require("./MuiTypography");
+var getMuiCssBaseline = function (fontUrls) { return ({
+    styleOverrides: "\n    @font-face {\n      font-family: 'Ubuntu';\n      font-style: 'normal';\n      font-weight: 300;\n      font-display: swap;\n      src: url(".concat(fontUrls.light.woff2, ") format('woff2'), url(").concat(fontUrls.light.woff, ") format('woff');\n    }\n    @font-face {\n      font-family: 'Ubuntu';\n      font-style: 'normal';\n      font-weight: 400;\n      font-display: swap;\n      src: url(").concat(fontUrls.regular.woff2, ") format('woff2'), url(").concat(fontUrls.regular.woff, ") format('woff');\n    }\n    @font-face {\n      font-family: 'Ubuntu';\n      font-style: 'normal';\n      font-weight: 500;\n      font-display: swap;\n      src: url(").concat(fontUrls.medium.woff2, ") format('woff2'), url(").concat(fontUrls.medium.woff, ") format('woff');\n    }\n    @font-face {\n      font-family: 'Ubuntu';\n      font-style: 'normal';\n      font-weight: 700;\n      font-display: swap;\n      src: url(").concat(fontUrls.bold.woff2, ") format('woff2'), url(").concat(fontUrls.bold.woff, ") format('woff');\n    }\n  "),
+}); };
+var MuiCheckbox = {
+    defaultProps: {
+        disableRipple: true,
+    },
+};
+var MuiMenu = {
+    defaultProps: {
+        autoFocus: false,
+    },
+    styleOverrides: {
+        paper: function (_a) {
+            var theme = _a.theme;
+            return {
+                marginTop: theme.spacing(2),
+                '&.MuiPaper-root': {
+                    borderRadius: theme.shape.small,
+                    boxShadow: theme.elevation[200],
+                },
+            };
+        },
+        list: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(1, 0),
+            };
+        },
+    },
+};
+var MuiMenuItem = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                '&:hover': {
+                    backgroundColor: theme.palette.background.elementHover,
+                },
+            };
+        },
+    },
+};
+var getComponents = function (fontUrls) { return ({
+    MuiCssBaseline: getMuiCssBaseline(fontUrls),
+    MuiTypography: MuiTypography_1.MuiTypography,
+    MuiInputBase: MuiInputBase_1.MuiInputBase,
+    MuiInputLabel: MuiInputLabel_1.MuiInputLabel,
+    MuiOutlinedInput: MuiOutlinedInput_1.MuiOutlinedInput,
+    MuiFormLabel: MuiFormLabel_1.MuiFormLabel,
+    MuiFormHelperText: MuiFormHelperText_1.MuiFormHelperText,
+    MuiCheckbox: MuiCheckbox,
+    MuiMenu: MuiMenu,
+    MuiMenuItem: MuiMenuItem,
+}); };
+exports.getComponents = getComponents;

package/cjs/src/theme/components/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/cjs/src/theme/components/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components"), exports);

package/cjs/src/theme/elevation.js

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.elevation = void 0;
 exports.elevation = {
-    100: 'box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 1px 1px 0px #072D5740;',
-    200: 'box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 3px 5px 0px #072D5733;',
-    300: 'box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 8px 12px 0px #072D5726;',
-    400: 'box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 10px 18px 0px #072D5726;',
-    500: 'box-shadow: 0px 0px 1px 0px #072D574F; box-shadow: 0px 18px 28px 0px #072D5726;',
+    100: '0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;',
+    200: '0px 0px 1px 0px #072D574F, 0px 3px 5px 0px #072D5733;',
+    300: '0px 0px 1px 0px #072D574F, 0px 8px 12px 0px #072D5726;',
+    400: '0px 0px 1px 0px #072D574F, 0px 10px 18px 0px #072D5726;',
+    500: '0px 0px 1px 0px #072D574F, 0px 18px 28px 0px #072D5726;',
 };

package/cjs/src/theme/palette/palette.d.ts

@@ -13,7 +13,7 @@ export declare type Color = {
     100: string;
 };
 export declare type PrimaryColorOptions = PaletteColorOptions & Color;
-declare type Background = TypeBackground & {
+export declare type Background = TypeBackground & {
     element: string;
     elementHover: string;
 };

package/cjs/src/theme/typography.js

@@ -5,7 +5,7 @@ var HTML_FONT_SIZE = 14;
 // Т.к. нет досутпа к теме, написал функцию для конвертации px в rem
 var pxToRem = function (fontSize, htmlFontSize) {
     if (htmlFontSize === void 0) { htmlFontSize = HTML_FONT_SIZE; }
-    return fontSize / htmlFontSize + "rem";
+    return "".concat(fontSize / htmlFontSize, "rem");
 };
 exports.pxToRem = pxToRem;
 exports.typography = {

package/esm/src/Badge/Badge.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { BadgeProps } from './types';
 declare const Badge: ({ children, color, ...props }: BadgeProps) => JSX.Element;
 export default Badge;

package/esm/src/Badge/styled.d.ts

@@ -23,7 +23,7 @@ export declare const StyledBadge: import("@emotion/styled").StyledComponent<{
     color?: "primary" | "secondary" | "default" | "error" | "warning" | "info" | "success" | undefined;
     overlap?: "circular" | "rectangular" | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "dot" | "standard" | undefined;
+    variant?: "standard" | "dot" | undefined;
 } & {
     anchorOrigin?: import("@mui/material").BadgeOrigin | undefined;
     components?: {
@@ -43,7 +43,7 @@ export declare const StyledBadge: import("@emotion/styled").StyledComponent<{
     variant?: string | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "color" | "children" | "sx" | "variant" | "components" | "componentsProps" | "invisible" | "overlap" | "anchorOrigin" | "badgeContent" | "max" | "showZero"> & {
+}, "components" | "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "componentsProps" | "invisible" | "anchorOrigin" | "overlap" | "badgeContent" | "max" | "showZero"> & {
     theme?: Theme | undefined;
 } & Omit<BadgeProps, "color"> & {
     customColor: BadgeColor;

package/esm/src/Button/Button.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { ButtonProps } from './types';
 export declare const Button: ({ children, startIcon, endIcon, loading, ...props }: ButtonProps) => JSX.Element;

package/esm/src/ButtonBase/ButtonBase.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { BaseButtonProps } from './types';
 export declare const ButtonBase: ({ children, variant, color, ...props }: BaseButtonProps) => JSX.Element;

package/esm/src/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { CheckboxProps } from './types';
+export declare const Checkbox: ({ icon, checkedIcon, indeterminateIcon, ...props }: CheckboxProps) => JSX.Element;

package/esm/src/Checkbox/Checkbox.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StyledCheckbox } from './styled';
+import { CheckedIcon, DefaultIcon, IndeterminateIcon } from './icons';
+export var Checkbox = function (_a) {
+    var _b = _a.icon, icon = _b === void 0 ? _jsx(DefaultIcon, {}, void 0) : _b, _c = _a.checkedIcon, checkedIcon = _c === void 0 ? _jsx(CheckedIcon, {}, void 0) : _c, _d = _a.indeterminateIcon, indeterminateIcon = _d === void 0 ? _jsx(IndeterminateIcon, {}, void 0) : _d, props = __rest(_a, ["icon", "checkedIcon", "indeterminateIcon"]);
+    return (_jsx(StyledCheckbox, __assign({ icon: icon, checkedIcon: checkedIcon, indeterminateIcon: indeterminateIcon }, props), void 0));
+};

package/esm/src/Checkbox/icons.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+export declare const DefaultIcon: React.FunctionComponent<SvgIconProps>;
+export declare const CheckedIcon: React.FunctionComponent<SvgIconProps>;
+export declare const IndeterminateIcon: React.FunctionComponent<SvgIconProps>;

package/esm/src/Checkbox/icons.js

@@ -0,0 +1,36 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SvgIcon } from '@mui/material';
+export var DefaultIcon = function (_a) {
+    var props = __rest(_a, []);
+    return (_jsxs(SvgIcon, __assign({ viewBox: "0 0 14 14" }, props, { children: [_jsx("path", { d: "M0 3C0 1.34315 1.34315 0 3 0H11C12.6569 0 14 1.34315 14 3V11C14 12.6569 12.6569 14 11 14H3C1.34315 14 0 12.6569 0 11V3Z" }, void 0), _jsx("path", { className: "MuiSvgIcon-border", fillRule: "evenodd", clipRule: "evenodd", d: "M11 2H3C2.44772 2 2 2.44772 2 3V11C2 11.5523 2.44772 12 3 12H11C11.5523 12 12 11.5523 12 11V3C12 2.44772 11.5523 2 11 2ZM3 0C1.34315 0 0 1.34315 0 3V11C0 12.6569 1.34315 14 3 14H11C12.6569 14 14 12.6569 14 11V3C14 1.34315 12.6569 0 11 0H3Z" }, void 0)] }), void 0));
+};
+export var CheckedIcon = function (_a) {
+    var props = __rest(_a, []);
+    return (_jsxs(SvgIcon, __assign({ viewBox: "0 0 14 14" }, props, { children: [_jsx("rect", { width: "14", height: "14", rx: "3" }, void 0), _jsx("path", { className: "MuiSvgIcon-mark", fillRule: "evenodd", clipRule: "evenodd", d: "M4.71402 6.30066C4.62206 6.20534 4.51205 6.12931 4.39042 6.07701C4.26879 6.0247 4.13797 5.99717 4.0056 5.99602C3.87323 5.99487 3.74195 6.02012 3.61943 6.0703C3.49691 6.12048 3.3856 6.19458 3.292 6.28829C3.19839 6.38199 3.12437 6.49342 3.07424 6.61607C3.02411 6.73872 2.99889 6.87013 3.00004 7.00265C3.00119 7.13516 3.02869 7.26612 3.08094 7.38787C3.13319 7.50963 3.20914 7.61976 3.30435 7.71182L5.29823 9.7078C5.48518 9.8949 5.73871 10 6.00306 10C6.26741 10 6.52094 9.8949 6.7079 9.7078L10.6956 5.71584C10.7909 5.62377 10.8668 5.51365 10.9191 5.39189C10.9713 5.27013 10.9988 5.13918 11 5.00666C11.0011 4.87415 10.9759 4.74274 10.9258 4.62009C10.8756 4.49744 10.8016 4.38601 10.708 4.29231C10.6144 4.1986 10.5031 4.1245 10.3806 4.07432C10.258 4.02414 10.1268 3.99889 9.9944 4.00004C9.86203 4.00119 9.73121 4.02872 9.60958 4.08102C9.48795 4.13333 9.37794 4.20936 9.28598 4.30468L6.00306 7.59106L4.71402 6.30066V6.30066Z" }, void 0)] }), void 0));
+};
+export var IndeterminateIcon = function (_a) {
+    var props = __rest(_a, []);
+    return (_jsxs(SvgIcon, __assign({ viewBox: "0 0 14 14" }, props, { children: [_jsx("rect", { width: "14", height: "14", rx: "3" }, void 0), _jsx("path", { className: "MuiSvgIcon-mark", d: "M10 6H4C3.44772 6 3 6.44772 3 7C3 7.55228 3.44772 8 4 8H10C10.5523 8 11 7.55228 11 7C11 6.44772 10.5523 6 10 6Z" }, void 0)] }), void 0));
+};

package/esm/src/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Checkbox';
+export * from './types';

package/esm/src/Checkbox/index.js

@@ -0,0 +1,2 @@
+export * from './Checkbox';
+export * from './types';

package/esm/src/Checkbox/styled.d.ts

@@ -0,0 +1,4 @@
+import { CheckboxProps } from './types';
+export declare const StyledCheckbox: import("@emotion/styled").StyledComponent<import("@mui/material").CheckboxProps & {
+    theme?: import("..").Theme | undefined;
+} & CheckboxProps, {}, {}>;

package/esm/src/Checkbox/styled.js

@@ -0,0 +1,32 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { Checkbox } from '@mui/material';
+import { styled } from '../styles';
+export var StyledCheckbox = styled(Checkbox)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 5px;\n  border-radius: unset;\n  color: ", ";\n\n  &:hover {\n    color: ", ";\n  }\n\n  & .MuiSvgIcon-border {\n    color: ", ";\n  }\n\n  & > svg {\n    width: 1rem;\n    height: 1rem;\n  }\n\n  &.Mui-disabled {\n    color: ", ";\n    & .MuiSvgIcon-border {\n      color: currentColor;\n    }\n  }\n\n  &.Mui-checked,\n  &.MuiCheckbox-indeterminate {\n    color: ", ";\n\n    &:hover {\n      color: ", ";\n    }\n\n    &.Mui-disabled {\n      color: ", ";\n    }\n\n    & .MuiSvgIcon-mark {\n      color: ", ";\n    }\n  }\n"], ["\n  padding: 5px;\n  border-radius: unset;\n  color: ", ";\n\n  &:hover {\n    color: ", ";\n  }\n\n  & .MuiSvgIcon-border {\n    color: ", ";\n  }\n\n  & > svg {\n    width: 1rem;\n    height: 1rem;\n  }\n\n  &.Mui-disabled {\n    color: ", ";\n    & .MuiSvgIcon-border {\n      color: currentColor;\n    }\n  }\n\n  &.Mui-checked,\n  &.MuiCheckbox-indeterminate {\n    color: ", ";\n\n    &:hover {\n      color: ", ";\n    }\n\n    &.Mui-disabled {\n      color: ", ";\n    }\n\n    & .MuiSvgIcon-mark {\n      color: ", ";\n    }\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.palette.background.element;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[100];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[300];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[200];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.primary.main;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.primary[700];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[500];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.common.white;
+});
+var templateObject_1;

package/esm/src/Checkbox/types.d.ts

@@ -0,0 +1,2 @@
+import { CheckboxProps as MuiCheckboxProps } from '@mui/material';
+export declare type CheckboxProps = Omit<MuiCheckboxProps, 'size' | 'color'>;

package/esm/src/Checkbox/types.js

@@ -0,0 +1 @@
+export {};

package/esm/src/CircularProgress/CircularProgress.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CircularProgressProps } from './types';
 export declare const CircularProgress: ({ color, size, ...props }: CircularProgressProps) => JSX.Element;
 export default CircularProgress;