@lunit/design-system 1.0.0-a.1

package/dist/foundation/colors/base/lunitTeal.d.ts

@@ -0,0 +1,24 @@
+export declare const lunitTeal: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const lunitTealText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

package/dist/foundation/colors/base/magenta.d.ts

@@ -0,0 +1,24 @@
+export declare const magenta: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const magentaText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

package/dist/foundation/colors/base/opacity.d.ts

@@ -0,0 +1,6 @@
+export declare const opacity: {
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+};

package/dist/foundation/colors/base/orange.d.ts

@@ -0,0 +1,24 @@
+export declare const orange: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const orangeText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

package/dist/foundation/colors/base/purple.d.ts

@@ -0,0 +1,24 @@
+export declare const purple: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const purpleText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

package/dist/foundation/colors/base/red.d.ts

@@ -0,0 +1,24 @@
+export declare const red: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const redText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

package/dist/foundation/colors/base/yellow.d.ts

@@ -0,0 +1,24 @@
+export declare const yellow: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};
+export declare const yellowText: {
+    5: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    60: string;
+    70: string;
+    80: string;
+    90: string;
+};

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

@@ -0,0 +1,155 @@
+import { PaletteColor } from "@mui/material/styles";
+import * as base from "./base";
+import { ColorToken } from "./types";
+export type BaseColor = Record<keyof typeof base.blue, PaletteColor>;
+export type GreyColor = Record<keyof typeof base.grey, PaletteColor>;
+declare module "@mui/material/styles/createPalette" {
+    interface PaletteOptions {
+        lunit?: {
+            grey: GreyColor;
+            blue: BaseColor;
+            green: BaseColor;
+            lunitGreen: BaseColor;
+            lunitTeal: BaseColor;
+            magenta: BaseColor;
+            orange: BaseColor;
+            red: BaseColor;
+            yellow: BaseColor;
+        };
+        token?: ColorToken;
+    }
+    interface Palette {
+        lunit: {
+            grey: GreyColor;
+            blue: BaseColor;
+            green: BaseColor;
+            lunitGreen: BaseColor;
+            lunitTeal: BaseColor;
+            magenta: BaseColor;
+            orange: BaseColor;
+            red: BaseColor;
+            yellow: BaseColor;
+        };
+        token: ColorToken;
+    }
+}
+export declare const createColorCssBaseline: () => {
+    ":root": {
+        [x: string]: string;
+    };
+    ".light1": {
+        [x: string]: string;
+    };
+    ".light2": {
+        [x: string]: string;
+    };
+    ".dark1": {
+        [x: string]: string;
+    };
+    ".dark2": {
+        [x: string]: string;
+    };
+    ".dark3": {
+        [x: string]: string;
+    };
+    ".dark4": {
+        [x: string]: string;
+    };
+};
+declare const paletteOptions: {
+    lunit: {
+        grey: GreyColor;
+        blue: BaseColor;
+        green: BaseColor;
+        lunitGreen: BaseColor;
+        lunitTeal: BaseColor;
+        magenta: BaseColor;
+        orange: BaseColor;
+        red: BaseColor;
+        yellow: BaseColor;
+    } | undefined;
+    token: {
+        core: {
+            bg_01: string;
+            bg_02: string;
+            bg_03: string;
+            text_primary: string;
+            text_normal: string;
+            text_medium: string;
+            text_light: string;
+            text_error: string;
+            text_success: string;
+            text_warning: string;
+            text_info: string;
+            link_primary: string;
+            link_hover: string;
+            link_visited: string;
+            icon_error_02: string;
+            icon_success_02: string;
+            icon_warning_02: string;
+            icon_info_02: string;
+            hover: string;
+            focused: string;
+            shadow_01: string;
+            shadow_02: string;
+            shadow_03: string;
+            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_selected_primary_bg: string;
+            btn_selected_primary_text: string;
+            btn_selected_secondary_bg: string;
+            btn_selected_secondary_text: string;
+            selectcontrol_on: string;
+            selectcontrol_off: string;
+            selectcontrol_handler: string;
+            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;
+            scrollbars_bg: string;
+            scrollbars_hover: string;
+            scrollbars_pressed: string;
+            modal_overlay: string;
+            tooltip_bg: string;
+            tooltip_text_normal: string;
+            tooltip_text_medium: string;
+            alert_error_bg: string;
+            alert_error_border: string;
+            alert_success_bg: string;
+            alert_success_border: string;
+            alert_info_bg: string;
+            alert_info_border: string;
+            alert_warning_bg: string;
+            alert_warning_border: string;
+            chip_primary_bg: string;
+            chip_primary_text: string;
+            chip_secondary_bg: string;
+            chip_secondary_text: string;
+            chip_error_bg: string;
+            chip_error_text: string;
+            chip_warning_bg: string;
+            chip_warning_text: string;
+            chip_success_bg: string;
+            chip_success_text: string;
+        };
+    };
+};
+export default paletteOptions;

