@lanaco/lnc-react-ui 4.0.104 → 4.0.106

package/dist/PasswordInput.js

@@ -1,18 +1,18 @@
-import { jsxs as q, jsx as u } from "react/jsx-runtime";
-import { forwardRef as A, useRef as G, useState as $, useEffect as I, useCallback as H } from "react";
+import { jsxs as q, jsx as m } from "react/jsx-runtime";
+import { forwardRef as A, useRef as G, useState as p, useEffect as I, useCallback as H } from "react";
 import { P as n } from "./index-S5Cd7WrG.js";
 import { d as J } from "./index-CkWvbrVT.js";
 import K from "./Icon.js";
-import { s as m } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { d as g, b as a, a as M, e as Q, h as w, c as X } from "./utils-BXCGNjIy.js";
+import { s as h } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { d as f, b as r, a as M, e as Q, h as w, c as X } from "./utils-BbgAIA9N.js";
 import { u as Y } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const Z = m.div`
+const Z = h.div`
   display: flex;
   align-items: center;
 
-  min-height: ${(e) => g(e.theme, e.size)};
-  max-height: ${(e) => g(e.theme, e.size)};
-  background-color: ${(e) => a(
+  min-height: ${(e) => f(e.theme, e.size)};
+  max-height: ${(e) => f(e.theme, e.size)};
+  background-color: ${(e) => r(
   e.theme,
   "Input",
   e.color,
@@ -20,7 +20,7 @@ const Z = m.div`
   "background"
 )};
   border: 1px solid
-    ${(e) => a(
+    ${(e) => r(
   e.theme,
   "Input",
   e.focused === !0 ? "primary" : e.color,
@@ -30,19 +30,34 @@ const Z = m.div`
   border-radius: ${(e) => M(e.theme, "regular")};
 
   ${(e) => e.focused && e.readOnly !== !0 ? Q(e.theme) : ""}
-  ${(e) => e.disabled === !0 ? w(e.theme) : ""}
-`, C = m.span`
+  /* ${(e) => e.disabled === !0 ? w(e.theme) : ""} */
+  ${(e) => e.disabled === !0 && `background-color: ${r(
+  e.theme,
+  "Input",
+  e.color,
+  "disabled",
+  "background",
+  "backgroundOpacity"
+)};
+        color: ${(o) => r(
+  o.theme,
+  "Input",
+  o.color,
+  "disabled",
+  "text"
+)};`}
+`, k = h.span`
   padding: 0 12px;
-  color: ${(e) => a(
+  color: ${(e) => r(
   e.theme,
   "Input",
   e.focused === !0 ? "primary" : e.color,
   "enabled",
   "prefix"
 )};
-`, _ = m(C)``, ee = m(C)`
+`, _ = h(k)``, ee = h(k)`
   cursor: pointer;
-`, te = m.input`
+`, te = h.input`
   background: none;
   border: none;
   outline: none;
@@ -51,21 +66,21 @@ const Z = m.div`
   width: 100%;
 
   ${(e) => X(e.theme, "Input", e.size, "enabled")}
-  min-height: ${(e) => g(e.theme, e.size)};
-  max-height: ${(e) => g(e.theme, e.size)};
-  color: ${(e) => a(
+  min-height: ${(e) => f(e.theme, e.size)};
+  max-height: ${(e) => f(e.theme, e.size)};
+  color: ${(e) => r(
   e.theme,
   "Input",
   e.focused === !0 ? "primary" : e.color,
   "enabled",
   "text"
 )};
-  caret-color: ${(e) => a(e.theme, "Input", e.color, "enabled", "caret")};
+  caret-color: ${(e) => r(e.theme, "Input", e.color, "enabled", "caret")};
   padding-right: ${(e) => e.suffix ? "0" : "0.75rem"};
   padding-left: ${(e) => e.prefix ? "0" : "0.75rem"};
 
   &::placeholder {
-    color: ${(e) => a(
+    color: ${(e) => r(
   e.theme,
   "Input",
   e.color,
@@ -79,51 +94,66 @@ const Z = m.div`
   }
 
   &:disabled {
-    ${(e) => w(e.theme)}
+    /* ${(e) => w(e.theme)} */
+    ${(e) => `background-color: ${r(
+  e.theme,
+  "Input",
+  e.color,
+  "disabled",
+  "background",
+  "backgroundOpacity"
+)};
+        color: ${(o) => r(
+  o.theme,
+  "Input",
+  o.color,
+  "disabled",
+  "text"
+)};`}
     background: none;
   }
-`, ne = A((e, h) => {
+`, ne = A((e, o) => {
   const {
     wrapperRef: T,
-    disabled: k,
+    disabled: C,
     readOnly: S,
     debounceTime: V = 0,
     placeholder: B,
     prefix: b,
     suffix: y,
-    value: l,
+    value: d,
     defaultValue: F,
     //----------------
-    onChange: s,
-    onBlur: p,
+    onChange: c,
+    onBlur: $,
     onFocus: x,
     //----------------
     className: N = "",
     style: P = {},
     size: v = "small",
-    color: d = "primary",
+    color: s = "primary",
     ...R
-  } = e, r = G(), c = Y(), [j, z] = $(l || F || "");
+  } = e, a = G(), u = Y(), [j, O] = p(d || F || "");
   I(() => {
-    l != null && z(l);
-  }, [l]);
-  const [f, L] = $(!0), [i, O] = $(!1);
+    d != null && O(d);
+  }, [d]);
+  const [g, L] = p(!0), [i, z] = p(!1);
   I(() => {
-    var o;
-    const t = ((o = r == null ? void 0 : r.current) == null ? void 0 : o.value) || "";
-    r.current.selectionStart = t != null && t.length ? t.length : 0, r.current.selectionEnd = t != null && t.length ? t.length : 0;
-  }, [f]), I(() => {
-    h != null && (h.current = r.current);
-  }, [h, r]);
+    var l;
+    const t = ((l = a == null ? void 0 : a.current) == null ? void 0 : l.value) || "";
+    a.current.selectionStart = t != null && t.length ? t.length : 0, a.current.selectionEnd = t != null && t.length ? t.length : 0;
+  }, [g]), I(() => {
+    o != null && (o.current = a.current);
+  }, [o, a]);
   const W = H(
-    J((t, o) => E(t, o), V),
-    [s]
-  ), E = (t, o) => {
-    s && (s == null || s(t, o));
+    J((t, l) => E(t, l), V),
+    [c]
+  ), E = (t, l) => {
+    c && (c == null || c(t, l));
   }, U = (t) => {
-    z(t.target.value), W(t, t.target.value);
+    O(t.target.value), W(t, t.target.value);
   }, D = () => {
-    L(!f), r.current.focus();
+    L(!g), a.current.focus();
   };
   return /* @__PURE__ */ q(
     Z,
@@ -131,63 +161,63 @@ const Z = m.div`
       ref: T,
       style: P,
       className: N,
-      theme: c,
-      color: d,
+      theme: u,
+      color: s,
       size: v,
       focused: i,
-      disabled: k,
+      disabled: C,
       readOnly: S,
       children: [
-        b && /* @__PURE__ */ u(
-          C,
+        b && /* @__PURE__ */ m(
+          k,
           {
-            theme: c,
-            color: d,
+            theme: u,
+            color: s,
             focused: i,
             className: "lnc-input-prefix",
             children: b
           }
         ),
-        /* @__PURE__ */ u(
+        /* @__PURE__ */ m(
           te,
           {
-            ref: r,
-            type: f ? "password" : "text",
-            theme: c,
-            color: d,
+            ref: a,
+            type: g ? "password" : "text",
+            theme: u,
+            color: s,
             size: v,
             placeholder: B,
             prefix: b,
             suffix: y,
-            disabled: k,
+            disabled: C,
             readOnly: S,
             focused: i,
             onFocus: (t) => {
-              O(!0), x == null || x(t);
+              z(!0), x == null || x(t);
             },
             onBlur: (t) => {
-              O(!1), p == null || p(t);
+              z(!1), $ == null || $(t);
             },
             onChange: U,
             value: j,
             ...R
           }
         ),
-        /* @__PURE__ */ u(
+        /* @__PURE__ */ m(
           ee,
           {
-            theme: c,
-            color: d,
+            theme: u,
+            color: s,
             focused: i,
             onClick: D,
-            children: /* @__PURE__ */ u(K, { icon: f ? "eye-slash" : "eye" })
+            children: /* @__PURE__ */ m(K, { icon: g ? "eye-slash" : "eye" })
           }
         ),
-        y && /* @__PURE__ */ u(
+        y && /* @__PURE__ */ m(
           _,
           {
-            theme: c,
-            color: d,
+            theme: u,
+            color: s,
             focused: i,
             className: "lnc-input-suffix",
             children: y

package/dist/PopoverContent.cjs

@@ -1,4 +1,4 @@
-"use strict";const n=require("react/jsx-runtime"),c=require("react"),s=require("./floating-ui.react.esm-Bb1ww976.cjs"),i=require("./index-BPVoEhTF.cjs"),x=require("./PopoverContext.cjs"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),a=require("./utils-BWzf4vLl.cjs"),y=require("./motion-B_VPZaJq.cjs"),f=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),P=h.styled(y.motion.div)`
+"use strict";const n=require("react/jsx-runtime"),c=require("react"),s=require("./floating-ui.react.esm-Bb1ww976.cjs"),i=require("./index-BPVoEhTF.cjs"),x=require("./PopoverContext.cjs"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),a=require("./utils-CZynEOC_.cjs"),y=require("./motion-B_VPZaJq.cjs"),f=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),P=h.styled(y.motion.div)`
   font-family: ${e=>{var t,r;return(r=(t=e.theme)==null?void 0:t.typography)==null?void 0:r.fontFamily}};
   animation: fadeIn 0.4s;
   box-shadow: ${e=>a.getComponentPropValue(e.theme,"Popover",e.color,"enabled","boxShadow")};

package/dist/PopoverContent.js

@@ -4,7 +4,7 @@ import { a as f, F as u, b as g } from "./floating-ui.react.esm-h3qa3pb9.js";
 import { P as n } from "./index-S5Cd7WrG.js";
 import h from "./PopoverContext.js";
 import { s as x } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { g as y, a as P, b as v } from "./utils-BXCGNjIy.js";
+import { g as y, a as P, b as v } from "./utils-BbgAIA9N.js";
 import { m as w } from "./motion-Ckekul_K.js";
 import { u as C } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const F = x(w.div)`

package/dist/ProductsWithBannerSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),l=require("react"),u=require("./emotion-styled.browser.esm-BtEseadx.cjs"),j=require("./consts-goSZX3xP.cjs"),k=require("./useDetectMobile-zkbzoOGV.cjs"),y=require("./style-Bjk6yHcP.cjs"),d=require("./utils-BWzf4vLl.cjs"),P=require("./index-BRgZcjpI.cjs"),S=u.styled.div`
+"use strict";const r=require("react/jsx-runtime"),l=require("react"),u=require("./emotion-styled.browser.esm-BtEseadx.cjs"),j=require("./consts-goSZX3xP.cjs"),k=require("./useDetectMobile-zkbzoOGV.cjs"),y=require("./style-JqDQj4jh.cjs"),d=require("./utils-CZynEOC_.cjs"),P=require("./index-BvSNRLNa.cjs"),S=u.styled.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;

package/dist/ProductsWithBannerSection.js

@@ -3,9 +3,9 @@ import { forwardRef as u, Suspense as C, memo as N, useMemo as S } from "react";
 import { s as p } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as k } from "./consts-BuFChS64.js";
 import { u as $ } from "./useDetectMobile-Bkvj0VMa.js";
-import { R as U } from "./style-LEmcTrN9.js";
-import { p as I, o as b, l as M, k as W } from "./utils-BXCGNjIy.js";
-import { P as j } from "./index-D86vS9UF.js";
+import { R as U } from "./style-08foMKSd.js";
+import { p as I, o as b, l as M, k as W } from "./utils-BbgAIA9N.js";
+import { P as j } from "./index-YGcWbzeb.js";
 const E = p.div`
   width: 100%;
   height: 22.5rem;

package/dist/ProgressBar.cjs

@@ -1,4 +1,4 @@
-"use strict";const a=require("react/jsx-runtime"),i=require("react"),r=require("./index-BPVoEhTF.cjs"),l=require("./emotion-styled.browser.esm-BtEseadx.cjs"),o=require("./utils-BWzf4vLl.cjs"),P=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),f=l.styled.div`
+"use strict";const a=require("react/jsx-runtime"),i=require("react"),r=require("./index-BPVoEhTF.cjs"),l=require("./emotion-styled.browser.esm-BtEseadx.cjs"),o=require("./utils-CZynEOC_.cjs"),P=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),f=l.styled.div`
   width: 100%;
   position: relative;
   background-color: ${e=>o.getColorRgbaValue(e.theme,"Progress",e.color,"enabled","unfilled")};

