@progress/kendo-react-inputs 7.4.0 → 7.5.0-develop.10

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.
@@ -6,51 +6,51 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import { SignaturePad as ze } from "@progress/kendo-inputs-common";
9
+ import { SignaturePad as Ee } from "@progress/kendo-inputs-common";
10
10
  import { Button as D } from "@progress/kendo-react-buttons";
11
- import { createPropsContext as Ee, validatePackage as Se, usePropsContext as Oe, useIsomorphicLayoutEffect as xe, dispatchEvent as C, classNames as we, kendoThemeMaps as Q, getTabIndex as Le, noop as f, Keys as Ie } from "@progress/kendo-react-common";
12
- import { Dialog as Me } from "@progress/kendo-react-dialogs";
11
+ import { createPropsContext as Se, validatePackage as Oe, usePropsContext as xe, useIsomorphicLayoutEffect as we, dispatchEvent as C, classNames as T, kendoThemeMaps as Y, getTabIndex as Le, noop as f, Keys as Me } from "@progress/kendo-react-common";
12
+ import { Dialog as Ie } from "@progress/kendo-react-dialogs";
13
13
  import { useLocalization as Pe } from "@progress/kendo-react-intl";
14
14
  import a from "prop-types";
15
15
  import * as o from "react";
16
- import { signatureMaximize as Y, messages as T, signatureMinimize as Z, signatureClear as ee } from "../messages/index.mjs";
16
+ import { signatureMaximize as Z, messages as R, signatureMinimize as ee, signatureClear as te } from "../messages/index.mjs";
17
17
  import { packageMetadata as De } from "../package-metadata.mjs";
18
18
  import { hasParent as Te } from "./utils/index.mjs";
