@lunit/design-system 2.0.2 → 2.2.0

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

@@ -29,6 +29,8 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     animationIterationCount?: import("csstype").Property.AnimationIterationCount | undefined;
     animationName?: import("csstype").Property.AnimationName | undefined;
     animationPlayState?: import("csstype").Property.AnimationPlayState | undefined;
+    animationRangeEnd?: string | number | undefined;
+    animationRangeStart?: string | number | undefined;
     animationTimeline?: import("csstype").Property.AnimationTimeline | undefined;
     animationTimingFunction?: import("csstype").Property.AnimationTimingFunction | undefined;
     appearance?: import("csstype").Property.Appearance | undefined;
@@ -150,6 +152,10 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     fontStretch?: import("csstype").Property.FontStretch | undefined;
     fontStyle?: import("csstype").Property.FontStyle | undefined;
     fontSynthesis?: import("csstype").Property.FontSynthesis | undefined;
+    fontSynthesisPosition?: import("csstype").Property.FontSynthesisPosition | undefined;
+    fontSynthesisSmallCaps?: import("csstype").Property.FontSynthesisSmallCaps | undefined;
+    fontSynthesisStyle?: import("csstype").Property.FontSynthesisStyle | undefined;
+    fontSynthesisWeight?: import("csstype").Property.FontSynthesisWeight | undefined;
     fontVariant?: import("csstype").Property.FontVariant | undefined;
     fontVariantAlternates?: import("csstype").Property.FontVariantAlternates | undefined;
     fontVariantCaps?: import("csstype").Property.FontVariantCaps | undefined;
@@ -222,6 +228,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     maskRepeat?: import("csstype").Property.MaskRepeat | undefined;
     maskSize?: string | number | undefined;
     maskType?: import("csstype").Property.MaskType | undefined;
+    masonryAutoFlow?: import("csstype").Property.MasonryAutoFlow | undefined;
     mathDepth?: import("csstype").Property.MathDepth | undefined;
     mathShift?: import("csstype").Property.MathShift | undefined;
     mathStyle?: import("csstype").Property.MathStyle | undefined;
@@ -260,6 +267,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     overflowWrap?: import("csstype").Property.OverflowWrap | undefined;
     overflowX?: import("csstype").Property.OverflowX | undefined;
     overflowY?: import("csstype").Property.OverflowY | undefined;
+    overlay?: import("csstype").Property.Overlay | undefined;
     overscrollBehaviorBlock?: import("csstype").Property.OverscrollBehaviorBlock | undefined;
     overscrollBehaviorInline?: import("csstype").Property.OverscrollBehaviorInline | undefined;
     overscrollBehaviorX?: import("csstype").Property.OverscrollBehaviorX | undefined;
@@ -347,12 +355,15 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     textTransform?: import("csstype").Property.TextTransform | undefined;
     textUnderlineOffset?: string | number | undefined;
     textUnderlinePosition?: import("csstype").Property.TextUnderlinePosition | undefined;
+    textWrap?: import("csstype").Property.TextWrap | undefined;
+    timelineScope?: import("csstype").Property.TimelineScope | undefined;
     top?: string | number | undefined;
     touchAction?: import("csstype").Property.TouchAction | undefined;
     transform?: import("csstype").Property.Transform | undefined;
     transformBox?: import("csstype").Property.TransformBox | undefined;
     transformOrigin?: string | number | undefined;
     transformStyle?: import("csstype").Property.TransformStyle | undefined;
+    transitionBehavior?: import("csstype").Property.TransitionBehavior | undefined;
     transitionDelay?: import("csstype").Property.TransitionDelay<string & {}> | undefined;
     transitionDuration?: import("csstype").Property.TransitionDuration<string & {}> | undefined;
     transitionProperty?: import("csstype").Property.TransitionProperty | undefined;
@@ -361,9 +372,14 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     unicodeBidi?: import("csstype").Property.UnicodeBidi | undefined;
     userSelect?: import("csstype").Property.UserSelect | undefined;
     verticalAlign?: string | number | undefined;
+    viewTimelineAxis?: import("csstype").Property.ViewTimelineAxis | undefined;
+    viewTimelineInset?: string | number | undefined;
+    viewTimelineName?: import("csstype").Property.ViewTimelineName | undefined;
     viewTransitionName?: import("csstype").Property.ViewTransitionName | undefined;
     visibility?: import("csstype").Property.Visibility | undefined;
     whiteSpace?: import("csstype").Property.WhiteSpace | undefined;
