@cruk/chakra-components 1.0.1 → 1.0.3

package/dist/types/src/theme/cruk/components/radio.d.ts

@@ -1,34 +1,166 @@
 declare const radioTheme: {
     baseStyle?: {
         control: {
+            width: string;
+            height: string;
+            borderWidth: string;
+            borderRadius: string;
             borderColor: string;
+            bg: string;
+            _hover: {
+                background: string;
+                borderColor: string;
+                borderWidth: string;
+                _checked: {
+                    borderColor: string;
+                    bg: string;
+                };
+            };
             _checked: {
                 borderColor: string;
+                borderWidth: string;
+                padding: string;
                 bg: string;
-                color: string;
-                _hover: {
-                    borderColor: string;
+                _before: {
                     bg: string;
                 };
+                _hover: {
+                    padding: string;
+                };
             };
             _disabled: {
-                bg: string;
                 borderColor: string;
-            };
-            _hover: {
+                borderWidth: string;
                 bg: string;
+                _hover: {
+                    borderColor: string;
+                    bg: string;
+                };
+            };
+            _invalid: {
+                borderColor: string;
+                _checked: {
+                    _before: {
+                        bg: string;
+                    };
+                };
             };
         };
         label: {
-            bg: string;
             color: string;
+            fontWeight: string;
+            fontSize: string;
+            _disabled: {
+                color: string;
+            };
+            _invalid: {
+                color: string;
+            };
         };
-        container: {};
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
-            keys: ("container" | "label" | "control")[];
-        }>;
+        small: {
+            control: {
+                width: string;
+                height: string;
+                borderWidth: string;
+                borderRadius: string;
+                borderColor: string;
+                bg: string;
+                _hover: {
+                    background: string;
+                    borderColor: string;
+                    borderWidth: string;
+                    _checked: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                };
+                _checked: {
+                    borderColor: string;
+                    borderWidth: string;
+                    padding: string;
+                    bg: string;
+                    _before: {
+                        bg: string;
+                    };
+                    _hover: {
+                        padding: string;
+                    };
+                };
+                _disabled: {
+                    borderColor: string;
+                    borderWidth: string;
+                    bg: string;
+                    _hover: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                };
+                _invalid: {
+                    borderColor: string;
+                    _checked: {
+                        _before: {
+                            bg: string;
+                        };
+                    };
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
+        large: {
+            control: {
+                width: string;
+                height: string;
+                borderWidth: string;
+                borderRadius: string;
+                borderColor: string;
+                bg: string;
+                _hover: {
+                    background: string;
+                    borderColor: string;
+                    borderWidth: string;
+                    _checked: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                };
+                _checked: {
+                    borderColor: string;
+                    borderWidth: string;
+                    padding: string;
+                    bg: string;
+                    _before: {
+                        bg: string;
+                    };
+                    _hover: {
+                        padding: string;
+                    };
+                };
+                _disabled: {
+                    borderColor: string;
+                    borderWidth: string;
+                    bg: string;
+                    _hover: {
+                        borderColor: string;
+                        bg: string;
+                    };
+                };
+                _invalid: {
+                    borderColor: string;
+                    _checked: {
+                        _before: {
+                            bg: string;
+                        };
+                    };
+                };
+            };
+            label: {
+                fontSize: string;
+            };
+        };
     };
     variants?: {
         outline: {
@@ -38,11 +170,18 @@ declare const radioTheme: {
                 border: string;
                 borderColor: string;
                 padding: string;
+                _hover: {
+                    borderColor: string;
+                    backgroundColor: string;
+                };
+                _invalid: {
+                    borderColor: string;
+                };
             };
         };
     };
     defaultProps?: {
-        size?: string | number;
+        size?: "small" | "large";
         variant?: "outline";
         colorScheme?: string;
     };

package/dist/types/src/theme/cruk/components/radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/radio.ts"],"names":[],"mappings":"AA4CA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGd,CAAC;AAEH,eAAe,UAAU,CAAC"}
+{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/radio.ts"],"names":[],"mappings":"AAoHA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAId,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/dist/types/src/theme/cruk/components/select.d.ts

@@ -1,9 +1,9 @@
 declare const selectTheme: {
-    baseStyle?: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+    baseStyle?: import("@chakra-ui/react").PartsStyleInterpolation<{
         keys: ("icon" | "field")[];
     }>;
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
             keys: ("icon" | "field")[];
         }>;
     };
@@ -12,7 +12,6 @@ declare const selectTheme: {
             field: {
                 bg: string;
                 border: string;
-                borderColor: string;
                 fontFamily: string;
                 fontSize: {
                     base: "text.sm";
@@ -20,34 +19,49 @@ declare const selectTheme: {
                 };
                 height: {
                     base: "50px";
-                    lg: "53px";
+                    lg: "52px";
                 };
-                borderRadius: string;
+                padding: string;
                 color: string;
+                borderRadius: string;
+                _active: {
+                    borderColor: string;
+                    border: string;
+                };
                 _disabled: {
                     bg: string;
                     borderColor: string;
-                    _hover: {
-                        borderColor: string;
-                    };
+                    border: string;
+                    padding: string;
                     opacity: number;
+                    color: string;
                 };
                 _focus: {
                     borderColor: string;
+                    border: string;
                 };
                 _hover: {
-                    borderColor: string;
+                    "&:not(:active):not(:focus):not(:disabled)": {
+                        border: string;
+                        padding: string;
+                    };
                 };
                 _invalid: {
+                    border: string;
                     borderColor: string;
+                    padding: string;
+                    _hover: {
+                        borderColor: string;
+                    };
+                    _focus: {
+                        borderColor: string;
+                    };
                 };
             };
             icon: {
-                color: string;
+                fontSize: string;
                 _disabled: {
                     opacity: number;
-                };
-                _focus: {
                     color: string;
                 };
             };

package/dist/types/src/theme/cruk/components/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/select.ts"],"names":[],"mappings":"AA8CA,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGf,CAAC;AAEH,eAAe,WAAW,CAAC"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/select.ts"],"names":[],"mappings":"AA4DA,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGf,CAAC;AACH,eAAe,WAAW,CAAC"}

package/dist/types/src/theme/cruk/components/simpleHeader.d.ts

@@ -27,10 +27,10 @@ export declare const simpleHeaderTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;

package/dist/types/src/theme/cruk/components/stepper.d.ts

@@ -1,14 +1,119 @@
 export declare const stepperTheme: {
-    baseStyle?: {};
+    baseStyle?: {
+        stepper: {
+            "&[data-orientation=horizontal]": {
+                gap: number;
+                alignItems: string;
+                maxWidth: string;
+                pb: string;
+            };
+            ".step-container": {
+                "&:last-of-type": {
+                    flex: string;
+                };
+            };
+        };
+        description: {
+            display: {
+                base: "none";
+                xl: "block";
+                lg: "block";
+                md: "none";
+                sm: "none";
+            };
+            marginTop: string;
+            maxWidth: string;
+            color: string;
+            fontFamily: string;
+            fontSize: string;
+            fontStyle: string;
+            fontWeight: number;
+            lineHeight: string;
+            letterSpacing: string;
+            "&[data-orientation=horizontal]": {
+                marginLeft: string;
+            };
+            "&[data-orientation=vertical]": {
+                marginLeft: string;
+            };
+        };
+        step: {
+            gap: number;
+        };
+        separator: {
+            height: string;
+            bgColor: string;
+            "&[data-orientation=vertical]": {
+                visibility: string;
+            };
+            "&[data-status=complete]": {
+                bgColor: string;
+            };
+            "&[data-orientation=horizontal]": {
+                marginLeft: number;
+            };
+        };
+        indicator: {
+            width: {
+                base: "24px";
+                lg: "32px";
+                xl: "32px";
+            };
+            height: {
+                base: "24px";
+                lg: "32px";
+                xl: "32px";
+            };
+            zIndex: string;
+            fontSize: {
+                base: "24px";
+                lg: "32px";
+                xl: "32px";
+            };
+            "&[data-status=complete]": {
+                bgColor: string;
+                borderColor: string;
+                borderWidth: string;
+            };
+            "&[data-status=active]": {
+                bgColor: string;
+                borderColor: string;
+                outline: string;
+                outlineOffset: string;
+                fontSize: {
+                    base: "32px";
+                    lg: "40px";
+                    xl: "40px";
+                };
+                width: {
+                    base: "32px";
+                    lg: "40px";
+                    xl: "40px";
+                };
+                height: {
+                    base: "32px";
+                    lg: "40px";
+                    xl: "40px";
+                };
+                marginBottom: string;
+                transform: string;
+            };
+            "&[data-status=incomplete]": {
+                bgColor: string;
+                borderColor: string;
+                borderWidth: string;
+            };
+        };
+    };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        basic: {};
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;
-        variant?: "basic";
+        variant?: string | number;
         colorScheme?: string;
     };
 };

package/dist/types/src/theme/cruk/components/stepper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/stepper.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;;;;;;;;;;;;;CASvB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/stepper.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsFvB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/dist/types/src/theme/cruk/components/table.d.ts

@@ -36,10 +36,10 @@ export declare const tableTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;

package/dist/types/src/theme/cruk/components/tabs.d.ts

@@ -5,7 +5,7 @@ declare const tabsTheme: {
         tabpanel: {};
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
             keys: ("root" | "tab" | "tablist" | "tabpanel" | "tabpanels" | "indicator")[];
         }>;
     };

package/dist/types/src/theme/cruk/components/tag.d.ts

@@ -14,7 +14,7 @@ declare const tagTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
             keys: ("container" | "label" | "closeButton")[];
         }>;
     };