19
- import { hyperlinkOpenIcon as te, xIcon as Re } from "@progress/kendo-svg-icons";
20
- const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c) => c !== void 0, Ge = Ee(), h = o.forwardRef((c, re) => {
21
- Se(De);
22
- const e = Oe(Ge, c), z = Pe(), s = o.useRef(null), p = o.useRef(null), R = o.useRef(null), B = o.useRef(null), _ = o.useRef(null), [r, ie] = o.useState(), [g, F] = o.useState(!1), [E, N] = o.useState(!1), [b, G] = o.useState(), [se, le] = o.useState(), q = oe(e.value) ? e.value : b, [ce, ue] = o.useState(!1), m = oe(e.open), d = m ? e.open : ce, de = !(e.maximized || E || !e.maximizable || e.disabled), me = e.maximized && !E, fe = !(!(e.value || b) || E || e.readOnly || e.disabled), A = z.toLanguageString(Y, T[Y]), V = z.toLanguageString(Z, T[Z]), j = z.toLanguageString(ee, T[ee]), S = e.popupScale || ne, O = e.exportScale || ae, x = (t) => {
23
- G(t), e.onChange && e.onChange({ value: t });
24
- }, pe = (t) => {
19
+ import { hyperlinkOpenIcon as oe, xIcon as Re } from "@progress/kendo-svg-icons";
20
+ const Be = 250, _e = 84, ae = 3, re = 2, Fe = "#000000", Ne = "#ffffff", ne = (c) => c !== void 0, Ge = Se(), h = o.forwardRef((c, ie) => {
21
+ Oe(De);
22
+ const e = xe(Ge, c), z = Pe(), s = o.useRef(null), p = o.useRef(null), B = o.useRef(null), _ = o.useRef(null), F = o.useRef(null), [r, se] = o.useState(), [g, N] = o.useState(!1), [E, G] = o.useState(!1), [b, q] = o.useState(), [le, ce] = o.useState(), A = ne(e.value) ? e.value : b, [ue, de] = o.useState(!1), m = ne(e.open), d = m ? e.open : ue, me = e.maximized || E || !e.maximizable || e.disabled, fe = !(e.maximized && !E), pe = !(!(e.value || b) || E || e.readOnly || e.disabled), V = z.toLanguageString(Z, R[Z]), j = z.toLanguageString(ee, R[ee]), U = z.toLanguageString(te, R[te]), S = e.popupScale || ae, O = e.exportScale || re, x = (t) => {
23
+ q(t), e.onChange && e.onChange({ value: t });
24
+ }, ge = (t) => {
25
25
  r == null || r.loadImage(t.value), x(t.value);
26
26
  };
27
27
  o.useEffect(() => {
28
- e.value !== b && (G(e.value), r == null || r.loadImage(e.value));
28
+ e.value !== b && (q(e.value), r == null || r.loadImage(e.value));
29
29
  }, [e.value]);
30
- const ge = () => {
30
+ const be = () => {
31
31
  r == null || r.clear(), x();
32
32
  }, k = o.useCallback(
33
33
  (t) => {
34
- m || ue(t);
34
+ m || de(t);
35
35
  },
36
36
  [m]
37
- ), be = (t) => {
37
+ ), ke = (t) => {
38
38
  var n, i;
39
- $(t), (i = ((n = _.current) == null ? void 0 : n.element) || p.current) == null || i.focus();
39
+ X(t), (i = ((n = F.current) == null ? void 0 : n.element) || p.current) == null || i.focus();
40
40
  }, w = o.useCallback(() => {
41
41
  let t = Fe;
42
42
  return !e.color && typeof document != "undefined" && s.current && (t = getComputedStyle(s.current).color), e.color || t;
43
43
  }, [e.color]), L = o.useCallback(() => {
44
44
  let t = Ne;
45
45
  return !e.backgroundColor && typeof document != "undefined" && s.current && (t = getComputedStyle(s.current).backgroundColor), e.backgroundColor || t;
46
- }, [e.backgroundColor]), U = () => ({
46
+ }, [e.backgroundColor]), W = () => ({
47
47
  scale: e.maximized ? e.popupScale : 1,
48
48
  color: w(),
49
49
  backgroundColor: L(),
50
50
  strokeWidth: e.strokeWidth,
51
51
  smooth: e.smooth,
52
52
  readonly: e.readOnly
53
- }), W = async (t) => {
53
+ }), H = async (t) => {
54
54
  const { width: n, height: i } = t;
55
55
  return await (r == null ? void 0 : r.exportImage({
56
56
  width: n * O,
@@ -58,20 +58,20 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
58
58
  }));
59
59
  };
60
60
  o.useEffect(() => {
61
- const t = p.current, n = new ze(t, U());
62
- return q && n.loadImage(q), ie(n), () => n.destroy();
61
+ const t = p.current, n = new Ee(t, W());
62
+ return A && n.loadImage(A), se(n), () => n.destroy();
63
63
  }, []), o.useEffect(() => {
64
64
  r == null || r.setOptions({
65
- onChange: async () => x(await W(X())),
66
- onDraw: () => N(!0),
67
- onDrawEnd: () => N(!1)
65
+ onChange: async () => x(await H(J())),
66
+ onDraw: () => G(!0),
67
+ onDrawEnd: () => G(!1)
68
68
  });
69
- }, [r]), xe(
70
- () => r == null ? void 0 : r.setOptions(U()),
69
+ }, [r]), we(
70
+ () => r == null ? void 0 : r.setOptions(W()),
71
71
  [e.readOnly, e.color, e.backgroundColor, e.strokeWidth, e.smooth]
72
72
  ), o.useEffect(() => {
73
73
  var i, u;
74
- const t = (u = (i = R.current) == null ? void 0 : i.element) == null ? void 0 : u.querySelector(".k-overlay");
74
+ const t = (u = (i = B.current) == null ? void 0 : i.element) == null ? void 0 : u.querySelector(".k-overlay");
75
75
  if (!t)
76
76
  return;
77
77
  const n = () => k(!1);
@@ -80,14 +80,14 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
80
80
  if (!d || typeof document == "undefined")
81
81
  return;
82
82
  const t = (n) => {
83
- n.keyCode === Ie.esc && k(!1);
83
+ n.keyCode === Me.esc && k(!1);
84
84
  };
85
85
  return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
86
86
  }, [d]), o.useEffect(() => {
87
87
  var t, n;
88
- e.maximized && ((n = (t = B.current) == null ? void 0 : t.element) == null || n.focus());
88
+ e.maximized && ((n = (t = _.current) == null ? void 0 : t.element) == null || n.focus());
89
89
  }, []);
90
- const I = o.useCallback(
90
+ const M = o.useCallback(
91
91
  () => {
92
92
  var t;
93
93
  return (t = p.current) == null ? void 0 : t.focus();
@@ -96,13 +96,13 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
96
96
  ), v = o.useCallback(
97
97
  () => e.value,
98
98
  [e.value]
99
- ), H = o.useCallback(
99
+ ), K = o.useCallback(
100
100
  () => e.name,
101
101
  [e.name]
102
102
  ), y = o.useCallback(
103
103
  () => e.required,
104
104
  [e.required]
105
- ), M = o.useCallback(
105
+ ), I = o.useCallback(
106
106
  () => {
107
107
  const t = e.validationMessage !== void 0, i = !v(), u = e.valid !== void 0 ? e.valid : !y() || !i;
108
108
  return {
@@ -115,23 +115,23 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
115
115
  ), P = o.useCallback(
116
116
  () => e.validityStyles,
117
117
  [e.validityStyles]
118
- ), K = o.useCallback(
118
+ ), $ = o.useCallback(
119
119
  () => e,
120
120
  [e]
121
121
  ), l = o.useCallback(
122
122
  () => {
123
123
  const t = {
124
124
  element: s.current,
125
- focus: I
125
+ focus: M
126
126
  };
127
- return Object.defineProperty(t, "name", { get: H }), Object.defineProperty(t, "value", { get: v }), Object.defineProperty(t, "validity", { get: M }), Object.defineProperty(t, "validityStyles", { get: P }), Object.defineProperty(t, "required", { get: y }), Object.defineProperty(t, "props", { get: K }), Object.defineProperty(t, "color", { get: w }), Object.defineProperty(t, "backgroundColor", { get: L }), t;
127
+ return Object.defineProperty(t, "name", { get: K }), Object.defineProperty(t, "value", { get: v }), Object.defineProperty(t, "validity", { get: I }), Object.defineProperty(t, "validityStyles", { get: P }), Object.defineProperty(t, "required", { get: y }), Object.defineProperty(t, "props", { get: $ }), Object.defineProperty(t, "color", { get: w }), Object.defineProperty(t, "backgroundColor", { get: L }), t;
128
128
  },
129
- [H, v, M, P, y, I, K, w, L]
129
+ [K, v, I, P, y, M, $, w, L]
130
130
  );
131
- o.useImperativeHandle(re, l);
132
- const ke = o.useCallback(
131
+ o.useImperativeHandle(ie, l);
132
+ const ve = o.useCallback(
133
133
  (t) => {
134
- g || e.maximized || (F(!0), C(
134
+ g || e.maximized || (N(!0), C(
135
135
  e.onFocus,
136
136
  t,
137
137
  l(),
@@ -139,9 +139,9 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
139
139
  ));
140
140
  },
141
141
  [g, e.onFocus, l]
142
- ), ve = o.useCallback(
142
+ ), ye = o.useCallback(
143
143
  (t) => {
144
- Te(t.relatedTarget, s.current) || (F(!1), C(
144
+ Te(t.relatedTarget, s.current) || (N(!1), C(
145
145
  e.onBlur,
146
146
  t,
147
147
  l(),
@@ -149,9 +149,9 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
149
149
  ));
150
150
  },
151
151
  [g, e.onBlur, l]
152
- ), ye = o.useCallback(
152
+ ), Ce = o.useCallback(
153
153
  async (t) => {
154
- le(await W(J())), k(!0), C(
154
+ ce(await H(Q())), k(!0), C(
155
155
  e.onOpen,
156
156
  t,
157
157
  l(),
@@ -159,7 +159,7 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
159
159
  );
160
160
  },
161
161
  [d, m, e.onOpen, e.value, b, l]
162
- ), $ = o.useCallback(
162
+ ), X = o.useCallback(
163
163
  (t) => {
164
164
  k(!1), C(
165
165
  e.onClose,
@@ -169,45 +169,46 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
169
169
  );
170
170
  },
171
171
  [d, m, e.onClose, l]
172
- ), Ce = () => {
173
- ge(), I();
174
- }, X = () => {
172
+ ), he = () => {
173
+ be(), M();
174
+ }, J = () => {
175
175
  var i, u;
176
176
  const t = e.width || ((i = s.current) == null ? void 0 : i.offsetWidth) || Be, n = e.height || ((u = s.current) == null ? void 0 : u.offsetHeight) || _e;
177
177
  return {
178
178
  width: t,
179
179
  height: n
180
180
  };
181
- }, J = () => {
182
- const { width: t, height: n } = X();
181
+ }, Q = () => {
182
+ const { width: t, height: n } = J();
183
183
  return {
184
184
  width: t * S,
185
185
  height: n * S
186
186
  };
187
- }, he = !P() || M().valid;
187
+ }, ze = !P() || I().valid;
188
188
  return /* @__PURE__ */ o.createElement(
189
189
  "div",
190
190
  {
191
191
  ref: s,
192
192
  dir: e.dir,
193
193
  style: { width: e.width, height: e.height, ...e.style },
194
- className: we(
194
+ className: T(
195
195
  "k-input",
196
196
  "k-signature",
197
197
  {
198
198
  "k-signature-maximized": e.maximized,
199
- [`k-signature-${Q.sizeMap[e.size] || e.size}`]: e.size,
199
+ [`k-signature-${Y.sizeMap[e.size] || e.size}`]: e.size,
200
+ [`k-signature-${e.fillMode}`]: e.fillMode,
200
201
  [`k-input-${e.fillMode}`]: e.fillMode,
201
- [`k-rounded-${Q.roundedMap[e.rounded] || e.rounded}`]: e.rounded,
202
- "k-invalid": !he,
202
+ [`k-rounded-${Y.roundedMap[e.rounded] || e.rounded}`]: e.rounded,
203
+ "k-invalid": !ze,
203
204
  "k-required": e.required,
204
205
  "k-disabled": e.disabled,
205
206
  "k-focus": g
206
207
  },
207
208
  e.className
208
209
  ),
209
- onFocus: ke,
210
- onBlur: ve
210
+ onFocus: ve,
211
+ onBlur: ye
211
212
  },
212
213
  /* @__PURE__ */ o.createElement(
213
214
  "div",
@@ -223,33 +224,33 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
223
224
  "aria-disabled": e.disabled ? "true" : void 0
224
225
  }
225
226
  ),
226
- /* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-top" }, de && /* @__PURE__ */ o.createElement(
227
+ /* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-top" }, /* @__PURE__ */ o.createElement(
227
228
  D,
228
229
  {
229
230
  type: "button",
230
- className: "k-signature-action k-signature-maximize",
231
- ref: _,
231
+ className: T("k-signature-action", "k-signature-maximize", { "k-hidden": e.disabled || me }),
232
+ ref: F,
232
233
  icon: "hyperlink-open",
233
- svgIcon: te,
234
+ svgIcon: oe,
234
235
  fillMode: "flat",
235
236
  size: e.size,
236
- onClick: ye,
237
- "aria-label": A,
238
- title: A
237
+ onClick: Ce,
238
+ "aria-label": V,
239
+ title: V
239
240
  }
240
- ), me && /* @__PURE__ */ o.createElement(
241
+ ), /* @__PURE__ */ o.createElement(
241
242
  D,
242
243
  {
243
244
  type: "button",
244
- className: "k-signature-action k-signature-minimize k-rotate-180",
245
- ref: B,
245
+ className: T("k-signature-action", "k-signature-minimize", "k-rotate-180", { "k-hidden": e.disabled || fe }),
246
+ ref: _,
246
247
  icon: "hyperlink-open",
247
- svgIcon: te,
248
+ svgIcon: oe,
248
249
  fillMode: "flat",
249
250
  size: e.size,
250
- onClick: $,
251
- "aria-label": V,
252
- title: V
251
+ onClick: X,
252
+ "aria-label": j,
253
+ title: j
253
254
  }
254
255
  )),
255
256
  !e.hideLine && /* @__PURE__ */ o.createElement(
@@ -259,7 +260,7 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
259
260
  style: { zIndex: 2, pointerEvents: "none" }
260
261
  }
261
262
  ),
262
- /* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-bottom" }, fe && /* @__PURE__ */ o.createElement(
263
+ /* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-bottom" }, pe && /* @__PURE__ */ o.createElement(
263
264
  D,
264
265
  {
265
266
  type: "button",
@@ -268,22 +269,22 @@ const Be = 250, _e = 84, ne = 3, ae = 2, Fe = "#000000", Ne = "#ffffff", oe = (c
268
269
  svgIcon: Re,
269
270
  fillMode: "flat",
270
271
  size: e.size,
271
- onClick: Ce,
272
- "aria-label": j,
273
- title: j
272
+ onClick: he,
273
+ "aria-label": U,
274
+ title: U
274
275
  }
275
276
  )),
276
- d && /* @__PURE__ */ o.createElement(Me, { ref: R }, /* @__PURE__ */ o.createElement(
277
+ d && /* @__PURE__ */ o.createElement(Ie, { ref: B }, /* @__PURE__ */ o.createElement(
277
278
  h,
278
279
  {
279
280
  ...e,
280
- ...J(),
281
- value: se,
281
+ ...Q(),
282
+ value: le,
282
283
  maximized: !0,
283
284
  exportScale: 1 / S * O,
284
285
  open: !1,
285
- onChange: pe,
286
- onClose: be
286
+ onChange: ge,
287
+ onClose: ke
287
288
  }
288
289
  ))
289
290
  );
@@ -314,8 +315,8 @@ h.displayName = "KendoSignature";
314
315
  h.defaultProps = {
315
316
  strokeWidth: 1,
316
317
  smooth: !1,
317
- popupScale: ne,
318
- exportScale: ae,
318
+ popupScale: ae,
319
+ exportScale: re,
319
320
  maximizable: !0,
320
321
  disabled: !1,
321
322
  required: !1,
package/slider/Slider.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),l=require("prop-types"),a=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-intl"),n=require("../messages/index.js"),y=require("./SliderLabel.js"),k=require("../package-metadata.js"),m=require("@progress/kendo-react-buttons"),o=require("@progress/kendo-svg-icons");function S(d){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>d[e]})}}return i.default=d,Object.freeze(i)}const s=S(b),p=class p extends s.Component{constructor(i){super(i),this.state={value:this.props.defaultValue===void 0?this.props.min:this.props.defaultValue,focused:!1,dir:this.props.dir},this._sliderTrack=null,this._element=null,this.buttons=e=>{if(!e.enabled)return e.children;const t=this.state.dir==="rtl"?this.props.vertical?o.caretAltUpIcon:o.caretAltLeftIcon:this.props.vertical?o.caretAltUpIcon:o.caretAltRightIcon,c=this.state.dir==="rtl"?this.props.vertical?o.caretAltDownIcon:o.caretAltRightIcon:this.props.vertical?o.caretAltDownIcon:o.caretAltLeftIcon,r=this.state.dir==="rtl"?this.props.vertical?"caret-alt-up":"caret-alt-left":this.props.vertical?"caret-alt-up":"caret-alt-right",u=this.state.dir==="rtl"?this.props.vertical?"caret-alt-down":"caret-alt-right":this.props.vertical?"caret-alt-down":"caret-alt-left";return s.createElement(s.Fragment,null,s.createElement(m.Button,{className:"k-button-decrease",rounded:"full",icon:u,svgIcon:c,title:e.decrementTitle,onClick:e.decrement}),e.children,s.createElement(m.Button,{className:"k-button-increase",rounded:"full",icon:r,svgIcon:t,title:e.incrementTitle,onClick:e.increment}))},this.focus=()=>{this._element&&this._element.focus()},this.isLabel=e=>{let t=e;for(;t;){if(t.getAttribute(y.SLIDER_LABEL_ATTRIBUTE))return!0;t=t.parentElement}return!1},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onKeyDown=e=>{let t;e.keyCode===a.Keys.left||e.keyCode===a.Keys.down?t=this.state.value-(this.props.step||0):e.keyCode===a.Keys.right||e.keyCode===a.Keys.up?t=this.state.value+(this.props.step||0):e.keyCode===a.Keys.home?t=this.props.min:e.keyCode===a.Keys.end&&(t=this.props.max),t!==void 0&&(e.preventDefault(),this.change(e,t))},this.decrement=e=>{e.preventDefault(),this.change(e,this.state.value-(this.props.step||0))},this.increment=e=>{e.preventDefault(),this.change(e,this.state.value+(this.props.step||0))},this.dragStart=e=>{this.isLabel(e.event.originalEvent.target)||(e.event.isTouch&&e.event.originalEvent.preventDefault(),this.drag(e))},this.dragOver=e=>{e.event.originalEvent.preventDefault(),this.drag(e)},this.drag=e=>{const t=e.element.getBoundingClientRect(),c=this.props.vertical?t.bottom-e.event.clientY:this.state.dir==="rtl"?t.right-e.event.clientX:e.event.clientX-t.left,r=this.props.vertical?t.height:t.width,u=c/r;this.change(e,this.props.min+u*(this.props.max-this.props.min))},a.validatePackage(k.packageMetadata)}static getDerivedStateFromProps(i,e){const t=i.value!==void 0?i.value:e.value,{min:c,max:r}=i;return t===void 0?null:{value:Math.min(Math.max(t,c),r)}}componentDidMount(){if(!this.state.dir&&window&&this._element){const i=window.getComputedStyle(this._element).direction;i&&this.setState({dir:i})}}render(){const i=g.provideLocalizationService(this),e=(this.state.value-this.props.min)/(this.props.max-this.props.min)*100,t=this.props.vertical?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},c=this.props.vertical?{paddingTop:0,height:"100%"}:{};return s.createElement("div",{ref:r=>this._element=r,dir:this.state.dir,id:this.props.id,style:{gap:0,...this.props.style},onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,className:a.classNames("k-slider",{"k-focus":this.state.focused,"k-disabled":this.props.disabled,"k-slider-horizontal":!this.props.vertical,"k-slider-vertical":this.props.vertical},this.props.className)},s.createElement(this.buttons,{enabled:this.props.buttons,decrement:this.decrement,increment:this.increment,incrementTitle:i.toLanguageString(n.sliderIncreaseValue,n.messages[n.sliderIncreaseValue]),decrementTitle:i.toLanguageString(n.sliderDecreaseValue,n.messages[n.sliderDecreaseValue])},s.createElement(a.Draggable,{onDrag:this.dragOver,onPress:this.dragStart},s.createElement("div",{className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...t}},this.props.children&&s.createElement("ul",{className:"k-reset k-slider-items",style:{margin:0,...c}},s.Children.map(this.props.children,r=>r&&s.cloneElement(r,{position:100*(r.props.position-this.props.min)/(this.props.max-this.props.min),vertical:this.props.vertical},r.props.children))),s.createElement("div",{className:"k-slider-track",style:this.props.vertical?{bottom:0,height:"100%"}:{[this.state.dir==="rtl"?"right":"left"]:0,width:"100%"},ref:r=>this._sliderTrack=r},s.createElement("div",{className:"k-slider-selection",style:this.props.vertical?{height:e+"%"}:{width:e+"%"}}),s.createElement("span",{role:"slider","aria-valuemin":this.props.min,"aria-valuemax":this.props.max,"aria-valuenow":this.state.value,"aria-valuetext":String(this.state.value),"aria-orientation":this.props.vertical?"vertical":void 0,"aria-disabled":this.props.disabled?"true":void 0,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-label":this.props.ariaLabel,tabIndex:a.getTabIndex(this.props.tabIndex,this.props.disabled,void 0),className:"k-draghandle",title:i.toLanguageString(n.sliderDragTitle,n.messages[n.sliderDragTitle]),style:this.props.vertical?{bottom:"calc("+e+"%)",zIndex:1}:this.state.dir==="rtl"?{right:"calc("+e+"% - 13px)",zIndex:1}:{left:"calc("+e+"%)",zIndex:1}}))))))}get sliderTrack(){return this._sliderTrack}change(i,e){e=Math.min(Math.max(e,this.props.min),this.props.max),this.setState({value:e}),a.dispatchEvent(this.props.onChange,i,this,{value:e})}};p.displayName="Slider",p.propTypes={min:l.number.isRequired,max:l.number.isRequired,value:l.number,vertical:l.bool,id:l.string,ariaLabelledBy:l.string,ariaDescribedBy:l.string,ariaLabel:l.string};let h=p;const v=a.createPropsContext(),f=a.withPropsContext(v,h);f.displayName="KendoReactSlider";g.registerForLocalization(h);exports.Slider=f;exports.SliderPropsContext=v;exports.SliderWithoutContext=h;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),l=require("prop-types"),a=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-intl"),n=require("../messages/index.js"),y=require("./SliderLabel.js"),k=require("../package-metadata.js"),m=require("@progress/kendo-react-buttons"),o=require("@progress/kendo-svg-icons");function S(h){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const e in h)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(h,e);Object.defineProperty(i,e,t.get?t:{enumerable:!0,get:()=>h[e]})}}return i.default=h,Object.freeze(i)}const s=S(b),u=class u extends s.Component{constructor(i){super(i),this.state={value:this.props.defaultValue===void 0?this.props.min:this.props.defaultValue,focused:!1,dir:this.props.dir},this._sliderTrack=null,this._element=null,this.buttons=e=>{if(!e.enabled)return e.children;const t=this.state.dir==="rtl"?this.props.vertical?o.caretAltUpIcon:o.caretAltLeftIcon:this.props.vertical?o.caretAltUpIcon:o.caretAltRightIcon,c=this.state.dir==="rtl"?this.props.vertical?o.caretAltDownIcon:o.caretAltRightIcon:this.props.vertical?o.caretAltDownIcon:o.caretAltLeftIcon,r=this.state.dir==="rtl"?this.props.vertical?"caret-alt-up":"caret-alt-left":this.props.vertical?"caret-alt-up":"caret-alt-right",d=this.state.dir==="rtl"?this.props.vertical?"caret-alt-down":"caret-alt-right":this.props.vertical?"caret-alt-down":"caret-alt-left";return s.createElement(s.Fragment,null,s.createElement(m.Button,{className:"k-button-decrease",rounded:"full",icon:d,svgIcon:c,title:e.decrementTitle,onClick:e.decrement}),e.children,s.createElement(m.Button,{className:"k-button-increase",rounded:"full",icon:r,svgIcon:t,title:e.incrementTitle,onClick:e.increment}))},this.focus=()=>{this._element&&this._element.focus()},this.isLabel=e=>{let t=e;for(;t;){if(t.getAttribute(y.SLIDER_LABEL_ATTRIBUTE))return!0;t=t.parentElement}return!1},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onKeyDown=e=>{let t;e.keyCode===a.Keys.left||e.keyCode===a.Keys.down?t=this.state.value-(this.props.step||0):e.keyCode===a.Keys.right||e.keyCode===a.Keys.up?t=this.state.value+(this.props.step||0):e.keyCode===a.Keys.home?t=this.props.min:e.keyCode===a.Keys.end&&(t=this.props.max),t!==void 0&&(e.preventDefault(),this.change(e,t))},this.decrement=e=>{e.preventDefault(),this.change(e,this.state.value-(this.props.step||0))},this.increment=e=>{e.preventDefault(),this.change(e,this.state.value+(this.props.step||0))},this.dragStart=e=>{this.isLabel(e.event.originalEvent.target)||(e.event.isTouch&&e.event.originalEvent.preventDefault(),this.drag(e))},this.dragOver=e=>{e.event.originalEvent.preventDefault(),this.drag(e)},this.drag=e=>{const t=e.element.getBoundingClientRect(),c=this.props.vertical?t.bottom-e.event.clientY:this.state.dir==="rtl"?t.right-e.event.clientX:e.event.clientX-t.left,r=this.props.vertical?t.height:t.width,d=c/r;this.change(e,this.props.min+d*(this.props.max-this.props.min))},a.validatePackage(k.packageMetadata)}static getDerivedStateFromProps(i,e){const t=i.value!==void 0?i.value:e.value,{min:c,max:r}=i;return t===void 0?null:{value:Math.min(Math.max(t,c),r)}}componentDidMount(){if(!this.state.dir&&window&&this._element){const i=window.getComputedStyle(this._element).direction;i&&this.setState({dir:i})}}render(){const i=g.provideLocalizationService(this),e=(this.state.value-this.props.min)/(this.props.max-this.props.min)*100,t=this.props.vertical?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},c=this.props.vertical?{paddingTop:0,height:"100%"}:{};return s.createElement("div",{ref:r=>this._element=r,dir:this.state.dir,id:this.props.id,style:{gap:0,...this.props.style},onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,className:a.classNames("k-slider",{"k-focus":this.state.focused,"k-disabled":this.props.disabled,"k-slider-horizontal":!this.props.vertical,"k-slider-vertical":this.props.vertical},this.props.className)},s.createElement(this.buttons,{enabled:this.props.buttons,decrement:this.decrement,increment:this.increment,incrementTitle:i.toLanguageString(n.sliderIncreaseValue,n.messages[n.sliderIncreaseValue]),decrementTitle:i.toLanguageString(n.sliderDecreaseValue,n.messages[n.sliderDecreaseValue])},s.createElement(a.Draggable,{onDrag:this.dragOver,onPress:this.dragStart},s.createElement("div",{className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...t}},this.props.children&&s.createElement("ul",{className:"k-reset k-slider-items",style:{margin:0,...c}},s.Children.map(this.props.children,(r,d)=>r&&s.cloneElement(r,{position:100*(r.props.position-this.props.min)/(this.props.max-this.props.min),vertical:this.props.vertical,firstTick:d===0,lastTick:d===s.Children.count(this.props.children)-1},r.props.children))),s.createElement("div",{className:"k-slider-track",style:this.props.vertical?{bottom:0,height:"100%"}:{[this.state.dir==="rtl"?"right":"left"]:0,width:"100%"},ref:r=>this._sliderTrack=r},s.createElement("div",{className:"k-slider-selection",style:this.props.vertical?{height:e+"%"}:{width:e+"%"}}),s.createElement("span",{role:"slider","aria-valuemin":this.props.min,"aria-valuemax":this.props.max,"aria-valuenow":this.state.value,"aria-valuetext":String(this.state.value),"aria-orientation":this.props.vertical?"vertical":void 0,"aria-disabled":this.props.disabled?"true":void 0,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-label":this.props.ariaLabel,tabIndex:a.getTabIndex(this.props.tabIndex,this.props.disabled,void 0),className:"k-draghandle k-draghandle-end",title:i.toLanguageString(n.sliderDragTitle,n.messages[n.sliderDragTitle]),style:this.props.vertical?{bottom:"calc("+e+"%)",zIndex:1}:this.state.dir==="rtl"?{right:"calc("+e+"% - 13px)",zIndex:1}:{left:"calc("+e+"%)",zIndex:1}}))))))}get sliderTrack(){return this._sliderTrack}change(i,e){e=Math.min(Math.max(e,this.props.min),this.props.max),this.setState({value:e}),a.dispatchEvent(this.props.onChange,i,this,{value:e})}};u.displayName="Slider",u.propTypes={min:l.number.isRequired,max:l.number.isRequired,value:l.number,vertical:l.bool,id:l.string,ariaLabelledBy:l.string,ariaDescribedBy:l.string,ariaLabel:l.string};let p=u;const v=a.createPropsContext(),f=a.withPropsContext(v,p);f.displayName="KendoReactSlider";g.registerForLocalization(p);exports.Slider=f;exports.SliderPropsContext=v;exports.SliderWithoutContext=p;
package/slider/Slider.mjs CHANGED
@@ -8,14 +8,14 @@
8
8
  "use client";