package/dist/ProgressBar.js

@@ -2,7 +2,7 @@ import { jsxs as m, jsx as h } from "react/jsx-runtime";
 import { forwardRef as f, isValidElement as P, cloneElement as y } from "react";
 import { P as r } from "./index-S5Cd7WrG.js";
 import { s as t } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { b as n, c as x } from "./utils-BXCGNjIy.js";
+import { b as n, c as x } from "./utils-BbgAIA9N.js";
 import { u as $ } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const w = t.div`
   width: 100%;

package/dist/QuattroCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),n=require("react"),s=require("./utils-BWzf4vLl.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),m=require("./consts-goSZX3xP.cjs"),g=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),u=require("./styled-components.browser.esm-CMTEDJ_5.cjs"),_=c.styled.div`
+"use strict";const e=require("react/jsx-runtime"),n=require("react"),s=require("./utils-CZynEOC_.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),m=require("./consts-goSZX3xP.cjs"),g=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),u=require("./styled-components.browser.esm-CMTEDJ_5.cjs"),_=c.styled.div`
   position: absolute;
   top: 0;
   left: 0;

package/dist/QuattroCardsSection.js

@@ -1,6 +1,6 @@
 import { jsxs as n, jsx as r } from "react/jsx-runtime";
 import { forwardRef as l, memo as g, useMemo as f } from "react";
-import { t as h, p as u, k as _ } from "./utils-BXCGNjIy.js";
+import { t as h, p as u, k as _ } from "./utils-BbgAIA9N.js";
 import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as m } from "./consts-BuFChS64.js";
 import { u as b } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";

