@astral/ui 0.1.1 → 0.1.2-beta.1

package/cjs/src/Grid/styled.js

@@ -0,0 +1,14 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledGrid = void 0;
+var material_1 = require("@mui/material");
+var styles_1 = require("../styles");
+exports.StyledGrid = (0, styles_1.styled)(material_1.Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: ", ";\n"], ["\n  display: ", ";\n"])), function (_a) {
+    var container = _a.container;
+    return container && 'grid';
+});
+var templateObject_1;

package/cjs/src/Grid/types.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Breakpoint } from '@mui/material/styles';
+declare type StyleCSSType<Type extends keyof React.CSSProperties> = React.CSSProperties[Type] | Partial<Record<Breakpoint, React.CSSProperties[Type]>>;
+export declare type GridContainerProps = {
+    container?: boolean;
+    templateColumns?: StyleCSSType<'gridTemplateColumns'>;
+    templateRows?: StyleCSSType<'gridTemplateRows'>;
+    templateAreas?: StyleCSSType<'gridTemplateAreas'>;
+    columnSpacing?: StyleCSSType<'gridColumnGap'>;
+    rowSpacing?: StyleCSSType<'gridRowGap'>;
+    spacing?: StyleCSSType<'gridGap'>;
+    justifyItems?: StyleCSSType<'justifyItems'>;
+    alignItems?: StyleCSSType<'alignItems'>;
+    justifyContent?: StyleCSSType<'justifyContent'>;
+    alignContent?: StyleCSSType<'alignContent'>;
+    autoColumns?: StyleCSSType<'gridAutoColumns'>;
+    autoRows?: StyleCSSType<'gridAutoRows'>;
+    autoFlow?: StyleCSSType<'gridAutoFlow'>;
+};
+export declare type GridElementsProps = {
+    column?: StyleCSSType<'gridColumn'>;
+    row?: StyleCSSType<'gridRow'>;
+    area?: StyleCSSType<'gridArea'>;
+    justifySelf?: StyleCSSType<'justifySelf'>;
+    alignSelf?: StyleCSSType<'alignSelf'>;
+};
+export declare type GridProps = GridContainerProps & GridElementsProps & {
+    children?: React.ReactNode;
+};
+export {};

package/cjs/src/Grid/types.js

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

package/cjs/src/IconButton/IconButton.d.ts

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

package/cjs/src/Menu/Menu.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuProps } from '@mui/material';
+export declare const Menu: ({ children, ...props }: MenuProps) => JSX.Element;

package/cjs/src/Menu/Menu.js

@@ -0,0 +1,32 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Menu = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var Menu = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (0, jsx_runtime_1.jsx)(material_1.Menu, __assign({}, props, { children: children }), void 0);
+};
+exports.Menu = Menu;

package/cjs/src/Menu/index.d.ts

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

package/cjs/src/Menu/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("./Menu"), exports);

package/cjs/src/MenuItem/MenuItem.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuItemProps } from '@mui/material';
+export declare const MenuItem: ({ children, ...props }: MenuItemProps) => JSX.Element;

package/cjs/src/MenuItem/MenuItem.js

@@ -0,0 +1,32 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuItem = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var MenuItem = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (0, jsx_runtime_1.jsx)(material_1.MenuItem, __assign({}, props, { children: children }), void 0);
+};
+exports.MenuItem = MenuItem;

package/cjs/src/MenuItem/index.d.ts

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

package/cjs/src/MenuItem/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("./MenuItem"), exports);

package/cjs/src/MenuList/MenuList.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuListProps } from './types';
+export declare const MenuList: ({ children, ...props }: MenuListProps) => JSX.Element;

package/cjs/src/MenuList/MenuList.js

@@ -0,0 +1,32 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuList = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = require("./styled");
+var MenuList = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    return (0, jsx_runtime_1.jsx)(styled_1.StyledMenuList, __assign({}, props, { children: children }), void 0);
+};
+exports.MenuList = MenuList;

package/cjs/src/MenuList/index.d.ts

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

package/cjs/src/MenuList/index.js

@@ -0,0 +1,14 @@
+"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("./MenuList"), exports);
+__exportStar(require("./types"), exports);

