@hortiview/shared-components 0.0.11589 → 0.0.11747

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 (3) hide show
  1. package/dist/components/FormComponents/FormText/FormText.js +96 -106
  2. package/dist/components/FormComponents/FormText/FormText.test.js +7 -40
  3. package/package.json +1 -1
package/dist/components/FormComponents/FormText/FormText.js CHANGED
@@ -1,140 +1,130 @@
1
- import { jsx as t, Fragment as F, jsxs as D } from "react/jsx-runtime";
2
- import { T as G } from "../../../index.es-25EARqhH.js";
3
- import { a as I } from "../../../index.es-CF_xy2ns.js";
4
- import { g as J } from "../../../get-DFv1gXfq.js";
5
- import { useState as q, useCallback as K, useMemo as T, useEffect as O } from "react";
6
- import { useFormContext as Q, Controller as H } from "react-hook-form";
7
- import { useHelperText as U } from "../../../hooks/useHelperText.js";
8
- import '../../../assets/FormText.css';const X = "_formTextAreaHelperText_168p8_1", Y = "_invalid_168p8_7", Z = "_required_168p8_11", N = "_formTextArea_168p8_1", y = "_characterCount_168p8_25", p = "_withoutCharacterCount_168p8_31", n = {
9
- formTextAreaHelperText: X,
10
- invalid: Y,
11
- required: Z,
12
- formTextArea: N,
13
- characterCount: y,
14
- withoutCharacterCount: p
15
- }, ee = ({
1
+ import { jsx as t, Fragment as v, jsxs as z } from "react/jsx-runtime";
2
+ import { T as M } from "../../../index.es-25EARqhH.js";
3
+ import { a as P } from "../../../index.es-CF_xy2ns.js";
4
+ import { useState as V, useCallback as W, useMemo as m } from "react";
5
+ import { useFormContext as D, Controller as _ } from "react-hook-form";
6
+ import { useHelperText as E } from "../../../hooks/useHelperText.js";
7
+ import '../../../assets/FormText.css';const G = "_formTextAreaHelperText_168p8_1", I = "_invalid_168p8_7", J = "_required_168p8_11", K = "_formTextArea_168p8_1", O = "_characterCount_168p8_25", Q = "_withoutCharacterCount_168p8_31", r = {
8
+ formTextAreaHelperText: G,
9
+ invalid: I,
10
+ required: J,
11
+ formTextArea: K,
12
+ characterCount: O,
13
+ withoutCharacterCount: Q
14
+ }, U = ({
16
15
  count: e,
17
- maxCount: s,
18
- invalid: u = !1,
19
- hasRequiredText: r = !1
16
+ maxCount: u,
17
+ invalid: s = !1,
18
+ hasRequiredText: n = !1
20
19
  }) => /* @__PURE__ */ t(
21
20
  "div",
22
21
  {
23
22
  "data-testid": "character-counter-container",
24
- className: `${n.formTextAreaHelperText} ${u ? n.invalid : ""} ${r ? n.required : ""}`,
25
- children: /* @__PURE__ */ t(I, { children: `${e}/${s}` })
23
+ className: `${r.formTextAreaHelperText} ${s ? r.invalid : ""} ${n ? r.required : ""}`,
24
+ children: /* @__PURE__ */ t(P, { children: `${e}/${u}` })
26
25
  }
27
- ), ue = (e) => e.textarea ? /* @__PURE__ */ t(te, { ...e }) : /* @__PURE__ */ t(re, { ...e }), te = (e) => /* @__PURE__ */ t("div", { "data-testid": "form-text-area", className: n.formTextArea, children: /* @__PURE__ */ t(L, { ...e }) }), re = (e) => /* @__PURE__ */ t(
26
+ ), re = (e) => e.textarea ? /* @__PURE__ */ t(X, { ...e }) : /* @__PURE__ */ t(Y, { ...e }), X = (e) => /* @__PURE__ */ t("div", { "data-testid": "form-text-area", className: r.formTextArea, children: /* @__PURE__ */ t(A, { ...e }) }), Y = (e) => /* @__PURE__ */ t(
28
27
  "div",
29
28
  {
30
29
  "data-testid": "form-text-field",
31
- className: `${e.hasCharacterCount ? n.characterCount : n.withoutCharacterCount}`,
32
- children: /* @__PURE__ */ t(L, { ...e })
30
+ className: `${e.hasCharacterCount ? r.characterCount : r.withoutCharacterCount}`,
31
+ children: /* @__PURE__ */ t(A, { ...e })
33
32
  }
34
- ), L = ({
33
+ ), A = ({
35
34
  propertyName: e,
36
- label: s,
37
- disabled: u = !1,
38
- textarea: r = !1,
39
- hasCharacterCount: c = !1,
40
- hidden: w = !1,
41
- placeholder: B,
42
- type: S,
43
- prefixText: j,
44
- inputMode: k,
45
- trailingIcon: R,
46
- trigger: C = "likeForm",
35
+ label: u,
36
+ disabled: s = !1,
37
+ textarea: n = !1,
38
+ hasCharacterCount: o = !1,
39
+ hidden: $ = !1,
40
+ placeholder: F,
41
+ type: q,
42
+ prefixText: H,
43
+ inputMode: L,
44
+ trailingIcon: w,
45
+ trigger: x = "likeForm",
47
46
  rules: a,
48
47
  ...i
49
48
  }) => {
50
- const { control: g, getFieldState: d, trigger: v } = Q(), [b, m] = q(0), [o, z] = q(), f = K(
49
+ const { control: f, getFieldState: d, trigger: T } = D(), [B, C] = V(0), S = W(
51
50
  (h) => {
52
- if (o != null) {
53
- m(o.length);
54
- return;
51
+ if (!(!n && !o)) {
52
+ if (h) {
53
+ C(h.length);
54
+ return;
55
+ }
56
+ C(0);
55
57
  }
56
- if (h) {
57
- m(h.length);
58
- return;
59
- }
60
- m(0);
61
58
  },
62
- [o]
63
- ), l = T(
64
- () => i.maxlength ?? a?.maxLength?.value,
59
+ [o, n]
60
+ ), l = m(
61
+ () => i.maxlength ? i.maxlength : a?.maxLength?.value,
65
62
  [a, i.maxlength]
66
- ), E = T(
63
+ ), j = m(
67
64
  () => a?.minLength?.value,
68
65
  [a]
69
- ), _ = T(
66
+ ), g = m(
70
67
  () => a?.required?.message,
71
68
  [a]
72
- ), { helperText: M, helperTextPersistent: P } = U({
69
+ ), { helperText: k, helperTextPersistent: R } = E({
73
70
  propertyName: e,
74
71
  helperText: i.helperText,
75
- requiredText: _,
72
+ requiredText: g,
76
73
  maxLength: l,
77
- hasCharacterCount: r || c
74
+ hasCharacterCount: n || o
78
75
  });
79
- return O(() => {
80
- (r || c) && l !== void 0 && o != null && f();
81
- }, [o, r, c, l, f]), w ? /* @__PURE__ */ t(H, { name: e, control: g, render: () => /* @__PURE__ */ t(F, {}) }) : /* @__PURE__ */ t(
82
- H,
76
+ return $ ? /* @__PURE__ */ t(_, { name: e, control: f, render: () => /* @__PURE__ */ t(v, {}) }) : /* @__PURE__ */ t(
77
+ _,
83
78
  {
84
79
  name: e,
85
80
  rules: a,
86
- control: g,
87
- render: ({ field: { ref: h, ...x }, formState: { defaultValues: V } }) => {
88
- const A = J(V, e);
89
- return !o && A && (c || r) && f(A), /* @__PURE__ */ D(F, { children: [
90
- /* @__PURE__ */ t(
91
- G,
92
- {
93
- ...i,
94
- ...x,
95
- value: x.value ?? "",
96
- type: S,
97
- fullWidth: !0,
98
- "data-testid": `textfield-${e}`,
99
- inputMode: k,
100
- placeholder: B,
101
- prefixText: j,
102
- disabled: u,
103
- helperText: M,
104
- helperTextPersistent: P,
105
- label: s,
106
- variant: "outlined",
107
- maxlength: l,
108
- minLength: E,
109
- textarea: r,
110
- noResize: !1,
111
- onBlur: () => {
112
- C === "onBlur" && v(e), i.onBlur?.();
113
- },
114
- onChange: ($) => {
115
- x.onChange($);
116
- const W = $?.target?.value;
117
- z(W), C === "onChange" && v(e);
118
- },
119
- valid: !d(e).invalid,
120
- className: `${n.formText} ${d(e).invalid ? n.invalid : ""}`,
121
- trailingIcon: R
122
- }
123
- ),
124
- l !== void 0 && (c || r) && /* @__PURE__ */ t(
125
- ee,
126
- {
127
- count: b,
128
- maxCount: l,
129
- invalid: d(e).invalid,
130
- hasRequiredText: !!i.helperText || !!_
131
- }
132
- )
133
- ] });
134
- }
81
+ control: f,
82
+ render: ({ field: { ref: h, ...c } }) => (S(c.value), /* @__PURE__ */ z(v, { children: [
83
+ /* @__PURE__ */ t(
84
+ M,
85
+ {
86
+ ...i,
87
+ ...c,
88
+ value: c.value ?? "",
89
+ type: q,
90
+ fullWidth: !0,
91
+ "data-testid": `textfield-${e}`,
92
+ inputMode: L,
93
+ placeholder: F,
94
+ prefixText: H,
95
+ disabled: s,
96
+ helperText: k,
97
+ helperTextPersistent: R,
98
+ label: u,
99
+ variant: "outlined",
100
+ maxlength: l,
101
+ minLength: j,
102
+ textarea: n,
103
+ noResize: !1,
104
+ onBlur: () => {
105
+ x === "onBlur" && T(e), i.onBlur?.();
106
+ },
107
+ onChange: (b) => {
108
+ c.onChange(b), x === "onChange" && T(e);
109
+ },
110
+ valid: !d(e).invalid,
111
+ className: `${r.formText} ${d(e).invalid ? r.invalid : ""}`,
112
+ trailingIcon: w
113
+ }
114
+ ),
115
+ l !== void 0 && (o || n) && /* @__PURE__ */ t(
116
+ U,
117
+ {
118
+ count: B,
119
+ maxCount: l,
120
+ invalid: d(e).invalid,
121
+ hasRequiredText: !!i.helperText || !!g
122
+ }
123
+ )
124
+ ] }))
135
125
  }
136
126
  );
137
127
  };
138
128
  export {
139
- ue as FormText
129
+ re as FormText
140
130
  };
package/dist/components/FormComponents/FormText/FormText.test.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { jsx as n } from "react/jsx-runtime";
2
- import { a as s, s as r, f as d } from "../../../react.esm-DNwojocF.js";
2
+ import { a as s, s as r, f as i } from "../../../react.esm-DNwojocF.js";
3
3
  import { FormText as o } from "./FormText.js";
4
4
  import { v as a, d as u, t as l, g as e } from "../../../vi.CjhMlMwf-BCJNwXvu.js";
5
- const m = a.fn();
5
+ const d = a.fn();
6
6
  a.mock("react-hook-form", () => ({
7
7
  ...a.importActual("react-hook-form"),
8
8
  Controller: ({
@@ -10,7 +10,7 @@ a.mock("react-hook-form", () => ({
10
10
  }) => t({
11
11
  field: {
12
12
  ref: void 0,
13
- onChange: m,
13
+ onChange: d,
14
14
  value: "test"
15
15
  },
16
16
  formState: { defaultValue: {} }
@@ -62,23 +62,9 @@ u("FormText Test", () => {
62
62
  const t = r.getByRole("textbox");
63
63
  e(t).toBeInTheDocument(), e(t).toBeInstanceOf(HTMLInputElement), e(t).toHaveAttribute("maxlength", "100"), e(r.getByText("address.line2")).toBeInTheDocument();
64
64
  }), l("change value of single line text field", () => {
65
- s(
66
- /* @__PURE__ */ n(
67
- o,
68
- {
69
- rules: {
70
- maxLength: {
71
- value: 100,
72
- message: "max length is 100"
73
- }
74
- },
75
- label: "address.line2",
76
- propertyName: "addressLine2"
77
- }
78
- )
79
- );
65
+ s(/* @__PURE__ */ n(o, { label: "address.line2", propertyName: "addressLine2" }));
80
66
  const t = r.getByRole("textbox");
81
- e(t).toHaveValue("test"), d.change(t, { target: { value: "test-change" } }), e(m).toHaveBeenCalled();
67
+ e(t).toHaveValue("test"), i.change(t, { target: { value: "test-change" } }), e(d).toHaveBeenCalled();
82
68
  }), l("render FormText and return text area", () => {
83
69
  s(
84
70
  /* @__PURE__ */ n(
@@ -103,22 +89,7 @@ u("FormText Test", () => {
103
89
  const t = r.getByRole("textbox");
104
90
  e(t).toBeInTheDocument(), e(t).toBeInstanceOf(HTMLTextAreaElement), e(t).toHaveAttribute("maxlength", "200"), e(r.getByText("address.line1")).toBeInTheDocument(), e(r.getByText("required")).toBeInTheDocument();
105
91
  }), l("render FormText with maxLength indicator", () => {
106
- s(
107
- /* @__PURE__ */ n(
108
- o,
109
- {
110
- rules: {
111
- maxLength: {
112
- value: 200,
113
- message: "max length is 200"
114
- }
115
- },
116
- label: "address.line1",
117
- propertyName: "addressLine1",
118
- textarea: !0
119
- }
120
- )
121
- ), e(r.getByText("address.line1")).toBeInTheDocument(), e(r.queryByText("required")).not.toBeInTheDocument(), e(r.getByText("0/200")).toBeInTheDocument();
92
+ s(/* @__PURE__ */ n(o, { maxlength: 200, label: "address.line1", propertyName: "addressLine1", textarea: !0 })), e(r.getByText("address.line1")).toBeInTheDocument(), e(r.queryByText("required")).not.toBeInTheDocument(), e(r.getByText("4/200")).toBeInTheDocument();
122
93
  }), l("change value of text area", () => {
123
94
  s(
124
95
  /* @__PURE__ */ n(
@@ -128,10 +99,6 @@ u("FormText Test", () => {
128
99
  required: {
129
100
  value: !0,
130
101
  message: "required"
131
- },
132
- maxLength: {
133
- value: 200,
134
- message: "max length is 200"
135
102
  }
136
103
  },
137
104
  label: "address.line1",
@@ -141,6 +108,6 @@ u("FormText Test", () => {
141
108
  )
142
109
  );
143
110
  const t = r.getByRole("textbox");
144
- d.change(t, { target: { value: "test-change" } }), e(m).toHaveBeenCalled();
111
+ i.change(t, { target: { value: "test-change" } }), e(d).toHaveBeenCalled();
145
112
  });
146
113
  });
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@hortiview/shared-components",
3
3
  "description": "This is a shared component library. It should used in the HortiView platform and its modules.",
4
- "version": "0.0.11589",
4
+ "version": "0.0.11747",
5
5
  "type": "module",
6
6
  "repository": "https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared",
7
7
  "author": "Falk Menge <falk.menge.ext@bayer.com>",