profinansy-ui-lib 3.8.4 → 3.8.6

package/dist/profinansy-ui-lib.es.js

@@ -7829,8 +7829,8 @@ const Bs = D.createContext(null), Ci = ({
   }
 }, yf = (e, t, n) => t && n ? e[t][n] : null, kf = g.p`
   display: inline-block;
-  color: ${(e) => yf(e.theme, e.colorCategory, e.colorName)};
-  ${({ variant: e }) => wf(e)};
+  color: ${(e) => yf(e.theme, e.$colorCategory, e.$colorName)};
+  ${({ $variant: e }) => wf(e)};
 `, N = st(
   ({
     tag: e = "p",
@@ -7850,11 +7850,11 @@ const Bs = D.createContext(null), Ci = ({
       {
         ref: p,
         as: f,
-        variant: r,
         className: t,
         title: o,
-        colorCategory: c,
-        colorName: h,
+        $variant: r,
+        $colorCategory: c,
+        $colorName: h,
         onClick: a,
         style: d,
         children: n
@@ -9166,7 +9166,7 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
   return /* @__PURE__ */ s.jsx(re, { theme: Q[t], children: n ? /* @__PURE__ */ s.jsx(Hh, { ...e }) : /* @__PURE__ */ s.jsx(Th, { ...e }) });
 }, Bh = g.div`
   width: 100%;
-  margin-bottom: ${(e) => e.marginBottom}px;
+  margin-bottom: ${(e) => e.$marginBottom}px;
 `, Vh = g.label`
   font-weight: 500;
   font-size: 13px;
@@ -9200,7 +9200,7 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
   return /* @__PURE__ */ s.jsx(re, { theme: Q[a], children: /* @__PURE__ */ s.jsxs(
     Bh,
     {
-      marginBottom: r,
+      $marginBottom: r,
       className: Ve(i, "fieldRow-container"),
       children: [
         !!e && /* @__PURE__ */ s.jsxs(Vh, { onClick: (l) => l.preventDefault(), children: [
@@ -9464,19 +9464,19 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
   justify-content: center;
   box-sizing: border-box;
   cursor: pointer;
-  ${({ size: e, $form: t, $mode: n }) => Wh(n, t)[e]}
-  width: ${(e) => e.width || "auto"};
+  ${({ $size: e, $form: t, $mode: n }) => Wh(n, t)[e]}
+  width: ${(e) => e.$width || "auto"};
   color: ${(e) => bt(e.theme)[e.$mode].default.color};
   border: ${(e) => bt(e.theme)[e.$mode].default.border || "none"};
   background: ${(e) => bt(e.theme)[e.$mode].default.background};
-  padding-left: ${(e) => `${O5(e.$mode, e.size, e.isText)}px`};
-  padding-right: ${(e) => `${O5(e.$mode, e.size, e.isText)}px`};
+  padding-left: ${(e) => `${O5(e.$mode, e.$size, e.$isText)}px`};
+  padding-right: ${(e) => `${O5(e.$mode, e.$size, e.$isText)}px`};
   transition: all 0.3s ${O.animation_1};
   & > span {
     white-space: nowrap;
   }
   & path {
-    ${(e) => e.isFill ? z`
+    ${(e) => e.$isFill ? z`
             fill: ${bt(e.theme)[e.$mode].default.color};
           ` : z``}
   }
@@ -9485,7 +9485,7 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
     border: ${(e) => bt(e.theme)[e.$mode].hover.border || "none"};
     color: ${(e) => bt(e.theme)[e.$mode].hover.color};
     & path {
-      ${(e) => e.isFill ? z`
+      ${(e) => e.$isFill ? z`
               fill: ${bt(e.theme)[e.$mode].hover.color};
             ` : z``}
     }
@@ -9495,7 +9495,7 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
     border: ${(e) => bt(e.theme)[e.$mode].active?.border || "none"};
     color: ${(e) => bt(e.theme)[e.$mode].active.color};
     & path {
-      ${(e) => e.isFill ? z`
+      ${(e) => e.$isFill ? z`
               fill: ${bt(e.theme)[e.$mode].active.color};
             ` : z``}
     }
@@ -9666,12 +9666,12 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
         className: Ve(h, "button"),
         disabled: o || c,
         onClick: x,
-        size: l,
+        $size: l,
         $mode: r,
-        width: p,
-        isFill: v,
+        $width: p,
+        $isFill: v,
         tabIndex: C,
-        isText: !!e || !!t,
+        $isText: !!e || !!t,
         children: [
           c && /* @__PURE__ */ s.jsx(Xh, { $mode: r, children: /* @__PURE__ */ s.jsx(tm, { color: bt(Q[y])[r].default.color }) }),
           i ? /* @__PURE__ */ s.jsx(Yh, { isText: !!e, size: l, children: i }) : null,
@@ -9747,13 +9747,13 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
   width: 100%;
   padding: 11px 12px;
   height: 44px;
-  padding-left: ${(e) => e.icon && e.positionIcon === "left" ? "44px" : "12px"};
-  padding-right: ${(e) => e.icon && e.positionIcon === "right" || e.rightText ? "48px" : "12px"};
+  padding-left: ${(e) => e.$icon && e.$positionIcon === "left" ? "44px" : "12px"};
+  padding-right: ${(e) => e.$icon && e.$positionIcon === "right" || e.$rightText ? "48px" : "12px"};
   border-radius: 8px;
   background: ${(e) => e.theme.background.field};
   border: 0.8px solid
-    ${(e) => e.error ? `${e.theme.stroke.negative} !important` : e.theme.stroke.primary};
-  ${(e) => e.prohibitTextInput && z`
+    ${(e) => e.$error ? `${e.theme.stroke.negative} !important` : e.theme.stroke.primary};
+  ${(e) => e.$prohibitTextInput && z`
       caret-color: transparent;
       cursor: pointer;
     `}
@@ -9856,14 +9856,14 @@ const Zs = D.createContext(null), Th = ({ content: e, ...t }) => {
           onChange: Z,
           onFocus: v,
           onBlur: b,
-          prohibitTextInput: c,
+          $prohibitTextInput: c,
           onKeyDown: x,
           onClick: y,
           autoComplete: w,
-          error: !!p,
-          icon: !!f,
-          rightText: !!m,
-          positionIcon: _
+          $error: !!p,
+          $icon: !!f,
+          $rightText: !!m,
+          $positionIcon: _
         }
       ),
       f ? /* @__PURE__ */ s.jsx(
@@ -11455,24 +11455,24 @@ const P3 = {
   display: flex;
   align-items: center;
   gap: 8px;
-  flex-wrap: ${(e) => e.scroll === "none" ? "wrap" : "nowrap"};
-  overflow-x: ${(e) => e.scroll === "none" ? "visible" : "auto"};
+  flex-wrap: ${(e) => e.$scroll === "none" ? "wrap" : "nowrap"};
+  overflow-x: ${(e) => e.$scroll === "none" ? "visible" : "auto"};
 
   -ms-overflow-style: none; /* IE и Edge */
   scrollbar-width: none; /* Firefox */
   &::-webkit-scrollbar {
     display: none;
   }
-  ${(e) => e.mode === "support" && z`
+  ${(e) => e.$mode === "support" && z`
       padding-bottom: 20px;
       margin-bottom: -20px;
     `};
   @media (max-width: ${ve}px) {
-    ${(e) => e.scroll !== "none" && z`
-        padding-right: ${`${e.mobileIndent}px`};
-        margin-right: ${`-${e.mobileIndent}px`};
-        padding-left: ${`${e.mobileIndent}px`};
-        margin-left: ${`-${e.mobileIndent}px`};
+    ${(e) => e.$scroll !== "none" && z`
+        padding-right: ${`${e.$mobileIndent}px`};
+        margin-right: ${`-${e.$mobileIndent}px`};
+        padding-left: ${`${e.$mobileIndent}px`};
+        margin-left: ${`-${e.$mobileIndent}px`};
       `}
   }
 `, rC = g.button`
@@ -11481,26 +11481,26 @@ const P3 = {
   display: flex;
   justify-content: center;
   align-items: center;
-  padding: ${(e) => `0px ${e.isIconRight ? "10px" : "14px"} 0px ${e.isIconLeft ? "10px" : "14px"}`};
+  padding: ${(e) => `0px ${e.$isIconRight ? "10px" : "14px"} 0px ${e.$isIconLeft ? "10px" : "14px"}`};
   height: 36px;
-  border: ${(e) => `1px solid ${Ht(e.theme, e.isActive)[e.mode].default.border}`};
-  background: ${(e) => Ht(e.theme, e.isActive)[e.mode].default.background};
+  border: ${(e) => `1px solid ${Ht(e.theme, e.$isActive)[e.$mode].default.border}`};
+  background: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].default.background};
   border-radius: 24px;
-  color: ${(e) => Ht(e.theme, e.isActive)[e.mode].default.color};
+  color: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].default.color};
   cursor: pointer;
   white-space: nowrap;
-  box-shadow: ${(e) => Ht(e.theme, e.isActive)[e.mode].default.boxShadow};
+  box-shadow: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].default.boxShadow};
   transition: ${() => `all 0.3s ${O.animation_1}`};
   & path {
-    fill: ${(e) => Ht(e.theme, e.isActive)[e.mode].default.iconColor};
+    fill: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].default.iconColor};
   }
   &:hover {
-    background: ${(e) => Ht(e.theme, e.isActive)[e.mode].hover.background};
-    box-shadow: ${(e) => Ht(e.theme, e.isActive)[e.mode].hover.boxShadow};
-    color: ${(e) => Ht(e.theme, e.isActive)[e.mode].hover.color};
-    border: ${(e) => `1px solid ${Ht(e.theme, e.isActive)[e.mode].hover.border}`};
+    background: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].hover.background};
+    box-shadow: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].hover.boxShadow};
+    color: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].hover.color};
+    border: ${(e) => `1px solid ${Ht(e.theme, e.$isActive)[e.$mode].hover.border}`};
     & path {
-      fill: ${(e) => Ht(e.theme, e.isActive)[e.mode].hover.iconColor};
+      fill: ${(e) => Ht(e.theme, e.$isActive)[e.$mode].hover.iconColor};
     }
   }
 `, oC = g.span`
@@ -11580,20 +11580,20 @@ const P3 = {
     return /* @__PURE__ */ s.jsx(
       nC,
       {
-        mode: o,
+        $mode: o,
         style: i,
         ref: f,
-        scroll: l,
-        mobileIndent: e,
+        $scroll: l,
+        $mobileIndent: e,
         children: h.map((x, y) => /* @__PURE__ */ s.jsxs(
           rC,
           {
             className: d,
-            mode: o,
-            isIconLeft: !!x.iconLeft,
-            isIconRight: !!x.iconRight,
+            $mode: o,
+            $isIconLeft: !!x.iconLeft,
+            $isIconRight: !!x.iconRight,
             onClick: (w) => v(x.value, w, y),
-            isActive: m(x),
+            $isActive: m(x),
             onMouseLeave: () => {
               C.current[y] && (clearTimeout(C.current[y]), C.current[y] = null);
             },
@@ -21926,9 +21926,9 @@ const w2 = D.createContext(null), lL = st(
   padding: 4px 8px;
   height: 32px;
   gap: 6px;
-  background: ${(e) => e.isStroke ? "transparent" : e.theme.background.field};
+  background: ${(e) => e.$isStroke ? "transparent" : e.theme.background.field};
   border-radius: 8px;
-  border: ${(e) => e.isStroke ? `0.5px solid ${e.theme.stroke.primary}` : "none"};
+  border: ${(e) => e.$isStroke ? `0.5px solid ${e.theme.stroke.primary}` : "none"};
   cursor: pointer;
   transition: background-color 0.3s ${O.animation_1},
     border 0.3s ${O.animation_1};
@@ -21938,18 +21938,18 @@ const w2 = D.createContext(null), lL = st(
   }
   & svg {
     min-width: 24px;
-    transform: ${(e) => e.isASC ? "rotate(180deg)" : "rotate(0deg)"};
+    transform: ${(e) => e.$isASC ? "rotate(180deg)" : "rotate(0deg)"};
   }
   & path {
     fill: ${(e) => e.theme.icons.primary};
   }
   &:hover {
-    background: ${(e) => e.isStroke ? "transparent" : e.theme.background.secondaryAlpha};
-    border: ${(e) => e.isStroke ? `0.5px solid ${e.theme.stroke.contrast}` : "none"};
+    background: ${(e) => e.$isStroke ? "transparent" : e.theme.background.secondaryAlpha};
+    border: ${(e) => e.$isStroke ? `0.5px solid ${e.theme.stroke.contrast}` : "none"};
   }
   @media (max-width: ${ie}px) {
     & > span {
-      display: ${(e) => e.isMobileWithoutText ? "none" : "inline"};
+      display: ${(e) => e.$isMobileWithoutText ? "none" : "inline"};
     }
   }
 `, CL = g.button`
@@ -21997,10 +21997,10 @@ const w2 = D.createContext(null), lL = st(
         targetElement: /* @__PURE__ */ s.jsxs(
           _l,
           {
-            isMobileWithoutText: i,
-            isStroke: e,
+            $isMobileWithoutText: i,
+            $isStroke: e,
             onClick: r,
-            isASC: c.type === "ASC",
+            $isASC: c.type === "ASC",
             ref: p,
             children: [
               !n && /* @__PURE__ */ s.jsx(oo, {}),
@@ -22036,10 +22036,10 @@ const w2 = D.createContext(null), lL = st(
     ) }) : /* @__PURE__ */ s.jsx(re, { theme: Q[f], children: /* @__PURE__ */ s.jsxs(
       _l,
       {
-        isMobileWithoutText: i,
-        isStroke: e,
+        $isMobileWithoutText: i,
+        $isStroke: e,
         onClick: r,
-        isASC: o,
+        $isASC: o,
         ref: p,
         children: [
           !n && /* @__PURE__ */ s.jsx(oo, {}),
@@ -22724,14 +22724,14 @@ function OL(e, t) {
     });
   }, [t]), W(() => {
     const c = (d, p) => {
-      const f = d[o.field], m = p[o.field], h = (b, x) => {
-        const y = b ?? -1 / 0, w = x ?? -1 / 0;
-        return o.order === "ASC" ? y - w : w - y;
-      }, C = (b, x) => o.order === "ASC" ? b.localeCompare(x) : x.localeCompare(b), v = (b, x) => {
-        const y = b ? new Date(b).getTime() : -1 / 0, w = x ? new Date(x).getTime() : -1 / 0;
-        return o.order === "ASC" ? y - w : w - y;
+      const f = d[o.field], m = p[o.field], h = (x, y) => o.order === "ASC" ? +x - +y : +y - +x, C = (x, y) => {
+        const w = x ?? -1 / 0, E = y ?? -1 / 0;
+        return o.order === "ASC" ? w - E : E - w;
+      }, v = (x, y) => o.order === "ASC" ? x.localeCompare(y) : y.localeCompare(x), b = (x, y) => {
+        const w = x ? new Date(x).getTime() : -1 / 0, E = y ? new Date(y).getTime() : -1 / 0;
+        return o.order === "ASC" ? w - E : E - w;
       };
-      return typeof f == "number" && typeof m == "number" ? h(f, m) : typeof f == "string" && typeof m == "string" ? !isNaN(Date.parse(f)) ? v(f, m) : C(f, m) : typeof f == "number" ? o.order === "DESC" ? -1 : 1 : o.order === "DESC" ? 1 : -1;
+      return typeof f == "number" && typeof m == "number" ? C(f, m) : typeof f == "boolean" && typeof m == "boolean" ? h(f, m) : typeof f == "string" && typeof m == "string" ? !isNaN(Date.parse(f)) ? b(f, m) : v(f, m) : typeof f == "number" ? o.order === "DESC" ? -1 : 1 : o.order === "DESC" ? 1 : -1;
     };
     if (!a)
       if (o?.order) {
@@ -23485,12 +23485,12 @@ const vj = ({ withIcon: e = !0, ...t }) => {
     ] })
   ] }) }) });
 }, pS = g.div`
-  width: ${(e) => e.width};
+  width: ${(e) => e.$width};
   background: ${(e) => e.theme.background.content};
   border-radius: 16px;
-  padding: ${(e) => e.padding};
-  margin: ${(e) => e.margin};
-  ${(e) => e.isHover && z`
+  padding: ${(e) => e.$padding};
+  margin: ${(e) => e.$margin};
+  ${(e) => e.$isHover && z`
       cursor: pointer;
       transition: ${() => `all 0.4s ${O.animation_1}`};
       &:hover {
@@ -23500,7 +23500,7 @@ const vj = ({ withIcon: e = !0, ...t }) => {
     `}
 `, fS = g.div`
   width: 100%;
-  margin-bottom: ${(e) => e.isMarginBottom ? "12px" : "0"};
+  margin-bottom: ${(e) => e.$isMarginBottom ? "12px" : "0"};
 `, hS = g.div`
   width: 100%;
   display: flex;
@@ -23630,17 +23630,17 @@ const vj = ({ withIcon: e = !0, ...t }) => {
   return /* @__PURE__ */ s.jsx(re, { theme: Q[w], children: /* @__PURE__ */ s.jsxs(
     pS,
     {
-      margin: b,
-      padding: v,
-      width: C,
-      isHover: p,
+      $margin: b,
+      $padding: v,
+      $width: C,
+      $isHover: p,
       className: Ve(l, "card-container"),
       ref: t,
       children: [
         o || /* @__PURE__ */ s.jsx(s.Fragment, { children: r && /* @__PURE__ */ s.jsxs(
           fS,
           {
-            isMarginBottom: !!n,
+            $isMarginBottom: !!n,
             className: Ve(d, "card-header"),
             children: [
               /* @__PURE__ */ s.jsxs(hS, { adaptiveRightContent: y, children: [