@kvell-group/ui 1.6.9 → 1.6.11

package/dist/assets/Button.css

@@ -1 +1 @@
-._root_17bsd_1{background-color:green;border-radius:12px}._inner_17bsd_6{background-color:red}
+.m_87cf2631{background-color:transparent;cursor:pointer;border:0;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:var(--mantine-font-size-md);text-align:left;text-decoration:none;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}:where([dir=rtl]) .m_87cf2631{text-align:right}.m_77c9d27d{--button-height-xs: 30px;--button-height-sm: 36px;--button-height-md: 42px;--button-height-lg: 50px;--button-height-xl: 60px;--button-height-compact-xs: 22px;--button-height-compact-sm: 26px;--button-height-compact-md: 30px;--button-height-compact-lg: 34px;--button-height-compact-xl: 40px;--button-padding-x-xs: 14px;--button-padding-x-sm: 18px;--button-padding-x-md: 22px;--button-padding-x-lg: 26px;--button-padding-x-xl: 32px;--button-padding-x-compact-xs: 7px;--button-padding-x-compact-sm: 8px;--button-padding-x-compact-md: 10px;--button-padding-x-compact-lg: 12px;--button-padding-x-compact-xl: 14px;--button-height: var(--button-height-sm);--button-padding-x: var(--button-padding-x-sm);--button-color: var(--mantine-color-white);-webkit-user-select:none;-moz-user-select:none;user-select:none;font-weight:600;position:relative;line-height:1;text-align:center;overflow:hidden;width:auto;cursor:pointer;display:inline-block;border-radius:var(--button-radius, var(--mantine-radius-default));font-size:var(--button-fz, var(--mantine-font-size-sm));background:var(--button-bg, var(--mantine-primary-color-filled));border:var(--button-bd, calc(.0625rem * var(--mantine-scale)) solid transparent);color:var(--button-color, var(--mantine-color-white));height:var(--button-height, var(--button-height-sm));padding-inline:var(--button-padding-x, var(--button-padding-x-sm));vertical-align:middle}.m_77c9d27d:where([data-block]){display:block;width:100%}.m_77c9d27d:where([data-with-left-section]){padding-inline-start:calc(var(--button-padding-x) / 1.5)}.m_77c9d27d:where([data-with-right-section]){padding-inline-end:calc(var(--button-padding-x) / 1.5)}.m_77c9d27d:where(:disabled:not([data-loading]),[data-disabled]:not([data-loading])){cursor:not-allowed;border:1px solid transparent;transform:none}:where([data-mantine-color-scheme=light]) .m_77c9d27d:where(:disabled:not([data-loading]),[data-disabled]:not([data-loading])){color:var(--mantine-color-gray-5);background:var(--mantine-color-gray-1)}:where([data-mantine-color-scheme=dark]) .m_77c9d27d:where(:disabled:not([data-loading]),[data-disabled]:not([data-loading])){color:var(--mantine-color-dark-3);background:var(--mantine-color-dark-6)}.m_77c9d27d:before{content:"";pointer-events:none;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--button-radius, var(--mantine-radius-default));transform:translateY(-100%);opacity:0;filter:blur(12px);transition:transform .15s ease,opacity .1s ease}:where([data-mantine-color-scheme=light]) .m_77c9d27d:before{background-color:#ffffff26}:where([data-mantine-color-scheme=dark]) .m_77c9d27d:before{background-color:#00000026}.m_77c9d27d:where([data-loading]){cursor:not-allowed;transform:none}.m_77c9d27d:where([data-loading]):before{transform:translateY(0);opacity:1}.m_77c9d27d:where([data-loading]) .m_80f1301b{opacity:0;transform:translateY(100%)}@media (hover: hover){.m_77c9d27d:hover:where(:not([data-loading],:disabled,[data-disabled])){background-color:var(--button-hover, var(--mantine-primary-color-filled-hover));color:var(--button-hover-color, var(--button-color))}}@media (hover: none){.m_77c9d27d:active:where(:not([data-loading],:disabled,[data-disabled])){background-color:var(--button-hover, var(--mantine-primary-color-filled-hover));color:var(--button-hover-color, var(--button-color))}}.m_80f1301b{display:flex;align-items:center;justify-content:var(--button-justify, center);height:100%;overflow:visible;transition:transform .15s ease,opacity .1s ease}.m_811560b9{white-space:nowrap;height:100%;overflow:hidden;display:flex;align-items:center;opacity:1}.m_811560b9:where([data-loading]){opacity:.2}.m_a74036a{display:flex;align-items:center}.m_a74036a:where([data-position=left]){margin-inline-end:var(--mantine-spacing-xs)}.m_a74036a:where([data-position=right]){margin-inline-start:var(--mantine-spacing-xs)}.m_a25b86ee{position:absolute;left:50%;top:50%}.m_80d6d844{--button-border-width: 1px;display:flex}.m_80d6d844 :where(.m_77c9d27d):focus{position:relative;z-index:1}.m_80d6d844[data-orientation=horizontal]{flex-direction:row}.m_80d6d844[data-orientation=horizontal] .m_77c9d27d:not(:only-child):first-child,.m_80d6d844[data-orientation=horizontal] .m_70be2a01:not(:only-child):first-child{border-end-end-radius:0;border-start-end-radius:0;border-inline-end-width:calc(var(--button-border-width) / 2)}.m_80d6d844[data-orientation=horizontal] .m_77c9d27d:not(:only-child):last-child,.m_80d6d844[data-orientation=horizontal] .m_70be2a01:not(:only-child):last-child{border-end-start-radius:0;border-start-start-radius:0;border-inline-start-width:calc(var(--button-border-width) / 2)}.m_80d6d844[data-orientation=horizontal] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child),.m_80d6d844[data-orientation=horizontal] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child){border-radius:0;border-inline-width:calc(var(--button-border-width) / 2)}.m_80d6d844[data-orientation=vertical]{flex-direction:column}.m_80d6d844[data-orientation=vertical] .m_77c9d27d:not(:only-child):first-child,.m_80d6d844[data-orientation=vertical] .m_70be2a01:not(:only-child):first-child{border-end-start-radius:0;border-end-end-radius:0;border-bottom-width:calc(var(--button-border-width) / 2)}.m_80d6d844[data-orientation=vertical] .m_77c9d27d:not(:only-child):last-child,.m_80d6d844[data-orientation=vertical] .m_70be2a01:not(:only-child):last-child{border-start-start-radius:0;border-start-end-radius:0;border-top-width:calc(var(--button-border-width) / 2)}.m_80d6d844[data-orientation=vertical] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child),.m_80d6d844[data-orientation=vertical] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child){border-radius:0;border-bottom-width:calc(var(--button-border-width) / 2);border-top-width:calc(var(--button-border-width) / 2)}.m_70be2a01{--section-height-xs: 30px;--section-height-sm: 36px;--section-height-md: 42px;--section-height-lg: 50px;--section-height-xl: 60px;--section-height-compact-xs: 22px;--section-height-compact-sm: 26px;--section-height-compact-md: 30px;--section-height-compact-lg: 34px;--section-height-compact-xl: 40px;--section-padding-x-xs: 14px;--section-padding-x-sm: 18px;--section-padding-x-md: 22px;--section-padding-x-lg: 26px;--section-padding-x-xl: 32px;--section-padding-x-compact-xs: 7px;--section-padding-x-compact-sm: 8px;--section-padding-x-compact-md: 10px;--section-padding-x-compact-lg: 12px;--section-padding-x-compact-xl: 14px;--section-height: var(--section-height-sm);--section-padding-x: var(--section-padding-x-sm);--section-color: var(--mantine-color-white);font-weight:600;width:auto;border-radius:var(--section-radius, var(--mantine-radius-default));font-size:var(--section-fz, var(--mantine-font-size-sm));background:var(--section-bg, var(--mantine-primary-color-filled));border:var(--section-bd, calc(.0625rem * var(--mantine-scale)) solid transparent);color:var(--section-color, var(--mantine-color-white));height:var(--section-height, var(--section-height-sm));padding-inline:var(--section-padding-x, var(--section-padding-x-sm));vertical-align:middle;line-height:1;display:inline-flex;align-items:center;justify-content:center}._root_gdr8x_1{background-color:green;border-radius:12px;width:200px}._inner_gdr8x_7{background-color:red}._label_gdr8x_11{color:#ff0}

package/dist/components/Button/Button.js

@@ -1,7 +1,7 @@
 import { jsx as f, jsxs as j, Fragment as q } from "react/jsx-runtime";
 import { r as R, u as k, h as er, i as or, j as ar, l as ir, k as tt, a as sr, p as dt, m as cr, n as pr, o as mr } from "../../MantineThemeProvider-CyD9KzqB.js";
-import { useState as Q, useRef as M, useEffect as z, useId as ur, forwardRef as P } from "react";
-import lr from "react-dom";
+import { useState as Q, useRef as M, useEffect as z, useId as lr, forwardRef as P } from "react";
+import ur from "react-dom";
 import '../../assets/Button.css';function fr(t) {
   return t.replace(/[A-Z]/g, (r) => `-${r.toLowerCase()}`);
 }
@@ -134,10 +134,10 @@ function ct({
 function $r({ rootSelector: t, selector: r, className: n }) {
   return t === r ? n : void 0;
 }
-function Tr({ selector: t, classes: r, unstyled: n }) {
+function _r({ selector: t, classes: r, unstyled: n }) {
   return n ? void 0 : r[t];
 }
-function _r({
+function Tr({
   themeName: t,
   classNamesPrefix: r,
   selector: n,
@@ -184,21 +184,21 @@ function Cr({
   className: p,
   rootSelector: c,
   props: m,
-  stylesCtx: u,
-  withStaticClasses: l,
+  stylesCtx: l,
+  withStaticClasses: u,
   headless: g,
   transformedStyles: d
 }) {
   return L(
     xr({ theme: t, options: r, unstyled: s || g }),
-    Rr({ theme: t, themeName: n, selector: e, props: m, stylesCtx: u }),
+    Rr({ theme: t, themeName: n, selector: e, props: m, stylesCtx: l }),
     Pr({ options: r, classes: i, selector: e, unstyled: s }),
-    ct({ selector: e, stylesCtx: u, theme: t, classNames: a, props: m }),
-    ct({ selector: e, stylesCtx: u, theme: t, classNames: d, props: m }),
-    wr({ selector: e, stylesCtx: u, options: r, props: m, theme: t }),
+    ct({ selector: e, stylesCtx: l, theme: t, classNames: a, props: m }),
+    ct({ selector: e, stylesCtx: l, theme: t, classNames: d, props: m }),
+    wr({ selector: e, stylesCtx: l, options: r, props: m, theme: t }),
     $r({ rootSelector: c, selector: e, className: p }),
-    Tr({ selector: e, classes: i, unstyled: s || g }),
-    l && !g && _r({
+    _r({ selector: e, classes: i, unstyled: s || g }),
+    u && !g && Tr({
       themeName: n,
       classNamesPrefix: o,
       selector: e,
@@ -251,8 +251,8 @@ function Or({
   return (p = Ar([
     s ? {} : r == null ? void 0 : r(n, e, o),
     ...i.map((c) => {
-      var m, u, l;
-      return (l = (u = (m = n.components) == null ? void 0 : m[c]) == null ? void 0 : u.vars) == null ? void 0 : l.call(u, n, e, o);
+      var m, l, u;
+      return (u = (l = (m = n.components) == null ? void 0 : m[c]) == null ? void 0 : l.vars) == null ? void 0 : u.call(l, n, e, o);
     }),
     t == null ? void 0 : t(n, e, o)
   ])) == null ? void 0 : p[a];
@@ -269,14 +269,14 @@ function Lr({
   style: p,
   vars: c,
   varsResolver: m,
-  headless: u,
-  withStylesTransform: l
+  headless: l,
+  withStylesTransform: u
 }) {
   return {
-    ...!l && Br({ theme: t, themeName: r, props: o, stylesCtx: a, selector: n }),
-    ...!l && K({ theme: t, styles: s, props: o, stylesCtx: a })[n],
-    ...!l && K({ theme: t, styles: e == null ? void 0 : e.styles, props: (e == null ? void 0 : e.props) || o, stylesCtx: a })[n],
-    ...Or({ theme: t, props: o, stylesCtx: a, vars: c, varsResolver: m, selector: n, themeName: r, headless: u }),
+    ...!u && Br({ theme: t, themeName: r, props: o, stylesCtx: a, selector: n }),
+    ...!u && K({ theme: t, styles: s, props: o, stylesCtx: a })[n],
+    ...!u && K({ theme: t, styles: e == null ? void 0 : e.styles, props: (e == null ? void 0 : e.props) || o, stylesCtx: a })[n],
+    ...Or({ theme: t, props: o, stylesCtx: a, vars: c, varsResolver: m, selector: n, themeName: r, headless: l }),
     ...i === n ? Z({ style: p, theme: t }) : null,
     ...Z({ style: e == null ? void 0 : e.style, theme: t })
   };
@@ -311,16 +311,16 @@ function F({
   classNames: p,
   styles: c,
   vars: m,
-  varsResolver: u
+  varsResolver: l
 }) {
-  const l = k(), g = or(), d = ar(), b = ir(), h = (Array.isArray(t) ? t : [t]).filter((S) => S), { withStylesTransform: x, getTransformedStyles: _ } = Yr({
+  const u = k(), g = or(), d = ar(), b = ir(), h = (Array.isArray(t) ? t : [t]).filter((S) => S), { withStylesTransform: x, getTransformedStyles: T } = Yr({
     props: n,
     stylesCtx: e,
     themeName: h
   });
   return (S, N) => ({
     className: Cr({
-      theme: l,
+      theme: u,
       options: N,
       themeName: h,
       selector: S,
@@ -334,10 +334,10 @@ function F({
       stylesCtx: e,
       withStaticClasses: d,
       headless: b,
-      transformedStyles: _([N == null ? void 0 : N.styles, c])
+      transformedStyles: T([N == null ? void 0 : N.styles, c])
     }),
     style: Lr({
-      theme: l,
+      theme: u,
       themeName: h,
       selector: S,
       options: N,
@@ -347,7 +347,7 @@ function F({
       styles: c,
       style: a,
       vars: m,
-      varsResolver: u,
+      varsResolver: l,
       headless: b,
       withStylesTransform: x
     })
@@ -393,14 +393,14 @@ function jr(t) {
     me: p,
     ms: c,
     p: m,
-    px: u,
-    py: l,
+    px: l,
+    py: u,
     pt: g,
     pb: d,
     pl: b,
     pr: h,
     pe: x,
-    ps: _,
+    ps: T,
     bd: S,
     bg: N,
     c: C,
@@ -450,14 +450,14 @@ function jr(t) {
     me: p,
     ms: c,
     p: m,
-    px: u,
-    py: l,
+    px: l,
+    py: u,
     pt: g,
     pb: d,
     pl: b,
     pr: h,
     pe: x,
-    ps: _,
+    ps: T,
     bd: S,
     bg: N,
     c: C,
@@ -656,9 +656,9 @@ function tn({
         const p = Zr(t[o]);
         return i.forEach((c) => {
           s && (e.styles[c] = U[a.type](s, n)), p.forEach((m) => {
-            const u = `(min-width: ${n.breakpoints[m]})`;
-            e.media[u] = {
-              ...e.media[u],
+            const l = `(min-width: ${n.breakpoints[m]})`;
+            e.media[l] = {
+              ...e.media[l],
               [c]: U[a.type](
                 Jr(t[o], m),
                 n
@@ -677,7 +677,7 @@ function tn({
   );
 }
 function rn() {
-  return `__m__-${ur().replace(/:/g, "")}`;
+  return `__m__-${lr().replace(/:/g, "")}`;
 }
 function bt(t) {
   return t.startsWith("data-") ? t : `data-${t}`;
@@ -722,12 +722,12 @@ const vt = P(
     visibleFrom: p,
     lightHidden: c,
     darkHidden: m,
-    renderRoot: u,
-    __size: l,
+    renderRoot: l,
+    __size: u,
     ...g
   }, d) => {
     var v;
-    const b = k(), h = t || "div", { styleProps: x, rest: _ } = jr(g), S = cr(), N = (v = S == null ? void 0 : S()) == null ? void 0 : v(x.sx), C = rn(), y = tn({
+    const b = k(), h = t || "div", { styleProps: x, rest: T } = jr(g), S = cr(), N = (v = S == null ? void 0 : S()) == null ? void 0 : v(x.sx), C = rn(), y = tn({
       styleProps: x,
       theme: b,
       data: kr
@@ -748,9 +748,9 @@ const vt = P(
       }),
       "data-variant": o,
       "data-size": yt(i) ? void 0 : i || void 0,
-      size: l,
+      size: u,
       ...St(a),
-      ..._
+      ...T
     };
     return /* @__PURE__ */ j(q, { children: [
       y.hasResponsiveStyles && /* @__PURE__ */ f(
@@ -761,7 +761,7 @@ const vt = P(
           media: y.media
         }
       ),
-      typeof u == "function" ? u(w) : /* @__PURE__ */ f(h, { ...w })
+      typeof l == "function" ? l(w) : /* @__PURE__ */ f(h, { ...w })
     ] });
   }
 );
@@ -798,7 +798,7 @@ const on = {
       styles: p,
       style: c,
       ...m
-    } = n, u = F({
+    } = n, l = F({
       name: a,
       props: n,
       classes: wt,
@@ -811,7 +811,7 @@ const on = {
     return /* @__PURE__ */ f(
       $,
       {
-        ...u("root", { focusable: !0 }),
+        ...l("root", { focusable: !0 }),
         component: o,
         ref: r,
         type: o === "button" ? "button" : void 0,
@@ -938,7 +938,7 @@ const E = (t) => ({
     ...E("top"),
     common: { transformOrigin: "top right" }
   }
-}, ut = {
+}, lt = {
   entering: "in",
   entered: "in",
   exiting: "out",
@@ -962,12 +962,12 @@ function an({
     transitionProperty: W[t].transitionProperty,
     ...o,
     ...W[t].common,
-    ...W[t][ut[r]]
+    ...W[t][lt[r]]
   } : {} : {
     transitionProperty: t.transitionProperty,
     ...o,
     ...t.common,
-    ...t[ut[r]]
+    ...t[lt[r]]
   };
 }
 function sn({
@@ -982,12 +982,12 @@ function sn({
   enterDelay: p,
   exitDelay: c
 }) {
-  const m = k(), u = br(), l = m.respectReducedMotion ? u : !1, [g, d] = Q(l ? 0 : t), [b, h] = Q(e ? "entered" : "exited"), x = M(-1), _ = M(-1), S = M(-1), N = (y) => {
+  const m = k(), l = br(), u = m.respectReducedMotion ? l : !1, [g, d] = Q(u ? 0 : t), [b, h] = Q(e ? "entered" : "exited"), x = M(-1), T = M(-1), S = M(-1), N = (y) => {
     const w = y ? o : a, v = y ? i : s;
     window.clearTimeout(x.current);
-    const B = l ? 0 : y ? t : r;
+    const B = u ? 0 : y ? t : r;
     d(B), B === 0 ? (typeof w == "function" && w(), typeof v == "function" && v(), h(y ? "entered" : "exited")) : S.current = requestAnimationFrame(() => {
-      lr.flushSync(() => {
+      ur.flushSync(() => {
         h(y ? "pre-entering" : "pre-exiting");
       }), S.current = requestAnimationFrame(() => {
         typeof w == "function" && w(), h(y ? "entering" : "exiting"), x.current = window.setTimeout(() => {
@@ -996,11 +996,11 @@ function sn({
       });
     });
   }, C = (y) => {
-    if (window.clearTimeout(_.current), typeof (y ? p : c) != "number") {
+    if (window.clearTimeout(T.current), typeof (y ? p : c) != "number") {
       N(y);
       return;
     }
-    _.current = window.setTimeout(
+    T.current = window.setTimeout(
       () => {
         N(y);
       },
@@ -1032,8 +1032,8 @@ function $t({
   onEntered: p,
   onEnter: c,
   onExited: m,
-  enterDelay: u,
-  exitDelay: l
+  enterDelay: l,
+  exitDelay: u
 }) {
   const g = pr(), { transitionDuration: d, transitionStatus: b, transitionTimingFunction: h } = sn({
     mounted: o,
@@ -1044,8 +1044,8 @@ function $t({
     onEntered: p,
     onEnter: c,
     onExited: m,
-    enterDelay: u,
-    exitDelay: l
+    enterDelay: l,
+    exitDelay: u
   });
   return d === 0 || g === "test" ? o ? /* @__PURE__ */ f(q, { children: a({}) }) : t ? a({ display: "none" }) : null : b === "exited" ? t ? a({ display: "none" }) : null : /* @__PURE__ */ f(q, { children: a(
     an({
@@ -1057,25 +1057,25 @@ function $t({
   ) });
 }
 $t.displayName = "@mantine/core/Transition";
-var T = { root: "m_5ae2e3c", barsLoader: "m_7a2bd4cd", bar: "m_870bb79", "bars-loader-animation": "m_5d2b3b9d", dotsLoader: "m_4e3f22d7", dot: "m_870c4af", "loader-dots-animation": "m_aac34a1", ovalLoader: "m_b34414df", "oval-loader-animation": "m_f8e89c4b" };
-const Tt = P(({ className: t, ...r }, n) => /* @__PURE__ */ j($, { component: "span", className: L(T.barsLoader, t), ...r, ref: n, children: [
-  /* @__PURE__ */ f("span", { className: T.bar }),
-  /* @__PURE__ */ f("span", { className: T.bar }),
-  /* @__PURE__ */ f("span", { className: T.bar })
+var _ = { root: "m_5ae2e3c", barsLoader: "m_7a2bd4cd", bar: "m_870bb79", "bars-loader-animation": "m_5d2b3b9d", dotsLoader: "m_4e3f22d7", dot: "m_870c4af", "loader-dots-animation": "m_aac34a1", ovalLoader: "m_b34414df", "oval-loader-animation": "m_f8e89c4b" };
+const _t = P(({ className: t, ...r }, n) => /* @__PURE__ */ j($, { component: "span", className: L(_.barsLoader, t), ...r, ref: n, children: [
+  /* @__PURE__ */ f("span", { className: _.bar }),
+  /* @__PURE__ */ f("span", { className: _.bar }),
+  /* @__PURE__ */ f("span", { className: _.bar })
 ] }));
-Tt.displayName = "@mantine/core/Bars";
-const _t = P(({ className: t, ...r }, n) => /* @__PURE__ */ j($, { component: "span", className: L(T.dotsLoader, t), ...r, ref: n, children: [
-  /* @__PURE__ */ f("span", { className: T.dot }),
-  /* @__PURE__ */ f("span", { className: T.dot }),
-  /* @__PURE__ */ f("span", { className: T.dot })
+_t.displayName = "@mantine/core/Bars";
+const Tt = P(({ className: t, ...r }, n) => /* @__PURE__ */ j($, { component: "span", className: L(_.dotsLoader, t), ...r, ref: n, children: [
+  /* @__PURE__ */ f("span", { className: _.dot }),
+  /* @__PURE__ */ f("span", { className: _.dot }),
+  /* @__PURE__ */ f("span", { className: _.dot })
 ] }));
-_t.displayName = "@mantine/core/Dots";
-const Rt = P(({ className: t, ...r }, n) => /* @__PURE__ */ f($, { component: "span", className: L(T.ovalLoader, t), ...r, ref: n }));
+Tt.displayName = "@mantine/core/Dots";
+const Rt = P(({ className: t, ...r }, n) => /* @__PURE__ */ f($, { component: "span", className: L(_.ovalLoader, t), ...r, ref: n }));
 Rt.displayName = "@mantine/core/Oval";
 const Pt = {
-  bars: Tt,
+  bars: _t,
   oval: Rt,
-  dots: _t
+  dots: Tt
 }, cn = {
   loaders: Pt,
   type: "oval"
@@ -1094,20 +1094,20 @@ const Pt = {
     style: p,
     classNames: c,
     styles: m,
-    unstyled: u,
-    loaders: l,
+    unstyled: l,
+    loaders: u,
     variant: g,
     children: d,
     ...b
   } = n, h = F({
     name: "Loader",
     props: n,
-    classes: T,
+    classes: _,
     className: s,
     style: p,
     classNames: c,
     styles: m,
-    unstyled: u,
+    unstyled: l,
     vars: i,
     varsResolver: pn
   });
@@ -1116,7 +1116,7 @@ const Pt = {
     {
       ...h("root"),
       ref: r,
-      component: l[a],
+      component: u[a],
       variant: g,
       size: e,
       ...b
@@ -1124,15 +1124,15 @@ const Pt = {
   );
 });
 D.defaultLoaders = Pt;
-D.classes = T;
+D.classes = _;
 D.displayName = "@mantine/core/Loader";
 var Y = { root: "m_77c9d27d", inner: "m_80f1301b", label: "m_811560b9", section: "m_a74036a", loader: "m_a25b86ee", group: "m_80d6d844", groupSection: "m_70be2a01" };
-const lt = {
+const ut = {
   orientation: "horizontal"
 }, mn = (t, { borderWidth: r }) => ({
   group: { "--button-border-width": R(r) }
 }), it = ot((t, r) => {
-  const n = O("ButtonGroup", lt, t), {
+  const n = O("ButtonGroup", ut, t), {
     className: e,
     style: o,
     classNames: a,
@@ -1141,10 +1141,10 @@ const lt = {
     orientation: p,
     vars: c,
     borderWidth: m,
-    variant: u,
-    mod: l,
+    variant: l,
+    mod: u,
     ...g
-  } = O("ButtonGroup", lt, t), d = F({
+  } = O("ButtonGroup", ut, t), d = F({
     name: "ButtonGroup",
     props: n,
     classes: Y,
@@ -1162,8 +1162,8 @@ const lt = {
     {
       ...d("group"),
       ref: r,
-      variant: u,
-      mod: [{ "data-orientation": p }, l],
+      variant: l,
+      mod: [{ "data-orientation": p }, u],
       role: "group",
       ...g
     }
@@ -1171,7 +1171,7 @@ const lt = {
 });
 it.classes = Y;
 it.displayName = "@mantine/core/ButtonGroup";
-const ft = {}, un = (t, { radius: r, color: n, gradient: e, variant: o, autoContrast: a, size: i }) => {
+const ft = {}, ln = (t, { radius: r, color: n, gradient: e, variant: o, autoContrast: a, size: i }) => {
   const s = t.variantColorResolver({
     color: n || t.primaryColor,
     theme: t,
@@ -1200,8 +1200,8 @@ const ft = {}, un = (t, { radius: r, color: n, gradient: e, variant: o, autoCont
     vars: p,
     variant: c,
     gradient: m,
-    radius: u,
-    autoContrast: l,
+    radius: l,
+    autoContrast: u,
     ...g
   } = O("ButtonGroupSection", ft, t), d = F({
     name: "ButtonGroupSection",
@@ -1213,14 +1213,14 @@ const ft = {}, un = (t, { radius: r, color: n, gradient: e, variant: o, autoCont
     styles: i,
     unstyled: s,
     vars: p,
-    varsResolver: un,
+    varsResolver: ln,
     rootSelector: "groupSection"
   });
   return /* @__PURE__ */ f($, { ...d("groupSection"), ref: r, variant: c, ...g });
 });
 st.classes = Y;
 st.displayName = "@mantine/core/ButtonGroupSection";
-const ln = {
+const un = {
   in: { opacity: 1, transform: `translate(-50%, calc(-50% + ${R(1)}))` },
   out: { opacity: 0, transform: "translate(-50%, -200%)" },
   common: { transformOrigin: "center" },
@@ -1257,14 +1257,14 @@ const ln = {
     children: p,
     leftSection: c,
     rightSection: m,
-    fullWidth: u,
-    variant: l,
+    fullWidth: l,
+    variant: u,
     radius: g,
     loading: d,
     loaderProps: b,
     gradient: h,
     classNames: x,
-    styles: _,
+    styles: T,
     unstyled: S,
     "data-disabled": N,
     autoContrast: C,
@@ -1277,7 +1277,7 @@ const ln = {
     className: a,
     style: e,
     classNames: x,
-    styles: _,
+    styles: T,
     unstyled: S,
     vars: o,
     varsResolver: dn
@@ -1288,13 +1288,13 @@ const ln = {
       ref: r,
       ...v("root", { active: !s && !d && !N }),
       unstyled: S,
-      variant: l,
+      variant: u,
       disabled: s || d,
       mod: [
         {
           disabled: s || N,
           loading: d,
-          block: u,
+          block: l,
           "with-left-section": B,
           "with-right-section": H
         },
@@ -1302,7 +1302,7 @@ const ln = {
       ],
       ...w,
       children: [
-        /* @__PURE__ */ f($t, { mounted: !!d, transition: ln, duration: 150, children: (V) => /* @__PURE__ */ f($, { component: "span", ...v("loader", { style: V }), "aria-hidden": !0, children: /* @__PURE__ */ f(
+        /* @__PURE__ */ f($t, { mounted: !!d, transition: un, duration: 150, children: (V) => /* @__PURE__ */ f($, { component: "span", ...v("loader", { style: V }), "aria-hidden": !0, children: /* @__PURE__ */ f(
           D,
           {
             color: "var(--button-color)",
@@ -1323,16 +1323,17 @@ I.classes = Y;
 I.displayName = "@mantine/core/Button";
 I.Group = it;
 I.GroupSection = st;
-const yn = "_root_17bsd_1", gn = "_inner_17bsd_6", hn = {
+const yn = "_root_gdr8x_1", gn = "_inner_gdr8x_7", hn = "_label_gdr8x_11", bn = {
   root: yn,
-  inner: gn
-}, wn = (t) => /* @__PURE__ */ f(
+  inner: gn,
+  label: hn
+}, $n = (t) => /* @__PURE__ */ f(
   I,
   {
     ...t,
-    classNames: hn
+    classNames: bn
   }
 );
 export {
-  wn as Button
+  $n as Button
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@kvell-group/ui",
   "author": "Kvell Group",
   "private": false,
-  "version": "1.6.9",
+  "version": "1.6.11",
   "type": "module",
   "files": [
     "dist",
@@ -21,9 +21,6 @@
     "format:fix": "prettier --write .",
     "build-storybook": "storybook build"
   },
-  "sideEffects": [
-    "**/*.css"
-  ],
   "dependencies": {
     "@mantine/core": "^7.17.3",
     "@mantine/hooks": "^7.17.3",