package/cjs/src/MenuList/styled.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+export declare const StyledMenuList: import("@emotion/styled").StyledComponent<{
+    autoFocus?: boolean | undefined;
+    autoFocusItem?: boolean | undefined;
+    children?: import("react").ReactNode;
+    disabledItemsFocusable?: boolean | undefined;
+    disableListWrap?: boolean | undefined;
+    variant?: "menu" | "selectedMenu" | undefined;
+} & {
+    children?: import("react").ReactNode;
+    classes?: Partial<import("@mui/material").ListClasses> | undefined;
+    dense?: boolean | undefined;
+    disablePadding?: boolean | undefined;
+    subheader?: import("react").ReactNode;
+    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "key" | keyof import("react").HTMLAttributes<HTMLUListElement>> & {
+    ref?: ((instance: HTMLUListElement | null) => void) | import("react").RefObject<HTMLUListElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "autoFocus" | "dense" | "subheader" | "disablePadding" | "autoFocusItem" | "disabledItemsFocusable" | "disableListWrap"> & {
+    theme?: import("..").Theme | undefined;
+}, {}, {}>;

package/cjs/src/MenuList/styled.js

@@ -0,0 +1,20 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledMenuList = void 0;
+var material_1 = require("@mui/material");
+var styles_1 = require("../styles");
+exports.StyledMenuList = (0, styles_1.styled)(material_1.MenuList)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  &.MuiList-root {\n    padding: ", ";\n    border-radius: ", ";\n    box-shadow: ", ";\n  }\n"], ["\n  &.MuiList-root {\n    padding: ", ";\n    border-radius: ", ";\n    box-shadow: ", ";\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(1, 0);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.shape.small;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.elevation[200];
+});
+var templateObject_1;

package/cjs/src/MenuList/types.d.ts

@@ -0,0 +1,2 @@
+import { MenuListProps as MuiMenuListProps } from '@mui/material/MenuList';
+export declare type MenuListProps = MuiMenuListProps;

package/cjs/src/MenuList/types.js

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

package/cjs/src/Tag/Tag.d.ts

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

package/cjs/src/Tag/Tag.js

@@ -0,0 +1,32 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = require("./styled");
+var Tag = function (_a) {
+    var color = _a.color, variant = _a.variant, props = __rest(_a, ["color", "variant"]);
+    return (0, jsx_runtime_1.jsx)(styled_1.StyledTag, __assign({ customColor: color, customVariant: variant }, props), void 0);
+};
+exports.Tag = Tag;

package/cjs/src/Tag/constants.d.ts

@@ -0,0 +1,21 @@
+export declare enum TagColors {
+    DEFAULT = "default",
+    PRIMARY = "primary",
+    ERROR = "error",
+    GREY = "grey",
+    SUCCESS = "success",
+    WARNING = "warning"
+}
+export declare enum TagVariants {
+    CONTAINED = "contained",
+    LIGHT = "light"
+}
+export declare enum TagSizes {
+    MEDIUM = "medium",
+    SMALL = "small"
+}
+export declare enum TagStates {
+    DEFAULT = "default",
+    HOVER = "hover",
+    ACTIVE = "active"
+}

package/cjs/src/Tag/constants.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TagStates = exports.TagSizes = exports.TagVariants = exports.TagColors = void 0;
+var TagColors;
+(function (TagColors) {
+    TagColors["DEFAULT"] = "default";
+    TagColors["PRIMARY"] = "primary";
+    TagColors["ERROR"] = "error";
+    TagColors["GREY"] = "grey";
+    TagColors["SUCCESS"] = "success";
+    TagColors["WARNING"] = "warning";
+})(TagColors = exports.TagColors || (exports.TagColors = {}));
+var TagVariants;
+(function (TagVariants) {
+    TagVariants["CONTAINED"] = "contained";
+    TagVariants["LIGHT"] = "light";
+})(TagVariants = exports.TagVariants || (exports.TagVariants = {}));
+var TagSizes;
+(function (TagSizes) {
+    TagSizes["MEDIUM"] = "medium";
+    TagSizes["SMALL"] = "small";
+})(TagSizes = exports.TagSizes || (exports.TagSizes = {}));
+var TagStates;
+(function (TagStates) {
+    TagStates["DEFAULT"] = "default";
+    TagStates["HOVER"] = "hover";
+    TagStates["ACTIVE"] = "active";
+})(TagStates = exports.TagStates || (exports.TagStates = {}));

package/cjs/src/Tag/index.d.ts

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

package/cjs/src/Tag/index.js

@@ -0,0 +1,14 @@
+"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("./Tag"), exports);
+__exportStar(require("./types"), exports);

package/cjs/src/Tag/styled.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { Theme } from '../theme';
+import { TagProps } from './types';
+export declare const StyledTag: import("@emotion/styled").StyledComponent<{
+    avatar?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+    children?: null | undefined;
+    classes?: Partial<import("@mui/material").ChipClasses> | undefined;
+    clickable?: boolean | undefined;
+    color?: "primary" | "secondary" | "default" | "error" | "warning" | "info" | "success" | undefined;
+    deleteIcon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+    disabled?: boolean | undefined;
+    icon?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+    label?: import("react").ReactNode;
+    onDelete?: ((event: any) => void) | undefined;
+    size?: "medium" | "small" | undefined;
+    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
+    variant?: "filled" | "outlined" | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "disabled" | "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "label" | "variant" | "size" | "icon" | "avatar" | "clickable" | "deleteIcon" | "onDelete"> & {
+    theme?: Theme | undefined;
+} & Omit<TagProps, "color"> & {
+    customColor?: "primary" | "default" | "error" | "grey" | "warning" | "success" | undefined;
+    customVariant?: "light" | "contained" | undefined;
+    rounded?: boolean | undefined;
+}, {}, {}>;

package/cjs/src/Tag/styled.js

@@ -0,0 +1,120 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledTag = void 0;
+var material_1 = require("@mui/material");
+var styles_1 = require("../styles");
+var constants_1 = require("./constants");
+var getShape = function (_a) {
+    var theme = _a.theme, rounded = _a.rounded;
+    if (rounded)
+        return '100px';
+    return theme.shape.small;
+};
+var getDeleteIconBorderRadius = function (_a) {
+    var theme = _a.theme, rounded = _a.rounded;
+    if (rounded)
+        return '100px';
+    return "0  ".concat(theme.shape.small, "  ").concat(theme.shape.small, " 0");
+};
+var getBgColor = function (_a) {
+    var theme = _a.theme, customColor = _a.customColor, customVariant = _a.customVariant;
+    if (customColor === constants_1.TagColors.GREY) {
+        return theme.palette.grey[100];
+    }
+    var backgroundColorVariants = {
+        contained: {
+            primary: theme.palette.primary.main,
+            error: theme.palette.red[800],
+            success: theme.palette.green[800],
+            warning: theme.palette.yellow[800],
+            default: theme.palette.background.element,
+        },
+        light: {
+            primary: theme.palette.primary[100],
+            error: theme.palette.red[100],
+            success: theme.palette.green[100],
+            warning: theme.palette.yellow[100],
+            default: theme.palette.background.element,
+        },
+    };
+    if (!customVariant) {
+        return backgroundColorVariants.contained.primary;
+    }
+    if (customVariant && customColor) {
+        return backgroundColorVariants[customVariant][customColor];
+    }
+    return theme.palette.background.element;
+};
+var getColor = function (_a) {
+    var theme = _a.theme, customColor = _a.customColor, customVariant = _a.customVariant;
+    var textColorVariants = {
+        contained: {
+            primary: theme.palette.primary.contrastText,
+            error: theme.palette.error.contrastText,
+            success: theme.palette.warning.contrastText,
+            warning: theme.palette.success.contrastText,
+            default: theme.palette.text.primary,
+        },
+        light: {
+            primary: theme.palette.primary.main,
+            error: theme.palette.red[800],
+            success: theme.palette.green[800],
+            warning: theme.palette.yellow[800],
+            default: theme.palette.text.primary,
+        },
+    };
+    if (!customColor) {
+        return textColorVariants.contained.primary;
+    }
+    if (customVariant && customColor) {
+        return textColorVariants[customVariant][customColor];
+    }
+    return theme.palette.text.primary;
+};
+var getTagLabelPadding = function (_a) {
+    var theme = _a.theme, rounded = _a.rounded;
+    if (rounded)
+        return theme.spacing(0, 2);
+    return theme.spacing(0, 1);
+};
+var getDeleteIconBgColor = function (_a) {
+    var theme = _a.theme, iconState = _a.iconState;
+    var bgColorDeleteIcon = {
+        default: 'transparent',
+        hover: theme.palette.red[100],
+        active: theme.palette.red[200],
+    };
+    if (iconState) {
+        return bgColorDeleteIcon[iconState];
+    }
+    return 'transparent';
+};
+exports.StyledTag = (0, styles_1.styled)(material_1.Chip)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  user-select: none;\n  font-size: 14px;\n  height: 20px;\n  border-radius: ", ";\n  background-color: ", ";\n  &:hover {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:active {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .MuiChip-label {\n    padding: ", ";\n\n    color: ", ";\n\n    &:hover {\n      color: ", ";\n    }\n    &:active {\n      color: ", ";\n    }\n  }\n  .MuiChip-deleteIcon {\n    margin: 0;\n    width: 20px;\n    height: 20px;\n    border-radius: ", ";\n\n    background: ", ";\n\n    &:hover {\n      background: ", ";\n    }\n    &:active {\n      background: ", ";\n    }\n  }\n  .MuiChip-avatar {\n    margin: 2px;\n    width: 16px;\n    height: 16px;\n  }\n  .MuiChip-icon {\n    width: 16px;\n    height: 16px;\n  }\n"], ["\n  user-select: none;\n  font-size: 14px;\n  height: 20px;\n  border-radius: ", ";\n  background-color: ", ";\n  &:hover {\n    background-color: ", ";\n    color: ", ";\n  }\n  &:active {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .MuiChip-label {\n    padding: ", ";\n\n    color: ", ";\n\n    &:hover {\n      color: ", ";\n    }\n    &:active {\n      color: ", ";\n    }\n  }\n  .MuiChip-deleteIcon {\n    margin: 0;\n    width: 20px;\n    height: 20px;\n    border-radius: ", ";\n\n    background: ", ";\n\n    &:hover {\n      background: ", ";\n    }\n    &:active {\n      background: ", ";\n    }\n  }\n  .MuiChip-avatar {\n    margin: 2px;\n    width: 16px;\n    height: 16px;\n  }\n  .MuiChip-icon {\n    width: 16px;\n    height: 16px;\n  }\n"])), function (props) { return getShape(__assign({}, props)); }, function (props) {
+    return getBgColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.DEFAULT }));
+}, function (props) {
+    return getBgColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.HOVER }));
+}, function (props) { return getColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.HOVER })); }, function (props) {
+    return getBgColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.ACTIVE }));
+}, function (props) { return getColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.ACTIVE })); }, function (props) { return getTagLabelPadding(__assign({}, props)); }, function (props) { return getColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.DEFAULT })); }, function (props) { return getColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.HOVER })); }, function (props) { return getColor(__assign(__assign({}, props), { tagState: constants_1.TagStates.ACTIVE })); }, function (props) { return getDeleteIconBorderRadius(__assign({}, props)); }, function (props) {
+    return getDeleteIconBgColor(__assign(__assign({}, props), { iconState: constants_1.TagStates.DEFAULT }));
+}, function (props) {
+    return getDeleteIconBgColor(__assign(__assign({}, props), { iconState: constants_1.TagStates.HOVER }));
+}, function (props) {
+    return getDeleteIconBgColor(__assign(__assign({}, props), { iconState: constants_1.TagStates.ACTIVE }));
+});
+var templateObject_1;