package/dist/types/src/theme/cruk/components/text.d.ts

@@ -32,10 +32,17 @@ export declare const textTheme: {
             fontFamily: string;
             color: string;
         };
+        formHelperText: {
+            fontFamily: string;
+            fontSize: string;
+            color: string;
+            mt: number;
+            mb: number;
+        };
     };
     defaultProps?: {
-        size?: "md" | "sm" | "xs";
-        variant?: "normal" | "italic" | "caption" | "label";
+        size?: "sm" | "md" | "xs";
+        variant?: "normal" | "italic" | "caption" | "label" | "formHelperText";
         colorScheme?: string;
     };
 };

package/dist/types/src/theme/cruk/components/text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/text.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCpB,CAAC;AAEH,eAAe,SAAS,CAAC"}
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/cruk/components/text.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CpB,CAAC;AAEH,eAAe,SAAS,CAAC"}

package/dist/types/src/theme/cruk/components/textTruncate.d.ts

@@ -6,10 +6,10 @@ export declare const textTruncateTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;

package/dist/types/src/theme/cruk/components/twoBlocksStatistics.d.ts

@@ -1,7 +1,7 @@
 declare const TwoBlocksStatisticsTheme: {
     baseStyle?: {};
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
         statisticsBlocksContainer: {

package/dist/types/src/theme/cruk/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/theme/cruk/index.ts"],"names":[],"mappings":"AA0CA,QAAA,MAAM,SAAS,qBA4Cb,CAAC;AAEH,KAAK,KAAK,GAAG,OAAO,SAAS,CAAC;AAE9B,OAAO,EAAE,KAAK,KAAK,EAAE,CAAC;AACtB,eAAe,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/theme/cruk/index.ts"],"names":[],"mappings":"AA8CA,QAAA,MAAM,SAAS,qBAgDb,CAAC;AAEH,KAAK,KAAK,GAAG,OAAO,SAAS,CAAC;AAE9B,OAAO,EAAE,KAAK,KAAK,EAAE,CAAC;AACtB,eAAe,SAAS,CAAC"}

package/dist/types/src/theme/r4l/components/alertBanner.d.ts

@@ -0,0 +1,56 @@
+declare const alertBannerTheme: {
+    baseStyle?: {
+        borderWidth: string;
+        minHeight: string;
+        padding: {
+            base: "24px";
+            sm: "24px 40px";
+            md: "40px 64px";
+        };
+        gap: {
+            base: string;
+            md: string;
+        };
+        display: string;
+        alignItems: string;
+        "#heading": {
+            fontFamily: string;
+        };
+    };
+    sizes?: {
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
+    };
+    variants?: {
+        warning: {
+            borderColor: string;
+            path: {
+                fill: string;
+            };
+        };
+        error: {
+            borderColor: string;
+            path: {
+                fill: string;
+            };
+        };
+        success: {
+            borderColor: string;
+            path: {
+                fill: string;
+            };
+        };
+        information: {
+            borderColor: string;
+            path: {
+                fill: string;
+            };
+        };
+    };
+    defaultProps?: {
+        size?: string | number;
+        variant?: "warning" | "error" | "information" | "success";
+        colorScheme?: string;
+    };
+};
+export default alertBannerTheme;
+//# sourceMappingURL=alertBanner.d.ts.map

package/dist/types/src/theme/r4l/components/alertBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"alertBanner.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/r4l/components/alertBanner.ts"],"names":[],"mappings":"AAYA,QAAA,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkBpB,CAAC;AACH,eAAe,gBAAgB,CAAC"}

