@lanaco/lnc-react-ui 4.0.142 → 4.0.144

package/dist/Button.cjs

@@ -1,4 +1,4 @@
-"use strict";const n=require("react/jsx-runtime"),w=require("react"),l=require("./index-BpbMKBf_.cjs"),k=require("./index-DA7SIHV1.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-Dl9xPH4c.cjs"),I=require("./Icon.cjs"),P=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),f={small:{regular:"1rem",icon:"0.75rem",justIcon:"0.5rem"},medium:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"},large:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"}},T=e=>`
+"use strict";const a=require("react/jsx-runtime"),w=require("react"),l=require("./index-BpbMKBf_.cjs"),k=require("./index-DA7SIHV1.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-Dl9xPH4c.cjs"),I=require("./Icon.cjs"),P=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),f={small:{regular:"1rem",icon:"0.75rem",justIcon:"0.5rem"},medium:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"},large:{regular:"1.5rem",icon:"1rem",justIcon:"0.5rem"}},T=e=>`
         outline: none;
         display: inline-flex;
         flex-direction: row;
@@ -31,7 +31,7 @@
   &:disabled {
     ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled","gray","disabled","background")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"disabled","background")};
     color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"disabled","text")};
   }
 
@@ -86,7 +86,7 @@
      */
     color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted",e.color,"disabled","text")};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted","gray","disabled","background","backgroundOpacity")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted",e.color,"disabled","background","backgroundOpacity")};
   }
 `,v=d.styled.button`
   ${e=>T(e)}
@@ -121,9 +121,9 @@
   &:disabled {
     ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic","gray","disabled","background","backgroundOpacity")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic",e.color,"disabled","background","backgroundOpacity")};
   }
 `,L=d.styled(v)`
   border: 1px solid
     ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic",e.color,"enabled","border","borderOpacity")};