+    whiteSpaceCollapse?: import("csstype").Property.WhiteSpaceCollapse | undefined;
+    whiteSpaceTrim?: import("csstype").Property.WhiteSpaceTrim | undefined;
     widows?: import("csstype").Property.Widows | undefined;
     width?: string | number | undefined;
     willChange?: import("csstype").Property.WillChange | undefined;
@@ -375,6 +391,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     zoom?: import("csstype").Property.Zoom | undefined;
     all?: import("csstype").Globals | undefined;
     animation?: import("csstype").Property.Animation<string & {}> | undefined;
+    animationRange?: string | number | undefined;
     background?: string | number | undefined;
     backgroundPosition?: string | number | undefined;
     border?: string | number | undefined;
@@ -438,6 +455,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     textDecoration?: string | number | undefined;
     textEmphasis?: import("csstype").Property.TextEmphasis | undefined;
     transition?: import("csstype").Property.Transition<string & {}> | undefined;
+    viewTimeline?: import("csstype").Property.ViewTimeline | undefined;
     MozAnimationDelay?: import("csstype").Property.AnimationDelay<string & {}> | undefined;
     MozAnimationDirection?: import("csstype").Property.AnimationDirection | undefined;
     MozAnimationDuration?: import("csstype").Property.AnimationDuration<string & {}> | undefined;
@@ -447,7 +465,6 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     MozAnimationPlayState?: import("csstype").Property.AnimationPlayState | undefined;
     MozAnimationTimingFunction?: import("csstype").Property.AnimationTimingFunction | undefined;
     MozAppearance?: import("csstype").Property.MozAppearance | undefined;
-    MozBackfaceVisibility?: import("csstype").Property.BackfaceVisibility | undefined;
     MozBinding?: import("csstype").Property.MozBinding | undefined;
     MozBorderBottomColors?: import("csstype").Property.MozBorderBottomColors | undefined;
     MozBorderEndColor?: import("csstype").Property.BorderInlineEndColor | undefined;
@@ -474,20 +491,16 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     MozMarginStart?: string | number | undefined;
     MozOrient?: import("csstype").Property.MozOrient | undefined;
     MozOsxFontSmoothing?: import("csstype").Property.FontSmooth<string | number> | undefined;
+    MozOutlineRadiusBottomleft?: string | number | undefined;
+    MozOutlineRadiusBottomright?: string | number | undefined;
+    MozOutlineRadiusTopleft?: string | number | undefined;
+    MozOutlineRadiusTopright?: string | number | undefined;
     MozPaddingEnd?: string | number | undefined;
     MozPaddingStart?: string | number | undefined;
-    MozPerspective?: import("csstype").Property.Perspective<string | number> | undefined;
-    MozPerspectiveOrigin?: string | number | undefined;
     MozStackSizing?: import("csstype").Property.MozStackSizing | undefined;
     MozTabSize?: string | number | undefined;
     MozTextBlink?: import("csstype").Property.MozTextBlink | undefined;
     MozTextSizeAdjust?: import("csstype").Property.TextSizeAdjust | undefined;
-    MozTransformOrigin?: string | number | undefined;
-    MozTransformStyle?: import("csstype").Property.TransformStyle | undefined;
-    MozTransitionDelay?: import("csstype").Property.TransitionDelay<string & {}> | undefined;
-    MozTransitionDuration?: import("csstype").Property.TransitionDuration<string & {}> | undefined;
-    MozTransitionProperty?: import("csstype").Property.TransitionProperty | undefined;
-    MozTransitionTimingFunction?: import("csstype").Property.TransitionTimingFunction | undefined;
     MozUserFocus?: import("csstype").Property.MozUserFocus | undefined;
     MozUserModify?: import("csstype").Property.MozUserModify | undefined;
     MozUserSelect?: import("csstype").Property.UserSelect | undefined;
@@ -667,7 +680,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     MozBorderImage?: import("csstype").Property.BorderImage | undefined;
     MozColumnRule?: string | number | undefined;
     MozColumns?: string | number | undefined;
-    MozTransition?: import("csstype").Property.Transition<string & {}> | undefined;
+    MozOutlineRadius?: string | number | undefined;
     msContentZoomLimit?: import("csstype").Property.MsContentZoomLimit | undefined;
     msContentZoomSnap?: import("csstype").Property.MsContentZoomSnap | undefined;
     msFlex?: string | number | undefined;
