@astral/ui 0.1.0 → 0.1.1

package/cjs/index.d.ts

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

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

package/cjs/src/Badge/Badge.d.ts

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

package/cjs/src/Badge/Badge.js

@@ -0,0 +1,31 @@
+"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 });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = require("./styled");
+var Badge = function (_a) {
+    var children = _a.children, color = _a.color, props = __rest(_a, ["children", "color"]);
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledBadge, __assign({ customColor: color }, props, { max: 99 }, { children: children }), void 0));
+};
+exports.default = Badge;

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

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

package/cjs/src/Badge/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("./Badge"), exports);
+__exportStar(require("./types"), exports);

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

@@ -0,0 +1,50 @@
+/// <reference types="react" />
+import { Theme } from '../theme';
+import { BadgeColor, BadgeProps } from './types';
+export declare const StyledBadge: import("@emotion/styled").StyledComponent<{
+    classes?: (Partial<import("@mui/material").BadgeUnstyledClasses> & {
+        colorPrimary?: string | undefined;
+        colorSecondary?: string | undefined;
+        colorError?: string | undefined;
+        colorInfo?: string | undefined;
+        colorSuccess?: string | undefined;
+        colorWarning?: string | undefined;
+        anchorOriginTopRightRectangular?: string | undefined;
+        anchorOriginBottomRightRectangular?: string | undefined;
+        anchorOriginTopLeftRectangular?: string | undefined;
+        anchorOriginBottomLeftRectangular?: string | undefined;
+        anchorOriginTopRightCircular?: string | undefined;
+        anchorOriginBottomRightCircular?: string | undefined;
+        anchorOriginTopLeftCircular?: string | undefined;
+        anchorOriginBottomLeftCircular?: string | undefined;
+        overlapRectangular?: string | undefined;
+        overlapCircular?: string | undefined;
+    }) | undefined;
+    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;
+} & {
+    anchorOrigin?: import("@mui/material").BadgeOrigin | undefined;
+    components?: {
+        Root?: import("react").ElementType<any> | undefined;
+        Badge?: import("react").ElementType<any> | undefined;
+    } | undefined;
+    componentsProps?: {
+        root?: (import("react").HTMLAttributes<HTMLSpanElement> & import("@mui/material").BadgeUnstyledComponentsPropsOverrides) | undefined;
+        badge?: (import("react").HTMLAttributes<HTMLSpanElement> & import("@mui/material").BadgeUnstyledComponentsPropsOverrides) | undefined;
+    } | undefined;
+    badgeContent?: import("react").ReactNode;
+    children?: import("react").ReactNode;
+    classes?: Partial<import("@mui/material").BadgeUnstyledClasses> | undefined;
+    invisible?: boolean | undefined;
+    max?: number | undefined;
+    showZero?: boolean | undefined;
+    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"> & {
+    theme?: Theme | undefined;
+} & Omit<BadgeProps, "color"> & {
+    customColor: BadgeColor;
+}, {}, {}>;

package/cjs/src/Badge/styled.js

@@ -0,0 +1,63 @@
+"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.StyledBadge = void 0;
+var material_1 = require("@mui/material");
+var styles_1 = require("../styles");
+var getBgColor = function (_a) {
+    var customColor = _a.customColor, theme = _a.theme;
+    if (customColor === 'grey')
+        return theme.palette.grey[300];
+    if (customColor === 'errorLight')
+        return theme.palette.error.light;
+    if (customColor === 'success')
+        return theme.palette.success.light;
+    if (customColor === 'primary')
+        return theme.palette.primary.main;
+    if (customColor === 'white')
+        return theme.palette.background.default;
+    if (customColor === 'error')
+        return theme.palette.error.dark;
+    return theme.palette.primary.main;
+};
+var getTextColor = function (_a) {
+    var customColor = _a.customColor, theme = _a.theme;
+    if (customColor === 'grey')
+        return theme.palette.text.primary;
+    if (customColor === 'primary')
+        return theme.palette.primary.contrastText;
+    if (customColor === 'white')
+        return theme.palette.primary.main;
+    if (customColor === 'error')
+        return theme.palette.error.contrastText;
+    if (customColor === 'errorLight')
+        return theme.palette.error.dark;
+    if (customColor === 'success')
+        return theme.palette.success.dark;
+    return theme.palette.primary.contrastText;
+};
+exports.StyledBadge = (0, styles_1.styled)(material_1.Badge, {
+    shouldForwardProp: function (prop) { return prop !== 'customColor'; },
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  .MuiBadge-badge {\n    height: 20px;\n    border-radius: 12px;\n    line-height: 20px;\n    background-color: ", ";\n    color: ", ";\n    padding: ", ";\n    font-size: ", ";\n    border: 2px solid ", ";\n  }\n\n  .MuiBadge-dot {\n    width: 12px;\n    height: 12px;\n    border: 2px solid ", ";\n  }\n"], ["\n  .MuiBadge-badge {\n    height: 20px;\n    border-radius: 12px;\n    line-height: 20px;\n    background-color: ", ";\n    color: ", ";\n    padding: ", ";\n    font-size: ", ";\n    border: 2px solid ", ";\n  }\n\n  .MuiBadge-dot {\n    width: 12px;\n    height: 12px;\n    border: 2px solid ", ";\n  }\n"])), function (_a) {
+    var customColor = _a.customColor, theme = _a.theme;
+    return getBgColor({ customColor: customColor, theme: theme });
+}, function (_a) {
+    var customColor = _a.customColor, theme = _a.theme;
+    return getTextColor({ customColor: customColor, theme: theme });
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(0, 1);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.typography.small.fontSize;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.common.white;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.common.white;
+});
+var templateObject_1;

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

