@bikdotai/bik-component-library 0.0.687-beta.4 → 0.0.687-beta.6

package/dist/esm/components/bik-layout/FeatureModal.d.ts

@@ -0,0 +1,16 @@
+interface FeatureModalProps {
+    zIndex?: number;
+    disableCross?: boolean;
+    onClickingCross: () => void;
+    otherContent?: JSX.Element;
+    onUpgrade?: () => void;
+    primaryButtonText?: string;
+    title?: string;
+    subTitle?: string;
+    showBookADemo?: boolean;
+    demoLink?: string;
+}
+declare const FeatureModal: React.FC<FeatureModalProps>;
+
+export { FeatureModal };
+export type { FeatureModalProps };

package/dist/esm/components/bik-layout/FeatureModalV2.d.ts

@@ -0,0 +1,15 @@
+interface FeatureModalV2Props {
+    zIndex?: number;
+    otherContent?: JSX.Element;
+    onUpgrade?: () => void;
+    primaryButtonText?: string;
+    title?: string;
+    subTitle?: string;
+    onClose?: () => void;
+    featureImage?: string;
+    id?: string;
+}
+declare const FeatureModalV2: React.FC<FeatureModalV2Props>;
+
+export { FeatureModalV2 };
+export type { FeatureModalV2Props };

package/dist/esm/components/bik-layout/ShowShopifyRestrictedModal.d.ts

@@ -0,0 +1,15 @@
+interface ShowShopifyRestrictedModalProps {
+    containerType: 'demo_store' | 'connect_shopify';
+    handleButtonClick: (type: 'shopify' | 'demo' | 'close') => void;
+    connectShopifyDescription?: string;
+    demoDescription?: string;
+    zIndex?: number;
+    triggerPosition?: {
+        top: number;
+        left: number;
+    };
+}
+declare const ShowShopifyRestrictedModal: React.FC<ShowShopifyRestrictedModalProps>;
+
+export { ShowShopifyRestrictedModal };
+export type { ShowShopifyRestrictedModalProps };

package/dist/esm/components/bik-layout/ShowShopifyRestrictedModal.js

