@progress/kendo-react-inputs 14.5.0-develop.14 → 14.5.0-develop.16
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.
- package/checkbox/Checkbox.js +1 -1
- package/checkbox/Checkbox.mjs +64 -64
- package/colors/ColorGradient.js +1 -1
- package/colors/ColorGradient.mjs +74 -72
- package/colors/ColorInput.js +1 -1
- package/colors/ColorInput.mjs +57 -45
- package/colors/ColorPalette.js +1 -1
- package/colors/ColorPalette.mjs +84 -81
- package/colors/ColorPicker.js +1 -1
- package/colors/ColorPicker.mjs +162 -160
- package/colors/FlatColorPicker.js +1 -1
- package/colors/FlatColorPicker.mjs +86 -94
- package/dist/cdn/js/kendo-react-inputs.js +1 -1
- package/messages/index.d.ts +55 -0
- package/messages/index.js +1 -1
- package/messages/index.mjs +82 -60
- package/numerictextbox/NumericTextBox.js +1 -1
- package/numerictextbox/NumericTextBox.mjs +115 -115
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
- package/radiobutton/RadioButton.js +1 -1
- package/radiobutton/RadioButton.mjs +23 -20
- package/radiobutton/interfaces/RadioButtonProps.d.ts +7 -0
- package/range-slider/RangeSlider.d.ts +8 -0
- package/range-slider/RangeSlider.js +11 -11
- package/range-slider/RangeSlider.mjs +189 -186
- package/rating/Rating.js +2 -2
- package/rating/Rating.mjs +3 -3
- package/signature/Signature.js +1 -1
- package/signature/Signature.mjs +80 -84
- package/slider/Slider.js +1 -1
- package/slider/Slider.mjs +139 -131
- package/slider/SliderLabel.js +1 -1
- package/slider/SliderLabel.mjs +3 -2
- package/switch/Switch.js +1 -1
- package/switch/Switch.mjs +52 -54
- package/textarea/TextArea.js +1 -1
- package/textarea/TextArea.mjs +29 -31
package/signature/Signature.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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Oe=require("@progress/kendo-inputs-common"),_=require("@progress/kendo-react-buttons"),a=require("@progress/kendo-react-common"),Ee=require("@progress/kendo-react-dialogs"),xe=require("@progress/kendo-react-intl"),s=require("prop-types"),Me=require("react"),m=require("../messages/index.js"),
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Oe=require("@progress/kendo-inputs-common"),_=require("@progress/kendo-react-buttons"),a=require("@progress/kendo-react-common"),Ee=require("@progress/kendo-react-dialogs"),xe=require("@progress/kendo-react-intl"),s=require("prop-types"),Me=require("react"),m=require("../messages/index.js"),ee=require("../package-metadata.js"),we=require("./utils/index.js"),N=require("@progress/kendo-svg-icons");function Ie(c){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const g in c)if(g!=="default"){const v=Object.getOwnPropertyDescriptor(c,g);Object.defineProperty(k,g,v.get?v:{enumerable:!0,get:()=>c[g]})}}return k.default=c,Object.freeze(k)}const n=Ie(Me),Le=250,Pe=84,ne=3,oe=2,Re="#000000",qe="#ffffff",te=c=>c!==void 0,ae=a.createPropsContext(),E=n.forwardRef((c,k)=>{const g=!a.validatePackage(ee.packageMetadata,{component:"Signature"}),v=a.getLicenseMessage(ee.packageMetadata),F=a.usePropsContext(ae,c),e=n.useMemo(()=>({strokeWidth:l.strokeWidth,smooth:l.smooth,popupScale:l.popupScale,exportScale:l.exportScale,maximizable:l.maximizable,disabled:l.disabled,required:l.required,validityStyles:l.validityStyles,onChange:l.onChange,onFocus:l.onFocus,onBlur:l.onBlur,onOpen:l.onOpen,onClose:l.onClose,size:l.size,rounded:l.rounded,fillMode:l.fillMode,...F}),[F]),x=xe.useLocalization(),p=n.useRef(null),y=n.useRef(null),j=n.useRef(null),W=n.useRef(null),M=n.useRef(null),[r,se]=n.useState(),[h,G]=n.useState(!1),[w,A]=n.useState(!1),[C,V]=n.useState(),[re,ie]=n.useState(),U=te(e.value)?e.value:C,[le,ce]=n.useState(!1),b=te(e.open),f=b?e.open:le,ue=e.maximized||w||!e.maximizable||e.disabled,de=!(e.maximized&&!w),pe=!(!(e.value||C)||w||e.readOnly||e.disabled),me=x.toLanguageString(m.signatureMaximize,m.messages[m.signatureMaximize]),ge=x.toLanguageString(m.signatureMinimize,m.messages[m.signatureMinimize]),fe=x.toLanguageString(m.signatureClear,m.messages[m.signatureClear]),I=e.popupScale||ne,L=e.exportScale||oe,P=t=>{V(t),e.onChange&&e.onChange({value:t})},ke=t=>{r==null||r.loadImage(t.value),P(t.value)};n.useEffect(()=>{e.value!==C&&(V(e.value),r==null||r.loadImage(e.value))},[e.value]);const be=()=>{r==null||r.clear(),P()},S=n.useCallback(t=>{b||ce(t)},[b]),ve=t=>{var o,i;Q(t),(i=((o=M.current)==null?void 0:o.element)||y.current)==null||i.focus()},R=n.useCallback(()=>{let t=Re;return!e.color&&typeof document!="undefined"&&p.current&&(t=getComputedStyle(p.current).color),e.color||t},[e.color]),q=n.useCallback(()=>{let t=qe;return!e.backgroundColor&&typeof document!="undefined"&&p.current&&(t=getComputedStyle(p.current).backgroundColor),e.backgroundColor||t},[e.backgroundColor]),H=()=>({scale:e.maximized?e.popupScale:1,color:R(),backgroundColor:q(),strokeWidth:e.strokeWidth,smooth:e.smooth,readonly:e.readOnly}),$=async t=>{const{width:o,height:i}=t;return await(r==null?void 0:r.exportImage({width:o*L,height:i*L}))};n.useEffect(()=>{const t=y.current,o=new Oe.SignaturePad(t,H());return U&&o.loadImage(U),se(o),()=>o.destroy()},[]),n.useEffect(()=>{r==null||r.setOptions({onChange:async()=>P(await $(Y())),onDraw:()=>A(!0),onDrawEnd:()=>A(!1)})},[r]),a.useIsomorphicLayoutEffect(()=>r==null?void 0:r.setOptions(H()),[e.readOnly,e.color,e.backgroundColor,e.strokeWidth,e.smooth]),n.useEffect(()=>{var i,d;const t=(d=(i=j.current)==null?void 0:i.element)==null?void 0:d.querySelector(".k-overlay");if(!t)return;const o=()=>S(!1);return t.addEventListener("click",o),()=>t.removeEventListener("click",o)},[f]),n.useEffect(()=>{if(!f||typeof document=="undefined")return;const t=o=>{var i,d;o.key==="Escape"&&(S(!1),(d=(i=M.current)==null?void 0:i.element)==null||d.focus())};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[f]),n.useEffect(()=>{var t,o;e.maximized&&((o=(t=W.current)==null?void 0:t.element)==null||o.focus())},[]);const D=n.useCallback(()=>{var t;return(t=y.current)==null?void 0:t.focus()},[]),z=n.useCallback(()=>e.value,[e.value]),K=n.useCallback(()=>e.name,[e.name]),O=n.useCallback(()=>e.required,[e.required]),T=n.useCallback(()=>{const t=e.validationMessage!==void 0,i=!z(),d=e.valid!==void 0?e.valid:!O()||!i;return{customError:t,valid:d,valueMissing:i}},[e.validationMessage,e.valid,z,O]),B=n.useCallback(()=>e.validityStyles,[e.validityStyles]),X=n.useCallback(()=>e,[e]),u=n.useCallback(()=>{const t={element:p.current,focus:D};return Object.defineProperty(t,"name",{get:K}),Object.defineProperty(t,"value",{get:z}),Object.defineProperty(t,"validity",{get:T}),Object.defineProperty(t,"validityStyles",{get:B}),Object.defineProperty(t,"required",{get:O}),Object.defineProperty(t,"props",{get:X}),Object.defineProperty(t,"color",{get:R}),Object.defineProperty(t,"backgroundColor",{get:q}),t},[K,z,T,B,O,D,X,R,q]);n.useImperativeHandle(k,u);const J=n.useRef(null);n.useImperativeHandle(J,u),a.useWebMcpRegister("signature",J,e,e.webMcp);const ye=n.useCallback(t=>{h||e.maximized||(G(!0),a.dispatchEvent(e.onFocus,t,u(),{}))},[h,e.onFocus,u]),he=n.useCallback(t=>{we.hasParent(t.relatedTarget,p.current)||(G(!1),a.dispatchEvent(e.onBlur,t,u(),{}))},[h,e.onBlur,u]),Ce=n.useCallback(async t=>{ie(await $(Z())),S(!0),a.dispatchEvent(e.onOpen,t,u(),{})},[f,b,e.onOpen,e.value,C,u]),Q=n.useCallback(t=>{S(!1),a.dispatchEvent(e.onClose,t,u(),{})},[f,b,e.onClose,u]),Se=()=>{be(),D()},Y=()=>{var i,d;const t=e.width||((i=p.current)==null?void 0:i.offsetWidth)||Le,o=e.height||((d=p.current)==null?void 0:d.offsetHeight)||Pe;return{width:t,height:o}},Z=()=>{const{width:t,height:o}=Y();return{width:t*I,height:o*I}},ze=!B()||T().valid;return n.createElement("div",{ref:p,dir:e.dir,style:{width:e.width,height:e.height,...e.style},className:a.classNames("k-input","k-signature",{"k-signature-maximized":e.maximized,[`k-signature-${a.kendoThemeMaps.sizeMap[e.size]||e.size}`]:e.size,[`k-signature-${e.fillMode}`]:e.fillMode,[`k-input-${e.fillMode}`]:e.fillMode,[`k-rounded-${a.kendoThemeMaps.roundedMap[e.rounded]||e.rounded}`]:e.rounded,"k-invalid":!ze,"k-required":e.required,"k-disabled":e.disabled,"k-focus":h},e.className),onFocus:ye,onBlur:he},n.createElement("div",{className:"k-signature-canvas",ref:y,role:"img",tabIndex:a.getTabIndex(e.tabIndex,e.disabled),id:e.id,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledBy,"aria-describedby":e.ariaDescribedBy,style:e.inputStyle}),n.createElement("div",{className:"k-signature-actions k-signature-actions-top"},n.createElement(_.Button,{type:"button",className:a.classNames("k-signature-action","k-signature-maximize",{"k-hidden":e.disabled||ue}),ref:M,icon:"hyperlink-open",svgIcon:N.hyperlinkOpenIcon,size:e.size,rounded:e.rounded,fillMode:"flat",onClick:Ce,title:me}),n.createElement(_.Button,{type:"button",className:a.classNames("k-signature-action","k-signature-minimize",{"k-hidden":e.disabled||de}),ref:W,icon:"hyperlink-open",svgIcon:N.hyperlinkOpenIcon,size:e.size,rounded:e.rounded,fillMode:"flat",onClick:Q,title:ge})),!e.hideLine&&n.createElement("div",{className:"k-signature-line",style:{zIndex:2,pointerEvents:"none"}}),n.createElement("div",{className:"k-signature-actions k-signature-actions-bottom"},pe&&n.createElement(_.Button,{type:"button",className:"k-signature-action k-signature-clear",icon:"x",svgIcon:N.xIcon,size:e.size,rounded:e.rounded,fillMode:"flat",onClick:Se,title:fe})),f&&n.createElement(Ee.Dialog,{ref:j},n.createElement(E,{...e,...Z(),value:re,maximized:!0,exportScale:1/I*L,open:!1,onChange:ke,onClose:ve})),g&&n.createElement(a.WatermarkOverlay,{message:v}))});E.propTypes={value:s.string,width:s.number,height:s.number,tabIndex:s.number,dir:s.string,ariaDescribedBy:s.string,ariaLabelledBy:s.string,ariaLabel:s.string,readOnly:s.bool,disabled:s.bool,validationMessage:s.string,required:s.bool,onChange:s.func,onFocus:s.func,onBlur:s.func,onOpen:s.func,onClose:s.func,size:s.oneOf(["small","medium","large"]),rounded:s.oneOf(["small","medium","large","none"]),fillMode:s.oneOf(["solid","flat","outline"])};const l={strokeWidth:1,smooth:!1,popupScale:ne,exportScale:oe,maximizable:!0,disabled:!1,required:!1,validityStyles:!0,onChange:c=>a.noop,onFocus:c=>a.noop,onBlur:c=>a.noop,onOpen:c=>a.noop,onClose:c=>a.noop,size:void 0,rounded:void 0,fillMode:void 0};E.displayName="KendoSignature";exports.Signature=E;exports.SignaturePropsContext=ae;
|
package/signature/Signature.mjs
CHANGED
|
@@ -7,90 +7,90 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import { SignaturePad as Le } from "@progress/kendo-inputs-common";
|
|
9
9
|
import { Button as R } from "@progress/kendo-react-buttons";
|
|
10
|
-
import { validatePackage as Ie, getLicenseMessage as Pe, usePropsContext as De, noop as f, useIsomorphicLayoutEffect as Re, useWebMcpRegister as Te, dispatchEvent as h, classNames as T, kendoThemeMaps as
|
|
10
|
+
import { validatePackage as Ie, getLicenseMessage as Pe, usePropsContext as De, noop as f, useIsomorphicLayoutEffect as Re, useWebMcpRegister as Te, dispatchEvent as h, classNames as T, kendoThemeMaps as Y, getTabIndex as Be, WatermarkOverlay as Fe, createPropsContext as _e } from "@progress/kendo-react-common";
|
|
11
11
|
import { Dialog as We } from "@progress/kendo-react-dialogs";
|
|
12
12
|
import { useLocalization as Ne } from "@progress/kendo-react-intl";
|
|
13
13
|
import a from "prop-types";
|
|
14
14
|
import * as o from "react";
|
|
15
|
-
import { signatureMaximize as
|
|
16
|
-
import { packageMetadata as
|
|
15
|
+
import { signatureMaximize as Z, messages as B, signatureMinimize as ee, signatureClear as te } from "../messages/index.mjs";
|
|
16
|
+
import { packageMetadata as oe } from "../package-metadata.mjs";
|
|
17
17
|
import { hasParent as qe } from "./utils/index.mjs";
|
|
18
|
-
import { hyperlinkOpenIcon as
|
|
19
|
-
const Ae = 250, Ve = 84,
|
|
20
|
-
const
|
|
18
|
+
import { hyperlinkOpenIcon as ne, xIcon as Ge } from "@progress/kendo-svg-icons";
|
|
19
|
+
const Ae = 250, Ve = 84, re = 3, se = 2, je = "#000000", Ue = "#ffffff", ae = (d) => d !== void 0, He = _e(), F = o.forwardRef((d, ie) => {
|
|
20
|
+
const le = !Ie(oe, { component: "Signature" }), ce = Pe(oe), _ = De(He, d), e = o.useMemo(
|
|
21
21
|
() => ({
|
|
22
|
-
strokeWidth:
|
|
23
|
-
smooth:
|
|
24
|
-
popupScale:
|
|
25
|
-
exportScale:
|
|
26
|
-
maximizable:
|
|
27
|
-
disabled:
|
|
28
|
-
required:
|
|
29
|
-
validityStyles:
|
|
30
|
-
onChange:
|
|
31
|
-
onFocus:
|
|
32
|
-
onBlur:
|
|
33
|
-
onOpen:
|
|
34
|
-
onClose:
|
|
35
|
-
size:
|
|
36
|
-
rounded:
|
|
37
|
-
fillMode:
|
|
22
|
+
strokeWidth: i.strokeWidth,
|
|
23
|
+
smooth: i.smooth,
|
|
24
|
+
popupScale: i.popupScale,
|
|
25
|
+
exportScale: i.exportScale,
|
|
26
|
+
maximizable: i.maximizable,
|
|
27
|
+
disabled: i.disabled,
|
|
28
|
+
required: i.required,
|
|
29
|
+
validityStyles: i.validityStyles,
|
|
30
|
+
onChange: i.onChange,
|
|
31
|
+
onFocus: i.onFocus,
|
|
32
|
+
onBlur: i.onBlur,
|
|
33
|
+
onOpen: i.onOpen,
|
|
34
|
+
onClose: i.onClose,
|
|
35
|
+
size: i.size,
|
|
36
|
+
rounded: i.rounded,
|
|
37
|
+
fillMode: i.fillMode,
|
|
38
38
|
..._
|
|
39
39
|
}),
|
|
40
40
|
[_]
|
|
41
|
-
), S = Ne(), u = o.useRef(null), g = o.useRef(null), W = o.useRef(null), N = o.useRef(null), z = o.useRef(null), [r,
|
|
41
|
+
), S = Ne(), u = o.useRef(null), g = o.useRef(null), W = o.useRef(null), N = o.useRef(null), z = o.useRef(null), [r, ue] = o.useState(), [k, q] = o.useState(!1), [E, G] = o.useState(!1), [b, A] = o.useState(), [de, me] = o.useState(), V = ae(e.value) ? e.value : b, [pe, fe] = o.useState(!1), p = ae(e.open), m = p ? e.open : pe, ge = e.maximized || E || !e.maximizable || e.disabled, ke = !(e.maximized && !E), be = !(!(e.value || b) || E || e.readOnly || e.disabled), ve = S.toLanguageString(Z, B[Z]), ye = S.toLanguageString(ee, B[ee]), Ce = S.toLanguageString(te, B[te]), O = e.popupScale || re, x = e.exportScale || se, M = (t) => {
|
|
42
42
|
A(t), e.onChange && e.onChange({ value: t });
|
|
43
43
|
}, he = (t) => {
|
|
44
44
|
r == null || r.loadImage(t.value), M(t.value);
|
|
45
45
|
};
|
|
46
46
|
o.useEffect(() => {
|
|
47
|
-
e.value !==
|
|
47
|
+
e.value !== b && (A(e.value), r == null || r.loadImage(e.value));
|
|
48
48
|
}, [e.value]);
|
|
49
49
|
const Se = () => {
|
|
50
50
|
r == null || r.clear(), M();
|
|
51
51
|
}, v = o.useCallback(
|
|
52
52
|
(t) => {
|
|
53
|
-
p ||
|
|
53
|
+
p || fe(t);
|
|
54
54
|
},
|
|
55
55
|
[p]
|
|
56
56
|
), ze = (t) => {
|
|
57
|
-
var n,
|
|
58
|
-
|
|
57
|
+
var n, s;
|
|
58
|
+
X(t), (s = ((n = z.current) == null ? void 0 : n.element) || g.current) == null || s.focus();
|
|
59
59
|
}, w = o.useCallback(() => {
|
|
60
60
|
let t = je;
|
|
61
61
|
return !e.color && typeof document != "undefined" && u.current && (t = getComputedStyle(u.current).color), e.color || t;
|
|
62
62
|
}, [e.color]), L = o.useCallback(() => {
|
|
63
63
|
let t = Ue;
|
|
64
64
|
return !e.backgroundColor && typeof document != "undefined" && u.current && (t = getComputedStyle(u.current).backgroundColor), e.backgroundColor || t;
|
|
65
|
-
}, [e.backgroundColor]),
|
|
65
|
+
}, [e.backgroundColor]), j = () => ({
|
|
66
66
|
scale: e.maximized ? e.popupScale : 1,
|
|
67
67
|
color: w(),
|
|
68
68
|
backgroundColor: L(),
|
|
69
69
|
strokeWidth: e.strokeWidth,
|
|
70
70
|
smooth: e.smooth,
|
|
71
71
|
readonly: e.readOnly
|
|
72
|
-
}),
|
|
73
|
-
const { width: n, height:
|
|
72
|
+
}), U = async (t) => {
|
|
73
|
+
const { width: n, height: s } = t;
|
|
74
74
|
return await (r == null ? void 0 : r.exportImage({
|
|
75
75
|
width: n * x,
|
|
76
|
-
height:
|
|
76
|
+
height: s * x
|
|
77
77
|
}));
|
|
78
78
|
};
|
|
79
79
|
o.useEffect(() => {
|
|
80
|
-
const t = g.current, n = new Le(t,
|
|
81
|
-
return V && n.loadImage(V),
|
|
80
|
+
const t = g.current, n = new Le(t, j());
|
|
81
|
+
return V && n.loadImage(V), ue(n), () => n.destroy();
|
|
82
82
|
}, []), o.useEffect(() => {
|
|
83
83
|
r == null || r.setOptions({
|
|
84
|
-
onChange: async () => M(await
|
|
84
|
+
onChange: async () => M(await U(J())),
|
|
85
85
|
onDraw: () => G(!0),
|
|
86
86
|
onDrawEnd: () => G(!1)
|
|
87
87
|
});
|
|
88
88
|
}, [r]), Re(
|
|
89
|
-
() => r == null ? void 0 : r.setOptions(
|
|
89
|
+
() => r == null ? void 0 : r.setOptions(j()),
|
|
90
90
|
[e.readOnly, e.color, e.backgroundColor, e.strokeWidth, e.smooth]
|
|
91
91
|
), o.useEffect(() => {
|
|
92
|
-
var
|
|
93
|
-
const t = (c = (
|
|
92
|
+
var s, c;
|
|
93
|
+
const t = (c = (s = W.current) == null ? void 0 : s.element) == null ? void 0 : c.querySelector(".k-overlay");
|
|
94
94
|
if (!t)
|
|
95
95
|
return;
|
|
96
96
|
const n = () => v(!1);
|
|
@@ -99,8 +99,8 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
99
99
|
if (!m || typeof document == "undefined")
|
|
100
100
|
return;
|
|
101
101
|
const t = (n) => {
|
|
102
|
-
var
|
|
103
|
-
n.key === "Escape" && (v(!1), (c = (
|
|
102
|
+
var s, c;
|
|
103
|
+
n.key === "Escape" && (v(!1), (c = (s = z.current) == null ? void 0 : s.element) == null || c.focus());
|
|
104
104
|
};
|
|
105
105
|
return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
|
|
106
106
|
}, [m]), o.useEffect(() => {
|
|
@@ -110,64 +110,64 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
110
110
|
const I = o.useCallback(() => {
|
|
111
111
|
var t;
|
|
112
112
|
return (t = g.current) == null ? void 0 : t.focus();
|
|
113
|
-
}, []), y = o.useCallback(() => e.value, [e.value]),
|
|
114
|
-
const t = e.validationMessage !== void 0,
|
|
113
|
+
}, []), y = o.useCallback(() => e.value, [e.value]), H = o.useCallback(() => e.name, [e.name]), C = o.useCallback(() => e.required, [e.required]), P = o.useCallback(() => {
|
|
114
|
+
const t = e.validationMessage !== void 0, s = !y(), c = e.valid !== void 0 ? e.valid : !C() || !s;
|
|
115
115
|
return {
|
|
116
116
|
customError: t,
|
|
117
117
|
valid: c,
|
|
118
|
-
valueMissing:
|
|
118
|
+
valueMissing: s
|
|
119
119
|
};
|
|
120
|
-
}, [e.validationMessage, e.valid, y, C]), D = o.useCallback(() => e.validityStyles, [e.validityStyles]),
|
|
120
|
+
}, [e.validationMessage, e.valid, y, C]), D = o.useCallback(() => e.validityStyles, [e.validityStyles]), $ = o.useCallback(() => e, [e]), l = o.useCallback(() => {
|
|
121
121
|
const t = {
|
|
122
122
|
element: u.current,
|
|
123
123
|
focus: I
|
|
124
124
|
};
|
|
125
|
-
return Object.defineProperty(t, "name", { get:
|
|
125
|
+
return Object.defineProperty(t, "name", { get: H }), Object.defineProperty(t, "value", { get: y }), Object.defineProperty(t, "validity", { get: P }), Object.defineProperty(t, "validityStyles", { get: D }), Object.defineProperty(t, "required", { get: C }), Object.defineProperty(t, "props", { get: $ }), Object.defineProperty(t, "color", { get: w }), Object.defineProperty(t, "backgroundColor", { get: L }), t;
|
|
126
126
|
}, [
|
|
127
|
-
|
|
127
|
+
H,
|
|
128
128
|
y,
|
|
129
129
|
P,
|
|
130
130
|
D,
|
|
131
131
|
C,
|
|
132
132
|
I,
|
|
133
|
-
|
|
133
|
+
$,
|
|
134
134
|
w,
|
|
135
135
|
L
|
|
136
136
|
]);
|
|
137
|
-
o.useImperativeHandle(
|
|
138
|
-
const
|
|
139
|
-
o.useImperativeHandle(
|
|
137
|
+
o.useImperativeHandle(ie, l);
|
|
138
|
+
const K = o.useRef(null);
|
|
139
|
+
o.useImperativeHandle(K, l), Te("signature", K, e, e.webMcp);
|
|
140
140
|
const Ee = o.useCallback(
|
|
141
141
|
(t) => {
|
|
142
|
-
|
|
142
|
+
k || e.maximized || (q(!0), h(e.onFocus, t, l(), {}));
|
|
143
143
|
},
|
|
144
|
-
[
|
|
144
|
+
[k, e.onFocus, l]
|
|
145
145
|
), Oe = o.useCallback(
|
|
146
146
|
(t) => {
|
|
147
147
|
qe(t.relatedTarget, u.current) || (q(!1), h(e.onBlur, t, l(), {}));
|
|
148
148
|
},
|
|
149
|
-
[
|
|
149
|
+
[k, e.onBlur, l]
|
|
150
150
|
), xe = o.useCallback(
|
|
151
151
|
async (t) => {
|
|
152
|
-
|
|
152
|
+
me(await U(Q())), v(!0), h(e.onOpen, t, l(), {});
|
|
153
153
|
},
|
|
154
|
-
[m, p, e.onOpen, e.value,
|
|
155
|
-
),
|
|
154
|
+
[m, p, e.onOpen, e.value, b, l]
|
|
155
|
+
), X = o.useCallback(
|
|
156
156
|
(t) => {
|
|
157
157
|
v(!1), h(e.onClose, t, l(), {});
|
|
158
158
|
},
|
|
159
159
|
[m, p, e.onClose, l]
|
|
160
160
|
), Me = () => {
|
|
161
161
|
Se(), I();
|
|
162
|
-
},
|
|
163
|
-
var
|
|
164
|
-
const t = e.width || ((
|
|
162
|
+
}, J = () => {
|
|
163
|
+
var s, c;
|
|
164
|
+
const t = e.width || ((s = u.current) == null ? void 0 : s.offsetWidth) || Ae, n = e.height || ((c = u.current) == null ? void 0 : c.offsetHeight) || Ve;
|
|
165
165
|
return {
|
|
166
166
|
width: t,
|
|
167
167
|
height: n
|
|
168
168
|
};
|
|
169
|
-
},
|
|
170
|
-
const { width: t, height: n } =
|
|
169
|
+
}, Q = () => {
|
|
170
|
+
const { width: t, height: n } = J();
|
|
171
171
|
return {
|
|
172
172
|
width: t * O,
|
|
173
173
|
height: n * O
|
|
@@ -184,14 +184,14 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
184
184
|
"k-signature",
|
|
185
185
|
{
|
|
186
186
|
"k-signature-maximized": e.maximized,
|
|
187
|
-
[`k-signature-${
|
|
187
|
+
[`k-signature-${Y.sizeMap[e.size] || e.size}`]: e.size,
|
|
188
188
|
[`k-signature-${e.fillMode}`]: e.fillMode,
|
|
189
189
|
[`k-input-${e.fillMode}`]: e.fillMode,
|
|
190
|
-
[`k-rounded-${
|
|
190
|
+
[`k-rounded-${Y.roundedMap[e.rounded] || e.rounded}`]: e.rounded,
|
|
191
191
|
"k-invalid": !we,
|
|
192
192
|
"k-required": e.required,
|
|
193
193
|
"k-disabled": e.disabled,
|
|
194
|
-
"k-focus":
|
|
194
|
+
"k-focus": k
|
|
195
195
|
},
|
|
196
196
|
e.className
|
|
197
197
|
),
|
|
@@ -203,13 +203,12 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
203
203
|
{
|
|
204
204
|
className: "k-signature-canvas",
|
|
205
205
|
ref: g,
|
|
206
|
-
tabIndex: Be(e.tabIndex, e.disabled),
|
|
207
206
|
role: "img",
|
|
207
|
+
tabIndex: Be(e.tabIndex, e.disabled),
|
|
208
208
|
id: e.id,
|
|
209
209
|
"aria-label": e.ariaLabel,
|
|
210
210
|
"aria-labelledby": e.ariaLabelledBy,
|
|
211
211
|
"aria-describedby": e.ariaDescribedBy,
|
|
212
|
-
"aria-disabled": e.disabled ? "true" : void 0,
|
|
213
212
|
style: e.inputStyle
|
|
214
213
|
}
|
|
215
214
|
),
|
|
@@ -218,38 +217,36 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
218
217
|
{
|
|
219
218
|
type: "button",
|
|
220
219
|
className: T("k-signature-action", "k-signature-maximize", {
|
|
221
|
-
"k-hidden": e.disabled ||
|
|
220
|
+
"k-hidden": e.disabled || ge
|
|
222
221
|
}),
|
|
223
222
|
ref: z,
|
|
224
223
|
icon: "hyperlink-open",
|
|
225
|
-
svgIcon:
|
|
224
|
+
svgIcon: ne,
|
|
226
225
|
size: e.size,
|
|
227
226
|
rounded: e.rounded,
|
|
228
227
|
fillMode: "flat",
|
|
229
228
|
onClick: xe,
|
|
230
|
-
|
|
231
|
-
title: j
|
|
229
|
+
title: ve
|
|
232
230
|
}
|
|
233
231
|
), /* @__PURE__ */ o.createElement(
|
|
234
232
|
R,
|
|
235
233
|
{
|
|
236
234
|
type: "button",
|
|
237
|
-
className: T("k-signature-action", "k-signature-minimize",
|
|
238
|
-
"k-hidden": e.disabled ||
|
|
235
|
+
className: T("k-signature-action", "k-signature-minimize", {
|
|
236
|
+
"k-hidden": e.disabled || ke
|
|
239
237
|
}),
|
|
240
238
|
ref: N,
|
|
241
239
|
icon: "hyperlink-open",
|
|
242
|
-
svgIcon:
|
|
240
|
+
svgIcon: ne,
|
|
243
241
|
size: e.size,
|
|
244
242
|
rounded: e.rounded,
|
|
245
243
|
fillMode: "flat",
|
|
246
|
-
onClick:
|
|
247
|
-
|
|
248
|
-
title: U
|
|
244
|
+
onClick: X,
|
|
245
|
+
title: ye
|
|
249
246
|
}
|
|
250
247
|
)),
|
|
251
248
|
!e.hideLine && /* @__PURE__ */ o.createElement("div", { className: "k-signature-line", style: { zIndex: 2, pointerEvents: "none" } }),
|
|
252
|
-
/* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-bottom" },
|
|
249
|
+
/* @__PURE__ */ o.createElement("div", { className: "k-signature-actions k-signature-actions-bottom" }, be && /* @__PURE__ */ o.createElement(
|
|
253
250
|
R,
|
|
254
251
|
{
|
|
255
252
|
type: "button",
|
|
@@ -260,16 +257,15 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
260
257
|
rounded: e.rounded,
|
|
261
258
|
fillMode: "flat",
|
|
262
259
|
onClick: Me,
|
|
263
|
-
|
|
264
|
-
title: H
|
|
260
|
+
title: Ce
|
|
265
261
|
}
|
|
266
262
|
)),
|
|
267
263
|
m && /* @__PURE__ */ o.createElement(We, { ref: W }, /* @__PURE__ */ o.createElement(
|
|
268
264
|
F,
|
|
269
265
|
{
|
|
270
266
|
...e,
|
|
271
|
-
...
|
|
272
|
-
value:
|
|
267
|
+
...Q(),
|
|
268
|
+
value: de,
|
|
273
269
|
maximized: !0,
|
|
274
270
|
exportScale: 1 / O * x,
|
|
275
271
|
open: !1,
|
|
@@ -277,7 +273,7 @@ const Ae = 250, Ve = 84, le = 3, ce = 2, je = "#000000", Ue = "#ffffff", se = (d
|
|
|
277
273
|
onClose: ze
|
|
278
274
|
}
|
|
279
275
|
)),
|
|
280
|
-
|
|
276
|
+
le && /* @__PURE__ */ o.createElement(Fe, { message: ce })
|
|
281
277
|
);
|
|
282
278
|
});
|
|
283
279
|
F.propTypes = {
|
|
@@ -302,11 +298,11 @@ F.propTypes = {
|
|
|
302
298
|
rounded: a.oneOf(["small", "medium", "large", "none"]),
|
|
303
299
|
fillMode: a.oneOf(["solid", "flat", "outline"])
|
|
304
300
|
};
|
|
305
|
-
const
|
|
301
|
+
const i = {
|
|
306
302
|
strokeWidth: 1,
|
|
307
303
|
smooth: !1,
|
|
308
|
-
popupScale:
|
|
309
|
-
exportScale:
|
|
304
|
+
popupScale: re,
|
|
305
|
+
exportScale: se,
|
|
310
306
|
maximizable: !0,
|
|
311
307
|
disabled: !1,
|
|
312
308
|
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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),i=require("prop-types"),
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),i=require("prop-types"),s=require("@progress/kendo-react-common"),F=require("@progress/kendo-react-intl"),r=require("../messages/index.js"),ae=require("./SliderLabel.js"),j=require("@progress/kendo-react-buttons"),f=require("@progress/kendo-svg-icons");function le(e){const v=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const h=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(v,o,h.get?h:{enumerable:!0,get:()=>e[o]})}}return v.default=e,Object.freeze(v)}const c=le(a),k={step:1,largeStep:10,buttons:!1,vertical:!1,disabled:!1,tabIndex:0},R=c.forwardRef((e,v)=>{var K,M,O;const{step:o=k.step,largeStep:h=k.largeStep,vertical:l=k.vertical,disabled:m=k.disabled,tabIndex:P=k.tabIndex}=e,[U,W]=a.useState((K=e.defaultValue)!=null?K:e.min),[H,V]=a.useState(!1),[E,X]=a.useState(e.dir),N=a.useRef(null),y=a.useRef(null),S=a.useMemo(()=>new F.LocalizationService,[]),z=a.useRef(null),A=e.value!==void 0,w=A&&e.value!==void 0?e.value:U,d=a.useMemo(()=>w<e.min?e.min:w>e.max?e.max:w,[w,e.min,e.max]),C=a.useMemo(()=>{const t=e.max-e.min;return t===0?0:(d-e.min)/t*100},[d,e.min,e.max]),b=(M=e.dir)!=null?M:E;a.useEffect(()=>{if(e.dir===void 0&&y.current){const n=window.getComputedStyle(y.current).direction;n!==E&&X(n)}},[e.dir,E]);const q=a.useCallback(t=>{let n=t;for(;n;){if(n.getAttribute(ae.SLIDER_LABEL_ATTRIBUTE))return!0;n=n.parentElement}return!1},[]),g=a.useCallback((t,n)=>{const u=Math.min(Math.max(n,e.min),e.max);A||W(u),s.dispatchEvent(e.onChange,t,z.current,{value:u})},[e.min,e.max,e.onChange,A]),G=a.useCallback(()=>{V(!0)},[]),Y=a.useCallback(()=>{V(!1)},[]),J=a.useCallback(t=>{if(m)return;let n;t.keyCode===s.Keys.left||t.keyCode===s.Keys.down?n=d-(o||0):t.keyCode===s.Keys.right||t.keyCode===s.Keys.up?n=d+(o||0):t.keyCode===s.Keys.pageDown?n=d-(h||0):t.keyCode===s.Keys.pageUp?n=d+(h||0):t.keyCode===s.Keys.home?n=e.min:t.keyCode===s.Keys.end&&(n=e.max),n!==void 0&&(t.preventDefault(),g(t,n))},[d,o,h,e.min,e.max,g,m]),Q=a.useCallback(t=>{t.preventDefault(),!m&&g(t,d-(o||0))},[d,o,g,m]),Z=a.useCallback(t=>{t.preventDefault(),!m&&g(t,d+(o||0))},[d,o,g,m]),D=a.useCallback(t=>{const n=t.element.getBoundingClientRect();let u;l?u=n.bottom-t.event.clientY:u=b==="rtl"?n.right-t.event.clientX:t.event.clientX-n.left;const x=l?n.height:n.width,I=u/x;g(t,e.min+I*(e.max-e.min))},[l,e.min,e.max,b,g]),$=a.useCallback(t=>{q(t.event.originalEvent.target)||(t.event.isTouch&&t.event.originalEvent.preventDefault(),D(t))},[q,D]),p=a.useCallback(t=>{t.event.originalEvent.preventDefault(),D(t)},[D]),L=a.useCallback(()=>{y.current&&y.current.focus()},[]),ee=a.useCallback(t=>{if(!t.enabled)return t.children;let n,u,x,I;return b==="rtl"?(n=l?f.chevronUpIcon:f.chevronLeftIcon,u=l?f.chevronDownIcon:f.chevronRightIcon,x=l?"chevron-up":"chevron-left",I=l?"chevron-down":"chevron-right"):(n=l?f.chevronUpIcon:f.chevronRightIcon,u=l?f.chevronDownIcon:f.chevronLeftIcon,x=l?"chevron-up":"chevron-right",I=l?"chevron-down":"chevron-left"),c.createElement(c.Fragment,null,c.createElement(j.Button,{className:"k-button-decrease",rounded:"full",icon:I,svgIcon:u,title:t.decrementTitle,onClick:t.decrement}),t.children,c.createElement(j.Button,{className:"k-button-increase",rounded:"full",icon:x,svgIcon:n,title:t.incrementTitle,onClick:t.increment}))},[b,l]);a.useImperativeHandle(v,()=>({props:e,sliderTrack:N.current,focus:L}),[e,L]),s.useWebMcpRegister("slider",v,e,e.webMcp),a.useEffect(()=>{z.current={props:e,sliderTrack:N.current,focus:L}},[e,L]);const te=l?{marginTop:"0.5rem",marginBottom:"0.5rem"}:{marginLeft:"0.5rem",marginRight:"0.5rem"},ne=l?{paddingTop:0,height:"100%"}:{};let T;return l?T={bottom:"calc("+C+"%)",zIndex:1}:b==="rtl"?T={right:"calc("+C+"% - 13px)",zIndex:1}:T={left:"calc("+C+"%)",zIndex:1},c.createElement("div",{ref:y,dir:b,id:e.id,"aria-label":e.ariaLabel||S.toLanguageString(r.sliderAriaLabel,r.messages[r.sliderAriaLabel]),style:{gap:0,...e.style},onFocus:G,onBlur:Y,onKeyDown:J,className:s.classNames("k-slider",{"k-focus":H,"k-disabled":m,"k-slider-horizontal":!l,"k-slider-vertical":l},e.className)},ee({enabled:(O=e.buttons)!=null?O:k.buttons,decrement:Q,increment:Z,incrementTitle:S.toLanguageString(r.sliderIncreaseValue,r.messages[r.sliderIncreaseValue]),decrementTitle:S.toLanguageString(r.sliderDecreaseValue,r.messages[r.sliderDecreaseValue]),children:c.createElement(s.Draggable,{onDrag:p,onPress:$,autoScroll:!1},c.createElement("div",{className:"k-slider-track-wrap",style:{flexGrow:1,position:"relative",touchAction:"none",...te}},e.children&&c.createElement("ul",{className:"k-reset k-slider-items","aria-hidden":"true",style:{margin:0,...ne}},c.Children.map(e.children,(t,n)=>t&&c.cloneElement(t,{position:100*(t.props.position-e.min)/(e.max-e.min),vertical:l,firstTick:n===0,lastTick:n===c.Children.count(e.children)-1},t.props.children))),c.createElement("div",{className:"k-slider-track",style:l?{bottom:0,height:"100%"}:{[b==="rtl"?"right":"left"]:0,width:"100%"},ref:N},c.createElement("div",{className:"k-slider-selection",style:l?{height:C+"%"}:{width:C+"%"}}),c.createElement("span",{role:"slider","aria-valuemin":e.min,"aria-valuemax":e.max,"aria-valuenow":d,"aria-orientation":l?"vertical":void 0,"aria-disabled":m?"true":void 0,"aria-labelledby":e.ariaLabelledBy,"aria-describedby":e.ariaDescribedBy,"aria-label":e.ariaLabel||S.toLanguageString(r.sliderAriaLabel,r.messages[r.sliderAriaLabel]),tabIndex:s.getTabIndex(P,m,void 0),className:"k-draghandle k-draghandle-end",title:S.toLanguageString(r.sliderDragTitle,r.messages[r.sliderDragTitle]),style:T}))))}))});R.displayName="Slider";const _=s.createPropsContext(),B=s.withPropsContext(_,R);B.displayName="KendoReactSlider";B.propTypes={value:i.number,defaultValue:i.number,min:i.number.isRequired,max:i.number.isRequired,step:i.number,largeStep:i.number,onChange:i.func,style:i.object,className:i.string,buttons:i.bool,tabIndex:i.number,disabled:i.bool,vertical:i.bool,id:i.string,ariaDescribedBy:i.string,ariaLabelledBy:i.string,ariaLabel:i.string,dir:i.oneOf(["ltr","rtl"]),children:i.node};F.registerForLocalization(R);exports.Slider=B;exports.SliderPropsContext=_;exports.SliderWithoutContext=R;
|