-`,j=w.forwardRef((e,u)=>{const{text:x="",iconStyle:R="solid",leadingIcon:V=null,trailingIcon:z=null,borderRadius:F="regular",btnType:a="filled",disabled:N=!1,tabIndex:s=0,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,onLeadingIconClick:_,onTrailingIconClick:K,size:C="small",color:i="primary",className:$="",style:S={},children:U,...y}=e,o={theme:P.useTheme(),color:i,size:C,style:S,disabled:N,borderRadius:F,btnType:a,className:"lnc-ui-button "},c=!k.isEmpty(V),r=!k.isEmpty(z),q=!k.isEmpty(x),B=()=>n.jsxs(n.Fragment,{children:[c&&n.jsx(W,{size:C,children:n.jsx(I,{icon:V,sizeInUnits:"1.125rem",iconStyle:R})}),x,U,r&&n.jsx(D,{size:C,children:n.jsx(I,{icon:z,sizeInUnits:"1.125rem",iconStyle:R})})]});return a==="filled"?n.jsx(O,{ref:u,"data-type":"filled",...o,className:`${o==null?void 0:o.className} ${i}-${a}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:a,...y,children:B()}):a==="tinted"?n.jsx(E,{ref:u,"data-type":"tinted",...o,className:`${o==null?void 0:o.className} ${i}-${a}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:a,...y,children:B()}):a==="outline"?n.jsx(L,{ref:u,"data-type":"outline",...o,className:`${o==null?void 0:o.className} ${i}-${a}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:a,...y,children:B()}):a==="basic"?n.jsx(v,{ref:u,"data-type":"basic",...o,className:`${o==null?void 0:o.className} ${i}-${a}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:a,...y,children:B()}):n.jsx(O,{ref:u,"data-type":"filled",size:C,...o,className:`${o==null?void 0:o.className} ${i}-${a}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,hasText:q,tabIndex:s,btnType:a,...y,children:B()})});j.propTypes={text:l.PropTypes.string,iconStyle:l.PropTypes.oneOf(["regular","solid"]),leadingIcon:l.PropTypes.string,trailingIcon:l.PropTypes.string,borderRadius:l.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:l.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:l.PropTypes.bool,tabIndex:l.PropTypes.number,onBlur:l.PropTypes.func,onFocus:l.PropTypes.func,onClick:l.PropTypes.func,onKeyDown:l.PropTypes.func,className:l.PropTypes.string,style:l.PropTypes.object,color:l.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:l.PropTypes.oneOf(["small","medium","large"])};module.exports=j;
+`,j=w.forwardRef((e,u)=>{const{text:x="",iconStyle:R="solid",leadingIcon:V=null,trailingIcon:z=null,borderRadius:F="regular",btnType:n="filled",disabled:N=!1,tabIndex:s=0,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,onLeadingIconClick:_,onTrailingIconClick:K,size:C="small",color:i="primary",className:$="",style:S={},children:U,...y}=e,o={theme:P.useTheme(),color:i,size:C,style:S,disabled:N,borderRadius:F,btnType:n,className:"lnc-ui-button "},c=!k.isEmpty(V),r=!k.isEmpty(z),q=!k.isEmpty(x),B=()=>a.jsxs(a.Fragment,{children:[c&&a.jsx(W,{size:C,children:a.jsx(I,{icon:V,sizeInUnits:"1.125rem",iconStyle:R})}),x,U,r&&a.jsx(D,{size:C,children:a.jsx(I,{icon:z,sizeInUnits:"1.125rem",iconStyle:R})})]});return n==="filled"?a.jsx(O,{ref:u,"data-type":"filled",...o,className:`${o==null?void 0:o.className} ${i}-${n}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:n,...y,children:B()}):n==="tinted"?a.jsx(E,{ref:u,"data-type":"tinted",...o,className:`${o==null?void 0:o.className} ${i}-${n}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:n,...y,children:B()}):n==="outline"?a.jsx(L,{ref:u,"data-type":"outline",...o,className:`${o==null?void 0:o.className} ${i}-${n}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:n,...y,children:B()}):n==="basic"?a.jsx(v,{ref:u,"data-type":"basic",...o,className:`${o==null?void 0:o.className} ${i}-${n}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,tabIndex:s,btnType:n,...y,children:B()}):a.jsx(O,{ref:u,"data-type":"filled",size:C,...o,className:`${o==null?void 0:o.className} ${i}-${n}-lnc-btn ${$}`,hasLeadingIcon:c,hasTrailingIcon:r,onFocus:g,onBlur:b,onClick:m,onKeyDown:h,hasText:q,tabIndex:s,btnType:n,...y,children:B()})});j.propTypes={text:l.PropTypes.string,iconStyle:l.PropTypes.oneOf(["regular","solid"]),leadingIcon:l.PropTypes.string,trailingIcon:l.PropTypes.string,borderRadius:l.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:l.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:l.PropTypes.bool,tabIndex:l.PropTypes.number,onBlur:l.PropTypes.func,onFocus:l.PropTypes.func,onClick:l.PropTypes.func,onKeyDown:l.PropTypes.func,className:l.PropTypes.string,style:l.PropTypes.object,color:l.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:l.PropTypes.oneOf(["small","medium","large"])};module.exports=j;

package/dist/Button.js

@@ -1,6 +1,6 @@
 import { jsx as l, jsxs as W, Fragment as E } from "react/jsx-runtime";
 import { forwardRef as q } from "react";
-import { P as o } from "./index-CblbdqjE.js";
+import { P as n } from "./index-CblbdqjE.js";
 import { i as T } from "./index-6RFrSPs_.js";
 import { s as u } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { c as z, b as t, d as r, h as I, e as v, a as A } from "./utils-BdsZgOUE.js";
@@ -78,7 +78,7 @@ const x = {
     background-color: ${(e) => t(
   e.theme,
   "ButtonFilled",
-  "gray",
+  e.color,
   "disabled",
   "background"
 )};
@@ -244,7 +244,7 @@ const x = {
     background-color: ${(e) => t(
   e.theme,
   "ButtonTinted",
-  "gray",
+  e.color,
   "disabled",
   "background",
   "backgroundOpacity"
@@ -343,7 +343,7 @@ const x = {
     background-color: ${(e) => t(
   e.theme,
   "ButtonBasic",
-  "gray",
+  e.color,
   "disabled",
   "background",
   "backgroundOpacity"
@@ -383,7 +383,7 @@ const x = {
     style: D = {},
     children: V,
     ...B
-  } = e, n = {
+  } = e, o = {
     theme: G(),
     color: c,
     size: y,
@@ -417,8 +417,8 @@ const x = {
     {
       ref: s,
       "data-type": "filled",
-      ...n,
-      className: `${n == null ? void 0 : n.className} ${c}-${a}-lnc-btn ${f}`,
+      ...o,
+      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${f}`,
       hasLeadingIcon: i,
       hasTrailingIcon: d,
       onFocus: b,
@@ -435,8 +435,8 @@ const x = {
     {
       ref: s,
       "data-type": "tinted",
-      ...n,
-      className: `${n == null ? void 0 : n.className} ${c}-${a}-lnc-btn ${f}`,
+      ...o,
+      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${f}`,
       hasLeadingIcon: i,
       hasTrailingIcon: d,
       onFocus: b,
@@ -453,8 +453,8 @@ const x = {
     {
       ref: s,
       "data-type": "outline",
-      ...n,
-      className: `${n == null ? void 0 : n.className} ${c}-${a}-lnc-btn ${f}`,
+      ...o,
+      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${f}`,
       hasLeadingIcon: i,
       hasTrailingIcon: d,
       onFocus: b,
@@ -471,8 +471,8 @@ const x = {
     {
       ref: s,
       "data-type": "basic",
-      ...n,
-      className: `${n == null ? void 0 : n.className} ${c}-${a}-lnc-btn ${f}`,
+      ...o,
+      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${f}`,
       hasLeadingIcon: i,
       hasTrailingIcon: d,
       onFocus: b,
@@ -490,8 +490,8 @@ const x = {
       ref: s,
       "data-type": "filled",
       size: y,
-      ...n,
-      className: `${n == null ? void 0 : n.className} ${c}-${a}-lnc-btn ${f}`,
+      ...o,
+      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${f}`,
       hasLeadingIcon: i,
       hasTrailingIcon: d,
       onFocus: b,
@@ -507,17 +507,17 @@ const x = {
   );
 });
 X.propTypes = {
-  text: o.string,
-  iconStyle: o.oneOf(["regular", "solid"]),
+  text: n.string,
+  iconStyle: n.oneOf(["regular", "solid"]),
   /**
    * Icon before the text
    */
-  leadingIcon: o.string,
+  leadingIcon: n.string,
   /**
    * Icon after the text
    */
-  trailingIcon: o.string,
-  borderRadius: o.oneOf([
+  trailingIcon: n.string,
+  borderRadius: n.oneOf([
     "slight",
     "regular",
     "edged",
@@ -527,18 +527,18 @@ X.propTypes = {
   /**
    * Different styles
    */
-  btnType: o.oneOf(["filled", "tinted", "outline", "basic"]),
-  disabled: o.bool,
-  tabIndex: o.number,
+  btnType: n.oneOf(["filled", "tinted", "outline", "basic"]),
+  disabled: n.bool,
+  tabIndex: n.number,
   //---------------------------------------------------------------
-  onBlur: o.func,
-  onFocus: o.func,
-  onClick: o.func,
-  onKeyDown: o.func,
+  onBlur: n.func,
+  onFocus: n.func,
+  onClick: n.func,
+  onKeyDown: n.func,
   //---------------------------------------------------------------
-  className: o.string,
-  style: o.object,
-  color: o.oneOf([
+  className: n.string,
+  style: n.object,
+  color: n.oneOf([
     "primary",
     "secondary",
     "success",
@@ -548,7 +548,7 @@ X.propTypes = {
     "neutral",
     "gray"
   ]),
-  size: o.oneOf(["small", "medium", "large"])
+  size: n.oneOf(["small", "medium", "large"])
 };
 export {
   X as default

package/dist/DetailedProductsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),a=require("react"),U=require("./emotion-styled.browser.esm-BtEseadx.cjs"),F=require("./consts-goSZX3xP.cjs"),L=require("./Button.cjs"),h=require("./utils-Dl9xPH4c.cjs"),M=require("./useDetectMobile-zkbzoOGV.cjs"),T=require("./style-CyHewQxg.cjs"),j=require("./suspense-product-card-detailed-BA06QK8a.cjs"),B=require("./index-D0xXo7W6.cjs"),E=U.styled.div`
+"use strict";const t=require("react/jsx-runtime"),a=require("react"),U=require("./emotion-styled.browser.esm-BtEseadx.cjs"),F=require("./consts-goSZX3xP.cjs"),L=require("./Button.cjs"),h=require("./utils-Dl9xPH4c.cjs"),M=require("./useDetectMobile-zkbzoOGV.cjs"),T=require("./style-CyHewQxg.cjs"),j=require("./suspense-product-card-detailed-B7gioG73.cjs"),B=require("./index-D0xXo7W6.cjs"),E=U.styled.div`
   display: grid;
   grid-template-columns: ${s=>`repeat(${s.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
@@ -26,4 +26,4 @@
       /* Safari and Chrome */
     }
   }
-`,f=a.memo(j.DetailedProductCard),R=a.forwardRef((s,q)=>{const{icon:l,title:S,buttonLink:c,items:i,buttonText:w,limit:o=4,onSelectCard:d=()=>{},onButtonAction:P=()=>{},isLoading:N=!1,getImage:u=()=>{},negotiableText:m,freeText:g,options:n,onSelectOption:p=()=>{},productsToolbarName:v="All",sponsoredText:b,onBookmark:k=()=>{},bookmarkComponent:y=t.jsx(t.Fragment,{})}=s,C=M.useDetectMobile(),D=a.useMemo(()=>t.jsx(t.Fragment,{children:C===!0?i==null?void 0:i.map((e,r)=>t.jsx(f,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,sponsored:e==null?void 0:e.sponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade,sponsoredText:b,onBookmark:k,bookmarkComponent:y,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists},r)):i==null?void 0:i.slice(0,o).map((e,r)=>t.jsx(f,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,sponsored:e==null?void 0:e.sponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade,sponsoredText:b,onBookmark:k,bookmarkComponent:y,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists},r))}),[i,C,o]);return t.jsxs(T.TitleWithOptionsSectionWrapper,{ref:q,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[h.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:S})]}),h.isDefinedNotEmptyString(c)&&t.jsx(L,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var r;(r=e==null?void 0:e.target)==null||r.blur(),P(c)},borderRadius:"curved",className:"button-link",children:w})]}),(n==null?void 0:n.length)>0&&t.jsx(B.SelectBar,{items:n,onRemove:e=>{p(e)},onSelect:e=>{p(e)},labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:v}),t.jsx(E,{limit:o,children:t.jsx(j.SuspenseDetailedProductCard,{isLoading:N,limit:o,keyPrefix:"explore-landing",children:D})})]})});module.exports=R;
+`,f=a.memo(j.DetailedProductCard),R=a.forwardRef((s,q)=>{const{icon:l,title:S,buttonLink:c,items:r,buttonText:w,limit:o=4,onSelectCard:d=()=>{},onButtonAction:P=()=>{},isLoading:N=!1,getImage:u=()=>{},negotiableText:m,freeText:g,options:n,onSelectOption:p=()=>{},productsToolbarName:v="All",sponsoredText:b,onBookmark:k=()=>{},bookmarkComponent:y=t.jsx(t.Fragment,{})}=s,C=M.useDetectMobile(),D=a.useMemo(()=>t.jsx(t.Fragment,{children:C===!0?r==null?void 0:r.map((e,i)=>t.jsx(f,{name:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,sponsored:e==null?void 0:e.sponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade,sponsoredText:b,onBookmark:k,bookmarkComponent:y,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists},i)):r==null?void 0:r.slice(0,o).map((e,i)=>t.jsx(f,{name:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,sponsored:e==null?void 0:e.sponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade,sponsoredText:b,onBookmark:k,bookmarkComponent:y,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists},i))}),[r,C,o]);return t.jsxs(T.TitleWithOptionsSectionWrapper,{ref:q,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[h.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:S})]}),h.isDefinedNotEmptyString(c)&&t.jsx(L,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var i;(i=e==null?void 0:e.target)==null||i.blur(),P(c)},borderRadius:"curved",className:"button-link",children:w})]}),(n==null?void 0:n.length)>0&&t.jsx(B.SelectBar,{items:n,onRemove:e=>{p(e)},onSelect:e=>{p(e)},labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:v}),t.jsx(E,{limit:o,children:t.jsx(j.SuspenseDetailedProductCard,{isLoading:N,limit:o,keyPrefix:"explore-landing",children:D})})]})});module.exports=R;

package/dist/DetailedProductsSection.js

@@ -6,7 +6,7 @@ import E from "./Button.js";
 import { k as h } from "./utils-BdsZgOUE.js";
 import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
 import { T as O } from "./style-DFPWLJBr.js";
-import { D as R, S as W } from "./suspense-product-card-detailed-CUd-EI3U.js";
+import { D as R, S as W } from "./suspense-product-card-detailed-FUKF_Pyc.js";
 import { S as $ } from "./index-Dweo-G3H.js";
 const j = B.div`
   display: grid;
@@ -41,7 +41,7 @@ const j = B.div`
     icon: s,
     title: P,
     buttonLink: d,
-    items: i,
+    items: r,
     buttonText: N,
     limit: t = 4,
     onSelectCard: m = () => {
@@ -61,10 +61,10 @@ const j = B.div`
     onBookmark: k = () => {
     },
     bookmarkComponent: f = /* @__PURE__ */ o(C, {})
-  } = n, y = I(), L = F(() => /* @__PURE__ */ o(C, { children: y === !0 ? i == null ? void 0 : i.map((e, r) => /* @__PURE__ */ o(
+  } = n, y = I(), L = F(() => /* @__PURE__ */ o(C, { children: y === !0 ? r == null ? void 0 : r.map((e, i) => /* @__PURE__ */ o(
     S,
     {
-      title: e == null ? void 0 : e.title,
+      name: e == null ? void 0 : e.name,
       price: e == null ? void 0 : e.price,
       sellingPrice: e == null ? void 0 : e.sellingPrice,
       currency: e == null ? void 0 : e.currency,
@@ -90,11 +90,11 @@ const j = B.div`
       bookmarked: e == null ? void 0 : e.bookmarked,
       bookmarkLists: e == null ? void 0 : e.bookmarkLists
     },
-    r
-  )) : i == null ? void 0 : i.slice(0, t).map((e, r) => /* @__PURE__ */ o(
+    i
+  )) : r == null ? void 0 : r.slice(0, t).map((e, i) => /* @__PURE__ */ o(
     S,
     {
-      title: e == null ? void 0 : e.title,
+      name: e == null ? void 0 : e.name,
       price: e == null ? void 0 : e.price,
       sellingPrice: e == null ? void 0 : e.sellingPrice,
       currency: e == null ? void 0 : e.currency,
@@ -121,8 +121,8 @@ const j = B.div`
       bookmarked: e == null ? void 0 : e.bookmarked,
       bookmarkLists: e == null ? void 0 : e.bookmarkLists
     },
-    r
-  )) }), [i, y, t]);
+    i
+  )) }), [r, y, t]);
   return /* @__PURE__ */ l(O, { ref: w, children: [
     /* @__PURE__ */ l("div", { className: "regular-title", children: [
       /* @__PURE__ */ l("div", { className: "regular-title-text", children: [
@@ -136,8 +136,8 @@ const j = B.div`
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
-            var r;
-            (r = e == null ? void 0 : e.target) == null || r.blur(), v(d);
+            var i;
+            (i = e == null ? void 0 : e.target) == null || i.blur(), v(d);
           },
           borderRadius: "curved",
           className: "button-link",

package/dist/IconButton.cjs

@@ -1,4 +1,4 @@
-"use strict";const i=require("react/jsx-runtime"),C=require("react"),l=require("./index-BpbMKBf_.cjs"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-Dl9xPH4c.cjs"),F=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),y=e=>`
+"use strict";const c=require("react/jsx-runtime"),C=require("react"),l=require("./index-BpbMKBf_.cjs"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),t=require("./utils-Dl9xPH4c.cjs"),F=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),y=e=>`
         outline: none;
         display: inline-flex;
         flex-direction: row;
@@ -46,7 +46,7 @@
   &:disabled {
     ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled","gray","disabled","background")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"disabled","background")};
     color: ${e=>t.getColorRgbaValue(e.theme,"ButtonFilled",e.color,"disabled","text")};
   }
 `,N=h.styled.button`
@@ -80,8 +80,8 @@
   &:disabled {
     ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted","gray","disabled","background","backgroundOpacity")};
-    color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted","gray","disabled","text")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted",e.color,"disabled","background","backgroundOpacity")};
+    color: ${e=>t.getColorRgbaValue(e.theme,"ButtonTinted",e.color,"disabled","text")};
   }
 `,k=h.styled.button`
   ${e=>y(e)}
@@ -114,9 +114,9 @@
   &:disabled {
     ${e=>e.disabled===!0&&t.getDisabledStateCss(e.theme)};
     cursor: default;
-    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic","gray","disabled","background","backgroundOpacity")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic",e.color,"disabled","background","backgroundOpacity")};
   }
 `,w=h.styled(k)`
   border: 1px solid
     ${e=>t.getColorRgbaValue(e.theme,"ButtonBasic",e.color,"enabled","border","borderOpacity")};
-`,V=C.forwardRef((e,c)=>{const{icon:$=null,iconStyle:R="solid",borderRadius:T="regular",btnType:a="filled",disabled:x=!1,tabIndex:j=0,onFocus:r=()=>{},onBlur:u=()=>{},onClick:d=()=>{},onKeyDown:s=()=>{},size:B="small",color:n="primary",className:g="",style:z={},...b}=e,o={theme:F.useTheme(),color:n,size:B,style:z,className:"lnc-ui-icon-button",disabled:x,borderRadius:T,btnType:a},v=()=>{var O=R==="solid"?"fas":"far";return`${O} fa-${$} fa-fw`},m=()=>C.isValidElement($)?$:i.jsx(S,{className:v()});return a==="filled"?i.jsx(f,{ref:c,"data-type":"filled",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,type:a,...b,children:m()}):a==="tinted"?i.jsx(N,{ref:c,"data-type":"tinted",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):a==="outline"?i.jsx(w,{ref:c,"data-type":"outline",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):a==="basic"?i.jsx(k,{ref:c,"data-type":"basic",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):i.jsx(f,{ref:c,"data-type":"filled",size:B,...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()})});V.propTypes={icon:l.PropTypes.oneOfType([l.PropTypes.string,l.PropTypes.element]),iconStyle:l.PropTypes.oneOf(["regular","solid"]),borderRadius:l.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:l.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:l.PropTypes.bool,tabIndex:l.PropTypes.number,onBlur:l.PropTypes.func,onFocus:l.PropTypes.func,onClick:l.PropTypes.func,onKeyDown:l.PropTypes.func,className:l.PropTypes.string,style:l.PropTypes.object,color:l.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:l.PropTypes.oneOf(["small","medium","large"])};module.exports=V;
+`,V=C.forwardRef((e,i)=>{const{icon:$=null,iconStyle:R="solid",borderRadius:T="regular",btnType:a="filled",disabled:x=!1,tabIndex:j=0,onFocus:r=()=>{},onBlur:u=()=>{},onClick:d=()=>{},onKeyDown:s=()=>{},size:B="small",color:n="primary",className:g="",style:z={},...b}=e,o={theme:F.useTheme(),color:n,size:B,style:z,className:"lnc-ui-icon-button",disabled:x,borderRadius:T,btnType:a},v=()=>{var O=R==="solid"?"fas":"far";return`${O} fa-${$} fa-fw`},m=()=>C.isValidElement($)?$:c.jsx(S,{className:v()});return a==="filled"?c.jsx(f,{ref:i,"data-type":"filled",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,type:a,...b,children:m()}):a==="tinted"?c.jsx(N,{ref:i,"data-type":"tinted",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):a==="outline"?c.jsx(w,{ref:i,"data-type":"outline",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):a==="basic"?c.jsx(k,{ref:i,"data-type":"basic",...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()}):c.jsx(f,{ref:i,"data-type":"filled",size:B,...o,className:`${o==null?void 0:o.className} ${n}-${a}-lnc-btn ${g}`,onFocus:r,onBlur:u,onClick:d,onKeyDown:s,...b,children:m()})});V.propTypes={icon:l.PropTypes.oneOfType([l.PropTypes.string,l.PropTypes.element]),iconStyle:l.PropTypes.oneOf(["regular","solid"]),borderRadius:l.PropTypes.oneOf(["slight","regular","edged","curved","none"]),btnType:l.PropTypes.oneOf(["filled","tinted","outline","basic"]),disabled:l.PropTypes.bool,tabIndex:l.PropTypes.number,onBlur:l.PropTypes.func,onFocus:l.PropTypes.func,onClick:l.PropTypes.func,onKeyDown:l.PropTypes.func,className:l.PropTypes.string,style:l.PropTypes.object,color:l.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:l.PropTypes.oneOf(["small","medium","large"])};module.exports=V;

package/dist/IconButton.js

@@ -2,7 +2,7 @@ import { jsx as i } from "react/jsx-runtime";
 import { forwardRef as I, isValidElement as S } from "react";
 import { P as n } from "./index-CblbdqjE.js";
 import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { c as f, b as t, d as l, e as k, h as y, a as V } from "./utils-BdsZgOUE.js";
+import { c as f, b as t, d as c, e as k, h as y, a as V } from "./utils-BdsZgOUE.js";
 import { u as j } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const x = (e) => `
         outline: none;
@@ -20,8 +20,8 @@ const x = (e) => `
   e.borderRadius
 )};
 
-        min-width: ${l(e.theme, e.size)};
-        max-width: ${l(e.theme, e.size)};
+        min-width: ${c(e.theme, e.size)};
+        max-width: ${c(e.theme, e.size)};
     `, D = g.i`
   font-size: 1.125rem;
 `, T = g.button`
@@ -49,8 +49,8 @@ const x = (e) => `
   "text"
 )};
 
-  min-height: ${(e) => l(e.theme, e.size)};
-  max-height: ${(e) => l(e.theme, e.size)};
+  min-height: ${(e) => c(e.theme, e.size)};
+  max-height: ${(e) => c(e.theme, e.size)};
 
   &:hover {
     background-color: ${(e) => t(
@@ -111,7 +111,7 @@ const x = (e) => `
     background-color: ${(e) => t(
   e.theme,
   "ButtonFilled",
-  "gray",
+  e.color,
   "disabled",
   "background"
 )};
@@ -151,8 +151,8 @@ const x = (e) => `
   "backgroundOpacity"
 )};
 
-  min-height: ${(e) => l(e.theme, e.size)};
-  max-height: ${(e) => l(e.theme, e.size)};
+  min-height: ${(e) => c(e.theme, e.size)};
+  max-height: ${(e) => c(e.theme, e.size)};
 
   &:hover {
     background-color: ${(e) => e.disabled !== !0 && t(
@@ -214,7 +214,7 @@ const x = (e) => `
     background-color: ${(e) => t(
   e.theme,
   "ButtonTinted",
-  "gray",
+  e.color,
   "disabled",
   "background",
   "backgroundOpacity"
@@ -222,7 +222,7 @@ const x = (e) => `
     color: ${(e) => t(
   e.theme,
   "ButtonTinted",
-  "gray",
+  e.color,
   "disabled",
   "text"
 )};
@@ -254,8 +254,8 @@ const x = (e) => `
   "backgroundOpacity"
 )};
 
-  min-height: ${(e) => l(e.theme, e.size)};
-  max-height: ${(e) => l(e.theme, e.size)};
+  min-height: ${(e) => c(e.theme, e.size)};
+  max-height: ${(e) => c(e.theme, e.size)};
 
   &:hover {
     background-color: ${(e) => t(
@@ -318,7 +318,7 @@ const x = (e) => `
     background-color: ${(e) => t(
   e.theme,
   "ButtonBasic",
-  "gray",
+  e.color,
   "disabled",
   "background",
   "backgroundOpacity"
@@ -339,7 +339,7 @@ const x = (e) => `
     icon: B = null,
     iconStyle: z = "solid",
     borderRadius: F = "regular",
-    btnType: a = "filled",
+    btnType: l = "filled",
     disabled: N = !1,
     tabIndex: E = 0,
     //----------------
@@ -353,45 +353,45 @@ const x = (e) => `
     },
     //----------------
     size: v = "small",
-    color: c = "primary",
+    color: a = "primary",
     className: m = "",
     style: w = {},
     ...h
   } = e, o = {
     theme: j(),
-    color: c,
+    color: a,
     size: v,
     style: w,
     className: "lnc-ui-icon-button",
     disabled: N,
     borderRadius: F,
-    btnType: a
+    btnType: l
   }, C = () => {
     var R = z === "solid" ? "fas" : "far";
     return `${R} fa-${B} fa-fw`;
   }, $ = () => S(B) ? B : /* @__PURE__ */ i(D, { className: C() });
-  return a === "filled" ? /* @__PURE__ */ i(
+  return l === "filled" ? /* @__PURE__ */ i(
     T,
     {
       ref: d,
       "data-type": "filled",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${m}`,
+      className: `${o == null ? void 0 : o.className} ${a}-${l}-lnc-btn ${m}`,
       onFocus: r,
       onBlur: u,
       onClick: b,
       onKeyDown: s,
-      type: a,
+      type: l,
       ...h,
       children: $()
     }
-  ) : a === "tinted" ? /* @__PURE__ */ i(
+  ) : l === "tinted" ? /* @__PURE__ */ i(
     K,
     {
       ref: d,
       "data-type": "tinted",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${m}`,
+      className: `${o == null ? void 0 : o.className} ${a}-${l}-lnc-btn ${m}`,
       onFocus: r,
       onBlur: u,
       onClick: b,
@@ -399,13 +399,13 @@ const x = (e) => `
       ...h,
       children: $()
     }
-  ) : a === "outline" ? /* @__PURE__ */ i(
+  ) : l === "outline" ? /* @__PURE__ */ i(
     U,
     {
       ref: d,
       "data-type": "outline",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${m}`,
+      className: `${o == null ? void 0 : o.className} ${a}-${l}-lnc-btn ${m}`,
       onFocus: r,
       onBlur: u,
       onClick: b,
@@ -413,13 +413,13 @@ const x = (e) => `
       ...h,
       children: $()
     }
-  ) : a === "basic" ? /* @__PURE__ */ i(
+  ) : l === "basic" ? /* @__PURE__ */ i(
     O,
     {
       ref: d,
       "data-type": "basic",
       ...o,
-      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${m}`,
+      className: `${o == null ? void 0 : o.className} ${a}-${l}-lnc-btn ${m}`,
       onFocus: r,
       onBlur: u,
       onClick: b,
@@ -434,7 +434,7 @@ const x = (e) => `
       "data-type": "filled",
       size: v,
       ...o,
-      className: `${o == null ? void 0 : o.className} ${c}-${a}-lnc-btn ${m}`,
+      className: `${o == null ? void 0 : o.className} ${a}-${l}-lnc-btn ${m}`,
       onFocus: r,
       onBlur: u,
       onClick: b,