@lunit/design-system 1.0.0-a.4 → 1.0.0-a.5

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

@@ -101,6 +101,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     breakInside?: import("csstype").Property.BreakInside | undefined;
     captionSide?: import("csstype").Property.CaptionSide | undefined;
     caretColor?: import("csstype").Property.CaretColor | undefined;
+    caretShape?: import("csstype").Property.CaretShape | undefined;
     clear?: import("csstype").Property.Clear | undefined;
     clipPath?: import("csstype").Property.ClipPath | undefined;
     color?: import("csstype").Property.Color | undefined;
@@ -115,6 +116,12 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     columnSpan?: import("csstype").Property.ColumnSpan | undefined;
     columnWidth?: import("csstype").Property.ColumnWidth<string | number> | undefined;
     contain?: import("csstype").Property.Contain | undefined;
+    containIntrinsicBlockSize?: string | number | undefined;
+    containIntrinsicHeight?: string | number | undefined;
+    containIntrinsicInlineSize?: string | number | undefined;
+    containIntrinsicWidth?: string | number | undefined;
+    containerName?: import("csstype").Property.ContainerName | undefined;
+    containerType?: import("csstype").Property.ContainerType | undefined;
     content?: import("csstype").Property.Content | undefined;
     contentVisibility?: import("csstype").Property.ContentVisibility | undefined;
     counterIncrement?: import("csstype").Property.CounterIncrement | undefined;
@@ -136,6 +143,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     fontKerning?: import("csstype").Property.FontKerning | undefined;
     fontLanguageOverride?: import("csstype").Property.FontLanguageOverride | undefined;
     fontOpticalSizing?: import("csstype").Property.FontOpticalSizing | undefined;
+    fontPalette?: import("csstype").Property.FontPalette | undefined;
     fontSize?: string | number | undefined;
     fontSizeAdjust?: import("csstype").Property.FontSizeAdjust | undefined;
     fontSmooth?: import("csstype").Property.FontSmooth<string | number> | undefined;
@@ -146,6 +154,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     fontVariantAlternates?: import("csstype").Property.FontVariantAlternates | undefined;
     fontVariantCaps?: import("csstype").Property.FontVariantCaps | undefined;
     fontVariantEastAsian?: import("csstype").Property.FontVariantEastAsian | undefined;
+    fontVariantEmoji?: import("csstype").Property.FontVariantEmoji | undefined;
     fontVariantLigatures?: import("csstype").Property.FontVariantLigatures | undefined;
     fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | undefined;
     fontVariantPosition?: import("csstype").Property.FontVariantPosition | undefined;
@@ -165,6 +174,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     hangingPunctuation?: import("csstype").Property.HangingPunctuation | undefined;
     height?: string | number | undefined;
     hyphenateCharacter?: import("csstype").Property.HyphenateCharacter | undefined;
+    hyphenateLimitChars?: import("csstype").Property.HyphenateLimitChars | undefined;
     hyphens?: import("csstype").Property.Hyphens | undefined;
     imageOrientation?: import("csstype").Property.ImageOrientation | undefined;
     imageRendering?: import("csstype").Property.ImageRendering | undefined;
@@ -172,11 +182,8 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     initialLetter?: import("csstype").Property.InitialLetter | undefined;
     inlineSize?: string | number | undefined;
     inputSecurity?: import("csstype").Property.InputSecurity | undefined;
-    inset?: string | number | undefined;
-    insetBlock?: string | number | undefined;
     insetBlockEnd?: string | number | undefined;
     insetBlockStart?: string | number | undefined;
-    insetInline?: string | number | undefined;
     insetInlineEnd?: string | number | undefined;
     insetInlineStart?: string | number | undefined;
     isolation?: import("csstype").Property.Isolation | undefined;
@@ -192,16 +199,15 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     listStyleImage?: import("csstype").Property.ListStyleImage | undefined;
     listStylePosition?: import("csstype").Property.ListStylePosition | undefined;
     listStyleType?: import("csstype").Property.ListStyleType | undefined;
