@searchspring/snap-preact-components 0.27.8 → 0.30.0

package/dist/cjs/components/Atoms/Overlay/Overlay.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Overlay/Overlay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIpC,wBA4DE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC"}
+{"version":3,"file":"Overlay.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Overlay/Overlay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIlD,wBA4DE;AAEF,eAAO,MAAM,OAAO;WAAU,YAAY;;;;CAA0B,CAAC"}

package/dist/cjs/components/Atoms/Overlay/Overlay.stories.js

@@ -72,8 +72,8 @@ exports.default = {
             action: 'onClick',
         } }, utilities_1.componentArgs),
 };
-var Template = function (args) { return (0, preact_1.h)(Overlay_1.Overlay, __assign({}, args)); };
-exports.Default = Template.bind({});
+var Default = function (args) { return (0, preact_1.h)(Overlay_1.Overlay, __assign({}, args)); };
+exports.Default = Default;
 exports.Default.args = {
     active: true,
 };

package/dist/cjs/components/Atoms/Price/Price.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Price.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Price/Price.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAa1E,wBAAgB,KAAK,CAAC,UAAU,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CA4DzD;AAED,MAAM,WAAW,UAAW,SAAQ,oBAAoB;IACvD,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB"}
+{"version":3,"file":"Price.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Price/Price.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAc1E,wBAAgB,KAAK,CAAC,UAAU,EAAE,UAAU,GAAG,GAAG,CAAC,OAAO,CA4DzD;AAED,MAAM,WAAW,UAAW,SAAQ,oBAAoB;IACvD,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB"}

package/dist/cjs/components/Atoms/Price/Price.js

