@arthurzakharov/ui-kit 1.0.55 → 1.0.57

package/dist/assets/button-4MJZ7yPE.css

@@ -0,0 +1 @@
+._Button_1utzs_1{position:relative;box-sizing:border-box;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center}._ButtonSizeSm_1utzs_11{border-radius:var(--rm-ui-border-radius-sm);padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm)}._ButtonSizeLg_1utzs_16._ButtonColorTertiary_1utzs_16{padding:calc(var(--rm-ui-padding-xs) - 1px) calc(var(--rm-ui-padding-sm) - 1px)}._ButtonSizeSm_1utzs_11 ._ButtonText_1utzs_20{font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small)}._ButtonSizeMd_1utzs_26{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-sm) var(--rm-ui-padding-lg)}._ButtonSizeMd_1utzs_26._ButtonColorTertiary_1utzs_16{padding:calc(var(--rm-ui-padding-sm) - 1px) calc(var(--rm-ui-padding-lg) - 1px)}._ButtonSizeLg_1utzs_16{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-sm) var(--rm-ui-padding-lg)}._ButtonSizeLg_1utzs_16._ButtonColorTertiary_1utzs_16{padding:calc(var(--rm-ui-padding-sm) - 1px) calc(var(--rm-ui-padding-lg) - 1px)}._ButtonSizeMd_1utzs_26 ._ButtonText_1utzs_20{font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body)}._ButtonSizeLg_1utzs_16 ._ButtonText_1utzs_20{font-size:var(--rm-ui-font-size-body-large);line-height:var(--rm-ui-line-height-body-large)}._ButtonColorPrimary_1utzs_54{background-color:var(--rm-ui-next-btn-bg)}._ButtonColorPrimary_1utzs_54 ._ButtonText_1utzs_20{color:#fff}._ButtonColorSecondary_1utzs_62{background-color:transparent}._ButtonColorSecondary_1utzs_62 ._ButtonText_1utzs_20{color:var(--rm-ui-color-text-secondary)}._ButtonColorTertiary_1utzs_16{border:1px solid var(--rm-ui-grey-300);background-color:transparent}._ButtonColorTertiary_1utzs_16 ._ButtonText_1utzs_20{color:var(--rm-ui-color-text-primary)}._Button_1utzs_1:not(._ButtonLoading_1utzs_79):not(:disabled):hover{cursor:pointer}._Button_1utzs_1:focus{outline-color:var(--rm-ui-color-focus)}._ButtonFullWidth_1utzs_87{width:100%}._ButtonText_1utzs_20{font-weight:var(--rm-ui-font-weight-medium)}._ButtonInfo_1utzs_95{font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body-small);line-height:calc(var(--rm-ui-line-height-body-small) - 2px);color:#fff}._ButtonContent_1utzs_102{transition:opacity .2s ease-in-out .2s}._ButtonContentLoading_1utzs_106{opacity:0}._ButtonContentIdle_1utzs_110{opacity:1}._ButtonLoaderWrap_1utzs_114{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}._ButtonLoaderAnimationWrap_1utzs_121{display:flex;flex-direction:column;align-items:center;justify-content:center}

package/dist/components/control/components/button/button.component.d.ts

@@ -1,6 +1,6 @@
 import { PropsWithChildren } from 'react';
 export interface ButtonProps extends PropsWithChildren {
-    color: 'next' | 'previous';
+    color: 'primary' | 'secondary' | 'tertiary';
     size: 'sm' | 'md' | 'lg';
     type: 'submit' | 'reset' | 'button';
     disabled?: boolean;

package/dist/components/control/components/button/button.component.js

@@ -1,70 +1,72 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
 import i from "clsx";
 import { Animation as C } from "../../../animation/animation.component.js";
 import { Loader as L } from "../../../loader/loader.component.js";
 import { containsHtml as S } from "../../utils/utils.js";
-import '../../../../assets/button-DZ6T9O3D.css';const f = "_Button_1dpso_1", g = "_ButtonSizeSm_1dpso_11", z = "_ButtonText_1dpso_16", h = "_ButtonSizeMd_1dpso_22", x = "_ButtonSizeLg_1dpso_23", W = "_ButtonColorNext_1dpso_38", N = "_ButtonColorPrevious_1dpso_46", I = "_ButtonLoading_1dpso_54", v = "_ButtonFullWidth_1dpso_62", F = "_ButtonInfo_1dpso_70", A = "_ButtonContent_1dpso_77", M = "_ButtonContentLoading_1dpso_81", T = "_ButtonContentIdle_1dpso_85", b = "_ButtonLoaderWrap_1dpso_89", P = "_ButtonLoaderAnimationWrap_1dpso_96", t = {
-  Button: f,
-  ButtonSizeSm: g,
-  ButtonText: z,
-  ButtonSizeMd: h,
-  ButtonSizeLg: x,
-  ButtonColorNext: W,
-  ButtonColorPrevious: N,
-  ButtonLoading: I,
-  ButtonFullWidth: v,
-  ButtonInfo: F,
+import '../../../../assets/button-4MJZ7yPE.css';const p = "_Button_1utzs_1", y = "_ButtonSizeSm_1utzs_11", f = "_ButtonSizeLg_1utzs_16", g = "_ButtonColorTertiary_1utzs_16", h = "_ButtonText_1utzs_20", W = "_ButtonSizeMd_1utzs_26", I = "_ButtonColorPrimary_1utzs_54", T = "_ButtonColorSecondary_1utzs_62", x = "_ButtonLoading_1utzs_79", F = "_ButtonFullWidth_1utzs_87", N = "_ButtonInfo_1utzs_95", A = "_ButtonContent_1utzs_102", M = "_ButtonContentLoading_1utzs_106", b = "_ButtonContentIdle_1utzs_110", P = "_ButtonLoaderWrap_1utzs_114", j = "_ButtonLoaderAnimationWrap_1utzs_121", t = {
+  Button: p,
+  ButtonSizeSm: y,
+  ButtonSizeLg: f,
+  ButtonColorTertiary: g,
+  ButtonText: h,
+  ButtonSizeMd: W,
+  ButtonColorPrimary: I,
+  ButtonColorSecondary: T,
+  ButtonLoading: x,
+  ButtonFullWidth: F,
+  ButtonInfo: N,
   ButtonContent: A,
   ButtonContentLoading: M,
-  ButtonContentIdle: T,
-  ButtonLoaderWrap: b,
-  ButtonLoaderAnimationWrap: P
-}, $ = (l) => {
+  ButtonContentIdle: b,
+  ButtonLoaderWrap: P,
+  ButtonLoaderAnimationWrap: j
+}, q = (l) => {
   const {
-    children: a,
-    color: s,
-    size: u,
+    children: s,
+    color: e,
+    size: a,
     type: B,
-    disabled: r = !1,
+    disabled: d = !1,
     info: n = "",
-    fullWidth: _ = !1,
-    loading: e = !1,
-    onClick: c,
-    onFocus: p,
-    onBlur: m
+    fullWidth: c = !1,
+    loading: u = !1,
+    onClick: _,
+    onFocus: m,
+    onBlur: z
   } = l;
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ r(
     "button",
     {
       "data-testid": "button",
       type: B,
-      disabled: r || e,
+      disabled: d || u,
       className: i(t.Button, {
-        [t.ButtonSizeSm]: u === "sm",
-        [t.ButtonSizeMd]: u === "md",
-        [t.ButtonSizeLg]: u === "lg",
-        [t.ButtonColorNext]: s === "next",
-        [t.ButtonColorPrevious]: s === "previous",
-        [t.ButtonFullWidth]: _,
-        [t.ButtonLoading]: e
+        [t.ButtonSizeSm]: a === "sm",
+        [t.ButtonSizeMd]: a === "md",
+        [t.ButtonSizeLg]: a === "lg",
+        [t.ButtonColorPrimary]: e === "primary",
+        [t.ButtonColorSecondary]: e === "secondary",
+        [t.ButtonColorTertiary]: e === "tertiary",
+        [t.ButtonFullWidth]: c,
+        [t.ButtonLoading]: u
       }),
-      onClick: () => c?.call(null),
-      onFocus: () => p?.call(null),
-      onBlur: () => m?.call(null),
+      onClick: () => _?.call(null),
+      onFocus: () => m?.call(null),
+      onBlur: () => z?.call(null),
       children: [
         /* @__PURE__ */ o("div", { className: t.ButtonLoaderWrap, children: /* @__PURE__ */ o(
           C.FadeScale,
           {
             name: "loader",
-            condition: e,
+            condition: u,
             duration: 0.2,
             delay: 0.2,
             className: t.ButtonLoaderAnimationWrap,
             children: /* @__PURE__ */ o(L, { size: 24, color: "white" })
           }
         ) }),
-        /* @__PURE__ */ d("div", { className: i(t.ButtonContent, e ? t.ButtonContentLoading : t.ButtonContentIdle), children: [
-          /* @__PURE__ */ o("span", { className: t.ButtonText, children: a }),
+        /* @__PURE__ */ r("div", { className: i(t.ButtonContent, u ? t.ButtonContentLoading : t.ButtonContentIdle), children: [
+          /* @__PURE__ */ o("span", { className: t.ButtonText, children: s }),
           S(n) && n ? /* @__PURE__ */ o("span", { className: t.ButtonInfo, dangerouslySetInnerHTML: { __html: n } }) : /* @__PURE__ */ o("span", { className: t.ButtonInfo, children: n })
         ] })
       ]
@@ -72,5 +74,5 @@ import '../../../../assets/button-DZ6T9O3D.css';const f = "_Button_1dpso_1", g =
   );
 };
 export {
-  $ as Button
+  q as Button
 };

package/dist/components/control/components/dropdown/dropdown.component.js

@@ -29,17 +29,17 @@ import '../../../../assets/dropdown-DLXy_DVj.css';const Y = "_Dropdown_1bylm_1",
   DropdownChoice: Do,
   DropdownChoiceNoResult: mo
 }, Ro = (s) => {
-  const { choices: f = [], value: a = [], isSearchHidden: k = !1, multiple: i = !1, onChange: h, onOpen: H, onClose: z } = s, V = s.label || "", I = s.placeholder || "Wählen Sie Ihre private Krankenversicherung...", O = s.noResult || "Keine Versicherung gefunden.", W = s.closeButton || "Schließen", v = u(null), w = u(null), x = u(null), { value: t, setFalse: D, toggle: A } = M(!1), [m, G] = C(""), [l, L] = C({ width: 0, height: 0 }), [p, y] = C([]);
+  const { choices: f = [], value: a = [], isSearchHidden: k = !1, multiple: i = !1, onChange: h, onOpen: H, onClose: z } = s, V = s.label || "", I = s.placeholder || "Wählen Sie Ihre private Krankenversicherung...", O = s.noResult || "Keine Versicherung gefunden.", W = s.closeButton || "Schließen", v = u(null), w = u(null), y = u(null), { value: t, setFalse: D, toggle: A } = M(!1), [m, G] = C(""), [l, L] = C({ width: 0, height: 0 }), [p, x] = C([]);
   T({
     ref: w,
     onResize: (o) => L({ width: o.width || 0, height: o.height || 0 })
   }), E(w, (o) => {
     U(o, v) || (i && h(p), D());
-  }), g(() => y(Array.isArray(a) ? a : []), [a]), g(() => {
-    t && l.width && l.height ? (x.current?.focus(), H?.call(null, l.height, l.width)) : z?.call(null);
+  }), g(() => x(Array.isArray(a) ? a : []), [a]), g(() => {
+    t && l.width && l.height ? (y.current?.focus(), H?.call(null, l.height, l.width)) : z?.call(null);
   }, [t, l]);
   const j = (o, c) => {
-    y((d) => d.some(({ value: _ }) => _ === o) ? d.filter(({ value: _ }) => _ !== o) : [...d, { value: o, label: c }]);
+    x((d) => d.some(({ value: _ }) => _ === o) ? d.filter(({ value: _ }) => _ !== o) : [...d, { value: o, label: c }]);
   }, F = () => {
     D(), h(p);
   }, B = K(
@@ -59,7 +59,7 @@ import '../../../../assets/dropdown-DLXy_DVj.css';const Y = "_Dropdown_1bylm_1",
         /* @__PURE__ */ n(
           "input",
           {
-            ref: x,
+            ref: y,
             value: m,
             type: "text",
             className: e.DropdownInput,
@@ -88,7 +88,7 @@ import '../../../../assets/dropdown-DLXy_DVj.css';const Y = "_Dropdown_1bylm_1",
         },
         o + d
       )) : /* @__PURE__ */ n("li", { className: N(e.DropdownChoice, e.DropdownChoiceNoResult), children: /* @__PURE__ */ n(b, { size: "lg", checked: !1, children: O }) }) }),
-      i && /* @__PURE__ */ n("div", { className: e.DropdownClose, children: /* @__PURE__ */ n(J, { color: "next", size: "sm", type: "button", onClick: () => F(), children: W }) })
+      i && /* @__PURE__ */ n("div", { className: e.DropdownClose, children: /* @__PURE__ */ n(J, { color: "primary", size: "sm", type: "button", onClick: () => F(), children: W }) })
     ] }) })
   ] });
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arthurzakharov/ui-kit",
   "private": false,
