@arthurzakharov/ui-kit 3.14.0 → 3.15.0

package/dist/assets/radio-D4fKo4f0.css

@@ -0,0 +1 @@
+._Radio_1trgm_1{display:inline-flex;flex-direction:column}._WithLabel_1trgm_6{display:flex;width:100%;gap:var(--rm-ui-padding-sm)}._Content_1trgm_12{display:inline-flex}._Horizontal_1trgm_16{flex-direction:row;gap:var(--rm-ui-padding-lg)}._Vertical_1trgm_21{flex-direction:column;gap:var(--rm-ui-padding-xxs)}._Label_1trgm_26{position:relative;display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xs)}._Label_1trgm_26:hover{cursor:pointer}._ErrorMessage_1trgm_39{padding-top:var(--rm-ui-padding-xxs)}

package/dist/controls/interactives/radio/radio.component.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { ChoiceProps, CaptionProps } from '../../primitives';
 import { Interactive, RadioChoice } from '../../utils';
 import { Base } from '../../../utils/types';
@@ -7,5 +8,6 @@ export interface RadioProps extends Base, Interactive<string> {
     iconSize?: ChoiceProps['size'];
     textSize?: CaptionProps['size'];
     message?: string;
+    label?: ReactNode;
 }
-export declare const Radio: ({ id, value, disabled, state, onChange, onFocus, onBlur, choices, orientation, iconSize, textSize, message, ...base }: RadioProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Radio: ({ id, value, disabled, state, onChange, onFocus, onBlur, choices, orientation, iconSize, textSize, message, label, ...base }: RadioProps) => import("react/jsx-runtime").JSX.Element;

package/dist/controls/interactives/radio/radio.component.js

@@ -1,111 +1,97 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import { clsx as p, baseProps as _ } from "../../../utils/functions/functions.util.js";
-import { FadeSlide as k } from "../../../animations/fade-slide/fade-slide.component.js";
+import { jsxs as u, jsx as r } from "react/jsx-runtime";
+import { baseProps as g, clsx as f } from "../../../utils/functions/functions.util.js";
+import { FadeSlide as $ } from "../../../animations/fade-slide/fade-slide.component.js";
 import "../../primitives/box/box.component.js";
-import { Caption as I } from "../../primitives/caption/caption.component.js";
-import { Choice as V } from "../../primitives/choice/choice.component.js";
-import { ErrorMessage as y } from "../../primitives/error-message/error-message.component.js";
-import { HiddenInput as F } from "../../primitives/hidden-input/hidden-input.component.js";
+import { Caption as F } from "../../primitives/caption/caption.component.js";
+import { Choice as j } from "../../primitives/choice/choice.component.js";
+import { ErrorMessage as B } from "../../primitives/error-message/error-message.component.js";
+import { HiddenInput as w } from "../../primitives/hidden-input/hidden-input.component.js";
 import "../../../utils/content/content.component.js";
-import { RadioLabel as j } from "../../primitives/radio-label/radio-label.component.js";
+import { RadioLabel as P } from "../../primitives/radio-label/radio-label.component.js";
 import "lucide-react";
-import { getChoiceId as B } from "../../utils/functions/functions.util.js";
-import { useControlInteraction as $ } from "../../utils/hooks/use-control-interaction/use-control-interaction.hook.js";
-import '../../../assets/radio-VoXwCoAp.css';const P = "_Radio_rt0wk_1", S = "_Content_rt0wk_6", q = "_Horizontal_rt0wk_10", A = "_Vertical_rt0wk_15", D = "_Label_rt0wk_20", G = "_ErrorMessage_rt0wk_33", o = {
-  Radio: P,
-  Content: S,
-  Horizontal: q,
-  Vertical: A,
-  Label: D,
-  ErrorMessage: G
-}, ar = ({
+import { Text as S } from "../../../components/text/text.component.js";
+import { getChoiceId as T } from "../../utils/functions/functions.util.js";
+import { useControlInteraction as q } from "../../utils/hooks/use-control-interaction/use-control-interaction.hook.js";
+import '../../../assets/radio-D4fKo4f0.css';const A = "_Radio_1trgm_1", D = "_WithLabel_1trgm_6", G = "_Content_1trgm_12", J = "_Horizontal_1trgm_16", K = "_Vertical_1trgm_21", O = "_Label_1trgm_26", Q = "_ErrorMessage_1trgm_39", o = {
+  Radio: A,
+  WithLabel: D,
+  Content: G,
+  Horizontal: J,
+  Vertical: K,
+  Label: O,
+  ErrorMessage: Q
+}, U = (t, a) => t == null || t === !1 || t === "" ? null : typeof t == "string" || typeof t == "number" ? /* @__PURE__ */ r(S, { tag: "div", weight: "medium", size: "body", color: "text-primary", "data-testid": `${a}-label`, children: t }) : /* @__PURE__ */ r("div", { "data-testid": `${a}-label`, children: t }), ct = ({
   // Interactive props
-  id: e,
-  value: u = "",
-  disabled: a = !1,
-  state: s = "idle",
-  onChange: f,
-  onFocus: C,
-  onBlur: g,
+  id: t,
+  value: a = "",
+  disabled: n = !1,
+  state: d = "idle",
+  onChange: h,
+  onFocus: v,
+  onBlur: L,
   // Radio props
-  choices: h,
+  choices: C,
   orientation: l = "horizontal",
-  iconSize: v = "md",
-  textSize: z = "body",
-  message: m = "",
+  iconSize: z = "md",
+  textSize: x = "body",
+  message: c = "",
+  label: e,
   // Base props
-  ...d
+  ...p
 }) => {
-  const { emitChange: w, handleFocus: x, handleBlur: E } = $({
-    id: e,
-    disabled: a,
-    onChange: f,
-    onFocus: C,
-    onBlur: g
-  });
-  return /* @__PURE__ */ c(
-    "div",
-    {
-      "data-testid": _(d, "data-testid", "radio"),
-      className: p(o.Radio, _(d, "className")),
-      children: [
-        /* @__PURE__ */ r(
-          "div",
-          {
-            className: p(o.Content, {
-              [o.Horizontal]: l === "horizontal",
-              [o.Vertical]: l === "vertical"
-            }),
-            children: h.map((t, M, R) => {
-              const i = B(e, t.value, M);
-              return /* @__PURE__ */ r(
-                j,
-                {
-                  id: i,
-                  value: u,
-                  state: s,
-                  choice: t,
-                  choices: R,
-                  children: ({ focused: b, hovered: H, checked: n, state: L }) => /* @__PURE__ */ c("div", { className: o.Label, children: [
-                    /* @__PURE__ */ r(
-                      V,
-                      {
-                        type: "radio",
-                        size: v,
-                        state: L,
-                        checked: n,
-                        focused: b,
-                        hovered: H,
-                        disabled: a
-                      }
-                    ),
-                    /* @__PURE__ */ r(
-                      F,
-                      {
-                        type: "radio",
-                        id: i,
-                        value: t.value,
-                        name: e,
-                        checked: n,
-                        disabled: a,
-                        onChange: (J, N) => w(t.value, N),
-                        onFocus: x,
-                        onBlur: E
-                      }
-                    ),
-                    /* @__PURE__ */ r(I, { text: t.label, size: z, checked: n })
-                  ] })
-                },
-                i
-              );
-            })
-          }
-        ),
-        /* @__PURE__ */ r(k, { name: "message", condition: s === "error" && !!m, children: /* @__PURE__ */ r(y, { text: m, className: o.ErrorMessage }) })
-      ]
-    }
-  );
+  const { emitChange: y, handleFocus: E, handleBlur: M } = q({
+    id: t,
+    disabled: n,
+    onChange: h,
+    onFocus: v,
+    onBlur: L
+  }), _ = g(p, "data-testid", "radio"), R = e != null && e !== !1 && e !== "";
+  return /* @__PURE__ */ u("div", { "data-testid": _, className: f(o.Radio, { [o.WithLabel]: R }, g(p, "className")), children: [
+    U(e, _),
+    /* @__PURE__ */ r(
+      "div",
+      {
+        className: f(o.Content, {
+          [o.Horizontal]: l === "horizontal",
+          [o.Vertical]: l === "vertical"
+        }),
+        children: C.map((i, H, N) => {
+          const s = T(t, i.value, H);
+          return /* @__PURE__ */ r(P, { id: s, value: a, state: d, choice: i, choices: N, children: ({ focused: b, hovered: I, checked: m, state: V }) => /* @__PURE__ */ u("div", { className: o.Label, children: [
+            /* @__PURE__ */ r(
+              j,
+              {
+                type: "radio",
+                size: z,
+                state: V,
+                checked: m,
+                focused: b,
+                hovered: I,
+                disabled: n
+              }
+            ),
+            /* @__PURE__ */ r(
+              w,
+              {
+                type: "radio",
+                id: s,
+                value: i.value,
+                name: t,
+                checked: m,
+                disabled: n,
+                onChange: (X, W) => y(i.value, W),
+                onFocus: E,
+                onBlur: M
+              }
+            ),
+            /* @__PURE__ */ r(F, { text: i.label, size: x, checked: m })
+          ] }) }, s);
+        })
+      }
+    ),
+    /* @__PURE__ */ r($, { name: "message", condition: d === "error" && !!c, children: /* @__PURE__ */ r(B, { text: c, className: o.ErrorMessage }) })
+  ] });
 };
 export {
-  ar as Radio
+  ct as Radio
 };

package/dist/controls/interactives/text-field/text-field.component.js

@@ -10,6 +10,7 @@ import { ErrorMessage as k } from "../../primitives/error-message/error-message.
 import { Label as C } from "../../primitives/label/label.component.js";
 import "react";
 import { Input as j } from "../input/input.component.js";
+import "../../../components/text/text.component.js";
 import '../../../assets/text-field-ycFvAkxr.css';const D = "_TextField_diews_1", O = "_Box_diews_10", q = "_Content_diews_14", y = "_Label_diews_30", z = "_Idle_diews_40", G = "_Active_diews_45", H = "_Placeholder_diews_50", J = "_PlaceholderText_diews_57", K = "_ErrorMessage_diews_65", Q = "_Input_diews_69", R = "_MaskStart_diews_73", e = {
   TextField: D,
   Box: O,
@@ -22,7 +23,7 @@ import '../../../assets/text-field-ycFvAkxr.css';const D = "_TextField_diews_1",
   ErrorMessage: K,
   Input: Q,
   MaskStart: R
-}, le = ({
+}, ie = ({
   // Interactive props
   id: d,
   value: s = "",
@@ -38,9 +39,9 @@ import '../../../assets/text-field-ycFvAkxr.css';const D = "_TextField_diews_1",
   message: m = "",
   placeholder: _ = "",
   // Base props
-  ...x
+  ...p
 }) => {
-  const { value: p, setTrue: T, setFalse: A } = f(!1), { value: a, setTrue: S, setFalse: b } = f(!1), r = a || !!s || p, B = !i && !!_ && a && !s && !p, N = !!m && l === "error", g = (o) => {
+  const { value: x, setTrue: T, setFalse: A } = f(!1), { value: a, setTrue: S, setFalse: b } = f(!1), r = a || !!s || x, B = !i && !!_ && a && !s && !x, N = !!m && l === "error", g = (o) => {
     S(), I?.(o);
   }, E = (o) => {
     b(), F?.(o);
@@ -48,8 +49,8 @@ import '../../../assets/text-field-ycFvAkxr.css';const D = "_TextField_diews_1",
   return /* @__PURE__ */ n(
     "div",
     {
-      "data-testid": u(x, "data-testid", "text-field"),
-      className: c(e.TextField, u(x, "className")),
+      "data-testid": u(p, "data-testid", "text-field"),
+      className: c(e.TextField, u(p, "className")),
       children: [
         /* @__PURE__ */ n($, { state: l, focused: a, className: e.Box, children: [
           /* @__PURE__ */ t(
@@ -101,5 +102,5 @@ import '../../../assets/text-field-ycFvAkxr.css';const D = "_TextField_diews_1",
   );
 };
 export {
-  le as TextField
+  ie as TextField
 };

package/package.json

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

package/dist/assets/radio-VoXwCoAp.css

@@ -1 +0,0 @@
-._Radio_rt0wk_1{display:inline-flex;flex-direction:column}._Content_rt0wk_6{display:inline-flex}._Horizontal_rt0wk_10{flex-direction:row;gap:var(--rm-ui-padding-lg)}._Vertical_rt0wk_15{flex-direction:column;gap:var(--rm-ui-padding-xxs)}._Label_rt0wk_20{position:relative;display:inline-flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--rm-ui-padding-xs)}._Label_rt0wk_20:hover{cursor:pointer}._ErrorMessage_rt0wk_33{padding-top:var(--rm-ui-padding-xxs)}