9
9
  import * as i from "react";
10
10
  import a from "prop-types";
11
- import { Keys as l, validatePackage as y, classNames as w, Draggable as x, getTabIndex as E, dispatchEvent as S, createPropsContext as T, withPropsContext as D } from "@progress/kendo-react-common";
11
+ import { Keys as o, validatePackage as y, classNames as w, Draggable as x, getTabIndex as T, dispatchEvent as E, createPropsContext as S, withPropsContext as D } from "@progress/kendo-react-common";
12
12
  import { provideLocalizationService as I, registerForLocalization as L } from "@progress/kendo-react-intl";
13
- import { sliderIncreaseValue as d, messages as h, sliderDecreaseValue as m, sliderDragTitle as u } from "../messages/index.mjs";
14
- import { SLIDER_LABEL_ATTRIBUTE as B } from "./SliderLabel.mjs";
15
- import { packageMetadata as C } from "../package-metadata.mjs";
13
+ import { sliderIncreaseValue as d, messages as p, sliderDecreaseValue as m, sliderDragTitle as u } from "../messages/index.mjs";
14
+ import { SLIDER_LABEL_ATTRIBUTE as C } from "./SliderLabel.mjs";
15
+ import { packageMetadata as B } from "../package-metadata.mjs";
16
16
  import { Button as v } from "@progress/kendo-react-buttons";