package/dist/QuizSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),i=require("react"),N=require("./utils-BWzf4vLl.cjs"),k=require("./Button.cjs"),T=require("./emotion-styled.browser.esm-BtEseadx.cjs"),_=require("./consts-goSZX3xP.cjs"),M=require("./Icon.cjs"),K=require("./ProgressBar.cjs"),V=T.styled.div`
+"use strict";const e=require("react/jsx-runtime"),i=require("react"),N=require("./utils-CZynEOC_.cjs"),k=require("./Button.cjs"),T=require("./emotion-styled.browser.esm-BtEseadx.cjs"),_=require("./consts-goSZX3xP.cjs"),M=require("./Icon.cjs"),K=require("./ProgressBar.cjs"),V=T.styled.div`
   display: flex;
   flex-direction: column;
   justify-content: center;

package/dist/QuizSection.js

@@ -1,6 +1,6 @@
 import { jsxs as t, jsx as r } from "react/jsx-runtime";
 import { forwardRef as I, useState as w, useRef as B, useEffect as re } from "react";
-import { x as ae, k as te, l as G, v as ie } from "./utils-BXCGNjIy.js";
+import { x as ae, k as te, l as G, v as ie } from "./utils-BbgAIA9N.js";
 import z from "./Button.js";
 import { s as E } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as U, C as H, a as P } from "./consts-BuFChS64.js";