@@ -725,6 +738,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     KhtmlLineBreak?: import("csstype").Property.LineBreak | undefined;
     KhtmlOpacity?: import("csstype").Property.Opacity | undefined;
     KhtmlUserSelect?: import("csstype").Property.UserSelect | undefined;
+    MozBackfaceVisibility?: import("csstype").Property.BackfaceVisibility | undefined;
     MozBackgroundClip?: import("csstype").Property.BackgroundClip | undefined;
     MozBackgroundInlinePolicy?: import("csstype").Property.BoxDecorationBreak | undefined;
     MozBackgroundOrigin?: import("csstype").Property.BackgroundOrigin | undefined;
@@ -746,17 +760,22 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     MozOpacity?: import("csstype").Property.Opacity | undefined;
     MozOutline?: string | number | undefined;
     MozOutlineColor?: import("csstype").Property.OutlineColor | undefined;
-    MozOutlineRadius?: string | number | undefined;
-    MozOutlineRadiusBottomleft?: string | number | undefined;
-    MozOutlineRadiusBottomright?: string | number | undefined;
-    MozOutlineRadiusTopleft?: string | number | undefined;
-    MozOutlineRadiusTopright?: string | number | undefined;
     MozOutlineStyle?: import("csstype").Property.OutlineStyle | undefined;
     MozOutlineWidth?: import("csstype").Property.OutlineWidth<string | number> | undefined;
+    MozPerspective?: import("csstype").Property.Perspective<string | number> | undefined;
+    MozPerspectiveOrigin?: string | number | undefined;
     MozTextAlignLast?: import("csstype").Property.TextAlignLast | undefined;
     MozTextDecorationColor?: import("csstype").Property.TextDecorationColor | undefined;
     MozTextDecorationLine?: import("csstype").Property.TextDecorationLine | undefined;
     MozTextDecorationStyle?: import("csstype").Property.TextDecorationStyle | undefined;
+    MozTransform?: import("csstype").Property.Transform | undefined;
+    MozTransformOrigin?: string | number | undefined;
+    MozTransformStyle?: import("csstype").Property.TransformStyle | undefined;
+    MozTransition?: import("csstype").Property.Transition<string & {}> | undefined;
+    MozTransitionDelay?: import("csstype").Property.TransitionDelay<string & {}> | undefined;
+    MozTransitionDuration?: import("csstype").Property.TransitionDuration<string & {}> | undefined;
+    MozTransitionProperty?: import("csstype").Property.TransitionProperty | undefined;
+    MozTransitionTimingFunction?: import("csstype").Property.TransitionTimingFunction | undefined;
     MozUserInput?: import("csstype").Property.MozUserInput | undefined;
     msImeMode?: import("csstype").Property.ImeMode | undefined;
     OAnimation?: import("csstype").Property.Animation<string & {}> | undefined;
@@ -789,8 +808,6 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     WebkitBoxOrdinalGroup?: import("csstype").Property.BoxOrdinalGroup | undefined;
     WebkitBoxOrient?: import("csstype").Property.BoxOrient | undefined;
     WebkitBoxPack?: import("csstype").Property.BoxPack | undefined;
-    WebkitScrollSnapPointsX?: import("csstype").Property.ScrollSnapPointsX | undefined;
-    WebkitScrollSnapPointsY?: import("csstype").Property.ScrollSnapPointsY | undefined;
     alignmentBaseline?: import("csstype").Property.AlignmentBaseline | undefined;
     baselineShift?: string | number | undefined;
     clipRule?: import("csstype").Property.ClipRule | undefined;
@@ -890,37 +907,5 @@ export declare const iconStyle: ({ size, hasIconOnly, }: Pick<CustomButtonProps,
         };
     };
 };
-export declare const CustomButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: "success" | "info" | "warning" | "error" | "primary" | "secondary" | "inherit" | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "text" | "outlined" | "contained" | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "tabIndex" | "color" | "action" | "href" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomButtonProps, {}, {}>;
+export declare const CustomButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "classes" | "className" | "style" | "children" | "sx" | "variant" | "tabIndex" | "color" | "action" | "href" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomButtonProps, {}, {}>;
 export {};

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

@@ -1,79 +1,7 @@
 /// <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?: "success" | "info" | "warning" | "error" | "default" | "primary" | "secondary" | 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?: "filled" | "outlined" | 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "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?: "success" | "info" | "warning" | "error" | "default" | "primary" | "secondary" | 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?: "filled" | "outlined" | 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "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?: "success" | "info" | "warning" | "error" | "default" | "primary" | "secondary" | 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?: "filled" | "outlined" | 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "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?: "success" | "info" | "warning" | "error" | "default" | "primary" | "secondary" | 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?: "filled" | "outlined" | 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;
