@arthurzakharov/ui-kit 1.8.5 → 1.8.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/assets/text-field-ycFvAkxr.css +1 -0
  2. package/dist/controls/interactives/text-field/text-field.component.js +49 -48
  3. package/package.json +1 -1
  4. package/dist/assets/text-field-CMQWxQpy.css +0 -1
package/dist/assets/text-field-ycFvAkxr.css ADDED
@@ -0,0 +1 @@
1
+ ._TextField_diews_1{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;gap:var(--rm-ui-padding-xxs)}._Box_diews_10{position:relative}._Content_diews_14{box-sizing:border-box;position:relative;flex-grow:1;height:58px;padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm) calc(var(--rm-ui-padding-xs) - 2px) var(--rm-ui-padding-sm);display:flex;flex-direction:row;justify-content:stretch;align-items:flex-end}._Content_diews_14:hover{cursor:pointer}._Label_diews_30{position:absolute;left:var(--rm-ui-padding-sm);transition:top var(--rm-ui-amimation-speed-primary) var(--rm-ui-amimation-cubic-primary)}._Label_diews_30:hover{cursor:pointer}._Idle_diews_40{top:50%;transform:translateY(-50%)}._Active_diews_45{top:var(--rm-ui-padding-xs);transform:translateY(0)}._Placeholder_diews_50{position:absolute;z-index:1;bottom:var(--rm-ui-padding-xs);left:var(--rm-ui-padding-sm)}._PlaceholderText_diews_57{opacity:.75;font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);color:var(--rm-ui-color-text-secondary)}._ErrorMessage_diews_65{padding-left:var(--rm-ui-padding-sm)}._Input_diews_69{flex-grow:1}._MaskStart_diews_73{opacity:0}
package/dist/controls/interactives/text-field/text-field.component.js CHANGED
@@ -1,104 +1,105 @@
1
- import { jsxs as i, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as n, jsx as t } from "react/jsx-runtime";
2
2
  import c from "clsx";
3
- import { useBoolean as u } from "usehooks-ts";
4
- import { FadeScale as L } from "../../../animations/fade-scale/fade-scale.component.js";
5
- import { FadeSlide as k } from "../../../animations/fade-slide/fade-slide.component.js";
6
- import { Box as B } from "../../primitives/box/box.component.js";
3
+ import { useBoolean as f } from "usehooks-ts";
4
+ import { FadeScale as v } from "../../../animations/fade-scale/fade-scale.component.js";
5
+ import { FadeSlide as L } from "../../../animations/fade-slide/fade-slide.component.js";
6
+ import { Box as $ } from "../../primitives/box/box.component.js";
7
7
  import "react";
8
- import { baseProps as x } from "../../../utils/functions/functions.util.js";
8
+ import { baseProps as u } from "../../../utils/functions/functions.util.js";
9
9
  import "lucide-react";
