@lanaco/lnc-react-ui 4.0.38 → 4.0.40

package/dist/{index-CT6_7UFb.js → index-5cttM4t7.js}

@@ -1,17 +1,17 @@
-import { jsx as s, jsxs as h, Fragment as z } from "react/jsx-runtime";
-import _, { useState as S, useRef as F, useEffect as j, useImperativeHandle as P, forwardRef as U } from "react";
-import { P as l } from "./index-S5Cd7WrG.js";
-import X from "./FlexBox.js";
+import { jsx as i, jsxs as d, Fragment as z } from "react/jsx-runtime";
+import _, { useState as w, useRef as F, useEffect as j, useImperativeHandle as P, forwardRef as q } from "react";
+import { P as r } from "./index-S5Cd7WrG.js";
+import U from "./FlexBox.js";
 import W from "./IconButton.js";
-import { useTheme as Z } from "./ThemeProvider.js";
-import { n as q } from "./emotion-styled.browser.esm-CjCaF13H.js";
+import { useTheme as X } from "./ThemeProvider.js";
+import { n as Z } from "./emotion-styled.browser.esm-CjCaF13H.js";
 import { M as C } from "./consts-C1uHV4xc.js";
 import { u as J } from "./useDetectMobile-BC6EGaBc.js";
 import { I as H } from "./index-wy-PXQR9.js";
 import V from "./Button.js";
 import Q from "./Icon.js";
 import { l as Y } from "./utils-DtRLzzTZ.js";
-const rr = q.div`
+const ee = Z.div`
   position: relative;
   padding: ${(e) => e.padding};
 
@@ -108,35 +108,35 @@ const rr = q.div`
 `, L = _.forwardRef(
   ({
     columnGap: e = "2rem",
-    rowGap: B = "1.25rem",
-    scrollBySize: g = 300,
-    wrapForMobile: k = !1,
+    rowGap: v = "1.25rem",
+    scrollBySize: f = 300,
+    wrapForMobile: y = !1,
     wrap: n = !1,
-    children: p,
-    methodsRef: w,
-    arrowsVisibleOnHover: x = !0,
-    rightAlignArrows: N = !1,
-    padding: v = "0",
-    showTimesBtn: f,
-    noArrows: u,
-    noGradient: y = !1,
-    hideDisabledArrows: a = !1,
-    noMargin: d = !1,
-    ...T
-  }, $) => {
-    const A = J(), { theme: r } = Z(), [t, b] = S(!1), [c, m] = S(!1), [M, I] = S(!0), o = F(), R = () => {
-      var i;
-      (i = o.current) == null || i.scrollBy(g, 0);
+    children: u,
+    methodsRef: b,
+    arrowsVisibleOnHover: S = !0,
+    rightAlignArrows: k = !1,
+    padding: m = "0",
+    showTimesBtn: h,
+    noArrows: a,
+    noGradient: x = !1,
+    hideDisabledArrows: c = !1,
+    noMargin: g = !1,
+    ...N
+  }, T) => {
+    const $ = J(), { theme: l } = X(), [t, A] = w(!1), [p, B] = w(!1), [M, I] = w(!0), o = F(), R = () => {
+      var s;
+      (s = o.current) == null || s.scrollBy(f, 0);
     }, K = () => {
-      var i;
-      (i = o.current) == null || i.scrollBy(-g, 0);
-    }, [E, D] = S(!1);
+      var s;
+      (s = o.current) == null || s.scrollBy(-f, 0);
+    }, [E, D] = w(!1);
     j(() => {
-      var i, O;
+      var s, O;
       D(
-        ((i = o == null ? void 0 : o.current) == null ? void 0 : i.scrollWidth) > ((O = o == null ? void 0 : o.current) == null ? void 0 : O.clientWidth)
+        ((s = o == null ? void 0 : o.current) == null ? void 0 : s.scrollWidth) > ((O = o == null ? void 0 : o.current) == null ? void 0 : O.clientWidth)
       );
-    }, [p]), P(w, () => ({
+    }, [u]), P(b, () => ({
       scrollToEnd() {
         G();
       },
@@ -150,42 +150,42 @@ const rr = q.div`
     const G = () => {
       o.current.scrollLeft = o.current.scrollWidth;
     };
-    return /* @__PURE__ */ s(
-      rr,
+    return /* @__PURE__ */ i(
+      ee,
       {
-        ref: $,
-        arrowsVisibleOnHover: x,
+        ref: T,
+        arrowsVisibleOnHover: S,
         hasOverflow: E,
-        noArrows: u,
-        padding: v,
-        rightAlignArrows: N,
-        showTimesBtn: f,
-        theme: r,
-        noMargin: d,
-        ...T,
-        children: /* @__PURE__ */ h(
-          X,
+        noArrows: a,
+        padding: m,
+        rightAlignArrows: k,
+        showTimesBtn: h,
+        theme: l,
+        noMargin: g,
+        ...N,
+        children: /* @__PURE__ */ d(
+          U,
           {
             ref: o,
             className: "scrollable-container",
             columnGap: e,
-            rowGap: B,
-            wrap: n || k && A ? "Wrap" : "NoWrap",
+            rowGap: v,
+            wrap: n || y && $ ? "Wrap" : "NoWrap",
             children: [
-              u !== !0 && /* @__PURE__ */ h(z, { children: [
-                !(a === !0 && c === !0) && /* @__PURE__ */ s(
+              a !== !0 && /* @__PURE__ */ d(z, { children: [
+                !(c === !0 && p === !0) && /* @__PURE__ */ i(
                   W,
                   {
                     borderRadius: "curved",
                     btnType: "tinted",
                     className: "scroll-arrow-left",
                     color: "neutral",
-                    disabled: c,
+                    disabled: p,
                     icon: "angle-left",
                     onClick: K
                   }
                 ),
-                !(a === !0 && t === !0) && /* @__PURE__ */ s(
+                !(c === !0 && t === !0) && /* @__PURE__ */ i(
                   W,
                   {
                     borderRadius: "curved",
@@ -198,33 +198,33 @@ const rr = q.div`
                   }
                 )
               ] }),
