@bikdotai/bik-component-library 0.0.687-beta.9 → 0.0.687

package/dist/cjs/components/side-modal/SideModal.d.ts

@@ -1,25 +1,21 @@
-import React__default from 'react';
-import { ButtonProps } from '../button/model.js';
-
-interface SideModalProps {
-    header: string;
-    children: React__default.ReactNode;
-    headerCustomComponent?: React__default.ReactNode;
-    footerCustomComponent?: React__default.ReactNode;
-    footerDirection?: 'row' | 'row-reverse';
-    hideCrossButton?: boolean;
-    width?: string;
-    saveButtonProps?: ButtonProps;
-    cancelButtonProps?: ButtonProps;
-    onClose: () => void;
-    zIndex?: number;
-    hideFooter?: boolean;
-    bodyStyle?: React__default.CSSProperties;
-    element?: Element | DocumentFragment;
-    headerStyle?: React__default.CSSProperties;
-    footerStyle?: React__default.CSSProperties;
-}
-declare const SideModal: React__default.FC<SideModalProps>;
-
-export { SideModal };
-export type { SideModalProps };
+import React from 'react';
+import { ButtonProps } from '../button/model';
+export interface SideModalProps {
+    header: string;
+    children: React.ReactNode;
+    headerCustomComponent?: React.ReactNode;
+    footerCustomComponent?: React.ReactNode;
+    footerDirection?: 'row' | 'row-reverse';
+    hideCrossButton?: boolean;
+    width?: string;
+    saveButtonProps?: ButtonProps;
+    cancelButtonProps?: ButtonProps;
+    onClose: () => void;
+    zIndex?: number;
+    hideFooter?: boolean;
+    bodyStyle?: React.CSSProperties;
+    element?: Element | DocumentFragment;
+    headerStyle?: React.CSSProperties;
+    footerStyle?: React.CSSProperties;
+}
+export declare const SideModal: React.FC<SideModalProps>;

