@progress/kendo-react-inputs 9.0.0-develop.9 → 9.0.1-develop.1

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 (9) hide show
  1. package/dist/cdn/js/kendo-react-inputs.js +1 -1
  2. package/index.d.mts +20 -86
  3. package/index.d.ts +20 -86
  4. package/index.js +1 -1
  5. package/index.mjs +65 -66
  6. package/input/Input.js +1 -1
  7. package/input/Input.mjs +144 -183
  8. package/package-metadata.mjs +1 -1
  9. package/package.json +9 -9
package/input/Input.mjs CHANGED
@@ -6,196 +6,157 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as o from "react";
10
- import i from "prop-types";
11
- import { validatePackage as C, classNames as M, uInput as S, createPropsContext as I, withIdHOC as L, withPropsContext as V, withUnstyledHOC as N } from "@progress/kendo-react-common";
12
- import { FloatingLabel as P } from "@progress/kendo-react-labels";
13
- import { packageMetadata as D } from "../package-metadata.mjs";
14
- const s = class s extends o.Component {
15
- constructor(e) {
16
- super(e), this._input = null, this.focus = () => {
17
- this._input && this._input.focus();
18
- }, this.isInvalid = (t) => {
19
- let a = !1;
20
- for (const l in t)
21
- t.hasOwnProperty(l) && (a = a || !!t[l]);
22
- return a;
23
- }, this.setValidity = () => {
24
- this._input && this._input.setCustomValidity && (this.validity.valid || !this.validityStyles ? this._input.classList.remove("k-invalid") : this._input.classList.add("k-invalid"), this._input.setCustomValidity(this.validity.valid ? "" : this.props.validationMessage || ""));
25
- }, this.handleChange = (t) => {
26
- this.setState({
27
- value: t.target.value
28
- }), this.valueDuringOnChange = t.target.value, this.props.onChange && this.props.onChange.call(void 0, {
29
- syntheticEvent: t,
30
- nativeEvent: t.nativeEvent,
31
- value: t.target.value,
32
- target: this
33
- }), this.valueDuringOnChange = void 0;
34
- }, this.handleAutoFill = (t) => {
35
- if (t.animationName === "autoFillStart") {
36
- const a = t.target.parentNode;
37
- a && a.classList.contains("k-empty") && a.classList.remove("k-empty");
38
- }
39
- }, C(D), this.state = {
40
- value: this.props.defaultValue || s.defaultProps.defaultValue
41
- };
42
- }
43
- get _inputId() {
44
- return this.props.id;
45
- }
46
- /**
47
- * Gets the native input element of the Input component.
48
- */
49
- get element() {
50
- return this._input;
51
- }
52
- /**
53
- * Gets the value of the Input.
54
- */
55
- get value() {
56
- return this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
57
- }
58
- /**
59
- * Gets the `name` property of the Input.
60
- */
61
- get name() {
62
- return this.props.name;
63
- }
64
- /**
65
- * Represents the validity state into which the Input is set.
66
- */
67
- get validity() {
68
- const e = {
69
- badInput: this._input ? this._input.validity.badInput : !1,
70
- patternMismatch: this._input ? this._input.validity.patternMismatch : !1,
71
- rangeOverflow: this._input ? this._input.validity.rangeOverflow : !1,
72
- rangeUnderflow: this._input ? this._input.validity.rangeUnderflow : !1,
73
- stepMismatch: this._input ? this._input.validity.stepMismatch : !1,
74
- tooLong: this._input ? this._input.validity.tooLong : !1,
75
- typeMismatch: this._input ? this._input.validity.typeMismatch : !1,
76
- valueMissing: this._input ? this._input.validity.valueMissing : !1
9
+ import * as r from "react";
10
+ import a from "prop-types";
11
+ import { validatePackage as J, applyDefaultProps as Q, useUnstyled as W, useId as X, classNames as Y, uInput as Z, createPropsContext as _ } from "@progress/kendo-react-common";
12
+ import { FloatingLabel as $ } from "@progress/kendo-react-labels";
13
+ import { packageMetadata as ee } from "../package-metadata.mjs";
14
+ const I = r.forwardRef((L, M) => {
15
+ const P = r.useContext(te).call(void 0, L);
16
+ J(ee);
17
+ const [, x] = r.useReducer((t) => t, !0), i = Q(P, ae), {
18
+ className: E,
19
+ label: o,
20
+ labelClassName: N,
21
+ id: k,
22
+ validationMessage: v,
23
+ defaultValue: R,
24
+ valid: p,
25
+ unstyled: f,
26
+ // Removed to support direct use in Form Field component
27
+ visited: ie,
28
+ touched: ne,
29
+ modified: se,
30
+ autoFocus: V,
31
+ ariaLabelledBy: w,
32
+ ariaDescribedBy: F,
33
+ validityStyles: m,
34
+ style: y,
35
+ ariaLabel: U,
36
+ ...B
37
+ } = i, D = W(), g = f || D, O = g && g.uInput, S = X(), [T, q] = r.useState({
38
+ value: R
39
+ }), b = k || S, e = r.useRef(null), s = r.useRef(void 0), u = r.useRef(null), A = () => {
40
+ e.current && e.current.focus();
41
+ }, c = () => s.current !== void 0 ? s.current : i.value !== void 0 ? i.value : T.value, l = () => {
42
+ const t = {
43
+ badInput: e.current ? e.current.validity.badInput : !1,
44
+ patternMismatch: e.current ? e.current.validity.patternMismatch : !1,
45
+ rangeOverflow: e.current ? e.current.validity.rangeOverflow : !1,
46
+ rangeUnderflow: e.current ? e.current.validity.rangeUnderflow : !1,
47
+ stepMismatch: e.current ? e.current.validity.stepMismatch : !1,
48
+ tooLong: e.current ? e.current.validity.tooLong : !1,
49
+ typeMismatch: e.current ? e.current.validity.typeMismatch : !1,
50
+ valueMissing: e.current ? e.current.validity.valueMissing : !1
77
51
  };
78
52
  return {
79
- ...e,
80
- customError: this.props.validationMessage !== void 0,
81
- valid: this.props.valid !== void 0 ? this.props.valid : this._input ? !this.isInvalid(e) : !0
53
+ ...t,
54
+ customError: v !== void 0,
55
+ valid: p !== void 0 ? p : e.current ? !G(t) : !0
82
56
  };
83
- }
84
- /**
85
- * @hidden
86
- */
87
- get validityStyles() {
88
- return this.props.validityStyles !== void 0 ? this.props.validityStyles : s.defaultProps.validityStyles;
89
- }
90
- /**
91
- * @hidden
92
- */
93
- componentDidMount() {
94
- this.forceUpdate();
95
- }
96
- /**
97
- * @hidden
98
- */
99
- componentDidUpdate() {
100
- this.setValidity();
101
- }
102
- /**
103
- * @hidden
104
- */
105
- render() {
106
- const {
107
- className: e,
108
- label: t,
109
- labelClassName: a,
110
- id: l,
111
- validationMessage: F,
112
- defaultValue: k,
113
- valid: E,
114
- unstyled: r,
115
- // Removed to support direct use in Form Field component
116
- visited: B,
117
- touched: U,
118
- modified: x,
119
- autoFocus: c,
120
- ariaLabelledBy: y,
121
- ariaDescribedBy: g,
122
- validityStyles: A,
123
- style: u,
124
- ariaLabel: m,
125
- ...n
126
- } = this.props, h = l || this._inputId, d = !this.validityStyles || this.validity.valid, f = r && r.uInput, b = M(
127
- e,
128
- S.input({
129
- c: f,
130
- invalid: !d,
131
- disabled: this.props.disabled
132
- })
133
- ), v = /* @__PURE__ */ o.createElement(
134
- "input",
135
- {
136
- "aria-labelledby": y,
137
- "aria-describedby": g,
138
- "aria-disabled": this.props.disabled || void 0,
139
- "aria-invalid": !d || void 0,
140
- "aria-label": m || void 0,
141
- ...n,
142
- style: t ? void 0 : u,
143
- value: this.value,
144
- id: h,
145
- autoFocus: c,
146
- className: b,
147
- onChange: this.handleChange,
148
- onAnimationStart: this.handleAutoFill,
149
- ref: (_) => {
150
- this._input = _;
151
- }
152
- }
153
- );
154
- return t ? /* @__PURE__ */ o.createElement(
155
- P,
156
- {
157
- label: t,
158
- labelClassName: a,
159
- editorId: h,
160
- editorValue: String(this.value),
161
- editorValid: d,
162
- editorDisabled: n.disabled,
163
- editorPlaceholder: n.placeholder,
164
- children: v,
165
- style: u,
166
- dir: n.dir,
167
- unstyled: r
168
- }
169
- ) : v;
170
- }
171
- };
172
- s.displayName = "Input", s.propTypes = {
173
- label: i.string,
174
- labelClassName: i.string,
175
- validationMessage: i.string,
176
- required: i.bool,
177
- validate: i.bool,
178
- id: i.string,
179
- ariaLabelledBy: i.string,
180
- ariaDescribedBy: i.string,
181
- ariaLabel: i.string,
182
- autoFocus: i.bool
183
- }, s.defaultProps = {
57
+ };
58
+ r.useImperativeHandle(u, () => ({
59
+ element: e.current,
60
+ props: i,
61
+ get value() {
62
+ return c();
63
+ },
64
+ name: i.name,
65
+ get validity() {
66
+ return l();
67
+ },
68
+ focus: A
69
+ })), r.useImperativeHandle(M, () => u.current);
70
+ const G = (t) => {
71
+ let n = !1;
72
+ for (const C in t)
73
+ t.hasOwnProperty(C) && (n = n || !!t[C]);
74
+ return n;
75
+ }, d = !m || l().valid, H = Y(
76
+ E,
77
+ Z.input({
78
+ c: O,
79
+ invalid: !d,
80
+ disabled: i.disabled
81
+ })
82
+ ), K = () => {
83
+ e.current && e.current.setCustomValidity && (l().valid || !m ? e.current.classList.remove("k-invalid") : e.current.classList.add("k-invalid"), e.current.setCustomValidity(l().valid ? "" : v || ""));
84
+ }, j = (t) => {
85
+ q({
86
+ value: t.target.value
87
+ }), s.current = t.target.value, i.onChange && i.onChange.call(void 0, {
88
+ syntheticEvent: t,
89
+ nativeEvent: t.nativeEvent,
90
+ value: t.target.value,
91
+ target: u.current
92
+ }), s.current = void 0;
93
+ }, z = (t) => {
94
+ if (t.animationName === "autoFillStart") {
95
+ const n = t.target.parentNode;
96
+ n && n.classList.contains("k-empty") && n.classList.remove("k-empty");
97
+ }
98
+ };
99
+ r.useEffect(() => {
100
+ x();
101
+ }, []), r.useEffect(() => {
102
+ K();
103
+ });
104
+ const h = /* @__PURE__ */ r.createElement(
105
+ "input",
106
+ {
107
+ "aria-labelledby": w,
108
+ "aria-describedby": F,
109
+ "aria-disabled": i.disabled || void 0,
110
+ "aria-invalid": !d || void 0,
111
+ "aria-label": U || void 0,
112
+ ...B,
113
+ style: o ? void 0 : y,
114
+ value: c(),
115
+ id: b,
116
+ autoFocus: V,
117
+ className: H,
118
+ onChange: j,
119
+ onAnimationStart: z,
120
+ ref: e
121
+ }
122
+ );
123
+ return o ? /* @__PURE__ */ r.createElement(
124
+ $,
125
+ {
126
+ label: o,
127
+ labelClassName: N,
128
+ editorId: b,
129
+ editorValue: String(c()),
130
+ editorValid: d,
131
+ editorDisabled: i.disabled,
132
+ editorPlaceholder: i.placeholder,
133
+ children: h,
134
+ style: y,
135
+ dir: i.dir,
136
+ unstyled: f
137
+ }
138
+ ) : h;
139
+ }), te = _(), ae = {
184
140
  defaultValue: "",
185
141
  required: !1,
186
142
  validityStyles: !0,
187
143
  autoFocus: !1
188
144
  };
189
- let p = s;
190
- const O = I(), w = L(
191
- V(
192
- O,
193
- N(p)
194
- )
195
- );
196
- w.displayName = "KendoReactInput";
145
+ I.displayName = "KendoReactInput";
146
+ I.propTypes = {
147
+ label: a.string,
148
+ labelClassName: a.string,
149
+ validationMessage: a.string,
150
+ required: a.bool,
151
+ validate: a.bool,
152
+ id: a.string,
153
+ ariaLabelledBy: a.string,
154
+ ariaDescribedBy: a.string,
155
+ ariaLabel: a.string,
156
+ autoFocus: a.bool,
157
+ value: a.oneOfType([a.string, a.number, a.array])
158
+ };
197
159
  export {
198
- w as Input,
199
- O as InputPropsContext,
200
- p as InputWithoutContext
160
+ I as Input,
161
+ te as InputPropsContext
201
162
  };
package/package-metadata.mjs CHANGED
@@ -10,7 +10,7 @@ const e = {
10
10
  name: "@progress/kendo-react-inputs",
11
11
  productName: "KendoReact",
12
12
  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
13
- publishDate: 1730208241,
13
+ publishDate: 1731421782,
14
14
  version: "",
15
15
  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
16
16
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-react-inputs",
3
- "version": "9.0.0-develop.9",
3
+ "version": "9.0.1-develop.1",
4
4
  "description": "React Inputs offer a customizable interface for users to enter and pick different information. KendoReact Input package",
5
5
  "author": "Progress",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -25,14 +25,14 @@
25
25
  "@progress/kendo-drawing": "^1.21.1",
26
26
  "@progress/kendo-inputs-common": "^3.1.0",
27
27
  "@progress/kendo-licensing": "^1.3.4",
28
- "@progress/kendo-react-animation": "9.0.0-develop.9",
29
- "@progress/kendo-react-buttons": "9.0.0-develop.9",
30
- "@progress/kendo-react-common": "9.0.0-develop.9",
31
- "@progress/kendo-react-dialogs": "9.0.0-develop.9",
32
- "@progress/kendo-react-intl": "9.0.0-develop.9",
33
- "@progress/kendo-react-labels": "9.0.0-develop.9",
34
- "@progress/kendo-react-popup": "9.0.0-develop.9",
35
- "@progress/kendo-svg-icons": "^3.0.0",
28
+ "@progress/kendo-react-animation": "9.0.1-develop.1",
29
+ "@progress/kendo-react-buttons": "9.0.1-develop.1",
30
+ "@progress/kendo-react-common": "9.0.1-develop.1",
31
+ "@progress/kendo-react-dialogs": "9.0.1-develop.1",
32
+ "@progress/kendo-react-intl": "9.0.1-develop.1",
33
+ "@progress/kendo-react-labels": "9.0.1-develop.1",
34
+ "@progress/kendo-react-popup": "9.0.1-develop.1",
35
+ "@progress/kendo-svg-icons": "^4.0.0",
36
36
  "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
37
37
  "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"
38
38
  },