@@ -1 +1 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import t from"react-dom";import{COLORS as n}from"../../constants/Theme.js";import i from"../../assets/icons/cross.svg.js";import{Button as r}from"../button/Button.js";import{TitleMedium as a,BodyPrimary as s}from"../TypographyStyle.js";import{FeatureModalContainer as c,RelativeModalContainer as l}from"./CommonStyles.js";const d=d=>{const{zIndex:m,containerType:h,handleButtonClick:p,triggerPosition:u,connectShopifyDescription:y,demoDescription:g}=d,b=e=>{p(e)},f=u&&window.innerHeight-u.top<100,v=u?{position:"fixed",top:f?"auto":u.top,bottom:f?"0":"auto",left:u.left,width:"unset",background:"none"}:{alignItems:"center",height:950,background:"linear-gradient(0deg, #FFF 0%, rgba(255, 255, 255, 0.00) 129.71%)"};return t.createPortal(e(c,{zIndex:m,resetHeight:!0,style:v,relativePostion:!!u,children:o(l,{children:[e("div",{className:"cross-container",onClick:()=>b("close"),"aria-hidden":"true",children:e(i,{height:24,width:24,color:"#000000"})}),o("div","demo_store"==h?{className:"demo-container",children:[e(a,{color:n.background.negative.vibrant,children:"Demo Store Limitations"}),e(s,{children:null!=g?g:"Apologies, but you are unable to save or take any actions as you are currently in the demo store."})]}:{className:"content-layout",children:[e("div",{className:"left-content",children:e("img",{src:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F6300e18e-16ef-4f65-9861-26476d2a3d9a?alt=media&token=0da9e429-4c12-4a06-bba8-9ac7c3fdd2c4",alt:"left-panel"})}),o("div",{className:"right-content",children:[e(a,{children:"Connect Shopify "}),e(s,{style:{maxWidth:432},children:null!=y?y:"Connect Shopify to publish your bot on your Shopify store. Or, explore our demo store to see it in action."}),o("div",{className:"cta-button-container",children:[e(r,{buttonText:"Connect shopify",buttonType:"primary",size:"small",onClick:()=>b("shopify")}),e(r,{buttonText:"View demo store",buttonType:"secondary",size:"small",onClick:()=>b("demo")})]})]})]})]})}),document.body)};export{d as ShowShopifyRestrictedModal};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import t from"react-dom";import{COLORS as i}from"../../constants/Theme.js";import n from"../../assets/icons/cross.svg.js";import{Button as r}from"../button/Button.js";import{TitleMedium as a,BodyPrimary as s}from"../TypographyStyle.js";import{FeatureModalContainer as c,RelativeModalContainer as l}from"./CommonStyles.js";const d=d=>{const{zIndex:m,containerType:h,handleButtonClick:p,triggerPosition:u,connectShopifyDescription:y,demoDescription:g}=d,b=e=>{p(e)},f=u&&window.innerHeight-u.top<100,v=u?{position:"fixed",top:f?"auto":u.top,bottom:f?"0":"auto",left:u.left,width:"unset",background:"none"}:{alignItems:"center",height:950,background:"linear-gradient(0deg, #FFF 0%, rgba(255, 255, 255, 0.00) 129.71%)"};return t.createPortal(e(c,{zIndex:m,resetHeight:!0,style:v,relativePostion:!!u,children:o(l,{children:[e("div",{className:"cross-container",onClick:()=>b("close"),"aria-hidden":"true",children:e(n,{height:24,width:24,color:"#000000"})}),o("div","demo_store"==h?{className:"demo-container",children:[e(a,{color:i.background.negative.vibrant,children:"Demo Store Limitations"}),e(s,{children:g??"Apologies, but you are unable to save or take any actions as you are currently in the demo store."})]}:{className:"content-layout",children:[e("div",{className:"left-content",children:e("img",{src:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F6300e18e-16ef-4f65-9861-26476d2a3d9a?alt=media&token=0da9e429-4c12-4a06-bba8-9ac7c3fdd2c4",alt:"left-panel"})}),o("div",{className:"right-content",children:[e(a,{children:"Connect Shopify "}),e(s,{style:{maxWidth:432},children:y??"Connect Shopify to publish your bot on your Shopify store. Or, explore our demo store to see it in action."}),o("div",{className:"cta-button-container",children:[e(r,{buttonText:"Connect shopify",buttonType:"primary",size:"small",onClick:()=>b("shopify")}),e(r,{buttonText:"View demo store",buttonType:"secondary",size:"small",onClick:()=>b("demo")})]})]})]})]})}),document.body)};export{d as ShowShopifyRestrictedModal};

package/dist/esm/components/bik-layout/SidebarPopup.js

@@ -1 +1 @@
-import{jsx as e,jsxs as n}from"react/jsx-runtime";import{TitleRegular as o,BodySecondary as t}from"../TypographyStyle.js";import{SidebarPopupContainer as i}from"./SidebarStyles.js";const r=r=>{const{top:s,menuList:l,zIndex:m,left:d,onMouseLeaveOnMenu:a,onClickingPopupMenu:u}=r;return e(i,{top:s,theme:"white",zIndex:m,left:null!=d?d:95,postion:"fixed",children:e("div",{id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseLeave:a,children:null==l?void 0:l.map(((i,r)=>n("div",{className:"each-menu",style:{borderBottom:r==l.length-1?"none":void 0},onClick:()=>u(i),children:[e(o,{style:{fontSize:14},children:i.displayName}),e(t,{style:{fontSize:12},children:i.description})]},r)))},"_sub-menu")})};export{r as SidebarPopup};
+import{jsx as e,jsxs as n}from"react/jsx-runtime";import{TitleRegular as o,BodySecondary as t}from"../TypographyStyle.js";import{SidebarPopupContainer as i}from"./SidebarStyles.js";const r=r=>{const{top:s,menuList:l,zIndex:m,left:d,onMouseLeaveOnMenu:a,onClickingPopupMenu:c}=r;return e(i,{top:s,theme:"white",zIndex:m,left:d??95,postion:"fixed",children:e("div",{id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseLeave:a,children:l?.map(((i,r)=>n("div",{className:"each-menu",style:{borderBottom:r==l.length-1?"none":void 0},onClick:()=>c(i),children:[e(o,{style:{fontSize:14},children:i.displayName}),e(t,{style:{fontSize:12},children:i.description})]},r)))},"_sub-menu")})};export{r as SidebarPopup};

package/dist/esm/components/bik-layout/SidebarSkeleton.d.ts

@@ -0,0 +1,12 @@
+import { SidebarTheme } from './SimpleSidebar.js';
+
+interface BikSidebarShimmerProps {
+    theme: SidebarTheme;
+    width?: number;
+    zIndex?: number;
+    left?: number;
+}
+declare const SidebarSkeleton: React.FC<BikSidebarShimmerProps>;
+
+export { SidebarSkeleton };
+export type { BikSidebarShimmerProps };

package/dist/esm/components/bik-layout/SimpleSidebar.d.ts

@@ -0,0 +1,31 @@
+interface Menu {
+    key: string | number;
+    displayName: string;
+    description?: string;
+    path?: string;
+    page?: string;
+    isNew?: string;
+}
+type SidebarTheme = 'brand' | 'white';
+interface SimpleSidebarProps {
+    menuList: Menu[];
+    activeMenu: Menu;
+    theme: SidebarTheme;
+    showAccessUpgradePanel?: boolean;
+    header?: string;
+    width?: number;
+    zIndex?: number;
+    left?: number;
+    postion?: 'fixed' | 'sticky';
+    top?: number;
+    router: any;
+    onMouseLeaveOnMenu?: () => void;
+    onMouseEnterOnMenu?: () => void;
+    onMenuClick: (menuSelected: Menu, reDirect?: boolean) => void;
+    onUpgrade?: () => void;
+    isNewSidebar?: boolean;
+}
+declare const SimpleSidebar: React.FC<SimpleSidebarProps>;
+
+export { SimpleSidebar };
+export type { Menu, SidebarTheme, SimpleSidebarProps };

package/dist/esm/components/bik-layout/SimpleSidebar.js

@@ -1 +1 @@
-import{jsx as e,jsxs as i}from"react/jsx-runtime";import{useState as n}from"react";import{COLORS as t}from"../../constants/Theme.js";import{Button as a}from"../button/Button.js";import{NavigationHyperlink as s}from"../navigation-hyperlink/NavigationHyperlink.js";import{BodySecondary as l,TitleSmall as r}from"../TypographyStyle.js";import{SimpleSidebarContainer as o}from"./SidebarStyles.js";const d=d=>{const{menuList:c,activeMenu:u,theme:m,showAccessUpgradePanel:p=!1,header:h,width:v,zIndex:b,left:y,postion:N,top:g,router:f,onMouseLeaveOnMenu:k,onMouseEnterOnMenu:w,onMenuClick:x,onUpgrade:M,isNewSidebar:j}=d,[S,T]=n(u),U=(n,t)=>i("div",{className:"sub-child-menu  "+((null==S?void 0:S.key)==(null==n?void 0:n.key)?"sub-child-active-menu":""),onClick:()=>{T(n),x(n,!n.page)},"aria-hidden":"true",children:[e("span",{className:(null==S?void 0:S.key)==(null==n?void 0:n.key)&&"brand"==m?"sub-child-active-text":""}),e(l,{className:"sub-child-text "+((null==S?void 0:S.key)==(null==n?void 0:n.key)&&"white"==m?"active-bold-weight":""),children:null==n?void 0:n.displayName}),n.isNew&&e("div",{className:"sub-child-new-tag",children:"NEW"})]},t);return e(o,{width:v,zIndex:b,left:y,theme:m,postion:N,top:g,isNewSidebar:j,children:i("div",{id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseLeave:k,onMouseEnter:w,children:[i("div",{children:[!j&&e(l,{className:"sub-child-display-name",children:h}),null==c?void 0:c.map(((i,n)=>i.page?e(s,{href:i.page,router:f,children:U(i,n)}):U(i,n)))]}),p&&i("div",{className:"lower-sticky-panel",children:[e(r,{className:"title-text",style:{color:t.surface.standard},children:"Upgrade plan to access this feature."}),e(a,{className:"upgrade-button",buttonText:"Upgrade plan",buttonType:"primary",size:"small",inverse:!0,onClick:()=>M?M():""})]})]},"_sub-menu")})};export{d as SimpleSidebar};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as a}from"react";import{COLORS as i}from"../../constants/Theme.js";import{Button as s}from"../button/Button.js";import{NavigationHyperlink as n}from"../navigation-hyperlink/NavigationHyperlink.js";import{BodySecondary as r,TitleSmall as o}from"../TypographyStyle.js";import{SimpleSidebarContainer as l}from"./SidebarStyles.js";const c=c=>{const{menuList:d,activeMenu:m,theme:u,showAccessUpgradePanel:p=!1,header:h,width:b,zIndex:y,left:N,postion:g,top:v,router:f,onMouseLeaveOnMenu:k,onMouseEnterOnMenu:w,onMenuClick:x,onUpgrade:M,isNewSidebar:j}=c,[S,T]=a(m),U=(a,i)=>t("div",{className:"sub-child-menu  "+(S?.key==a?.key?"sub-child-active-menu":""),onClick:()=>{T(a),x(a,!a.page)},"aria-hidden":"true",children:[e("span",{className:S?.key==a?.key&&"brand"==u?"sub-child-active-text":""}),e(r,{className:"sub-child-text "+(S?.key==a?.key&&"white"==u?"active-bold-weight":""),children:a?.displayName}),a.isNew&&e("div",{className:"sub-child-new-tag",children:"NEW"})]},i);return e(l,{width:b,zIndex:y,left:N,theme:u,postion:g,top:v,isNewSidebar:j,children:t("div",{id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseLeave:k,onMouseEnter:w,children:[t("div",{children:[!j&&e(r,{className:"sub-child-display-name",children:h}),d?.map(((t,a)=>t.page?e(n,{href:t.page,router:f,children:U(t,a)}):U(t,a)))]}),p&&t("div",{className:"lower-sticky-panel",children:[e(o,{className:"title-text",style:{color:i.surface.standard},children:"Upgrade plan to access this feature."}),e(s,{className:"upgrade-button",buttonText:"Upgrade plan",buttonType:"primary",size:"small",inverse:!0,onClick:()=>M?M():""})]})]},"_sub-menu")})};export{c as SimpleSidebar};

package/dist/esm/components/button/Button.d.ts

@@ -0,0 +1,6 @@
+import React__default from 'react';
+import { ButtonProps } from './model.js';
+
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
+
+export { Button };

package/dist/esm/components/button/Button.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import r,{forwardRef as n}from"react";import{Spinner as i}from"../spinner/Spinner.js";import{Button as a,ButtonCustomDashedBorder as l}from"./Button.styled.js";import{getButtonIconColor as s,SpinnerColorMap as c,GetButtonTextComponent as d}from"./themes.js";var m=Object.defineProperty,b=Object.defineProperties,p=Object.getOwnPropertyDescriptors,u=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,y=(e,t,o)=>t in e?m(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,f=(e,t)=>{for(var o in t||(t={}))v.call(t,o)&&y(e,o,t[o]);if(u)for(var o of u(t))h.call(t,o)&&y(e,o,t[o]);return e};const g=n(((n,m)=>{var y=n,{version:g,id:I,buttonType:x="primary",size:C="small",buttonText:O,disabled:j,IconComponent:N,LeadingIcon:z,TrailingIcon:T,isLoading:P,inverse:k,onClick:L,matchParentWidth:S,subtitle:w,darkMode:E,activated:W,error:B,buttonTextColor:M,buttonFontSize:F,customIconColor:D,buttonColor:q,LeadingIconStyles:A}=y,G=((e,t)=>{var o={};for(var r in e)v.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(null!=e&&u)for(var r of u(e))t.indexOf(r)<0&&h.call(e,r)&&(o[r]=e[r]);return o})(y,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor","LeadingIconStyles"]);const H=d(C,x,j),J=s(C,x,k,j,P,E),K="chip"===C?16:20,Q={height:K,width:K,color:D||J,style:{display:"block"},className:"icon"};return e(a,(R=f({"data-test":G["data-test"],version:g,onClick:P?()=>{}:L,ref:m,id:I,disabled:j,size:C,buttonType:x,isLoading:P,inverse:k,matchParentWidth:S,darkMode:E,activated:W,error:B,buttonColor:q},G),U={children:t("div",{className:"button-container",children:[x.startsWith("dash")&&e(l,{}),e("div",{className:"overlay-container",children:P&&e(i,{className:"spinner",size:"small",color:c(x,k)})}),N&&e("div",{className:"icon-component",children:r.createElement(N,Q)}),z&&e("div",{className:"icon-leading",style:f({zIndex:1},A),children:r.createElement(z,Q)}),O?t(H,{className:"text",style:{color:M,fontSize:F},children:[O,e("div",{className:"text-subtitle",children:w})]}):e(o,{}),T&&e("div",{className:"icon-trailing",style:{zIndex:1},children:r.createElement(T,Q)})]})},b(R,p(U))));var R,U}));g.displayName="Button";export{g as Button};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import n,{forwardRef as o}from"react";import{Spinner as r}from"../spinner/Spinner.js";import{Button as a,ButtonCustomDashedBorder as s}from"./Button.styled.js";import{getButtonIconColor as l,SpinnerColorMap as c,GetButtonTextComponent as d}from"./themes.js";const m=o((({version:o,id:m,buttonType:h="primary",size:p="small",buttonText:u,disabled:b,IconComponent:v,LeadingIcon:y,TrailingIcon:N,isLoading:g,inverse:x,onClick:f,matchParentWidth:z,subtitle:C,darkMode:I,activated:k,error:T,buttonTextColor:j,buttonFontSize:L,customIconColor:S,buttonColor:B,LeadingIconStyles:E,...W},M)=>{const P=d(p,h,b),w=l(p,h,x,b,g,I),F="chip"===p?16:20,q={height:F,width:F,color:S||w,style:{display:"block"},className:"icon"};return e(a,{"data-test":W["data-test"],version:o,onClick:g?()=>{}:f,ref:M,id:m,disabled:b,size:p,buttonType:h,isLoading:g,inverse:x,matchParentWidth:z,darkMode:I,activated:k,error:T,buttonColor:B,...W,children:t("div",{className:"button-container",children:[h.startsWith("dash")&&e(s,{}),e("div",{className:"overlay-container",children:g&&e(r,{className:"spinner",size:"small",color:c(h,x)})}),v&&e("div",{className:"icon-component",children:n.createElement(v,q)}),y&&e("div",{className:"icon-leading",style:{zIndex:1,...E},children:n.createElement(y,q)}),u?t(P,{className:"text",style:{color:j,fontSize:L},children:[u,e("div",{className:"text-subtitle",children:C})]}):e(i,{}),N&&e("div",{className:"icon-trailing",style:{zIndex:1},children:n.createElement(N,q)})]})})}));m.displayName="Button";export{m as Button};

package/dist/esm/components/button/Button.styled.js

@@ -1 +1,61 @@
-import t from"@emotion/styled/base";import{jsxs as c,Fragment as d,jsx as b}from"react/jsx-runtime";import{COLORS as n}from"../../constants/Theme.js";import{getBackgroundColor as X,getPadding as l,getBorder as i,getColor as H,getDashedBorderStyling as x,getClickEffect as e,generateDisabledStyling as G,getDisabledTextColor as R,getHoverButtonBackgroundCustom as o,getHoverButtonBackground as u,getHoverButtonTextDecorationStyle as I,generateInverseHoverBackground as g,getLoadingBorder as Z,getLoadingButtonBackgroundCustom as a,getLoadingBackground as m}from"./themes.js";const y=t("button","production"===process.env.NODE_ENV?{target:"exlualr0"}:{target:"exlualr0",label:"Button"})("all:unset;cursor:pointer;display:flex;gap:8.83px;border-radius:",(t=>"text"==t.buttonType?"0":"4px"),";overflow:hidden;",(t=>t.matchParentWidth?"flex-grow: 1;":"")," background-color:",(t=>X(t.buttonType,t.size,t.inverse,t.darkMode,t.buttonColor)),";",(t=>{var c;return t.buttonType.startsWith("dash")?`.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tpadding: ${l(t.buttonType,t.size)};\n\t\t\t\t}`:`padding: ${l(t.buttonType,t.size)};\n\t${i(null!=(c=t.version)?c:"1.0",t.buttonType,t.size,t.inverse,t.error)}`})," .icon-component{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}.icon-trailing{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}.text{color:",(t=>H(t.buttonType,t.size,t.inverse,t.darkMode)),";}.icon-leading{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}",(t=>x(t.buttonType,t.size,t.isLoading?n.stroke.brandLightAlt:t.error?n.stroke.negative.vibrant:void 0))," .overlay-container{display:none;}",(t=>!t.disabled&&!t.isLoading&&t.activated&&("dashBold"==t.buttonType||"dashRegular"==t.buttonType)&&`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t.text {\n\t\t\tcolor: ${n.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${n.background.brand};\n\t\t}\n\t\t\n\t}\n\t${e(t.buttonType,t.size,t.inverse)}\n\t${x(t.buttonType,t.size,n.content.brand)}\n\t`)," :disabled{cursor:",(t=>"text"===t.buttonType?"auto":"not-allowed"),";",(t=>x(t.buttonType,t.size,n.stroke.primary)),";.overlay-container{display:none!important;}",(t=>G(t.buttonType,t.size,t.inverse))," .text{color:",(t=>R(t.inverse)),"!important;}}",(t=>!t.disabled&&!t.isLoading&&`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${"chip"===t.size&&`.text {\n\t\t\t\t\t\tcolor: ${n.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${n.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t}\n\n\n\t\t\t${e(t.buttonType,t.size,t.inverse)}\n\t\t\t${x(t.buttonType,t.size,n.content.brand)}\n\t\t}`)," ",(t=>t.isLoading?`\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${Z(t.buttonType,t.size,t.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${t.buttonColor?`background-color: ${a(t.buttonColor,15)};`:""}\n\t\t\tpadding: ${l(t.buttonType,t.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\tpadding-top: 1px;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${m(t.buttonType,t.size,t.inverse,t.buttonColor)}\n\t\t\t\t.spinner {\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\ttop: calc(50% - 14px);\n\t\t\t\t\tleft: calc(50% - 7px);\n\t\t\t\t}\n\n\t\t\t}\n\t\t}`:`:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\tpadding: ${l(t.buttonType,t.size)};\n\t\t\t\t{${t.buttonColor?`background-color: ${o(t.buttonColor,15)}`:""}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${u(t.buttonType,t.inverse)}\n\t\t\t\t}\n\t\t\t\t${"chip"===t.size&&"text"!==t.buttonType?t.darkMode?`background-color: ${n.stroke.primary};`:`background-color: ${n.surface.hovered};`:""}\n\t\t\t\t${"primary"!==t.buttonType||"chip"===t.size||t.inverse||t.buttonColor?"":`background-color: ${n.background.inverse};`}\n\t\t\t}\n\t\t\t${"text"===t.buttonType?I(t.buttonType,t.disabled):""}\n\t\t\t${t.inverse?g(t.buttonType,t.disabled):""}\n\t\t}`)," .button-container{display:flex;gap:8.33px;",(t=>t.matchParentWidth?"margin: auto;":""),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbi5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFCbUMiLCJmaWxlIjoiQnV0dG9uLnN0eWxlZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJcInVzZSBzdHJpY3RcIjtcbmltcG9ydCB7IEZyYWdtZW50LCBqc3gsIGpzeHMgfSBmcm9tIFwicmVhY3QvanN4LXJ1bnRpbWVcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSBcIkBzcmMvY29uc3RhbnRzL1RoZW1lXCI7XG5pbXBvcnQge1xuICBnZW5lcmF0ZURpc2FibGVkU3R5bGluZyxcbiAgZ2VuZXJhdGVJbnZlcnNlSG92ZXJCYWNrZ3JvdW5kLFxuICBnZXRCYWNrZ3JvdW5kQ29sb3IsXG4gIGdldEJvcmRlcixcbiAgZ2V0Q2xpY2tFZmZlY3QsXG4gIGdldENvbG9yLFxuICBnZXREYXNoZWRCb3JkZXJTdHlsaW5nLFxuICBnZXREaXNhYmxlZFRleHRDb2xvcixcbiAgZ2V0SG92ZXJCdXR0b25CYWNrZ3JvdW5kLFxuICBnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmRDdXN0b20sXG4gIGdldEhvdmVyQnV0dG9uVGV4dERlY29yYXRpb25TdHlsZSxcbiAgZ2V0TG9hZGluZ0JhY2tncm91bmQsXG4gIGdldExvYWRpbmdCb3JkZXIsXG4gIGdldExvYWRpbmdCdXR0b25CYWNrZ3JvdW5kQ3VzdG9tLFxuICBnZXRQYWRkaW5nXG59IGZyb20gXCIuL3RoZW1lc1wiO1xuZXhwb3J0IGNvbnN0IEJ1dHRvbiA9IHN0eWxlZC5idXR0b25gXG5cdGFsbDogdW5zZXQ7XG5cdGN1cnNvcjogcG9pbnRlcjtcblx0ZGlzcGxheTogZmxleDtcblx0Z2FwOiA4LjgzcHg7XG5cdGJvcmRlci1yYWRpdXM6ICR7KHByb3BzKSA9PiBwcm9wcy5idXR0b25UeXBlID09IFwidGV4dFwiID8gXCIwXCIgOiBcIjRweFwifTtcblx0b3ZlcmZsb3c6IGhpZGRlbjtcblx0JHsocHJvcHMpID0+IHByb3BzLm1hdGNoUGFyZW50V2lkdGggPyBgZmxleC1ncm93OiAxO2AgOiBcIlwifVxuXHRiYWNrZ3JvdW5kLWNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0QmFja2dyb3VuZENvbG9yKFxuICBwcm9wcy5idXR0b25UeXBlLFxuICBwcm9wcy5zaXplLFxuICBwcm9wcy5pbnZlcnNlLFxuICBwcm9wcy5kYXJrTW9kZSxcbiAgcHJvcHMuYnV0dG9uQ29sb3Jcbil9O1xuXG5cdCR7KHByb3BzKSA9PiB7XG4gIHZhciBfYTtcbiAgcmV0dXJuIHByb3BzLmJ1dHRvblR5cGUuc3RhcnRzV2l0aChcImRhc2hcIikgPyBgLmJ1dHRvbi1jb250YWluZXIge1xuXHRcdFx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0XHRcdGJvcmRlci1yYWRpdXM6IDRweDtcblx0XHRcdFx0XHRvdmVyZmxvdzogaGlkZGVuO1xuXHRcdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/IFwianVzdGlmeS1jb250ZW50OiBjZW50ZXI7XCIgOiBcIlwifVxuXHRcdFx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHRcdH1gIDogYHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdCR7Z2V0Qm9yZGVyKFxuICAgIChfYSA9IHByb3BzLnZlcnNpb24pICE9IG51bGwgPyBfYSA6IFwiMS4wXCIsXG4gICAgcHJvcHMuYnV0dG9uVHlwZSxcbiAgICBwcm9wcy5zaXplLFxuICAgIHByb3BzLmludmVyc2UsXG4gICAgcHJvcHMuZXJyb3JcbiAgKX1gO1xufX1cblxuXHQuaWNvbi1jb21wb25lbnQge1xuXHRcdGhlaWdodDogJHsocHJvcHMpID0+IHByb3BzLnNpemUgPT09IFwiY2hpcFwiID8gXCIxNnB4XCIgOiBcIjIwcHhcIn07XG5cdFx0d2lkdGg6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSBcImNoaXBcIiA/IFwiMTZweFwiIDogXCIyMHB4XCJ9O1xuXHR9XG5cblx0Lmljb24tdHJhaWxpbmcge1xuXHRcdGhlaWdodDogJHsocHJvcHMpID0+IHByb3BzLnNpemUgPT09IFwiY2hpcFwiID8gXCIxNnB4XCIgOiBcIjIwcHhcIn07XG5cdFx0d2lkdGg6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSBcImNoaXBcIiA/IFwiMTZweFwiIDogXCIyMHB4XCJ9O1xuXHR9XG5cblx0LnRleHQge1xuXHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0Q29sb3IocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSwgcHJvcHMuZGFya01vZGUpfTtcblx0fVxuXG5cdC5pY29uLWxlYWRpbmcge1xuXHRcdGhlaWdodDogJHsocHJvcHMpID0+IHByb3BzLnNpemUgPT09IFwiY2hpcFwiID8gXCIxNnB4XCIgOiBcIjIwcHhcIn07XG5cdFx0d2lkdGg6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSBcImNoaXBcIiA/IFwiMTZweFwiIDogXCIyMHB4XCJ9O1xuXHR9XG5cblx0JHsocHJvcHMpID0+IGdldERhc2hlZEJvcmRlclN0eWxpbmcoXG4gIHByb3BzLmJ1dHRvblR5cGUsXG4gIHByb3BzLnNpemUsXG4gIHByb3BzLmlzTG9hZGluZyA/IENPTE9SUy5zdHJva2UuYnJhbmRMaWdodEFsdCA6IHByb3BzLmVycm9yID8gQ09MT1JTLnN0cm9rZS5uZWdhdGl2ZS52aWJyYW50IDogdm9pZCAwXG4pfVxuXG5cdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogbm9uZTtcblx0fVxuXG5cdCR7KHByb3BzKSA9PiAhcHJvcHMuZGlzYWJsZWQgJiYgIXByb3BzLmlzTG9hZGluZyAmJiBwcm9wcy5hY3RpdmF0ZWQgJiYgKHByb3BzLmJ1dHRvblR5cGUgPT0gXCJkYXNoQm9sZFwiIHx8IHByb3BzLmJ1dHRvblR5cGUgPT0gXCJkYXNoUmVndWxhclwiKSAmJiBgXG5cdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/IFwianVzdGlmeS1jb250ZW50OiBjZW50ZXI7XCIgOiBcIlwifVxuXHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHR3aWR0aDogMTAwJTtcblx0XHQub3ZlcmxheS1jb250YWluZXIge1xuXHRcdFx0ZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuXHRcdH1cblx0XHQke2AudGV4dCB7XG5cdFx0XHRjb2xvcjogJHtDT0xPUlMuY29udGVudC5icmFuZH0gIWltcG9ydGFudDtcblx0XHR9XG5cdFx0Lmljb24ge1xuXHRcdFx0Y29sb3I6ICR7Q09MT1JTLmJhY2tncm91bmQuYnJhbmR9O1xuXHRcdH1cblx0XHRgfVxuXHR9XG5cdCR7Z2V0Q2xpY2tFZmZlY3QocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cdCR7Z2V0RGFzaGVkQm9yZGVyU3R5bGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplLCBDT0xPUlMuY29udGVudC5icmFuZCl9XG5cdGB9XG5cblx0OmRpc2FibGVkIHtcblx0XHQub3ZlcmxheS1jb250YWluZXIge1xuXHRcdFx0ZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuXHRcdH1cblx0XHRjdXJzb3I6ICR7KHByb3BzKSA9PiBwcm9wcy5idXR0b25UeXBlID09PSBcInRleHRcIiA/IFwiYXV0b1wiIDogXCJub3QtYWxsb3dlZFwifTtcblx0XHQkeyhwcm9wcykgPT4gZ2VuZXJhdGVEaXNhYmxlZFN0eWxpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cdFx0LnRleHQge1xuXHRcdFx0Y29sb3I6ICR7KHByb3BzKSA9PiBnZXREaXNhYmxlZFRleHRDb2xvcihwcm9wcy5pbnZlcnNlKX0gIWltcG9ydGFudDtcblx0XHR9XG5cdFx0JHsocHJvcHMpID0+IGdldERhc2hlZEJvcmRlclN0eWxpbmcoXG4gIHByb3BzLmJ1dHRvblR5cGUsXG4gIHByb3BzLnNpemUsXG4gIENPTE9SUy5zdHJva2UucHJpbWFyeVxuKX1cblx0fVxuXG5cdCR7KHByb3BzKSA9PiAhcHJvcHMuZGlzYWJsZWQgJiYgIXByb3BzLmlzTG9hZGluZyAmJiBgOmFjdGl2ZSB7XG5cdFx0XHRcdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/IFwianVzdGlmeS1jb250ZW50OiBjZW50ZXI7XCIgOiBcIlwifVxuXHRcdFx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdFx0XHR3aWR0aDogMTAwJTtcblx0XHRcdFx0XHQub3ZlcmxheS1jb250YWluZXIge1xuXHRcdFx0XHRcdFx0ZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xuXHRcdFx0XHRcdH1cblx0XHRcdFx0XHQke3Byb3BzLnNpemUgPT09IFwiY2hpcFwiICYmIGAudGV4dCB7XG5cdFx0XHRcdFx0XHRjb2xvcjogJHtDT0xPUlMuYmFja2dyb3VuZC5pbnZlcnNlTGlnaHR9ICFpbXBvcnRhbnQ7XG5cdFx0XHRcdFx0fVxuXHRcdFx0XHRcdC5pY29uIHtcblx0XHRcdFx0XHRcdGNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmludmVyc2VMaWdodH07XG5cdFx0XHRcdFx0fVxuXHRcdFx0XHRcdGB9XG5cdFx0XHRcdH1cblxuXG5cdFx0XHQke2dldENsaWNrRWZmZWN0KHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UpfVxuXHRcdFx0JHtnZXREYXNoZWRCb3JkZXJTdHlsaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIENPTE9SUy5jb250ZW50LmJyYW5kKX1cblx0XHR9YH1cblxuXHQkeyhwcm9wcykgPT4gKFxuICAvLyBkbyBub3QgbG9hZCBob3ZlciBzdHlsZXMgZm9yIGxvYWRpbmcgc3RhdGUgYW5kIGFsc28gYWN0aXZlIHN0YXRlXG4gICFwcm9wcy5pc0xvYWRpbmcgPyBgOm5vdCg6YWN0aXZlKTpub3QoOmRpc2FibGVkKTpob3ZlciB7XG5cdFx0XHRwYWRkaW5nOiAwO1xuXHRcdFx0LmJ1dHRvbi1jb250YWluZXIge1xuXHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHQke3Byb3BzLm1hdGNoUGFyZW50V2lkdGggPyBcImp1c3RpZnktY29udGVudDogY2VudGVyO1wiIDogXCJcIn1cblx0XHRcdFx0cGFkZGluZzogJHtnZXRQYWRkaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUpfTtcblx0XHRcdFx0eyR7cHJvcHMuYnV0dG9uQ29sb3IgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmRDdXN0b20oXG4gICAgcHJvcHMuYnV0dG9uQ29sb3IsXG4gICAgMTVcbiAgKX1gIDogXCJcIn19XG5cdFx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdFx0ZGlzcGxheTogYmxvY2s7XG5cdFx0XHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHRcdFx0dG9wOiAwO1xuXHRcdFx0XHRcdGxlZnQ6IDA7XG5cdFx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdFx0aGVpZ2h0OiAxMDAlO1xuXHRcdFx0XHRcdCR7Z2V0SG92ZXJCdXR0b25CYWNrZ3JvdW5kKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLmludmVyc2UpfVxuXHRcdFx0XHR9XG5cdFx0XHRcdCR7cHJvcHMuc2l6ZSA9PT0gXCJjaGlwXCIgJiYgcHJvcHMuYnV0dG9uVHlwZSAhPT0gXCJ0ZXh0XCIgPyBwcm9wcy5kYXJrTW9kZSA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5zdHJva2UucHJpbWFyeX07YCA6IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5zdXJmYWNlLmhvdmVyZWR9O2AgOiBcIlwifVxuXHRcdFx0XHQke3Byb3BzLmJ1dHRvblR5cGUgPT09IFwicHJpbWFyeVwiICYmIHByb3BzLnNpemUgIT09IFwiY2hpcFwiICYmICFwcm9wcy5pbnZlcnNlICYmICFwcm9wcy5idXR0b25Db2xvciA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmludmVyc2V9O2AgOiBcIlwifVxuXHRcdFx0fVxuXHRcdFx0JHtwcm9wcy5idXR0b25UeXBlID09PSBcInRleHRcIiA/IGdldEhvdmVyQnV0dG9uVGV4dERlY29yYXRpb25TdHlsZShwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5kaXNhYmxlZCkgOiBcIlwifVxuXHRcdFx0JHtwcm9wcy5pbnZlcnNlID8gZ2VuZXJhdGVJbnZlcnNlSG92ZXJCYWNrZ3JvdW5kKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLmRpc2FibGVkKSA6IFwiXCJ9XG5cdFx0fWAgOiBgXG5cdFx0XHRjdXJzb3I6IG5vdC1hbGxvd2VkO1xuXHRcdFx0cGFkZGluZzogMDtcblx0XHQke2dldExvYWRpbmdCb3JkZXIocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cblx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHQudGV4dCB7XG5cdFx0XHRcdG9wYWNpdHk6IDA7XG5cdFx0XHR9XG5cdFx0XHQke3Byb3BzLmJ1dHRvbkNvbG9yID8gYGJhY2tncm91bmQtY29sb3I6ICR7Z2V0TG9hZGluZ0J1dHRvbkJhY2tncm91bmRDdXN0b20oXG4gICAgcHJvcHMuYnV0dG9uQ29sb3IsXG4gICAgMTVcbiAgKX07YCA6IFwiXCJ9XG5cdFx0XHRwYWRkaW5nOiAke2dldFBhZGRpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSl9O1xuXHRcdFx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRcdFx0ZGlzcGxheTogYmxvY2s7XG5cdFx0XHRcdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0XHRcdFx0cGFkZGluZzogMDtcblx0XHRcdFx0cGFkZGluZy10b3A6IDFweDtcblx0XHRcdFx0dG9wOiAwO1xuXHRcdFx0XHRsZWZ0OiAwO1xuXHRcdFx0XHR3aWR0aDogMTAwJTtcblx0XHRcdFx0aGVpZ2h0OiAxMDAlO1xuXHRcdFx0XHQke2dldExvYWRpbmdCYWNrZ3JvdW5kKFxuICAgIHByb3BzLmJ1dHRvblR5cGUsXG4gICAgcHJvcHMuc2l6ZSxcbiAgICBwcm9wcy5pbnZlcnNlLFxuICAgIHByb3BzLmJ1dHRvbkNvbG9yXG4gICl9XG5cdFx0XHRcdC5zcGlubmVyIHtcblx0XHRcdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHRcdFx0dG9wOiBjYWxjKDUwJSAtIDE0cHgpO1xuXHRcdFx0XHRcdGxlZnQ6IGNhbGMoNTAlIC0gN3B4KTtcblx0XHRcdFx0fVxuXG5cdFx0XHR9XG5cdFx0fWBcbil9XG5cblx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRnYXA6IDguMzNweDtcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/IFwibWFyZ2luOiBhdXRvO1wiIDogXCJcIn1cblx0fVxuYDtcbmV4cG9ydCBjb25zdCBCdXR0b25DdXN0b21EYXNoZWRCb3JkZXIgPSAoKSA9PiB7XG4gIHJldHVybiAvKiBAX19QVVJFX18gKi8ganN4cyhGcmFnbWVudCwgeyBjaGlsZHJlbjogW1xuICAgIC8qIEBfX1BVUkVfXyAqLyBqc3goXCJkaXZcIiwgeyBjbGFzc05hbWU6IFwibGluZS10b3BcIiB9KSxcbiAgICAvKiBAX19QVVJFX18gKi8ganN4KFwiZGl2XCIsIHsgY2xhc3NOYW1lOiBcImxpbmUtbGVmdFwiIH0pLFxuICAgIC8qIEBfX1BVUkVfXyAqLyBqc3goXCJkaXZcIiwgeyBjbGFzc05hbWU6IFwibGluZS1ib3R0b21cIiB9KSxcbiAgICAvKiBAX19QVVJFX18gKi8ganN4KFwiZGl2XCIsIHsgY2xhc3NOYW1lOiBcImxpbmUtcmlnaHRcIiB9KVxuICBdIH0pO1xufTtcbiJdfQ== */")),B=()=>c(d,{children:[b("div",{className:"line-top"}),b("div",{className:"line-left"}),b("div",{className:"line-bottom"}),b("div",{className:"line-right"})]});export{y as Button,B as ButtonCustomDashedBorder};
+import{jsxs as t,Fragment as n,jsx as e}from"react/jsx-runtime";import o from"@emotion/styled";import{COLORS as i}from"../../constants/Theme.js";import{getBackgroundColor as r,getPadding as a,getBorder as s,getColor as p,getDashedBorderStyling as d,getClickEffect as l,generateDisabledStyling as c,getDisabledTextColor as b,getHoverButtonBackgroundCustom as u,getHoverButtonBackground as h,getHoverButtonTextDecorationStyle as y,generateInverseHoverBackground as $,getLoadingBorder as v,getLoadingButtonBackgroundCustom as g,getLoadingBackground as x}from"./themes.js";const m=o.button`
+	all: unset;
+	cursor: pointer;
+	display: flex;
+	gap: 8.83px;
+	border-radius: ${t=>"text"==t.buttonType?"0":"4px"};
+	overflow: hidden;
+	${t=>t.matchParentWidth?"flex-grow: 1;":""}
+	background-color: ${t=>r(t.buttonType,t.size,t.inverse,t.darkMode,t.buttonColor)};
+
+	${t=>t.buttonType.startsWith("dash")?`.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tpadding: ${a(t.buttonType,t.size)};\n\t\t\t\t}`:`padding: ${a(t.buttonType,t.size)};\n\t${s(t.version??"1.0",t.buttonType,t.size,t.inverse,t.error)}`}
+
+	.icon-component {
+		height: ${t=>"chip"===t.size?"16px":"20px"};
+		width: ${t=>"chip"===t.size?"16px":"20px"};
+	}
+
+	.icon-trailing {
+		height: ${t=>"chip"===t.size?"16px":"20px"};
+		width: ${t=>"chip"===t.size?"16px":"20px"};
+	}
+
+	.text {
+		color: ${t=>p(t.buttonType,t.size,t.inverse,t.darkMode)};
+	}
+
+	.icon-leading {
+		height: ${t=>"chip"===t.size?"16px":"20px"};
+		width: ${t=>"chip"===t.size?"16px":"20px"};
+	}
+
+	${t=>d(t.buttonType,t.size,t.isLoading?i.stroke.brandLightAlt:t.error?i.stroke.negative.vibrant:void 0)}
+
+	.overlay-container {
+		display: none;
+	}
+
+	${t=>!t.disabled&&!t.isLoading&&t.activated&&("dashBold"==t.buttonType||"dashRegular"==t.buttonType)&&`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t.text {\n\t\t\tcolor: ${i.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${i.background.brand};\n\t\t}\n\t\t\n\t}\n\t${l(t.buttonType,t.size,t.inverse)}\n\t${d(t.buttonType,t.size,i.content.brand)}\n\t`}
+
+	:disabled {
+		.overlay-container {
+			display: none !important;
+		}
+		cursor: ${t=>"text"===t.buttonType?"auto":"not-allowed"};
+		${t=>c(t.buttonType,t.size,t.inverse)}
+		.text {
+			color: ${t=>b(t.inverse)} !important;
+		}
+		${t=>d(t.buttonType,t.size,i.stroke.primary)}
+	}
+
+	${t=>!t.disabled&&!t.isLoading&&`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${"chip"===t.size&&`.text {\n\t\t\t\t\t\tcolor: ${i.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${i.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t}\n\n\n\t\t\t${l(t.buttonType,t.size,t.inverse)}\n\t\t\t${d(t.buttonType,t.size,i.content.brand)}\n\t\t}`}
+
+	${t=>t.isLoading?`\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${v(t.buttonType,t.size,t.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${t.buttonColor?`background-color: ${g(t.buttonColor,15)};`:""}\n\t\t\tpadding: ${a(t.buttonType,t.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\tpadding-top: 1px;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${x(t.buttonType,t.size,t.inverse,t.buttonColor)}\n\t\t\t\t.spinner {\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\ttop: calc(50% - 14px);\n\t\t\t\t\tleft: calc(50% - 7px);\n\t\t\t\t}\n\n\t\t\t}\n\t\t}`:`:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\tpadding: ${a(t.buttonType,t.size)};\n\t\t\t\t{${t.buttonColor?`background-color: ${u(t.buttonColor,15)}`:""}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${h(t.buttonType,t.inverse)}\n\t\t\t\t}\n\t\t\t\t${"chip"===t.size&&"text"!==t.buttonType?t.darkMode?`background-color: ${i.stroke.primary};`:`background-color: ${i.surface.hovered};`:""}\n\t\t\t\t${"primary"!==t.buttonType||"chip"===t.size||t.inverse||t.buttonColor?"":`background-color: ${i.background.inverse};`}\n\t\t\t}\n\t\t\t${"text"===t.buttonType?y(t.buttonType,t.disabled):""}\n\t\t\t${t.inverse?$(t.buttonType,t.disabled):""}\n\t\t}`}
+
+		.button-container {
+		display: flex;
+		gap: 8.33px;
+		${t=>t.matchParentWidth?"margin: auto;":""}
+	}
+`,T=()=>t(n,{children:[e("div",{className:"line-top"}),e("div",{className:"line-left"}),e("div",{className:"line-bottom"}),e("div",{className:"line-right"})]});export{m as Button,T as ButtonCustomDashedBorder};

package/dist/esm/components/button/model.d.ts

@@ -0,0 +1,78 @@
+type Size = 'chip' | 'small' | 'medium' | 'large';
+type Type = 'primary' | 'secondary' | 'tertiary' | 'tertiaryGray' | 'destructive' | 'dashBold' | 'dashRegular' | 'text' | 'ai';
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    'data-test'?: string;
+    /**
+     * Font fize of the text
+     * @default default 'small'
+     */
+    size?: Size;
+    /**
+     * Text to render inside the button
+     * @default ''
+     */
+    buttonText?: string;
+    /**
+     * Whether the button is pressable or not
+     * @default true
+     */
+    disabled?: boolean;
+    /**
+     * Type of the button
+     * @default 'primary'
+     */
+    buttonType?: Type;
+    /**
+     * The icon component that needs to be render, if text also exists, this would be Trailing component
+     * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
+     * @default undefined
+     */
+    IconComponent?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    /**
+     * The icon component that is to the right of the buttonText
+     * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
+     * @default undefined
+     */
+    LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    /**
+     * Custom styles to be applied to the LeadingIcon
+     * @default undefined
+     */
+    LeadingIconStyles?: React.CSSProperties;
+    /**
+     * The icon component that is the left of the buttonText
+     * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
+     * @default undefined
+     */
+    TrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    /**
+     * the button container styling that needs to be override the default one
+     * @default null
+     */
+    style?: React.CSSProperties;
+    /**
+     * Indicates if button is loading and a loading indicator should be shown.
+     * When the button is loading the width of the button should not change.
+     */
+    isLoading?: boolean;
+    /**
+     * Indicates if the styling of the button should be inverse
+     */
+    inverse?: boolean;
+    /**
+     * Will take the width of the parent.
+     * @default false
+     */
+    matchParentWidth?: boolean;
+    subtitle?: string;
+    version?: '1.0' | '2.0';
+    darkMode?: boolean;
+    activated?: boolean;
+    error?: boolean;
+    buttonTextColor?: string;
+    customIconColor?: string;
+    buttonColor?: string;
+    buttonFontSize?: number;
+}
+
+export type { ButtonProps, Size, Type };

package/dist/esm/components/button/themes.js

@@ -1 +1 @@
-import{COLORS as t}from"../../constants/Theme.js";import{ButtonRegularAI as r,ButtonLargeAI as n,BodySecondary as e,BodyCaption as a,ButtonRegular as o,ButtonLarge as i}from"../TypographyStyle.js";const c=(r,n,e,a,o)=>{if("chip"===n)return"text"===r?"transparent":a?t.surface.hovered:t.surface.subdued;switch(r){case"primary":return o||(e?t.background.warning.vibrant:t.background.inverseLight);case"destructive":return t.background.negative.vibrant;default:return"transparent"}},d=(r,n,e,a)=>{if("chip"===n)return"text"===r?e?t.content.inactive:t.content.brand:a?t.content.primary:t.content.secondary;switch(r){case"primary":return e?t.content.primary:t.content.primaryInverse;case"tertiaryGray":case"dashBold":case"dashRegular":return t.content.secondary;case"destructive":return t.content.primaryInverse;case"ai":return t.content.ai;default:return e?t.content.primaryInverse:t.stroke.brand}},s=r=>r?"rgba(255, 255, 255, 0.5)":t.content.inactive,p=(t,r)=>{if("text"===t)return"0px";if("chip"===r)return"4px 8px";if("small"===r)switch(t){case"tertiary":case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if("medium"===r)switch(t){case"tertiary":case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if("large"===r)switch(t){case"tertiary":case"tertiaryGray":return"14px 4px";default:return"14px 12px"}},u=(t,c,d)=>d||"ai"!==c?"dashRegular"===c?e:"chip"===t?a:"small"===t?o:i:"small"===t?r:n,b=(r,n,e)=>e?t.stroke.negative.vibrant:n?t.surface.standard:"secondary"==r?t.stroke.brand:t.content.placeholder,g=(r,n,e,a,o)=>"text"==n?"border: none;":"chip"===e?`border: ${"2.0"===r?.5:1}px solid ${t.stroke.primary};`:a?"secondary"===n?`border: ${"2.0"===r?.5:1}px solid ${b(n,a,o)};`:"border: none;":"secondary"===n?`border: ${"2.0"===r?.5:1}px solid ${b(n,!1,o)};`:"border: none;",l=t=>"medium"===t?"5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px":"6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px",h=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),a=(n>>16)-e,o=(n>>8&255)-e,i=(255&n)-e;return`#${(16777216+(Math.max(a,0)<<16)+(Math.max(o,0)<<8)+Math.max(i,0)).toString(16).slice(1)}`},x=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),a=(n>>16)+e,o=(n>>8&255)+e,i=(255&n)+e;return`#${(16777216+(Math.min(a,255)<<16)+(Math.min(o,255)<<8)+Math.min(i,255)).toString(16).slice(1)}`},y=(r,n)=>"ai"===r?`background: ${t.surface.aiLight};`:"text"===r?"background-color:transparent;":n||"primary"===r?"":"background-color: #000000;\n\t\t\t\topacity: 0.03;",m=(r,n)=>n?"":`text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.content.brand};`,k=(r,n)=>n?"":"primary"===r?`background-color: ${t.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",$=(r,n,e)=>"chip"===n?"background-color: transparent;":"primary"===r||"destructive"===r?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${t.background.inactive};`:"secondary"===r?e?"border: 1px solid rgba(255, 255, 255, 0.5);":`border: 1px solid ${t.stroke.primary};`:"",v=function(t,r){let n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:b(t,!1);return`\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t`},f=(r,n,e)=>"text"===r?`background-color: ${t.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.content.brand};`:"chip"===n?`border: 1px solid ${t.stroke.brandLightAlt};\n\t\tbackground-color: ${t.background.brandLight};`:"primary"===r||"destructive"===r?e?`background-color: ${t.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);":"secondary"===r||"tertiary"===r||"tertiaryGray"===r||r.startsWith("dash")?e?`background-color: ${t.background.inverseLight}  !important;`:`background-color: ${t.background.brandLight};`:void 0,w=(r,n,e,a)=>"chip"===n?`background-color: ${t.background.base};`:"primary"===r?a?`background-color: ${x(a,50)};`:`background-color: ${e?t.background.warning.vibrant:t.background.brandLight};`:"destructive"===r?`background-color: ${t.background.negative.light};`:"background-color: transparent;",L=(r,n,e)=>"chip"===n?"border: none;":"secondary"===r?e?`border: 1px solid ${t.content.secondary};`:`border: 1px solid ${t.stroke.brandLightAlt};`:"",I=(r,n)=>n?"primary"===r?t.content.primary:t.content.primaryInverse:"destructive"===r?t.content.negative:t.content.brand,M=(r,n,e,a,o,i)=>"chip"===r?a?t.content.inactive:i?t.content.primary:t.content.secondary:o?"transparent":"primary"===n||"destructive"===n?e?a?"rgba(255, 255, 255, 0.5)":t.content.primary:a?t.content.inactive:t.content.primaryInverse:"secondary"===n||"tertiary"===n?e?a?"rgba(255, 255, 255, 0.5)":t.content.primaryInverse:a?t.content.inactive:t.content.brand:"tertiaryGray"===n||n.startsWith("dash")?a?t.content.inactive:t.content.secondary:void 0;export{u as GetButtonTextComponent,I as SpinnerColorMap,$ as generateDisabledStyling,k as generateInverseHoverBackground,c as getBackgroundColor,g as getBorder,b as getBorderColor,M as getButtonIconColor,f as getClickEffect,d as getColor,v as getDashedBorderStyling,s as getDisabledTextColor,y as getHoverButtonBackground,h as getHoverButtonBackgroundCustom,m as getHoverButtonTextDecorationStyle,l as getLinearGradientValue,w as getLoadingBackground,L as getLoadingBorder,x as getLoadingButtonBackgroundCustom,p as getPadding};
+import{COLORS as t}from"../../constants/Theme.js";import{ButtonRegularAI as r,ButtonLargeAI as n,BodySecondary as e,BodyCaption as a,ButtonRegular as o,ButtonLarge as i}from"../TypographyStyle.js";const c=(r,n,e,a,o)=>{if("chip"===n)return"text"===r?"transparent":a?t.surface.hovered:t.surface.subdued;switch(r){case"primary":return o||(e?t.background.warning.vibrant:t.background.inverseLight);case"destructive":return t.background.negative.vibrant;default:return"transparent"}},d=(r,n,e,a)=>{if("chip"===n)return"text"===r?e?t.content.inactive:t.content.brand:a?t.content.primary:t.content.secondary;switch(r){case"primary":return e?t.content.primary:t.content.primaryInverse;case"tertiaryGray":case"dashBold":case"dashRegular":return t.content.secondary;case"destructive":return t.content.primaryInverse;case"ai":return t.content.ai;default:return e?t.content.primaryInverse:t.stroke.brand}},s=r=>r?"rgba(255, 255, 255, 0.5)":t.content.inactive,p=(t,r)=>{if("text"===t)return"0px";if("chip"===r)return"4px 8px";if("small"===r)switch(t){case"tertiary":case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if("medium"===r)switch(t){case"tertiary":case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if("large"===r)switch(t){case"tertiary":case"tertiaryGray":return"14px 4px";default:return"14px 12px"}},b=(t,c,d)=>d||"ai"!==c?"dashRegular"===c?e:"chip"===t?a:"small"===t?o:i:"small"===t?r:n,u=(r,n,e)=>e?t.stroke.negative.vibrant:n?t.surface.standard:"secondary"==r?t.stroke.brand:t.content.placeholder,g=(r,n,e,a,o)=>"text"==n?"border: none;":"chip"===e?`border: ${"2.0"===r?.5:1}px solid ${t.stroke.primary};`:a?"secondary"===n?`border: ${"2.0"===r?.5:1}px solid ${u(n,a,o)};`:"border: none;":"secondary"===n?`border: ${"2.0"===r?.5:1}px solid ${u(n,!1,o)};`:"border: none;",l=t=>"medium"===t?"5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px":"6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px",h=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),a=(n>>16)-e,o=(n>>8&255)-e,i=(255&n)-e;return`#${(16777216+(Math.max(a,0)<<16)+(Math.max(o,0)<<8)+Math.max(i,0)).toString(16).slice(1)}`},x=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),a=(n>>16)+e,o=(n>>8&255)+e,i=(255&n)+e;return`#${(16777216+(Math.min(a,255)<<16)+(Math.min(o,255)<<8)+Math.min(i,255)).toString(16).slice(1)}`},y=(r,n)=>"ai"===r?`background: ${t.surface.aiLight};`:"text"===r?"background-color:transparent;":n||"primary"===r?"":"background-color: #000000;\n\t\t\t\topacity: 0.03;",m=(r,n)=>n?"":`text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.content.brand};`,k=(r,n)=>n?"":"primary"===r?`background-color: ${t.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",$=(r,n,e)=>"chip"===n?"background-color: transparent;":"primary"===r||"destructive"===r?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${t.background.inactive};`:"secondary"===r?e?"border: 1px solid rgba(255, 255, 255, 0.5);":`border: 1px solid ${t.stroke.primary};`:"",v=(t,r,n=u(t,!1))=>`\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${n},\n\t\t\t${n}\n\t\t\t\t${l(r)}\n\t\t);\n\t}\n\t`,f=(r,n,e)=>"text"===r?`background-color: ${t.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.content.brand};`:"chip"===n?`border: 1px solid ${t.stroke.brandLightAlt};\n\t\tbackground-color: ${t.background.brandLight};`:"primary"===r||"destructive"===r?e?`background-color: ${t.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);":"secondary"===r||"tertiary"===r||"tertiaryGray"===r||r.startsWith("dash")?e?`background-color: ${t.background.inverseLight}  !important;`:`background-color: ${t.background.brandLight};`:void 0,w=(r,n,e,a)=>"chip"===n?`background-color: ${t.background.base};`:"primary"===r?a?`background-color: ${x(a,50)};`:`background-color: ${e?t.background.warning.vibrant:t.background.brandLight};`:"destructive"===r?`background-color: ${t.background.negative.light};`:"background-color: transparent;",L=(r,n,e)=>"chip"===n?"border: none;":"secondary"===r?e?`border: 1px solid ${t.content.secondary};`:`border: 1px solid ${t.stroke.brandLightAlt};`:"",I=(r,n)=>n?"primary"===r?t.content.primary:t.content.primaryInverse:"destructive"===r?t.content.negative:t.content.brand,M=(r,n,e,a,o,i)=>"chip"===r?a?t.content.inactive:i?t.content.primary:t.content.secondary:o?"transparent":"primary"===n||"destructive"===n?e?a?"rgba(255, 255, 255, 0.5)":t.content.primary:a?t.content.inactive:t.content.primaryInverse:"secondary"===n||"tertiary"===n?e?a?"rgba(255, 255, 255, 0.5)":t.content.primaryInverse:a?t.content.inactive:t.content.brand:"tertiaryGray"===n||n.startsWith("dash")?a?t.content.inactive:t.content.secondary:void 0;export{b as GetButtonTextComponent,I as SpinnerColorMap,$ as generateDisabledStyling,k as generateInverseHoverBackground,c as getBackgroundColor,g as getBorder,u as getBorderColor,M as getButtonIconColor,f as getClickEffect,d as getColor,v as getDashedBorderStyling,s as getDisabledTextColor,y as getHoverButtonBackground,h as getHoverButtonBackgroundCustom,m as getHoverButtonTextDecorationStyle,l as getLinearGradientValue,w as getLoadingBackground,L as getLoadingBorder,x as getLoadingButtonBackgroundCustom,p as getPadding};

package/dist/esm/components/buttonGroup/ButtonGroup.d.ts

@@ -0,0 +1,26 @@
+import React__default from 'react';
+
+interface ButtonGroupInterface {
+    id: string;
+    title: string;
+    icon?: React__default.FunctionComponent<React__default.SVGAttributes<SVGElement>>;
+}
+interface ButtonGroupProps {
+    id?: string;
+    width?: string;
+    gap?: string;
+    iconWidth?: string;
+    iconHeight?: string;
+    iconPosition?: 'left' | 'right' | 'top';
+    onButtonClick: (buttonId: string) => void;
+    activeButtonId?: string;
+    buttonGroup: Array<ButtonGroupInterface>;
+    size: 'small' | 'medium' | 'large';
+    matchParentWidth?: boolean;
+    borderRadius?: string;
+    backgroundColor?: string;
+}
+declare const ButtonGroup: React__default.FC<ButtonGroupProps>;
+
+export { ButtonGroup };
+export type { ButtonGroupInterface, ButtonGroupProps };

package/dist/esm/components/buttonGroup/ButtonGroup.js

@@ -1 +1 @@
-import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useState as t,useEffect as n}from"react";import{BodySecondary as r}from"../TypographyStyle.js";import{COLORS as e}from"../../constants/Theme.js";import{ButtonGroupStyle as d,Button as c}from"./ButtonGroupStyle.js";const s=s=>{const[a,l]=t(void 0);n((()=>{l(s.activeButtonId||void 0)}),[null==s?void 0:s.activeButtonId]);return o(d,{className:"button-group",width:s.width||"100%",gap:s.gap,size:s.size,children:s.buttonGroup.map((t=>{var n,d;const u=null==t?void 0:t.icon;return i(c,{borderRadius:null!=(n=s.borderRadius)?n:"4px",matchParentWidth:null==(d=s.matchParentWidth)||d,className:"button",isActive:a===t.id,onClick:()=>(o=>{l(o.id),s.onButtonClick(o.id)})(t),iconPosition:s.iconPosition,size:s.size,backgroundColor:s.backgroundColor||e.surface.subdued,children:[(null==s?void 0:s.iconPosition)&&u&&o("div",{className:"button__image",children:o(u,{color:a===t.id?e.background.inverseLight:e.content.secondary,width:(null==s?void 0:s.iconWidth)||"18px",height:(null==s?void 0:s.iconHeight)||"18px"})}),o("div",{className:"button__name",children:o(r,{style:{color:a===t.id?e.background.inverseLight:e.content.secondary},children:t.title})})]},t.id)}))})};export{s as ButtonGroup};
+import{jsx as t,jsxs as o}from"react/jsx-runtime";import{useState as i,useEffect as n}from"react";import{BodySecondary as e}from"../TypographyStyle.js";import{COLORS as r}from"../../constants/Theme.js";import{ButtonGroupStyle as c,Button as d}from"./ButtonGroupStyle.js";const s=s=>{const[a,u]=i(void 0);n((()=>{u(s.activeButtonId||void 0)}),[s?.activeButtonId]);return t(c,{className:"button-group",width:s.width||"100%",gap:s.gap,size:s.size,children:s.buttonGroup.map((i=>{const n=i?.icon;return o(d,{borderRadius:s.borderRadius??"4px",matchParentWidth:s.matchParentWidth??!0,className:"button",isActive:a===i.id,onClick:()=>(t=>{u(t.id),s.onButtonClick(t.id)})(i),iconPosition:s.iconPosition,size:s.size,backgroundColor:s.backgroundColor||r.surface.subdued,children:[s?.iconPosition&&n&&t("div",{className:"button__image",children:t(n,{color:a===i.id?r.background.inverseLight:r.content.secondary,width:s?.iconWidth||"18px",height:s?.iconHeight||"18px"})}),t("div",{className:"button__name",children:t(e,{style:{color:a===i.id?r.background.inverseLight:r.content.secondary},children:i.title})})]},i.id)}))})};export{s as ButtonGroup};

package/dist/esm/components/card-selection-modal/CardSelectionModal.d.ts

@@ -0,0 +1,21 @@
+import React__default from 'react';
+
+type CardSelectionModalProps = {
+    isOpen: boolean;
+    title?: string;
+    subTitle?: string;
+    infoText?: string;
+    cards: SelectionCardData[];
+    onCardSelected: (value: string) => void;
+    onClose: () => void;
+};
+type SelectionCardData = {
+    icon?: React__default.FunctionComponent<React__default.SVGAttributes<SVGElement>>;
+    value: string;
+    title: string;
+    description: string;
+};
+declare const CardSelectionModal: React__default.FC<CardSelectionModalProps>;
+
+export { CardSelectionModal };
+export type { CardSelectionModalProps, SelectionCardData };

package/dist/esm/components/card-selection-modal/CardSelectionModal.styled.js

@@ -1 +1,41 @@
-import c from"@emotion/styled/base";import{DEFAULT_THEME as l}from"../../constants/Theme.js";const b=c("div","production"===process.env.NODE_ENV?{target:"epoh28g1"}:{target:"epoh28g1",label:"StyledCardContainer"})("production"===process.env.NODE_ENV?{name:"1psm388",styles:"display:flex;flex-direction:column;gap:12px;.cards__wrapper{padding:0 24px;display:flex;flex-wrap:wrap;gap:16px;}.info__wrapper{padding:0 24px 24px 24px;display:flex;align-items:center;gap:4px;}"}:{name:"1psm388",styles:"display:flex;flex-direction:column;gap:12px;.cards__wrapper{padding:0 24px;display:flex;flex-wrap:wrap;gap:16px;}.info__wrapper{padding:0 24px 24px 24px;display:flex;align-items:center;gap:4px;}",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhcmRTZWxlY3Rpb25Nb2RhbC5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUc2QyIsImZpbGUiOiJDYXJkU2VsZWN0aW9uTW9kYWwuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBERUZBVUxUX1RIRU1FIH0gZnJvbSBcIkBzcmMvY29uc3RhbnRzL1RoZW1lXCI7XG5leHBvcnQgY29uc3QgU3R5bGVkQ2FyZENvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cdGdhcDogMTJweDtcblx0LmNhcmRzX193cmFwcGVyIHtcblx0XHRwYWRkaW5nOiAwIDI0cHg7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRmbGV4LXdyYXA6IHdyYXA7XG5cdFx0Z2FwOiAxNnB4O1xuXHR9XG5cdC5pbmZvX193cmFwcGVyIHtcblx0XHRwYWRkaW5nOiAwIDI0cHggMjRweCAyNHB4O1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0YWxpZ24taXRlbXM6IGNlbnRlcjtcblx0XHRnYXA6IDRweDtcblx0fVxuYDtcbmV4cG9ydCBjb25zdCBTdHlsZWRDYXJkID0gc3R5bGVkLmRpdmBcblx0d2lkdGg6IDIxMnB4O1xuXHRwYWRkaW5nOiAxNnB4O1xuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuXHRnYXA6IDhweDtcblx0YmFja2dyb3VuZC1jb2xvcjogJHtERUZBVUxUX1RIRU1FLmNvbG9yc1YyLnN1cmZhY2Uuc3RhbmRhcmR9O1xuXHRib3JkZXI6IDFweCBzb2xpZCAke0RFRkFVTFRfVEhFTUUuY29sb3JzVjIuc3Ryb2tlLnByaW1hcnl9O1xuXHRib3JkZXItcmFkaXVzOiA0cHg7XG5cdGN1cnNvcjogcG9pbnRlcjtcblxuXHQmOmhvdmVyIHtcblx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAke0RFRkFVTFRfVEhFTUUuY29sb3JzVjIuc3VyZmFjZS5ob3ZlcmVkfTtcblx0fVxuXG5cdC5pY29uX19jb250YWluZXIge1xuXHRcdHdpZHRoOiA0OHB4O1xuXHRcdGhlaWdodDogNDhweDtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdFx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdFx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRcdGJhY2tncm91bmQtY29sb3I6ICR7REVGQVVMVF9USEVNRS5jb2xvcnNWMi5iYWNrZ3JvdW5kLmJyYW5kTGlnaHR9O1xuXHR9XG5gO1xuIl19 */",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)."}}),d=c("div","production"===process.env.NODE_ENV?{target:"epoh28g0"}:{target:"epoh28g0",label:"StyledCard"})("width:212px;padding:16px;display:flex;flex-direction:column;gap:8px;background-color:",l.colorsV2.surface.standard,";border:1px solid ",l.colorsV2.stroke.primary,";border-radius:4px;cursor:pointer;&:hover{background-color:",l.colorsV2.surface.hovered,";}.icon__container{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:",l.colorsV2.background.brandLight,";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhcmRTZWxlY3Rpb25Nb2RhbC5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9Cb0MiLCJmaWxlIjoiQ2FyZFNlbGVjdGlvbk1vZGFsLnN0eWxlZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJcInVzZSBzdHJpY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgREVGQVVMVF9USEVNRSB9IGZyb20gXCJAc3JjL2NvbnN0YW50cy9UaGVtZVwiO1xuZXhwb3J0IGNvbnN0IFN0eWxlZENhcmRDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuXHRnYXA6IDEycHg7XG5cdC5jYXJkc19fd3JhcHBlciB7XG5cdFx0cGFkZGluZzogMCAyNHB4O1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0ZmxleC13cmFwOiB3cmFwO1xuXHRcdGdhcDogMTZweDtcblx0fVxuXHQuaW5mb19fd3JhcHBlciB7XG5cdFx0cGFkZGluZzogMCAyNHB4IDI0cHggMjRweDtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdFx0Z2FwOiA0cHg7XG5cdH1cbmA7XG5leHBvcnQgY29uc3QgU3R5bGVkQ2FyZCA9IHN0eWxlZC5kaXZgXG5cdHdpZHRoOiAyMTJweDtcblx0cGFkZGluZzogMTZweDtcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcblx0Z2FwOiA4cHg7XG5cdGJhY2tncm91bmQtY29sb3I6ICR7REVGQVVMVF9USEVNRS5jb2xvcnNWMi5zdXJmYWNlLnN0YW5kYXJkfTtcblx0Ym9yZGVyOiAxcHggc29saWQgJHtERUZBVUxUX1RIRU1FLmNvbG9yc1YyLnN0cm9rZS5wcmltYXJ5fTtcblx0Ym9yZGVyLXJhZGl1czogNHB4O1xuXHRjdXJzb3I6IHBvaW50ZXI7XG5cblx0Jjpob3ZlciB7XG5cdFx0YmFja2dyb3VuZC1jb2xvcjogJHtERUZBVUxUX1RIRU1FLmNvbG9yc1YyLnN1cmZhY2UuaG92ZXJlZH07XG5cdH1cblxuXHQuaWNvbl9fY29udGFpbmVyIHtcblx0XHR3aWR0aDogNDhweDtcblx0XHRoZWlnaHQ6IDQ4cHg7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRcdGp1c3RpZnktY29udGVudDogY2VudGVyO1xuXHRcdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAke0RFRkFVTFRfVEhFTUUuY29sb3JzVjIuYmFja2dyb3VuZC5icmFuZExpZ2h0fTtcblx0fVxuYDtcbiJdfQ== */"));export{d as StyledCard,b as StyledCardContainer};
+import r from"@emotion/styled";import{DEFAULT_THEME as o}from"../../constants/Theme.js";const e=r.div`
+	display: flex;
+	flex-direction: column;
+	gap: 12px;
+	.cards__wrapper {
+		padding: 0 24px;
+		display: flex;
+		flex-wrap: wrap;
+		gap: 16px;
+	}
+	.info__wrapper {
+		padding: 0 24px 24px 24px;
+		display: flex;
+		align-items: center;
+		gap: 4px;
+	}
+`,p=r.div`
+	width: 212px;
+	padding: 16px;
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+	background-color: ${o.colorsV2.surface.standard};
+	border: 1px solid ${o.colorsV2.stroke.primary};
+	border-radius: 4px;
+	cursor: pointer;
+
+	&:hover {
+		background-color: ${o.colorsV2.surface.hovered};
+	}
+
+	.icon__container {
+		width: 48px;
+		height: 48px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border-radius: 50%;
+		background-color: ${o.colorsV2.background.brandLight};
+	}
+`;export{p as StyledCard,e as StyledCardContainer};

package/dist/esm/components/card-selector/CardSelector.d.ts

@@ -0,0 +1,20 @@
+import React__default from 'react';
+
+type CardSelectorProps = {
+    id: number;
+    icon?: React__default.FunctionComponent<React__default.SVGAttributes<SVGElement>>;
+    title?: string;
+    subtitle?: string;
+    selected: boolean;
+    loading?: boolean;
+    disabled?: boolean;
+    dataTestId?: string;
+    tooltip?: string;
+};
+type CardSelectorInternalProps = CardSelectorProps & {
+    onCardClick: (id: number) => void;
+};
+declare const CardSelector: React__default.FC<CardSelectorInternalProps>;
+
+export { CardSelector };
+export type { CardSelectorProps };

package/dist/esm/components/card-selector/CardSelector.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import{COLORS as i}from"../../constants/Theme.js";import{Spinner as n}from"../spinner/Spinner.js";import{Tooltip as o}from"../tooltips/Tooltip.js";import{TitleSmall as r,BodyCaption as d}from"../TypographyStyle.js";import{Container as c,Loader as a}from"./CardSelector.styled.js";var s=Object.defineProperty,p=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,h=(e,t,l)=>t in e?s(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,y=(e,t)=>{for(var l in t||(t={}))b.call(t,l)&&h(e,l,t[l]);if(p)for(var l of p(t))m.call(t,l)&&h(e,l,t[l]);return e};const u=l=>{var i,n,r,d;return e(t,{children:l.tooltip?e(o,{title:l.tooltip,children:e(c,{style:{alignItems:l.title&&l.subtitle?"flex-start":"center"},selected:l.selected,disabled:null!=(i=l.disabled)&&i,loading:null!=(n=l.loading)&&n,onClick:()=>{l.disabled||l.loading||l.onCardClick(l.id)},isTooltipPresent:!!l.tooltip,children:e(g,y({},l))})}):e(c,{style:{alignItems:l.title&&l.subtitle?"flex-start":"center"},selected:l.selected,disabled:null!=(r=l.disabled)&&r,loading:null!=(d=l.loading)&&d,onClick:()=>{l.disabled||l.loading||l.onCardClick(l.id)},isTooltipPresent:!!l.tooltip,children:e(g,y({},l))})})},g=o=>e(t,{children:o.loading?e(a,{children:e(n,{size:"large"})}):l(t,{children:[(null==o?void 0:o.icon)&&e("div",{style:{width:24,height:24},children:e(o.icon,{width:24,color:o.selected?i.content.brand:o.disabled?i.content.inactive:i.content.placeholder})}),l("div",{"data-test":null==o?void 0:o.dataTestId,children:[o.title&&e(r,{style:{color:o.selected?i.content.brand:o.disabled?i.content.inactive:i.content.secondary},children:o.title}),o.subtitle&&e(d,{style:{marginTop:o.title?4:0,color:o.selected?i.content.brand:o.disabled?i.content.inactive:i.content.secondary},children:o.subtitle})]})]})});export{u as CardSelector};
+import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import{COLORS as l}from"../../constants/Theme.js";import{Spinner as n}from"../spinner/Spinner.js";import{Tooltip as o}from"../tooltips/Tooltip.js";import{TitleSmall as d,BodyCaption as r}from"../TypographyStyle.js";import{Container as s,Loader as c}from"./CardSelector.styled.js";const a=i=>e(t,{children:i.tooltip?e(o,{title:i.tooltip,children:e(s,{style:{alignItems:i.title&&i.subtitle?"flex-start":"center"},selected:i.selected,disabled:i.disabled??!1,loading:i.loading??!1,onClick:()=>{i.disabled||i.loading||i.onCardClick(i.id)},isTooltipPresent:!!i.tooltip,children:e(p,{...i})})}):e(s,{style:{alignItems:i.title&&i.subtitle?"flex-start":"center"},selected:i.selected,disabled:i.disabled??!1,loading:i.loading??!1,onClick:()=>{i.disabled||i.loading||i.onCardClick(i.id)},isTooltipPresent:!!i.tooltip,children:e(p,{...i})})}),p=o=>e(t,{children:o.loading?e(c,{children:e(n,{size:"large"})}):i(t,{children:[o?.icon&&e("div",{style:{width:24,height:24},children:e(o.icon,{width:24,color:o.selected?l.content.brand:o.disabled?l.content.inactive:l.content.placeholder})}),i("div",{"data-test":o?.dataTestId,children:[o.title&&e(d,{style:{color:o.selected?l.content.brand:o.disabled?l.content.inactive:l.content.secondary},children:o.title}),o.subtitle&&e(r,{style:{marginTop:o.title?4:0,color:o.selected?l.content.brand:o.disabled?l.content.inactive:l.content.secondary},children:o.subtitle})]})]})});export{a as CardSelector};

package/dist/esm/components/card-selector/CardSelectorGroup.d.ts

@@ -0,0 +1,14 @@
+import React__default from 'react';
+import { CardSelectorProps } from './CardSelector.js';
+
+type CardSelectorGroupProps = {
+    gap?: number;
+    align?: 'horizontal' | 'vertical';
+    cards: CardSelectorProps[];
+    onClick: (id: number) => void;
+    'data-test': string;
+};
+declare const CardSelectorGroup: React__default.FC<CardSelectorGroupProps>;
+
+export { CardSelectorGroup };
+export type { CardSelectorGroupProps };

package/dist/esm/components/carousel/carousel.d.ts

@@ -0,0 +1,6 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CarouselProps } from '@trendyol-js/react-carousel/dist/types/components/carousel';
+
+declare const Carousel: (props: CarouselProps) => react_jsx_runtime.JSX.Element;
+
+export { Carousel };

package/dist/esm/components/carousel/carousel.js

@@ -1,4 +1,4 @@
-import{jsx as r,Fragment as e}from"react/jsx-runtime";import t from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight.svg.js";import{Carousel as i}from"@trendyol-js/react-carousel";import s from"styled-components";var n=Object.defineProperty,a=Object.defineProperties,c=Object.getOwnPropertyDescriptors,l=Object.getOwnPropertySymbols,f=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable,h=(r,e,t)=>e in r?n(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,m=(r,e)=>{for(var t in e||(e={}))f.call(e,t)&&h(r,t,e[t]);if(l)for(var t of l(e))p.call(e,t)&&h(r,t,e[t]);return r};const d=()=>r(u,{className:"left",children:r(t,{width:16,height:16,color:"#fff"})}),g=()=>r(u,{className:"right",children:r(o,{width:16,height:16,color:"#fff"})}),b=t=>{return r(e,{children:r(i,(o=m({leftArrow:r(d,{}),rightArrow:r(g,{})},t),s={children:t.children},a(o,c(s))))});var o,s},u=s.div`
+import{jsx as r,Fragment as t}from"react/jsx-runtime";import e from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight.svg.js";import{Carousel as i}from"@trendyol-js/react-carousel";import s from"styled-components";const n=()=>r(l,{className:"left",children:r(e,{width:16,height:16,color:"#fff"})}),a=()=>r(l,{className:"right",children:r(o,{width:16,height:16,color:"#fff"})}),c=e=>r(t,{children:r(i,{leftArrow:r(n,{}),rightArrow:r(a,{}),...e,children:e.children})}),l=s.div`
 	cursor: pointer;
 	margin: 0 8px;
 	width: 50px;
@@ -19,4 +19,4 @@ import{jsx as r,Fragment as e}from"react/jsx-runtime";import t from"../../assets
 		transform: translate(0%, -50%);
 		right: 0;
 	}
-`;export{b as Carousel};
+`;export{c as Carousel};

package/dist/esm/components/carousel-preview/CarouselPreview.d.ts

@@ -0,0 +1,16 @@
+import React__default from 'react';
+import { CHANNEL_TYPE } from '../template-preview/models/Channels.js';
+import { AllTemplateTypes } from '../template-preview/models/types.js';
+
+declare const CarouselPreview: React__default.ForwardRefExoticComponent<{
+    channel: CHANNEL_TYPE;
+    template: AllTemplateTypes;
+    showSampleValues?: boolean | undefined;
+    isPreview?: boolean | undefined;
+    removeBottomBorder?: boolean | undefined;
+    borderRadius?: string | undefined;
+    showArrows?: boolean | undefined;
+    hideBorder?: boolean | undefined;
+} & React__default.RefAttributes<HTMLDivElement>>;
+
+export { CarouselPreview };

package/dist/esm/components/carousel-preview/CarouselPreview.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import o from"react";import l from"react-slick";import{Container as t,CarouselSlickContainer as s}from"./CarouselPreview.style.js";import n from"./CarouselPreviewCard.js";import{useTemplateModalContext as a}from"../template-context-mapper/context/templateModalContext.js";import{determineCardIndex as i,isRCSChannel as d}from"../template-preview/helpers/templateMiscHelper.js";import{RCSCarousalContainer as u}from"../template-preview/RCS/RCSPreview.styled.js";import{CustomCarouselRightArrow as m,CustomCarouselLeftArrow as p}from"./CustomCarouselArrows.js";const c=o.forwardRef((o=>{let{channel:l,template:s,isPreview:m,removeBottomBorder:p,borderRadius:c,showArrows:w,hideBorder:h,showSampleValues:C}=o;var f,x;const{sliderRef:I,selectedCarouselIndex:P,cardCount:R,setIsCarouselHovered:S,cardIndex:j}=a(),g=-1==j?i(l):j,A=null==(x=null==(f=null==s?void 0:s.components)?void 0:f[g])?void 0:x.cards,B=(null==A?void 0:A.length)?e(v,{cards:A,cardCount:null!=R?R:0,selectedCarouselIndex:null!=P?P:-1,sliderRef:I,isPreview:m,showArrows:w,channel:l,template:s,setIsCarouselHovered:S,showSampleValues:!!C}):null;return d(l)?e(u,{borderRadius:c,children:B}):r(t,{removeBottomBorder:p,borderRadius:c,hideBorder:h,children:[e(n,{channel:l,currentTemplate:s,carouselCardIndex:-1,isPreview:m,width:"77%"}),B]})})),v=r=>{let{cards:o,cardCount:t,selectedCarouselIndex:a,sliderRef:i,isPreview:d,showArrows:u,channel:c,template:v,setIsCarouselHovered:w,showSampleValues:h}=r;return e(s,{cardCount:t,selectedCarouselIndex:a,onMouseEnter:()=>null==w?void 0:w(!0),onMouseLeave:()=>null==w?void 0:w(!1),children:e(l,{ref:i,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!d,centerMode:!0,arrows:u,adaptiveHeight:!0,nextArrow:e(m,{isPreview:null!=d&&d}),prevArrow:e(p,{isPreview:null!=d&&d}),children:null==o?void 0:o.map(((r,o)=>{var l,t;const s={components:r.components,mapping:null==(t=null==(l=null==v?void 0:v.mapping)?void 0:l.cards)?void 0:t[o],content:null==v?void 0:v.content,templateType:null==v?void 0:v.templateType};return e(n,{channel:c,currentTemplate:s,carouselCardIndex:o,isPreview:d,width:"100%",showSampleValues:h},o)}))})})};export{c as CarouselPreview};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import o from"react";import t from"react-slick";import{Container as s,CarouselSlickContainer as a}from"./CarouselPreview.style.js";import l from"./CarouselPreviewCard.js";import{useTemplateModalContext as n}from"../template-context-mapper/context/templateModalContext.js";import{determineCardIndex as i,isRCSChannel as d}from"../template-preview/helpers/templateMiscHelper.js";import{RCSCarousalContainer as m}from"../template-preview/RCS/RCSPreview.styled.js";import{CustomCarouselRightArrow as p,CustomCarouselLeftArrow as c}from"./CustomCarouselArrows.js";const u=o.forwardRef((({channel:o,template:t,isPreview:a,removeBottomBorder:p,borderRadius:c,showArrows:u,hideBorder:h,showSampleValues:C})=>{const{sliderRef:v,selectedCarouselIndex:f,cardCount:x,setIsCarouselHovered:I,cardIndex:P}=n(),R=-1==P?i(o):P,S=t?.components?.[R]?.cards,j=S?.length?e(w,{cards:S,cardCount:x??0,selectedCarouselIndex:f??-1,sliderRef:v,isPreview:a,showArrows:u,channel:o,template:t,setIsCarouselHovered:I,showSampleValues:!!C}):null;return d(o)?e(m,{borderRadius:c,children:j}):r(s,{removeBottomBorder:p,borderRadius:c,hideBorder:h,children:[e(l,{channel:o,currentTemplate:t,carouselCardIndex:-1,isPreview:a,width:"77%"}),j]})})),w=({cards:r,cardCount:o,selectedCarouselIndex:s,sliderRef:n,isPreview:i,showArrows:d,channel:m,template:u,setIsCarouselHovered:w,showSampleValues:h})=>e(a,{cardCount:o,selectedCarouselIndex:s,onMouseEnter:()=>w?.(!0),onMouseLeave:()=>w?.(!1),children:e(t,{ref:n,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!i,centerMode:!0,arrows:d,adaptiveHeight:!0,nextArrow:e(p,{isPreview:i??!1}),prevArrow:e(c,{isPreview:i??!1}),children:r?.map(((r,o)=>{const t={components:r.components,mapping:u?.mapping?.cards?.[o],content:u?.content,templateType:u?.templateType};return e(l,{channel:m,currentTemplate:t,carouselCardIndex:o,isPreview:i,width:"100%",showSampleValues:h},o)}))})});export{u as CarouselPreview};