-    marginBlock?: string | number | undefined;
     marginBlockEnd?: string | number | undefined;
     marginBlockStart?: string | number | undefined;
     marginBottom?: string | number | undefined;
-    marginInline?: string | number | undefined;
     marginInlineEnd?: string | number | undefined;
     marginInlineStart?: string | number | undefined;
     marginLeft?: string | number | undefined;
     marginRight?: string | number | undefined;
     marginTop?: string | number | undefined;
+    marginTrim?: import("csstype").Property.MarginTrim | undefined;
     maskBorderMode?: import("csstype").Property.MaskBorderMode | undefined;
     maskBorderOutset?: string | number | undefined;
     maskBorderRepeat?: import("csstype").Property.MaskBorderRepeat | undefined;
@@ -236,6 +242,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     offsetAnchor?: string | number | undefined;
     offsetDistance?: string | number | undefined;
     offsetPath?: import("csstype").Property.OffsetPath | undefined;
+    offsetPosition?: string | number | undefined;
     offsetRotate?: import("csstype").Property.OffsetRotate | undefined;
     offsetRotation?: import("csstype").Property.OffsetRotate | undefined;
     opacity?: import("csstype").Property.Opacity | undefined;
@@ -257,23 +264,21 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     overscrollBehaviorInline?: import("csstype").Property.OverscrollBehaviorInline | undefined;
     overscrollBehaviorX?: import("csstype").Property.OverscrollBehaviorX | undefined;
     overscrollBehaviorY?: import("csstype").Property.OverscrollBehaviorY | undefined;
-    paddingBlock?: string | number | undefined;
     paddingBlockEnd?: string | number | undefined;
     paddingBlockStart?: string | number | undefined;
     paddingBottom?: string | number | undefined;
-    paddingInline?: string | number | undefined;
     paddingInlineEnd?: string | number | undefined;
     paddingInlineStart?: string | number | undefined;
     paddingLeft?: string | number | undefined;
     paddingRight?: string | number | undefined;
     paddingTop?: string | number | undefined;
+    page?: import("csstype").Property.Page | undefined;
     pageBreakAfter?: import("csstype").Property.PageBreakAfter | undefined;
     pageBreakBefore?: import("csstype").Property.PageBreakBefore | undefined;
     pageBreakInside?: import("csstype").Property.PageBreakInside | undefined;
     paintOrder?: import("csstype").Property.PaintOrder | undefined;
     perspective?: import("csstype").Property.Perspective<string | number> | undefined;
     perspectiveOrigin?: string | number | undefined;
-    placeContent?: import("csstype").Property.PlaceContent | undefined;
     pointerEvents?: import("csstype").Property.PointerEvents | undefined;
     position?: import("csstype").Property.Position | undefined;
     printColorAdjust?: import("csstype").Property.PrintColorAdjust | undefined;
@@ -287,36 +292,31 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     rubyPosition?: import("csstype").Property.RubyPosition | undefined;
     scale?: import("csstype").Property.Scale | undefined;
     scrollBehavior?: import("csstype").Property.ScrollBehavior | undefined;
-    scrollMargin?: string | number | undefined;
-    scrollMarginBlock?: string | number | undefined;
     scrollMarginBlockEnd?: import("csstype").Property.ScrollMarginBlockEnd<string | number> | undefined;
     scrollMarginBlockStart?: import("csstype").Property.ScrollMarginBlockStart<string | number> | undefined;
     scrollMarginBottom?: import("csstype").Property.ScrollMarginBottom<string | number> | undefined;
-    scrollMarginInline?: string | number | undefined;
     scrollMarginInlineEnd?: import("csstype").Property.ScrollMarginInlineEnd<string | number> | undefined;
     scrollMarginInlineStart?: import("csstype").Property.ScrollMarginInlineStart<string | number> | undefined;
     scrollMarginLeft?: import("csstype").Property.ScrollMarginLeft<string | number> | undefined;
     scrollMarginRight?: import("csstype").Property.ScrollMarginRight<string | number> | undefined;
     scrollMarginTop?: import("csstype").Property.ScrollMarginTop<string | number> | undefined;