-              /* @__PURE__ */ s(
+              /* @__PURE__ */ i(
                 H,
                 {
                   isHorizontal: !0,
                   onIsNotVisible: () => {
-                    c === !0 && m(!1);
+                    p === !0 && B(!1);
                   },
                   onIsVisible: () => {
-                    c === !1 && m(!0);
+                    p === !1 && B(!0);
                   }
                 }
               ),
-              p,
-              /* @__PURE__ */ s(
+              u,
+              /* @__PURE__ */ i(
                 H,
                 {
                   className: "right-scroller",
                   isHorizontal: !0,
                   onIsNotVisible: () => {
-                    t === !0 && b(!1), I(!0);
+                    t === !0 && A(!1), I(!0);
                   },
                   onIsVisible: () => {
-                    t === !1 && b(!0), I(!1);
+                    t === !1 && A(!0), I(!1);
                   }
                 }
               ),
-              M && E && y !== !0 && /* @__PURE__ */ s("div", { className: "gradient" })
+              M && E && x !== !0 && /* @__PURE__ */ i("div", { className: "gradient" })
             ]
           }
         )
@@ -233,94 +233,89 @@ const rr = q.div`
   }
 );
 L.propTypes = {
-  title: l.string,
-  rowGap: l.string,
-  columnGap: l.string,
-  scrollBySize: l.number,
-  wrapForMobile: l.bool,
-  wrap: l.bool,
-  methodsRef: l.any,
-  arrowsVisibleOnHover: l.bool,
-  rightAlignArrows: l.bool,
-  padding: l.string
+  title: r.string,
+  rowGap: r.string,
+  columnGap: r.string,
+  scrollBySize: r.number,
+  wrapForMobile: r.bool,
+  wrap: r.bool,
+  methodsRef: r.any,
+  arrowsVisibleOnHover: r.bool,
+  rightAlignArrows: r.bool,
+  padding: r.string
 };
-const er = U((e, B) => {
+const re = q((e, v) => {
   const {
-    allButton: g = !0,
-    items: k = [],
+    allButton: f = !0,
+    items: y = [],
     selectedIds: n = [],
-    onSelect: p = () => {
+    onSelect: u = () => {
     },
-    onRemove: w = () => {
+    onRemove: b = () => {
     },
-    onSelectAll: x = () => {
+    onSelectAll: S = () => {
     },
-    className: N,
-    showTimesBtn: v = !1,
-    labelKey: f = "label",
-    valueKey: u = "value",
-    codeKey: y = "code",
-    uniqueKey: a,
-    typeKey: d,
-    productsToolbarName: T = "All",
-    ...$
-  } = e, A = (r, t, b, c, m) => {
-    n != null && n.includes(r) ? w(r, t, b, c, m) : p(r, t, b, c, m);
+    className: k,
+    showTimesBtn: m = !1,
+    labelKey: h = "label",
+    valueKey: a = "value",
+    codeKey: x = "code",
+    uniqueKey: c,
+    typeKey: g,
+    productsToolbarName: N = "All",
+    ...T
+  } = e, $ = (l, t) => {
+    n != null && n.includes(t) ? b(l, t) : u(l, t);
   };
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ d(
     L,
     {
+      ref: v,
       arrowsVisibleOnHover: !1,
-      className: N,
+      className: k,
       columnGap: "0.75rem",
       padding: "0.25rem 0",
       rightAlignArrows: !0,
-      showTimesBtn: v,
-      ...$,
+      showTimesBtn: m,
+      ...T,
       children: [
-        g && /* @__PURE__ */ s(
+        f && /* @__PURE__ */ i(
           V,
           {
             borderRadius: "curved",
             btnType: n.length === 0 ? "filled" : "tinted",
             className: "badge-button",
             color: "neutral",
-            onClick: x,
-            children: T
+            onClick: S,
+            children: N
           }
         ),
-        k.map((r, t) => /* @__PURE__ */ h(
+        y.map((l, t) => /* @__PURE__ */ d(
           V,
           {
             borderRadius: "curved",
-            btnType: n.includes(r.uuid) ? "filled" : "tinted",
+            btnType: n.includes(l.uuid) ? "filled" : "tinted",
             className: "badge-button",
             color: "neutral",
-            onClick: () => A(
-              r[u],
-              r[f],
-              r[y],
-              a ? r[a] : null,
-              d ? r[d] : null
-            ),
+            onClick: () => $(l, l[a]),
             children: [
-              Y(r == null ? void 0 : r.icon) && /* @__PURE__ */ h(z, { children: [
-                /* @__PURE__ */ s("i", { className: r == null ? void 0 : r.icon }),
+              Y(l == null ? void 0 : l.icon) && /* @__PURE__ */ d(z, { children: [
+                /* @__PURE__ */ i("i", { className: l == null ? void 0 : l.icon }),
                 " "
               ] }),
-              r[f],
-              v === !0 && /* @__PURE__ */ s(
+              l[h],
+              m === !0 && /* @__PURE__ */ i(
                 Q,
                 {
                   className: "times-btn",
                   icon: "times",
                   sizeInUnits: "0.75rem",
-                  onClick: () => w(
-                    r[u],
-                    r[f],
-                    r[y],
-                    a ? r[a] : null,
-                    d ? r[d] : null
+                  onClick: () => b(
+                    l[a],
+                    l[h],
+                    l[x],
+                    c ? l[c] : null,
+                    g ? l[g] : null
                   )
                 }
               )
@@ -332,19 +327,19 @@ const er = U((e, B) => {
     }
   );
 });
-er.propTypes = {
-  allButton: l.bool,
-  items: l.array,
-  selectedIds: l.array,
-  onSelect: l.func,
-  onRemove: l.func,
-  onSelectAll: l.func,
-  className: l.string,
-  showTimesBtn: l.bool,
-  valuKey: l.string,
-  labelKey: l.string,
-  codeKey: l.string
+re.propTypes = {
+  allButton: r.bool,
+  items: r.array,
+  selectedIds: r.array,
+  onSelect: r.func,
+  onRemove: r.func,
+  onSelectAll: r.func,
+  className: r.string,
+  showTimesBtn: r.bool,
+  valuKey: r.string,
+  labelKey: r.string,
+  codeKey: r.string
 };
 export {
-  er as S
+  re as S
 };

package/dist/{index-CHkb_Sj6.js → index-BT55M3t6.js}

@@ -1,8 +1,8 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import { jsxs as e, jsx as a } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
-import { n as a } from "./emotion-styled.browser.esm-CjCaF13H.js";
+import { n as o } from "./emotion-styled.browser.esm-CjCaF13H.js";
 import { m as u, l as h, n as b, G as x } from "./utils-DtRLzzTZ.js";
-a.div`
+const C = o.div`
   background-color: var(--gray-200, #dddfe4);
   border-radius: 0.75rem;
   min-width: 11.625rem;
@@ -10,8 +10,7 @@ a.div`
   max-width: 11.625rem;
   max-height: 11.625rem;
   ${u("-90deg")}