@@ -26,7 +26,7 @@ var CSS = {
         var _b;
         var theme = _a.theme;
         return (0, react_1.css)({
-            color: (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.primary,
+            color: (_b = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _b === void 0 ? void 0 : _b.primary,
             '&.ss__price--strike': {
                 textDecoration: 'line-through',
                 color: 'initial',

package/dist/cjs/components/Atoms/Price/Price.stories.d.ts

@@ -1,5 +1,5 @@
 import { h } from 'preact';
-import { Price } from './Price';
+import { Price, PriceProps } from './Price';
 declare const _default: {
     title: string;
     component: typeof Price;
@@ -197,7 +197,27 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Default: any;
-export declare const lineThrough: any;
-export declare const CustomCurrency: any;
+export declare const Default: {
+    (args: PriceProps): h.JSX.Element;
+    args: {
+        value: number;
+    };
+};
+export declare const lineThrough: {
+    (args: PriceProps): h.JSX.Element;
+    args: {
+        value: number;
+        lineThrough: boolean;
+    };
+};
+export declare const CustomCurrency: {
+    (args: PriceProps): h.JSX.Element;
+    args: {
+        value: number;
+        symbol: string;
+        thousandsSeparator: string;
+        decimalSeparator: string;
+        symbolAfter: boolean;
+    };
+};
 //# sourceMappingURL=Price.stories.d.ts.map

package/dist/cjs/components/Atoms/Price/Price.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Price.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Price/Price.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIhC,wBAoHE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC;AAKzC,eAAO,MAAM,WAAW,KAAoB,CAAC;AAM7C,eAAO,MAAM,cAAc,KAAoB,CAAC"}
+{"version":3,"file":"Price.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Price/Price.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAI5C,wBAoHE;AAEF,eAAO,MAAM,OAAO;WAAU,UAAU;;;;CAAwB,CAAC;AAKjE,eAAO,MAAM,WAAW;WAAU,UAAU;;;;;CAAwB,CAAC;AAMrE,eAAO,MAAM,cAAc;WAAU,UAAU;;;;;;;;CAAwB,CAAC"}

package/dist/cjs/components/Atoms/Price/Price.stories.js

@@ -123,17 +123,19 @@ exports.default = {
             control: { type: 'boolean' },
         } }, utilities_1.componentArgs),
 };
-var Template = function (args) { return (0, preact_1.h)(Price_1.Price, __assign({}, args)); };
-exports.Default = Template.bind({});
+var Default = function (args) { return (0, preact_1.h)(Price_1.Price, __assign({}, args)); };
+exports.Default = Default;
 exports.Default.args = {
     value: 1099.99,
 };
-exports.lineThrough = Template.bind({});
+var lineThrough = function (args) { return (0, preact_1.h)(Price_1.Price, __assign({}, args)); };
+exports.lineThrough = lineThrough;
 exports.lineThrough.args = {
     value: 1199.99,
     lineThrough: true,
 };
-exports.CustomCurrency = Template.bind({});
+var CustomCurrency = function (args) { return (0, preact_1.h)(Price_1.Price, __assign({}, args)); };
+exports.CustomCurrency = CustomCurrency;
 exports.CustomCurrency.args = {
     value: 999.99,
     symbol: ' €',

package/dist/cjs/components/Atoms/Skeleton/Skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AA0ChD,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CA0BvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB"}
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAc,MAAM,gBAAgB,CAAC;AAyC5D,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CA0BvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB"}

package/dist/cjs/components/Atoms/Skeleton/Skeleton.stories.d.ts

@@ -1,9 +1,10 @@
 /// <reference types="react" />
 /** @jsx h */
 import { h } from 'preact';
+import { SkeletonProps } from './Skeleton';
 declare const _default: {
     title: string;
-    component: ((properties: import("./Skeleton").SkeletonProps) => JSX.Element) & {
+    component: ((properties: SkeletonProps) => JSX.Element) & {
         displayName: string;
     };
     parameters: {
@@ -137,9 +138,15 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Default: any;
+export declare const Default: {
+    (args: SkeletonProps): h.JSX.Element;
+    args: {
+        width: string;
+        height: string;
+    };
+};
 export declare const Circle: {
-    (args: any): h.JSX.Element;
+    (args: SkeletonProps): h.JSX.Element;
     args: {
         width: string;
         height: string;

package/dist/cjs/components/Atoms/Skeleton/Skeleton.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Skeleton/Skeleton.stories.tsx"],"names":[],"mappings":";AAAA,aAAa;AACb,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQ3B,wBAiFE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC;AAMzC,eAAO,MAAM,MAAM;;;;;;;CAAmC,CAAC"}
+{"version":3,"file":"Skeleton.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Atoms/Skeleton/Skeleton.stories.tsx"],"names":[],"mappings":";AAAA,aAAa;AACb,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAK3B,OAAO,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;;;;;;;;;;;yBAiB3C,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAdb,wBAiFE;AAEF,eAAO,MAAM,OAAO;WAAU,aAAa;;;;;CAA2B,CAAC;AAMvE,eAAO,MAAM,MAAM;WAAU,aAAa;;;;;;CAA2B,CAAC"}

package/dist/cjs/components/Atoms/Skeleton/Skeleton.stories.js

@@ -88,8 +88,8 @@ exports.default = {
             control: { type: 'text' },
         } }, utilities_1.componentArgs),
 };
-var Template = function (args) { return (0, preact_1.h)(Skeleton_1.Skeleton, __assign({}, args)); };
-exports.Default = Template.bind({});
+var Default = function (args) { return (0, preact_1.h)(Skeleton_1.Skeleton, __assign({}, args)); };
+exports.Default = Default;
 exports.Default.args = {
     width: '100px',
     height: '100px',

package/dist/cjs/components/Molecules/Carousel/Carousel.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import SwiperCore from 'swiper/core';
 import { ComponentProps, BreakpointsProps } from '../../../types';
 export declare const defaultCarouselBreakpoints: {
     0: {
@@ -46,10 +47,10 @@ export interface CarouselProps extends ComponentProps {
     vertical?: boolean;
     pagination?: boolean;
     autoAdjustSlides?: boolean;
-    onClick?: (swiper: any, e: any) => void;
-    onNextButtonClick?: (e: any) => void;
-    onPrevButtonClick?: (e: any) => void;
-    onInit?: (swiper: any) => void;
-    children?: JSX.Element[];
+    onClick?: (swiper: SwiperCore, e: MouseEvent | TouchEvent | PointerEvent) => void;
+    onNextButtonClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onPrevButtonClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onInit?: (swiper: SwiperCore) => void;
+    children: JSX.Element[];
 }
 //# sourceMappingURL=Carousel.d.ts.map

package/dist/cjs/components/Molecules/Carousel/Carousel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA8HlE,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CA8IvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,KAAA,EAAE,CAAC,KAAA,KAAK,IAAI,CAAC;IAC9B,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,CAAC,KAAA,KAAK,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAA,KAAK,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;CACzB"}
+{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":";AAQA,OAAO,UAAsC,MAAM,aAAa,CAAC;AAMjE,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAc,MAAM,gBAAgB,CAAC;AA8H9E,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CAiJvE,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,KAAK,IAAI,CAAC;IAClF,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;CACxB"}

package/dist/cjs/components/Molecules/Carousel/Carousel.js

@@ -49,6 +49,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Carousel = exports.defaultVerticalCarouselBreakpoints = exports.defaultCarouselBreakpoints = void 0;
+/** @jsx jsx */
+var preact_1 = require("preact");
 var hooks_1 = require("preact/hooks");
 var react_1 = require("@emotion/react");
 var classnames_1 = __importDefault(require("classnames"));
@@ -67,7 +69,7 @@ var CSS = {
         return (0, react_1.css)({
             display: 'flex',
             maxWidth: '100%',
-            maxHeight: vertical ? '100%' : null,
+            maxHeight: vertical ? '100%' : undefined,
             margin: 0,
             padding: 0,
             overflow: 'hidden',
@@ -122,7 +124,7 @@ var CSS = {
                 overflow: 'hidden',
                 listStyle: 'none',
                 padding: 0,
-                zIndex: 1,
+                zIndex: '1',
             },
             '.swiper-container-vertical': {
                 '.swiper-wrapper': {
@@ -134,7 +136,7 @@ var CSS = {
                 position: 'relative',
                 width: '100%',
                 height: '100%',
-                zIndex: 1,
+                zIndex: '1',
                 display: 'flex',
                 transitionProperty: 'transform',
                 boxSizing: 'content-box',
@@ -220,7 +222,9 @@ exports.Carousel = (0, mobx_react_lite_1.observer)(function (properties) {
     var theme = __assign(__assign({}, globalTheme), properties.theme);
     var props = __assign(__assign(__assign({ 
         // default props
-        breakpoints: properties.vertical ? exports.defaultVerticalCarouselBreakpoints : exports.defaultCarouselBreakpoints, pagination: false, loop: true, autoAdjustSlides: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.carousel), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.carousel);
+        breakpoints: properties.vertical
+            ? JSON.parse(JSON.stringify(exports.defaultVerticalCarouselBreakpoints))
+            : JSON.parse(JSON.stringify(exports.defaultCarouselBreakpoints)), pagination: false, loop: true, autoAdjustSlides: true }, (_a = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _a === void 0 ? void 0 : _a.carousel), properties), (_c = (_b = properties.theme) === null || _b === void 0 ? void 0 : _b.components) === null || _c === void 0 ? void 0 : _c.carousel);
     var displaySettings = (0, useDisplaySettings_1.useDisplaySettings)(props.breakpoints);
     if (displaySettings && Object.keys(displaySettings).length) {
         var theme_1 = (0, deepmerge_1.default)((props === null || props === void 0 ? void 0 : props.theme) || {}, (displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.theme) || {});
@@ -252,7 +256,7 @@ exports.Carousel = (0, mobx_react_lite_1.observer)(function (properties) {
     else if (style) {
         styling.css = [style];
     }
-    return (children && ((0, react_1.jsx)(providers_1.CacheProvider, null,
+    return (children === null || children === void 0 ? void 0 : children.length) ? ((0, react_1.jsx)(providers_1.CacheProvider, null,
         (0, react_1.jsx)("div", __assign({ ref: rootComponentRef }, styling, { className: (0, classnames_1.default)('ss__carousel', vertical ? 'ss__carousel-vertical' : '', className) }),
             (0, react_1.jsx)("div", { className: (0, classnames_1.default)('ss__carousel__prev-wrapper', { 'ss__carousel__prev-wrapper--hidden': hideButtons }) },
                 (0, react_1.jsx)("div", { className: "ss__carousel__prev", ref: navigationPrevRef, onClick: onPrevButtonClick && (function (e) { return onPrevButtonClick(e); }) }, prevButton || (0, react_1.jsx)(Icon_1.Icon, __assign({ icon: vertical ? 'angle-up' : 'angle-left' }, subProps.icon)))),
@@ -270,9 +274,9 @@ exports.Carousel = (0, mobx_react_lite_1.observer)(function (properties) {
                     ? {
                         clickable: true,
                     }
-                    : false }, additionalProps, displaySettings), children.map(function (child) {
+                    : false, threshold: 7 }, additionalProps, displaySettings), children.map(function (child) {
                 return (0, react_1.jsx)(react_2.SwiperSlide, null, child);
             })),
             (0, react_1.jsx)("div", { className: (0, classnames_1.default)('ss__carousel__next-wrapper', { 'ss__carousel__next-wrapper--hidden': hideButtons }) },
-                (0, react_1.jsx)("div", { className: "ss__carousel__next", ref: navigationNextRef, onClick: onNextButtonClick && (function (e) { return onNextButtonClick(e); }) }, nextButton || (0, react_1.jsx)(Icon_1.Icon, __assign({ icon: vertical ? 'angle-down' : 'angle-right' }, subProps.icon))))))));
+                (0, react_1.jsx)("div", { className: "ss__carousel__next", ref: navigationNextRef, onClick: onNextButtonClick && (function (e) { return onNextButtonClick(e); }) }, nextButton || (0, react_1.jsx)(Icon_1.Icon, __assign({ icon: vertical ? 'angle-down' : 'angle-right' }, subProps.icon))))))) : ((0, react_1.jsx)(preact_1.Fragment, null));
 });

package/dist/cjs/components/Molecules/Carousel/Carousel.stories.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="react" />
 import { h } from 'preact';
+import { CarouselProps } from './Carousel';
 declare const _default: {
     title: string;
-    component: ((properties: import("./Carousel").CarouselProps) => JSX.Element) & {
+    component: ((properties: CarouselProps) => JSX.Element) & {
         displayName: string;
     };
     parameters: {
@@ -146,7 +147,7 @@ declare const _default: {
             };
         };
         breakpoints: {
-            defaultValue: any;
+            defaultValue: undefined;
             description: string;
             table: {
                 type: {
@@ -215,12 +216,12 @@ declare const _default: {
 };
 export default _default;
 export declare const Colors: {
-    (props: any): h.JSX.Element;
+    (props: CarouselProps): h.JSX.Element;
     args: {
         pagination: boolean;
         hideButtons: boolean;
         loop: boolean;
     };
 };
-export declare const Icons: (props: any) => h.JSX.Element;
+export declare const Icons: (props: CarouselProps) => h.JSX.Element;
 //# sourceMappingURL=Carousel.stories.d.ts.map

package/dist/cjs/components/Molecules/Carousel/Carousel.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,CAAC,EAAE,MAAM,QAAQ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASrC,wBAqJE;AAGF,eAAO,MAAM,MAAM;;;;;;;CAQlB,CAAC;AAOF,eAAO,MAAM,KAAK,+BAajB,CAAC"}
+{"version":3,"file":"Carousel.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Carousel/Carousel.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,CAAC,EAAE,MAAM,QAAQ,CAAC;AAIrC,OAAO,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;;;;;;;;;;;yBAmB3C,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAdb,wBAqJE;AAIF,eAAO,MAAM,MAAM;YAAW,aAAa;;;;;;CAQ1C,CAAC;AAOF,eAAO,MAAM,KAAK,UAAW,aAAa,kBAazC,CAAC"}

package/dist/cjs/components/Molecules/Carousel/Carousel.stories.js

@@ -150,7 +150,7 @@ exports.default = {
 };
 var colors = Array.from(Array(9).keys());
 var Colors = function (props) {
-    return ((0, preact_1.h)(Carousel_1.Carousel, __assign({}, props), colors.map(function (number, index) { return ((0, preact_1.h)("div", { style: { height: '100px', width: '100px', background: shiftColor('#3a23ad', (index + "111").padStart(6, '0')), margin: '0 auto' } })); })));
+    return ((0, preact_1.h)(Carousel_1.Carousel, __assign({}, props), colors.map(function (number, index) { return ((0, preact_1.h)("div", { style: { height: '100px', width: '100px', background: (0, utilities_1.shiftColor)('#3a23ad', (index + "111").padStart(6, '0')), margin: '0 auto' } })); })));
 };
 exports.Colors = Colors;
 exports.Colors.args = {
@@ -161,32 +161,8 @@ exports.Colors.args = {
 var Icons = function (props) {
     return ((0, preact_1.h)(Carousel_1.Carousel, __assign({}, props), Object.keys(Icon_1.iconPaths).map(function (icon, index) {
         return ((0, preact_1.h)("div", { style: { margin: '0 auto', textAlign: 'center' } },
-            (0, preact_1.h)(Icon_1.Icon, { icon: icon, color: shiftColor('#3a23ad', (index + '111').padStart(6, '1')), size: "80px", style: { padding: '20px' } }),
+            (0, preact_1.h)(Icon_1.Icon, { icon: icon, color: (0, utilities_1.shiftColor)('#3a23ad', (index + '111').padStart(6, '1')), size: "80px", style: { padding: '20px' } }),
             (0, preact_1.h)("div", { style: "text-align: center" }, icon)));
     })));
 };
 exports.Icons = Icons;
-function shiftColor(base, change) {
-    var colorRegEx = /^\#?[A-Fa-f0-9]{6}$/;
-    if (!base || !change) {
-        return '#000000';
-    }
-    if (!base.match(colorRegEx) || !change.match(colorRegEx)) {
-        return '#000000';
-    }
-    // remove '#'s
-    base = base.replace(/\#/g, '');
-    change = change.replace(/\#/g, '');
-    var newColor = '';
-    for (var i = 0; i < 3; i++) {
-        var basePiece = parseInt(base.substring(i * 2, i * 2 + 2), 16);
-        var changePiece = parseInt(change.substring(i * 2, i * 2 + 2), 16);
-        var newPiece = void 0;
-        newPiece = basePiece + changePiece;
-        newPiece = newPiece > 255 ? 255 : newPiece;
-        newPiece = newPiece.toString(16);
-        newPiece = newPiece.length < 2 ? '0' + newPiece : newPiece;
-        newColor += newPiece;
-    }
-    return "#".concat(newColor);
-}

package/dist/cjs/components/Molecules/Checkbox/Checkbox.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ComponentProps } from '../../../types';
 export declare const Checkbox: ((properties: CheckboxProps) => JSX.Element) & {
     displayName: string;
@@ -8,7 +9,7 @@ export interface CheckboxProps extends ComponentProps {
     disabled?: boolean;
     icon?: string;
     iconColor?: string;
-    onClick?: (e: Event) => void;
+    onClick?: (e: React.MouseEvent<HTMLInputElement | HTMLSpanElement, MouseEvent>) => void;
     size?: string;
     startChecked?: boolean;
     native?: boolean;

package/dist/cjs/components/Molecules/Checkbox/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AA0BhD,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CAqFvE,CAAC;AAKH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,cAAc,EAAc,MAAM,gBAAgB,CAAC;AA0B5D,eAAO,MAAM,QAAQ,gBAAyB,aAAa,KAAG,WAAW;;CAuFvE,CAAC;AAKH,MAAM,WAAW,aAAc,SAAQ,cAAc;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,eAAe,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;CACjB"}

package/dist/cjs/components/Molecules/Checkbox/Checkbox.js

@@ -32,7 +32,7 @@ var CSS = {
             justifyContent: 'center',
             height: size,
             width: size,
-            border: "1px solid ".concat(color || ((_b = theme.colors) === null || _b === void 0 ? void 0 : _b.primary) || '#333'),
+            border: "1px solid ".concat(color || ((_b = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _b === void 0 ? void 0 : _b.primary) || '#333'),
             '&.ss__checkbox--disabled': {
                 opacity: 0.7,
             },
@@ -58,7 +58,7 @@ exports.Checkbox = (0, mobx_react_lite_1.observer)(function (properties) {
         icon: __assign(__assign(__assign({ 
             // default props
             className: 'ss__checkbox__icon', icon: 'check-thin' }, (_e = globalTheme === null || globalTheme === void 0 ? void 0 : globalTheme.components) === null || _e === void 0 ? void 0 : _e.icon), (0, utilities_1.defined)({
-            color: iconColor || color || ((_f = theme.colors) === null || _f === void 0 ? void 0 : _f.primary),
+            color: iconColor || color || ((_f = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _f === void 0 ? void 0 : _f.primary),
             disableStyles: disableStyles,
             icon: icon,
             size: size && "calc(".concat(size, " - 30%)"),
@@ -77,9 +77,10 @@ exports.Checkbox = (0, mobx_react_lite_1.observer)(function (properties) {
     var clickFunc = function (e) {
         if (!disabled) {
             if (stateful) {
-                setCheckedState(function (prev) {
-                    return !prev;
-                });
+                setCheckedState &&
+                    setCheckedState(function (prev) {
+                        return !prev;
+                    });
             }
             onClick && onClick(e);
         }

package/dist/cjs/components/Molecules/Checkbox/Checkbox.stories.d.ts

@@ -190,7 +190,18 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Default: any;
-export declare const Disabled: any;
-export declare const Native: any;
+export declare const Default: (args: CheckboxProps) => h.JSX.Element;
+export declare const Disabled: {
+    (args: CheckboxProps): h.JSX.Element;
+    args: {
+        checked: boolean;
+        disabled: boolean;
+    };
+};
+export declare const Native: {
+    (args: CheckboxProps): h.JSX.Element;
+    args: {
+        native: boolean;
+    };
+};
 //# sourceMappingURL=Checkbox.stories.d.ts.map

package/dist/cjs/components/Molecules/Checkbox/Checkbox.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKrD,wBA8GE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC;AAEzC,eAAO,MAAM,QAAQ,KAAoB,CAAC;AAM1C,eAAO,MAAM,MAAM,KAAoB,CAAC"}
+{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKrD,wBA8GE;AAEF,eAAO,MAAM,OAAO,SAAU,aAAa,kBAA2B,CAAC;AAEvE,eAAO,MAAM,QAAQ;WAAU,aAAa;;;;;CAA2B,CAAC;AAMxE,eAAO,MAAM,MAAM;WAAU,aAAa;;;;CAA2B,CAAC"}

package/dist/cjs/components/Molecules/Checkbox/Checkbox.stories.js

@@ -127,14 +127,16 @@ exports.default = {
             action: 'onClick',
         } }, utilities_1.componentArgs),
 };
-var Template = function (args) { return (0, preact_1.h)(Checkbox_1.Checkbox, __assign({}, args)); };
-exports.Default = Template.bind({});
-exports.Disabled = Template.bind({});
+var Default = function (args) { return (0, preact_1.h)(Checkbox_1.Checkbox, __assign({}, args)); };
+exports.Default = Default;
+var Disabled = function (args) { return (0, preact_1.h)(Checkbox_1.Checkbox, __assign({}, args)); };
+exports.Disabled = Disabled;
 exports.Disabled.args = {
     checked: true,
     disabled: true,
 };
-exports.Native = Template.bind({});
+var Native = function (args) { return (0, preact_1.h)(Checkbox_1.Checkbox, __assign({}, args)); };
+exports.Native = Native;
 exports.Native.args = {
     native: true,
 };

package/dist/cjs/components/Molecules/ErrorHandler/ErrorHandler.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ComponentProps } from '../../../types';
 import { ErrorType } from '@searchspring/snap-store-mobx';
 import type { AbstractController } from '@searchspring/snap-controller';
@@ -6,11 +7,11 @@ export declare const ErrorHandler: ((properties: ErrorHandlerProps) => JSX.Eleme
 };
 export interface ErrorHandlerProps extends ComponentProps {
     controller?: AbstractController;
-    error?: {
+    error: {
         code?: number;
         type: ErrorType;
         message: string;
     };
-    onRetryClick?: (e: Event) => void;
+    onRetryClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
 }
 //# sourceMappingURL=ErrorHandler.d.ts.map

package/dist/cjs/components/Molecules/ErrorHandler/ErrorHandler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorHandler.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/ErrorHandler/ErrorHandler.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE1D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAgExE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,WAAW;;CAmG/E,CAAC;AAEH,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IACxD,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,SAAS,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC"}
+{"version":3,"file":"ErrorHandler.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/ErrorHandler/ErrorHandler.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAE,cAAc,EAAc,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE1D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAgExE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,WAAW;;CAkG/E,CAAC;AAEH,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IACxD,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,EAAE;QACN,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,SAAS,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACtE"}

package/dist/cjs/components/Molecules/ErrorHandler/ErrorHandler.js

@@ -47,7 +47,7 @@ var CSS = {
             '& .ss__error-handler__button': {
                 backgroundColor: 'white',
                 color: 'inherit',
-                borderColor: (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.primary,
+                borderColor: (_b = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _b === void 0 ? void 0 : _b.primary,
                 width: ['150px', 'fit-content'],
                 margin: '5px 10px',
                 '.ss__icon': {
@@ -55,30 +55,30 @@ var CSS = {
                 },
             },
             '&.ss__error-handler--error': {
-                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_d = (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.message) === null || _d === void 0 ? void 0 : _d.error) || 'red', 180),
-                borderLeftColor: ((_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.message) === null || _f === void 0 ? void 0 : _f.error) || '#ff0000',
+                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_d = (_c = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _c === void 0 ? void 0 : _c.message) === null || _d === void 0 ? void 0 : _d.error) || 'red', 180),
+                borderLeftColor: ((_f = (_e = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _e === void 0 ? void 0 : _e.message) === null || _f === void 0 ? void 0 : _f.error) || '#ff0000',
                 '.ss__error-handler__message': {
                     '.ss__icon': {
-                        fill: ((_h = (_g = theme.colors) === null || _g === void 0 ? void 0 : _g.message) === null || _h === void 0 ? void 0 : _h.error) || '#ff0000',
+                        fill: ((_h = (_g = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _g === void 0 ? void 0 : _g.message) === null || _h === void 0 ? void 0 : _h.error) || '#ff0000',
                     },
                 },
             },
             '&.ss__error-handler--warning': {
-                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_k = (_j = theme.colors) === null || _j === void 0 ? void 0 : _j.message) === null || _k === void 0 ? void 0 : _k.warning) || 'yellow', 180),
-                borderLeftColor: ((_m = (_l = theme.colors) === null || _l === void 0 ? void 0 : _l.message) === null || _m === void 0 ? void 0 : _m.warning) || '#ffff00',
+                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_k = (_j = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _j === void 0 ? void 0 : _j.message) === null || _k === void 0 ? void 0 : _k.warning) || 'yellow', 180),
+                borderLeftColor: ((_m = (_l = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _l === void 0 ? void 0 : _l.message) === null || _m === void 0 ? void 0 : _m.warning) || '#ffff00',
                 '.ss__icon': {
-                    fill: ((_p = (_o = theme.colors) === null || _o === void 0 ? void 0 : _o.message) === null || _p === void 0 ? void 0 : _p.warning) || '#ffff00',
+                    fill: ((_p = (_o = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _o === void 0 ? void 0 : _o.message) === null || _p === void 0 ? void 0 : _p.warning) || '#ffff00',
                 },
                 '.ss__error-handler__button': {
-                    borderColor: ((_r = (_q = theme.colors) === null || _q === void 0 ? void 0 : _q.message) === null || _r === void 0 ? void 0 : _r.warning) || '#ffff00',
+                    borderColor: ((_r = (_q = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _q === void 0 ? void 0 : _q.message) === null || _r === void 0 ? void 0 : _r.warning) || '#ffff00',
                 },
             },
             '&.ss__error-handler--info': {
-                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_t = (_s = theme.colors) === null || _s === void 0 ? void 0 : _s.message) === null || _t === void 0 ? void 0 : _t.info) || 'blue', 180),
-                borderLeftColor: ((_v = (_u = theme.colors) === null || _u === void 0 ? void 0 : _u.message) === null || _v === void 0 ? void 0 : _v.info) || '#0000ff',
+                backgroundColor: (0, utilities_1.LightenDarkenColor)(((_t = (_s = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _s === void 0 ? void 0 : _s.message) === null || _t === void 0 ? void 0 : _t.info) || 'blue', 180),
+                borderLeftColor: ((_v = (_u = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _u === void 0 ? void 0 : _u.message) === null || _v === void 0 ? void 0 : _v.info) || '#0000ff',
                 '.ss__error-handler__message': {
                     '.ss__icon': {
-                        fill: ((_x = (_w = theme.colors) === null || _w === void 0 ? void 0 : _w.message) === null || _x === void 0 ? void 0 : _x.info) || '#0000ff',
+                        fill: ((_x = (_w = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _w === void 0 ? void 0 : _w.message) === null || _x === void 0 ? void 0 : _x.info) || '#0000ff',
                     },
                 },
             },
@@ -115,8 +115,7 @@ exports.ErrorHandler = (0, mobx_react_lite_1.observer)(function (properties) {
     else if (style) {
         styling.css = [style];
     }
-    return (Object.values(snap_store_mobx_1.ErrorType).includes(errorObject === null || errorObject === void 0 ? void 0 : errorObject.type) &&
-        (errorObject === null || errorObject === void 0 ? void 0 : errorObject.message) && ((0, react_1.jsx)(providers_1.CacheProvider, null,
+    return Object.values(snap_store_mobx_1.ErrorType).includes(errorObject === null || errorObject === void 0 ? void 0 : errorObject.type) && (errorObject === null || errorObject === void 0 ? void 0 : errorObject.message) ? ((0, react_1.jsx)(providers_1.CacheProvider, null,
         (0, react_1.jsx)("div", __assign({ className: (0, classnames_1.default)('ss__error-handler', "ss__error-handler--".concat(errorObject.type), className) }, styling), (function () {
             switch (errorObject.type) {
                 case snap_store_mobx_1.ErrorType.WARNING:
@@ -141,5 +140,5 @@ exports.ErrorHandler = (0, mobx_react_lite_1.observer)(function (properties) {
                         (0, react_1.jsx)("b", null, "Info:\u00A0"),
                         errorObject.message));
             }
-        })()))));
+        })()))) : ((0, react_1.jsx)(preact_1.Fragment, null));
 });

package/dist/cjs/components/Molecules/ErrorHandler/ErrorHandler.stories.d.ts

@@ -1,8 +1,10 @@
 /// <reference types="react" />
 import { h } from 'preact';
+import { ErrorType } from '@searchspring/snap-store-mobx';
+import { ErrorHandlerProps } from './ErrorHandler';
 declare const _default: {
     title: string;
-    component: ((properties: import("./ErrorHandler").ErrorHandlerProps) => JSX.Element) & {
+    component: ((properties: ErrorHandlerProps) => JSX.Element) & {
         displayName: string;
     };
     parameters: {
@@ -103,8 +105,55 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Warning: any;
-export declare const Error: any;
-export declare const Info: any;
-export declare const CustomError: any;
+export declare const Warning: {
+    (args: ErrorHandlerProps): h.JSX.Element;
+    args: {
+        controller: {
+            store: {
+                error: {
+                    code: number;
+                    type: ErrorType;
+                    message: string;
+                };
+            };
+        };
+    };
+};
+export declare const Error: {
+    (args: ErrorHandlerProps): h.JSX.Element;
+    args: {
+        controller: {
+            store: {
+                error: {
+                    code: number;
+                    type: ErrorType;
+                    message: string;
+                };
+            };
+        };
+    };
+};
+export declare const Info: {
+    (args: ErrorHandlerProps): h.JSX.Element;
+    args: {
+        controller: {
+            store: {
+                error: {
+                    code: number;
+                    type: ErrorType;
+                    message: string;
+                };
+            };
+        };
+    };
+};
+export declare const CustomError: {
+    (args: ErrorHandlerProps): h.JSX.Element;
+    args: {
+        error: {
+            type: ErrorType;
+            message: string;
+        };
+    };
+};
 //# sourceMappingURL=ErrorHandler.stories.d.ts.map

package/dist/cjs/components/Molecules/ErrorHandler/ErrorHandler.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorHandler.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/ErrorHandler/ErrorHandler.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,CAAC,EAAE,MAAM,QAAQ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASrC,wBAyDE;AAIF,eAAO,MAAM,OAAO,KAAoB,CAAC;AAazC,eAAO,MAAM,KAAK,KAAoB,CAAC;AAavC,eAAO,MAAM,IAAI,KAAoB,CAAC;AAatC,eAAO,MAAM,WAAW,KAAoB,CAAC"}
+{"version":3,"file":"ErrorHandler.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Molecules/ErrorHandler/ErrorHandler.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,CAAC,EAAE,MAAM,QAAQ,CAAC;AAGrC,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE1D,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;;;;;;;;;;;yBAkBvD,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAdb,wBAyDE;AAEF,eAAO,MAAM,OAAO;WAAU,iBAAiB;;;;;;;;;;;;CAA+B,CAAC;AAa/E,eAAO,MAAM,KAAK;WAAU,iBAAiB;;;;;;;;;;;;CAA+B,CAAC;AAa7E,eAAO,MAAM,IAAI;WAAU,iBAAiB;;;;;;;;;;;;CAA+B,CAAC;AAa5E,eAAO,MAAM,WAAW;WAAU,iBAAiB;;;;;;;CAA+B,CAAC"}