package/dist/RadioInput.cjs

@@ -1,4 +1,4 @@
-"use strict";const i=require("react/jsx-runtime"),h=require("react"),m=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./index-BPVoEhTF.cjs"),o=require("./utils-BWzf4vLl.cjs"),O=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),j=e=>e=="left"?"row-reverse":"row",q=m.styled.label`
+"use strict";const i=require("react/jsx-runtime"),h=require("react"),m=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./index-BPVoEhTF.cjs"),o=require("./utils-CZynEOC_.cjs"),O=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),j=e=>e=="left"?"row-reverse":"row",q=m.styled.label`
   min-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
   max-height: ${e=>o.getSizeValueWithUnits(e.theme,e.size)};
   width: 100%;

package/dist/RadioInput.js

@@ -2,7 +2,7 @@ import { jsxs as b, jsx as r } from "react/jsx-runtime";
 import { forwardRef as P, useState as j } from "react";
 import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { P as i } from "./index-S5Cd7WrG.js";
-import { d as f, c as N, e as T, b as t } from "./utils-BXCGNjIy.js";
+import { d as f, c as N, e as T, b as t } from "./utils-BbgAIA9N.js";
 import { u as F } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const I = (e) => e == "left" ? "row-reverse" : "row", D = g.label`
   min-height: ${(e) => f(e.theme, e.size)};

package/dist/RangeSlider.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),y=require("./emotion-styled.browser.esm-BtEseadx.cjs"),n=require("./index-BPVoEhTF.cjs"),o=require("react"),a=require("./utils-BWzf4vLl.cjs"),U=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),_=require("./useUpdateEffect-BtMgpgIV.cjs"),L=({theme:e,size:i})=>{var c=a.getSizeValueWithUnits(e,i);return`
+"use strict";const r=require("react/jsx-runtime"),y=require("./emotion-styled.browser.esm-BtEseadx.cjs"),n=require("./index-BPVoEhTF.cjs"),o=require("react"),t=require("./utils-CZynEOC_.cjs"),U=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),_=require("./useUpdateEffect-BtMgpgIV.cjs"),L=({theme:e,size:i})=>{var c=t.getSizeValueWithUnits(e,i);return`
     min-height: ${c};
     max-height: ${c};
   `},b={small:"0.875rem",medium:"1.125rem",large:"1.375rem"},W=y.styled.div`
@@ -17,14 +17,14 @@
   background: ${e=>e.rangeBackground};
   transition: background 450ms ease-in;
   -webkit-appearance: none;
-  border-radius: ${e=>a.getBorderRadiusValueWithUnits(e.theme,"regular")};
+  border-radius: ${e=>t.getBorderRadiusValueWithUnits(e.theme,"regular")};
   &::-webkit-slider-thumb {
     -webkit-appearance: none; /* Override default look */
     appearance: none;
     width: ${e=>b[e.size]}; /* Set a specific slider handle width */
     height: ${e=>b[e.size]}; /* Slider handle height */
     border-radius: 50%;
-    background-color: ${e=>a.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background","backgroundOpacity")};
     cursor: pointer; /* Cursor on hover */
     border: none;
   }
@@ -32,7 +32,7 @@
     width: ${e=>b[e.size]}; /* Set a specific slider handle width */
     height: ${e=>b[e.size]}; /* Slider handle height */
     border-radius: 50%;
-    background-color: ${e=>a.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background","backgroundOpacity")};
     cursor: pointer; /* Cursor on hover */
     border: none;
   }
@@ -41,13 +41,13 @@
   flex-direction: column;
   align-items: center;
   position: absolute;
-  ${e=>a.getComponentTypographyCss(e.theme,"Range",e.size,"enabled")};
+  ${e=>t.getComponentTypographyCss(e.theme,"Range",e.size,"enabled")};
   left: ${e=>`calc(${e.inputValue+"%"} + (${8-e.inputValue*.15}px))`};
   top: ${e=>"calc(-"+b[e.size]+")"};
   transform: translateX(-50%);
   & > .text-content {
     color: white;
-    background-color: ${e=>a.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+    background-color: ${e=>t.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
     border-radius: 3px;
     z-index: 2;
     padding: 2px 6px;
@@ -59,7 +59,7 @@
       & > .inner {
         width: 8px;
         height: 8px;
-        background: ${e=>a.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
+        background: ${e=>t.getColorRgbaValue(e.theme,"Range",e.color,e.disabled===!0?"disabled":"enabled","background")};
         transform: rotate(45deg);
         position: absolute;
         top: -6px;
@@ -69,4 +69,4 @@
       }
     }
   }
-`,q=o.forwardRef((e,i)=>{const{defaultValue:c,value:l=null,min:g=0,max:h=100,disabled:d,tabIndex:v=0,onChange:R=()=>{},onInput:$=()=>{},color:u="primary",size:E="small",className:N="",style:O={},...C}=e,k=o.useRef(),p=U.useTheme(),m={theme:p,size:E,color:u,className:N,style:O},w=a.getColorRgbaValue(p,"Range",u,"enabled","unfilled"),[S,M]=o.useState(a.getColorRgbaValue(p,"Range",u,d?"disabled":"enabled","background")),[P,B]=o.useState(),[F,f]=o.useState(),x=o.useCallback(r=>Math.round((r-g)/(h-g)*100),[g,h]),[s,T]=o.useState(l||c);_.useUpdateEffect(()=>{T(l)},[l]),o.useEffect(()=>{z(s||0)},[s,x,d,u]),o.useEffect(()=>{M(a.getColorRgbaValue(p,"Range",u,d?"disabled":"enabled","background"))},[u,d]);const V=r=>{z(r.target.value),$&&$(r)},z=r=>{B(`linear-gradient(to right, ${S} 0%, ${S} ${x(r)}%, ${w} ${x(r)}%, ${w} 100%)`)},j=r=>{T(r.target.value),R&&R(r)};return t.jsxs(W,{...m,children:[F&&s&&t.jsx(t.Fragment,{children:t.jsxs(X,{...m,inputValue:x(s),children:[t.jsx("div",{className:"text-content",children:s}),t.jsx("div",{className:"arrow",children:t.jsx("div",{className:"outer",children:t.jsx("div",{className:"inner"})})})]})}),l==null||l=="undefined"?t.jsx(I,{ref:i||k,id:"fader",type:"range",min:g,max:h,defaultValue:c,disabled:d,tabIndex:v,onMouseEnter:()=>{f(!0)},onMouseLeave:()=>{f(!1)},rangeBackground:P,onInput:V,onChange:j,...m,...C}):t.jsx(I,{ref:i||k,id:"fader",type:"range",min:g,max:h,value:s,disabled:d,tabIndex:v,onMouseEnter:()=>{f(!0)},onMouseLeave:()=>{f(!1)},rangeBackground:P,onInput:V,onChange:j,...m,...C})]})});q.propTypes={value:n.PropTypes.number,defaultValue:n.PropTypes.number,min:n.PropTypes.number,max:n.PropTypes.number,disabled:n.PropTypes.bool,tabIndex:n.PropTypes.number,onChange:n.PropTypes.func,onInput:n.PropTypes.func,className:n.PropTypes.string,style:n.PropTypes.object,size:n.PropTypes.oneOf(["small","medium","large"]),color:n.PropTypes.oneOf(["primary","secondary","success","danger","warning","disabled","information","neutral","gray"])};module.exports=q;
+`,O=o.forwardRef((e,i)=>{const{defaultValue:c,value:l=null,min:g=0,max:p=100,disabled:d,tabIndex:v=0,onChange:R=()=>{},onInput:k=()=>{},color:u="primary",size:q="small",className:E="",style:N={},...$}=e,C=o.useRef(),h=U.useTheme(),m={theme:h,size:q,color:u,className:E,style:N},w=t.getColorRgbaValue(h,"Range",u,"enabled","unfilled"),[S,M]=o.useState(t.getColorRgbaValue(h,"Range",u,d?"disabled":"enabled","background")),[P,B]=o.useState(),[F,f]=o.useState(),x=o.useCallback(a=>Math.round((a-g)/(p-g)*100),[g,p]),[s,T]=o.useState(l||c);_.useUpdateEffect(()=>{T(l)},[l]),o.useEffect(()=>{z(s||0)},[s,x,d,u]),o.useEffect(()=>{M(t.getColorRgbaValue(h,"Range",u,d?"disabled":"enabled","background"))},[u,d]);const V=a=>{z(a.target.value),k&&k(a)},z=a=>{B(`linear-gradient(to right, ${S} 0%, ${S} ${x(a)}%, ${w} ${x(a)}%, ${w} 100%)`)},j=a=>{T(a.target.value),R&&R(a)};return r.jsxs(W,{...m,children:[F&&s&&r.jsx(r.Fragment,{children:r.jsxs(X,{...m,inputValue:x(s),children:[r.jsx("div",{className:"text-content",children:s}),r.jsx("div",{className:"arrow",children:r.jsx("div",{className:"outer",children:r.jsx("div",{className:"inner"})})})]})}),l==null||l=="undefined"?r.jsx(I,{ref:i||C,id:"fader",type:"range",min:g,max:p,defaultValue:c,disabled:d,tabIndex:v,onMouseEnter:()=>{f(!0)},onMouseLeave:()=>{f(!1)},rangeBackground:P,onInput:V,onChange:j,...m,...$}):r.jsx(I,{ref:i||C,id:"fader",type:"range",min:g,max:p,value:s,disabled:d,tabIndex:v,onMouseEnter:()=>{f(!0)},onMouseLeave:()=>{f(!1)},rangeBackground:P,onInput:V,onChange:j,...m,...$})]})});O.propTypes={value:n.PropTypes.number,defaultValue:n.PropTypes.number,min:n.PropTypes.number,max:n.PropTypes.number,disabled:n.PropTypes.bool,tabIndex:n.PropTypes.number,onChange:n.PropTypes.func,onInput:n.PropTypes.func,className:n.PropTypes.string,style:n.PropTypes.object,size:n.PropTypes.oneOf(["small","medium","large"]),color:n.PropTypes.oneOf(["primary","secondary","success","danger","warning","disabled","information","neutral","gray"])};module.exports=O;

package/dist/RangeSlider.js

@@ -1,8 +1,8 @@
-import { jsxs as O, jsx as t, Fragment as W } from "react/jsx-runtime";
+import { jsxs as N, jsx as t, Fragment as W } from "react/jsx-runtime";
 import { s as x } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { P as n } from "./index-S5Cd7WrG.js";
 import { forwardRef as X, useRef as q, useState as v, useCallback as A, useEffect as M } from "react";
-import { a as D, b as o, c as G, d as H } from "./utils-BXCGNjIy.js";
+import { a as D, b as o, c as G, d as H } from "./utils-BbgAIA9N.js";
 import { u as J } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 import { u as K } from "./useUpdateEffect-CuYWz7EA.js";
 const Q = ({ theme: e, size: i }) => {
@@ -43,7 +43,8 @@ const Q = ({ theme: e, size: i }) => {
   "Range",
   e.color,
   e.disabled === !0 ? "disabled" : "enabled",
-  "background"
+  "background",
+  "backgroundOpacity"
 )};
     cursor: pointer; /* Cursor on hover */
     border: none;
@@ -57,7 +58,8 @@ const Q = ({ theme: e, size: i }) => {
   "Range",
   e.color,
   e.disabled === !0 ? "disabled" : "enabled",
-  "background"
+  "background",
+  "backgroundOpacity"
 )};
     cursor: pointer; /* Cursor on hover */
     border: none;
@@ -114,8 +116,8 @@ const Q = ({ theme: e, size: i }) => {
     min: c = 0,
     max: h = 100,
     disabled: l,
-    tabIndex: $ = 0,
-    onChange: k = () => {
+    tabIndex: k = 0,
+    onChange: $ = () => {
     },
     onInput: w = () => {
     },
@@ -145,7 +147,7 @@ const Q = ({ theme: e, size: i }) => {
   K(() => {
     I(d);
   }, [d]), M(() => {
-    P(r || 0);
+    O(r || 0);
   }, [r, f, l, s]), M(() => {
     F(
       o(
@@ -158,18 +160,18 @@ const Q = ({ theme: e, size: i }) => {
     );
   }, [s, l]);
   const V = (a) => {
-    P(a.target.value), w && w(a);
-  }, P = (a) => {
+    O(a.target.value), w && w(a);
+  }, O = (a) => {
     U(
       `linear-gradient(to right, ${S} 0%, ${S} ${f(
         a
       )}%, ${R} ${f(a)}%, ${R} 100%)`
     );
-  }, N = (a) => {
-    I(a.target.value), k && k(a);
+  }, P = (a) => {
+    I(a.target.value), $ && $(a);
   };
-  return /* @__PURE__ */ O(Y, { ...b, children: [
-    L && r && /* @__PURE__ */ t(W, { children: /* @__PURE__ */ O(Z, { ...b, inputValue: f(r), children: [
+  return /* @__PURE__ */ N(Y, { ...b, children: [
+    L && r && /* @__PURE__ */ t(W, { children: /* @__PURE__ */ N(Z, { ...b, inputValue: f(r), children: [
       /* @__PURE__ */ t("div", { className: "text-content", children: r }),
       /* @__PURE__ */ t("div", { className: "arrow", children: /* @__PURE__ */ t("div", { className: "outer", children: /* @__PURE__ */ t("div", { className: "inner" }) }) })
     ] }) }),
@@ -183,7 +185,7 @@ const Q = ({ theme: e, size: i }) => {
         max: h,
         defaultValue: u,
         disabled: l,
-        tabIndex: $,
+        tabIndex: k,
         onMouseEnter: () => {
           p(!0);
         },
@@ -192,7 +194,7 @@ const Q = ({ theme: e, size: i }) => {
         },
         rangeBackground: z,
         onInput: V,
-        onChange: N,
+        onChange: P,
         ...b,
         ...y
       }
@@ -206,7 +208,7 @@ const Q = ({ theme: e, size: i }) => {
         max: h,
         value: r,
         disabled: l,
-        tabIndex: $,
+        tabIndex: k,
         onMouseEnter: () => {
           p(!0);
         },
@@ -215,7 +217,7 @@ const Q = ({ theme: e, size: i }) => {
         },
         rangeBackground: z,
         onInput: V,
-        onChange: N,
+        onChange: P,
         ...b,
         ...y
       }

package/dist/ReviewsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),d=require("react"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),$=require("./useDetectMobile-zkbzoOGV.cjs"),g=require("./utils-BWzf4vLl.cjs"),N=require("./ThemeProvider.cjs"),a=require("./index-BPVoEhTF.cjs"),P=require("./index-BRgZcjpI.cjs"),C=c.styled.div`
+"use strict";const r=require("react/jsx-runtime"),d=require("react"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),$=require("./useDetectMobile-zkbzoOGV.cjs"),g=require("./utils-CZynEOC_.cjs"),N=require("./ThemeProvider.cjs"),a=require("./index-BPVoEhTF.cjs"),P=require("./index-BvSNRLNa.cjs"),C=c.styled.div`
   display: flex;
   flex-direction: column;
   color: var(--darkest-950);

package/dist/ReviewsSection.js

@@ -3,10 +3,10 @@ import { forwardRef as h, Suspense as C, memo as k, useMemo as x } from "react";
 import { s as d } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as z } from "./consts-BuFChS64.js";
 import { u as P } from "./useDetectMobile-Bkvj0VMa.js";
-import { t as R, p as M, o as I, b as j, g as E } from "./utils-BXCGNjIy.js";
+import { t as R, p as M, o as I, b as j, g as E } from "./utils-BbgAIA9N.js";
 import { useTheme as T } from "./ThemeProvider.js";
 import { P as l } from "./index-S5Cd7WrG.js";
-import { P as A } from "./index-D86vS9UF.js";
+import { P as A } from "./index-YGcWbzeb.js";
 const W = d.div`
   display: flex;
   flex-direction: column;