-`;
-const v = a.div`
+`, v = o.div`
   display: flex;
   flex-direction: column;
   justify-content: end;
@@ -54,6 +53,7 @@ const v = a.div`
     aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
     object-fit: cover; /* making sure the image isn't distorted */
     border-radius: 0.75rem;
+    mix-blend-mode: multiply;
   }
 
   & .fallback-image {
@@ -75,7 +75,7 @@ const v = a.div`
     border-radius: 62.4375rem;
     z-index: 1;
     background-color: var(--white, #fff);
-    color: var(--gray-950, #14161A);
+    color: var(--gray-950, #14161a);
   }
   & .title-simple-product-card {
     z-index: 1;
@@ -86,17 +86,17 @@ const v = a.div`
   &:hover {
     & .title-simple-product-card {
       z-index: 1;
-      color: var(--primary-500, #F59E0B);
+      color: var(--primary-500, #f59e0b);
     }
   }
-`, S = f((d, y) => {
+`, G = f((d, y) => {
   const {
     uuid: w,
     title: n,
     price: r,
     currency: i,
-    isNegotiable: m,
-    isFree: l,
+    isNegotiable: l,
+    isFree: m,
     image: c,
     sellerUuid: k,
     onSelectCard: s = () => {
@@ -106,17 +106,18 @@ const v = a.div`
     freeText: g = "Free"
   } = d;
   return /* @__PURE__ */ e(v, { className: "simple-product-card", onClick: s, children: [
-    h(t) ? t : /* @__PURE__ */ o("img", { src: c }),
+    h(t) ? t : /* @__PURE__ */ a("img", { src: c }),
     /* @__PURE__ */ e("div", { className: "text-block", children: [
-      /* @__PURE__ */ o("div", { className: "title-simple-product-card", children: n }),
+      /* @__PURE__ */ a("div", { className: "title-simple-product-card", children: n }),
       /* @__PURE__ */ e("div", { className: "price-chip", children: [
         r && i && `${b(r)} ${x(i)}`,
-        m && p,
-        l && g
+        l && p,
+        m && g
       ] })
     ] })
   ] });
 });
 export {
-  S
+  C as S,
+  G as a
 };

package/dist/{index-Dj5wZCVs.cjs → index-DHJmdMN8.cjs}

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),p=require("react"),a=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),r=require("./utils-NZLCh-J5.cjs");a.newStyled.div`
+"use strict";const e=require("react/jsx-runtime"),u=require("react"),a=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),r=require("./utils-NZLCh-J5.cjs"),f=a.newStyled.div`
   background-color: var(--gray-200, #dddfe4);
   border-radius: 0.75rem;
   min-width: 11.625rem;
@@ -6,7 +6,7 @@
   max-width: 11.625rem;
   max-height: 11.625rem;
   ${r.linearGradientAnimation("-90deg")}
-`;const f=a.newStyled.div`
+`,b=a.newStyled.div`
   display: flex;
   flex-direction: column;
   justify-content: end;
@@ -49,6 +49,7 @@
     aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
     object-fit: cover; /* making sure the image isn't distorted */
     border-radius: 0.75rem;
+    mix-blend-mode: multiply;
   }
 
   & .fallback-image {
@@ -70,7 +71,7 @@
     border-radius: 62.4375rem;
     z-index: 1;
     background-color: var(--white, #fff);
-    color: var(--gray-950, #14161A);
+    color: var(--gray-950, #14161a);
   }
   & .title-simple-product-card {
     z-index: 1;
@@ -81,7 +82,7 @@
   &:hover {
     & .title-simple-product-card {
       z-index: 1;
-      color: var(--primary-500, #F59E0B);
+      color: var(--primary-500, #f59e0b);
     }
   }
-`,h=p.forwardRef((d,b)=>{const{uuid:x,title:n,price:i,currency:t,isNegotiable:c,isFree:l,image:s,sellerUuid:y,onSelectCard:m=()=>{},imageComponent:o,negotiableText:g="Negotiable",freeText:u="Free"}=d;return e.jsxs(f,{className:"simple-product-card",onClick:m,children:[r.isDefined(o)?o:e.jsx("img",{src:s}),e.jsxs("div",{className:"text-block",children:[e.jsx("div",{className:"title-simple-product-card",children:n}),e.jsxs("div",{className:"price-chip",children:[i&&t&&`${r.formatPrice(i)} ${r.GetCurrencySymbol(t)}`,c&&g,l&&u]})]})]})});exports.SimpleProductCard=h;
+`,h=u.forwardRef((n,x)=>{const{uuid:y,title:d,price:i,currency:t,isNegotiable:l,isFree:c,image:s,sellerUuid:v,onSelectCard:m=()=>{},imageComponent:o,negotiableText:p="Negotiable",freeText:g="Free"}=n;return e.jsxs(b,{className:"simple-product-card",onClick:m,children:[r.isDefined(o)?o:e.jsx("img",{src:s}),e.jsxs("div",{className:"text-block",children:[e.jsx("div",{className:"title-simple-product-card",children:d}),e.jsxs("div",{className:"price-chip",children:[i&&t&&`${r.formatPrice(i)} ${r.GetCurrencySymbol(t)}`,l&&p,c&&g]})]})]})});exports.SimpleProductCard=h;exports.SkeletonWrapper=f;

package/dist/index-Dn5tPLgP.cjs

@@ -0,0 +1,95 @@
+"use strict";const l=require("react/jsx-runtime"),n=require("react"),r=require("./index-BPVoEhTF.cjs"),V=require("./FlexBox.cjs"),R=require("./IconButton.cjs"),_=require("./ThemeProvider.cjs"),z=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),E=require("./consts-CtNoHdBj.cjs"),D=require("./useDetectMobile-D6d5LpdL.cjs"),K=require("./index-Cb_AeN9A.cjs"),O=require("./Button.cjs"),F=require("./Icon.cjs"),G=require("./utils-NZLCh-J5.cjs"),X=z.newStyled.div`
+  position: relative;
+  padding: ${e=>e.padding};
+
+  & button {
+    white-space: nowrap;
+  }
+
+  & .badge-button {
+    ${e=>e.showTimesBtn===!0&&"padding-left: 0.5rem; padding-right: 0.5rem;"}
+  }
+
+  & .gradient {
+    position: absolute;
+    top: 50%;
+    transform: translate(0, -50%);
+    z-index: 4;
+    transition: ${"0.3s"};
+    right: ${e=>e.noArrows!==!0?"6rem":"0"};
+    width: 2rem;
+    background: #fff;
+    height: 100%;
+    -webkit-mask-image: linear-gradient(to left, black 10%, transparent 50%);
+    mask-image: linear-gradient(to left, black 10%, transparent 50%);
+  }
+
+  & .scrollable-container {
+    max-width: -webkit-fill-available;
+    max-width: -moz-available; /* WebKit-based browsers will ignore this. */
+    max-width: fill-available;
+
+    ${e=>e.rightAlignArrows===!0&&e.noArrows!==!0&&"margin-right: 6rem"};
+    scroll-behavior: smooth;
+    overflow: hidden;
+    -webkit-overflow-scrolling: touch;
+    ::-webkit-scrollbar {
+      -webkit-appearance: none;
+    }
+    -ms-overflow-style: none;
+    /* Internet Explorer 10+ */
+    scrollbar-width: none;
+    /* Firefox */
+
+    &::-webkit-scrollbar {
+      display: none;
+      /* Safari and Chrome */
+    }
+
+    @media (max-width: ${E.MOBILE_SIZE_PX+"px"}) {
+      margin-right: 0;
+    }
+  }
+  & .scroll-arrow-right,
+  & .scroll-arrow-left {
+    position: absolute;
+    top: 50%;
+    transform: translate(0, -50%);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+
+    visibility: ${e=>e.arrowsVisibleOnHover===!1&&e.hasOverflow?"visible":"hidden"};
+    z-index: 4;
+    transition: ${"0.3s"};
+  }
+  & .scroll-arrow-right {
+    ${e=>e.rightAlignArrows===!0?"right: 0":"right: 0.7rem"};
+  }
+  & .scroll-arrow-left {
+    ${e=>e.rightAlignArrows===!0?"right: 2.625rem":"left: 0.7rem"};
+  }
+  & .scrollable-container:hover > .scroll-arrow-left,
+  & .scrollable-container:hover > .scroll-arrow-right {
+    visibility: ${e=>e.hasOverflow?"visible":"hidden"};
+  }
+
+  @media (max-width: ${E.MOBILE_SIZE_PX+"px"}) {
+    & .scrollable-container {
+      overflow: auto;
+    }
+    & .scroll-arrow-left,
+    & .scroll-arrow-right {
+      display: none;
+    }
+
+    & .gradient {
+      right: 0;
+    }
+
+    & .scrollable-container button:nth-of-type(3) {
+      ${e=>e.noMargin!==!0&&"margin-left: 1rem"};
+    }
+  }
+`,W=n.forwardRef(({columnGap:e="2rem",rowGap:w="1.25rem",scrollBySize:u=300,wrapForMobile:y=!1,wrap:a=!1,children:p,methodsRef:b,arrowsVisibleOnHover:T=!0,rightAlignArrows:v=!1,padding:f="0",showTimesBtn:h,noArrows:c,noGradient:x=!1,hideDisabledArrows:d=!1,noMargin:g=!1,...P},S)=>{const k=D.useDetectMobile(),{theme:o}=_.useTheme(),[t,j]=n.useState(!1),[m,N]=n.useState(!1),[H,I]=n.useState(!0),s=n.useRef(),q=()=>{var i;(i=s.current)==null||i.scrollBy(u,0)},B=()=>{var i;(i=s.current)==null||i.scrollBy(-u,0)},[$,L]=n.useState(!1);n.useEffect(()=>{var i,A;L(((i=s==null?void 0:s.current)==null?void 0:i.scrollWidth)>((A=s==null?void 0:s.current)==null?void 0:A.clientWidth))},[p]),n.useImperativeHandle(b,()=>({scrollToEnd(){M()},scrollLeft(){B()},scrollRight(){q()}}));const M=()=>{s.current.scrollLeft=s.current.scrollWidth};return l.jsx(X,{ref:S,arrowsVisibleOnHover:T,hasOverflow:$,noArrows:c,padding:f,rightAlignArrows:v,showTimesBtn:h,theme:o,noMargin:g,...P,children:l.jsxs(V,{ref:s,className:"scrollable-container",columnGap:e,rowGap:w,wrap:a||y&&k?"Wrap":"NoWrap",children:[c!==!0&&l.jsxs(l.Fragment,{children:[!(d===!0&&m===!0)&&l.jsx(R,{borderRadius:"curved",btnType:"tinted",className:"scroll-arrow-left",color:"neutral",disabled:m,icon:"angle-left",onClick:B}),!(d===!0&&t===!0)&&l.jsx(R,{borderRadius:"curved",btnType:"tinted",className:"scroll-arrow-right",color:"neutral",disabled:t,icon:"angle-right",onClick:q})]}),l.jsx(K.InfiniteScrollEndElement,{isHorizontal:!0,onIsNotVisible:()=>{m===!0&&N(!1)},onIsVisible:()=>{m===!1&&N(!0)}}),p,l.jsx(K.InfiniteScrollEndElement,{className:"right-scroller",isHorizontal:!0,onIsNotVisible:()=>{t===!0&&j(!1),I(!0)},onIsVisible:()=>{t===!1&&j(!0),I(!1)}}),H&&$&&x!==!0&&l.jsx("div",{className:"gradient"})]})})});W.propTypes={title:r.PropTypes.string,rowGap:r.PropTypes.string,columnGap:r.PropTypes.string,scrollBySize:r.PropTypes.number,wrapForMobile:r.PropTypes.bool,wrap:r.PropTypes.bool,methodsRef:r.PropTypes.any,arrowsVisibleOnHover:r.PropTypes.bool,rightAlignArrows:r.PropTypes.bool,padding:r.PropTypes.string};const C=n.forwardRef((e,w)=>{const{allButton:u=!0,items:y=[],selectedIds:a=[],onSelect:p=()=>{},onRemove:b=()=>{},onSelectAll:T=()=>{},className:v,showTimesBtn:f=!1,labelKey:h="label",valueKey:c="value",codeKey:x="code",uniqueKey:d,typeKey:g,productsToolbarName:P="All",...S}=e,k=(o,t)=>{a!=null&&a.includes(t)?b(o,t):p(o,t)};return l.jsxs(W,{ref:w,arrowsVisibleOnHover:!1,className:v,columnGap:"0.75rem",padding:"0.25rem 0",rightAlignArrows:!0,showTimesBtn:f,...S,children:[u&&l.jsx(O,{borderRadius:"curved",btnType:a.length===0?"filled":"tinted",className:"badge-button",color:"neutral",onClick:T,children:P}),y.map((o,t)=>l.jsxs(O,{borderRadius:"curved",btnType:a.includes(o.uuid)?"filled":"tinted",className:"badge-button",color:"neutral",onClick:()=>k(o,o[c]),children:[G.isDefined(o==null?void 0:o.icon)&&l.jsxs(l.Fragment,{children:[l.jsx("i",{className:o==null?void 0:o.icon})," "]}),o[h],f===!0&&l.jsx(F,{className:"times-btn",icon:"times",sizeInUnits:"0.75rem",onClick:()=>b(o[c],o[h],o[x],d?o[d]:null,g?o[g]:null)})]},t))]})});C.propTypes={allButton:r.PropTypes.bool,items:r.PropTypes.array,selectedIds:r.PropTypes.array,onSelect:r.PropTypes.func,onRemove:r.PropTypes.func,onSelectAll:r.PropTypes.func,className:r.PropTypes.string,showTimesBtn:r.PropTypes.bool,valuKey:r.PropTypes.string,labelKey:r.PropTypes.string,codeKey:r.PropTypes.string};exports.SelectBar=C;

package/dist/{style-6tSw9aqK.js → style-CiePxaJ_.js}

@@ -20,7 +20,7 @@ const s = r.div`
 
     & i {
       font-size: 1.5rem;
-      color: var(--primary-500, #F59E0B);
+      color: var(--primary-500, #f59e0b);
     }
   }
 
@@ -35,7 +35,7 @@ const s = r.div`
       }
     }
   }
-`, o = r.div`
+`, d = r.div`
   display: flex;
   flex-direction: column;
   gap: 0.75rem;
@@ -56,7 +56,7 @@ const s = r.div`
 
     & i {
       font-size: 1.5rem;
-      color: var(--primary-500, #F59E0B);
+      color: var(--primary-500, #f59e0b);
     }
   }
 
@@ -65,7 +65,7 @@ const s = r.div`
       font-size: 1.375rem;
     }
   }