-    scrollPadding?: string | number | undefined;
-    scrollPaddingBlock?: string | number | undefined;
     scrollPaddingBlockEnd?: string | number | undefined;
     scrollPaddingBlockStart?: string | number | undefined;
     scrollPaddingBottom?: string | number | undefined;
-    scrollPaddingInline?: string | number | undefined;
     scrollPaddingInlineEnd?: string | number | undefined;
     scrollPaddingInlineStart?: string | number | undefined;
     scrollPaddingLeft?: string | number | undefined;
     scrollPaddingRight?: string | number | undefined;
     scrollPaddingTop?: string | number | undefined;
     scrollSnapAlign?: import("csstype").Property.ScrollSnapAlign | undefined;
-    scrollSnapMargin?: string | number | undefined;
     scrollSnapMarginBottom?: import("csstype").Property.ScrollMarginBottom<string | number> | undefined;
     scrollSnapMarginLeft?: import("csstype").Property.ScrollMarginLeft<string | number> | undefined;
     scrollSnapMarginRight?: import("csstype").Property.ScrollMarginRight<string | number> | undefined;
     scrollSnapMarginTop?: import("csstype").Property.ScrollMarginTop<string | number> | undefined;
     scrollSnapStop?: import("csstype").Property.ScrollSnapStop | undefined;
     scrollSnapType?: import("csstype").Property.ScrollSnapType | undefined;
+    scrollTimelineAxis?: import("csstype").Property.ScrollTimelineAxis | undefined;
+    scrollTimelineName?: import("csstype").Property.ScrollTimelineName | undefined;
     scrollbarColor?: import("csstype").Property.ScrollbarColor | undefined;
     scrollbarGutter?: import("csstype").Property.ScrollbarGutter | undefined;
     scrollbarWidth?: import("csstype").Property.ScrollbarWidth | undefined;
@@ -361,6 +361,7 @@ 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;
+    viewTransitionName?: import("csstype").Property.ViewTransitionName | undefined;
     visibility?: import("csstype").Property.Visibility | undefined;
     whiteSpace?: import("csstype").Property.WhiteSpace | undefined;
     widows?: import("csstype").Property.Widows | undefined;
@@ -392,8 +393,11 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     borderStyle?: import("csstype").Property.BorderStyle | undefined;
     borderTop?: string | number | undefined;
     borderWidth?: string | number | undefined;
+    caret?: import("csstype").Property.Caret | undefined;
     columnRule?: string | number | undefined;
     columns?: string | number | undefined;
+    containIntrinsicSize?: string | number | undefined;
+    container?: import("csstype").Property.Container | undefined;
     flex?: string | number | undefined;
     flexFlow?: import("csstype").Property.FlexFlow | undefined;
     font?: import("csstype").Property.Font | undefined;
@@ -403,9 +407,14 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     gridColumn?: import("csstype").Property.GridColumn | undefined;
     gridRow?: import("csstype").Property.GridRow | undefined;
     gridTemplate?: import("csstype").Property.GridTemplate | undefined;
+    inset?: string | number | undefined;
+    insetBlock?: string | number | undefined;
+    insetInline?: string | number | undefined;
     lineClamp?: import("csstype").Property.LineClamp | undefined;
     listStyle?: import("csstype").Property.ListStyle | undefined;
     margin?: string | number | undefined;
+    marginBlock?: string | number | undefined;
+    marginInline?: string | number | undefined;
     mask?: string | number | undefined;
     maskBorder?: import("csstype").Property.MaskBorder | undefined;
     motion?: string | number | undefined;
@@ -413,8 +422,19 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     outline?: string | number | undefined;
     overflow?: import("csstype").Property.Overflow | undefined;
     overscrollBehavior?: import("csstype").Property.OverscrollBehavior | undefined;
+    paddingBlock?: string | number | undefined;
+    paddingInline?: string | number | undefined;
+    placeContent?: import("csstype").Property.PlaceContent | undefined;
     placeItems?: import("csstype").Property.PlaceItems | undefined;
     placeSelf?: import("csstype").Property.PlaceSelf | undefined;