package/dist/types/src/theme/r4l/components/breadcrumb.d.ts

@@ -82,7 +82,7 @@ declare const breadcrumbTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
             keys: ("container" | "link" | "item" | "separator")[];
         }>;
     };

package/dist/types/src/theme/r4l/components/button.d.ts

@@ -310,7 +310,7 @@ export declare const buttonTheme: {
         };
     };
     defaultProps?: {
-        size?: "md" | "sm";
+        size?: "sm" | "md";
         variant?: "link" | "primary" | "primaryAlt" | "secondary" | "secondaryAlt" | "alternative" | "linkNoDecoration" | "truncationControl" | "toggle" | "toggleSelected" | "toggleDisabled" | "video" | "citation" | "backToTop";
         colorScheme?: string;
     };

package/dist/types/src/theme/r4l/components/card.d.ts

@@ -1,9 +1,9 @@
 declare const cardTheme: {
-    baseStyle?: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+    baseStyle?: import("@chakra-ui/react").PartsStyleInterpolation<{
         keys: ("container" | "header" | "body" | "footer")[];
     }>;
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+        [key: string]: import("@chakra-ui/react").PartsStyleInterpolation<{
             keys: ("container" | "header" | "body" | "footer")[];
         }>;
     };

package/dist/types/src/theme/r4l/components/caseStudy.d.ts

@@ -50,10 +50,10 @@ export declare const caseStudyTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;

package/dist/types/src/theme/r4l/components/container.d.ts

@@ -9,10 +9,10 @@ declare const containerTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;

package/dist/types/src/theme/r4l/components/divider.d.ts

@@ -6,7 +6,7 @@ export declare const dividerTheme: {
         borderWidth: string;
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
         default: {

package/dist/types/src/theme/r4l/components/footer.d.ts

@@ -61,10 +61,10 @@ export declare const footerTheme: {
         };
     };
     sizes?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     variants?: {
-        [key: string]: import("@chakra-ui/styled-system").SystemStyleInterpolation;
+        [key: string]: import("@chakra-ui/react").SystemStyleInterpolation;
     };
     defaultProps?: {
         size?: string | number;