@ctlyst.id/internal-ui 1.0.4-canary.9 → 1.1.0-canary.1

package/dist/components/switch/components/switch.d.ts

@@ -0,0 +1,18 @@
+import type { HTMLChakraProps, SystemProps, ThemingProps, UseCheckboxProps } from '@chakra-ui/react';
+export interface SwitchProps extends Omit<UseCheckboxProps, 'isIndeterminate'>, Omit<HTMLChakraProps<'label'>, keyof UseCheckboxProps>, ThemingProps<'Switch'> {
+    /**
+     * The spacing between the switch and its label text
+     * @default 0.5rem
+     * @type SystemProps["marginLeft"]
+     */
+    spacing?: SystemProps['marginLeft'];
+    size?: 'sm' | 'md' | 'lg';
+}
+/**
+ * The `Switch` component is used as an alternative for the checkbox component for switching between "enabled" and "disabled" states.
+ *
+ * @see Docs https://chakra-ui.com/docs/components/switch
+ * @see WAI-ARIA https://www.w3.org/WAI/ARIA/apg/patterns/switch/
+ */
+declare const Switch: import("@chakra-ui/system/dist/system.types").ComponentWithAs<"input", SwitchProps>;
+export default Switch;

package/dist/components/switch/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Switch } from './components/switch';
+export * from './components/switch';

package/dist/components/text/components/text.d.ts

@@ -0,0 +1,4 @@
+import type { TextProps as TextPropsChakra } from '@chakra-ui/react';
+import { Text } from '@chakra-ui/react';
+export declare type TextProps = TextPropsChakra;
+export default Text;

package/dist/components/text/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Text } from './components/text';
+export * from './components/text';

package/dist/config/{foundations.stories.d.ts → __stories__/foundations.stories.d.ts}

@@ -9,5 +9,6 @@ declare const _default: {
 export default _default;
 export declare const Color: () => JSX.Element;
 export declare const Typography: () => JSX.Element;
+export declare const Shadow: () => JSX.Element;
 export declare const Spacing: () => JSX.Element;
 export declare const Sizes: () => JSX.Element;

package/dist/config/theme/components/alert.d.ts

@@ -0,0 +1,79 @@
+import type { StyleFunctionProps } from '@chakra-ui/styled-system';
+declare const alertTheme: {
+    baseStyle?: {
+        container: {
+            bg: string;
+            px: string;
+            py: string;
+            borderRadius: string;
+        };
+        title: {
+            fontWeight: string;
+            lineHeight: string;
+            marginEnd: string;
+        };
+        description: {
+            lineHeight: string;
+        };
+        icon: {
+            color: string;
+            flexShrink: number;
+            marginEnd: string;
+            w: string;
+            h: string;
+        };
+        action: {
+            '& +.chakra-alert__close': {
+                ml: string;
+            };
+        };
+        close: {
+            color: string;
+            w: string;
+            h: string;
+        };
+        spinner: {
+            color: string;
+            flexShrink: number;
+            marginEnd: string;
+            w: string;
+            h: string;
+        };
+    } | undefined;
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+            keys: ("container" | "icon" | "title" | "description" | "spinner")[];
+        }>;
+    } | undefined;
+    variants?: {
+        subtle: (props: StyleFunctionProps) => {
+            container: {
+                [x: string]: string | {
+                    [x: string]: string;
+                };
+                _dark: {
+                    [x: string]: string;
+                };
+                color: string;
+            };
+        };
+        solid: (props: StyleFunctionProps) => {
+            container: {
+                [x: string]: string | {
+                    [x: string]: string;
+                };
+                _dark: {
+                    [x: string]: string;
+                };
+                color: string;
+            };
+        };
+    } | undefined;
+    defaultProps?: {
+        size?: string | number | undefined;
+        variant?: "subtle" | "solid" | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+    parts: ("container" | "icon" | "title" | "description" | "spinner")[];
+};
+export default alertTheme;

package/dist/config/theme/components/card.d.ts

