teachable-design-system 0.1.0

package/dist/src/style/theme/colors.d.ts

@@ -0,0 +1,474 @@
+export declare const colors: {
+    background: {
+        white: string;
+        black: string;
+        'gray-subtler': string;
+        'gray-subtle': string;
+        inverse: string;
+    };
+    surface: {
+        white: string;
+        'white-subtler': string;
+        'white-subtle': string;
+        'white-static': string;
+        inverse: string;
+        'inverse-static': string;
+        'gray-subtler': string;
+        'gray-subtle': string;
+        disabled: string;
+        'primary-subtler': string;
+        'secondary-subtler': string;
+        'point-subtler': string;
+        'danger-subtler': string;
+        'warning-subtler': string;
+        'success-subtler': string;
+        'information-subtler': string;
+    };
+    border: {
+        transparency: string;
+        inverse: string;
+        disabled: string;
+        'gray-light': string;
+        gray: string;
+        'gray-dark': string;
+        'gray-darker': string;
+        'primary-light': string;
+        primary: string;
+        'secondary-light': string;
+        secondary: string;
+        'point-light': string;
+        point: string;
+        'danger-light': string;
+        danger: string;
+        'warning-light': string;
+        warning: string;
+        'success-light': string;
+        success: string;
+        'information-light': string;
+        information: string;
+    };
+    divider: {
+        'gray-light': string;
+        gray: string;
+        'gray-dark': string;
+        'gray-darker': string;
+        inverse: string;
+        'primary-light': string;
+        primary: string;
+        'secondary-light': string;
+        secondary: string;
+        error: string;
+        point: string;
+    };
+    text: {
+        bolder: string;
+        basic: string;
+        subtle: string;
+        disabled: string;
+        'disabled-on': string;
+        'border-inverse': string;
+        'basic-inverse': string;
+        'subtle-inverse': string;
+        static: string;
+        'inverse-static': string;
+        primary: string;
+        secondary: string;
+        point: string;
+        danger: string;
+        warning: string;
+        success: string;
+        information: string;
+    };
+    action: {
+        white: string;
+        primary: string;
+        'primary-hover': string;
+        'primary-pressed': string;
+        'primary-selected': string;
+        'primary-active': string;
+        secondary: string;
+        'secondary-hover': string;
+        'secondary-pressed': string;
+        'secondary-selected': string;
+        'secondary-on': string;
+        'secondary-on-hover': string;
+        'secondary-on-pressed': string;
+        'secondary-on-selected': string;
+        'secondary-active': string;
+        disabled: string;
+    };
+    element: {
+        inverse: string;
+        'inverse-static': string;
+        'gray-lighter': string;
+        'gray-light': string;
+        gray: string;
+        'gray-dark': string;
+        'disabled-light': string;
+        'disabled-dark': string;
+        'primary-light': string;
+        'primary-lighter': string;
+        primary: string;
+        'secondary-light': string;
+        'secondary-lighter': string;
+        secondary: string;
+        'point-light': string;
+        'point-lighter': string;
+        point: string;
+        danger: string;
+        'danger-lighter': string;
+        warning: string;
+        'warning-lighter': string;
+        success: string;
+        'success-lighter': string;
+        information: string;
+        'information-lighter': string;
+        'logo-text': string;
+    };
+    icon: {
+        gray: string;
+        'gary-light': string;
+        'gray-fill': string;
+        inverse: string;
+        disabled: string;
+        'disabled-on': string;
+        primary: string;
+        secondary: string;
+        point: string;
+        danger: string;
+        warning: string;
+        success: string;
+        information: string;
+        'inverse-static': string;
+        'primary-static': string;
+        'secondary-static': string;
+        'point-static': string;
+        'danger-static': string;
+        'warning-static': string;
+        'success-static': string;
+        'information-static': string;
+    };
+    link: {
+        default: string;
+        hover: string;
+        pressed: string;
+        visited: string;
+    };
+    button: {
+        'primary-fill': string;
+        'primary-fill-hover': string;
+        'primary-fill-pressed': string;
+        'secondary-fill': string;
+        'secondary-fill-hover': string;
+        'secondary-fill-pressed': string;
+        'secondary-border': string;
+        'tertiary-fill': string;
+        'tertiary-fill-hover': string;
+        'tertiary-fill-pressed': string;
+        'tertiary-border': string;
+        'text-fill': string;
+        'text-fill-hover': string;
+        'text-fill-pressed': string;
+        'text-border': string;
+        'disabled-fill': string;
+        'disabled-border': string;
+    };
+    input: {
+        surface: string;
+        border: string;
+        'border-active': string;
+        'border-error': string;
+        'surface-disabled': string;
+        'border-disabled': string;
+    };
+    graphic: {
+        'blue-subtler': string;
+        'blue-subtle': string;
+        blue: string;
+        'blue-dark': string;
+        'blue-darker': string;
+        'red-subtler': string;
+        'red-subtle': string;
+        red: string;
+        'red-dark': string;
+        'red-darker': string;
+        brand: string;
+    };
+    alpha: {
+        base100: string;
+        base75: string;
+        base50: string;
+        base25: string;
+        base10: string;
+        base0: string;
+        inverse100: string;
+        inverse75: string;
+        inverse50: string;
+        inverse25: string;
+        inverse10: string;
+        inverse0: string;
+        shadow0: string;
+        shadow1: string;
+        shadow2: string;
+        shadow3: string;
+    };
+    light: {
+        gray: {
+            '100': string;
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+            '0': string;
+        };
+        primary: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        secondary: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        point: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        danger: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        warning: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        success: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        information: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        alpha: {
+            black100: string;
+            black75: string;
+            black50: string;
+            black25: string;
+            black10: string;
+            black0: string;
+            white100: string;
+            white75: string;
+            white50: string;
+            white25: string;
+            white10: string;
+            white0: string;
+        };
+        graphic: {
+            '90': string;
+            '70': string;
+            '50': string;
+            '30': string;
+            '10': string;
+        };
+    };
+    highContrast: {
+        gray: {
+            '100': string;
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+            '0': string;
+        };
+        primary: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        secondary: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        point: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        danger: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        warning: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        success: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        information: {
+            '95': string;
+            '90': string;
+            '80': string;
+            '70': string;
+            '60': string;
+            '50': string;
+            '40': string;
+            '30': string;
+            '20': string;
+            '10': string;
+            '5': string;
+        };
+        alpha: {
+            black100: string;
+            black75: string;
+            black50: string;
+            black25: string;
+            black10: string;
+            black0: string;
+            white100: string;
+            white75: string;
+            white50: string;
+            white25: string;
+            white10: string;
+            white0: string;
+        };
+        graphic: {
+            '90': string;
+            '70': string;
+            '50': string;
+            '30': string;
+            '10': string;
+        };
+    };
+};
+//# sourceMappingURL=colors.d.ts.map