-  "version": "1.0.55",
+  "version": "1.0.57",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",

package/dist/assets/button-DZ6T9O3D.css

@@ -1 +0,0 @@
-._Button_1dpso_1{position:relative;box-sizing:border-box;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center}._ButtonSizeSm_1dpso_11{border-radius:var(--rm-ui-border-radius-sm);padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm)}._ButtonSizeSm_1dpso_11 ._ButtonText_1dpso_16{font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body-small);line-height:var(--rm-ui-line-height-body-small)}._ButtonSizeMd_1dpso_22,._ButtonSizeLg_1dpso_23{border-radius:var(--rm-ui-border-radius-md);padding:var(--rm-ui-padding-sm) var(--rm-ui-padding-md)}._ButtonSizeMd_1dpso_22 ._ButtonText_1dpso_16{font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body)}._ButtonSizeLg_1dpso_23 ._ButtonText_1dpso_16{font-size:var(--rm-ui-font-size-body-large);line-height:var(--rm-ui-line-height-body-large)}._ButtonColorNext_1dpso_38{background-color:var(--rm-ui-next-btn-bg)}._ButtonColorNext_1dpso_38 ._ButtonText_1dpso_16{color:#fff}._ButtonColorPrevious_1dpso_46{background-color:transparent}._ButtonColorPrevious_1dpso_46 ._ButtonText_1dpso_16{color:var(--rm-ui-color-text-secondary)}._Button_1dpso_1:not(._ButtonLoading_1dpso_54):not(:disabled):hover{cursor:pointer}._Button_1dpso_1:focus{outline-color:var(--rm-ui-color-focus)}._ButtonFullWidth_1dpso_62{width:100%}._ButtonText_1dpso_16{font-weight:var(--rm-ui-font-weight-medium)}._ButtonInfo_1dpso_70{font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body-small);line-height:calc(var(--rm-ui-line-height-body-small) - 2px);color:#fff}._ButtonContent_1dpso_77{transition:opacity .2s ease-in-out .2s}._ButtonContentLoading_1dpso_81{opacity:0}._ButtonContentIdle_1dpso_85{opacity:1}._ButtonLoaderWrap_1dpso_89{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}._ButtonLoaderAnimationWrap_1dpso_96{display:flex;flex-direction:column;align-items:center;justify-content:center}