@@ -0,0 +1,5 @@
+import { BadgeProps as MuiBadgeProps } from '@mui/material/Badge/Badge';
+export declare type BadgeColor = 'primary' | 'grey' | 'white' | 'errorLight' | 'error' | 'success';
+export declare type BadgeProps = Omit<MuiBadgeProps, 'color'> & {
+    color: BadgeColor;
+};

package/cjs/src/Badge/types.js

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

package/cjs/src/Button/Button.d.ts

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

package/cjs/src/Button/Button.js

@@ -0,0 +1,33 @@
+"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.Button = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var CircularProgress_1 = require("../CircularProgress");
+var styled_1 = require("./styled");
+var Button = function (_a) {
+    var children = _a.children, startIcon = _a.startIcon, endIcon = _a.endIcon, loading = _a.loading, props = __rest(_a, ["children", "startIcon", "endIcon", "loading"]);
+    return ((0, jsx_runtime_1.jsxs)(styled_1.StyledButton, __assign({ loading: loading }, props, { children: [(0, jsx_runtime_1.jsx)("span", { children: startIcon }, void 0), children, loading && (0, jsx_runtime_1.jsx)(CircularProgress_1.CircularProgress, {}, void 0), (0, jsx_runtime_1.jsx)("span", { children: endIcon }, void 0)] }), void 0));
+};
+exports.Button = Button;

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

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

package/cjs/src/Button/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("./Button"), exports);
+__exportStar(require("./types"), exports);

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { Theme } from '../theme';
+export declare const StyledButton: import("@emotion/styled").StyledComponent<Omit<import("@mui/base/ButtonUnstyled/ButtonUnstyledProps").default<"button", {}>, "color" | "variant" | "size"> & {
+    color?: "primary" | "error" | "warning" | "success" | undefined;
+    variant?: "link" | "light" | "text" | "contained" | undefined;
+    size?: "large" | "medium" | undefined;
+} & {
+    theme?: Theme | undefined;
+} & {
+    loading?: boolean | undefined;
+    startIcon?: import("react").ReactNode;
+    endIcon?: import("react").ReactNode;
+}, {}, {}>;

package/cjs/src/Button/styled.js

@@ -0,0 +1,33 @@
+"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.StyledButton = void 0;
+var styles_1 = require("../styles");
+var ButtonBase_1 = require("../ButtonBase");
+var getProgressColor = function (_a) {
+    var theme = _a.theme, variant = _a.variant;
+    if (variant === ButtonBase_1.ButtonVariants.CONTAINED)
+        return theme.palette.primary.contrastText;
+    return theme.palette.grey['900'];
+};
+exports.StyledButton = (0, styles_1.styled)(ButtonBase_1.ButtonBase, {
+    shouldForwardProp: function (prop) {
+        return prop !== 'startIcon' && prop !== 'endIcon' && prop !== 'loading';
+    },
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  pointer-events: ", ";\n  color: ", ";\n\n  > span:first-of-type {\n    display: inherit;\n    margin-right: ", ";\n  }\n\n  > span:last-of-type {\n    display: inherit;\n    margin-left: ", ";\n  }\n\n  .MuiCircularProgress-root {\n    width: 16px !important;\n    height: 16px !important;\n    transform: translate(-50%, -50%);\n    position: absolute;\n\n    color: ", ";\n  }\n"], ["\n  pointer-events: ", ";\n  color: ", ";\n\n  > span:first-of-type {\n    display: inherit;\n    margin-right: ", ";\n  }\n\n  > span:last-of-type {\n    display: inherit;\n    margin-left: ", ";\n  }\n\n  .MuiCircularProgress-root {\n    width: 16px !important;\n    height: 16px !important;\n    transform: translate(-50%, -50%);\n    position: absolute;\n\n    color: ", ";\n  }\n"])), function (_a) {
+    var loading = _a.loading;
+    return (loading ? 'none' : 'inherit');
+}, function (_a) {
+    var loading = _a.loading;
+    return loading && 'transparent';
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(2);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(2);
+}, getProgressColor);
+var templateObject_1;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BaseButtonProps } from '../ButtonBase';
+export declare type ButtonProps = BaseButtonProps & {
+    loading?: boolean;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+};

package/cjs/src/Button/types.js

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

package/cjs/src/ButtonBase/ButtonBase.d.ts

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