-`, t = (e) => (e == null ? void 0 : e.toLowerCase()) == "success" ? "color: var(--success-700); border: 1px solid var(--success-600); background-color: var(--sucess-60008);" : (e == null ? void 0 : e.toLowerCase()) == "warning" ? "color: var(--warning-600); border: 1px solid var(--warning-500); background-color: var(--warning-50012);" : (e == null ? void 0 : e.toLowerCase()) == "info" ? "color: var(--info-700); border: 1px solid var(--info-600); background-color: var(--sucess-60012);" : (e == null ? void 0 : e.toLowerCase()) == "danger" ? "color: var(--danger-600); border: 1px solid var(--danger-500); background-color: var(--danger-5008);" : (e == null ? void 0 : e.toLowerCase()) == "gray" ? "color: var(--info-700); border: 1px solid var(--info-600); background-color: var(--sucess-60012);" : "color: var(--gray-950, #14161A); border: 1px solid var(--gray-200); background-color: var(--white);", g = r.div`
+`, t = (e) => (e == null ? void 0 : e.toLowerCase()) == "success" ? "color: var(--success-700, #047857); border: 1px solid var(--success-600, #059669); background-color: var(--sucess-60008, #05966914);" : (e == null ? void 0 : e.toLowerCase()) == "warning" ? "color: var(--warning-600, #d97706); border: 1px solid var(--warning-500, #f59e0b); background-color: var(--warning-50012, #f59e0b1f);" : (e == null ? void 0 : e.toLowerCase()) == "info" ? "color: var(--info-700, #6d28d9); border: 1px solid var(--info-600, #7c3aed); background-color: var(--info-60012, #7c3aed1f);" : (e == null ? void 0 : e.toLowerCase()) == "danger" ? "color: var(--danger-600, #e11d48); border: 1px solid var(--danger-500, #f43f5e); background-color: var(--danger-5008, #f43f5e14);" : (e == null ? void 0 : e.toLowerCase()) == "secondary" ? "color: var(--secondary-700, #2667a0); border: 1px solid var(--secondary-600, #3284cb); background-color: var(--secondary-60012, #3284cb1f);" : "color: var(--gray-950, #14161A); border: 1px solid var(--gray-200, #dddfe4); background-color: var(--white, #fff);", o = r.div`
   font-size: 0.75rem;
   font-weight: 500;
   padding: 0 0.5rem;
@@ -77,7 +77,7 @@ const s = r.div`
   ${(e) => t(e.color)}
 `;
 export {
-  g as B,
+  o as B,
   s as R,
-  o as T
+  d as T
 };