@veracity/vui 2.5.0-beta.1 → 2.5.0

package/dist/cjs/theme/components.d.ts

@@ -1335,6 +1335,7 @@ declare const _default: {
         baseStyle: {};
         defaultProps: {
             size: string;
+            variant: string;
         };
         sizes: {
             sm: {
@@ -1374,12 +1375,28 @@ declare const _default: {
                 };
             };
         };
-        variants: {};
+        variants: {
+            primary: {
+                bg: string;
+                color: string;
+            };
+            green: {
+                bg: string;
+                color: string;
+            };
+            red: {
+                bg: string;
+                color: string;
+            };
+        };
     };
     ProgressCircular: {
-        baseStyle: {};
+        baseStyle: {
+            color: string;
+        };
         defaultProps: {
             size: string;
+            variant: string;
         };
         sizes: {
             sm: {
@@ -1407,7 +1424,26 @@ declare const _default: {
                 fontSize: number;
             };
         };
-        variants: {};
+        variants: {
+            primary: {
+                stroke: {
+                    main: string;
+                    progress: string;
+                };
+            };
+            green: {
+                stroke: {
+                    main: string;
+                    progress: string;
+                };
+            };
+            red: {
+                stroke: {
+                    main: string;
+                    progress: string;
+                };
+            };
+        };
     };
     Popover: {
         baseStyle: {};
@@ -1607,9 +1643,17 @@ declare const _default: {
         };
     };
     Switch: {
-        baseStyle: {};
+        baseStyle: {
+            button: {
+                thumb: {
+                    bg: string;
+                };
+                track: {
+                    ring: number;
+                };
+            };
+        };
         defaultProps: {
-            colorScheme: string;
             size: string;
             variant: string;
         };
@@ -1665,14 +1709,24 @@ declare const _default: {
             };
         };
         variants: {
-            contained: (props: import("..").Dict<any>) => {
+            primary: {
                 button: {
-                    thumb: {
+                    track: {
+                        bg: string;
+                    };
+                };
+            };
+            green: {
+                button: {
+                    track: {
                         bg: string;
                     };
+                };
+            };
+            red: {
+                button: {
                     track: {
                         bg: string;
-                        ring: number;
                     };
                 };
             };
@@ -2030,20 +2084,39 @@ declare const _default: {
         };
     };
     Textarea: {
-        baseStyle: {};
+        baseStyle: {
+            textarea: {
+                focusWithinRing: number;
+                color: string;
+            };
+            input: {
+                color: {
+                    placeholder: string;
+                };
+            };
+        };
         defaultProps: {
-            colorScheme: string;
             variant: string;
         };
         parts: string[];
         sizes: {};
         variants: {
-            default: (props: import("..").Dict<any>) => {
-                container: {};
+            grey: {
+                textarea: {
+                    borderColor: string;
+                    focusWithinRingColor: string;
+                };
+            };
+            green: {
+                textarea: {
+                    borderColor: string;
+                    focusWithinRingColor: string;
+                };
+            };
+            red: {
                 textarea: {
                     borderColor: string;
-                    focusRing: number;
-                    focusRingColor: string;
+                    focusWithinRingColor: string;
                 };
             };
         };

package/dist/cjs/theme/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,wBA6CC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/theme/components.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,wBA6CC"}

package/dist/cjs/theme/defaultTheme.d.ts

@@ -1838,6 +1838,7 @@ declare const defaultTheme: {
             baseStyle: {};
             defaultProps: {
                 size: string;
+                variant: string;
             };
             sizes: {
                 sm: {
@@ -1877,12 +1878,28 @@ declare const defaultTheme: {
                     };
                 };
             };
-            variants: {};
+            variants: {
+                primary: {
+                    bg: string;
+                    color: string;
+                };
+                green: {
+                    bg: string;
+                    color: string;
+                };
+                red: {
+                    bg: string;
+                    color: string;
+                };
+            };
         };
         ProgressCircular: {
-            baseStyle: {};
+            baseStyle: {
+                color: string;
+            };
             defaultProps: {
                 size: string;
+                variant: string;
             };
             sizes: {
                 sm: {
@@ -1910,7 +1927,26 @@ declare const defaultTheme: {
                     fontSize: number;
                 };
             };
-            variants: {};
+            variants: {
+                primary: {
+                    stroke: {
+                        main: string;
+                        progress: string;
+                    };
+                };
+                green: {
+                    stroke: {
+                        main: string;
+                        progress: string;
+                    };
+                };
+                red: {
+                    stroke: {
+                        main: string;
+                        progress: string;
+                    };
+                };
+            };
         };
         Popover: {
             baseStyle: {};
@@ -2110,9 +2146,17 @@ declare const defaultTheme: {
             };
         };
         Switch: {
-            baseStyle: {};
+            baseStyle: {
+                button: {
+                    thumb: {
+                        bg: string;
+                    };
+                    track: {
+                        ring: number;
+                    };
+                };
+            };
             defaultProps: {
-                colorScheme: string;
                 size: string;
                 variant: string;
             };
@@ -2168,14 +2212,24 @@ declare const defaultTheme: {
                 };
             };
             variants: {
-                contained: (props: import("..").Dict<any>) => {
+                primary: {
                     button: {
-                        thumb: {
+                        track: {
+                            bg: string;
+                        };
+                    };
+                };
+                green: {
+                    button: {
+                        track: {
                             bg: string;
                         };
+                    };
+                };
+                red: {
+                    button: {
                         track: {
                             bg: string;
-                            ring: number;
                         };
                     };
                 };
@@ -2533,20 +2587,39 @@ declare const defaultTheme: {
             };
         };
         Textarea: {
-            baseStyle: {};
+            baseStyle: {
+                textarea: {
+                    focusWithinRing: number;
+                    color: string;
+                };
+                input: {
+                    color: {
+                        placeholder: string;
+                    };
+                };
+            };
             defaultProps: {
-                colorScheme: string;
                 variant: string;
             };
             parts: string[];
             sizes: {};
             variants: {
-                default: (props: import("..").Dict<any>) => {
-                    container: {};
+                grey: {
+                    textarea: {
+                        borderColor: string;
+                        focusWithinRingColor: string;
+                    };
+                };
+                green: {
+                    textarea: {
+                        borderColor: string;
+                        focusWithinRingColor: string;
+                    };
+                };
+                red: {
                     textarea: {
                         borderColor: string;
-                        focusRing: number;
-                        focusRingColor: string;
+                        focusWithinRingColor: string;
                     };
                 };
             };

package/dist/cjs/theme/defaultTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}

package/dist/cjs/tutorial/consts.d.ts

@@ -0,0 +1,6 @@
+export declare const tutorialColors: {
+    bg: string;
+    buttonColor: string;
+    color: string;
+};
+//# sourceMappingURL=consts.d.ts.map

package/dist/cjs/tutorial/consts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/tutorial/consts.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;CAI1B,CAAA"}

package/dist/cjs/tutorial/consts.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tutorialColors = void 0;
+exports.tutorialColors = {
+    bg: 'darkBlue.main',
+    buttonColor: 'digiGreen.main',
+    color: 'white'
+};

package/dist/cjs/tutorial/tutorial.d.ts

@@ -1,4 +1,4 @@
 import { TutorialProps } from './tutorial.types';
 /** [Beta] Popover Tutorial is used to display information about a new, or existing feature. */
-export declare function Tutorial({ children, className, description, onDismiss, onFinish, readMoreLink, steps, title, id, placement }: TutorialProps): JSX.Element;
+export declare function Tutorial({ actionLabel, children, className, onAction, onDismiss, onFinish, steps, title, id, placement, showSkipButton }: TutorialProps): JSX.Element;
 //# sourceMappingURL=tutorial.d.ts.map

package/dist/cjs/tutorial/tutorial.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tutorial.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorial.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAc,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAI5D,+FAA+F;AAC/F,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,WAAW,EACX,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,KAAK,EACL,EAAE,EACF,SAAmB,EACpB,EAAE,aAAa,eAuCf"}
+{"version":3,"file":"tutorial.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorial.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAc,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAI5D,+FAA+F;AAC/F,wBAAgB,QAAQ,CAAC,EACvB,WAAW,EACX,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,KAAK,EACL,KAAK,EACL,EAAE,EACF,SAAmB,EACnB,cAAc,EACf,EAAE,aAAa,eAwCf"}

package/dist/cjs/tutorial/tutorial.js

@@ -10,7 +10,7 @@ const utils_1 = require("../utils");
 const tutorialCard_1 = require("./tutorialCard");
 const useTutorial_1 = require("./useTutorial");
 /** [Beta] Popover Tutorial is used to display information about a new, or existing feature. */
-function Tutorial({ children, className, description, onDismiss, onFinish, readMoreLink, steps, title, id, placement = 'right' }) {
+function Tutorial({ actionLabel, children, className, onAction, onDismiss, onFinish, steps, title, id, placement = 'right', showSkipButton }) {
     const { isVisible, setIsVisible, saveDisplayed } = (0, useTutorial_1.useTutorial)(id);
     const onClose = (e) => {
         setIsVisible(false);
@@ -20,7 +20,7 @@ function Tutorial({ children, className, description, onDismiss, onFinish, readM
             onFinish === null || onFinish === void 0 ? void 0 : onFinish();
         saveDisplayed(e);
     };
-    return (react_2.default.createElement(react_1.default, { content: react_2.default.createElement(tutorialCard_1.TutorialCard, { className: (0, utils_1.cs)('vui-tutorial', className), description: description, onDismiss: () => onClose('dismissed'), onFinish: () => onClose('finished'), readMoreLink: readMoreLink, steps: steps, title: title }), interactive: true, offset: [0, 2], placement: placement, popperOptions: {
+    return (react_2.default.createElement(react_1.default, { content: react_2.default.createElement(tutorialCard_1.TutorialCard, { actionLabel: actionLabel, className: (0, utils_1.cs)('vui-tutorial', className), onAction: onAction, onDismiss: () => onClose('dismissed'), onFinish: () => onClose('finished'), showSkipButton: showSkipButton, steps: steps, title: title }), interactive: true, offset: [0, 2], placement: placement, popperOptions: {
             modifiers: [
                 {
                     name: 'flip',

package/dist/cjs/tutorial/tutorial.types.d.ts

@@ -3,56 +3,64 @@ import { Placement } from 'tippy.js';
 export declare type TutorialDataStep = {
     /** title of step */
     title: string;
-    /** description of step */
-    description: string;
-    /** Read more link */
+    /** Content */
+    content?: string;
+    /** Link to page where they can read more */
     readMoreLink?: string;
 };
 export declare type TutorialProps = {
+    /** Label for the action button @default `Action` */
+    actionLabel?: string;
     /** Target element for the tutorial */
     children: React.ReactNode;
     /** Custom class name */
     className?: string;
     /** An id for further handling with localStorage */
     id: string;
-    /** A general tutorial description */
-    description?: string;
+    /** Invoked once the action button clicked. */
+    onAction?: () => void;
     /** Invoked once the dismiss button clicked. */
     onDismiss?: () => void;
     /** Invoked once the finish button clicked. */
     onFinish?: () => void;
     /** Popover placement */
     placement?: Placement;
-    /** Link to page where user can read more */
-    readMoreLink?: string;
     /** An array of steps */
     steps: TutorialDataStep[];
-    /** A general tutorial title */
+    /** Show the Skip button */
+    showSkipButton?: boolean;
+    /** General tutorial title */
     title: string;
+    /** Link to page where they can read more */
+    readMoreLink?: string;
 };
 export declare type TutorialCardProps = {
+    /** Label for the action button @default `Action` */
+    actionLabel?: string;
     /** Custom class name */
     className?: string;
     /** The card title */
     title: string;
     /** Steps of the card */
     steps: TutorialDataStep[];
+    /** Invoked once the action button clicked. */
+    onAction?: () => void;
     /** Callback for the dismiss button click. */
     onDismiss?: () => void;
     /** Callback for the finish button click. */
     onFinish?: () => void;
-    /** Description of feature */
-    description?: string;
     /** Link to page where they can read more */
     readMoreLink?: string;
+    /** Show the Skip button */
+    showSkipButton?: boolean;
 };
 export declare type TutorialStepProps = {
     /** If the step is active or not */
     active: boolean;
     /** Title of step */
     title: string;
-    /** Description of step */
-    description: string;
+    /** Step content */
+    content?: string;
     /** Link to page where user can read more */
     readMoreLink?: string;
 };

package/dist/cjs/tutorial/tutorial.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tutorial.types.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorial.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC,oBAAY,gBAAgB,GAAG;IAC7B,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,0BAA0B;IAC1B,WAAW,EAAE,MAAM,CAAA;IACnB,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,aAAa,GAAG;IAC1B,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,EAAE,EAAE,MAAM,CAAA;IACV,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,wBAAwB;IACxB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,wBAAwB;IACxB,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,wBAAwB;IACxB,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,mCAAmC;IACnC,MAAM,EAAE,OAAO,CAAA;IACf,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,0BAA0B;IAC1B,WAAW,EAAE,MAAM,CAAA;IACnB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,mBAAmB,GAAG;IAChC,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,gBAAgB,CAAA;CACvB,CAAA;AAED,oBAAY,UAAU,GAAG,WAAW,GAAG,UAAU,CAAA"}
+{"version":3,"file":"tutorial.types.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorial.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC,oBAAY,gBAAgB,GAAG;IAC7B,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,cAAc;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,aAAa,GAAG;IAC1B,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mDAAmD;IACnD,EAAE,EAAE,MAAM,CAAA;IACV,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,wBAAwB;IACxB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,wBAAwB;IACxB,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,2BAA2B;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,wBAAwB;IACxB,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2BAA2B;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,mCAAmC;IACnC,MAAM,EAAE,OAAO,CAAA;IACf,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,mBAAmB;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,oBAAY,mBAAmB,GAAG;IAChC,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,gBAAgB,CAAA;CACvB,CAAA;AAED,oBAAY,UAAU,GAAG,WAAW,GAAG,UAAU,CAAA"}

package/dist/cjs/tutorial/tutorialCard.d.ts

@@ -1,3 +1,3 @@
 import { TutorialCardProps } from './tutorial.types';
-export declare function TutorialCard({ className, description, title, readMoreLink, steps: propsSteps, onDismiss, onFinish }: TutorialCardProps): JSX.Element;
+export declare function TutorialCard({ actionLabel, className, title, readMoreLink, steps: propsSteps, showSkipButton, onAction, onDismiss, onFinish }: TutorialCardProps): JSX.Element;
 //# sourceMappingURL=tutorialCard.d.ts.map

package/dist/cjs/tutorial/tutorialCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tutorialCard.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorialCard.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAyC,MAAM,kBAAkB,CAAA;AAG3F,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,WAAW,EACX,KAAK,EACL,YAAY,EACZ,KAAK,EAAE,UAAe,EACtB,SAAS,EACT,QAAQ,EACT,EAAE,iBAAiB,eAiInB"}
+{"version":3,"file":"tutorialCard.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorialCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAyC,MAAM,kBAAkB,CAAA;AAG3F,wBAAgB,YAAY,CAAC,EAC3B,WAAsB,EACtB,SAAS,EACT,KAAK,EACL,YAAY,EACZ,KAAK,EAAE,UAAe,EACtB,cAAc,EACd,QAAQ,EACR,SAAS,EACT,QAAQ,EACT,EAAE,iBAAiB,eAqHnB"}

package/dist/cjs/tutorial/tutorialCard.js

@@ -26,10 +26,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TutorialCard = void 0;
 const react_1 = __importStar(require("react"));
 const index_1 = require("../index");
+const consts_1 = require("./consts");
 const tutorialStep_1 = require("./tutorialStep");
-function TutorialCard({ className, description, title, readMoreLink, steps: propsSteps = [], onDismiss, onFinish }) {
+function TutorialCard({ actionLabel = 'Action', className, title, readMoreLink, steps: propsSteps = [], showSkipButton, onAction, onDismiss, onFinish }) {
     var _a, _b;
-    const [started, setStarted] = (0, react_1.useState)(false);
     const [steps, setSteps] = (0, react_1.useState)([]);
     const [activeStep, setActiveStep] = (0, react_1.useState)(0);
     (0, react_1.useEffect)(() => {
@@ -37,7 +37,7 @@ function TutorialCard({ className, description, title, readMoreLink, steps: prop
             const s = propsSteps.map((step, key) => ({ active: false, step, key }));
             const finalStep = {
                 title: `Completed!`,
-                description: `${readMoreLink ? 'To learn more, please visit:' : 'Thank you!'}`
+                content: `${readMoreLink ? 'To learn more, please visit:' : 'Thank you!'}`
             };
             if (readMoreLink)
                 finalStep.readMoreLink = readMoreLink;
@@ -46,20 +46,21 @@ function TutorialCard({ className, description, title, readMoreLink, steps: prop
     }, [title, propsSteps]);
     const isStartStep = activeStep === 0;
     const isFinalStep = activeStep === propsSteps.length;
-    const decrementStep = () => setActiveStep(activeStep - 1);
-    const incrementStep = () => setActiveStep(activeStep + 1);
-    return (react_1.default.createElement(index_1.Card, { bg: "blue.100", className: className, color: "white", column: true, justifyContent: "space-between", minH: 200, w: 450 },
-        react_1.default.createElement(index_1.Box, { alignContent: "center", alignItems: "center", display: "flex", flex: 0, flexDirection: "row", flexGrow: 0, justifyContent: "space-between", m: 2, mb: 1, minH: "48px", row: true, style: { WebkitFlexGrow: '0' } },
-            react_1.default.createElement(index_1.H3, null, title),
-            !isFinalStep && (react_1.default.createElement(index_1.Button, { color: "white", hoverColor: "prussian.80", icon: "falTimes", onClick: onDismiss, scale: 2, variant: "tertiaryDark" }))),
-        react_1.default.createElement(index_1.Box, { column: true, flex: 5, hidden: started, mx: 2 },
-            react_1.default.createElement(index_1.T, { flexGrow: 1 }, description),
-            react_1.default.createElement(index_1.Box, { alignItems: "center", flexDirection: "row-reverse", row: true },
-                react_1.default.createElement(index_1.Button, { bg: "white", color: "prussian.80", float: "right", mb: 0, onClick: () => setStarted(true), pb: 0 }, "Let's get started!"))),
-        react_1.default.createElement(index_1.Box, { flex: 5, hidden: !started, mx: 2, row: true }, (_a = steps === null || steps === void 0 ? void 0 : steps.map) === null || _a === void 0 ? void 0 : _a.call(steps, s => (react_1.default.createElement(tutorialStep_1.TutorialStep, { active: s.key === activeStep, description: s.step.description, key: s.step.title, readMoreLink: s.step.readMoreLink, title: s.step.title })))),
-        react_1.default.createElement(index_1.Box, { alignItems: "center", flex: 0, flexGrow: 0, hidden: !started, justifyContent: "space-between", m: 2, mt: 0, row: true, style: { WebkitFlexGrow: '0' } },
-            react_1.default.createElement(index_1.Button, { color: "white", disabled: isStartStep, disabledBg: "blue.100", disabledBorderColor: "blue.100", disabledColor: "prussian.80", focusBorderColor: "none", hoverBg: "none", hoverBorder: "none", hoverBorderColor: "blue.100", icon: "falArrowLeft", onClick: decrementStep, scale: 2, transition: "none", variant: "tertiaryDark", w: "80" }),
-            react_1.default.createElement(index_1.Box, { className: "vuiTutorialStepDots" }, (_b = steps === null || steps === void 0 ? void 0 : steps.map) === null || _b === void 0 ? void 0 : _b.call(steps, s => (react_1.default.createElement(index_1.Icon, { color: s.key === activeStep ? 'white' : 'grey.70', key: s.key, name: "cusDotFull" })))),
-            isFinalStep ? (react_1.default.createElement(index_1.Button, { bg: "white", color: "prussian.80", hoverBg: "blue.30", hoverColor: "prussian.80", onClick: onFinish }, "Finish")) : (react_1.default.createElement(index_1.Button, { color: "white", focusBorderColor: "none", hoverBg: "none", hoverBorder: "none", hoverBorderColor: "blue.100", icon: "falArrowRight", onClick: incrementStep, scale: 2, transition: "none", variant: "tertiaryDark", w: "80" })))));
+    return (react_1.default.createElement(index_1.Card, { bg: consts_1.tutorialColors.bg, className: className, color: consts_1.tutorialColors.color, column: true, justifyContent: "space-between", minH: 400, p: 2, pt: 1, w: 580 },
+        react_1.default.createElement(index_1.Box, { alignContent: "center", alignItems: "center", flex: 0, flexDirection: "row", flexGrow: 0, justifyContent: "space-between", minH: 48, row: true, style: { WebkitFlexGrow: '0' } },
+            react_1.default.createElement(index_1.H4, { color: consts_1.tutorialColors.color }, title),
+            !isFinalStep && react_1.default.createElement(index_1.Button, { icon: "falTimes", onClick: onDismiss, scale: 2, variant: "tertiaryLight" })),
+        react_1.default.createElement(index_1.Box, { flex: 5, row: true }, (_a = steps === null || steps === void 0 ? void 0 : steps.map) === null || _a === void 0 ? void 0 : _a.call(steps, s => (react_1.default.createElement(tutorialStep_1.TutorialStep, { active: s.key === activeStep, content: s.step.content, key: s.step.title, readMoreLink: s.step.readMoreLink, title: s.step.title })))),
+        react_1.default.createElement(index_1.Box, { alignItems: "center", justifyContent: "space-between", mt: 0 },
+            react_1.default.createElement(index_1.Box, { alignItems: "center", justifyContent: "space-between", w: "-webkit-fill-available" },
+                react_1.default.createElement(index_1.Button, { color: consts_1.tutorialColors.buttonColor, disabled: isStartStep, icon: "falArrowLeft", onClick: () => setActiveStep(activeStep - 1), scale: 2, transition: "none", variant: "tertiaryLight", w: "34" }),
+                react_1.default.createElement(index_1.Box, { className: "vuiTutorialStepDots" }, (_b = steps === null || steps === void 0 ? void 0 : steps.map) === null || _b === void 0 ? void 0 : _b.call(steps, s => (react_1.default.createElement(index_1.Icon, { color: s.key === activeStep ? consts_1.tutorialColors.color : 'darkBlue.30', cursor: "pointer", hoverColor: consts_1.tutorialColors.buttonColor, key: s.key, name: "cusDotFull", onClick: () => setActiveStep(s.key) })))),
+                react_1.default.createElement(index_1.Button, { color: consts_1.tutorialColors.buttonColor, disabled: isFinalStep, icon: "falArrowRight", onClick: () => setActiveStep(activeStep + 1), scale: 2, transition: "none", variant: "tertiaryLight", w: "34" })),
+            (showSkipButton || isFinalStep || !!onAction) && (react_1.default.createElement(index_1.Box, { alignItems: "center", justifyContent: "space-between" },
+                showSkipButton && !isFinalStep && (react_1.default.createElement(index_1.Button, { mr: 2, onClick: onDismiss, variant: "primaryLight" }, "Skip")),
+                isFinalStep && (react_1.default.createElement(index_1.Button, { mr: 2, onClick: onFinish, variant: "primaryLight" }, "Finish")),
+                !!onAction && (react_1.default.createElement(index_1.Button, { mr: 6, onClick: onAction, variant: "primaryLight" },
+                    actionLabel,
+                    onAction)))))));
 }
 exports.TutorialCard = TutorialCard;

package/dist/cjs/tutorial/tutorialStep.d.ts

@@ -1,3 +1,3 @@
 import { TutorialStepProps } from './tutorial.types';
-export declare const TutorialStep: ({ active, description, readMoreLink, title }: TutorialStepProps) => JSX.Element;
+export declare const TutorialStep: ({ active, content, title }: TutorialStepProps) => JSX.Element;
 //# sourceMappingURL=tutorialStep.d.ts.map

package/dist/cjs/tutorial/tutorialStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tutorialStep.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorialStep.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD,eAAO,MAAM,YAAY,iDAAkD,iBAAiB,gBAc3F,CAAA"}
+{"version":3,"file":"tutorialStep.d.ts","sourceRoot":"","sources":["../../../src/tutorial/tutorialStep.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD,eAAO,MAAM,YAAY,+BAAgC,iBAAiB,gBAOzE,CAAA"}

package/dist/cjs/tutorial/tutorialStep.js

@@ -6,9 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TutorialStep = void 0;
 const react_1 = __importDefault(require("react"));
 const index_1 = require("../index");
-const TutorialStep = ({ active, description, readMoreLink, title }) => (react_1.default.createElement(index_1.v.div, { className: "vui-tutorialStep", hidden: !active, pb: 2 },
-    react_1.default.createElement(index_1.H5, { fontWeight: "medium", mb: 1 }, title),
-    react_1.default.createElement(index_1.P, null, description),
-    !!readMoreLink && (react_1.default.createElement(index_1.P, null,
-        react_1.default.createElement(index_1.v.a, { href: readMoreLink, textDecoration: "underline" }, readMoreLink)))));
+const consts_1 = require("./consts");
+const TutorialStep = ({ active, content, title }) => (react_1.default.createElement(index_1.v.div, { className: "vui-tutorialStep", hidden: !active, pb: 2 },
+    react_1.default.createElement(index_1.H5, { color: consts_1.tutorialColors.color, fontWeight: "medium", mb: 1 }, title),
+    react_1.default.createElement(index_1.Box, null, content)));
 exports.TutorialStep = TutorialStep;

package/dist/esm/checkbox/checkbox.types.d.ts

@@ -6,7 +6,7 @@ import { ChangeEventHandler, FocusEventHandler } from '../utils';
 export declare type CheckboxProps = SystemProps & ThemingProps<'Checkbox'> & {
     /** Provides value to checkbox in controlled mode. */
     checked?: boolean;
-    /** @deprecated Available theme colors for this component. */
+    /** Deprecated. Please use variant instead. @deprecated  */
     colorScheme?: 'blue' | 'prussian';
     /** Disables checkbox and related elements with the right styling. */
     disabled?: boolean;

package/dist/esm/checkbox/checkbox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.types.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAEhE,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IACjC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iEAAiE;IACjE,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,2DAA2D;IAC3D,WAAW,CAAC,EAAE,QAAQ,CAAA;IACtB,8EAA8E;IAC9E,iBAAiB,CAAC,EAAE,QAAQ,CAAA;IAC5B,sDAAsD;IACtD,UAAU,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAA;IAC7C,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAAG,IAAI,CAAA;IACjE,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,iCAAiC;IACjC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,iCAAiC;IACjC,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,CAAA;AAEH,oBAAY,kBAAkB,GAAG;IAC/B,gEAAgE;IAChE,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA"}
+{"version":3,"file":"checkbox.types.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAEhE,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IACjC,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iEAAiE;IACjE,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,2DAA2D;IAC3D,WAAW,CAAC,EAAE,QAAQ,CAAA;IACtB,8EAA8E;IAC9E,iBAAiB,CAAC,EAAE,QAAQ,CAAA;IAC5B,sDAAsD;IACtD,UAAU,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAA;IAC7C,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,gBAAgB,GAAG,IAAI,CAAC,GAAG,IAAI,CAAA;IACjE,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,iCAAiC;IACjC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,iCAAiC;IACjC,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,CAAA;AAEH,oBAAY,kBAAkB,GAAG;IAC/B,gEAAgE;IAChE,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA"}

package/dist/esm/checkbox/checkboxGroup.types.d.ts

@@ -2,7 +2,7 @@ import { SystemProps } from '../system';
 import { ThemingProps } from '../theme';
 import { ChangeEventHandler, FocusEventHandler } from '../utils';
 export declare type CheckboxGroupProps = SystemProps & ThemingProps<'Checkbox'> & {
-    /** @deprecated Available theme colors for this component. */
+    /** Deprecated. Please use variant instead. @deprecated  */
     colorScheme?: 'blue' | 'prussian';
     /** Passes the prop to each checkbox. */
     disabled?: boolean;

package/dist/esm/checkbox/checkboxGroup.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkboxGroup.types.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkboxGroup.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAEhE,oBAAY,kBAAkB,GAAG,WAAW,GAC1C,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IACjC,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,oCAAoC;IACpC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,wCAAwC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,wCAAwC;IACxC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,wCAAwC;IACxC,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,wCAAwC;IACxC,OAAO,CAAC,EAAE,iBAAiB,CAAA;CAC5B,CAAA"}
+{"version":3,"file":"checkboxGroup.types.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkboxGroup.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAEhE,oBAAY,kBAAkB,GAAG,WAAW,GAC1C,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IACjC,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,oCAAoC;IACpC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,wCAAwC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,wCAAwC;IACxC,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,wCAAwC;IACxC,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,wCAAwC;IACxC,OAAO,CAAC,EAAE,iBAAiB,CAAA;CAC5B,CAAA"}