17
17
  import { caretAltUpIcon as g, caretAltLeftIcon as f, caretAltRightIcon as b, caretAltDownIcon as k } from "@progress/kendo-svg-icons";
18
- const c = class c extends i.Component {
18
+ const h = class h extends i.Component {
19
19
  constructor(s) {
20
20
  super(s), this.state = {
21
21
  value: this.props.defaultValue === void 0 ? this.props.min : this.props.defaultValue,
@@ -24,13 +24,13 @@ const c = class c extends i.Component {
24
24
  }, this._sliderTrack = null, this._element = null, this.buttons = (t) => {
25
25
  if (!t.enabled)
26
26
  return t.children;
27
- const e = this.state.dir === "rtl" ? this.props.vertical ? g : f : this.props.vertical ? g : b, n = this.state.dir === "rtl" ? this.props.vertical ? k : b : this.props.vertical ? k : f, r = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-up" : "caret-alt-left" : this.props.vertical ? "caret-alt-up" : "caret-alt-right", p = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-down" : "caret-alt-right" : this.props.vertical ? "caret-alt-down" : "caret-alt-left";
27
+ const e = this.state.dir === "rtl" ? this.props.vertical ? g : f : this.props.vertical ? g : b, n = this.state.dir === "rtl" ? this.props.vertical ? k : b : this.props.vertical ? k : f, r = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-up" : "caret-alt-left" : this.props.vertical ? "caret-alt-up" : "caret-alt-right", l = this.state.dir === "rtl" ? this.props.vertical ? "caret-alt-down" : "caret-alt-right" : this.props.vertical ? "caret-alt-down" : "caret-alt-left";
28
28
  return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
29
29
  v,
30
30
  {
31
31
  className: "k-button-decrease",
32
32
  rounded: "full",
33
- icon: p,
33
+ icon: l,
34
34
  svgIcon: n,
35
35
  title: t.decrementTitle,
36
36
  onClick: t.decrement
@@ -51,7 +51,7 @@ const c = class c extends i.Component {
51
51
  }, this.isLabel = (t) => {
52
52
  let e = t;
53
53
  for (; e; ) {
54
- if (e.getAttribute(B))
54
+ if (e.getAttribute(C))
55
55
  return !0;
56
56
  e = e.parentElement;
57
57
  }
@@ -62,7 +62,7 @@ const c = class c extends i.Component {
62
62
  this.setState({ focused: !1 });
63
63
  }, this.onKeyDown = (t) => {
64
64
  let e;
65
- t.keyCode === l.left || t.keyCode === l.down ? e = this.state.value - (this.props.step || 0) : t.keyCode === l.right || t.keyCode === l.up ? e = this.state.value + (this.props.step || 0) : t.keyCode === l.home ? e = this.props.min : t.keyCode === l.end && (e = this.props.max), e !== void 0 && (t.preventDefault(), this.change(t, e));
65
+ t.keyCode === o.left || t.keyCode === o.down ? e = this.state.value - (this.props.step || 0) : t.keyCode === o.right || t.keyCode === o.up ? e = this.state.value + (this.props.step || 0) : t.keyCode === o.home ? e = this.props.min : t.keyCode === o.end && (e = this.props.max), e !== void 0 && (t.preventDefault(), this.change(t, e));
66
66
  }, this.decrement = (t) => {
67
67
  t.preventDefault(), this.change(t, this.state.value - (this.props.step || 0));
68
68
  }, this.increment = (t) => {
@@ -72,9 +72,9 @@ const c = class c extends i.Component {
72
72
  }, this.dragOver = (t) => {
73
73
  t.event.originalEvent.preventDefault(), this.drag(t);
74
74
  }, this.drag = (t) => {
75
- const e = t.element.getBoundingClientRect(), n = this.props.vertical ? e.bottom - t.event.clientY : this.state.dir === "rtl" ? e.right - t.event.clientX : t.event.clientX - e.left, r = this.props.vertical ? e.height : e.width, p = n / r;
76
- this.change(t, this.props.min + p * (this.props.max - this.props.min));
77
- }, y(C);
75
+ const e = t.element.getBoundingClientRect(), n = this.props.vertical ? e.bottom - t.event.clientY : this.state.dir === "rtl" ? e.right - t.event.clientX : t.event.clientX - e.left, r = this.props.vertical ? e.height : e.width, l = n / r;
76
+ this.change(t, this.props.min + l * (this.props.max - this.props.min));
77
+ }, y(B);
78
78
  }
79
79
  /**
80
80
  * @hidden
@@ -124,8 +124,8 @@ const c = class c extends i.Component {
124
124
  enabled: this.props.buttons,
125
125
  decrement: this.decrement,
126
126
  increment: this.increment,
127
- incrementTitle: s.toLanguageString(d, h[d]),
128
- decrementTitle: s.toLanguageString(m, h[m])
127
+ incrementTitle: s.toLanguageString(d, p[d]),
128
+ decrementTitle: s.toLanguageString(m, p[m])
129
129
  },
130
130
  /* @__PURE__ */ i.createElement(x, { onDrag: this.dragOver, onPress: this.dragStart }, /* @__PURE__ */ i.createElement(
131
131
  "div",
@@ -144,11 +144,13 @@ const c = class c extends i.Component {
144
144
  className: "k-reset k-slider-items",
145
145
  style: { margin: 0, ...n }
146
146
  },
147
- i.Children.map(this.props.children, (r) => r && i.cloneElement(
147
+ i.Children.map(this.props.children, (r, l) => r && i.cloneElement(
148
148
  r,
149
149
  {
150
150
  position: 100 * (r.props.position - this.props.min) / (this.props.max - this.props.min),
151
- vertical: this.props.vertical
151
+ vertical: this.props.vertical,
152
+ firstTick: l === 0,
153
+ lastTick: l === i.Children.count(this.props.children) - 1
152
154
  },
153
155
  r.props.children
154
156
  ))
@@ -180,9 +182,9 @@ const c = class c extends i.Component {
180
182
  "aria-labelledby": this.props.ariaLabelledBy,
181
183
  "aria-describedby": this.props.ariaDescribedBy,
182
184
  "aria-label": this.props.ariaLabel,
183
- tabIndex: E(this.props.tabIndex, this.props.disabled, void 0),
184
- className: "k-draghandle",
185
- title: s.toLanguageString(u, h[u]),
185
+ tabIndex: T(this.props.tabIndex, this.props.disabled, void 0),
186
+ className: "k-draghandle k-draghandle-end",
187
+ title: s.toLanguageString(u, p[u]),
186
188
  style: this.props.vertical ? { bottom: "calc(" + t + "%)", zIndex: 1 } : this.state.dir === "rtl" ? { right: "calc(" + t + "% - 13px)", zIndex: 1 } : { left: "calc(" + t + "%)", zIndex: 1 }
187
189
  }
188
190
  )
@@ -198,10 +200,10 @@ const c = class c extends i.Component {
198
200
  return this._sliderTrack;
199
201
  }
200
202
  change(s, t) {
201
- t = Math.min(Math.max(t, this.props.min), this.props.max), this.setState({ value: t }), S(this.props.onChange, s, this, { value: t });
203
+ t = Math.min(Math.max(t, this.props.min), this.props.max), this.setState({ value: t }), E(this.props.onChange, s, this, { value: t });
202
204
  }
203
205
  };
204
- c.displayName = "Slider", c.propTypes = {
206
+ h.displayName = "Slider", h.propTypes = {
205
207
  min: a.number.isRequired,
206
208
  max: a.number.isRequired,
207
209
  value: a.number,
@@ -212,12 +214,12 @@ c.displayName = "Slider", c.propTypes = {
212
214
  ariaLabel: a.string
213
215
  // TODO: validation when buttons is set to true, but no step is provided
214
216
  };
215
- let o = c;
216
- const A = T(), N = D(A, o);
217
+ let c = h;
218
+ const A = S(), N = D(A, c);
217
219
  N.displayName = "KendoReactSlider";
218
- L(o);
220
+ L(c);
219
221
  export {
220
222
  N as Slider,
221
223
  A as SliderPropsContext,
222
- o as SliderWithoutContext
224
+ c as SliderWithoutContext
223
225
  };
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),o=require("@progress/kendo-react-common");function s(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const l in e)if(l!=="default"){const c=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,c.get?c:{enumerable:!0,get:()=>e[l]})}}return t.default=e,Object.freeze(t)}const i=s(a),n="data-slider-label",u=e=>{const t=i.useRef(null),l=o.useDir(t),c=e.vertical?{bottom:`${e.position}%`}:{[l==="rtl"?"right":"left"]:`${e.position}%`},r=e.vertical?"k-tick-vertical":"k-tick-horizontal";return i.createElement("li",{ref:t,className:`k-tick k-tick-large ${r}`,title:e.title,style:{zIndex:1,position:"absolute",...c}},e.children&&i.createElement("span",{[n]:!0,className:"k-label",onClick:e.onClick},e.children))};exports.SLIDER_LABEL_ATTRIBUTE=n;exports.SliderLabel=u;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),a=require("@progress/kendo-react-common");function s(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const l in e)if(l!=="default"){const n=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,n.get?n:{enumerable:!0,get:()=>e[l]})}}return t.default=e,Object.freeze(t)}const c=s(i),r="data-slider-label",o=e=>{const t=c.useRef(null);return a.useDir(t),c.createElement("li",{ref:t,className:a.classNames("k-tick",{"k-tick-large":e.children,"k-first":e.firstTick,"k-last":e.lastTick}),title:e.title},e.children&&c.createElement("span",{[r]:!0,className:"k-label",onClick:e.onClick},e.children))};exports.SLIDER_LABEL_ATTRIBUTE=r;exports.SliderLabel=o;
@@ -6,34 +6,29 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as e from "react";
10
- import { useDir as n } from "@progress/kendo-react-common";
11
- const r = "data-slider-label", s = (t) => {
12
- const l = e.useRef(null), i = n(l), c = t.vertical ? { bottom: `${t.position}%` } : { [i === "rtl" ? "right" : "left"]: `${t.position}%` }, a = t.vertical ? "k-tick-vertical" : "k-tick-horizontal";
13
- return /* @__PURE__ */ e.createElement(
9
+ import * as l from "react";
10
+ import { useDir as i, classNames as a } from "@progress/kendo-react-common";
11
+ const c = "data-slider-label", s = (e) => {
12
+ const t = l.useRef(null);
13
+ return i(t), /* @__PURE__ */ l.createElement(
14
14
  "li",
15
15
  {
16
- ref: l,
17
- className: `k-tick k-tick-large ${a}`,
18
- title: t.title,
19
- style: {
20
- zIndex: 1,
21
- position: "absolute",
22
- ...c
23
- }
16
+ ref: t,
17
+ className: a("k-tick", { "k-tick-large": e.children, "k-first": e.firstTick, "k-last": e.lastTick }),
18
+ title: e.title
24
19
  },
25
- t.children && /* @__PURE__ */ e.createElement(
20
+ e.children && /* @__PURE__ */ l.createElement(
26
21
  "span",
27
22
  {
28
- [r]: !0,
23
+ [c]: !0,
29
24
  className: "k-label",
30
- onClick: t.onClick
25
+ onClick: e.onClick
31
26
  },
32
- t.children
27
+ e.children
33
28
  )
34
29
  );
35
30
  };
36
31
  export {
37
- r as SLIDER_LABEL_ATTRIBUTE,
32
+ c as SLIDER_LABEL_ATTRIBUTE,
38
33
  s as SliderLabel
39
34
  };
package/switch/Switch.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react"),s=require("prop-types"),i=require("@progress/kendo-react-common"),S=require("@progress/kendo-react-intl"),p=require("../messages/index.js"),M=require("../package-metadata.js");function N(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const e in d)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(d,e);Object.defineProperty(a,e,t.get?t:{enumerable:!0,get:()=>d[e]})}}return a.default=d,Object.freeze(a)}const n=N(C),l=class l extends n.Component{constructor(a){super(a),this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||this.defaultValidationMessage.toLanguageString(p.switchValidation,p.messages[p.switchValidation]))},this.limit=(e,t,r)=>{const h=r.offsetWidth,o=t.offsetWidth;return e<0?0:e>h-o?h-o:e},this.toggle=(e,t)=>{this.setState({checked:e}),this.valueDuringOnChange=e,i.dispatchEvent(this.props.onChange,t,this,{value:e}),this.valueDuringOnChange=void 0},this._element=null,this._wrapper=null,this._input=null,this._id=this.props.id,this.defaultValidationMessage=S.provideLocalizationService(this),this.focus=()=>{this.actionElement&&this.actionElement.focus()},this.dummyInput=e=>n.createElement("input",{type:"checkbox",checked:this.props.checked,ref:t=>{this._input=t},tabIndex:-1,"aria-hidden":!0,value:e,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"},onChange:i.noop,name:this.name||void 0}),this.handleClick=e=>{this.eventTimeStamp!==e.timeStamp&&(this.eventTimeStamp=e.timeStamp,this.toggle(!this.value,e))},this.handleKeyDown=e=>{if(this.props.disabled)return;const{keyCode:t}=e;(t===i.Keys.space||t===i.Keys.enter)&&(this.toggle(!this.value,e),e.preventDefault())},this.handleWrapperFocus=e=>{if(this.props.disabled)return;this.setState({focused:!0});const{onFocus:t}=this.props;t&&t.call(void 0,e)},this.handleWrapperBlur=e=>{if(this.props.disabled)return;this.setState({focused:!1});const{onBlur:t}=this.props;t&&t.call(void 0,e)},i.validatePackage(M.packageMetadata),this.state={checked:a.defaultChecked||l.defaultProps.defaultChecked,focused:!1}}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.checked!==void 0?this.props.checked:this.state.checked}get element(){return this._element}get actionElement(){return this._wrapper}get name(){return this.props.name}get validity(){const a=this.props.validationMessage!==void 0,e=this.props.valid!==void 0?this.props.valid:this.props.required?!!this.value:!0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:a,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:l.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:l.defaultProps.required}componentDidMount(){this.setValidity(),this.forceUpdate()}componentDidUpdate(){this.setValidity()}render(){const{focused:a}=this.state,{dir:e,disabled:t,trackRounded:r,thumbRounded:h,size:o,offLabel:g,onLabel:b,tabIndex:v}=this.props;this.dir=e||this.element&&getComputedStyle(this.element).direction||void 0;const y=!this.validityStyles||this.validity.valid,k=i.classNames("k-switch",{[`k-switch-${i.kendoThemeMaps.sizeMap[o]||o}`]:o,[`k-rounded-${i.kendoThemeMaps.roundedMap[r]||r}`]:r,"k-switch-on":this.value,"k-switch-off":!this.value,"k-focus":a,"k-disabled":t,"k-invalid":!y},this.props.className),w={"aria-checked":this.value,"aria-disabled":t||void 0,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-label":this.props.ariaLabel};return n.createElement("span",{ref:u=>{this._wrapper=u},role:"switch",...w,className:k,dir:this.dir,onKeyDown:this.handleKeyDown,onClick:this.handleClick,onBlur:this.handleWrapperBlur,onFocus:this.handleWrapperFocus,tabIndex:i.getTabIndex(v,t,void 0),accessKey:this.props.accessKey,id:this.props.id||this._id},n.createElement("span",{className:i.classNames("k-switch-track",{[`k-rounded-${i.kendoThemeMaps.roundedMap[r]||r}`]:r}),ref:u=>{this._element=u}},this.dummyInput(this.value),n.createElement("span",{className:"k-switch-label-on"},b),n.createElement("span",{className:"k-switch-label-off"},g)),n.createElement("span",{className:"k-switch-thumb-wrap"},n.createElement("span",{className:i.classNames("k-switch-thumb",{[`k-rounded-${h}`]:h})})))}};l.displayName="Switch",l.propTypes={accessKey:s.string,checked:s.bool,className:s.string,disabled:s.bool,defaultChecked:s.bool,size:s.oneOf([null,"small","medium","large"]),trackRounded:s.oneOf([null,"small","medium","large","full"]),thumbRounded:s.oneOf([null,"small","medium","large","full"]),dir:s.string,id:s.string,ariaLabelledBy:s.string,ariaDescribedBy:s.string,offLabel:s.string,required:s.bool,tabIndex:s.number,valid:s.bool,validate:s.bool,validationMessage:s.string,onBlur:s.any,onChange:s.any,onFocus:s.any,onLabel:s.string},l.defaultProps={disabled:!1,defaultChecked:!1,size:"medium",trackRounded:"full",thumbRounded:"full",offLabel:"OFF",onBlur:i.noop,onFocus:i.noop,onLabel:"ON",required:!1,validityStyles:!0};let c=l;const m=i.createPropsContext(),f=i.withIdHOC(i.withPropsContext(m,c));f.displayName="KendoReactSwitch";exports.Switch=f;exports.SwitchPropsContext=m;exports.SwitchWithoutContext=c;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react"),s=require("prop-types"),i=require("@progress/kendo-react-common"),S=require("@progress/kendo-react-intl"),p=require("../messages/index.js"),N=require("../package-metadata.js");function O(o){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const e in o)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(o,e);Object.defineProperty(a,e,t.get?t:{enumerable:!0,get:()=>o[e]})}}return a.default=o,Object.freeze(a)}const r=O(C),n=class n extends r.Component{constructor(a){super(a),this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||this.defaultValidationMessage.toLanguageString(p.switchValidation,p.messages[p.switchValidation]))},this.limit=(e,t,d)=>{const h=d.offsetWidth,l=t.offsetWidth;return e<0?0:e>h-l?h-l:e},this.toggle=(e,t)=>{this.setState({checked:e}),this.valueDuringOnChange=e,i.dispatchEvent(this.props.onChange,t,this,{value:e}),this.valueDuringOnChange=void 0},this._element=null,this._wrapper=null,this._input=null,this._id=this.props.id,this.defaultValidationMessage=S.provideLocalizationService(this),this.focus=()=>{this.actionElement&&this.actionElement.focus()},this.dummyInput=e=>r.createElement("input",{type:"checkbox",checked:this.props.checked,ref:t=>{this._input=t},tabIndex:-1,"aria-hidden":!0,value:e,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"},onChange:i.noop,name:this.name||void 0}),this.handleClick=e=>{this.eventTimeStamp!==e.timeStamp&&(this.eventTimeStamp=e.timeStamp,this.toggle(!this.value,e))},this.handleKeyDown=e=>{if(this.props.disabled)return;const{keyCode:t}=e;(t===i.Keys.space||t===i.Keys.enter)&&(this.toggle(!this.value,e),e.preventDefault())},this.handleWrapperFocus=e=>{if(this.props.disabled)return;this.setState({focused:!0});const{onFocus:t}=this.props;t&&t.call(void 0,e)},this.handleWrapperBlur=e=>{if(this.props.disabled)return;this.setState({focused:!1});const{onBlur:t}=this.props;t&&t.call(void 0,e)},i.validatePackage(N.packageMetadata),this.state={checked:a.defaultChecked||n.defaultProps.defaultChecked,focused:!1}}get value(){return this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.checked!==void 0?this.props.checked:this.state.checked}get element(){return this._element}get actionElement(){return this._wrapper}get name(){return this.props.name}get validity(){const a=this.props.validationMessage!==void 0,e=this.props.valid!==void 0?this.props.valid:this.props.required?!!this.value:!0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:a,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:n.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:n.defaultProps.required}componentDidMount(){this.setValidity(),this.forceUpdate()}componentDidUpdate(){this.setValidity()}render(){const{focused:a}=this.state,{dir:e,disabled:t,trackRounded:d,thumbRounded:h,size:l,offLabel:m,onLabel:f,tabIndex:v}=this.props;this.dir=e||this.element&&getComputedStyle(this.element).direction||void 0;const y=!this.validityStyles||this.validity.valid,k=i.classNames("k-switch",{[`k-switch-${i.kendoThemeMaps.sizeMap[l]||l}`]:l,"k-switch-on":this.value,"k-switch-off":!this.value,"k-focus":a,"k-disabled":t,"k-invalid":!y},this.props.className),w={"aria-checked":this.value,"aria-disabled":t||void 0,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-label":this.props.ariaLabel};return r.createElement("span",{ref:u=>{this._wrapper=u},role:"switch",...w,className:k,dir:this.dir,onKeyDown:this.handleKeyDown,onClick:this.handleClick,onBlur:this.handleWrapperBlur,onFocus:this.handleWrapperFocus,tabIndex:i.getTabIndex(v,t,void 0),accessKey:this.props.accessKey,id:this.props.id||this._id},r.createElement("span",{className:i.classNames("k-switch-track",{[`k-rounded-${i.kendoThemeMaps.roundedMap[d]||d}`]:d}),ref:u=>{this._element=u}},this.dummyInput(this.value),f?r.createElement("span",{className:"k-switch-label-on"},f):"",m?r.createElement("span",{className:"k-switch-label-off"},m):""),r.createElement("span",{className:"k-switch-thumb-wrap"},r.createElement("span",{className:i.classNames("k-switch-thumb",{[`k-rounded-${h}`]:h})})))}};n.displayName="Switch",n.propTypes={accessKey:s.string,checked:s.bool,className:s.string,disabled:s.bool,defaultChecked:s.bool,size:s.oneOf([null,"small","medium","large"]),trackRounded:s.oneOf([null,"small","medium","large","full"]),thumbRounded:s.oneOf([null,"small","medium","large","full"]),dir:s.string,id:s.string,ariaLabelledBy:s.string,ariaDescribedBy:s.string,offLabel:s.string,required:s.bool,tabIndex:s.number,valid:s.bool,validate:s.bool,validationMessage:s.string,onBlur:s.any,onChange:s.any,onFocus:s.any,onLabel:s.string},n.defaultProps={disabled:!1,defaultChecked:!1,size:"medium",trackRounded:"full",thumbRounded:"full",offLabel:"OFF",onBlur:i.noop,onFocus:i.noop,onLabel:"ON",required:!1,validityStyles:!0};let c=n;const g=i.createPropsContext(),b=i.withIdHOC(i.withPropsContext(g,c));b.displayName="KendoReactSwitch";exports.Switch=b;exports.SwitchPropsContext=g;exports.SwitchWithoutContext=c;