package/dist/SalesCampaignsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),p=require("react"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./utils-BWzf4vLl.cjs"),C=require("./consts-goSZX3xP.cjs"),L=require("./motion-B_VPZaJq.cjs"),o=require("./index-BPVoEhTF.cjs"),W=require("./Icon.cjs"),Q=require("./Badge.cjs"),B=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),M=require("./IconButton.cjs"),V=require("./useDetectMobile-zkbzoOGV.cjs"),Y=d.styled.div`
+"use strict";const t=require("react/jsx-runtime"),p=require("react"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./utils-CZynEOC_.cjs"),C=require("./consts-goSZX3xP.cjs"),L=require("./motion-B_VPZaJq.cjs"),o=require("./index-BPVoEhTF.cjs"),W=require("./Icon.cjs"),Q=require("./Badge.cjs"),B=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),M=require("./IconButton.cjs"),V=require("./useDetectMobile-zkbzoOGV.cjs"),Y=d.styled.div`
   cursor: pointer;
   display: flex;
   gap: 1rem;

package/dist/SalesCampaignsSection.js

@@ -1,7 +1,7 @@
 import { jsx as a, jsxs as f, Fragment as ae } from "react/jsx-runtime";
 import { createElement as te, forwardRef as P, Suspense as oe, useState as E, useEffect as ne, memo as ie, useMemo as se } from "react";
 import { s as d } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { a as N, o as G, k as O } from "./utils-BXCGNjIy.js";
+import { a as N, o as G, k as O } from "./utils-BbgAIA9N.js";
 import { M as k } from "./consts-BuFChS64.js";
 import { m as Z } from "./motion-Ckekul_K.js";
 import { P as n } from "./index-S5Cd7WrG.js";

package/dist/Separator.cjs

@@ -1,4 +1,4 @@
-"use strict";const i=require("react/jsx-runtime"),l=require("react"),r=require("./index-BPVoEhTF.cjs"),m=require("./emotion-styled.browser.esm-BtEseadx.cjs"),u=require("./utils-BWzf4vLl.cjs"),p=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),d=m.styled.div`
+"use strict";const i=require("react/jsx-runtime"),l=require("react"),r=require("./index-BPVoEhTF.cjs"),m=require("./emotion-styled.browser.esm-BtEseadx.cjs"),u=require("./utils-CZynEOC_.cjs"),p=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),d=m.styled.div`
   height: 1px;
   background-color: ${e=>u.getColorRgbaValue(e.theme,"MenuItem","default","enabled","separator")};
   margin-left: -0.25rem;

package/dist/Separator.js

@@ -2,7 +2,7 @@ import { jsx as p } from "react/jsx-runtime";
 import { forwardRef as l } from "react";
 import { P as e } from "./index-S5Cd7WrG.js";
 import { s as i } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { b as n } from "./utils-BXCGNjIy.js";
+import { b as n } from "./utils-BbgAIA9N.js";
 import { u as c } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const f = i.div`
   height: 1px;

package/dist/ShopCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),y=require("react"),c=require("./Button.cjs"),p=require("./skeleton-DwZzdFei.cjs"),v=require("./utils-BWzf4vLl.cjs"),j=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./consts-goSZX3xP.cjs"),C=j.styled.div`
+"use strict";const t=require("react/jsx-runtime"),y=require("react"),c=require("./Button.cjs"),p=require("./skeleton-DdlE-y3C.cjs"),v=require("./utils-CZynEOC_.cjs"),j=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./consts-goSZX3xP.cjs"),C=j.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;