+    scrollMargin?: string | number | undefined;
+    scrollMarginBlock?: string | number | undefined;
+    scrollMarginInline?: string | number | undefined;
+    scrollPadding?: string | number | undefined;
+    scrollPaddingBlock?: string | number | undefined;
+    scrollPaddingInline?: string | number | undefined;
+    scrollSnapMargin?: string | number | undefined;
+    scrollTimeline?: import("csstype").Property.ScrollTimeline | undefined;
     textDecoration?: string | number | undefined;
     textEmphasis?: import("csstype").Property.TextEmphasis | undefined;
     transition?: import("csstype").Property.Transition<string & {}> | undefined;
@@ -428,6 +448,7 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     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;
     MozBorderEndStyle?: import("csstype").Property.BorderInlineEndStyle | undefined;
@@ -708,7 +729,6 @@ export declare const sizeStyle: ({ size, kind, hasIconOnly, typography, selected
     MozBackgroundInlinePolicy?: import("csstype").Property.BoxDecorationBreak | undefined;
     MozBackgroundOrigin?: import("csstype").Property.BackgroundOrigin | undefined;
     MozBackgroundSize?: string | number | undefined;
-    MozBinding?: import("csstype").Property.MozBinding | undefined;
     MozBorderRadius?: string | number | undefined;
     MozBorderRadiusBottomleft?: string | number | undefined;
     MozBorderRadiusBottomright?: string | number | undefined;
@@ -881,7 +901,7 @@ 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" | "inherit" | "primary" | "secondary" | undefined;
+    color?: "primary" | "secondary" | "error" | "inherit" | "success" | "info" | "warning" | undefined;
     disabled?: boolean | undefined;
     disableElevation?: boolean | undefined;
     disableFocusRipple?: boolean | undefined;
@@ -891,7 +911,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?: "text" | "contained" | "outlined" | undefined;
 } & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
     centerRipple?: boolean | undefined;
@@ -910,5 +930,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;
-}, 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, {}, {}>;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & CustomButtonProps, {}, {}>;
 export {};

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

@@ -13,7 +13,7 @@ interface GhostButtonProps extends BaseButtonProps {
 }
 interface OutlinedButtonProps extends BaseButtonProps {
     kind?: "outlined";
-    color?: "primary";
+    color?: "primary" | "secondary";
 }
 export type ButtonProps = ContainedButtonProps | GhostButtonProps | OutlinedButtonProps;
 export {};

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

@@ -6,7 +6,7 @@ export declare const StyledOutlinedChip: import("@emotion/styled").StyledCompone
     children?: null | undefined;
     classes?: Partial<import("@mui/material").ChipClasses> | undefined;
     clickable?: boolean | undefined;
-    color?: "success" | "info" | "warning" | "error" | "primary" | "secondary" | "default" | undefined;
+    color?: "primary" | "secondary" | "error" | "success" | "info" | "warning" | "default" | 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;
@@ -16,16 +16,16 @@ export declare const StyledOutlinedChip: import("@emotion/styled").StyledCompone
     skipFocusWhenDisabled?: boolean | undefined;
     sx?: import("@mui/material").SxProps<Theme> | undefined;
     tabIndex?: number | undefined;
-    variant?: "filled" | "outlined" | 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;
-}, 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, {}, {}>;
+}, "icon" | keyof import("@mui/material/OverridableComponent").CommonProps | "label" | "tabIndex" | "color" | "children" | "disabled" | "sx" | "size" | "variant" | "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" | "primary" | "secondary" | "default" | undefined;
+    color?: "primary" | "secondary" | "error" | "success" | "info" | "warning" | "default" | 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;
@@ -35,16 +35,16 @@ export declare const StyledContainedChipBase: import("@emotion/styled").StyledCo
     skipFocusWhenDisabled?: boolean | undefined;
     sx?: import("@mui/material").SxProps<Theme> | undefined;
     tabIndex?: number | undefined;