package/dist/foundation/colors/token/component.d.ts

@@ -0,0 +1,7 @@
+import { ColorTokenValueBySurface } from "./types";
+export interface TokenComponentColorValue {
+    [component: string]: {
+        [token: string]: ColorTokenValueBySurface;
+    };
+}
+export declare const tokenComponentColor: TokenComponentColorValue;

package/dist/foundation/colors/token/core.d.ts

@@ -0,0 +1,5 @@
+import { ColorTokenValueBySurface } from "./types";
+export interface TokenCoreColorValue {
+    [token: string]: ColorTokenValueBySurface;
+}
+export declare const tokenCoreColor: TokenCoreColorValue;

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

@@ -0,0 +1,2 @@
+export * from "./component";
+export * from "./core";

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

@@ -0,0 +1,8 @@
+export interface ColorTokenValueBySurface {
+    light1: string;
+    light2: string;
+    dark1: string;
+    dark2: string;
+    dark3: string;
+    dark4: string;
+}

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

@@ -0,0 +1,86 @@
+/// <reference types="react" />
+type CSSPropertyColor = React.CSSProperties["color"];
+export interface ColorToken {
+    core: {
+        bg_01: CSSPropertyColor;
+        bg_02: CSSPropertyColor;
+        bg_03: CSSPropertyColor;
+        text_primary: CSSPropertyColor;
+        text_normal: CSSPropertyColor;
+        text_medium: CSSPropertyColor;
+        text_light: CSSPropertyColor;
+        text_error: CSSPropertyColor;
+        text_success: CSSPropertyColor;
+        text_warning: CSSPropertyColor;
+        text_info: CSSPropertyColor;
+        link_primary: CSSPropertyColor;
+        link_hover: CSSPropertyColor;
+        link_visited: CSSPropertyColor;
+        icon_error_02: CSSPropertyColor;
+        icon_success_02: CSSPropertyColor;
+        icon_warning_02: CSSPropertyColor;
+        icon_info_02: CSSPropertyColor;
+        hover: CSSPropertyColor;
+        focused: CSSPropertyColor;
+        shadow_01: CSSPropertyColor;
+        shadow_02: CSSPropertyColor;
+        shadow_03: CSSPropertyColor;
+        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_selected_primary_bg: CSSPropertyColor;
+        btn_selected_primary_text: CSSPropertyColor;
+        btn_selected_secondary_bg: CSSPropertyColor;
+        btn_selected_secondary_text: CSSPropertyColor;
+        selectcontrol_on: CSSPropertyColor;
+        selectcontrol_off: CSSPropertyColor;
+        selectcontrol_handler: CSSPropertyColor;
+        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;
+        scrollbars_bg: CSSPropertyColor;
+        scrollbars_hover: CSSPropertyColor;
+        scrollbars_pressed: CSSPropertyColor;
+        modal_overlay: CSSPropertyColor;
+        tooltip_bg: CSSPropertyColor;
+        tooltip_text_normal: CSSPropertyColor;
+        tooltip_text_medium: CSSPropertyColor;
+        alert_error_bg: CSSPropertyColor;
+        alert_error_border: CSSPropertyColor;
+        alert_success_bg: CSSPropertyColor;
+        alert_success_border: CSSPropertyColor;
+        alert_info_bg: CSSPropertyColor;
+        alert_info_border: CSSPropertyColor;
+        alert_warning_bg: CSSPropertyColor;
+        alert_warning_border: CSSPropertyColor;
+        chip_primary_bg: CSSPropertyColor;
+        chip_primary_text: CSSPropertyColor;
+        chip_secondary_bg: CSSPropertyColor;
+        chip_secondary_text: CSSPropertyColor;
+        chip_error_bg: CSSPropertyColor;
+        chip_error_text: CSSPropertyColor;
+        chip_warning_bg: CSSPropertyColor;
+        chip_warning_text: CSSPropertyColor;
+        chip_success_bg: CSSPropertyColor;
+        chip_success_text: CSSPropertyColor;
+    };
+}
+export {};

