@latte-macchiat-io/latte-vanilla-components 0.0.140 → 0.0.141

package/dist/index.es.js

@@ -1803,8 +1803,8 @@ const Hp = ({
     }
   );
 };
-var ii = { videoFullWidthLeft: "var(--_29n9il0)", videoFullWidthRight: "var(--_29n9il1)" }, Kp = "_29n9il2";
-const Yp = ({
+var Kp = { display: "flex", flexDirection: "column" }, ii = { videoFullWidthLeft: "var(--_29n9il0)", videoFullWidthRight: "var(--_29n9il1)" }, Yp = "_29n9il2";
+const Xp = ({
   video: t,
   poster: e,
   className: n,
@@ -1839,8 +1839,8 @@ const Yp = ({
     }
   );
 };
-var wl = { languageSwitcherWidth: "var(--_9kkynw0)" }, Xp = "_9kkynw1", Cl = "_9kkynw2", Pl = "_9kkynw3";
-const Zp = ({
+var wl = { languageSwitcherWidth: "var(--_9kkynw0)" }, Zp = "_9kkynw1", Cl = "_9kkynw2", Pl = "_9kkynw3";
+const Jp = ({
   currentLocale: t,
   handleChange: e,
   locales: n,
@@ -1872,8 +1872,8 @@ const Zp = ({
     }
   );
 };
-var Al = "var(--_1wp326d0)", Vl = "var(--_1wp326d1)", Jp = { display: "flex", backgroundColor: "var(--_1wp326d1)", flex: "1 1 auto", minHeight: "45vh", textAlign: "center", alignItems: "center", flexDirection: "column", justifyContent: "center", "@media": { "screen and (min-width: 768px)": { minHeight: "var(--_1wp326d0)" } } };
-const Qp = ({ children: t, className: e, theme: n = L }) => {
+var Al = "var(--_1wp326d0)", Vl = "var(--_1wp326d1)", Qp = { display: "flex", backgroundColor: "var(--_1wp326d1)", flex: "1 1 auto", minHeight: "45vh", textAlign: "center", alignItems: "center", flexDirection: "column", justifyContent: "center", "@media": { "screen and (min-width: 768px)": { minHeight: "var(--_1wp326d0)" } } };
+const tm = ({ children: t, className: e, theme: n = L }) => {
   const { main: { backgroundColor: r, minHeight: i } } = n;
   return /* @__PURE__ */ S("main", { className: e, style: D({
     [Al]: i,
@@ -1927,8 +1927,8 @@ const Dl = ({
     }
   );
 };
-var Ll = { isFixed: "var(--_15wg1hu0)" }, $l = "_15wg1hu2", _l = "_15wg1hu3";
-const tm = ({
+var Ll = { isFixed: "var(--_15wg1hu0)" }, em = "_15wg1hu1", $l = "_15wg1hu2", _l = "_15wg1hu3";
+const nm = ({
   children: t,
   isFixed: e = !1,
   childrenOverlay: n,
@@ -1965,8 +1965,8 @@ const tm = ({
     e && /* @__PURE__ */ S("div", { className: _l })
   ] });
 };
-var $t = { footerGap: "var(--fl7h880)", footerBackgroundColor: "var(--fl7h881)", footerPaddingTop: "var(--fl7h882)", footerPaddingBottom: "var(--fl7h883)", footerPaddingLeft: "var(--fl7h884)", footerPaddingRight: "var(--fl7h885)" }, em = "fl7h886";
-const nm = ({ children: t, className: e, theme: n = L }) => {
+var $t = { footerGap: "var(--fl7h880)", footerBackgroundColor: "var(--fl7h881)", footerPaddingTop: "var(--fl7h882)", footerPaddingBottom: "var(--fl7h883)", footerPaddingLeft: "var(--fl7h884)", footerPaddingRight: "var(--fl7h885)" }, rm = "fl7h886";
+const im = ({ children: t, className: e, theme: n = L }) => {
   const r = lt(), {
     global: { paddingLeft: i, paddingRight: s },
     footer: { gap: o, backgroundColor: a, paddingTop: c, paddingBottom: l }
@@ -1980,8 +1980,8 @@ const nm = ({ children: t, className: e, theme: n = L }) => {
     [$t.footerPaddingRight]: `${s[r]}px`
   }), children: t });
 };
-var _t = { columnsGap: "var(--mx2tfy0)", columnsTextAlign: "var(--mx2tfy1)", columnsJustifyContent: "var(--mx2tfy2)", isCentered: "var(--mx2tfy3)", isInverted: "var(--mx2tfy4)", column0: "var(--mx2tfy5)", column1: "var(--mx2tfy6)", column2: "var(--mx2tfy7)", column3: "var(--mx2tfy8)" }, rm = "mx2tfy9", ie = /* @__PURE__ */ ((t) => (t[t.Center = 0] = "Center", t[t.Left = 1] = "Left", t[t.Right = 2] = "Right", t))(ie || {});
-const im = ({
+var _t = { columnsGap: "var(--mx2tfy0)", columnsTextAlign: "var(--mx2tfy1)", columnsJustifyContent: "var(--mx2tfy2)", isCentered: "var(--mx2tfy3)", isInverted: "var(--mx2tfy4)", column0: "var(--mx2tfy5)", column1: "var(--mx2tfy6)", column2: "var(--mx2tfy7)", column3: "var(--mx2tfy8)" }, sm = "mx2tfy9", ie = /* @__PURE__ */ ((t) => (t[t.Center = 0] = "Center", t[t.Left = 1] = "Left", t[t.Right = 2] = "Right", t))(ie || {});
+const om = ({
   columns: t,
   children: e,
   align: n = ie.Left,
@@ -2274,7 +2274,7 @@ function Kl(t, e, n) {
     [e]
   );
 }
-const ur = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Yl = "framerAppearId", Ys = "data-" + ur(Yl), { schedule: dr, cancel: sm } = qs(queueMicrotask, !1), Xs = Kt({});
+const ur = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Yl = "framerAppearId", Ys = "data-" + ur(Yl), { schedule: dr, cancel: am } = qs(queueMicrotask, !1), Xs = Kt({});
 function Xl(t, e, n, r, i) {
   var s, o;
   const { visualElement: a } = Y(cn), c = Y(Gs), l = Y(sr), u = Y(Ws).reducedMotion, d = zt(null);
@@ -6832,7 +6832,7 @@ function fp(t, { root: e, margin: n, amount: r, once: i = !1, initial: s = !1 }
     return dp(t.current, c, l);
   }, [e, t, n, i, r]), o;
 }
-var hp = "var(--_14qm28z0)", pp = "var(--_14qm28z1)", mp = "var(--_14qm28z2)", gp = "var(--_14qm28z3)", yp = "var(--_14qm28z4)", vp = "var(--_14qm28z5)", xp = "var(--_14qm28z6)", bp = "var(--_14qm28z7)", Tp = "var(--_14qm28z8)", Sp = "var(--_14qm28z9)", am = { width: "100%", display: "flex", alignItems: "center", position: "relative", flexDirection: "column", animation: "background 0.5s ease-in-out", color: "var(--_14qm28z2)", zIndex: "var(--_14qm28z1)", minHeight: "var(--_14qm28z7)", paddingTop: "var(--_14qm28z3)", paddingLeft: "var(--_14qm28z4)", paddingRight: "var(--_14qm28z5)", paddingBottom: "var(--_14qm28z6)", background: "var(--_14qm28z9)", justifyContent: "var(--_14qm28z8)" }, wp = "_14qm28zb", Ge = /* @__PURE__ */ ((t) => (t[t.Center = 0] = "Center", t[t.Left = 1] = "Left", t[t.Right = 2] = "Right", t))(Ge || {});
+var hp = "var(--_14qm28z0)", pp = "var(--_14qm28z1)", mp = "var(--_14qm28z2)", gp = "var(--_14qm28z3)", yp = "var(--_14qm28z4)", vp = "var(--_14qm28z5)", xp = "var(--_14qm28z6)", bp = "var(--_14qm28z7)", Tp = "var(--_14qm28z8)", Sp = "var(--_14qm28z9)", lm = { width: "100%", display: "flex", alignItems: "center", position: "relative", flexDirection: "column", animation: "background 0.5s ease-in-out", color: "var(--_14qm28z2)", zIndex: "var(--_14qm28z1)", minHeight: "var(--_14qm28z7)", paddingTop: "var(--_14qm28z3)", paddingLeft: "var(--_14qm28z4)", paddingRight: "var(--_14qm28z5)", paddingBottom: "var(--_14qm28z6)", background: "var(--_14qm28z9)", justifyContent: "var(--_14qm28z8)" }, wp = "_14qm28zb", Ge = /* @__PURE__ */ ((t) => (t[t.Center = 0] = "Center", t[t.Left = 1] = "Left", t[t.Right = 2] = "Right", t))(Ge || {});
 const Cp = {
   hidden: {
     opacity: 0
@@ -6846,7 +6846,7 @@ const Cp = {
       type: "spring"
     }
   }
-}, cm = ({
+}, um = ({
   children: t,
   className: e,
   zIndex: n = 20,
@@ -6884,8 +6884,8 @@ const Cp = {
     [hp]: s === Ge.Center ? "center" : s === Ge.Right ? "right" : "left"
   }), children: t }) });
 };
-var Pp = { navGap: "var(--_1h6zt340)" }, lm = "_1h6zt341";
-const um = ({ children: t, theme: e = L, className: n }) => {
+var Pp = { navGap: "var(--_1h6zt340)" }, dm = "_1h6zt341";
+const fm = ({ children: t, theme: e = L, className: n }) => {
   const r = lt(), { nav: { gap: i } } = e;
   return /* @__PURE__ */ S(
     "nav",
@@ -6898,8 +6898,8 @@ const um = ({ children: t, theme: e = L, className: n }) => {
     }
   );
 };
-var Ap = { navSocialGap: "var(--g7q46n0)" }, dm = "g7q46n1", Vp = "g7q46n2";
-const fm = ({ navSocial: t, className: e, theme: n = L }) => {
+var Ap = { navSocialGap: "var(--g7q46n0)" }, hm = "g7q46n1", Vp = "g7q46n2";
+const pm = ({ navSocial: t, className: e, theme: n = L }) => {
   const r = lt(), {
     navSocial: { gap: i }
   } = n;
@@ -6917,8 +6917,8 @@ const fm = ({ navSocial: t, className: e, theme: n = L }) => {
     }
   );
 };
-var Rp = { navLegalGap: "var(--vehv9e0)" }, hm = "vehv9e1";
-const pm = ({ children: t, className: e, theme: n = L }) => {
+var Rp = { navLegalGap: "var(--vehv9e0)" }, mm = "vehv9e1";
+const gm = ({ children: t, className: e, theme: n = L }) => {
   const r = lt(), {
     navLegal: { gap: i }
   } = n;
@@ -6933,8 +6933,8 @@ const pm = ({ children: t, className: e, theme: n = L }) => {
     }
   );
 };
-var Dn = { formWidth: "var(--dvq5w80)", formPadding: "var(--dvq5w81)", formBackgroundColor: "var(--dvq5w82)" };
-const mm = ({ action: t, children: e, theme: n = L, className: r }) => /* @__PURE__ */ S(
+var Dn = { formWidth: "var(--dvq5w80)", formPadding: "var(--dvq5w81)", formBackgroundColor: "var(--dvq5w82)" }, ym = "dvq5w84";
+const vm = ({ action: t, children: e, theme: n = L, className: r }) => /* @__PURE__ */ S(
   "form",
   {
     className: r,
@@ -6948,7 +6948,7 @@ const mm = ({ action: t, children: e, theme: n = L, className: r }) => /* @__PUR
   }
 );
 var Be = { rowGap: "var(--_223sdz0)", rowPadding: "var(--_223sdz1)", rowFontSize: "var(--_223sdz2)", rowJustifyContent: "var(--_223sdz3)" }, He = /* @__PURE__ */ ((t) => (t[t.Center = 0] = "Center", t[t.Left = 1] = "Left", t[t.Right = 2] = "Right", t))(He || {});
-const gm = ({
+const xm = ({
   children: t,
   theme: e = L,
   className: n,
@@ -6968,7 +6968,7 @@ const gm = ({
     children: t
   }
 );
-var Tt = { font: "var(--k6gj0i0)", color: "var(--k6gj0i1)", border: "var(--k6gj0i2)", borderRadius: "var(--k6gj0i3)", backgroundColor: "var(--k6gj0i4)", padding: "var(--k6gj0i5)", placeholderColor: "var(--k6gj0i6)", placeholderOpacity: "var(--k6gj0i7)" }, ym = "k6gj0i9", Ir = /* @__PURE__ */ ((t) => (t.Text = "text", t.Email = "email", t.Search = "search", t.Number = "number", t.Hidden = "hidden", t.Password = "password", t))(Ir || {});
+var Tt = { font: "var(--k6gj0i0)", color: "var(--k6gj0i1)", border: "var(--k6gj0i2)", borderRadius: "var(--k6gj0i3)", backgroundColor: "var(--k6gj0i4)", padding: "var(--k6gj0i5)", placeholderColor: "var(--k6gj0i6)", placeholderOpacity: "var(--k6gj0i7)" }, bm = "k6gj0i9", Ir = /* @__PURE__ */ ((t) => (t.Text = "text", t.Email = "email", t.Search = "search", t.Number = "number", t.Hidden = "hidden", t.Password = "password", t))(Ir || {});
 const Ep = ({
   name: t,
   value: e = "",
@@ -7001,7 +7001,7 @@ const Ep = ({
     })
   }
 );
-var St = { font: "var(--l5ei120)", color: "var(--l5ei121)", border: "var(--l5ei122)", borderRadius: "var(--l5ei123)", padding: "var(--l5ei124)", backgroundColor: "var(--l5ei125)", placeholderColor: "var(--l5ei126)", placeholderOpacity: "var(--l5ei127)" }, vm = "l5ei129";
+var St = { font: "var(--l5ei120)", color: "var(--l5ei121)", border: "var(--l5ei122)", borderRadius: "var(--l5ei123)", padding: "var(--l5ei124)", backgroundColor: "var(--l5ei125)", placeholderColor: "var(--l5ei126)", placeholderOpacity: "var(--l5ei127)" }, Tm = "l5ei129";
 const Mp = ({
   name: t,
   value: e,
@@ -7034,7 +7034,7 @@ const Mp = ({
     })
   }
 );
-var Oe = { font: "var(--_1s956dc0)", color: "var(--_1s956dc1)", fontWeight: "var(--_1s956dc2)", paddingBottom: "var(--_1s956dc3)" }, xm = "_1s956dc5";
+var Oe = { font: "var(--_1s956dc0)", color: "var(--_1s956dc1)", fontWeight: "var(--_1s956dc2)", paddingBottom: "var(--_1s956dc3)" }, Sm = "_1s956dc5";
 const kp = ({
   name: t,
   label: e,
@@ -7058,8 +7058,8 @@ const kp = ({
     ]
   }
 );
-var Dp = { errorColor: "var(--_1e95ziv0)" }, xa = /* @__PURE__ */ ((t) => (t.Textarea = "textarea", t))(xa || {});
-const bm = ({
+var Dp = { errorColor: "var(--_1e95ziv0)" }, wm = "_1e95ziv2", xa = /* @__PURE__ */ ((t) => (t.Textarea = "textarea", t))(xa || {});
+const Cm = ({
   name: t,
   label: e = "",
   value: n = "",
@@ -7079,7 +7079,7 @@ const bm = ({
   u === xa.Textarea ? /* @__PURE__ */ S(Mp, { className: "", value: n, rows: r, name: t, theme: c, onChange: l, disabled: s, placeholder: o }) : /* @__PURE__ */ S(Ep, { className: "", value: n, type: u, name: t, theme: c, onChange: l, disabled: s, placeholder: o }),
   a && /* @__PURE__ */ S("div", { children: a instanceof Array ? a.map((f, h) => /* @__PURE__ */ S("span", { children: f }, h)) : a })
 ] });
-var yt = { overlayBlur: "var(--pewdww0)", overlayOpacity: "var(--pewdww1)", overlayBackgroundColor: "var(--pewdww2)", width: "var(--pewdww3)", backgroundColor: "var(--pewdww4)", borderRadius: "var(--pewdww5)", borders: "var(--pewdww6)", actionsGap: "var(--pewdww7)", actionsPaddingTop: "var(--pewdww8)" }, Tm = "pewdww9";
+var yt = { overlayBlur: "var(--pewdww0)", overlayOpacity: "var(--pewdww1)", overlayBackgroundColor: "var(--pewdww2)", width: "var(--pewdww3)", backgroundColor: "var(--pewdww4)", borderRadius: "var(--pewdww5)", borders: "var(--pewdww6)", actionsGap: "var(--pewdww7)", actionsPaddingTop: "var(--pewdww8)" }, Pm = "pewdww9";
 function Lp(t) {
   const e = t + "=", r = decodeURIComponent(document.cookie).split(";");
   for (let i = 0; i < r.length; i++) {
@@ -7097,7 +7097,7 @@ function $p(t, e, n) {
   const i = "expires=" + r.toUTCString();
   document.cookie = t + "=" + e + ";" + i + ";path=/";
 }
-const Sm = ({
+const Am = ({
   children: t,
   theme: e = L,
   cookieName: n = "consent",
@@ -7150,47 +7150,51 @@ export {
   Bn as ButtonVariant,
   Gp as Carousel,
   qp as CarouselStyles,
-  im as Columns,
+  om as Columns,
   ie as ColumnsAlign,
-  rm as ColumnsStyles,
-  Sm as ConsentCookie,
-  Tm as ConsentCookieStyles,
-  nm as Footer,
-  em as FooterStyles,
-  mm as Form,
-  gm as FormRow,
+  sm as ColumnsStyles,
+  Am as ConsentCookie,
+  Pm as ConsentCookieStyles,
+  im as Footer,
+  rm as FooterStyles,
+  vm as Form,
+  xm as FormRow,
   He as FormRowAlign,
-  tm as Header,
+  ym as FormStyles,
+  nm as Header,
+  em as HeaderStyles,
   Et as Icon,
   Np as IconStyles,
-  ym as InputStyles,
+  bm as InputStyles,
   Ir as InputType,
   Hp as KeyNumber,
-  Zp as LanguageSwitcher,
-  Xp as LanguageSwitcherStyles,
+  Kp as KeyNumberStyles,
+  Jp as LanguageSwitcher,
+  Zp as LanguageSwitcherStyles,
   Up as Logo,
   Wp as LogoStyles,
-  Qp as Main,
-  Jp as MainStyles,
+  tm as Main,
+  Qp as MainStyles,
   zp as Modal,
   jp as ModalStyles,
-  um as Nav,
-  pm as NavLegal,
-  hm as NavLegalStyles,
-  fm as NavSocial,
-  dm as NavSocialStyles,
-  lm as NavStyles,
-  cm as Section,
+  fm as Nav,
+  gm as NavLegal,
+  mm as NavLegalStyles,
+  pm as NavSocial,
+  hm as NavSocialStyles,
+  dm as NavStyles,
+  um as Section,
   Ge as SectionAlign,
-  am as SectionStyles,
-  bm as TextField,
+  lm as SectionStyles,
+  Cm as TextField,
   Ep as TextFieldInput,
   kp as TextFieldLabel,
-  xm as TextFieldLabelStyles,
+  Sm as TextFieldLabelStyles,
+  wm as TextFieldStyles,
   Mp as TextFieldTextarea,
-  vm as TextareaStyles,
+  Tm as TextareaStyles,
   xa as TextareaType,
   pl as Video,
-  Yp as VideoFullWidth,
-  Kp as VideoFullWidthStyles
+  Xp as VideoFullWidth,
+  Yp as VideoFullWidthStyles
 };

package/dist/latte-vanilla-components.css

@@ -1 +1 @@
-._1h0tdm5e{position:relative;display:inline-block;color:var(--_1h0tdm50);border:var(--_1h0tdm52);cursor:var(--_1h0tdm51);min-width:var(--_1h0tdm53);font-weight:var(--_1h0tdm54);transition:var(--_1h0tdm55);padding-top:var(--_1h0tdm56);padding-left:var(--_1h0tdm57);padding-right:var(--_1h0tdm58);padding-bottom:var(--_1h0tdm59);pointer-event:var(--_1h0tdm5a);border-radius:var(--_1h0tdm5b);letter-spacing:var(--_1h0tdm5c);background-color:var(--_1h0tdm5d)}._1h0tdm5e:hover{opacity:.5}._1v7zi9y5{width:100%;display:flex;flex-wrap:wrap;flex-direction:row;gap:var(--_1v7zi9y0);align-items:var(--_1v7zi9y1);padding-top:var(--_1v7zi9y2);padding-bottom:var(--_1v7zi9y3);justify-content:var(--_1v7zi9y4)}._1slxfz52{margin:0 auto;display:inline-block;vertical-align:middle}._1slxfz52 path{fill:var(--_1slxfz51);transition:color .5s ease}._1slxfz53{0: _;1: 1;2: s;3: l;4: x;5: f;6: z;7: 5;8: 2}._18bqyaqe{z-index:100;position:fixed;width:100%;height:100%}._18bqyaqe:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;opacity:var(--_18bqyaq0);background-color:var(--_18bqyaq1);-webkit-backdrop-filter:blur(var(--_18bqyaq2));backdrop-filter:blur(var(--_18bqyaq2))}._18bqyaqf{0: _;1: 1;2: 8;3: b;4: q;5: y;6: a;7: q;8: e}._18bqyaqg{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;display:flex;flex-direction:column;text-align:var(--_18bqyaqa);width:var(--_18bqyaq3);max-width:var(--_18bqyaq8);max-height:var(--_18bqyaq9);padding-top:var(--_18bqyaq4);padding-bottom:var(--_18bqyaq5);padding-left:var(--_18bqyaq6);padding-right:var(--_18bqyaq7);background-color:var(--_18bqyaqb);border-radius:var(--_18bqyaqc);border:var(--_18bqyaqd)}._18bqyaqh{position:absolute;top:15px;right:15px;z-index:20;border:0;background-color:transparent;cursor:pointer;transition:all .5s ease-in-out}._18bqyaqh:hover{transform:scale(1.2)}._18hbdtx1{position:relative;width:100%;height:100%;max-height:var(--_18hbdtx0)}._18hbdtx2{0: _;1: 1;2: 8;3: h;4: b;5: d;6: t;7: x;8: 1}._18hbdtx3{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:0}._18hbdtx3 img{width:100%;height:100%;object-fit:cover}._18hbdtx4{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:pointer}._18hbdtx5{position:absolute;right:50px;bottom:10px;cursor:pointer}._18hbdtx6{position:absolute;top:15px;right:15px;cursor:pointer}._18hbdtx7{position:absolute;right:15px;bottom:15px;cursor:pointer}._13pkfbg1 img{width:100%;height:auto;max-width:var(--_13pkfbg0)}._13pkfbg2{0: _;1: 1;2: 3;3: p;4: k;5: f;6: b;7: g;8: 1}[object Object] > div{flex:0 0 calc(100% / var(--displayItem));transition:transform .3s ease-in-out}[object Object] button{position:absolute;top:50%;transform:translateY(-50%);cursor:pointer}[object Object] > div + div{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}._177g97f0{width:100%;display:flex;align-items:center;position:relative;flex-direction:column;animation:background .5s ease-in-out}._29n9il2{height:0;width:100vw;overflow:hidden;position:relative;padding-bottom:56.25%;left:var(--_29n9il0);right:var(--_29n9il1)}._29n9il3{0: _;1: 2;2: 9;3: n;4: 9;5: i;6: l;7: 2}._9kkynw1{margin-left:auto;margin-right:auto;position:relative;width:var(--_9kkynw0)}._9kkynw2{right:30px;top:50%;position:absolute;transform:translateY(-50%)}._9kkynw3{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:15px 30px}._9kkynw3:focus{outline:none}._9kkynw4{0: _;1: 9;2: k;3: k;4: y;5: n;6: w;7: 1}._1wp326d2{display:flex;background-color:var(--_1wp326d1);flex:1 1 auto;min-height:45vh;text-align:center;align-items:center;flex-direction:column;justify-content:center}@media screen and (min-width: 768px){._1wp326d2{min-height:var(--_1wp326d0)}}.xr8l1e2{top:0;left:0;z-index:40;width:100vw;display:flex;height:100vh;position:fixed;overflow:hidden;text-align:center;align-items:center;flex-direction:column;transform-origin:0% 0%;justify-content:center;gap:var(--overlayGap, 20px);bottom:var(--xr8l1e0);transform:var(--xr8l1e1);transition:transform .5s cubic-bezier(.77,.2,.05,1)}@media (min-width: 640px){.xr8l1e2{gap:var(--overlayGap0, 20px)}}@media (min-width: 768px){.xr8l1e2{gap:var(--overlayGap1, 30px)}}@media (min-width: 1024px){.xr8l1e2{gap:var(--overlayGap2, 40px)}}._1c0ak731{border:0;width:25px;height:12px;z-index:60;margin-left:0;cursor:pointer;position:relative}._1c0ak732{height:2px;width:25px;margin-bottom:8px;display:block;position:relative;transform-origin:center center;transition:all .5s ease-in-out}._1c0ak732[data-open=true]:nth-of-type(1){transform:rotate(45deg) translate(4px,3px)}._1c0ak732[data-open=true]:nth-of-type(2){transform:rotate(-45deg) translate(4px,-3px)}@media screen and (min-width: 1024px){._1c0ak731{display:var(--_1c0ak730)}}._15wg1hu1{z-index:30;width:100%;display:flex;align-items:center;justify-content:space-between;position:var(--_15wg1hu0);background-color:var(--header-bg, white)}._15wg1hu1 a{transition:all .5s ease-in-out}._15wg1hu1 a:hover{opacity:.5}._15wg1hu2{0: _;1: 1;2: 5;3: w;4: g;5: 1;6: h;7: u;8: 1}._15wg1hu3{height:60px}@media (min-width: 640px){._15wg1hu3{height:80px}}@media (min-width: 768px){._15wg1hu3{height:100px}}@media (min-width: 1024px){._15wg1hu3{height:120px}}.fl7h886{z-index:20;display:flex;font-size:.8em;align-items:center;flex-direction:column;justify-content:space-between;gap:var(--fl7h880);background-color:var(--fl7h881);padding-top:var(--fl7h882);padding-bottom:var(--fl7h883);padding-left:var(--fl7h884);padding-right:var(--fl7h885)}.fl7h886 a{transition:all .5s ease-in-out}.fl7h886 a:hover{opacity:.5}.fl7h887{0: f;1: l;2: 7;3: h;4: 8;5: 8;6: 6}.mx2tfy9{width:100%;display:flex;flex-wrap:wrap;flex-direction:column;align-items:flex-start;gap:var(--mx2tfy0);justify-content:space-between;text-align:var(--mx2tfy1)}.mx2tfy9>*{min-width:100%;position:relative}.mx2tfy9>* :empty{margin-top:calc(-1 * var(--gap) / 2)}@media screen and (min-width: 768px){mx2tfy9{flex-direction:var(--mx2tfy4);align-items:var(--mx2tfy3);justify-content:var(--mx2tfy2)}mx2tfy9>*:nth-of-type(1){flex:var(--column0);min-width:auto;max-width:var(--column0)}mx2tfy9>*:nth-of-type(2){flex:var(--column1);min-width:auto;max-width:var(--column1)}mx2tfy9>*:nth-of-type(3){flex:var(--column2);min-width:auto;max-width:var(--column2)}mx2tfy9>*:nth-of-type(4){flex:var(--column3);min-width:auto;max-width:var(--column3)}}@media screen and (min-width: 1024px){mx2tfy9{gap:calc(var(--gap) * 2)}}._14qm28za{width:100%;display:flex;align-items:center;position:relative;flex-direction:column;animation:background .5s ease-in-out;color:var(--_14qm28z2);z-index:var(--_14qm28z1);min-height:var(--_14qm28z7);padding-top:var(--_14qm28z3);padding-left:var(--_14qm28z4);padding-right:var(--_14qm28z5);padding-bottom:var(--_14qm28z6);background:var(--_14qm28z9);justify-content:var(--_14qm28z8)}._14qm28zb{gap:15px;width:100%;display:flex;flex-direction:column;max-width:var(--max-width);text-align:var(--_14qm28z0);align-items:var(--_14qm28z0)}._1h6zt341{display:flex;flex-direction:column;gap:var(--_1h6zt340)}._1h6zt342{0: _;1: 1;2: h;3: 6;4: z;5: t;6: 3;7: 4;8: 1}.g7q46n1{display:flex;flex-direction:row;margin-left:0;margin-right:0;gap:var(--g7q46n0)}.g7q46n2{display:flex;flex-direction:row}.g7q46n2 a{padding:10px}.g7q46n2 a svg path{transition:all .5s ease-in-out}.g7q46n2 a:hover svg path{opacity:.5}.g7q46n3{0: g;1: 7;2: q;3: 4;4: 6;5: n;6: 1}.vehv9e1{display:flex;flex-direction:row;gap:var(--vehv9e0)}.vehv9e2{0: v;1: e;2: h;3: v;4: 9;5: e;6: 1}.dvq5w83{width:100%;max-width:var(--dvq5w80);background-color:var(--dvq5w82);padding:var(--dvq5w81);position:relative}.dvq5w84{0: d;1: v;2: q;3: 5;4: w;5: 8;6: 3}@media (min-width: 768px){.dvq5w83{padding:var(--formPadding)}}._223sdz4{display:flex;flex-direction:column;gap:var(--_223sdz0);padding:var(--_223sdz1);font-size:var(--_223sdz2);justify-content:var(--_223sdz3)}._223sdz5{0: _;1: 2;2: 2;3: 3;4: s;5: d;6: z;7: 4}.k6gj0i8{width:100%;font-size:inherit;line-height:1.5em;font-family:var(--k6gj0i0);color:var(--k6gj0i1);border:var(--k6gj0i2);border-radius:var(--k6gj0i3);background-color:var(--k6gj0i4);padding:var(--k6gj0i5)}.k6gj0i8:focus{outline:var(--k6gj0i2)}.k6gj0i8::placeholder{color:var(--k6gj0i6);opacity:var(--k6gj0i7)}.k6gj0i9{0: k;1: 6;2: g;3: j;4: 0;5: i;6: 8}.l5ei128::placeholder{color:var(--l5ei126);opacity:var(--l5ei127)}.l5ei129{0: l;1: 5;2: e;3: i;4: 1;5: 2;6: 8}._1s956dc4{width:100%;text-align:left;font-family:var(--_1s956dc0);color:var(--_1s956dc1);font-weight:var(--_1s956dc2);padding-bottom:var(--_1s956dc3)}._1s956dc5{0: _;1: 1;2: s;3: 9;4: 5;5: 6;6: d;7: c;8: 4}._1e95ziv1 span{display:block;font-size:.875rem;margin-top:.25rem;color:var(--_1e95ziv0)}._1e95ziv2{0: _;1: 1;2: e;3: 9;4: 5;5: z;6: i;7: v;8: 1}.pewdww9:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;opacity:var(--pewdww1);background-color:var(--pewdww2);-webkit-backdrop-filter:blur(var(--pewdww0)px);backdrop-filter:blur(var(--pewdww0)px);z-index:100}.pewdww9>div{position:fixed;right:15px;bottom:15px;z-index:20;width:var(--pewdww3);border-radius:var(--pewdww5);border:var(--pewdww6);background-color:var(--pewdww4);display:flex;flex-direction:column;padding-top:var(--pewdww8)}.pewdww9>div>div{display:flex;flex-direction:row;gap:var(--pewdww7);justify-content:flex-end}
+._1h0tdm5e{position:relative;display:inline-block;color:var(--_1h0tdm50);border:var(--_1h0tdm52);cursor:var(--_1h0tdm51);min-width:var(--_1h0tdm53);font-weight:var(--_1h0tdm54);transition:var(--_1h0tdm55);padding-top:var(--_1h0tdm56);padding-left:var(--_1h0tdm57);padding-right:var(--_1h0tdm58);padding-bottom:var(--_1h0tdm59);pointer-event:var(--_1h0tdm5a);border-radius:var(--_1h0tdm5b);letter-spacing:var(--_1h0tdm5c);background-color:var(--_1h0tdm5d)}._1h0tdm5e:hover{opacity:.5}._1v7zi9y5{width:100%;display:flex;flex-wrap:wrap;flex-direction:row;gap:var(--_1v7zi9y0);align-items:var(--_1v7zi9y1);padding-top:var(--_1v7zi9y2);padding-bottom:var(--_1v7zi9y3);justify-content:var(--_1v7zi9y4)}._1slxfz52{margin:0 auto;display:inline-block;vertical-align:middle}._1slxfz52 path{fill:var(--_1slxfz51);transition:color .5s ease}._1slxfz53{0: _;1: 1;2: s;3: l;4: x;5: f;6: z;7: 5;8: 2}._18bqyaqe{z-index:100;position:fixed;width:100%;height:100%}._18bqyaqe:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;opacity:var(--_18bqyaq0);background-color:var(--_18bqyaq1);-webkit-backdrop-filter:blur(var(--_18bqyaq2));backdrop-filter:blur(var(--_18bqyaq2))}._18bqyaqf{0: _;1: 1;2: 8;3: b;4: q;5: y;6: a;7: q;8: e}._18bqyaqg{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:20;display:flex;flex-direction:column;text-align:var(--_18bqyaqa);width:var(--_18bqyaq3);max-width:var(--_18bqyaq8);max-height:var(--_18bqyaq9);padding-top:var(--_18bqyaq4);padding-bottom:var(--_18bqyaq5);padding-left:var(--_18bqyaq6);padding-right:var(--_18bqyaq7);background-color:var(--_18bqyaqb);border-radius:var(--_18bqyaqc);border:var(--_18bqyaqd)}._18bqyaqh{position:absolute;top:15px;right:15px;z-index:20;border:0;background-color:transparent;cursor:pointer;transition:all .5s ease-in-out}._18bqyaqh:hover{transform:scale(1.2)}._18hbdtx1{position:relative;width:100%;height:100%;max-height:var(--_18hbdtx0)}._18hbdtx2{0: _;1: 1;2: 8;3: h;4: b;5: d;6: t;7: x;8: 1}._18hbdtx3{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:0}._18hbdtx3 img{width:100%;height:100%;object-fit:cover}._18hbdtx4{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:pointer}._18hbdtx5{position:absolute;right:50px;bottom:10px;cursor:pointer}._18hbdtx6{position:absolute;top:15px;right:15px;cursor:pointer}._18hbdtx7{position:absolute;right:15px;bottom:15px;cursor:pointer}._13pkfbg1 img{width:100%;height:auto;max-width:var(--_13pkfbg0)}._13pkfbg2{0: _;1: 1;2: 3;3: p;4: k;5: f;6: b;7: g;8: 1}[object Object] > div{flex:0 0 calc(100% / var(--displayItem));transition:transform .3s ease-in-out}[object Object] button{position:absolute;top:50%;transform:translateY(-50%);cursor:pointer}[object Object] > div + div{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}._177g97f1{font-size:1.2em;padding-bottom:var(--_177g97f0)}._177g97f1 span{font-size:2.5em;line-height:1em}._177g97f2{display:flex;flex-direction:column}._29n9il2{height:0;width:100vw;overflow:hidden;position:relative;padding-bottom:56.25%;left:var(--_29n9il0);right:var(--_29n9il1)}._29n9il3{0: _;1: 2;2: 9;3: n;4: 9;5: i;6: l;7: 2}._9kkynw1{margin-left:auto;margin-right:auto;position:relative;width:var(--_9kkynw0)}._9kkynw2{right:30px;top:50%;position:absolute;transform:translateY(-50%)}._9kkynw3{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:15px 30px}._9kkynw3:focus{outline:none}._9kkynw4{0: _;1: 9;2: k;3: k;4: y;5: n;6: w;7: 1}._1wp326d2{display:flex;background-color:var(--_1wp326d1);flex:1 1 auto;min-height:45vh;text-align:center;align-items:center;flex-direction:column;justify-content:center}@media screen and (min-width: 768px){._1wp326d2{min-height:var(--_1wp326d0)}}.xr8l1e2{top:0;left:0;z-index:40;width:100vw;display:flex;height:100vh;position:fixed;overflow:hidden;text-align:center;align-items:center;flex-direction:column;transform-origin:0% 0%;justify-content:center;gap:var(--overlayGap, 20px);bottom:var(--xr8l1e0);transform:var(--xr8l1e1);transition:transform .5s cubic-bezier(.77,.2,.05,1)}@media (min-width: 640px){.xr8l1e2{gap:var(--overlayGap0, 20px)}}@media (min-width: 768px){.xr8l1e2{gap:var(--overlayGap1, 30px)}}@media (min-width: 1024px){.xr8l1e2{gap:var(--overlayGap2, 40px)}}._1c0ak731{border:0;width:25px;height:12px;z-index:60;margin-left:0;cursor:pointer;position:relative}._1c0ak732{height:2px;width:25px;margin-bottom:8px;display:block;position:relative;transform-origin:center center;transition:all .5s ease-in-out}._1c0ak732[data-open=true]:nth-of-type(1){transform:rotate(45deg) translate(4px,3px)}._1c0ak732[data-open=true]:nth-of-type(2){transform:rotate(-45deg) translate(4px,-3px)}@media screen and (min-width: 1024px){._1c0ak731{display:var(--_1c0ak730)}}._15wg1hu1{z-index:30;width:100%;display:flex;align-items:center;justify-content:space-between;position:var(--_15wg1hu0);background-color:var(--header-bg, white)}._15wg1hu1 a{transition:all .5s ease-in-out}._15wg1hu1 a:hover{opacity:.5}._15wg1hu2{0: _;1: 1;2: 5;3: w;4: g;5: 1;6: h;7: u;8: 1}._15wg1hu3{height:60px}@media (min-width: 640px){._15wg1hu3{height:80px}}@media (min-width: 768px){._15wg1hu3{height:100px}}@media (min-width: 1024px){._15wg1hu3{height:120px}}.fl7h886{z-index:20;display:flex;font-size:.8em;align-items:center;flex-direction:column;justify-content:space-between;gap:var(--fl7h880);background-color:var(--fl7h881);padding-top:var(--fl7h882);padding-bottom:var(--fl7h883);padding-left:var(--fl7h884);padding-right:var(--fl7h885)}.fl7h886 a{transition:all .5s ease-in-out}.fl7h886 a:hover{opacity:.5}.fl7h887{0: f;1: l;2: 7;3: h;4: 8;5: 8;6: 6}.mx2tfy9{width:100%;display:flex;flex-wrap:wrap;flex-direction:column;align-items:flex-start;gap:var(--mx2tfy0);justify-content:space-between;text-align:var(--mx2tfy1)}.mx2tfy9>*{min-width:100%;position:relative}.mx2tfy9>* :empty{margin-top:calc(-1 * var(--gap) / 2)}@media screen and (min-width: 768px){mx2tfy9{flex-direction:var(--mx2tfy4);align-items:var(--mx2tfy3);justify-content:var(--mx2tfy2)}mx2tfy9>*:nth-of-type(1){flex:var(--column0);min-width:auto;max-width:var(--column0)}mx2tfy9>*:nth-of-type(2){flex:var(--column1);min-width:auto;max-width:var(--column1)}mx2tfy9>*:nth-of-type(3){flex:var(--column2);min-width:auto;max-width:var(--column2)}mx2tfy9>*:nth-of-type(4){flex:var(--column3);min-width:auto;max-width:var(--column3)}}@media screen and (min-width: 1024px){mx2tfy9{gap:calc(var(--gap) * 2)}}._14qm28za{width:100%;display:flex;align-items:center;position:relative;flex-direction:column;animation:background .5s ease-in-out;color:var(--_14qm28z2);z-index:var(--_14qm28z1);min-height:var(--_14qm28z7);padding-top:var(--_14qm28z3);padding-left:var(--_14qm28z4);padding-right:var(--_14qm28z5);padding-bottom:var(--_14qm28z6);background:var(--_14qm28z9);justify-content:var(--_14qm28z8)}._14qm28zb{gap:15px;width:100%;display:flex;flex-direction:column;max-width:var(--max-width);text-align:var(--_14qm28z0);align-items:var(--_14qm28z0)}._1h6zt341{display:flex;flex-direction:column;gap:var(--_1h6zt340)}._1h6zt342{0: _;1: 1;2: h;3: 6;4: z;5: t;6: 3;7: 4;8: 1}.g7q46n1{display:flex;flex-direction:row;margin-left:0;margin-right:0;gap:var(--g7q46n0)}.g7q46n2{display:flex;flex-direction:row}.g7q46n2 a{padding:10px}.g7q46n2 a svg path{transition:all .5s ease-in-out}.g7q46n2 a:hover svg path{opacity:.5}.g7q46n3{0: g;1: 7;2: q;3: 4;4: 6;5: n;6: 1}.vehv9e1{display:flex;flex-direction:row;gap:var(--vehv9e0)}.vehv9e2{0: v;1: e;2: h;3: v;4: 9;5: e;6: 1}.dvq5w83{width:100%;max-width:var(--dvq5w80);background-color:var(--dvq5w82);padding:var(--dvq5w81);position:relative}.dvq5w84{0: d;1: v;2: q;3: 5;4: w;5: 8;6: 3}@media (min-width: 768px){.dvq5w83{padding:var(--formPadding)}}._223sdz4{display:flex;flex-direction:column;gap:var(--_223sdz0);padding:var(--_223sdz1);font-size:var(--_223sdz2);justify-content:var(--_223sdz3)}._223sdz5{0: _;1: 2;2: 2;3: 3;4: s;5: d;6: z;7: 4}.k6gj0i8{width:100%;font-size:inherit;line-height:1.5em;font-family:var(--k6gj0i0);color:var(--k6gj0i1);border:var(--k6gj0i2);border-radius:var(--k6gj0i3);background-color:var(--k6gj0i4);padding:var(--k6gj0i5)}.k6gj0i8:focus{outline:var(--k6gj0i2)}.k6gj0i8::placeholder{color:var(--k6gj0i6);opacity:var(--k6gj0i7)}.k6gj0i9{0: k;1: 6;2: g;3: j;4: 0;5: i;6: 8}.l5ei128::placeholder{color:var(--l5ei126);opacity:var(--l5ei127)}.l5ei129{0: l;1: 5;2: e;3: i;4: 1;5: 2;6: 8}._1s956dc4{width:100%;text-align:left;font-family:var(--_1s956dc0);color:var(--_1s956dc1);font-weight:var(--_1s956dc2);padding-bottom:var(--_1s956dc3)}._1s956dc5{0: _;1: 1;2: s;3: 9;4: 5;5: 6;6: d;7: c;8: 4}._1e95ziv1 span{display:block;font-size:.875rem;margin-top:.25rem;color:var(--_1e95ziv0)}._1e95ziv2{0: _;1: 1;2: e;3: 9;4: 5;5: z;6: i;7: v;8: 1}.pewdww9:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;opacity:var(--pewdww1);background-color:var(--pewdww2);-webkit-backdrop-filter:blur(var(--pewdww0)px);backdrop-filter:blur(var(--pewdww0)px);z-index:100}.pewdww9>div{position:fixed;right:15px;bottom:15px;z-index:20;width:var(--pewdww3);border-radius:var(--pewdww5);border:var(--pewdww6);background-color:var(--pewdww4);display:flex;flex-direction:column;padding-top:var(--pewdww8)}.pewdww9>div>div{display:flex;flex-direction:row;gap:var(--pewdww7);justify-content:flex-end}

package/dist/types/components/Form/TextField/export.d.ts

@@ -1,3 +1,3 @@
 export { TextField } from '.';
 export type { TextFieldProps } from '.';
-export { styles as FormStyles } from './styles.css';
+export { styles as TextFieldStyles } from './styles.css';

package/dist/types/components/Header/export.d.ts

@@ -1,3 +1,3 @@
 export { Header } from '.';
 export type { HeaderProps } from '.';
-export { styles as KeyNumberStyles } from './styles.css';
+export { styles as HeaderStyles } from './styles.css';

package/dist/types/components/KeyNumber/styles.css.d.ts

@@ -1,9 +1,9 @@
+export declare const vars: {
+    keyNumberPaddingBottom: `var(--${string})`;
+};
 export declare const styles: {
-    width: string;
     display: string;
-    alignItems: string;
-    position: string;
     flexDirection: string;
-    animation: string;
 };
-export declare const sectionStyle: string;
+export declare const keyNumbersListItemNumberStyle: string;
+export declare const keyNumberStyle: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@latte-macchiat-io/latte-vanilla-components",
-  "version": "0.0.140",
+  "version": "0.0.141",
   "description": "Beautiful components for amazing projects, with a touch of Vanilla 🥤",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",