@lunit/design-system 1.0.0-a.1 → 1.0.0-a.3

package/dist/types/components/Alert/Alert.types.d.ts

@@ -0,0 +1,9 @@
+import { AlertProps as MuiAlertProps } from "@mui/material";
+import { ReactNode } from "react";
+export interface AlertProps extends MuiAlertProps {
+    title?: string;
+    action?: ReactNode;
+    children: ReactNode;
+    bottomAction?: ReactNode;
+    onClose?: () => void;
+}

package/dist/types/components/Alert/Alert.utils..d.ts

@@ -0,0 +1,4 @@
+import { AlertColor } from "@mui/material";
+export declare const getBackgroundColor: (severity: AlertColor | undefined) => import("csstype").Property.Color | undefined;
+export declare const getBorderColor: (severity: AlertColor | undefined) => import("csstype").Property.Color | undefined;
+export declare const getIconColor: (severity: AlertColor | undefined) => import("csstype").Property.Color | undefined;

package/dist/types/components/Button/Button.d.ts

@@ -0,0 +1,3 @@
+import type { ButtonProps } from "./Button.types";
+declare const Button: (props: ButtonProps) => JSX.Element;
+export default Button;

package/dist/{components → types/components}/Button/Button.styled.d.ts

@@ -806,8 +806,21 @@ export declare const kindStyle: ({ kind, color, token }: KindStyleParams) => {
     color?: import("csstype").Property.Color | undefined;
     border?: string | undefined;
     "&:hover"?: {
+        position: string;
+        zIndex: number;
         backgroundColor: import("csstype").Property.Color | undefined;
     } | undefined;
+    "&:hover:before"?: {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        width: string;
+        height: string;
+        zIndex: number;
+        backgroundColor: import("csstype").Property.Color | undefined;
+        borderRadius: string;
+    } | undefined;
     "&.Mui-disabled"?: {
         opacity: number;
         border: string;
@@ -836,6 +849,17 @@ export declare const commonStyle: ({ token }: {
             readonly boxSizing: "border-box";
         };
     };
+    readonly "&:hover:before": {
+        readonly content: "''";
+        readonly position: "absolute";
+        readonly left: 0;
+        readonly top: 0;
+        readonly width: "100%";
+        readonly height: "100%";
+        readonly zIndex: -1;
+        readonly backgroundColor: import("csstype").Property.Color | undefined;
+        readonly borderRadius: "8px";
+    };
 };
 export declare const iconStyle: ({ size, hasIconOnly, }: Pick<CustomButtonProps, "size" | "hasIconOnly">) => {
     "& .MuiButton-startIcon": {
@@ -867,7 +891,7 @@ export declare const CustomButton: import("@emotion/styled").StyledComponent<{
     size?: "small" | "medium" | "large" | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "text" | "outlined" | "contained" | undefined;
+    variant?: "outlined" | "text" | "contained" | undefined;
 } & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
     centerRipple?: boolean | undefined;
@@ -886,5 +910,5 @@ export declare const CustomButton: import("@emotion/styled").StyledComponent<{
     touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
 }, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "color" | "children" | "sx" | "tabIndex" | "href" | "disabled" | "action" | "size" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomButtonProps, {}, {}>;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "tabIndex" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "size" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomButtonProps, {}, {}>;
 export {};

package/dist/{components → types/components}/Button/Button.types.d.ts

@@ -1,17 +1,17 @@
 /// <reference types="react" />
 import type { ButtonProps as MuiButtonProps } from "@mui/material";
-interface BaseButtonProps extends MuiButtonProps {
+interface BaseButtonProps extends Omit<MuiButtonProps, "variant"> {
     icon?: React.ReactNode;
 }
-interface ContainedButtonProps extends Omit<BaseButtonProps, "variant"> {
+interface ContainedButtonProps extends BaseButtonProps {
     kind?: "contained";
     color?: "primary" | "secondary" | "error";
 }
-interface GhostButtonProps extends Omit<BaseButtonProps, "variant"> {
+interface GhostButtonProps extends BaseButtonProps {
     kind?: "ghost";
     color?: "primary" | "secondary" | "error";
 }
-interface OutlinedButtonProps extends Omit<BaseButtonProps, "variant"> {
+interface OutlinedButtonProps extends BaseButtonProps {
     kind?: "outlined";
     color?: "primary";
 }

package/dist/types/components/Button/utils/getHoverStyle.d.ts

@@ -0,0 +1,6 @@
+declare const getHoverStyle: (backgroundColor: React.CSSProperties["color"]) => {
+    position: string;
+    zIndex: number;
+    backgroundColor: import("csstype").Property.Color | undefined;
+};
+export default getHoverStyle;

package/dist/types/components/Chip/Chip.styled.d.ts

@@ -0,0 +1,79 @@
+/// <reference types="react" />
+import type { Theme } from "@mui/material/styles";
+import type { OutlinedChipProps, BaseContainedChipProps, EnableContainedChipProps } from "./Chip.types";
+export declare const StyledOutlinedChip: 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" | "error" | "warning" | "success" | "default" | "info" | 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?: "small" | "medium" | undefined;
+    skipFocusWhenDisabled?: boolean | undefined;
+    sx?: import("@mui/material").SxProps<Theme> | undefined;
+    tabIndex?: number | undefined;
+    variant?: "outlined" | "filled" | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "disabled" | "avatar" | "clickable" | "deleteIcon" | "icon" | "onDelete" | "size" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & OutlinedChipProps, {}, {}>;
+export declare const StyledContainedChipBase: 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" | "error" | "warning" | "success" | "default" | "info" | 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?: "small" | "medium" | undefined;
+    skipFocusWhenDisabled?: boolean | undefined;
+    sx?: import("@mui/material").SxProps<Theme> | undefined;
+    tabIndex?: number | undefined;
+    variant?: "outlined" | "filled" | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "disabled" | "avatar" | "clickable" | "deleteIcon" | "icon" | "onDelete" | "size" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;
+export declare const StyledContainedChipEnable: 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" | "error" | "warning" | "success" | "default" | "info" | 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?: "small" | "medium" | undefined;
+    skipFocusWhenDisabled?: boolean | undefined;
+    sx?: import("@mui/material").SxProps<Theme> | undefined;
+    tabIndex?: number | undefined;
+    variant?: "outlined" | "filled" | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "disabled" | "avatar" | "clickable" | "deleteIcon" | "icon" | "onDelete" | "size" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps & EnableContainedChipProps, {}, {}>;
+export declare const StyledContainedChipDeletable: 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" | "error" | "warning" | "success" | "default" | "info" | 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?: "small" | "medium" | undefined;
+    skipFocusWhenDisabled?: boolean | undefined;
+    sx?: import("@mui/material").SxProps<Theme> | undefined;
+    tabIndex?: number | undefined;
+    variant?: "outlined" | "filled" | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "disabled" | "avatar" | "clickable" | "deleteIcon" | "icon" | "onDelete" | "size" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;

package/dist/{components → types/components}/Chip/Chip.types.d.ts

@@ -1,7 +1,7 @@
 import { CHIP_COLORS } from "./consts";
 import type { ChipProps as MuiChipProps } from "@mui/material";
 type ColorKeys = keyof typeof CHIP_COLORS;
-export type ChipColor = typeof CHIP_COLORS[ColorKeys];
+export type ChipColor = (typeof CHIP_COLORS)[ColorKeys];
 export type ChipThumbnail = string | JSX.Element;
 /**
  * Mui Chip's variant is 'kind' in our design system

package/dist/types/components/TextField/TextField.d.ts

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

package/dist/types/components/TextField/TextField.style.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { TextFieldProps, TextFieldSize } from "./TextField.types";
+declare const BaseTextField: import("@emotion/styled").StyledComponent<import("@mui/material/TextField").OutlinedTextFieldProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Omit<TextFieldProps, "size"> & {
+    textFieldSize: TextFieldSize;
+    hasLeftIcon?: boolean | undefined;
+    hasRightIcon?: boolean | undefined;
+}, {}, {}>;
+declare const IconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export { BaseTextField, IconWrapper };

package/dist/types/components/TextField/TextField.types.d.ts

@@ -0,0 +1,29 @@
+import type { SxProps } from "@mui/material";
+import type { OutlinedTextFieldProps } from "@mui/material/TextField";
+export type TextFieldSize = "small" | "medium" | "large";
+export interface BaseTextFieldProps extends Omit<OutlinedTextFieldProps, "size" | "value" | "helperText" | "variant"> {
+    /**
+     * The design system TextField variable is outlined fixed.
+     */
+    variant: "outlined";
+    value?: string;
+    helperText?: string;
+    /**
+     * @default "small"
+     */
+    size?: TextFieldSize;
+}
+export interface SingleTextFieldProps extends BaseTextFieldProps {
+    size: TextFieldSize;
+    leftIcon?: JSX.Element;
+    rightIcon?: JSX.Element;
+    leftIconSx?: SxProps;
+    rightIconSx?: SxProps;
+    onLeftIconClick?: () => void;
+    onRightIconClick?: () => void;
+}
+export interface MultiTextFieldProps extends BaseTextFieldProps {
+    rows?: number | string;
+    size: TextFieldSize;
+}
+export type TextFieldProps = SingleTextFieldProps | MultiTextFieldProps;

package/dist/types/components/TextField/TextFieldIcon.d.ts

@@ -0,0 +1,8 @@
+import type { SxProps } from "@mui/material";
+interface TextFieldProps {
+    sx?: SxProps;
+    icon: JSX.Element;
+    onIconClick?: () => void;
+}
+declare const TextFieldIcon: ({ sx, icon, onIconClick }: TextFieldProps) => JSX.Element;
+export default TextFieldIcon;

package/dist/types/components/TextField/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./TextField";
+export type { TextFieldProps, BaseTextFieldProps, MultiTextFieldProps, SingleTextFieldProps, } from "./TextField.types";

package/dist/types/components/Toast/Toast.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ToastProps } from "./Toast.types";
+declare const Toast: React.ForwardRefExoticComponent<Omit<ToastProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export default Toast;

package/dist/types/components/Toast/Toast.styled.d.ts

@@ -0,0 +1 @@
+export declare const StyledToast: import("@emotion/styled").StyledComponent<import("@mui/material").AlertProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/components/Toast/Toast.types.d.ts

@@ -0,0 +1,4 @@
+import { AlertProps as BaseAlertProps } from "@mui/material";
+export interface ToastProps extends Omit<BaseAlertProps, "variant" | "slots" | "slotProps" | "components" | "componentsProps" | "severity"> {
+    severity?: "success" | "info" | "warning" | "error" | "normal";
+}

package/dist/types/components/Toast/Toast.utils.d.ts

@@ -0,0 +1,2 @@
+import type { AlertColor } from "@mui/material";
+export declare const getIconColor: (severity: AlertColor | undefined) => import("csstype").Property.Color | undefined;

package/dist/types/components/Toast/index.d.ts

@@ -0,0 +1 @@
+export { default as Toast } from './Toast';

package/dist/{components → types/components}/ToggleButton/ToggleButton.styled.d.ts

@@ -34,6 +34,6 @@ export declare const CustomToggleButton: import("@emotion/styled").StyledCompone
     touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
 }, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "color" | "children" | "sx" | "tabIndex" | "onChange" | "onClick" | "disabled" | "value" | "action" | "size" | "selected" | keyof import("@mui/material/OverridableComponent").CommonProps | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "fullWidth"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomToggleButtonProps, {}, {}>;
+}, "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "tabIndex" | "onChange" | "onClick" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "value" | "size" | "selected" | "disableFocusRipple" | "fullWidth"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomToggleButtonProps, {}, {}>;
 export declare const IconAndChildrenWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/dist/{components → types/components}/ToggleButton/ToggleButton.types.d.ts

@@ -1,18 +1,18 @@
 /// <reference types="react" />
 import type { ToggleButtonProps as MuiToggleButtonProps } from "@mui/material";
-interface ToggleButtonBaseProps extends MuiToggleButtonProps {
+interface ToggleButtonBaseProps extends Omit<MuiToggleButtonProps, "variant"> {
     selectedColor?: "primary" | "secondary";
     icon?: React.ReactNode;
 }
-interface ContainedToggleButtonProps extends Omit<ToggleButtonBaseProps, "variant"> {
+interface ContainedToggleButtonProps extends ToggleButtonBaseProps {
     kind?: "contained";
     color?: "primary" | "secondary";
 }
-interface GhostToggleButtonProps extends Omit<ToggleButtonBaseProps, "variant"> {
+interface GhostToggleButtonProps extends ToggleButtonBaseProps {
     kind?: "ghost";
     color?: "primary" | "secondary";
 }
-interface OutlinedToggleButtonProps extends Omit<ToggleButtonBaseProps, "variant"> {
+interface OutlinedToggleButtonProps extends ToggleButtonBaseProps {
     kind?: "outlined";
     color?: "primary";
 }

package/dist/{foundation → types/foundation}/colors/base/grey.d.ts

@@ -33,3 +33,19 @@ export declare const greyText: {
     95: string;
     100: string;
 };
+export declare const greyForMUI: {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+    A100: string;
+    A200: string;
+    A400: string;
+    A700: string;
+};

package/dist/{foundation → types/foundation}/colors/base/lunitGreen.d.ts

@@ -1,4 +1,4 @@
-export declare const lunitGreen: {
+export declare const lunit_green: {
     5: string;
     10: string;
     20: string;
@@ -10,7 +10,7 @@ export declare const lunitGreen: {
     80: string;
     90: string;
 };
-export declare const lunitGreenText: {
+export declare const lunit_greenText: {
     5: string;
     10: string;
     20: string;

package/dist/{foundation → types/foundation}/colors/base/lunitTeal.d.ts

@@ -1,4 +1,4 @@
-export declare const lunitTeal: {
+export declare const lunit_teal: {
     5: string;
     10: string;
     20: string;
@@ -10,7 +10,7 @@ export declare const lunitTeal: {
     80: string;
     90: string;
 };
-export declare const lunitTealText: {
+export declare const lunit_tealText: {
     5: string;
     10: string;
     20: string;

package/dist/{foundation → types/foundation}/colors/index.d.ts

@@ -9,8 +9,8 @@ declare module "@mui/material/styles/createPalette" {
             grey: GreyColor;
             blue: BaseColor;
             green: BaseColor;
-            lunitGreen: BaseColor;
-            lunitTeal: BaseColor;
+            lunit_green: BaseColor;
+            lunit_teal: BaseColor;
             magenta: BaseColor;
             orange: BaseColor;
             red: BaseColor;
@@ -23,8 +23,8 @@ declare module "@mui/material/styles/createPalette" {
             grey: GreyColor;
             blue: BaseColor;
             green: BaseColor;
-            lunitGreen: BaseColor;
-            lunitTeal: BaseColor;
+            lunit_green: BaseColor;
+            lunit_teal: BaseColor;
             magenta: BaseColor;
             orange: BaseColor;
             red: BaseColor;
@@ -57,12 +57,46 @@ export declare const createColorCssBaseline: () => {
     };
 };
 declare const paletteOptions: {
+    primary: {
+        main: string;
+    };
+    secondary: {
+        main: string;
+    };
+    error: {
+        main: string;
+    };
+    warning: {
+        main: string;
+    };
+    info: {
+        main: string;
+    };
+    success: {
+        main: string;
+    };
+    grey: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+        A100: string;
+        A200: string;
+        A400: string;
+        A700: string;
+    };
     lunit: {
         grey: GreyColor;
         blue: BaseColor;
         green: BaseColor;
-        lunitGreen: BaseColor;
-        lunitTeal: BaseColor;
+        lunit_green: BaseColor;
+        lunit_teal: BaseColor;
         magenta: BaseColor;
         orange: BaseColor;
         red: BaseColor;
@@ -90,6 +124,7 @@ declare const paletteOptions: {
             icon_info_02: string;
             hover: string;
             focused: string;
+            selected: string;
             shadow_01: string;
             shadow_02: string;
             shadow_03: string;
@@ -117,10 +152,7 @@ declare const paletteOptions: {
             selectcontrol_handler_shadow: string;
             textfield_bg: string;
             textfield_border_error: string;
-            dropdown_option_selected: string;
             dropdown_divider_border: string;
-            dropdown_option_activatied: string;
-            datatable_cell_selected: string;
             datatable_border_01: string;
             datatable_border_02: string;
             datatable_zebra: string;
@@ -152,4 +184,5 @@ declare const paletteOptions: {
         };
     };
 };
+export { base };
 export default paletteOptions;

package/dist/{foundation → types/foundation}/colors/types.d.ts

@@ -22,6 +22,7 @@ export interface ColorToken {
         icon_info_02: CSSPropertyColor;
         hover: CSSPropertyColor;
         focused: CSSPropertyColor;
+        selected: CSSPropertyColor;
         shadow_01: CSSPropertyColor;
         shadow_02: CSSPropertyColor;
         shadow_03: CSSPropertyColor;
@@ -49,10 +50,7 @@ export interface ColorToken {
         selectcontrol_handler_shadow: CSSPropertyColor;
         textfield_bg: CSSPropertyColor;
         textfield_border_error: CSSPropertyColor;
-        dropdown_option_selected: CSSPropertyColor;
         dropdown_divider_border: CSSPropertyColor;
-        dropdown_option_activatied: CSSPropertyColor;
-        datatable_cell_selected: CSSPropertyColor;
         datatable_border_01: CSSPropertyColor;
         datatable_border_02: CSSPropertyColor;
         datatable_zebra: CSSPropertyColor;

package/dist/{foundation → types/foundation}/index.d.ts

@@ -4,12 +4,46 @@ export declare const foundationCssBaseline: Components<Theme>["MuiCssBaseline"];
 export declare const typography: import("@mui/material").TypographyVariantsOptions;
 export { typographyDefaultProps };
 export declare const palette: {
+    primary: {
+        main: string;
+    };
+    secondary: {
+        main: string;
+    };
+    error: {
+        main: string;
+    };
+    warning: {
+        main: string;
+    };
+    info: {
+        main: string;
+    };
+    success: {
+        main: string;
+    };
+    grey: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+        A100: string;
+        A200: string;
+        A400: string;
+        A700: string;
+    };
     lunit: {
         grey: import("./colors").GreyColor;
         blue: import("./colors").BaseColor;
         green: import("./colors").BaseColor;
-        lunitGreen: import("./colors").BaseColor;
-        lunitTeal: import("./colors").BaseColor;
+        lunit_green: import("./colors").BaseColor;
+        lunit_teal: import("./colors").BaseColor;
         magenta: import("./colors").BaseColor;
         orange: import("./colors").BaseColor;
         red: import("./colors").BaseColor;
@@ -37,6 +71,7 @@ export declare const palette: {
             icon_info_02: string;
             hover: string;
             focused: string;
+            selected: string;
             shadow_01: string;
             shadow_02: string;
             shadow_03: string;
@@ -64,10 +99,7 @@ export declare const palette: {
             selectcontrol_handler_shadow: string;
             textfield_bg: string;
             textfield_border_error: string;
-            dropdown_option_selected: string;
             dropdown_divider_border: string;
-            dropdown_option_activatied: string;
-            datatable_cell_selected: string;
             datatable_border_01: string;
             datatable_border_02: string;
             datatable_zebra: string;

package/dist/{index.d.ts → types/index.d.ts}

@@ -1,4 +1,5 @@
 export { default as theme } from "./theme";
+export { base as baseColors } from "./foundation/colors";
 export { default as Alert } from "./components/Alert";
 export { default as Button } from "./components/Button";
 export { default as Chip } from "./components/Chip";