package/dist/foundation/index.d.ts

@@ -0,0 +1,111 @@
+import { Components, Theme } from "@mui/material";
+import { typographyDefaultProps } from "./Typography";
+export declare const foundationCssBaseline: Components<Theme>["MuiCssBaseline"];
+export declare const typography: import("@mui/material").TypographyVariantsOptions;
+export { typographyDefaultProps };
+export declare const palette: {
+    lunit: {
+        grey: import("./colors").GreyColor;
+        blue: import("./colors").BaseColor;
+        green: import("./colors").BaseColor;
+        lunitGreen: import("./colors").BaseColor;
+        lunitTeal: import("./colors").BaseColor;
+        magenta: import("./colors").BaseColor;
+        orange: import("./colors").BaseColor;
+        red: import("./colors").BaseColor;
+        yellow: import("./colors").BaseColor;
+    } | undefined;
+    token: {
+        core: {
+            bg_01: string;
+            bg_02: string;
+            bg_03: string;
+            text_primary: string;
+            text_normal: string;
+            text_medium: string;
+            text_light: string;
+            text_error: string;
+            text_success: string;
+            text_warning: string;
+            text_info: string;
+            link_primary: string;
+            link_hover: string;
+            link_visited: string;
+            icon_error_02: string;
+            icon_success_02: string;
+            icon_warning_02: string;
+            icon_info_02: string;
+            hover: string;
+            focused: string;
+            shadow_01: string;
+            shadow_02: string;
+            shadow_03: string;
+            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_selected_primary_bg: string;
+            btn_selected_primary_text: string;
+            btn_selected_secondary_bg: string;
+            btn_selected_secondary_text: string;
+            selectcontrol_on: string;
+            selectcontrol_off: string;
+            selectcontrol_handler: string;
+            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;
+            scrollbars_bg: string;
+            scrollbars_hover: string;
+            scrollbars_pressed: string;
+            modal_overlay: string;
+            tooltip_bg: string;
+            tooltip_text_normal: string;
+            tooltip_text_medium: string;
+            alert_error_bg: string;
+            alert_error_border: string;
+            alert_success_bg: string;
+            alert_success_border: string;
+            alert_info_bg: string;
+            alert_info_border: string;
+            alert_warning_bg: string;
+            alert_warning_border: string;
+            chip_primary_bg: string;
+            chip_primary_text: string;
+            chip_secondary_bg: string;
+            chip_secondary_text: string;
+            chip_error_bg: string;
+            chip_error_text: string;
+            chip_warning_bg: string;
+            chip_warning_text: string;
+            chip_success_bg: string;
+            chip_success_text: string;
+        };
+    };
+};
+export declare const elevation: {
+    elevation_00: string;
+    elevation_01: string;
+    elevation_02: string;
+    shadow1: string;
+    shadow2: string;
+    shadow3: string;
+    shadow4: string;
+};
+export { spacing } from "./spacing";

package/dist/foundation/spacing.d.ts

@@ -0,0 +1,2 @@
+import { SpacingOptions } from "@mui/system";
+export declare const spacing: SpacingOptions;

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+export { default as theme } from "./theme";
+export { default as Alert } from "./components/Alert";
+export { default as Button } from "./components/Button";
+export { default as Chip } from "./components/Chip";
+export { default as DataTable } from "./components/DataTable";
+export { default as DatePicker } from "./components/DatePicker";
+export { default as Dropdown } from "./components/Dropdown";
+export { default as FormLabel } from "./components/FormLabel";
+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 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";