@@ -0,0 +1,18 @@
+declare const CardStyle: {
+    baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
+        shadow: string;
+        borderRadius: string;
+    }) | undefined;
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+    } | undefined;
+    variants?: {
+        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+    } | undefined;
+    defaultProps?: {
+        size?: string | number | undefined;
+        variant?: string | number | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+};
+export default CardStyle;

package/dist/config/theme/components/checkbox.d.ts

@@ -1,3 +1,88 @@
-import type { ComponentStyleConfig } from '@chakra-ui/theme';
-declare const Checkbox: ComponentStyleConfig;
+declare const Checkbox: {
+    baseStyle?: {
+        control: {
+            borderRadius: string;
+            width: string;
+            height: string;
+            border: string;
+        };
+        icon: {
+            color: string;
+            width: string;
+        };
+        label: {
+            fontWeight: string;
+            lineHeight: string;
+            color: string;
+            ml: string;
+        };
+        _disabled: {
+            background: string;
+            border: string;
+            borderColor: string;
+            cursor: string;
+        };
+    } | undefined;
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+            keys: ("container" | "icon" | "label" | "control")[];
+        }>;
+    } | undefined;
+    variants?: {
+        errors: {
+            control: {
+                borderColor: string;
+                _checked: {
+                    borderColor: string;
+                    backgroundColor: string;
+                    _hover: {
+                        borderColor: string;
+                        backgroundColor: string;
+                    };
+                };
+                _indeterminate: {
+                    borderColor: string;
+                    backgroundColor: string;
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
+        unstyled: {
+            control: {
+                borderColor: string;
+                _checked: {
+                    borderColor: string;
+                    backgroundColor: string;
+                    _hover: {
+                        borderColor: string;
+                        backgroundColor: string;
+                    };
+                    _disabled: {
+                        backgroundColor: string;
+                        borderColor: string;
+                    };
+                };
+                _disabled: {
+                    backgroundColor: string;
+                    borderColor: string;
+                };
+                _indeterminate: {
+                    borderColor: string;
+                    backgroundColor: string;
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
+    } | undefined;
+    defaultProps?: {
+        size?: string | number | undefined;
+        variant?: "unstyled" | "errors" | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+    parts: ("container" | "icon" | "label" | "control")[];
+};
 export default Checkbox;

package/dist/config/theme/components/chips.d.ts

@@ -0,0 +1,30 @@
+declare const Chips: {
+    baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
+        color: string;
+        fontSize: string;
+        borderRadius: string;
+        borderWidth: string;
+        borderColor: string;
+        bg: string;
+        paddingX: number;
+        paddingY: number;
+        cursor: string;
+    }) | undefined;
+    sizes?: {
+        sm: {
+            fontSize: string;
+        };
+        md: {
+            fontSize: string;
+        };
+    } | undefined;
+    variants?: {
+        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+    } | undefined;
+    defaultProps?: {
+        size?: "sm" | "md" | undefined;
+        variant?: string | number | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+};
+export default Chips;

package/dist/config/theme/components/index.d.ts

@@ -1,8 +1,12 @@
+export { default as Alert } from './alert';
 export { default as Button } from './button';
+export { default as Card } from './card';
 export { default as Checkbox } from './checkbox';
+export { default as Chips } from './chips';
 export { default as FormLabel } from './form-label';
 export { default as Input } from './input';
+export { default as LoaderStyle } from './loader';
+export { default as Popover } from './popover';
 export { default as Radio } from './radio';
 export { default as Switch } from './switch';
-export { default as Popover } from './popover';
 export { default as Textarea } from './textarea';

package/dist/config/theme/components/input.d.ts

@@ -6,16 +6,18 @@ declare const Input: {
             outline: number;
             px: number;
             py: number;
+            paddingInlineStart: number;
+            paddingInlineEnd: number;
             position: string;
             appearance: string;
-            transitionProperty: string;
-            transitionDuration: string;
             color: string;
             _disabled: {
                 bg: string;
-                border: string;
-                borderColor: string;
+                border: number;
                 cursor: string;
+                opacity: number;
+                boxShadow: string;
+                color: string;
             };
             _placeholder: {
                 color: string;
@@ -63,33 +65,18 @@ declare const Input: {
     variants?: {
         outline: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
             field: {
-                border: string;
-                borderColor: string;
+                border: number;
+                outline: number;
                 bg: string;
                 color: string;
-                _hover: {
-                    borderColor: string;
-                };
-                _readOnly: {
-                    userSelect: string;
-                    borderColor: any;
-                    boxShadow: string;
-                };
                 _invalid: {
-                    borderColor: any;
                     boxShadow: string;
                 };
                 _focusVisible: {
                     zIndex: number;
-                    borderColor: any;
                     boxShadow: string;
                 };
             };
-            addon: {
-                border: string;
-                borderColor: string;
-                bg: string;
-            };
         };
         unstyled: {
             field: {

package/dist/config/theme/components/loader.d.ts

@@ -0,0 +1,85 @@
+declare const LoaderStyle: {
+    baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
+        borderRadius: string;
+        display: string;
+        justifyContent: string;
+        alignItems: string;
+        animation: string;
+        background: string;
+        ':before': {
+            content: string;
+            display: string;
+            borderRadius: string;
+            width: string;
+            height: string;
+            position: string;
+            bottom: number;
+            background: string;
+        };
+    }) | undefined;
+    sizes?: {
+        xs: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+        sm: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+        md: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+        lg: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+        xl: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+        xxl: {
+            width: string;
+            height: string;
+            WebkitMask: string;
+            ':before': {
+                width: string;
+                height: string;
+            };
+        };
+    } | undefined;
+    variants?: {
+        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+    } | undefined;
+    defaultProps?: {
+        size?: "sm" | "md" | "lg" | "xl" | "xs" | "xxl" | undefined;
+        variant?: string | number | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+};
+export default LoaderStyle;

package/dist/config/theme/components/radio.d.ts

@@ -1,3 +1,99 @@
-import type { ComponentStyleConfig } from '@chakra-ui/theme';
-declare const Radio: ComponentStyleConfig;
+declare const Radio: {
+    baseStyle?: {
+        control: {
+            border: string;
+            width: string;
+            height: string;
+        };
+        label: {
+            marginLeft: string;
+            textStyle: string;
+            color: string;
+            _disabled: {
+                color: string;
+            };
+        };
+    } | undefined;
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+            keys: ("container" | "label" | "control")[];
+        }>;
+    } | undefined;
+    variants?: {
+        errors: {
+            control: {
+                borderColor: string;
+                _checked: {
+                    borderColor: string;
+                    bg: string;
+                    _before: {
+                        h: string;
+                        w: string;
+                        bg: string;
+                    };
+                    _hover: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                    _disabled: {
+                        borderColor: string;
+                        bg: string;
+                        _before: {
+                            h: string;
+                            w: string;
+                            bg: string;
+                        };
+                    };
+                };
+                _disabled: {
+                    borderColor: string;
+                    bg: string;
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
+        unstyled: {
+            control: {
+                borderColor: string;
+                _checked: {
+                    borderColor: string;
+                    bg: string;
+                    _before: {
+                        h: string;
+                        w: string;
+                        bg: string;
+                    };
+                    _hover: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                    _disabled: {
+                        borderColor: string;
+                        bg: string;
+                        _before: {
+                            h: string;
+                            w: string;
+                            bg: string;
+                        };
+                    };
+                };
+                _disabled: {
+                    borderColor: string;
+                    bg: string;
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
+    } | undefined;
+    defaultProps?: {
+        size?: string | number | undefined;
+        variant?: "unstyled" | "errors" | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+    parts: ("container" | "label" | "control")[];
+};
 export default Radio;

package/dist/config/theme/components/switch.d.ts

@@ -1,21 +1,55 @@
 declare const Switch: {
-    baseStyle?: {
-        container: {};
-        thumb: {
-            bg: string;
+    baseStyle?: (() => {
+        container: {
+            [x: string]: string | {
+                [x: string]: string;
+            };
+            _rtl: {
+                [x: string]: string;
+            };
         };
         track: {
             bg: string;
             p: number;
             _checked: {
                 bg: string;
+                _disabled: {
+                    bg: string;
+                };
+            };
+            _disabled: {
+                bg: string;
+                opacity: string;
             };
         };
-    } | undefined;
+        thumb: {
+            bg: string;
+            transitionProperty: string;
+            transitionDuration: string;
+            borderRadius: string;
+            width: string[];
+            height: string[];
+            _checked: {
+                transform: string;
+            };
+        };
+    }) | undefined;
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
-            keys: ("container" | "track" | "thumb")[];
-        }>;
+        sm: {
+            container: {
+                [x: string]: string;
+            };
+        };
+        md: {
+            container: {
+                [x: string]: string;
+            };
+        };
+        lg: {
+            container: {
+                [x: string]: string;
+            };
+        };
     } | undefined;
     variants?: {
         [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
@@ -23,7 +57,7 @@ declare const Switch: {
         }>;
     } | undefined;
     defaultProps?: {
-        size?: string | number | undefined;
+        size?: "sm" | "md" | "lg" | undefined;
         variant?: string | number | undefined;
         colorScheme?: string | undefined;
     } | undefined;

package/dist/config/theme/components/textarea.d.ts

@@ -1,3 +1,55 @@
-import type { ComponentStyleConfig } from '@chakra-ui/theme';
-declare const Textarea: ComponentStyleConfig;
+export declare const Textarea: {
+    baseStyle?: import("@chakra-ui/styled-system").CSSWithMultiValues | (import("@chakra-ui/styled-system").CSSWithMultiValues & import("@chakra-ui/styled-system").RecursivePseudo<import("@chakra-ui/styled-system").CSSWithMultiValues>) | (import("@chakra-ui/styled-system").CSSWithMultiValues & import("@chakra-ui/styled-system").RecursiveCSSSelector<import("@chakra-ui/styled-system").CSSWithMultiValues>) | import("@chakra-ui/styled-system").SystemStyleFunction | undefined;
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+    } | undefined;
+    variants?: {
+        outline: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
+            background: string;
+            color: string;
+            borderColor: string;
+            fontSize: string;
+            padding: number;
+            borderRadius: string;
+            borderWidth: string;
+            outline: string;
+            _disabled: {
+                opacity: number;
+                color: string;
+                background: string;
+            };
+            _placeholder: {
+                color: string;
+            };
+            _hover: {
+                borderColor: string;
+            };
+            _focus: {
+                outline: string;
+                borderColor: string;
+                boxShadow: string;
+            };
+            _focusVisible: {
+                outline: string;
+                borderColor: string;
+                boxShadow: string;
+            };
+            _focusWithin: {
+                outline: string;
+                borderColor: string;
+                boxShadow: string;
+            };
+            _invalid: {
+                outline: string;
+                borderColor: string;
+                boxShadow: string;
+            };
+        };
+    } | undefined;
+    defaultProps?: {
+        size?: string | number | undefined;
+        variant?: "outline" | undefined;
+        colorScheme?: string | undefined;
+    } | undefined;
+};
 export default Textarea;

package/dist/config/theme/foundations/index.d.ts

@@ -1,5 +1,6 @@
 export { default as colors } from './colors';
 export { default as radii } from './radius';
-export { default as space } from './spacing';
+export { default as shadows } from './shadows';
 export { default as sizes } from './sizes';
-export { fonts, fontSizes, lineHeights, textStyles } from './typography';
+export { default as space } from './spacing';
+export { fonts, fontSizes, letterSpacings, lineHeights, textStyles } from './typography';

package/dist/config/theme/foundations/shadows.d.ts

@@ -0,0 +1,15 @@
+declare const shadows: {
+    raised: string;
+    xs: string;
+    sm: string;
+    base: string;
+    md: string;
+    lg: string;
+    xl: string;
+    "2xl": string;
+    outline: string;
+    inner: string;
+    none: string;
+    "dark-lg": string;
+};
+export default shadows;