package/cjs/src/Tag/types.d.ts

@@ -0,0 +1,12 @@
+import { ChipProps as MuiTagProps } from '@mui/material/Chip/Chip';
+import { TagColors, TagSizes, TagStates, TagVariants } from './constants';
+export declare type TagColor = `${TagColors}`;
+export declare type TagVariant = `${TagVariants}`;
+export declare type TagSize = `${TagSizes}`;
+export declare type TagState = `${TagStates}`;
+export declare type TagProps = Omit<MuiTagProps, 'color' | 'variant'> & {
+    color?: TagColor;
+    variant?: TagVariant;
+    size?: TagSize;
+    rounded?: boolean;
+};

package/cjs/src/Tag/types.js

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

package/cjs/src/TextField/TextField.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { TextFieldProps } from './types';
+export declare const TextField: (props: TextFieldProps) => JSX.Element;
+export default TextField;

package/cjs/src/TextField/TextField.js

@@ -0,0 +1,53 @@
+"use strict";
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextField = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var TextField_1 = __importDefault(require("@mui/material/TextField"));
+var FormHelperText_1 = require("../FormHelperText");
+var TextField = function (props) {
+    var variant = props.variant, success = props.success, error = props.error, colorProp = props.color, helperTextProp = props.helperText, restProps = __rest(props, ["variant", "success", "error", "color", "helperText"]);
+    var color = (0, react_1.useMemo)(function () {
+        if (success) {
+            return 'success';
+        }
+        return undefined;
+    }, [success]);
+    var helperText = (0, react_1.useMemo)(function () {
+        if (success) {
+            return (0, jsx_runtime_1.jsx)(FormHelperText_1.FormHelperText, __assign({ success: true }, { children: helperTextProp }), void 0);
+        }
+        if (error) {
+            return (0, jsx_runtime_1.jsx)(FormHelperText_1.FormHelperText, __assign({ error: true }, { children: helperTextProp }), void 0);
+        }
+        return helperTextProp;
+    }, [helperTextProp, success, error]);
+    return ((0, jsx_runtime_1.jsx)(TextField_1.default, __assign({ variant: "outlined", error: error, color: color, helperText: helperText }, restProps), void 0));
+};
+exports.TextField = TextField;
+exports.default = exports.TextField;

package/cjs/src/TextField/index.d.ts

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

package/cjs/src/TextField/index.js

@@ -0,0 +1,14 @@
+"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("./TextField"), exports);
+__exportStar(require("./types"), exports);

package/cjs/src/TextField/types.d.ts

@@ -0,0 +1,6 @@
+import { TextFieldProps as MuiTextFieldProps } from '@mui/material/TextField';
+export declare type TextFieldProps = Omit<MuiTextFieldProps, 'variant' | 'color'> & {
+    variant?: never;
+    color?: never;
+    success?: boolean;
+};