10
- import { ErrorMessage as C } from "../../primitives/error-message/error-message.component.js";
11
- import { Label as $ } from "../../primitives/label/label.component.js";
12
- import { Input as w } from "../input/input.component.js";
13
- import '../../../assets/text-field-CMQWxQpy.css';const D = "_TextField_1jd9o_1", O = "_Content_1jd9o_11", q = "_Label_1jd9o_27", y = "_Idle_1jd9o_37", z = "_Active_1jd9o_42", G = "_Placeholder_1jd9o_47", H = "_PlaceholderText_1jd9o_54", J = "_ErrorMessage_1jd9o_62", K = "_Input_1jd9o_66", Q = "_MaskStart_1jd9o_70", e = {
10
+ import { ErrorMessage as k } from "../../primitives/error-message/error-message.component.js";
11
+ import { Label as C } from "../../primitives/label/label.component.js";
12
+ import { Input as j } from "../input/input.component.js";
13
+ 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 = {
14
14
  TextField: D,
15
- Content: O,
16
- Label: q,
17
- Idle: y,
18
- Active: z,
19
- Placeholder: G,
20
- PlaceholderText: H,
21
- ErrorMessage: J,
22
- Input: K,
23
- MaskStart: Q
24
- }, ae = ({
15
+ Box: O,
16
+ Content: q,
17
+ Label: y,
18
+ Idle: z,
19
+ Active: G,
20
+ Placeholder: H,
21
+ PlaceholderText: J,
22
+ ErrorMessage: K,
23
+ Input: Q,
24
+ MaskStart: R
25
+ }, le = ({
25
26
  // Interactive props
26
27
  id: d,
27
- value: r = "",
28
+ value: s = "",
28
29
  disabled: h = !1,
29
30
  state: l = "idle",
30
- onChange: I,
31
- onFocus: j,
31
+ onChange: w,
32
+ onFocus: I,
32
33
  onBlur: F,
33
34
  // Text props
34
- mask: n,
35
+ mask: i,
35
36
  maxLength: M = -1,
36
37
  label: P = "",
37
38
  message: m = "",
38
39
  placeholder: _ = "",
39
40
  // Base props
40
- ...p
41
+ ...x
41
42
  }) => {
42
- const { value: f, setTrue: T, setFalse: A } = u(!1), { value: s, setTrue: S, setFalse: b } = u(!1), a = s || !!r || f, g = !n && !!_ && s && !r && !f, E = !!m && l === "error", N = (o) => {
43
- S(), j?.(o);
44
- }, v = (o) => {
43
+ 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) => {
44
+ S(), I?.(o);
45
+ }, E = (o) => {
45
46
  b(), F?.(o);
46
47
  };
47
- return /* @__PURE__ */ i(
48
+ return /* @__PURE__ */ n(
48
49
  "div",
49
50
  {
50
- "data-testid": x(p, "data-testid", "text-field"),
51
- className: c(e.TextField, x(p, "className")),
51
+ "data-testid": u(x, "data-testid", "text-field"),
52
+ className: c(e.TextField, u(x, "className")),
52
53
  children: [
53
- /* @__PURE__ */ i(B, { state: l, focused: s, children: [
54
+ /* @__PURE__ */ n($, { state: l, focused: a, className: e.Box, children: [
54
55
  /* @__PURE__ */ t(
55
- $,
56
+ C,
56
57
  {
57
58
  "data-testid": "text-label",
58
59
  text: P,
59
- position: a ? "active" : "idle",
60
- state: a ? l : "idle",
61
- className: c(e.Label, a ? e.Active : e.Idle)
60
+ position: r ? "active" : "idle",
61
+ state: r ? l : "idle",
62
+ className: c(e.Label, r ? e.Active : e.Idle)
62
63
  }
63
64
  ),
64
- /* @__PURE__ */ i(
65
+ /* @__PURE__ */ n(
65
66
  "label",
66
67
  {
67
68
  htmlFor: d,
68
69
  className: e.Content,
69
70
  onPointerDown: (o) => {
70
- s && o.preventDefault();
71
+ a && o.preventDefault();
71
72
  },
72
73
  children: [
73
- /* @__PURE__ */ t(L, { name: "text-placeholder", condition: g, className: e.Placeholder, children: /* @__PURE__ */ t("span", { "data-testid": "text-placeholder", className: e.PlaceholderText, children: _ }) }),
74
+ /* @__PURE__ */ t(v, { name: "text-placeholder", condition: B, className: e.Placeholder, children: /* @__PURE__ */ t("span", { "data-testid": "text-placeholder", className: e.PlaceholderText, children: _ }) }),
74
75
  /* @__PURE__ */ t(
75
- w,
76
+ j,
76
77
  {
77
78
  "data-testid": "text-input",
78
- mask: n,
79
+ mask: i,
79
80
  maxLength: M,
80
81
  disabled: h,
81
82
  id: d,
82
- value: r,
83
+ value: s,
83
84
  className: c(e.Input, {
84
- [e.MaskStart]: n && r === "" && !a
85
+ [e.MaskStart]: i && s === "" && !r
85
86
  }),
86
87
  onAnimationStart: T,
87
88
  onAnimationEnd: A,
88
- onChange: I,
89
- onFocus: N,
90
- onBlur: v
89
+ onChange: w,
90
+ onFocus: g,
91
+ onBlur: E
91
92
  }
92
93
  )
93
94
  ]
94
95
  }
95
96
  )
96
97
  ] }),
97
- /* @__PURE__ */ t(k, { name: "text-message", direction: "ltr", condition: E, children: /* @__PURE__ */ t(C, { "data-testid": "text-error-message", text: m, className: e.ErrorMessage }) })
98
+ /* @__PURE__ */ t(L, { name: "text-message", direction: "ltr", condition: N, children: /* @__PURE__ */ t(k, { "data-testid": "text-error-message", text: m, className: e.ErrorMessage }) })
98
99
  ]
99
100
  }
100
101
  );
101
102
  };
102
103
  export {
103
- ae as TextField
104
+ le as TextField
104
105
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@arthurzakharov/ui-kit",
3
3
  "private": false,
4
- "version": "1.8.5",
4
+ "version": "1.8.6",
5
5
  "type": "module",
6
6
  "main": "dist/main.js",
7
7
  "types": "dist/main.d.ts",
package/dist/assets/text-field-CMQWxQpy.css DELETED
@@ -1 +0,0 @@
1
- ._TextField_1jd9o_1{position:relative;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;gap:var(--rm-ui-padding-xxs)}._Content_1jd9o_11{box-sizing:border-box;position:relative;flex-grow:1;height:58px;padding:var(--rm-ui-padding-xs) var(--rm-ui-padding-sm) calc(var(--rm-ui-padding-xs) - 2px) var(--rm-ui-padding-sm);display:flex;flex-direction:row;justify-content:stretch;align-items:flex-end}._Content_1jd9o_11:hover{cursor:pointer}._Label_1jd9o_27{position:absolute;left:var(--rm-ui-padding-sm);transition:top var(--rm-ui-amimation-speed-primary) var(--rm-ui-amimation-cubic-primary)}._Label_1jd9o_27:hover{cursor:pointer}._Idle_1jd9o_37{top:50%;transform:translateY(-50%)}._Active_1jd9o_42{top:var(--rm-ui-padding-xs);transform:translateY(0)}._Placeholder_1jd9o_47{position:absolute;z-index:1;bottom:var(--rm-ui-padding-xs);left:var(--rm-ui-padding-sm)}._PlaceholderText_1jd9o_54{opacity:.75;font-weight:var(--rm-ui-font-weight-regular);font-size:var(--rm-ui-font-size-body);line-height:var(--rm-ui-line-height-body);color:var(--rm-ui-color-text-secondary)}._ErrorMessage_1jd9o_62{padding-left:var(--rm-ui-padding-sm)}._Input_1jd9o_66{flex-grow:1}._MaskStart_1jd9o_70{opacity:0}