package/dist/src/style/theme/colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../../../src/style/theme/colors.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuflB,CAAC"}

package/dist/src/style/theme/index.d.ts

@@ -0,0 +1,3 @@
+export { colors } from './colors';
+export { typography } from './typography';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/style/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/style/theme/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}

package/dist/src/style/theme/typography.d.ts

@@ -0,0 +1,181 @@
+export declare const typography: {
+    fontFamily: {
+        primary: string;
+    };
+    display: {
+        large: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        medium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        small: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+    };
+    heading: {
+        xlarge: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        large: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        medium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        small: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        xsmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        xxsmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+    };
+    body: {
+        large: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        largeBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        medium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        mediumBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        small: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        smallBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        xsmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        xsmallBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+    };
+    label: {
+        large: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        medium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        small: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        xsmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+    };
+    navigation: {
+        titleMedium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        titleSmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        depthMediumBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        depthMedium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        depthSmallBold: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+        depthSmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+        };
+    };
+    underline: {
+        large: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+            textDecoration: string;
+        };
+        medium: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+            textDecoration: string;
+        };
+        small: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+            textDecoration: string;
+        };
+        xsmall: {
+            fontSize: string;
+            lineHeight: string;
+            fontWeight: number;
+            textDecoration: string;
+        };
+    };
+    fontWeight: {
+        regular: number;
+        bold: number;
+    };
+};
+//# sourceMappingURL=typography.d.ts.map

package/dist/src/style/theme/typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../../src/style/theme/typography.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiMtB,CAAC"}

package/dist/src/type/Dropdown.types.d.ts

@@ -0,0 +1,8 @@
+export interface DropdownProps {
+    size?: "small" | "medium" | "large";
+    onSelect?: (option: string) => void;
+    options: string[];
+    label?: string;
+    placeholder?: string;
+}
+//# sourceMappingURL=Dropdown.types.d.ts.map

package/dist/src/type/Dropdown.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.types.d.ts","sourceRoot":"","sources":["../../../src/type/Dropdown.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,aAAa;IAC7B,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB"}

package/dist/src/type/Sidebar.types.d.ts

@@ -0,0 +1,6 @@
+export interface SidebarProps {
+    buttonStyle?: 'one' | 'two';
+    title: string[];
+    description: string[][];
+}
+//# sourceMappingURL=Sidebar.types.d.ts.map

package/dist/src/type/Sidebar.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar.types.d.ts","sourceRoot":"","sources":["../../../src/type/Sidebar.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,YAAY;IAC5B,WAAW,CAAC,EAAE,KAAK,GAAG,KAAK,CAAE;IAC7B,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,WAAW,EAAE,MAAM,EAAE,EAAG,CAAA;CACxB"}

package/dist/src/types/button.types.d.ts

@@ -0,0 +1,12 @@
+export interface ButtonProps {
+    width?: string;
+    height?: string;
+    type?: 'primary' | 'secondary' | 'tertiary';
+    size?: 'small' | 'medium' | 'large';
+    label: string;
+    onClick?: () => void;
+    disabled?: boolean;
+}
+export type ButtonType = 'primary' | 'secondary' | 'tertiary';
+export type ButtonSize = 'small' | 'medium' | 'large';
+//# sourceMappingURL=button.types.d.ts.map