+export declare const StyledOutlinedChip: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "classes" | "className" | "style" | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & OutlinedChipProps, {}, {}>;
+export declare const StyledContainedChipBase: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "classes" | "className" | "style" | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;
+export declare const StyledContainedChipEnable: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "classes" | "className" | "style" | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps & EnableContainedChipProps, {}, {}>;
+export declare const StyledContainedChipDeletable: import("@emotion/styled").StyledComponent<import("@mui/material").ChipOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "classes" | "className" | "style" | "children" | "sx" | "variant" | "label" | "tabIndex" | "color" | "icon" | "disabled" | "size" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;

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

@@ -1,7 +1,7 @@
-/// <reference types="react" />
 import { CHIP_COLORS } from "./consts";
 import type { ChipProps as MuiChipProps, ChipTypeMap as MuiChipTypeMap } from "@mui/material";
 import type { OverridableComponent } from "@mui/material/OverridableComponent";
+import type { JSX } from "react";
 type DesignSystemChipKind = "outlined" | "contained";
 type DesignSystemAndMuiContainedChipKind = "filled" | "contained";
 type ColorKeys = keyof typeof CHIP_COLORS;

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

@@ -11,7 +11,6 @@ export interface DialogBase {
     titleVariant?: TypographyProps["variant"];
     children: React.ReactNode;
     actions?: React.ReactNode;
-    enableBackButtonClose?: boolean;
     enableBackdropClose?: boolean;
     size?: "small" | "medium";
     sx?: SxProps;
@@ -21,13 +20,11 @@ export interface DialogBase {
 export interface PassiveDialogType extends DialogBase {
     type: "passive";
     actions?: undefined;
-    enableBackButtonClose?: true;
     enableBackdropClose?: true;
 }
 export interface ActionDialogType extends DialogBase {
     type: "action";
     actions: React.ReactNode;
-    enableBackButtonClose?: false;
     enableBackdropClose?: boolean;
 }
 export interface PassiveModalProps extends PassiveDialogType {

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

@@ -1,2 +1,4 @@
-declare const Dropdown: () => import("react/jsx-runtime").JSX.Element;
+import React from "react";
+import { DropdownProps } from "./Dropdown.types";
+declare const Dropdown: React.ForwardRefExoticComponent<Omit<DropdownProps, "ref"> & React.RefAttributes<unknown>>;
 export default Dropdown;

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { DropdownProps } from "./Dropdown.types";
+export declare const StyledSelect: import("@emotion/styled").StyledComponent<(import("@mui/material/Select").SelectProps<unknown> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>) & Omit<DropdownProps, "size"> & {
+    selectSize: "small" | "medium" | "large";
+}, {}, {}>;
+export declare const StyledMenuItem: import("@emotion/styled").StyledComponent<import("@mui/material/MenuItem").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "classes" | "className" | "style" | "children" | "sx" | "autoFocus" | "tabIndex" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "selected" | "dense" | "disableGutters" | "divider"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const StyledIconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

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

@@ -0,0 +1,11 @@
+import type { MenuItemProps, SelectProps } from "@mui/material";
+import type { JSX } from "react";
+export interface DropdownProps extends Omit<SelectProps, "size" | "variant" | "placeholder"> {
+    select?: "single" | "multiple";
+    size?: "small" | "medium" | "large";
+}
+export interface DropdownItemProps extends MenuItemProps {
+    leftIcon?: JSX.Element;
+    rightText?: string;
+    isFilledStyle?: boolean;
+}

package/dist/types/components/Dropdown/DropdownItem.d.ts

@@ -0,0 +1,13 @@
+import { SxProps } from "@mui/material";
+import { DropdownItemProps } from "./Dropdown.types";
+export declare function DropdownItem(props: DropdownItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function DropdownDivider({ sx }: {
+    sx?: SxProps;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function DropdownSubtitle({ title, sx, }: {
+    title: string;
+    sx?: SxProps;
+}): import("react/jsx-runtime").JSX.Element;
+export declare namespace DropdownSubtitle {
+    var muiSkipListHighlight: boolean;
+}

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

@@ -1 +1,3 @@
 export { default } from "./Dropdown";
+export { DropdownItem, DropdownDivider, DropdownSubtitle, } from "./DropdownItem";
+export type { DropdownProps, DropdownItemProps } from "./Dropdown.types";

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

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 import type { SxProps } from "@mui/material";
 import type { TextFieldProps as MuiTextFieldProps, OutlinedTextFieldProps } from "@mui/material/TextField";
+import type { JSX } from "react";
 export type TextFieldSize = "small" | "medium" | "large";
 export interface BaseTextFieldProps extends Omit<OutlinedTextFieldProps, "size" | "value" | "helperText" | "variant"> {
     /**

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import { type JSX } from "react";
 import type { SxProps } from "@mui/material";
 interface TextFieldProps {
     sx?: SxProps;

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

@@ -3,38 +3,7 @@ import type { ToggleButtonProps } from "../ToggleButton/ToggleButton.types";
 type CustomToggleButtonProps = ToggleButtonProps & {
     hasIconOnly: boolean;
 };
-export declare const CustomToggleButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ToggleButtonClasses> | undefined;
-    color?: "success" | "info" | "warning" | "error" | "standard" | "primary" | "secondary" | undefined;
-    disabled?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    fullWidth?: boolean | undefined;
-    onChange?: ((event: import("react").MouseEvent<HTMLElement, MouseEvent>, value: any) => void) | undefined;
-    onClick?: ((event: import("react").MouseEvent<HTMLElement, MouseEvent>, value: any) => void) | undefined;
-    selected?: boolean | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    value: {};
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "tabIndex" | "color" | "onChange" | "onClick" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "fullWidth" | "size" | "value" | "selected"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomToggleButtonProps, {}, {}>;
+export declare const CustomToggleButton: import("@emotion/styled").StyledComponent<import("@mui/material").ToggleButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "classes" | "className" | "style" | "children" | "sx" | "tabIndex" | "color" | "onChange" | "onClick" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "fullWidth" | "size" | "value" | "selected"> & 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 declare const IconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     hasIconOnly: boolean;

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

@@ -5,7 +5,7 @@ declare module "@mui/material/Typography" {
     interface TypographyPropsVariantOverrides extends TypographyPropsVariantOverridesType {
     }
 }
-declare const Typography: <C extends React.ElementType<any>>(props: TypographyProps<C, {
+declare const Typography: <C extends React.ElementType<any, keyof React.JSX.IntrinsicElements>>(props: TypographyProps<C, {
     component?: C | undefined;
 }>) => import("react/jsx-runtime").JSX.Element;
 export default Typography;

package/dist/types/foundation/Typography/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { TypographyOptions } from "@mui/material/styles/createTypography";
-type DSVariants = "headline1" | "headline2" | "headline3" | "headline4" | "headline5" | "body1_16_semibold" | "body1_16_regular" | "body2_14_bold" | "body2_14_medium" | "body2_14_regular" | "body3_12_semibold" | "body3_12_regular" | "button1" | "button2";
+type DSVariants = "headline1" | "headline2" | "headline3" | "headline4" | "headline5" | "body1_16_semibold" | "body1_16_regular" | "body2_14_bold" | "body2_14_medium" | "body2_14_regular" | "body3_12_semibold" | "body3_12_regular" | "body_m2" | "body_reg6" | "body_reg8" | "small_body_sb1" | "small_body_m2" | "button1" | "button2";
 type DSVariantsType = Record<DSVariants, React.CSSProperties>;
 declare module "@mui/material/styles" {
     interface TypographyVariants extends DSVariantsType {
@@ -24,6 +24,11 @@ export declare const typographyDefaultProps: {
         body2_14_regular: string;
         body3_12_semibold: string;
         body3_12_regular: string;
+        body_m2: string;
+        body_reg6: string;
+        body_reg8: string;
+        small_body_sb1: string;
+        small_body_m2: string;
     };
 };
 export declare const createTypographyCssBaseline: () => {
@@ -43,6 +48,12 @@ export declare const createTypographyCssBaseline: () => {
         "--caption-font-weight": "var(--font-weight-medium)";
         "--caption-font-size": "12px";
         "--caption-line-height": "16px";
+        "--small_body_sb1-font-weight": "var(--font-weight-semibold)";
+        "--small_body_sb1-font-size": "12px";
+        "--small_body_sb1-line-height": "16px";
+        "--small_body_m2-font-weight": "var(--font-weight-medium)";
+        "--small_body_m2-font-size": "12px";
+        "--small_body_m2-line-height": "20px";
         "--body1-16-semibold-font-weight": "var(--font-weight-semibold)";
         "--body1-16-semibold-font-size": "16px";
         "--body1-16-semibold-line-height": "24px";
@@ -64,6 +75,15 @@ export declare const createTypographyCssBaseline: () => {
         "--body3-12-regular-font-weight": "var(--font-weight-regular)";
         "--body3-12-regular-font-size": "12.4px";
         "--body3-12-regular-line-height": "16px";
+        "--body_m2-font-weight": "var(--font-weight-medium)";
+        "--body_m2-font-size": "13px";
+        "--body_m2-line-height": "18px";
+        "--body_reg6-font-weight": "var(--font-weight-regular)";
+        "--body_reg6-font-size": "13px";
+        "--body_reg6-line-height": "18px";
+        "--body_reg8-font-weight": "var(--font-weight-regular)";
+        "--body_reg8-font-size": "12px";
+        "--body_reg8-line-height": "16px";
         "--headline1-font-weight": "var(--font-weight-semibold)";
         "--headline1-font-size": "52px";
         "--headline1-line-height": "68px";

package/dist/types/foundation/Typography/tokens.d.ts

@@ -13,6 +13,12 @@ export declare const cssVariables: {
     "--caption-font-weight": "var(--font-weight-medium)";
     "--caption-font-size": "12px";
     "--caption-line-height": "16px";
+    "--small_body_sb1-font-weight": "var(--font-weight-semibold)";
+    "--small_body_sb1-font-size": "12px";
+    "--small_body_sb1-line-height": "16px";
+    "--small_body_m2-font-weight": "var(--font-weight-medium)";
+    "--small_body_m2-font-size": "12px";
+    "--small_body_m2-line-height": "20px";
     "--body1-16-semibold-font-weight": "var(--font-weight-semibold)";
     "--body1-16-semibold-font-size": "16px";
     "--body1-16-semibold-line-height": "24px";
@@ -34,6 +40,15 @@ export declare const cssVariables: {
     "--body3-12-regular-font-weight": "var(--font-weight-regular)";
     "--body3-12-regular-font-size": "12.4px";
     "--body3-12-regular-line-height": "16px";
+    "--body_m2-font-weight": "var(--font-weight-medium)";
+    "--body_m2-font-size": "13px";
+    "--body_m2-line-height": "18px";
+    "--body_reg6-font-weight": "var(--font-weight-regular)";
+    "--body_reg6-font-size": "13px";
+    "--body_reg6-line-height": "18px";
+    "--body_reg8-font-weight": "var(--font-weight-regular)";
+    "--body_reg8-font-size": "12px";
+    "--body_reg8-line-height": "16px";
     "--headline1-font-weight": "var(--font-weight-semibold)";
     "--headline1-font-size": "52px";
     "--headline1-line-height": "68px";

package/dist/types/foundation/colors/base/blue.d.ts

@@ -1,6 +1,7 @@
 export declare const blue: {
     5: string;
     10: string;
+    15: string;
     20: string;
     30: string;
     40: string;
@@ -13,6 +14,7 @@ export declare const blue: {
 export declare const blueText: {
     5: string;
     10: string;
+    15: string;
     20: string;
     30: string;
     40: string;

package/dist/types/foundation/colors/base/green.d.ts

@@ -1,6 +1,7 @@
 export declare const green: {
     5: string;
     10: string;
+    15: string;
     20: string;
     30: string;
     40: string;
@@ -13,6 +14,7 @@ export declare const green: {
 export declare const greenText: {
     5: string;
     10: string;
+    15: string;
     20: string;
     30: string;
     40: string;

package/dist/types/foundation/colors/base/grey.d.ts

@@ -6,14 +6,21 @@ export declare const grey: {
     20: string;
     25: string;
     30: string;
+    35: string;
     40: string;
+    45: string;
     50: string;
+    55: string;
     60: string;
+    65: string;
     70: string;
     75: string;
     80: string;
+    82: string;
     85: string;
+    88: string;
     90: string;
+    93: string;
     95: string;
     100: string;
 };
@@ -25,13 +32,21 @@ export declare const greyText: {
     20: string;
     25: string;
     30: string;
+    35: string;
     40: string;
+    45: string;
     50: string;
+    55: string;
     60: string;
+    65: string;
     70: string;
+    75: string;
     80: string;
+    82: string;
     85: string;
+    88: string;
     90: string;
+    93: string;
     95: string;
     100: string;
 };