-    variant?: "filled" | "outlined" | 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;
-}, 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, {}, {}>;
+}, "icon" | keyof import("@mui/material/OverridableComponent").CommonProps | "label" | "tabIndex" | "color" | "children" | "disabled" | "sx" | "size" | "variant" | "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" | "primary" | "secondary" | "default" | undefined;
+    color?: "primary" | "secondary" | "error" | "success" | "info" | "warning" | "default" | 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;
@@ -54,16 +54,16 @@ export declare const StyledContainedChipEnable: import("@emotion/styled").Styled
     skipFocusWhenDisabled?: boolean | undefined;
     sx?: import("@mui/material").SxProps<Theme> | undefined;
     tabIndex?: number | undefined;
-    variant?: "filled" | "outlined" | 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;
-}, 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, {}, {}>;
+}, "icon" | keyof import("@mui/material/OverridableComponent").CommonProps | "label" | "tabIndex" | "color" | "children" | "disabled" | "sx" | "size" | "variant" | "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" | "primary" | "secondary" | "default" | undefined;
+    color?: "primary" | "secondary" | "error" | "success" | "info" | "warning" | "default" | 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;
@@ -73,7 +73,7 @@ export declare const StyledContainedChipDeletable: import("@emotion/styled").Sty
     skipFocusWhenDisabled?: boolean | undefined;
     sx?: import("@mui/material").SxProps<Theme> | undefined;
     tabIndex?: number | undefined;
-    variant?: "filled" | "outlined" | 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;
-}, 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, {}, {}>;
+}, "icon" | keyof import("@mui/material/OverridableComponent").CommonProps | "label" | "tabIndex" | "color" | "children" | "disabled" | "sx" | "size" | "variant" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled"> & import("@mui/system").MUIStyledCommonProps<Theme> & BaseContainedChipProps, {}, {}>;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CHIP_COLORS } from "./consts";
 import type { ChipProps as MuiChipProps } from "@mui/material";
 type ColorKeys = keyof typeof CHIP_COLORS;

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

@@ -1,6 +1,8 @@
 /// <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"> & {
+declare const BaseTextField: import("@emotion/styled").StyledComponent<{
+    variant?: import("@mui/material/TextField").TextFieldVariants | undefined;
+} & Omit<import("@mui/material/TextField").OutlinedTextFieldProps | import("@mui/material/TextField").FilledTextFieldProps | import("@mui/material/TextField").StandardTextFieldProps, "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Omit<TextFieldProps, "size"> & {
     textFieldSize: TextFieldSize;
     hasLeftIcon?: boolean | undefined;
     hasRightIcon?: boolean | undefined;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { SxProps } from "@mui/material";
 import type { OutlinedTextFieldProps } from "@mui/material/TextField";
 export type TextFieldSize = "small" | "medium" | "large";
@@ -5,7 +6,7 @@ export interface BaseTextFieldProps extends Omit<OutlinedTextFieldProps, "size"
     /**
      * The design system TextField variable is outlined fixed.
      */