package/dist/cjs/components/side-modal/SideModal.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("react-dom"),t=require("../../assets/icons/cross.svg.js"),r=require("../button/Button.js"),n=require("../TypographyStyle.js"),d=require("./SideModal.style.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=s(o);exports.SideModal=o=>i.default.createPortal(e.jsx(d.SideModalStyle,{zIndex:o.zIndex,children:e.jsxs(d.SideModalContainer,{width:o.width,children:[e.jsxs(d.SideModalHeader,{headerStyle:{...o.headerStyle},children:[o?.headerCustomComponent||e.jsx(n.TitleMedium,{children:o.header}),!o.hideCrossButton&&e.jsx(t.default,{width:24,height:24,onClick:o.onClose})]}),e.jsx(d.SideModalBody,{hideFooter:o.hideFooter,bodyStyle:{...o.bodyStyle},children:o.children}),!0===o.hideFooter?null:e.jsxs(d.SideModalFooter,{footerDirection:o.footerDirection,footerStyle:{...o.footerStyle},children:[(o.saveButtonProps||o.cancelButtonProps)&&e.jsxs(d.FooterButtonWrapper,{footerDirection:o.footerDirection,children:[o.saveButtonProps&&e.jsx(r.Button,{...o.saveButtonProps}),o.cancelButtonProps&&e.jsx(r.Button,{...o.cancelButtonProps})]}),o.footerCustomComponent?o.footerCustomComponent:e.jsx(e.Fragment,{})]})]})}),o.element??document.body);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react-dom"),o=require("../../assets/icons/cross.svg.js"),r=require("../button/Button.js"),s=require("../TypographyStyle.js"),n=require("./SideModal.style.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=i(t);exports.SideModal=t=>{var i;return d.default.createPortal(e.jsx(n.SideModalStyle,Object.assign({zIndex:t.zIndex},{children:e.jsxs(n.SideModalContainer,Object.assign({width:t.width},{children:[e.jsxs(n.SideModalHeader,Object.assign({headerStyle:Object.assign({},t.headerStyle)},{children:[(null==t?void 0:t.headerCustomComponent)||e.jsx(s.TitleMedium,{children:t.header}),!t.hideCrossButton&&e.jsx(o.default,{width:24,height:24,onClick:t.onClose})]})),e.jsx(n.SideModalBody,Object.assign({hideFooter:t.hideFooter,bodyStyle:Object.assign({},t.bodyStyle)},{children:t.children})),!0===t.hideFooter?null:e.jsxs(n.SideModalFooter,Object.assign({footerDirection:t.footerDirection,footerStyle:Object.assign({},t.footerStyle)},{children:[(t.saveButtonProps||t.cancelButtonProps)&&e.jsxs(n.FooterButtonWrapper,Object.assign({footerDirection:t.footerDirection},{children:[t.saveButtonProps&&e.jsx(r.Button,Object.assign({},t.saveButtonProps)),t.cancelButtonProps&&e.jsx(r.Button,Object.assign({},t.cancelButtonProps))]})),t.footerCustomComponent?t.footerCustomComponent:e.jsx(e.Fragment,{})]}))]}))})),null!==(i=t.element)&&void 0!==i?i:document.body)};

package/dist/cjs/components/side-modal/SideModal.style.d.ts

@@ -0,0 +1,20 @@
+export declare const SideModalStyle: import("styled-components").StyledComponent<"div", any, {
+    zIndex?: number | undefined;
+}, never>;
+export declare const SideModalContainer: import("styled-components").StyledComponent<"div", any, {
+    width?: string | undefined;
+}, never>;
+export declare const SideModalHeader: import("styled-components").StyledComponent<"div", any, {
+    headerStyle: React.CSSProperties;
+}, never>;
+export declare const SideModalBody: import("styled-components").StyledComponent<"div", any, {
+    hideFooter?: boolean | undefined;
+    bodyStyle: React.CSSProperties;
+}, never>;
+export declare const SideModalFooter: import("styled-components").StyledComponent<"div", any, {
+    footerDirection?: "row" | "row-reverse" | undefined;
+    footerStyle: React.CSSProperties;
+}, never>;
+export declare const FooterButtonWrapper: import("styled-components").StyledComponent<"div", any, {
+    footerDirection?: "row" | "row-reverse" | undefined;
+}, never>;

package/dist/cjs/components/side-modal/SideModal.style.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),o=require("../../constants/zindex.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=i(e);const r=d.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),o=require("../../constants/zindex.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e);const d=r.default.div`
 	position: fixed;
 	top: 0;
 	left: 0;
@@ -9,14 +9,14 @@
 	display: flex;
 	align-items: center;
 	justify-content: flex-end;
-`,n=d.default.div`
+`,n=r.default.div`
 	height: 100%;
 	width: ${e=>e.width||"566px"};
 	background: ${t.COLORS.surface.standard};
 	position: relative;
 	display: flex;
 	flex-direction: column;
-`,a=d.default.div`
+`,a=r.default.div`
 	width: 100%;
 	height: 60px;
 	position: sticky;
@@ -33,17 +33,17 @@
 		background: ${t.COLORS.background.base};
 		border-radius: 4px;
 	}
-	${({headerStyle:t})=>e.css`
-		${Object.keys(t).map((e=>`${e}: ${t[e]};`)).join("\n")}
-	`}
-`,s=d.default.div`
+	${t=>{let{headerStyle:o}=t;return e.css`
+		${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
+	`}}
+`,s=r.default.div`
 	overflow-y: auto;
 	padding: 24px;
 	height: ${e=>e.hideFooter?"calc(100% - 60px)":"calc(100% - 120px)"};
-	${({bodyStyle:t})=>e.css`
-		${Object.keys(t).map((e=>`${e}: ${t[e]};`)).join("\n")}
-	`}
-`,p=d.default.div`
+	${t=>{let{bodyStyle:o}=t;return e.css`
+		${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
+	`}}
+`,p=r.default.div`
 	height: 60px;
 	width: 100%;
 	position: sticky;
@@ -55,11 +55,11 @@
 	background: ${t.COLORS.surface.standard};
 	border-top: 1px solid ${t.COLORS.stroke.primary};
 	padding: 0px 24px;
-	${({footerStyle:t})=>e.css`
-		${Object.keys(t).map((e=>`${e}: ${t[e]};`)).join("\n")}
-	`}
-`,l=d.default.div`
+	${t=>{let{footerStyle:o}=t;return e.css`
+		${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
+	`}}
+`,l=r.default.div`
 	display: flex;
 	flex-direction: ${e=>e.footerDirection||"row"};
 	gap: 8px;
-`;exports.FooterButtonWrapper=l,exports.SideModalBody=s,exports.SideModalContainer=n,exports.SideModalFooter=p,exports.SideModalHeader=a,exports.SideModalStyle=r;
+`;exports.FooterButtonWrapper=l,exports.SideModalBody=s,exports.SideModalContainer=n,exports.SideModalFooter=p,exports.SideModalHeader=a,exports.SideModalStyle=d;

package/dist/cjs/components/side-modal/index.d.ts

@@ -0,0 +1 @@
+export * from './SideModal';

package/dist/cjs/components/slider/index.d.ts

@@ -0,0 +1 @@
+export * from './slider';

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

@@ -1,14 +1,10 @@
-import React__default from 'react';
-
-interface SliderBikProps {
-    min?: number;
-    max?: number;
-    defaultValue?: number;
-    onChange: (event: Event, value: number) => void;
-    step?: number;
-    disabled?: boolean;
-}
-declare const BikSlider: React__default.FC<SliderBikProps>;
-
-export { BikSlider };
-export type { SliderBikProps };
+import React from 'react';
+export interface SliderBikProps {
+    min?: number;
+    max?: number;
+    defaultValue?: number;
+    onChange: (event: Event, value: number) => void;
+    step?: number;
+    disabled?: boolean;
+}
+export declare const BikSlider: React.FC<SliderBikProps>;

package/dist/cjs/components/slider/slider.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../constants/Theme.js");exports.BikSlider=({min:r=0,max:n=100,defaultValue:o,onChange:s,step:i=1,disabled:l=!1})=>{const u=void 0!==o?o:r,[d,c]=t.useState(u),[b,h]=t.useState(!1),[p,x]=t.useState(!1),[m,f]=t.useState(!1),g=t.useRef(null),v=t.useRef(null),w=(e=>({container:{position:"relative",marginTop:"30px",height:"8px",width:"100%",cursor:e?"not-allowed":"pointer",opacity:e?.5:1},track:{position:"absolute",top:0,left:0,right:0,height:"8px",backgroundColor:"#E0E0E0",borderRadius:"4px"},filledTrack:{position:"absolute",top:0,left:0,height:"8px",backgroundColor:a.COLORS.background.brand,borderRadius:"4px",transition:"width 0.1s ease"},thumb:{position:"absolute",top:"50%",width:"24px",height:"24px",backgroundColor:a.COLORS.background.brand,border:`2px solid ${a.COLORS.background.brand}`,borderRadius:"50%",transform:"translate(-50%, -50%)",cursor:e?"not-allowed":"grab",transition:"box-shadow 0.2s ease",outline:"none",zIndex:1},thumbDisabled:{cursor:"not-allowed"},valueLabel:{position:"absolute",bottom:"100%",left:"50%",marginBottom:"16px",width:"32px",height:"32px",backgroundColor:a.COLORS.background.brand,borderRadius:"50% 50% 50% 0",transform:"translate(0, 0) rotate(-45deg) scale(0)",transformOrigin:"bottom left",transition:"transform 0.2s ease",pointerEvents:"none",display:"flex",alignItems:"center",justifyContent:"center"},valueLabelVisible:{transform:"translate(0, 0) rotate(-45deg) scale(1)"},valueLabelText:{transform:"rotate(45deg)",color:"white",fontSize:"12px",lineHeight:1.2,fontWeight:500}}))(l);t.useEffect((()=>{c(void 0!==o?o:r)}),[o,r]);const k=t.useCallback((e=>{if(!g.current)return r;const t=g.current.getBoundingClientRect(),a=Math.max(0,Math.min(1,(e-t.left)/t.width)),o=r+a*(n-r),s=Math.round(o/i)*i;return Math.max(r,Math.min(n,s))}),[r,n,i]),C=t.useCallback((e=>{if(l)return;e.preventDefault(),h(!0),f(!0);const t=k(e.clientX);c(t);const a=new Event("change",{bubbles:!0});s(a,t)}),[l,k,s]),L=t.useCallback((e=>{if(!b||l)return;const t=k(e.clientX);c(t);const a=new Event("change",{bubbles:!0});s(a,t)}),[b,l,k,s]),E=t.useCallback((()=>{h(!1),f(!1)}),[]),M=t.useCallback((e=>{if(l)return;let t=d;switch(e.key){case"ArrowLeft":case"ArrowDown":t=Math.max(r,d-i);break;case"ArrowRight":case"ArrowUp":t=Math.min(n,d+i);break;case"Home":t=r;break;case"End":t=n;break;default:return}e.preventDefault(),c(t);const a=new Event("change",{bubbles:!0});s(a,t)}),[l,d,r,n,i,s]);t.useEffect((()=>{if(b)return document.addEventListener("mousemove",L),document.addEventListener("mouseup",E),()=>{document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",E)}}),[b,L,E]);const y=(d-r)/(n-r)*100,R=isNaN(y)?0:Math.max(0,Math.min(100,y));return e.jsxs("div",{ref:g,style:w.container,onMouseDown:C,role:"slider","aria-label":"bik slider","aria-valuemin":r,"aria-valuemax":n,"aria-valuenow":d,tabIndex:l?-1:0,onKeyDown:M,children:[e.jsx("div",{style:w.track}),e.jsx("div",{style:{...w.filledTrack,width:`${R}%`}}),e.jsx("div",{ref:v,style:(()=>{const e={...w.thumb};return l?{...e,...w.thumbDisabled}:(b?(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.5)",e.cursor="grabbing"):p&&(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.08)"),e.left=`${R}%`,e)})(),onMouseEnter:()=>!l&&x(!0),onMouseLeave:()=>!l&&x(!1),onFocus:()=>!l&&f(!0),onBlur:()=>!l&&f(!1),children:e.jsx("div",{style:(()=>{const e={...w.valueLabel};return m||p?{...e,...w.valueLabelVisible}:e})(),children:e.jsx("span",{style:w.valueLabelText,children:d})})})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../constants/Theme.js");exports.BikSlider=n=>{let{min:r=0,max:s=100,defaultValue:o,onChange:i,step:l=1,disabled:u=!1}=n;const c=void 0!==o?o:r,[b,d]=t.useState(c),[g,h]=t.useState(!1),[p,x]=t.useState(!1),[m,f]=t.useState(!1),v=t.useRef(null),w=t.useRef(null),k=(e=>({container:{position:"relative",marginTop:"30px",height:"8px",width:"100%",cursor:e?"not-allowed":"pointer",opacity:e?.5:1},track:{position:"absolute",top:0,left:0,right:0,height:"8px",backgroundColor:"#E0E0E0",borderRadius:"4px"},filledTrack:{position:"absolute",top:0,left:0,height:"8px",backgroundColor:a.COLORS.background.brand,borderRadius:"4px",transition:"width 0.1s ease"},thumb:{position:"absolute",top:"50%",width:"24px",height:"24px",backgroundColor:a.COLORS.background.brand,border:`2px solid ${a.COLORS.background.brand}`,borderRadius:"50%",transform:"translate(-50%, -50%)",cursor:e?"not-allowed":"grab",transition:"box-shadow 0.2s ease",outline:"none",zIndex:1},thumbDisabled:{cursor:"not-allowed"},valueLabel:{position:"absolute",bottom:"100%",left:"50%",marginBottom:"16px",width:"32px",height:"32px",backgroundColor:a.COLORS.background.brand,borderRadius:"50% 50% 50% 0",transform:"translate(0, 0) rotate(-45deg) scale(0)",transformOrigin:"bottom left",transition:"transform 0.2s ease",pointerEvents:"none",display:"flex",alignItems:"center",justifyContent:"center"},valueLabelVisible:{transform:"translate(0, 0) rotate(-45deg) scale(1)"},valueLabelText:{transform:"rotate(45deg)",color:"white",fontSize:"12px",lineHeight:1.2,fontWeight:500}}))(u);t.useEffect((()=>{d(void 0!==o?o:r)}),[o,r]);const j=t.useCallback((e=>{if(!v.current)return r;const t=v.current.getBoundingClientRect(),a=Math.max(0,Math.min(1,(e-t.left)/t.width)),n=r+a*(s-r),o=Math.round(n/l)*l;return Math.max(r,Math.min(s,o))}),[r,s,l]),O=t.useCallback((e=>{if(u)return;e.preventDefault(),h(!0),f(!0);const t=j(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,j,i]),C=t.useCallback((e=>{if(!g||u)return;const t=j(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[g,u,j,i]),L=t.useCallback((()=>{h(!1),f(!1)}),[]),E=t.useCallback((e=>{if(u)return;let t=b;switch(e.key){case"ArrowLeft":case"ArrowDown":t=Math.max(r,b-l);break;case"ArrowRight":case"ArrowUp":t=Math.min(s,b+l);break;case"Home":t=r;break;case"End":t=s;break;default:return}e.preventDefault(),d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,b,r,s,l,i]);t.useEffect((()=>{if(g)return document.addEventListener("mousemove",C),document.addEventListener("mouseup",L),()=>{document.removeEventListener("mousemove",C),document.removeEventListener("mouseup",L)}}),[g,C,L]);const M=(b-r)/(s-r)*100,y=isNaN(M)?0:Math.max(0,Math.min(100,M));return e.jsxs("div",Object.assign({ref:v,style:k.container,onMouseDown:O,role:"slider","aria-label":"bik slider","aria-valuemin":r,"aria-valuemax":s,"aria-valuenow":b,tabIndex:u?-1:0,onKeyDown:E},{children:[e.jsx("div",{style:k.track}),e.jsx("div",{style:Object.assign(Object.assign({},k.filledTrack),{width:`${y}%`})}),e.jsx("div",Object.assign({ref:w,style:(()=>{const e=Object.assign({},k.thumb);return u?Object.assign(Object.assign({},e),k.thumbDisabled):(g?(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.5)",e.cursor="grabbing"):p&&(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.08)"),e.left=`${y}%`,e)})(),onMouseEnter:()=>!u&&x(!0),onMouseLeave:()=>!u&&x(!1),onFocus:()=>!u&&f(!0),onBlur:()=>!u&&f(!1)},{children:e.jsx("div",Object.assign({style:(()=>{const e=Object.assign({},k.valueLabel);return m||p?Object.assign(Object.assign({},e),k.valueLabelVisible):e})()},{children:e.jsx("span",Object.assign({style:k.valueLabelText},{children:b}))}))}))]}))};

package/dist/cjs/components/spinner/Spinner.d.ts

@@ -1,16 +1,11 @@
-import * as styled_components from 'styled-components';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { SpinnerProps } from './model.js';
-
-declare const Spinner: {
-    ({ size, color, className }: SpinnerProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-};
-declare const PureSpinner: styled_components.StyledComponent<"div", any, {
-    width: string;
-    height: string;
-    color?: string | undefined;
-    backgroundColor?: string | undefined;
-}, never>;
-
-export { PureSpinner, Spinner };
+import { SpinnerProps } from './model';
+export declare const Spinner: {
+    ({ size, color, className }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const PureSpinner: import("styled-components").StyledComponent<"div", any, {
+    width: string;
+    height: string;
+    color?: string | undefined;
+    backgroundColor?: string | undefined;
+}, never>;

package/dist/cjs/components/spinner/Spinner.js

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react-lottie"),t=require("styled-components"),o=require("../../constants/Theme.js"),i=require("./lotties/black.json.js"),n=require("./lotties/brand.json.js"),s=require("./lotties/red.json.js"),a=require("./lotties/white.json.js"),d=require("./themes.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(r),u=l(t);const p={[o.COLORS.stroke.brand]:n,[o.COLORS.content.primary]:i,[o.COLORS.content.primaryInverse]:a,[o.COLORS.content.negative]:s},j=({size:r,color:t,className:i})=>{const n={loop:!0,autoplay:!0,animationData:p[t??o.COLORS.stroke.brand],rendererSettings:{preserveAspectRatio:"xMidYMid slice"}};return e.jsx("div",{className:`spinner-container ${i}`,children:e.jsx(c.default,{options:n,width:d.SizeMap[r],isStopped:!1,isPaused:!1})})};j.displayName="Spinner";const m=u.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react-lottie"),t=require("styled-components"),n=require("../../constants/Theme.js"),i=require("./lotties/black.json.js"),o=require("./lotties/brand.json.js"),s=require("./lotties/red.json.js"),a=require("./lotties/white.json.js"),l=require("./themes.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=d(r),c=d(t);const p={[n.COLORS.stroke.brand]:o,[n.COLORS.content.primary]:i,[n.COLORS.content.primaryInverse]:a,[n.COLORS.content.negative]:s},j=r=>{let{size:t,color:i,className:o}=r;const s={loop:!0,autoplay:!0,animationData:p[null!=i?i:n.COLORS.stroke.brand],rendererSettings:{preserveAspectRatio:"xMidYMid slice"}};return e.jsx("div",Object.assign({className:`spinner-container ${o}`},{children:e.jsx(u.default,{options:s,width:l.SizeMap[t],isStopped:!1,isPaused:!1})}))};j.displayName="Spinner";const m=c.default.div`
 	width: ${e=>e.width};
 	height: ${e=>e.height};
-	border: 5px solid ${e=>e.backgroundColor??"transparent"};
-	border-bottom-color: ${e=>e.color??o.COLORS.stroke.brand};
+	border: 5px solid ${e=>{var r;return null!==(r=e.backgroundColor)&&void 0!==r?r:"transparent"}};
+	border-bottom-color: ${e=>{var r;return null!==(r=e.color)&&void 0!==r?r:n.COLORS.stroke.brand}};
 	border-radius: 50%;
 	display: inline-block;
 	animation: rotation 1s linear infinite;

package/dist/cjs/components/spinner/index.d.ts

@@ -0,0 +1 @@
+export * from './Spinner';

package/dist/cjs/components/spinner/model.d.ts

@@ -1,14 +1,13 @@
-interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Size of the spinner
-     *
-     */
-    size: 'small' | 'large';
-    /**
-     * Color of the spinner.
-     * Defaults to COLORS.content.brand
-     */
-    color?: string;
-}
-
-export type { SpinnerProps };
+/// <reference types="react" />
+export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Size of the spinner
+     *
+     */
+    size: 'small' | 'large';
+    /**
+     * Color of the spinner.
+     * Defaults to COLORS.content.brand
+     */
+    color?: string;
+}

package/dist/cjs/components/spinner/themes.d.ts

@@ -0,0 +1,3 @@
+export declare const SizeMap: {
+    [key in 'small' | 'large']: number;
+};

package/dist/cjs/components/star-rating/Star.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export declare const Star: React.FC<{
+    filled?: boolean;
+    size?: number;
+    emptyColor?: string;
+    filledColor?: string;
+    onClick?: (action: 'de-select' | 'select') => void;
+    onHover?: (hovered: boolean) => void;
+    /** this means this star is hovered-active cause there is a star hovered after this  */
+    asHovered?: boolean;
+    mode?: 'VIEW' | 'EDIT';
+    version?: 'v1' | 'v2';
+}>;

package/dist/cjs/components/star-rating/Star.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/starEmpty.svg.js"),o=require("../../assets/icons/starFilled.svg.js"),n=require("../../assets/icons/starFilledV2.svg.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=i(t);exports.Star=({size:i,filled:a,emptyColor:l,filledColor:c,onClick:d,asHovered:f,onHover:v,mode:E,version:g="v1"})=>{const[h,j]=t.useState(!1);t.useEffect((()=>{v?.(h)}),[h]),t.useEffect((()=>{f||j(!1)}),[f]);const C=u.default.useMemo((()=>(e=>"v1"===e?o.default:n.default)(g)),[g]);return f?e.jsx(C,{onClick:()=>{d?.("select")},onMouseEnter:()=>j(!0),onMouseLeave:()=>j(!1),style:{cursor:"pointer"},width:i,height:i,color:c??r.COLORS.background.warning.vibrant}):h?e.jsx(C,{onMouseLeave:()=>j(!1),onMouseEnter:()=>j(!0),style:{cursor:"pointer"},onClick:()=>{d?.("select")},width:i,height:i,color:c??r.COLORS.background.warning.vibrant}):a?e.jsx(C,{onMouseEnter:()=>"VIEW"!==E&&j(!0),onMouseLeave:()=>"VIEW"!==E&&j(!1),style:{cursor:"VIEW"!==E?"pointer":"default"},onClick:()=>{"VIEW"!==E&&d?.("de-select")},width:i,height:i,color:c??r.COLORS.background.warning.vibrant}):e.jsx(s.default,{onMouseEnter:()=>"VIEW"!==E&&j(!0),onMouseLeave:()=>"VIEW"!==E&&j(!1),style:{cursor:"VIEW"!==E?"pointer":"default"},onClick:()=>{"VIEW"!==E&&d?.("select")},width:i,height:i,color:l??r.COLORS.surface.standard})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/starEmpty.svg.js"),o=require("../../assets/icons/starFilled.svg.js"),n=require("../../assets/icons/starFilledV2.svg.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=l(t);exports.Star=l=>{let{size:i,filled:a,emptyColor:c,filledColor:d,onClick:f,asHovered:v,onHover:E,mode:g,version:h="v1"}=l;const[j,C]=t.useState(!1);t.useEffect((()=>{null==E||E(j)}),[j]),t.useEffect((()=>{v||C(!1)}),[v]);const p=u.default.useMemo((()=>(e=>"v1"===e?o.default:n.default)(h)),[h]);return v?e.jsx(p,{onClick:()=>{null==f||f("select")},onMouseEnter:()=>C(!0),onMouseLeave:()=>C(!1),style:{cursor:"pointer"},width:i,height:i,color:null!=d?d:r.COLORS.background.warning.vibrant}):j?e.jsx(p,{onMouseLeave:()=>C(!1),onMouseEnter:()=>C(!0),style:{cursor:"pointer"},onClick:()=>{null==f||f("select")},width:i,height:i,color:null!=d?d:r.COLORS.background.warning.vibrant}):a?e.jsx(p,{onMouseEnter:()=>"VIEW"!==g&&C(!0),onMouseLeave:()=>"VIEW"!==g&&C(!1),style:{cursor:"VIEW"!==g?"pointer":"default"},onClick:()=>{"VIEW"!==g&&(null==f||f("de-select"))},width:i,height:i,color:null!=d?d:r.COLORS.background.warning.vibrant}):e.jsx(s.default,{onMouseEnter:()=>"VIEW"!==g&&C(!0),onMouseLeave:()=>"VIEW"!==g&&C(!1),style:{cursor:"VIEW"!==g?"pointer":"default"},onClick:()=>{"VIEW"!==g&&(null==f||f("select"))},width:i,height:i,color:null!=c?c:r.COLORS.surface.standard})};

package/dist/cjs/components/star-rating/StarRating.d.ts

@@ -1,14 +1,11 @@
-import React__default from 'react';
-
-declare const StarRating: React__default.FC<{
-    emptyColor?: string;
-    filledColor?: string;
-    onChange: (stars: number) => void;
-    value?: number;
-    maxValue?: number;
-    starSize?: number;
-    mode?: 'VIEW' | 'EDIT';
-    version?: 'v1' | 'v2';
-}>;
-
-export { StarRating };
+import React from 'react';
+export declare const StarRating: React.FC<{
+    emptyColor?: string;
+    filledColor?: string;
+    onChange: (stars: number) => void;
+    value?: number;
+    maxValue?: number;
+    starSize?: number;
+    mode?: 'VIEW' | 'EDIT';
+    version?: 'v1' | 'v2';
+}>;

package/dist/cjs/components/star-rating/StarRating.js

@@ -1,7 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@emotion/styled"),r=require("react"),o=require("./Star.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=i(t).default.div`
-	display: flex;
-	flex-direction: row;
-	gap: 12px;
-	justify-content: start;
-	align-items: center;
-`;exports.StarRating=({emptyColor:t,filledColor:i,onChange:s,value:a,maxValue:n,starSize:u,mode:d,version:f="v1"})=>{const[c,m]=r.useState(a??0),[p,v]=r.useState(!1),[x,y]=r.useState(0),j=r.useMemo((()=>Array(n??5).fill(null).map(((e,t)=>t+1))),[n]);return r.useEffect((()=>{p&&s(c)}),[c]),r.useEffect((()=>{v(!0)}),[]),e.jsx(l,{children:j.map((r=>e.jsx(o.Star,{asHovered:!!x&&r<=x,size:u??24,filled:x?void 0:r<=c,emptyColor:t,filledColor:i,onClick:e=>{m("de-select"===e?r<c?r:r-1:r)},onHover:e=>{y(e?r:0)},mode:d,version:f},r)))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var I=require("@emotion/styled/base"),g=require("react/jsx-runtime"),C=require("react"),A=require("./Star.js");function e(I){return I&&"object"==typeof I&&"default"in I?I:{default:I}}const c=e(I).default("div","production"===process.env.NODE_ENV?{target:"e1yh3w250"}:{target:"e1yh3w250",label:"Container"})("production"===process.env.NODE_ENV?{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center"}:{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlN0YXJSYXRpbmcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk2QiIsImZpbGUiOiJTdGFyUmF0aW5nLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuaW1wb3J0IHsgU3RhciB9IGZyb20gJy4vU3Rhcic7XHJcbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogcm93O1xuXHRnYXA6IDEycHg7XG5cdGp1c3RpZnktY29udGVudDogc3RhcnQ7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xyXG5leHBvcnQgY29uc3QgU3RhclJhdGluZyA9ICh7IGVtcHR5Q29sb3IsIGZpbGxlZENvbG9yLCBvbkNoYW5nZSwgdmFsdWUsIG1heFZhbHVlLCBzdGFyU2l6ZSwgbW9kZSwgdmVyc2lvbiA9ICd2MScsIH0pID0+IHtcclxuICAgIGNvbnN0IFtzdGFycywgc2V0U3RhcnNdID0gdXNlU3RhdGUodmFsdWUgIT09IG51bGwgJiYgdmFsdWUgIT09IHZvaWQgMCA/IHZhbHVlIDogMCk7XHJcbiAgICBjb25zdCBbbW91bnRlZCwgc2V0TW91bnRlZEZsYWddID0gdXNlU3RhdGUoZmFsc2UpO1xyXG4gICAgY29uc3QgW2hvdmVyZWRTdGFyLCBzZXRIb3ZlcmVkU3Rhcl0gPSB1c2VTdGF0ZSgwKTtcclxuICAgIGNvbnN0IGFyciA9IHVzZU1lbW8oKCkgPT4ge1xyXG4gICAgICAgIGNvbnN0IGxpbWl0ID0gbWF4VmFsdWUgIT09IG51bGwgJiYgbWF4VmFsdWUgIT09IHZvaWQgMCA/IG1heFZhbHVlIDogNTtcclxuICAgICAgICByZXR1cm4gQXJyYXkobGltaXQpXHJcbiAgICAgICAgICAgIC5maWxsKG51bGwpXHJcbiAgICAgICAgICAgIC5tYXAoKF8sIGlkeCkgPT4gaWR4ICsgMSk7XHJcbiAgICB9LCBbbWF4VmFsdWVdKTtcclxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XHJcbiAgICAgICAgaWYgKG1vdW50ZWQpIHtcclxuICAgICAgICAgICAgb25DaGFuZ2Uoc3RhcnMpO1xyXG4gICAgICAgIH1cclxuICAgIH0sIFtzdGFyc10pO1xyXG4gICAgdXNlRWZmZWN0KCgpID0+IHtcclxuICAgICAgICBzZXRNb3VudGVkRmxhZyh0cnVlKTtcclxuICAgIH0sIFtdKTtcclxuICAgIHJldHVybiAoX2pzeChDb250YWluZXIsIHsgY2hpbGRyZW46IGFyci5tYXAoKGlkeCkgPT4gKF9qc3goU3RhciwgeyBhc0hvdmVyZWQ6IGhvdmVyZWRTdGFyID8gaWR4IDw9IGhvdmVyZWRTdGFyIDogZmFsc2UsIHNpemU6IHN0YXJTaXplICE9PSBudWxsICYmIHN0YXJTaXplICE9PSB2b2lkIDAgPyBzdGFyU2l6ZSA6IDI0LCBmaWxsZWQ6IGhvdmVyZWRTdGFyID8gdW5kZWZpbmVkIDogaWR4IDw9IHN0YXJzLCBlbXB0eUNvbG9yOiBlbXB0eUNvbG9yLCBmaWxsZWRDb2xvcjogZmlsbGVkQ29sb3IsIG9uQ2xpY2s6IChhY3Rpb24pID0+IHtcclxuICAgICAgICAgICAgICAgIGlmIChhY3Rpb24gPT09ICdkZS1zZWxlY3QnKSB7XHJcbiAgICAgICAgICAgICAgICAgICAgaWYgKGlkeCA8IHN0YXJzKSB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHNldFN0YXJzKGlkeCk7XHJcbiAgICAgICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICAgICAgICAgIGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBzZXRTdGFycyhpZHggLSAxKTtcclxuICAgICAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgICAgICBlbHNlIHtcclxuICAgICAgICAgICAgICAgICAgICBzZXRTdGFycyhpZHgpO1xyXG4gICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICB9LCBvbkhvdmVyOiAoaG92ZXJlZCkgPT4ge1xyXG4gICAgICAgICAgICAgICAgaWYgKGhvdmVyZWQpXHJcbiAgICAgICAgICAgICAgICAgICAgc2V0SG92ZXJlZFN0YXIoaWR4KTtcclxuICAgICAgICAgICAgICAgIGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgICAgIHNldEhvdmVyZWRTdGFyKDApO1xyXG4gICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICB9LCBtb2RlOiBtb2RlLCB2ZXJzaW9uOiB2ZXJzaW9uIH0sIGlkeCkpKSB9KSk7XHJcbn07XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVN0YXJSYXRpbmcuanMubWFwIl19 */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}});exports.StarRating=I=>{let{emptyColor:e,filledColor:l,onChange:t,value:b,maxValue:d,starSize:s,mode:G,version:a="v1"}=I;const[i,o]=C.useState(null!=b?b:0),[n,u]=C.useState(!1),[y,X]=C.useState(0),Z=C.useMemo((()=>Array(null!=d?d:5).fill(null).map(((I,g)=>g+1))),[d]);return C.useEffect((()=>{n&&t(i)}),[i]),C.useEffect((()=>{u(!0)}),[]),g.jsx(c,{children:Z.map((I=>g.jsx(A.Star,{asHovered:!!y&&I<=y,size:null!=s?s:24,filled:y?void 0:I<=i,emptyColor:e,filledColor:l,onClick:g=>{o("de-select"===g?I<i?I:I-1:I)},onHover:g=>{X(g?I:0)},mode:G,version:a},I)))})};

package/dist/cjs/components/star-rating/index.d.ts

@@ -0,0 +1 @@
+export * from './StarRating';

package/dist/cjs/components/states/ShopifyScopeWrapper.d.ts

@@ -1,17 +1,14 @@
-import React__default from 'react';
-
-interface ShopifyScopeWrapper {
-    permissions: string[];
-    permissionRequestTitle: string;
-    permissionRequestSubTitle: string;
-    cacheInLocal?: boolean;
-    permissionEvaluationFunction: (permissions: string[]) => Promise<{
-        hasPermission: boolean;
-        urlForPermissions?: string;
-    }>;
-    children: React__default.ReactNode;
-    onPermissionClickCallback?: () => void;
-}
-declare const ShopifyScopeWrapper: React__default.FC<ShopifyScopeWrapper>;
-
-export { ShopifyScopeWrapper };
+import React from 'react';
+export interface ShopifyScopeWrapper {
+    permissions: string[];
+    permissionRequestTitle: string;
+    permissionRequestSubTitle: string;
+    cacheInLocal?: boolean;
+    permissionEvaluationFunction: (permissions: string[]) => Promise<{
+        hasPermission: boolean;
+        urlForPermissions?: string;
+    }>;
+    children: React.ReactNode;
+    onPermissionClickCallback?: () => void;
+}
+export declare const ShopifyScopeWrapper: React.FC<ShopifyScopeWrapper>;

package/dist/cjs/components/states/ShopifyScopeWrapper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("./StateComponent.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(t);exports.ShopifyScopeWrapper=i=>{const[a,o]=n.default.useState(!1),[r,c]=n.default.useState(!1),[l,u]=n.default.useState(""),p=t.useCallback((()=>i.permissions.join("-")+"-hasPermission"),[i.permissions]),h=t.useCallback((()=>{const e=p(),t=localStorage.getItem(e);return!!t&&"true"===t}),[p]),m=t.useCallback((e=>{const t=p();localStorage.setItem(t,e.toString())}),[p]),d=t.useCallback((()=>{l?window.open(l,"_blank"):i.onPermissionClickCallback&&i.onPermissionClickCallback()}),[i,l]);return t.useEffect((()=>{(async()=>{if(i.cacheInLocal){if(h())return void o(!0)}const{hasPermission:e,urlForPermissions:t}=await i.permissionEvaluationFunction(i.permissions);o(e),u(t),c(!0),i.cacheInLocal&&e&&m(e)})().then().catch()}),[h,i,m]),r?a?e.jsx(e.Fragment,{children:i.children}):e.jsx(s.StateComponent,{states:s.StateInterface.WARNING,heading:i.permissionRequestTitle,subline:i.permissionRequestSubTitle,width:400,isButtonEnabled:!0,buttonText:"Grant permissions",onButtonClick:d}):e.jsx(s.StateComponent,{states:s.StateInterface.LOADING,heading:"Checking permissions",subline:"Checking if we have the right shopify scopes approved to access this page.",width:400,isButtonEnabled:!1})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),s=require("react"),i=require("./StateComponent.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=n(s);exports.ShopifyScopeWrapper=n=>{const[o,r]=a.default.useState(!1),[c,l]=a.default.useState(!1),[u,p]=a.default.useState(""),d=s.useCallback((()=>n.permissions.join("-")+"-hasPermission"),[n.permissions]),h=s.useCallback((()=>{const e=d(),t=localStorage.getItem(e);return!!t&&"true"===t}),[d]),m=s.useCallback((e=>{const t=d();localStorage.setItem(t,e.toString())}),[d]),f=s.useCallback((()=>{u?window.open(u,"_blank"):n.onPermissionClickCallback&&n.onPermissionClickCallback()}),[n,u]);return s.useEffect((()=>{e.__awaiter(void 0,void 0,void 0,(function*(){if(n.cacheInLocal&&h())return void r(!0);const{hasPermission:e,urlForPermissions:t}=yield n.permissionEvaluationFunction(n.permissions);r(e),p(t),l(!0),n.cacheInLocal&&e&&m(e)})).then().catch()}),[h,n,m]),c?o?t.jsx(t.Fragment,{children:n.children}):t.jsx(i.StateComponent,{states:i.StateInterface.WARNING,heading:n.permissionRequestTitle,subline:n.permissionRequestSubTitle,width:400,isButtonEnabled:!0,buttonText:"Grant permissions",onButtonClick:f}):t.jsx(i.StateComponent,{states:i.StateInterface.LOADING,heading:"Checking permissions",subline:"Checking if we have the right shopify scopes approved to access this page.",width:400,isButtonEnabled:!1})};

package/dist/cjs/components/states/StateComponent.d.ts

@@ -1,45 +1,41 @@
-import { ReactJSXElement } from '@emotion/react/types/jsx-namespace';
-import React__default from 'react';
-import { Type } from '../button/model.js';
-
-declare enum StateInterface {
-    SUCCESS = "success",
-    ERROR = "error",
-    WARNING = "warning",
-    LOADING = "loading",
-    RETRY = "retry",
-    INFO = "info"
-}
-declare enum ButtonActions {
-    CANCEL = "cancel",
-    OTHER = "other"
-}
-declare enum ButtonTypes {
-    SINGLE = "SINGLE",
-    DOUBLE = "DOUBLE"
-}
-type StateComponentProps = {
-    headerImage?: string;
-    states: StateInterface;
-    heading: string;
-    subline: string;
-    icon?: JSX.Element;
-    isButtonEnabled: boolean;
-    type?: ButtonTypes;
-    buttonText?: string;
-    buttonType?: Type;
-    buttonIcon?: ReactJSXElement;
-    onButtonClick?: (buttonClicked: ButtonActions) => void;
-    leadingIcon?: React__default.FunctionComponent<React__default.SVGAttributes<SVGElement>>;
-    width: number;
-    size?: 'DEFAULT' | 'SMALL';
-    iconHeight?: number;
-    iconWidth?: number;
-    closeButtonType?: Type;
-    secondaryButtonText?: string;
-    'data-test'?: string;
-};
-declare const StateComponent: React__default.FC<React__default.PropsWithChildren<StateComponentProps>>;
-
-export { ButtonActions, ButtonTypes, StateComponent, StateInterface };
-export type { StateComponentProps };
+import { ReactJSXElement } from '@emotion/react/types/jsx-namespace';
+import React from 'react';
+import { Type } from "../button/model";
+export declare enum StateInterface {
+    SUCCESS = "success",
+    ERROR = "error",
+    WARNING = "warning",
+    LOADING = "loading",
+    RETRY = "retry",
+    INFO = "info"
+}
+export declare enum ButtonActions {
+    CANCEL = "cancel",
+    OTHER = "other"
+}
+export declare enum ButtonTypes {
+    SINGLE = "SINGLE",
+    DOUBLE = "DOUBLE"
+}
+export type StateComponentProps = {
+    headerImage?: string;
+    states: StateInterface;
+    heading: string;
+    subline: string;
+    icon?: JSX.Element;
+    isButtonEnabled: boolean;
+    type?: ButtonTypes;
+    buttonText?: string;
+    buttonType?: Type;
+    buttonIcon?: ReactJSXElement;
+    onButtonClick?: (buttonClicked: ButtonActions) => void;
+    leadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    width: number;
+    size?: 'DEFAULT' | 'SMALL';
+    iconHeight?: number;
+    iconWidth?: number;
+    closeButtonType?: Type;
+    secondaryButtonText?: string;
+    'data-test'?: string;
+};
+export declare const StateComponent: React.FC<React.PropsWithChildren<StateComponentProps>>;

package/dist/cjs/components/states/StateComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/errorIcon.svg.js"),n=require("../../assets/icons/retryIcon.svg.js"),r=require("../../assets/icons/successIcon.svg.js"),i=require("../../assets/icons/warningIcon.svg.js"),o=require("../../assets/icons/state_icon.svg.js"),a=require("../button/Button.js"),c=require("../spinner/Spinner.js"),d=require("../TypographyStyle.js"),u=require("./StateComponent.styled.js"),l=(e=>(e.SUCCESS="success",e.ERROR="error",e.WARNING="warning",e.LOADING="loading",e.RETRY="retry",e.INFO="info",e))(l||{}),j=(e=>(e.CANCEL="cancel",e.OTHER="other",e))(j||{}),h=(e=>(e.SINGLE="SINGLE",e.DOUBLE="DOUBLE",e))(h||{});exports.ButtonActions=j,exports.ButtonTypes=h,exports.StateComponent=l=>{const j=()=>"success"==h?e.jsx(r.default,{}):"warning"==h?e.jsx(i.default,{}):"error"==h?e.jsx(s.default,{}):"loading"===h?e.jsx(c.Spinner,{size:"large"}):"retry"===h?e.jsx(n.default,{}):"info"==h?e.jsx(o.default,{}):void 0,{states:h,heading:x,subline:y,icon:g=j(),isButtonEnabled:S,type:p,buttonText:L,buttonType:m,onButtonClick:B,leadingIcon:C,width:T,headerImage:I,iconWidth:O,iconHeight:b,closeButtonType:q,secondaryButtonText:E,"data-test":R}=l;return e.jsxs(u.StateComponentContainer,{width:T,"data-test":R,children:[e.jsx(u.StateIcon,{iconWidth:O,iconHeight:b,children:I?e.jsx("img",{src:I,width:"100%",height:"auto",alt:""}):g}),e.jsxs(u.StateHeading,{size:l.size,children:["SMALL"===l.size&&e.jsx(d.TitleRegular,{children:x}),"SMALL"!==l.size&&e.jsx(d.TitleMedium,{children:x})]}),e.jsxs(u.StateSubline,{children:["SMALL"!==l.size&&e.jsx(d.BodyPrimary,{color:t.COLORS.content.secondary,children:y}),"SMALL"===l.size&&e.jsx(d.BodySecondary,{color:t.COLORS.content.secondary,children:y})]}),l.children??e.jsx(e.Fragment,{}),S&&e.jsx(e.Fragment,{children:e.jsxs(u.ButtonContainer,{size:l.size,children:["DOUBLE"==p&&e.jsx(a.Button,{"data-test":`${R}-cancel`,onClick:()=>B&&B("cancel"),buttonType:q||"secondary",buttonText:E||"Cancel",matchParentWidth:!0}),e.jsx(a.Button,{"data-test":`${R}-primary`,onClick:()=>B&&B("other"),buttonType:m??"primary",LeadingIcon:C,buttonText:L??"Retry",matchParentWidth:!0})]})})]})},exports.StateInterface=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,s,n=require("react/jsx-runtime"),r=require("../../constants/Theme.js"),o=require("../../assets/icons/errorIcon.svg.js"),i=require("../../assets/icons/retryIcon.svg.js"),a=require("../../assets/icons/successIcon.svg.js"),c=require("../../assets/icons/warningIcon.svg.js"),u=require("../../assets/icons/state_icon.svg.js"),d=require("../button/Button.js"),l=require("../spinner/Spinner.js"),x=require("../TypographyStyle.js"),p=require("./StateComponent.styled.js");exports.StateInterface=void 0,(e=exports.StateInterface||(exports.StateInterface={})).SUCCESS="success",e.ERROR="error",e.WARNING="warning",e.LOADING="loading",e.RETRY="retry",e.INFO="info",exports.ButtonActions=void 0,(t=exports.ButtonActions||(exports.ButtonActions={})).CANCEL="cancel",t.OTHER="other",exports.ButtonTypes=void 0,(s=exports.ButtonTypes||(exports.ButtonTypes={})).SINGLE="SINGLE",s.DOUBLE="DOUBLE";exports.StateComponent=e=>{var t;const s=()=>j==exports.StateInterface.SUCCESS?n.jsx(a.default,{}):j==exports.StateInterface.WARNING?n.jsx(c.default,{}):j==exports.StateInterface.ERROR?n.jsx(o.default,{}):j===exports.StateInterface.LOADING?n.jsx(l.Spinner,{size:"large"}):j===exports.StateInterface.RETRY?n.jsx(i.default,{}):j==exports.StateInterface.INFO?n.jsx(u.default,{}):void 0,{states:j,heading:S,subline:h,icon:g=s(),isButtonEnabled:y,type:I,buttonText:B,buttonType:O,onButtonClick:L,leadingIcon:T,width:C,headerImage:R,iconWidth:b,iconHeight:f,closeButtonType:E,secondaryButtonText:m,"data-test":A}=e;return n.jsxs(p.StateComponentContainer,Object.assign({width:C,"data-test":A},{children:[n.jsx(p.StateIcon,Object.assign({iconWidth:b,iconHeight:f},{children:R?n.jsx("img",{src:R,width:"100%",height:"auto",alt:""}):g})),n.jsxs(p.StateHeading,Object.assign({size:e.size},{children:["SMALL"===e.size&&n.jsx(x.TitleRegular,{children:S}),"SMALL"!==e.size&&n.jsx(x.TitleMedium,{children:S})]})),n.jsxs(p.StateSubline,{children:["SMALL"!==e.size&&n.jsx(x.BodyPrimary,Object.assign({color:r.COLORS.content.secondary},{children:h})),"SMALL"===e.size&&n.jsx(x.BodySecondary,Object.assign({color:r.COLORS.content.secondary},{children:h}))]}),null!==(t=e.children)&&void 0!==t?t:n.jsx(n.Fragment,{}),y&&n.jsx(n.Fragment,{children:n.jsxs(p.ButtonContainer,Object.assign({size:e.size},{children:[I==exports.ButtonTypes.DOUBLE&&n.jsx(d.Button,{"data-test":`${A}-cancel`,onClick:()=>L&&L(exports.ButtonActions.CANCEL),buttonType:E||"secondary",buttonText:m||"Cancel",matchParentWidth:!0}),n.jsx(d.Button,{"data-test":`${A}-primary`,onClick:()=>L&&L(exports.ButtonActions.OTHER),buttonType:null!=O?O:"primary",LeadingIcon:T,buttonText:null!=B?B:"Retry",matchParentWidth:!0})]}))})]}))};

package/dist/cjs/components/states/StateComponent.styled.d.ts

@@ -0,0 +1,14 @@
+export declare const StateComponentContainer: import("styled-components").StyledComponent<"div", any, {
+    width: number;
+}, never>;
+export declare const StateIcon: import("styled-components").StyledComponent<"div", any, {
+    iconWidth?: number | undefined;
+    iconHeight?: number | undefined;
+}, never>;
+export declare const StateHeading: import("styled-components").StyledComponent<"div", any, {
+    size?: "SMALL" | "DEFAULT" | undefined;
+}, never>;
+export declare const ButtonContainer: import("styled-components").StyledComponent<"div", any, {
+    size?: "SMALL" | "DEFAULT" | undefined;
+}, never>;
+export declare const StateSubline: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/states/index.d.ts

@@ -0,0 +1,2 @@
+export * from './StateComponent';
+export * from './ShopifyScopeWrapper';

package/dist/cjs/components/states-modal/DeleteConfirmationModal.d.ts

@@ -1,14 +1,10 @@
-import React__default from 'react';
-
-interface DeleteConfirmationModalProps {
-    header: string;
-    subHeader: string;
-    confirmationText: string;
-    onDeleteConfirmed: () => void;
-    onCancelClicked: () => void;
-    'data-test'?: string;
-}
-declare const DeleteConfirmationModal: React__default.FC<DeleteConfirmationModalProps>;
-
-export { DeleteConfirmationModal };
-export type { DeleteConfirmationModalProps };
+import React from 'react';
+export interface DeleteConfirmationModalProps {
+    header: string;
+    subHeader: string;
+    confirmationText: string;
+    onDeleteConfirmed: () => void;
+    onCancelClicked: () => void;
+    'data-test'?: string;
+}
+export declare const DeleteConfirmationModal: React.FC<DeleteConfirmationModalProps>;