package/cjs/src/ButtonBase/ButtonBase.js

@@ -0,0 +1,33 @@
+"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.ButtonBase = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var constants_1 = require("./constants");
+var styled_1 = require("./styled");
+var ButtonBase = function (_a) {
+    var children = _a.children, _b = _a.variant, variant = _b === void 0 ? constants_1.ButtonVariants.CONTAINED : _b, _c = _a.color, color = _c === void 0 ? constants_1.ButtonColors.PRIMARY : _c, props = __rest(_a, ["children", "variant", "color"]);
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledButtonBase, __assign({}, props, { customColor: color, customVariant: variant }, { children: children }), void 0));
+};
+exports.ButtonBase = ButtonBase;

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

@@ -0,0 +1,22 @@
+export declare enum ButtonColors {
+    ERROR = "error",
+    SUCCESS = "success",
+    WARNING = "warning",
+    PRIMARY = "primary"
+}
+export declare enum ButtonVariants {
+    CONTAINED = "contained",
+    LIGHT = "light",
+    TEXT = "text",
+    LINK = "link"
+}
+export declare enum ButtonSizes {
+    MEDIUM = "medium",
+    LARGE = "large"
+}
+export declare enum ButtonStates {
+    DEFAULT = "default",
+    ACTIVE = "active",
+    FOCUS = "focus",
+    HOVER = "hover"
+}

package/cjs/src/ButtonBase/constants.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonStates = exports.ButtonSizes = exports.ButtonVariants = exports.ButtonColors = void 0;
+var ButtonColors;
+(function (ButtonColors) {
+    ButtonColors["ERROR"] = "error";
+    ButtonColors["SUCCESS"] = "success";
+    ButtonColors["WARNING"] = "warning";
+    ButtonColors["PRIMARY"] = "primary";
+})(ButtonColors = exports.ButtonColors || (exports.ButtonColors = {}));
+var ButtonVariants;
+(function (ButtonVariants) {
+    ButtonVariants["CONTAINED"] = "contained";
+    ButtonVariants["LIGHT"] = "light";
+    ButtonVariants["TEXT"] = "text";
+    ButtonVariants["LINK"] = "link";
+})(ButtonVariants = exports.ButtonVariants || (exports.ButtonVariants = {}));
+var ButtonSizes;
+(function (ButtonSizes) {
+    ButtonSizes["MEDIUM"] = "medium";
+    ButtonSizes["LARGE"] = "large";
+})(ButtonSizes = exports.ButtonSizes || (exports.ButtonSizes = {}));
+var ButtonStates;
+(function (ButtonStates) {
+    ButtonStates["DEFAULT"] = "default";
+    ButtonStates["ACTIVE"] = "active";
+    ButtonStates["FOCUS"] = "focus";
+    ButtonStates["HOVER"] = "hover";
+})(ButtonStates = exports.ButtonStates || (exports.ButtonStates = {}));

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

@@ -0,0 +1,3 @@
+export * from './ButtonBase';
+export * from './constants';
+export * from './types';

package/cjs/src/ButtonBase/index.js

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

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

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { Palette, Theme } from '../theme';
+import { BaseButtonProps, ButtonColor, ButtonSize, ButtonState, ButtonVariant } from './types';
+declare type StyledButtonBaseThemeProps = {
+    customColor?: ButtonColor;
+    customVariant?: ButtonVariant;
+    size?: ButtonSize;
+    theme: Theme;
+};
+export declare const getColor: ({ theme, customVariant, customColor, buttonState, }: StyledButtonBaseThemeProps & {
+    buttonState: ButtonState;
+}) => string;
+export declare const getBgText: ({ palette, buttonState, colorVariant, }: {
+    palette: Palette;
+    buttonState: ButtonState;
+    colorVariant: string;
+}) => string;
+export declare const getBgColor: ({ customColor, customVariant, buttonState, theme, }: StyledButtonBaseThemeProps & {
+    buttonState: ButtonState;
+}) => string;
+export declare const getButtonHeight: ({ size, }: StyledButtonBaseThemeProps) => string;
+export declare const getButtonPadding: ({ size, theme, }: StyledButtonBaseThemeProps) => string;
+export declare const getDisabledBgColor: ({ theme, customVariant, }: StyledButtonBaseThemeProps) => string;
+export declare const StyledButtonBase: import("@emotion/styled").StyledComponent<Pick<import("@mui/base/ButtonUnstyled").ButtonUnstyledOwnProps & Omit<any, keyof import("@mui/base/ButtonUnstyled").ButtonUnstyledOwnProps> & {
+    component?: import("react").ElementType<any> | undefined;
+}, string | number | symbol> & import("react").RefAttributes<any> & {
+    theme?: Theme | undefined;
+} & Omit<BaseButtonProps, "color" | "variant"> & {
+    customColor?: "primary" | "error" | "warning" | "success" | undefined;
+    customVariant?: "link" | "light" | "text" | "contained" | undefined;
+}, {}, {}>;
+export {};