-    variant: "outlined";
+    variant?: "outlined";
     value?: string;
     helperText?: string;
     /**
@@ -14,7 +15,6 @@ export interface BaseTextFieldProps extends Omit<OutlinedTextFieldProps, "size"
     size?: TextFieldSize;
 }
 export interface SingleTextFieldProps extends BaseTextFieldProps {
-    size: TextFieldSize;
     leftIcon?: JSX.Element;
     rightIcon?: JSX.Element;
     leftIconSx?: SxProps;
@@ -24,6 +24,5 @@ export interface SingleTextFieldProps extends BaseTextFieldProps {
 }
 export interface MultiTextFieldProps extends BaseTextFieldProps {
     rows?: number | string;
-    size: TextFieldSize;
 }
 export type TextFieldProps = SingleTextFieldProps | MultiTextFieldProps;

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

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

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

@@ -1 +1,2 @@
-export { default as Toast } from './Toast';
+export { default } from "./Toast";
+export type { ToastProps } from "./Toast.types";

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

@@ -6,7 +6,7 @@ type CustomToggleButtonProps = ToggleButtonProps & {
 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;
+    color?: "primary" | "secondary" | "error" | "success" | "info" | "warning" | "standard" | undefined;
     disabled?: boolean | undefined;
     disableFocusRipple?: boolean | undefined;
     fullWidth?: boolean | undefined;
@@ -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;
-}, 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, {}, {}>;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "onChange" | "onClick" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "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 {};

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

@@ -0,0 +1,7 @@
+import Typography from "@mui/material/Typography";
+import type { TypographyPropsVariantOverridesType } from "../../foundation/Typography";
+declare module "@mui/material/Typography" {
+    interface TypographyPropsVariantOverrides extends TypographyPropsVariantOverridesType {
+    }
+}
+export default Typography;

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

@@ -8,11 +8,7 @@ declare module "@mui/material/styles" {
     interface TypographyVariantsOptions extends Partial<DSVariantsType> {
     }
 }
-type TypographyPropsVariantOverridesType = Record<DSVariants, true>;
-declare module "@mui/material/Typography" {
-    interface TypographyPropsVariantOverrides extends TypographyPropsVariantOverridesType {
-    }
-}
+export type TypographyPropsVariantOverridesType = Record<DSVariants, true>;
 declare const typographyOptions: TypographyOptions;
 export declare const typographyDefaultProps: {
     variantMapping: {

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

@@ -131,17 +131,15 @@ declare const paletteOptions: {
             shadow_04: string;
         };
         component: {
-            btn_contained_primary_bg: string;
-            btn_contained_primary_text: string;
-            btn_contained_secondary_bg: string;
-            btn_contained_secondary_text: string;
-            btn_contained_error_bg: string;
-            btn_contained_error_text: string;
-            btn_outlined_primary_border: string;
-            btn_outlined_primary_text: string;
-            btn_ghost_primary_text: string;
-            btn_ghost_secondary_text: string;
-            btn_ghost_error_text: string;
+            btn_primary_bg: string;
+            btn_secondary_bg: string;
+            btn_error_bg: string;
+            btn_primary_border: string;
+            btn_secondary_border: string;
+            btn_primary_text_1: string;
+            btn_primary_text_2: string;
+            btn_secondary_text: string;
+            btn_error_text: string;
             btn_selected_primary_bg: string;
             btn_selected_primary_text: string;
             btn_selected_secondary_bg: string;

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

@@ -29,17 +29,15 @@ export interface ColorToken {
         shadow_04: CSSPropertyColor;
     };
     component: {
-        btn_contained_primary_bg: CSSPropertyColor;
-        btn_contained_primary_text: CSSPropertyColor;
-        btn_contained_secondary_bg: CSSPropertyColor;
-        btn_contained_secondary_text: CSSPropertyColor;
-        btn_contained_error_bg: CSSPropertyColor;
-        btn_contained_error_text: CSSPropertyColor;
-        btn_outlined_primary_border: CSSPropertyColor;
-        btn_outlined_primary_text: CSSPropertyColor;
-        btn_ghost_primary_text: CSSPropertyColor;
-        btn_ghost_secondary_text: CSSPropertyColor;
-        btn_ghost_error_text: CSSPropertyColor;
+        btn_primary_bg: CSSPropertyColor;
+        btn_secondary_bg: CSSPropertyColor;
+        btn_error_bg: CSSPropertyColor;
+        btn_primary_border: CSSPropertyColor;
+        btn_secondary_border: CSSPropertyColor;
+        btn_primary_text_1: CSSPropertyColor;
+        btn_primary_text_2: CSSPropertyColor;
+        btn_secondary_text: CSSPropertyColor;
+        btn_error_text: CSSPropertyColor;
         btn_selected_primary_bg: CSSPropertyColor;
         btn_selected_primary_text: CSSPropertyColor;
         btn_selected_secondary_bg: CSSPropertyColor;

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

@@ -78,17 +78,15 @@ export declare const palette: {
             shadow_04: string;
         };
         component: {
-            btn_contained_primary_bg: string;
-            btn_contained_primary_text: string;
-            btn_contained_secondary_bg: string;
-            btn_contained_secondary_text: string;
-            btn_contained_error_bg: string;
-            btn_contained_error_text: string;
-            btn_outlined_primary_border: string;
-            btn_outlined_primary_text: string;
-            btn_ghost_primary_text: string;
-            btn_ghost_secondary_text: string;
-            btn_ghost_error_text: string;
+            btn_primary_bg: string;
+            btn_secondary_bg: string;
+            btn_error_bg: string;
+            btn_primary_border: string;
+            btn_secondary_border: string;
+            btn_primary_text_1: string;
+            btn_primary_text_2: string;
+            btn_secondary_text: string;
+            btn_error_text: string;
             btn_selected_primary_bg: string;
             btn_selected_primary_text: string;
             btn_selected_secondary_bg: string;

package/dist/types/index.d.ts

@@ -3,6 +3,7 @@ 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";
+export { default as Checkbox } from "./components/Checkbox";
 export { default as DataTable } from "./components/DataTable";
 export { default as DatePicker } from "./components/DatePicker";
 export { default as Dropdown } from "./components/Dropdown";
@@ -11,7 +12,9 @@ export { default as Modal } from "./components/Modal";
 export { default as Radio } from "./components/Radio";
 export { default as RadioGroup } from "./components/RadioGroup";
 export { default as TextField } from "./components/TextField";
+export { default as Toast } from "./components/Toast";
 export { default as Toggle } from "./components/Toggle";
 export { default as ToggleButton } from "./components/ToggleButton";
 export { default as ToggleButtonGroup } from "./components/ToggleButtonGroup";
 export { default as Tooltip } from "./components/Tooltip";
+export { default as Typography } from "./components/Typography";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lunit/design-system",
-  "version": "1.0.0-a.4",
+  "version": "1.0.0-a.5",
   "description": "Lunit Design System",
   "main": "dist/cjs/index.js",
   "module": "dist/index.js",
@@ -37,7 +37,7 @@
   "scripts": {
     "build:transpile": "tsc -p tsconfig.build.json",
     "build:cjs": "webpack -c webpack/cjs.config.js",
-    "build": "yarn build:transpile && yarn build:cjs",
+    "build": "npm run build:transpile && npm run build:cjs",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "chromatic": "chromatic"
@@ -48,6 +48,11 @@
         "dependsOn": [
           "^build"
         ]
+      },
+      "build-storybook": {
+        "dependsOn": [
+          "^build"
+        ]
       }
     }
   },
@@ -61,27 +66,27 @@
     "@mui/icons-material": "^5.11.3",
     "@mui/material": "^5.11.3",
     "@mui/utils": "^5.11.3",
-    "@mui/x-date-pickers": "^5.0.16",
-    "@storybook/addon-actions": "^7.0.6",
-    "@storybook/addon-essentials": "^7.0.6",
-    "@storybook/addon-interactions": "^7.0.6",
-    "@storybook/addon-links": "^7.0.6",
-    "@storybook/addon-storysource": "^7.0.6",
-    "@storybook/blocks": "^7.0.6",
-    "@storybook/react": "^7.0.6",
-    "@storybook/react-webpack5": "^7.0.6",
+    "@mui/x-date-pickers": "^5.0.20",
+    "@storybook/addon-actions": "^7.0.21",
+    "@storybook/addon-essentials": "^7.0.21",
+    "@storybook/addon-interactions": "^7.0.21",
+    "@storybook/addon-links": "^7.0.21",
+    "@storybook/addon-storysource": "^7.0.21",
+    "@storybook/blocks": "^7.0.21",
+    "@storybook/react": "^7.0.21",
+    "@storybook/react-webpack5": "^7.0.21",
     "@storybook/testing-library": "^0.1.0",
-    "@storybook/theming": "^7.0.6",
+    "@storybook/theming": "^7.0.21",
     "@types/lodash": "^4.14.182",
     "babel-loader": "^8.2.5",
     "chromatic": "^6.7.0",
     "dayjs": "^1.11.7",
     "lodash": "^4.17.21",
     "mustache": "^4.2.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "storybook": "^7.0.6",
-    "storybook-addon-pseudo-states": "^2.0.0",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "storybook": "^7.0.21",
+    "storybook-addon-pseudo-states": "^2.0.1",
     "ts-loader": "^9.3.0",
     "typescript": "^4.6.4",
     "webpack": "^5.72.0",