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

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

@@ -0,0 +1,21 @@
+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

@@ -0,0 +1 @@
+"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

@@ -0,0 +1,65 @@
+"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;
+	z-index: ${e=>e.zIndex||o.ComponentZindex.SIDE_MODAL};
+	height: 100%;
+	width: 100%;
+	background-color: rgba(0, 0, 0, 0.4);
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+`,n=r.default.div`
+	height: 100%;
+	width: ${e=>e.width||"566px"};
+	background: ${t.COLORS.surface.standard};
+	position: relative;
+	display: flex;
+	flex-direction: column;
+`,a=r.default.div`
+	width: 100%;
+	height: 60px;
+	position: sticky;
+	top: 0;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: space-between;
+	background: ${t.COLORS.surface.standard};
+	padding: 0px 24px;
+	border-bottom: 1px solid ${t.COLORS.stroke.primary};
+	svg:hover {
+		cursor: pointer;
+		background: ${t.COLORS.background.base};
+		border-radius: 4px;
+	}
+	${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)"};
+	${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;
+	bottom: 0;
+	display: flex;
+	flex-direction: ${e=>e.footerDirection||"row"};
+	justify-content: space-between;
+	align-items: center;
+	background: ${t.COLORS.surface.standard};
+	border-top: 1px solid ${t.COLORS.stroke.primary};
+	padding: 0px 24px;
+	${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=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

@@ -0,0 +1,10 @@
+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

@@ -0,0 +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=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

@@ -0,0 +1,11 @@
+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

@@ -0,0 +1,18 @@
+"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=>{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;
+
+	@keyframes rotation {
+		0% {
+			transform: rotate(0deg);
+		}
+		100% {
+			transform: rotate(360deg);
+		}
+	}
+`;exports.PureSpinner=m,exports.Spinner=j;

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

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

package/dist/cjs/components/spinner/lotties/black.json.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a="loader for public",i={g:"LottieFiles AE 0.1.21"},t=[{ty:4,nm:"Shape Layer 1",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,hasMask:!1,td:1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[100,100,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[3.002,-217.775,0],ix:2},r:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[360],t:90}],ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"st",bm:0,hd:!1,mn:"ADBE Vector Graphic - Stroke",nm:"Stroke 1",lc:2,lj:1,ml:4,o:{a:0,k:100,ix:4},w:{a:0,k:28,ix:5},c:{a:0,k:[1,1,1],ix:3}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[10],t:0},{s:[70],t:44.25}],ix:2},o:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[144],t:90}],ix:3},s:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[0],t:44.25},{s:[60],t:90}],ix:1},m:1}],ind:1,parent:2},{ty:4,nm:"color",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,tt:1,hasMask:!1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[89.983,89.983,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[123,123,0],ix:2},r:{a:0,k:360,ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"gs",bm:0,hd:!1,mn:"ADBE Vector Graphic - G-Stroke",nm:"Gradient Stroke 1",e:{a:0,k:[122.126,120.78],ix:5},g:{p:3,k:{a:0,k:[0,.12941176470588237,.12941176470588237,.12941176470588237,.5,.12941176470588237,.12941176470588237,.12941176470588237,1,.12941176470588237,.12941176470588237,.12941176470588237],ix:8}},t:1,a:{a:0,k:0},h:{a:0,k:0},s:{a:0,k:[-118.969,-118.703],ix:4},lc:2,lj:1,ml:4,o:{a:0,k:100,ix:9},w:{a:0,k:32,ix:10}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:0,k:100,ix:2},o:{a:0,k:0,ix:3},s:{a:0,k:0,ix:1},m:1}],ind:2}],s="5.5.7",x=[],e={nm:a,ddd:0,h:246,w:246,meta:i,layers:t,v:s,fr:60,op:90,ip:0,assets:x};exports.assets=x,exports.ddd=0,exports.default=e,exports.fr=60,exports.h=246,exports.ip=0,exports.layers=t,exports.meta=i,exports.nm=a,exports.op=90,exports.v=s,exports.w=246;

package/dist/cjs/components/spinner/lotties/brand.json.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a="loader for public",i={g:"LottieFiles AE 0.1.21"},t=[{ty:4,nm:"Shape Layer 1",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,hasMask:!1,td:1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[100,100,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[3.002,-217.775,0],ix:2},r:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[360],t:90}],ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"st",bm:0,hd:!1,mn:"ADBE Vector Graphic - Stroke",nm:"Stroke 1",lc:2,lj:1,ml:4,o:{a:0,k:100,ix:4},w:{a:0,k:28,ix:5},c:{a:0,k:[1,1,1],ix:3}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[10],t:0},{s:[70],t:44.25}],ix:2},o:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[144],t:90}],ix:3},s:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[0],t:44.25},{s:[60],t:90}],ix:1},m:1}],ind:1,parent:2},{ty:4,nm:"color",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,tt:1,hasMask:!1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[89.983,89.983,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[123,123,0],ix:2},r:{a:0,k:360,ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"gs",bm:0,hd:!1,mn:"ADBE Vector Graphic - G-Stroke",nm:"Gradient Stroke 1",e:{a:0,k:[122.126,120.78],ix:5},g:{p:3,k:{a:0,k:[0,.45098039215686275,.11372549019607843,.8117647058823529,.5,.45098039215686275,.11372549019607843,.8117647058823529,1,.45098039215686275,.11372549019607843,.8117647058823529],ix:8}},t:1,a:{a:0,k:0},h:{a:0,k:0},s:{a:0,k:[-118.969,-118.703],ix:4},lc:2,lj:1,ml:4,o:{a:0,k:100,ix:9},w:{a:0,k:32,ix:10}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:0,k:100,ix:2},o:{a:0,k:0,ix:3},s:{a:0,k:0,ix:1},m:1}],ind:2}],s="5.5.7",x=[],e={nm:a,ddd:0,h:246,w:246,meta:i,layers:t,v:s,fr:60,op:90,ip:0,assets:x};exports.assets=x,exports.ddd=0,exports.default=e,exports.fr=60,exports.h=246,exports.ip=0,exports.layers=t,exports.meta=i,exports.nm=a,exports.op=90,exports.v=s,exports.w=246;

package/dist/cjs/components/spinner/lotties/red.json.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a="loader for public",i={g:"LottieFiles AE 0.1.21"},t=[{ty:4,nm:"Shape Layer 1",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,hasMask:!1,td:1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[100,100,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[3.002,-217.775,0],ix:2},r:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[360],t:90}],ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"st",bm:0,hd:!1,mn:"ADBE Vector Graphic - Stroke",nm:"Stroke 1",lc:2,lj:1,ml:4,o:{a:0,k:100,ix:4},w:{a:0,k:28,ix:5},c:{a:0,k:[1,1,1],ix:3}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[10],t:0},{s:[70],t:44.25}],ix:2},o:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[144],t:90}],ix:3},s:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[0],t:44.25},{s:[60],t:90}],ix:1},m:1}],ind:1,parent:2},{ty:4,nm:"color",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,tt:1,hasMask:!1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[89.983,89.983,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[123,123,0],ix:2},r:{a:0,k:360,ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"gs",bm:0,hd:!1,mn:"ADBE Vector Graphic - G-Stroke",nm:"Gradient Stroke 1",e:{a:0,k:[122.126,120.78],ix:5},g:{p:3,k:{a:0,k:[0,.7254901960784313,.13725490196078433,.12941176470588237,.5,.7254901960784313,.13725490196078433,.12941176470588237,1,.7254901960784313,.13725490196078433,.12941176470588237],ix:8}},t:1,a:{a:0,k:0},h:{a:0,k:0},s:{a:0,k:[-118.969,-118.703],ix:4},lc:2,lj:1,ml:4,o:{a:0,k:100,ix:9},w:{a:0,k:32,ix:10}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:0,k:100,ix:2},o:{a:0,k:0,ix:3},s:{a:0,k:0,ix:1},m:1}],ind:2}],s="5.5.7",x=[],e={nm:a,ddd:0,h:246,w:246,meta:i,layers:t,v:s,fr:60,op:90,ip:0,assets:x};exports.assets=x,exports.ddd=0,exports.default=e,exports.fr=60,exports.h=246,exports.ip=0,exports.layers=t,exports.meta=i,exports.nm=a,exports.op=90,exports.v=s,exports.w=246;

package/dist/cjs/components/spinner/lotties/white.json.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a="loader for public",i={g:"LottieFiles AE 0.1.21"},t=[{ty:4,nm:"Shape Layer 1",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,hasMask:!1,td:1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[100,100,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[3.002,-217.775,0],ix:2},r:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[360],t:90}],ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"st",bm:0,hd:!1,mn:"ADBE Vector Graphic - Stroke",nm:"Stroke 1",lc:2,lj:1,ml:4,o:{a:0,k:100,ix:4},w:{a:0,k:28,ix:5},c:{a:0,k:[1,1,1],ix:3}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[10],t:0},{s:[70],t:44.25}],ix:2},o:{a:1,k:[{o:{x:.167,y:.167},i:{x:.833,y:.833},s:[0],t:0},{s:[144],t:90}],ix:3},s:{a:1,k:[{o:{x:.333,y:0},i:{x:.667,y:1},s:[0],t:44.25},{s:[60],t:90}],ix:1},m:1}],ind:1,parent:2},{ty:4,nm:"color",sr:1,st:0,op:300,ip:0,hd:!1,ddd:0,bm:0,tt:1,hasMask:!1,ao:0,ks:{a:{a:0,k:[3.002,-217.775,0],ix:1},s:{a:0,k:[89.983,89.983,100],ix:6},sk:{a:0,k:0},p:{a:0,k:[123,123,0],ix:2},r:{a:0,k:360,ix:10},sa:{a:0,k:0},o:{a:0,k:100,ix:11}},ef:[],shapes:[{ty:"gr",bm:0,hd:!1,mn:"ADBE Vector Group",nm:"Ellipse 1",ix:1,cix:2,np:3,it:[{ty:"el",bm:0,hd:!1,mn:"ADBE Vector Shape - Ellipse",nm:"Ellipse Path 1",d:1,p:{a:0,k:[0,0],ix:3},s:{a:0,k:[239.598,239.598],ix:2}},{ty:"gs",bm:0,hd:!1,mn:"ADBE Vector Graphic - G-Stroke",nm:"Gradient Stroke 1",e:{a:0,k:[122.126,120.78],ix:5},g:{p:3,k:{a:0,k:[0,1,1,1,.5,1,1,1,1,1,1,1],ix:8}},t:1,a:{a:0,k:0},h:{a:0,k:0},s:{a:0,k:[-118.969,-118.703],ix:4},lc:2,lj:1,ml:4,o:{a:0,k:100,ix:9},w:{a:0,k:32,ix:10}},{ty:"tr",a:{a:0,k:[0,0],ix:1},s:{a:0,k:[100,100],ix:3},sk:{a:0,k:0,ix:4},p:{a:0,k:[3.002,-217.775],ix:2},r:{a:0,k:0,ix:6},sa:{a:0,k:0,ix:5},o:{a:0,k:100,ix:7}}]},{ty:"tm",bm:0,hd:!1,mn:"ADBE Vector Filter - Trim",nm:"Trim Paths 1",ix:2,e:{a:0,k:100,ix:2},o:{a:0,k:0,ix:3},s:{a:0,k:0,ix:1},m:1}],ind:2}],s="5.5.7",x=[],e={nm:a,ddd:0,h:246,w:246,meta:i,layers:t,v:s,fr:60,op:90,ip:0,assets:x};exports.assets=x,exports.ddd=0,exports.default=e,exports.fr=60,exports.h=246,exports.ip=0,exports.layers=t,exports.meta=i,exports.nm=a,exports.op=90,exports.v=s,exports.w=246;

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

@@ -0,0 +1,13 @@
+/// <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/spinner/themes.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.SizeMap={small:16,large:40};

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

@@ -0,0 +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 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

@@ -0,0 +1,11 @@
+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

@@ -0,0 +1 @@
+"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

@@ -0,0 +1,14 @@
+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

@@ -0,0 +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

@@ -0,0 +1,41 @@
+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

@@ -0,0 +1 @@
+"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/StateComponent.styled.js

@@ -0,0 +1,29 @@
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}Object.defineProperty(exports,"__esModule",{value:!0});var e=t(require("styled-components"));const i=e.default.div`
+	width: ${t=>t.width?`${t.width}px`:"400px"};
+	position: relative;
+	border-radius: 4px;
+	padding: 32px 24px 24px 24px;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+`,n=e.default.div`
+	width: ${t=>t.iconWidth?t.iconWidth:64}px;
+	height: ${t=>t.iconHeight?t.iconHeight:64}px;
+	display: flex;
+	justify-content: center;
+	align-items: end;
+`,d=e.default.div`
+	margin-top: ${t=>"SMALL"===t.size?8:16}px;
+	text-align: center;
+	max-width: 100%;
+`,a=e.default.div`
+	display: flex;
+	margin-top: ${t=>"SMALL"===t.size?8:24}px;
+	gap: 12px;
+	width: 100%;
+`,o=e.default.div`
+	margin-top: 4px;
+	max-width: 100%;
+	text-align: center;
+	max-width: 100%;
+`;exports.ButtonContainer=a,exports.StateComponentContainer=i,exports.StateHeading=d,exports.StateIcon=n,exports.StateSubline=o;

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

@@ -0,0 +1,10 @@
+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>;

package/dist/cjs/components/states-modal/DeleteConfirmationModal.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../modals/styledModal.js");exports.DeleteConfirmationModal=n=>e.jsx(t.StyledModal,{"data-test":n["data-test"],centralContainerStyles:{width:400},onClose:()=>n.onCancelClicked(),open:!0,headingTitle:n.header,headingSubtitle:n.subHeader,primaryButton:{buttonText:n.confirmationText,buttonType:"destructive",size:"small",onClick:()=>n.onDeleteConfirmed()},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",size:"small",onClick:()=>n.onCancelClicked()}});

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

@@ -0,0 +1,26 @@
+import { ReactJSXElement } from '@emotion/react/types/jsx-namespace';
+import React from 'react';
+import { Type } from '../button/model';
+import { ButtonActions, ButtonTypes, StateInterface } from '../states/StateComponent';
+export type StateModalComponentProps = {
+    states: StateInterface;
+    heading: string;
+    subline: string;
+    icon?: JSX.Element;
+    isButtonEnabled: boolean;
+    type?: ButtonTypes;
+    buttonText?: string;
+    buttonIcon?: ReactJSXElement;
+    onButtonClick?: (buttonClicked: ButtonActions) => void;
+    leadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    width?: number;
+    onClose?: () => void;
+    zIndex?: number;
+    headerImage?: string;
+    iconWidth?: number;
+    iconHeight?: number;
+    closeButtonType?: Type;
+    'data-test'?: string;
+    secondaryButtonText?: string;
+};
+export declare const StateModalComponent: React.FC<React.PropsWithChildren<StateModalComponentProps>>;

package/dist/cjs/components/states-modal/StateModalComponent.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../constants/zindex.js"),s=require("../../assets/icons/errorIcon.svg.js"),o=require("../../assets/icons/successIcon.svg.js"),i=require("../../assets/icons/warningIcon.svg.js"),a=require("../modals/styledModal.js"),r=require("../spinner/Spinner.js"),c=require("../states/StateComponent.js");exports.StateModalComponent=d=>{const l=()=>u==c.StateInterface.SUCCESS?e.jsx(o.default,{}):u==c.StateInterface.WARNING?e.jsx(i.default,{}):u==c.StateInterface.ERROR?e.jsx(s.default,{}):u===c.StateInterface.LOADING?e.jsx(r.Spinner,{size:"large"}):void 0,{states:u,heading:I,subline:j,icon:x=l(),isButtonEnabled:S,type:g,buttonText:p,onButtonClick:h,leadingIcon:C,width:f,zIndex:y,headerImage:O,iconHeight:b,iconWidth:m,closeButtonType:q,secondaryButtonText:B}=d,[T,v]=t.useState(!0);return e.jsx(a.StyledModal,Object.assign({"data-test":d["data-test"],open:T,onClose:function(){d.onClose&&d.onClose(),v(!1)},closeOnOutsideClick:!(u===c.StateInterface.LOADING),centralContainerStyles:{display:"flex",alignItems:"center",justifyContent:"center",width:f},hideCrossButton:u===c.StateInterface.LOADING,zIndex:y||n.ComponentZindex.STATE_MODAL},{children:e.jsx(c.StateComponent,Object.assign({states:u,heading:I,subline:j,isButtonEnabled:S,leadingIcon:C,type:g,buttonText:p,onButtonClick:h,icon:x,width:f||400,headerImage:O,iconHeight:b,iconWidth:m,closeButtonType:q,secondaryButtonText:B},{children:d.children}))}))};

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

@@ -0,0 +1,2 @@
+export * from './StateModalComponent';
+export * from './DeleteConfirmationModal';

package/dist/cjs/components/stepper/Stepper.d.ts

@@ -0,0 +1,24 @@
+export type StepperStates = 'default' | 'completed' | 'error' | 'active' | 'inactive';
+export interface StepperProps {
+    steps: EachStep[];
+    activeStep: EachStep;
+    onClickingEachStep: (step: EachStep) => void;
+    hideHoverState?: boolean;
+}
+export interface EachStep {
+    stepKey: string;
+    stepName: string;
+    isCompleted: boolean;
+    isError: boolean;
+    isInActive: boolean;
+}
+export interface SingleStepperProps {
+    index: number;
+    isLastElement: boolean;
+    eachStep: EachStep;
+    isActive: boolean;
+    onClickingStep: (step: EachStep) => void;
+    stepsCount: number;
+    hideHoverState?: boolean;
+}
+export declare const Stepper: (stepperDetails: StepperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/stepper/Stepper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/check.svg.js"),i=require("../../assets/icons/errorInfo.svg.js"),r=require("../TypographyStyle.js"),n=require("./Stepper.styled.js");const c=c=>{const{eachStep:a,isLastElement:o,index:l,isActive:d,onClickingStep:p,hideHoverState:h}=c,{stepName:j,isCompleted:v,isError:u,isInActive:g}=a,S=()=>d?"active":v?"completed":u?"error":g?"inactive":"default";return e.jsxs(n.SingleStepperChildContainer,Object.assign({stepsCount:c.stepsCount,onClick:()=>{!g&&p(a)},selectedState:S(),isInActive:g||h},{children:[e.jsxs("div",Object.assign({className:`hover-container ${g?"blocked":"pointer"} `},{children:[e.jsx("div",Object.assign({className:"badge"},{children:"completed"==S()?e.jsx(s.default,{height:16,width:16,color:t.COLORS.content.positive}):"error"==S()?e.jsx(i.default,{height:16,width:16}):e.jsx(r.BodySecondary,Object.assign({className:"badge-text"},{children:l+1}))})),e.jsx(r.BodyPrimary,Object.assign({className:"step-text",title:j},{children:j}))]})),e.jsx("div",{className:o?"":"horizontal-divider"})]}))};exports.Stepper=t=>{const{steps:s,activeStep:i,onClickingEachStep:r,hideHoverState:a}=t;return e.jsx(n.StepperContainer,{children:s.map(((t,n)=>e.jsx(c,{stepsCount:s.length,eachStep:t,onClickingStep:e=>{r(e)},isActive:(null==i?void 0:i.stepKey)==(null==t?void 0:t.stepKey),isLastElement:n==s.length-1,index:n,hideHoverState:a},n)))})};

package/dist/cjs/components/stepper/Stepper.styled.d.ts

@@ -0,0 +1,8 @@
+import { StepperStates } from './Stepper';
+export declare const StepperContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SingleStepperChildContainer: import("styled-components").StyledComponent<"div", any, {
+    selectedState: StepperStates;
+    stepsCount: number;
+    isInActive?: boolean | undefined;
+}, never>;
+export declare const WorkingStepperContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/stepper/Stepper.styled.js

@@ -0,0 +1,83 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("./themes.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);const o=n.default.div`
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	gap: 16px;
+`,r=n.default.div`
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+
+	.pointer {
+		cursor: pointer;
+	}
+	.blocked {
+		cursor: not-allowed;
+	}
+
+	.hover-container {
+		padding: 6px 8px 6px 6px;
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		gap: 8px;
+		&:hover {
+			padding: ${e=>e.isInActive?void 0:"6px 8px 6px 6px"};
+			background: ${e=>e.isInActive?void 0:"#f0f0f0"};
+			border-radius: ${e=>e.isInActive?void 0:"30px"};
+		}
+	}
+	.badge {
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		padding: 4px;
+		gap: 10px;
+		width: 32px;
+		height: 24px;
+		background: ${e=>t.getTheme(e.selectedState).badgeBackground};
+		border: 1px solid ${e=>t.getTheme(e.selectedState).badgeBorder};
+		border-radius: 30px;
+		.badge-text {
+			font-weight: ${e=>t.getTheme(e.selectedState).fontWeight};
+			color: ${e=>t.getTheme(e.selectedState).badgeColor};
+		}
+	}
+	.step-text {
+		font-weight: ${e=>t.getTheme(e.selectedState).fontWeight};
+		font-feature-settings: 'tnum' on, 'lnum' on, 'case' on, 'ss04' on;
+		color: ${e=>t.getTheme(e.selectedState).textColor};
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		max-width: ${e=>e.stepsCount>2?200:250}px;
+	}
+	.horizontal-divider {
+		width: 48px;
+		height: 1px;
+		background: ${e=>t.getTheme(e.selectedState).dividerBackground};
+		margin-left: 8px;
+	}
+`;n.default.div`
+	.top-bar {
+		position: sticky;
+		top: 0px;
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		background: white;
+	}
+	.main-container {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		overflow-y: auto;
+	}
+`,exports.SingleStepperChildContainer=r,exports.StepperContainer=o;

package/dist/cjs/components/stepper/StepperService.d.ts

@@ -0,0 +1,4 @@
+import { EachStep } from './Stepper';
+export default class StepperService {
+    updateSteps: (steps: EachStep[], stepToUpdate: EachStep, propertiesToUpdate: Partial<EachStep>) => EachStep[];
+}

package/dist/cjs/components/stepper/WorkingStepper.d.ts

@@ -0,0 +1,14 @@
+export declare const WorkingStepper: () => import("react/jsx-runtime").JSX.Element;
+export declare enum STEPENUM {
+    STEP1 = "STEP1",
+    STEP2 = "STEP2",
+    STEP3 = "STEP3",
+    STEP4 = "STEP4"
+}
+export declare const Steps: {
+    stepKey: STEPENUM;
+    stepName: string;
+    isCompleted: boolean;
+    isError: boolean;
+    isInActive: boolean;
+}[];

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

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