@progress/kendo-react-inputs 9.4.0-develop.23 → 9.4.0-develop.3
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/NOTICE.txt +51 -40
- package/checkbox/Checkbox.js +1 -1
- package/checkbox/Checkbox.mjs +1 -0
- package/colors/ColorContrastLabels.js +1 -1
- package/colors/ColorContrastLabels.mjs +3 -2
- package/colors/ColorContrastSvg.js +1 -1
- package/colors/ColorContrastSvg.mjs +12 -11
- package/colors/ColorGradient.js +1 -1
- package/colors/ColorGradient.mjs +75 -85
- package/colors/ColorInput.js +1 -1
- package/colors/ColorInput.mjs +45 -55
- package/colors/ColorPalette.js +1 -1
- package/colors/ColorPalette.mjs +47 -55
- package/colors/ColorPicker.js +1 -1
- package/colors/ColorPicker.mjs +183 -312
- package/colors/FlatColorPicker.js +1 -1
- package/colors/FlatColorPicker.mjs +139 -224
- package/colors/HexInput.js +1 -1
- package/colors/HexInput.mjs +9 -10
- package/colors/Picker.js +1 -1
- package/colors/Picker.mjs +23 -22
- package/colors/models/palette-presets.js +1 -1
- package/colors/models/palette-presets.mjs +2 -1
- package/colors/utils/color-cache.js +1 -1
- package/colors/utils/color-cache.mjs +13 -12
- package/colors/utils/color-palette.service.js +1 -1
- package/colors/utils/color-palette.service.mjs +1 -0
- package/colors/utils/color-parser.js +1 -1
- package/colors/utils/color-parser.mjs +6 -5
- package/colors/utils/misc.js +1 -1
- package/colors/utils/misc.mjs +1 -0
- package/colors/utils/svg-calc.js +1 -1
- package/colors/utils/svg-calc.mjs +10 -9
- package/dist/cdn/js/kendo-react-inputs.js +1 -8
- package/index.d.mts +10 -118
- package/index.d.ts +10 -118
- package/index.js +1 -2
- package/index.mjs +4 -4
- package/input/Input.js +1 -1
- package/input/Input.mjs +9 -8
- package/input/InputClearValue.js +1 -1
- package/input/InputClearValue.mjs +4 -3
- package/input/InputPrefix.js +1 -1
- package/input/InputPrefix.mjs +5 -4
- package/input/InputSeparator.js +1 -1
- package/input/InputSeparator.mjs +9 -8
- package/input/InputSuffix.js +1 -1
- package/input/InputSuffix.mjs +5 -4
- package/input/InputValidationIcon.js +1 -1
- package/input/InputValidationIcon.mjs +4 -3
- package/maskedtextbox/MaskedTextBox.js +1 -1
- package/maskedtextbox/MaskedTextBox.mjs +1 -0
- package/maskedtextbox/masking.service.js +1 -1
- package/maskedtextbox/masking.service.mjs +1 -0
- package/maskedtextbox/parsing/combinators.js +1 -1
- package/maskedtextbox/parsing/combinators.mjs +9 -8
- package/maskedtextbox/parsing/parsers.js +1 -1
- package/maskedtextbox/parsing/parsers.mjs +1 -0
- package/maskedtextbox/parsing/result.js +1 -1
- package/maskedtextbox/parsing/result.mjs +8 -7
- package/maskedtextbox/parsing/stream.js +1 -1
- package/maskedtextbox/parsing/stream.mjs +1 -0
- package/maskedtextbox/utils.js +1 -1
- package/maskedtextbox/utils.mjs +12 -11
- package/messages/index.js +1 -1
- package/messages/index.mjs +38 -39
- package/numerictextbox/NumericTextBox.js +1 -1
- package/numerictextbox/NumericTextBox.mjs +1 -0
- package/numerictextbox/utils/index.js +1 -1
- package/numerictextbox/utils/index.mjs +1 -0
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +3 -2
- package/package.json +10 -10
- package/radiobutton/RadioButton.js +1 -1
- package/radiobutton/RadioButton.mjs +1 -0
- package/radiobutton/RadioGroup.js +1 -1
- package/radiobutton/RadioGroup.mjs +1 -0
- package/range-slider/RangeSlider.js +1 -1
- package/range-slider/RangeSlider.mjs +1 -0
- package/range-slider/range-raducer.js +1 -1
- package/range-slider/range-raducer.mjs +3 -2
- package/rating/Rating.js +1 -1
- package/rating/Rating.mjs +1 -0
- package/rating/RatingItem.js +1 -1
- package/rating/RatingItem.mjs +1 -0
- package/rating/rating-reducer.js +1 -1
- package/rating/rating-reducer.mjs +1 -0
- package/rating/utils/index.js +1 -1
- package/rating/utils/index.mjs +1 -0
- package/signature/Signature.js +1 -1
- package/signature/Signature.mjs +1 -0
- package/signature/utils/index.js +1 -1
- package/signature/utils/index.mjs +4 -3
- package/slider/Slider.js +1 -1
- package/slider/Slider.mjs +1 -0
- package/slider/SliderLabel.js +1 -1
- package/slider/SliderLabel.mjs +4 -3
- package/switch/Switch.js +1 -1
- package/switch/Switch.mjs +1 -0
- package/textarea/TextArea.js +1 -1
- package/textarea/TextArea.mjs +1 -0
- package/textbox/Textbox.js +1 -1
- package/textbox/Textbox.mjs +8 -7
- package/common/AdaptiveMode.js +0 -8
- package/common/AdaptiveMode.mjs +0 -73
package/index.d.mts
CHANGED
|
@@ -344,26 +344,6 @@ export declare interface ColorGradientProps {
|
|
|
344
344
|
* Represents the focus event.
|
|
345
345
|
*/
|
|
346
346
|
onFocus?: (event: any) => void;
|
|
347
|
-
/**
|
|
348
|
-
* Configures the `size` of the ColorGradient.
|
|
349
|
-
*
|
|
350
|
-
* The available options are:
|
|
351
|
-
* - `small`
|
|
352
|
-
* - `medium`
|
|
353
|
-
* - `large`
|
|
354
|
-
* - `null`—This option removes the the built-in size styles of the ColorGradient. Allows for custom `padding`.
|
|
355
|
-
*
|
|
356
|
-
* @default `medium`
|
|
357
|
-
*/
|
|
358
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
359
|
-
/**
|
|
360
|
-
* @hidden
|
|
361
|
-
*/
|
|
362
|
-
fillMode?: null | 'solid' | 'flat' | 'outline';
|
|
363
|
-
/**
|
|
364
|
-
* @hidden
|
|
365
|
-
*/
|
|
366
|
-
_adaptive?: boolean;
|
|
367
347
|
}
|
|
368
348
|
|
|
369
349
|
/**
|
|
@@ -408,7 +388,6 @@ export declare class ColorGradientWithoutContext extends React_2.Component<Color
|
|
|
408
388
|
ariaLabelledBy: default_2.Requireable<string>;
|
|
409
389
|
ariaDescribedBy: default_2.Requireable<string>;
|
|
410
390
|
className: default_2.Requireable<string>;
|
|
411
|
-
size: default_2.Requireable<string | null>;
|
|
412
391
|
};
|
|
413
392
|
/**
|
|
414
393
|
* @hidden
|
|
@@ -417,7 +396,6 @@ export declare class ColorGradientWithoutContext extends React_2.Component<Color
|
|
|
417
396
|
opacity: boolean;
|
|
418
397
|
role: string;
|
|
419
398
|
format: "hex" | "rgba" | "rgb";
|
|
420
|
-
size: string;
|
|
421
399
|
};
|
|
422
400
|
/**
|
|
423
401
|
* @hidden
|
|
@@ -572,8 +550,6 @@ declare interface ColorInputProps {
|
|
|
572
550
|
opacity: boolean;
|
|
573
551
|
disabled?: boolean;
|
|
574
552
|
defaultInputMode?: 'rgba' | 'rgb' | 'hex';
|
|
575
|
-
size?: 'small' | 'medium' | 'large' | null;
|
|
576
|
-
fillMode?: 'solid' | 'outline' | 'flat' | null;
|
|
577
553
|
}
|
|
578
554
|
|
|
579
555
|
/** @hidden */
|
|
@@ -696,18 +672,6 @@ export declare interface ColorPaletteProps {
|
|
|
696
672
|
* Sets additional classes to the ColorPalette.
|
|
697
673
|
*/
|
|
698
674
|
className?: string;
|
|
699
|
-
/**
|
|
700
|
-
* Configures the `size` of the ColorPalette.
|
|
701
|
-
*
|
|
702
|
-
* The available options are:
|
|
703
|
-
* - `small`
|
|
704
|
-
* - `medium`
|
|
705
|
-
* - `large`
|
|
706
|
-
* - `null`—This option removes the the built-in size styles of the ColorPalette. Allows for custom `padding`.
|
|
707
|
-
*
|
|
708
|
-
* @default `medium`
|
|
709
|
-
*/
|
|
710
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
711
675
|
}
|
|
712
676
|
|
|
713
677
|
/**
|
|
@@ -747,7 +711,6 @@ export declare class ColorPaletteWithoutContext extends React_2.Component<ColorP
|
|
|
747
711
|
ariaLabelledBy: default_2.Requireable<string>;
|
|
748
712
|
ariaDescribedBy: default_2.Requireable<string>;
|
|
749
713
|
className: default_2.Requireable<string>;
|
|
750
|
-
size: default_2.Requireable<string | null>;
|
|
751
714
|
};
|
|
752
715
|
/**
|
|
753
716
|
* @hidden
|
|
@@ -755,7 +718,6 @@ export declare class ColorPaletteWithoutContext extends React_2.Component<ColorP
|
|
|
755
718
|
static defaultProps: {
|
|
756
719
|
palette: string;
|
|
757
720
|
tileSize: number;
|
|
758
|
-
size: string;
|
|
759
721
|
};
|
|
760
722
|
/**
|
|
761
723
|
* @hidden
|
|
@@ -831,10 +793,6 @@ declare interface ColorPickerActiveColorClick {
|
|
|
831
793
|
* A native DOM event.
|
|
832
794
|
*/
|
|
833
795
|
nativeEvent: any;
|
|
834
|
-
/**
|
|
835
|
-
* The event target.
|
|
836
|
-
*/
|
|
837
|
-
target: ColorPickerHandle;
|
|
838
796
|
}
|
|
839
797
|
|
|
840
798
|
/**
|
|
@@ -867,10 +825,6 @@ export declare interface ColorPickerChangeEvent {
|
|
|
867
825
|
* A native DOM event.
|
|
868
826
|
*/
|
|
869
827
|
nativeEvent: any;
|
|
870
|
-
/**
|
|
871
|
-
* The event target.
|
|
872
|
-
*/
|
|
873
|
-
target: ColorPickerHandle;
|
|
874
828
|
}
|
|
875
829
|
|
|
876
830
|
/**
|
|
@@ -904,10 +858,6 @@ export declare interface ColorPickerGradientSettings {
|
|
|
904
858
|
* Currently, only the RGBA format is supported.
|
|
905
859
|
*/
|
|
906
860
|
backgroundColor?: string;
|
|
907
|
-
/**
|
|
908
|
-
* @hidden
|
|
909
|
-
*/
|
|
910
|
-
_adaptive?: boolean;
|
|
911
861
|
}
|
|
912
862
|
|
|
913
863
|
/**
|
|
@@ -999,24 +949,10 @@ export declare interface ColorPickerProps {
|
|
|
999
949
|
*/
|
|
1000
950
|
title?: string;
|
|
1001
951
|
/**
|
|
1002
|
-
*
|
|
1003
|
-
*
|
|
1004
|
-
* @deprecated
|
|
952
|
+
* Sets the view which the ColorPicker will render in the popup
|
|
953
|
+
* ([see example]({% slug combinedview_colorpicker %})).
|
|
1005
954
|
*/
|
|
1006
955
|
view?: ColorPickerView;
|
|
1007
|
-
/**
|
|
1008
|
-
* Specifies the views that will be rendered in the popup. By default both the gradient and palette views will be rendered.
|
|
1009
|
-
*
|
|
1010
|
-
* @default ['gradient', 'palette']`
|
|
1011
|
-
*/
|
|
1012
|
-
views?: ColorPickerView[];
|
|
1013
|
-
/**
|
|
1014
|
-
* Sets the initially active view in the popup when both 'gradient' and 'palette' views are rendered.
|
|
1015
|
-
* Use with the `views` property.
|
|
1016
|
-
*
|
|
1017
|
-
* @default 'gradient''
|
|
1018
|
-
*/
|
|
1019
|
-
activeView?: ColorPickerView;
|
|
1020
956
|
/**
|
|
1021
957
|
* Represents the `dir` HTML attribute.
|
|
1022
958
|
*/
|
|
@@ -1047,10 +983,6 @@ export declare interface ColorPickerProps {
|
|
|
1047
983
|
* ([see example]({% slug customizecolorpicker_colorpicker %}#toc-customizing-the-palette-popup)).
|
|
1048
984
|
*/
|
|
1049
985
|
paletteSettings?: ColorPickerPaletteSettings;
|
|
1050
|
-
/**
|
|
1051
|
-
* Configures the FlatColorPicker that is displayed in the ColorPicker popup via `views` property.
|
|
1052
|
-
*/
|
|
1053
|
-
flatColorPickerSettings?: FlatColorPickerProps;
|
|
1054
986
|
/**
|
|
1055
987
|
* Configures the popup of the ColorPicker.
|
|
1056
988
|
*/
|
|
@@ -1096,10 +1028,10 @@ export declare interface ColorPickerProps {
|
|
|
1096
1028
|
* Configures the `size` of the ColorPicker.
|
|
1097
1029
|
*
|
|
1098
1030
|
* The available options are:
|
|
1099
|
-
* -
|
|
1100
|
-
* -
|
|
1101
|
-
* -
|
|
1102
|
-
* -
|
|
1031
|
+
* - small
|
|
1032
|
+
* - medium
|
|
1033
|
+
* - large
|
|
1034
|
+
* - null—Does not set a size `className`.
|
|
1103
1035
|
*
|
|
1104
1036
|
* @default `medium`
|
|
1105
1037
|
*/
|
|
@@ -1133,14 +1065,6 @@ export declare interface ColorPickerProps {
|
|
|
1133
1065
|
* Sets additional classes to the ColorPicker.
|
|
1134
1066
|
*/
|
|
1135
1067
|
className?: string;
|
|
1136
|
-
/**
|
|
1137
|
-
* Providing different rendering of the popup element based on the screen dimensions.
|
|
1138
|
-
*/
|
|
1139
|
-
adaptive?: boolean;
|
|
1140
|
-
/**
|
|
1141
|
-
* Specifies the text that is rendered as title in the adaptive popup.
|
|
1142
|
-
*/
|
|
1143
|
-
adaptiveTitle?: string;
|
|
1144
1068
|
}
|
|
1145
1069
|
|
|
1146
1070
|
/**
|
|
@@ -1153,12 +1077,12 @@ export declare const ColorPickerPropsContext: React_2.Context<(p: ColorPickerPro
|
|
|
1153
1077
|
|
|
1154
1078
|
/**
|
|
1155
1079
|
* Specifies the view which the ColorPicker will render in the popup
|
|
1156
|
-
* ([see example]({% slug
|
|
1080
|
+
* ([see example]({% slug combinedview_colorpicker %})).
|
|
1157
1081
|
*
|
|
1158
1082
|
* The possible values are:
|
|
1159
|
-
* * `palette`
|
|
1083
|
+
* * (Default) `palette`
|
|
1160
1084
|
* * `gradient`
|
|
1161
|
-
* *
|
|
1085
|
+
* * `combo`
|
|
1162
1086
|
*/
|
|
1163
1087
|
export declare type ColorPickerView = 'gradient' | 'palette' | 'combo';
|
|
1164
1088
|
|
|
@@ -1281,24 +1205,9 @@ export declare interface FlatColorPickerProps {
|
|
|
1281
1205
|
*/
|
|
1282
1206
|
disabled?: boolean;
|
|
1283
1207
|
/**
|
|
1284
|
-
*
|
|
1285
|
-
*
|
|
1286
|
-
* @deprecated
|
|
1208
|
+
* Sets the FlatColorPicker view. The default is `ColorGradient`.
|
|
1287
1209
|
*/
|
|
1288
1210
|
view?: 'ColorGradient' | 'ColorPalette' | undefined;
|
|
1289
|
-
/**
|
|
1290
|
-
* Specifies the views that will be rendered. By default both the gradient and palette views will be rendered.
|
|
1291
|
-
*
|
|
1292
|
-
* @default ['gradient', 'palette']`
|
|
1293
|
-
*/
|
|
1294
|
-
views?: ColorPickerView[];
|
|
1295
|
-
/**
|
|
1296
|
-
* Sets the initially active view when both 'gradient' and 'palette' views are rendered.
|
|
1297
|
-
* Use with the `views` property.
|
|
1298
|
-
*
|
|
1299
|
-
* @default 'gradient''
|
|
1300
|
-
*/
|
|
1301
|
-
activeView?: ColorPickerView;
|
|
1302
1211
|
/**
|
|
1303
1212
|
* Sets custom header component.
|
|
1304
1213
|
*/
|
|
@@ -1315,22 +1224,6 @@ export declare interface FlatColorPickerProps {
|
|
|
1315
1224
|
* Specifies whether action buttons will be rendered in the footer.
|
|
1316
1225
|
*/
|
|
1317
1226
|
showButtons?: boolean;
|
|
1318
|
-
/**
|
|
1319
|
-
* Configures the `size` of the FlatColorPicker.
|
|
1320
|
-
*
|
|
1321
|
-
* The available options are:
|
|
1322
|
-
* - `small`
|
|
1323
|
-
* - `medium`
|
|
1324
|
-
* - `large`
|
|
1325
|
-
* - `null`—This option removes the the built-in size styles of the FlatColorPicker. Allows for custom `padding`.
|
|
1326
|
-
*
|
|
1327
|
-
* @default `medium`
|
|
1328
|
-
*/
|
|
1329
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
1330
|
-
/**
|
|
1331
|
-
* @hidden
|
|
1332
|
-
*/
|
|
1333
|
-
_gradientSettings?: ColorPickerGradientSettings;
|
|
1334
1227
|
}
|
|
1335
1228
|
|
|
1336
1229
|
export { FormComponentValidity }
|
|
@@ -1550,7 +1443,6 @@ export declare const inputsMessages: {
|
|
|
1550
1443
|
"flatColorPicker.colorGradientBtn": string;
|
|
1551
1444
|
"flatColorPicker.colorPaletteBtn": string;
|
|
1552
1445
|
"flatColorPicker.clearBtn": string;
|
|
1553
|
-
"colorPicker.adaptiveTitle": string;
|
|
1554
1446
|
"checkbox.validation": string;
|
|
1555
1447
|
"checkbox.optionalText": string;
|
|
1556
1448
|
"radioButton.validation": string;
|
package/index.d.ts
CHANGED
|
@@ -344,26 +344,6 @@ export declare interface ColorGradientProps {
|
|
|
344
344
|
* Represents the focus event.
|
|
345
345
|
*/
|
|
346
346
|
onFocus?: (event: any) => void;
|
|
347
|
-
/**
|
|
348
|
-
* Configures the `size` of the ColorGradient.
|
|
349
|
-
*
|
|
350
|
-
* The available options are:
|
|
351
|
-
* - `small`
|
|
352
|
-
* - `medium`
|
|
353
|
-
* - `large`
|
|
354
|
-
* - `null`—This option removes the the built-in size styles of the ColorGradient. Allows for custom `padding`.
|
|
355
|
-
*
|
|
356
|
-
* @default `medium`
|
|
357
|
-
*/
|
|
358
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
359
|
-
/**
|
|
360
|
-
* @hidden
|
|
361
|
-
*/
|
|
362
|
-
fillMode?: null | 'solid' | 'flat' | 'outline';
|
|
363
|
-
/**
|
|
364
|
-
* @hidden
|
|
365
|
-
*/
|
|
366
|
-
_adaptive?: boolean;
|
|
367
347
|
}
|
|
368
348
|
|
|
369
349
|
/**
|
|
@@ -408,7 +388,6 @@ export declare class ColorGradientWithoutContext extends React_2.Component<Color
|
|
|
408
388
|
ariaLabelledBy: default_2.Requireable<string>;
|
|
409
389
|
ariaDescribedBy: default_2.Requireable<string>;
|
|
410
390
|
className: default_2.Requireable<string>;
|
|
411
|
-
size: default_2.Requireable<string | null>;
|
|
412
391
|
};
|
|
413
392
|
/**
|
|
414
393
|
* @hidden
|
|
@@ -417,7 +396,6 @@ export declare class ColorGradientWithoutContext extends React_2.Component<Color
|
|
|
417
396
|
opacity: boolean;
|
|
418
397
|
role: string;
|
|
419
398
|
format: "hex" | "rgba" | "rgb";
|
|
420
|
-
size: string;
|
|
421
399
|
};
|
|
422
400
|
/**
|
|
423
401
|
* @hidden
|
|
@@ -572,8 +550,6 @@ declare interface ColorInputProps {
|
|
|
572
550
|
opacity: boolean;
|
|
573
551
|
disabled?: boolean;
|
|
574
552
|
defaultInputMode?: 'rgba' | 'rgb' | 'hex';
|
|
575
|
-
size?: 'small' | 'medium' | 'large' | null;
|
|
576
|
-
fillMode?: 'solid' | 'outline' | 'flat' | null;
|
|
577
553
|
}
|
|
578
554
|
|
|
579
555
|
/** @hidden */
|
|
@@ -696,18 +672,6 @@ export declare interface ColorPaletteProps {
|
|
|
696
672
|
* Sets additional classes to the ColorPalette.
|
|
697
673
|
*/
|
|
698
674
|
className?: string;
|
|
699
|
-
/**
|
|
700
|
-
* Configures the `size` of the ColorPalette.
|
|
701
|
-
*
|
|
702
|
-
* The available options are:
|
|
703
|
-
* - `small`
|
|
704
|
-
* - `medium`
|
|
705
|
-
* - `large`
|
|
706
|
-
* - `null`—This option removes the the built-in size styles of the ColorPalette. Allows for custom `padding`.
|
|
707
|
-
*
|
|
708
|
-
* @default `medium`
|
|
709
|
-
*/
|
|
710
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
711
675
|
}
|
|
712
676
|
|
|
713
677
|
/**
|
|
@@ -747,7 +711,6 @@ export declare class ColorPaletteWithoutContext extends React_2.Component<ColorP
|
|
|
747
711
|
ariaLabelledBy: default_2.Requireable<string>;
|
|
748
712
|
ariaDescribedBy: default_2.Requireable<string>;
|
|
749
713
|
className: default_2.Requireable<string>;
|
|
750
|
-
size: default_2.Requireable<string | null>;
|
|
751
714
|
};
|
|
752
715
|
/**
|
|
753
716
|
* @hidden
|
|
@@ -755,7 +718,6 @@ export declare class ColorPaletteWithoutContext extends React_2.Component<ColorP
|
|
|
755
718
|
static defaultProps: {
|
|
756
719
|
palette: string;
|
|
757
720
|
tileSize: number;
|
|
758
|
-
size: string;
|
|
759
721
|
};
|
|
760
722
|
/**
|
|
761
723
|
* @hidden
|
|
@@ -831,10 +793,6 @@ declare interface ColorPickerActiveColorClick {
|
|
|
831
793
|
* A native DOM event.
|
|
832
794
|
*/
|
|
833
795
|
nativeEvent: any;
|
|
834
|
-
/**
|
|
835
|
-
* The event target.
|
|
836
|
-
*/
|
|
837
|
-
target: ColorPickerHandle;
|
|
838
796
|
}
|
|
839
797
|
|
|
840
798
|
/**
|
|
@@ -867,10 +825,6 @@ export declare interface ColorPickerChangeEvent {
|
|
|
867
825
|
* A native DOM event.
|
|
868
826
|
*/
|
|
869
827
|
nativeEvent: any;
|
|
870
|
-
/**
|
|
871
|
-
* The event target.
|
|
872
|
-
*/
|
|
873
|
-
target: ColorPickerHandle;
|
|
874
828
|
}
|
|
875
829
|
|
|
876
830
|
/**
|
|
@@ -904,10 +858,6 @@ export declare interface ColorPickerGradientSettings {
|
|
|
904
858
|
* Currently, only the RGBA format is supported.
|
|
905
859
|
*/
|
|
906
860
|
backgroundColor?: string;
|
|
907
|
-
/**
|
|
908
|
-
* @hidden
|
|
909
|
-
*/
|
|
910
|
-
_adaptive?: boolean;
|
|
911
861
|
}
|
|
912
862
|
|
|
913
863
|
/**
|
|
@@ -999,24 +949,10 @@ export declare interface ColorPickerProps {
|
|
|
999
949
|
*/
|
|
1000
950
|
title?: string;
|
|
1001
951
|
/**
|
|
1002
|
-
*
|
|
1003
|
-
*
|
|
1004
|
-
* @deprecated
|
|
952
|
+
* Sets the view which the ColorPicker will render in the popup
|
|
953
|
+
* ([see example]({% slug combinedview_colorpicker %})).
|
|
1005
954
|
*/
|
|
1006
955
|
view?: ColorPickerView;
|
|
1007
|
-
/**
|
|
1008
|
-
* Specifies the views that will be rendered in the popup. By default both the gradient and palette views will be rendered.
|
|
1009
|
-
*
|
|
1010
|
-
* @default ['gradient', 'palette']`
|
|
1011
|
-
*/
|
|
1012
|
-
views?: ColorPickerView[];
|
|
1013
|
-
/**
|
|
1014
|
-
* Sets the initially active view in the popup when both 'gradient' and 'palette' views are rendered.
|
|
1015
|
-
* Use with the `views` property.
|
|
1016
|
-
*
|
|
1017
|
-
* @default 'gradient''
|
|
1018
|
-
*/
|
|
1019
|
-
activeView?: ColorPickerView;
|
|
1020
956
|
/**
|
|
1021
957
|
* Represents the `dir` HTML attribute.
|
|
1022
958
|
*/
|
|
@@ -1047,10 +983,6 @@ export declare interface ColorPickerProps {
|
|
|
1047
983
|
* ([see example]({% slug customizecolorpicker_colorpicker %}#toc-customizing-the-palette-popup)).
|
|
1048
984
|
*/
|
|
1049
985
|
paletteSettings?: ColorPickerPaletteSettings;
|
|
1050
|
-
/**
|
|
1051
|
-
* Configures the FlatColorPicker that is displayed in the ColorPicker popup via `views` property.
|
|
1052
|
-
*/
|
|
1053
|
-
flatColorPickerSettings?: FlatColorPickerProps;
|
|
1054
986
|
/**
|
|
1055
987
|
* Configures the popup of the ColorPicker.
|
|
1056
988
|
*/
|
|
@@ -1096,10 +1028,10 @@ export declare interface ColorPickerProps {
|
|
|
1096
1028
|
* Configures the `size` of the ColorPicker.
|
|
1097
1029
|
*
|
|
1098
1030
|
* The available options are:
|
|
1099
|
-
* -
|
|
1100
|
-
* -
|
|
1101
|
-
* -
|
|
1102
|
-
* -
|
|
1031
|
+
* - small
|
|
1032
|
+
* - medium
|
|
1033
|
+
* - large
|
|
1034
|
+
* - null—Does not set a size `className`.
|
|
1103
1035
|
*
|
|
1104
1036
|
* @default `medium`
|
|
1105
1037
|
*/
|
|
@@ -1133,14 +1065,6 @@ export declare interface ColorPickerProps {
|
|
|
1133
1065
|
* Sets additional classes to the ColorPicker.
|
|
1134
1066
|
*/
|
|
1135
1067
|
className?: string;
|
|
1136
|
-
/**
|
|
1137
|
-
* Providing different rendering of the popup element based on the screen dimensions.
|
|
1138
|
-
*/
|
|
1139
|
-
adaptive?: boolean;
|
|
1140
|
-
/**
|
|
1141
|
-
* Specifies the text that is rendered as title in the adaptive popup.
|
|
1142
|
-
*/
|
|
1143
|
-
adaptiveTitle?: string;
|
|
1144
1068
|
}
|
|
1145
1069
|
|
|
1146
1070
|
/**
|
|
@@ -1153,12 +1077,12 @@ export declare const ColorPickerPropsContext: React_2.Context<(p: ColorPickerPro
|
|
|
1153
1077
|
|
|
1154
1078
|
/**
|
|
1155
1079
|
* Specifies the view which the ColorPicker will render in the popup
|
|
1156
|
-
* ([see example]({% slug
|
|
1080
|
+
* ([see example]({% slug combinedview_colorpicker %})).
|
|
1157
1081
|
*
|
|
1158
1082
|
* The possible values are:
|
|
1159
|
-
* * `palette`
|
|
1083
|
+
* * (Default) `palette`
|
|
1160
1084
|
* * `gradient`
|
|
1161
|
-
* *
|
|
1085
|
+
* * `combo`
|
|
1162
1086
|
*/
|
|
1163
1087
|
export declare type ColorPickerView = 'gradient' | 'palette' | 'combo';
|
|
1164
1088
|
|
|
@@ -1281,24 +1205,9 @@ export declare interface FlatColorPickerProps {
|
|
|
1281
1205
|
*/
|
|
1282
1206
|
disabled?: boolean;
|
|
1283
1207
|
/**
|
|
1284
|
-
*
|
|
1285
|
-
*
|
|
1286
|
-
* @deprecated
|
|
1208
|
+
* Sets the FlatColorPicker view. The default is `ColorGradient`.
|
|
1287
1209
|
*/
|
|
1288
1210
|
view?: 'ColorGradient' | 'ColorPalette' | undefined;
|
|
1289
|
-
/**
|
|
1290
|
-
* Specifies the views that will be rendered. By default both the gradient and palette views will be rendered.
|
|
1291
|
-
*
|
|
1292
|
-
* @default ['gradient', 'palette']`
|
|
1293
|
-
*/
|
|
1294
|
-
views?: ColorPickerView[];
|
|
1295
|
-
/**
|
|
1296
|
-
* Sets the initially active view when both 'gradient' and 'palette' views are rendered.
|
|
1297
|
-
* Use with the `views` property.
|
|
1298
|
-
*
|
|
1299
|
-
* @default 'gradient''
|
|
1300
|
-
*/
|
|
1301
|
-
activeView?: ColorPickerView;
|
|
1302
1211
|
/**
|
|
1303
1212
|
* Sets custom header component.
|
|
1304
1213
|
*/
|
|
@@ -1315,22 +1224,6 @@ export declare interface FlatColorPickerProps {
|
|
|
1315
1224
|
* Specifies whether action buttons will be rendered in the footer.
|
|
1316
1225
|
*/
|
|
1317
1226
|
showButtons?: boolean;
|
|
1318
|
-
/**
|
|
1319
|
-
* Configures the `size` of the FlatColorPicker.
|
|
1320
|
-
*
|
|
1321
|
-
* The available options are:
|
|
1322
|
-
* - `small`
|
|
1323
|
-
* - `medium`
|
|
1324
|
-
* - `large`
|
|
1325
|
-
* - `null`—This option removes the the built-in size styles of the FlatColorPicker. Allows for custom `padding`.
|
|
1326
|
-
*
|
|
1327
|
-
* @default `medium`
|
|
1328
|
-
*/
|
|
1329
|
-
size?: null | 'small' | 'medium' | 'large';
|
|
1330
|
-
/**
|
|
1331
|
-
* @hidden
|
|
1332
|
-
*/
|
|
1333
|
-
_gradientSettings?: ColorPickerGradientSettings;
|
|
1334
1227
|
}
|
|
1335
1228
|
|
|
1336
1229
|
export { FormComponentValidity }
|
|
@@ -1550,7 +1443,6 @@ export declare const inputsMessages: {
|
|
|
1550
1443
|
"flatColorPicker.colorGradientBtn": string;
|
|
1551
1444
|
"flatColorPicker.colorPaletteBtn": string;
|
|
1552
1445
|
"flatColorPicker.clearBtn": string;
|
|
1553
|
-
"colorPicker.adaptiveTitle": string;
|
|
1554
1446
|
"checkbox.validation": string;
|
|
1555
1447
|
"checkbox.optionalText": string;
|
|
1556
1448
|
"radioButton.validation": string;
|
package/index.js
CHANGED
|
@@ -5,5 +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";
|
|
9
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("./colors/ColorInput.js"),t=require("./messages/index.js"),o=require("./colors/ColorGradient.js"),r=require("./colors/ColorPalette.js"),q=require("./colors/models/palette-presets.js"),n=require("./colors/ColorPicker.js"),h=require("./colors/FlatColorPicker.js"),i=require("./input/Input.js"),u=require("./maskedtextbox/MaskedTextBox.js"),B=require("./maskedtextbox/utils.js"),a=require("./numerictextbox/NumericTextBox.js"),s=require("./slider/Slider.js"),x=require("./slider/SliderLabel.js"),k=require("./numerictextbox/utils/index.js"),c=require("./range-slider/range-raducer.js"),l=require("./range-slider/RangeSlider.js"),C=require("./switch/Switch.js"),p=require("./checkbox/Checkbox.js"),d=require("./radiobutton/RadioGroup.js"),P=require("./radiobutton/RadioButton.js"),R=require("./textarea/TextArea.js"),I=require("./rating/Rating.js"),A=require("./rating/RatingItem.js"),S=require("./rating/rating-reducer.js"),e=require("./rating/utils/index.js"),T=require("./signature/Signature.js"),m=require("./textbox/Textbox.js"),E=require("./input/InputClearValue.js"),G=require("./input/InputPrefix.js"),N=require("./input/InputSeparator.js"),b=require("./input/InputSuffix.js"),f=require("./input/InputValidationIcon.js");exports.ColorInput=g;exports.inputsMessages=t.messages;exports.numericDecreaseValue=t.numericDecreaseValue;exports.numericIncreaseValue=t.numericIncreaseValue;exports.ColorGradient=o.ColorGradient;exports.ColorGradientPropsContext=o.ColorGradientPropsContext;exports.ColorGradientWithoutContext=o.ColorGradientWithoutContext;exports.ColorPalette=r.ColorPalette;exports.ColorPalettePropsContext=r.ColorPalettePropsContext;exports.ColorPaletteWithoutContext=r.ColorPaletteWithoutContext;exports.PALETTEPRESETS=q.PALETTEPRESETS;exports.ColorPicker=n.ColorPicker;exports.ColorPickerPropsContext=n.ColorPickerPropsContext;exports.FlatColorPicker=h.FlatColorPicker;exports.Input=i.Input;exports.InputPropsContext=i.InputPropsContext;exports.MaskedTextBox=u.MaskedTextBox;exports.MaskedTextBoxWithoutContext=u.MaskedTextBoxWithoutContext;exports.maskingChanged=B.maskingChanged;exports.NumericTextBox=a.NumericTextBox;exports.NumericTextBoxPropsContext=a.NumericTextBoxPropsContext;exports.Slider=s.Slider;exports.SliderWithoutContext=s.SliderWithoutContext;exports.SLIDER_LABEL_ATTRIBUTE=x.SLIDER_LABEL_ATTRIBUTE;exports.SliderLabel=x.SliderLabel;exports.sanitizeNumber=k.sanitizeNumber;exports.RANGE_ACTION=c.RANGE_ACTION;exports.rangeReducer=c.rangeReducer;exports.RangeSlider=l.RangeSlider;exports.RangeSliderPropsContext=l.RangeSliderPropsContext;exports.Switch=C.Switch;exports.SwitchWithoutContext=C.SwitchWithoutContext;exports.Checkbox=p.Checkbox;exports.CheckboxPropsContext=p.CheckboxPropsContext;exports.RadioGroup=d.RadioGroup;exports.RadioGroupPropsContext=d.RadioGroupPropsContext;exports.RadioButton=P.RadioButton;exports.RadioButtonPropsContext=P.RadioButtonPropsContext;exports.TextArea=R.TextArea;exports.TextAreaPropsContext=R.TextAreaPropsContext;exports.Rating=I.Rating;exports.RatingPropsContext=I.RatingPropsContext;exports.RatingItem=A.RatingItem;exports.RATING_ACTION=S.RATING_ACTION;exports.ratingReducer=S.ratingReducer;exports.isCorrectValue=e.isCorrectValue;exports.isHalf=e.isHalf;exports.isSelected=e.isSelected;exports.toRound=e.toRound;exports.Signature=T.Signature;exports.SignaturePropsContext=T.SignaturePropsContext;exports.TextBox=m.TextBox;exports.InputClearValue=E.InputClearValue;exports.InputPrefix=G.InputPrefix;exports.InputSeparator=N.InputSeparator;exports.InputSuffix=b.InputSuffix;exports.InputValidationIcon=f.InputValidationIcon;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("./colors/ColorInput.js"),t=require("./messages/index.js"),o=require("./colors/ColorGradient.js"),r=require("./colors/ColorPalette.js"),q=require("./colors/models/palette-presets.js"),n=require("./colors/ColorPicker.js"),h=require("./colors/FlatColorPicker.js"),i=require("./input/Input.js"),u=require("./maskedtextbox/MaskedTextBox.js"),B=require("./maskedtextbox/utils.js"),a=require("./numerictextbox/NumericTextBox.js"),s=require("./slider/Slider.js"),c=require("./slider/SliderLabel.js"),k=require("./numerictextbox/utils/index.js"),x=require("./range-slider/range-raducer.js"),l=require("./range-slider/RangeSlider.js"),C=require("./switch/Switch.js"),p=require("./checkbox/Checkbox.js"),d=require("./radiobutton/RadioGroup.js"),P=require("./radiobutton/RadioButton.js"),R=require("./textarea/TextArea.js"),I=require("./rating/Rating.js"),A=require("./rating/RatingItem.js"),S=require("./rating/rating-reducer.js"),e=require("./rating/utils/index.js"),T=require("./signature/Signature.js"),m=require("./textbox/Textbox.js"),E=require("./input/InputClearValue.js"),G=require("./input/InputPrefix.js"),N=require("./input/InputSeparator.js"),b=require("./input/InputSuffix.js"),f=require("./input/InputValidationIcon.js");exports.ColorInput=g;exports.inputsMessages=t.messages;exports.numericDecreaseValue=t.numericDecreaseValue;exports.numericIncreaseValue=t.numericIncreaseValue;exports.ColorGradient=o.ColorGradient;exports.ColorGradientPropsContext=o.ColorGradientPropsContext;exports.ColorGradientWithoutContext=o.ColorGradientWithoutContext;exports.ColorPalette=r.ColorPalette;exports.ColorPalettePropsContext=r.ColorPalettePropsContext;exports.ColorPaletteWithoutContext=r.ColorPaletteWithoutContext;exports.PALETTEPRESETS=q.PALETTEPRESETS;exports.ColorPicker=n.ColorPicker;exports.ColorPickerPropsContext=n.ColorPickerPropsContext;exports.FlatColorPicker=h.FlatColorPicker;exports.Input=i.Input;exports.InputPropsContext=i.InputPropsContext;exports.MaskedTextBox=u.MaskedTextBox;exports.MaskedTextBoxWithoutContext=u.MaskedTextBoxWithoutContext;exports.maskingChanged=B.maskingChanged;exports.NumericTextBox=a.NumericTextBox;exports.NumericTextBoxPropsContext=a.NumericTextBoxPropsContext;exports.Slider=s.Slider;exports.SliderWithoutContext=s.SliderWithoutContext;exports.SLIDER_LABEL_ATTRIBUTE=c.SLIDER_LABEL_ATTRIBUTE;exports.SliderLabel=c.SliderLabel;exports.sanitizeNumber=k.sanitizeNumber;exports.RANGE_ACTION=x.RANGE_ACTION;exports.rangeReducer=x.rangeReducer;exports.RangeSlider=l.RangeSlider;exports.RangeSliderPropsContext=l.RangeSliderPropsContext;exports.Switch=C.Switch;exports.SwitchWithoutContext=C.SwitchWithoutContext;exports.Checkbox=p.Checkbox;exports.CheckboxPropsContext=p.CheckboxPropsContext;exports.RadioGroup=d.RadioGroup;exports.RadioGroupPropsContext=d.RadioGroupPropsContext;exports.RadioButton=P.RadioButton;exports.RadioButtonPropsContext=P.RadioButtonPropsContext;exports.TextArea=R.TextArea;exports.TextAreaPropsContext=R.TextAreaPropsContext;exports.Rating=I.Rating;exports.RatingPropsContext=I.RatingPropsContext;exports.RatingItem=A.RatingItem;exports.RATING_ACTION=S.RATING_ACTION;exports.ratingReducer=S.ratingReducer;exports.isCorrectValue=e.isCorrectValue;exports.isHalf=e.isHalf;exports.isSelected=e.isSelected;exports.toRound=e.toRound;exports.Signature=T.Signature;exports.SignaturePropsContext=T.SignaturePropsContext;exports.TextBox=m.TextBox;exports.InputClearValue=E.InputClearValue;exports.InputPrefix=G.InputPrefix;exports.InputSeparator=N.InputSeparator;exports.InputSuffix=b.InputSuffix;exports.InputValidationIcon=f.InputValidationIcon;
|
package/index.mjs
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
|
-
import { default as
|
|
9
|
+
import { default as e } from "./colors/ColorInput.mjs";
|
|
10
10
|
import { messages as x, numericDecreaseValue as p, numericIncreaseValue as n } from "./messages/index.mjs";
|
|
11
11
|
import { ColorGradient as i, ColorGradientPropsContext as m, ColorGradientWithoutContext as f } from "./colors/ColorGradient.mjs";
|
|
12
12
|
import { ColorPalette as C, ColorPalettePropsContext as s, ColorPaletteWithoutContext as l } from "./colors/ColorPalette.mjs";
|
|
@@ -25,7 +25,7 @@ import { RangeSlider as v, RangeSliderPropsContext as y } from "./range-slider/R
|
|
|
25
25
|
import { Switch as K, SwitchWithoutContext as Q } from "./switch/Switch.mjs";
|
|
26
26
|
import { Checkbox as Y, CheckboxPropsContext as Z } from "./checkbox/Checkbox.mjs";
|
|
27
27
|
import { RadioGroup as oo, RadioGroupPropsContext as to } from "./radiobutton/RadioGroup.mjs";
|
|
28
|
-
import { RadioButton as
|
|
28
|
+
import { RadioButton as ro, RadioButtonPropsContext as xo } from "./radiobutton/RadioButton.mjs";
|
|
29
29
|
import { TextArea as no, TextAreaPropsContext as ao } from "./textarea/TextArea.mjs";
|
|
30
30
|
import { Rating as mo, RatingPropsContext as fo } from "./rating/Rating.mjs";
|
|
31
31
|
import { RatingItem as Co } from "./rating/RatingItem.mjs";
|
|
@@ -44,7 +44,7 @@ export {
|
|
|
44
44
|
i as ColorGradient,
|
|
45
45
|
m as ColorGradientPropsContext,
|
|
46
46
|
f as ColorGradientWithoutContext,
|
|
47
|
-
|
|
47
|
+
e as ColorInput,
|
|
48
48
|
C as ColorPalette,
|
|
49
49
|
s as ColorPalettePropsContext,
|
|
50
50
|
l as ColorPaletteWithoutContext,
|
|
@@ -65,7 +65,7 @@ export {
|
|
|
65
65
|
P as PALETTEPRESETS,
|
|
66
66
|
U as RANGE_ACTION,
|
|
67
67
|
lo as RATING_ACTION,
|
|
68
|
-
|
|
68
|
+
ro as RadioButton,
|
|
69
69
|
xo as RadioButtonPropsContext,
|
|
70
70
|
oo as RadioGroup,
|
|
71
71
|
to as RadioGroupPropsContext,
|
package/input/Input.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 W=require("react"),a=require("prop-types"),l=require("@progress/kendo-react-common"),X=require("@progress/kendo-react-labels"),Y=require("../package-metadata.js");function Z(s){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const u in s)if(u!=="default"){const c=Object.getOwnPropertyDescriptor(s,u);Object.defineProperty(o,u,c.get?c:{enumerable:!0,get:()=>s[u]})}}return o.default=s,Object.freeze(o)}const r=Z(W),m=r.forwardRef((s,o)=>{const c=r.useContext(O).call(void 0,s);l.validatePackage(Y.packageMetadata);const[,R]=r.useReducer(t=>t,!0),n=l.applyDefaultProps(c,$),{className:N,label:p,labelClassName:x,id:E,validationMessage:h,defaultValue:S,valid:C,unstyled:V,visited:ee,touched:te,modified:ae,autoFocus:q,ariaLabelledBy:w,ariaDescribedBy:D,validityStyles:I,style:P,ariaLabel:F,...U}=n,j=l.useUnstyled(),f=V||j,B=f&&f.uInput,T=l.useId(),[_,A]=r.useState({value:S}),M=E||T,e=r.useRef(null),d=r.useRef(void 0),y=r.useRef(null),G=()=>{e.current&&e.current.focus()},g=()=>d.current!==void 0?d.current:n.value!==void 0?n.value:_.value,v=()=>{const t={badInput:e.current?e.current.validity.badInput:!1,patternMismatch:e.current?e.current.validity.patternMismatch:!1,rangeOverflow:e.current?e.current.validity.rangeOverflow:!1,rangeUnderflow:e.current?e.current.validity.rangeUnderflow:!1,stepMismatch:e.current?e.current.validity.stepMismatch:!1,tooLong:e.current?e.current.validity.tooLong:!1,typeMismatch:e.current?e.current.validity.typeMismatch:!1,valueMissing:e.current?e.current.validity.valueMissing:!1};return{...t,customError:h!==void 0,valid:C!==void 0?C:e.current?!H(t):!0}};r.useImperativeHandle(y,()=>({element:e.current,props:n,get value(){return g()},name:n.name,get validity(){return v()},focus:G})),r.useImperativeHandle(o,()=>y.current);const H=t=>{let i=!1;for(const L in t)t.hasOwnProperty(L)&&(i=i||!!t[L]);return i},b=!I||v().valid,z=l.classNames(N,l.uInput.input({c:B,invalid:!b,disabled:n.disabled})),K=()=>{e.current&&e.current.setCustomValidity&&(v().valid||!I?e.current.classList.remove("k-invalid"):e.current.classList.add("k-invalid"),e.current.setCustomValidity(v().valid?"":h||""))},J=t=>{A({value:t.target.value}),d.current=t.target.value,n.onChange&&n.onChange.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:t.target.value,target:y.current}),d.current=void 0},Q=t=>{if(t.animationName==="autoFillStart"){const i=t.target.parentNode;i&&i.classList.contains("k-empty")&&i.classList.remove("k-empty")}};r.useEffect(()=>{R()},[]),r.useEffect(()=>{K()});const k=r.createElement("input",{"aria-labelledby":w,"aria-describedby":D,"aria-disabled":n.disabled||void 0,"aria-invalid":!b||void 0,"aria-label":F||void 0,...U,style:p?void 0:P,value:g(),id:M,autoFocus:q,className:z,onChange:J,onAnimationStart:Q,ref:e});return p?r.createElement(X.FloatingLabel,{label:p,labelClassName:x,editorId:M,editorValue:String(g()),editorValid:b,editorDisabled:n.disabled,editorPlaceholder:n.placeholder,children:k,style:P,dir:n.dir,unstyled:f}):k}),O=l.createPropsContext(),$={defaultValue:"",required:!1,validityStyles:!0,autoFocus:!1};m.displayName="KendoReactInput";m.propTypes={label:a.string,labelClassName:a.string,validationMessage:a.string,required:a.bool,validate:a.bool,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,ariaLabel:a.string,autoFocus:a.bool,value:a.oneOfType([a.string,a.number,a.array])};exports.Input=m;exports.InputPropsContext=O;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("react"),a=require("prop-types"),l=require("@progress/kendo-react-common"),X=require("@progress/kendo-react-labels"),Y=require("../package-metadata.js");function Z(s){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const u in s)if(u!=="default"){const c=Object.getOwnPropertyDescriptor(s,u);Object.defineProperty(o,u,c.get?c:{enumerable:!0,get:()=>s[u]})}}return o.default=s,Object.freeze(o)}const r=Z(W),m=r.forwardRef((s,o)=>{const c=r.useContext(O).call(void 0,s);l.validatePackage(Y.packageMetadata);const[,R]=r.useReducer(t=>t,!0),n=l.applyDefaultProps(c,$),{className:N,label:p,labelClassName:x,id:E,validationMessage:h,defaultValue:S,valid:C,unstyled:V,visited:ee,touched:te,modified:ae,autoFocus:q,ariaLabelledBy:w,ariaDescribedBy:D,validityStyles:I,style:P,ariaLabel:F,...U}=n,j=l.useUnstyled(),f=V||j,B=f&&f.uInput,T=l.useId(),[_,A]=r.useState({value:S}),M=E||T,e=r.useRef(null),d=r.useRef(void 0),y=r.useRef(null),G=()=>{e.current&&e.current.focus()},g=()=>d.current!==void 0?d.current:n.value!==void 0?n.value:_.value,v=()=>{const t={badInput:e.current?e.current.validity.badInput:!1,patternMismatch:e.current?e.current.validity.patternMismatch:!1,rangeOverflow:e.current?e.current.validity.rangeOverflow:!1,rangeUnderflow:e.current?e.current.validity.rangeUnderflow:!1,stepMismatch:e.current?e.current.validity.stepMismatch:!1,tooLong:e.current?e.current.validity.tooLong:!1,typeMismatch:e.current?e.current.validity.typeMismatch:!1,valueMissing:e.current?e.current.validity.valueMissing:!1};return{...t,customError:h!==void 0,valid:C!==void 0?C:e.current?!H(t):!0}};r.useImperativeHandle(y,()=>({element:e.current,props:n,get value(){return g()},name:n.name,get validity(){return v()},focus:G})),r.useImperativeHandle(o,()=>y.current);const H=t=>{let i=!1;for(const L in t)t.hasOwnProperty(L)&&(i=i||!!t[L]);return i},b=!I||v().valid,z=l.classNames(N,l.uInput.input({c:B,invalid:!b,disabled:n.disabled})),K=()=>{e.current&&e.current.setCustomValidity&&(v().valid||!I?e.current.classList.remove("k-invalid"):e.current.classList.add("k-invalid"),e.current.setCustomValidity(v().valid?"":h||""))},J=t=>{A({value:t.target.value}),d.current=t.target.value,n.onChange&&n.onChange.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:t.target.value,target:y.current}),d.current=void 0},Q=t=>{if(t.animationName==="autoFillStart"){const i=t.target.parentNode;i&&i.classList.contains("k-empty")&&i.classList.remove("k-empty")}};r.useEffect(()=>{R()},[]),r.useEffect(()=>{K()});const k=r.createElement("input",{"aria-labelledby":w,"aria-describedby":D,"aria-disabled":n.disabled||void 0,"aria-invalid":!b||void 0,"aria-label":F||void 0,...U,style:p?void 0:P,value:g(),id:M,autoFocus:q,className:z,onChange:J,onAnimationStart:Q,ref:e});return p?r.createElement(X.FloatingLabel,{label:p,labelClassName:x,editorId:M,editorValue:String(g()),editorValid:b,editorDisabled:n.disabled,editorPlaceholder:n.placeholder,children:k,style:P,dir:n.dir,unstyled:f}):k}),O=l.createPropsContext(),$={defaultValue:"",required:!1,validityStyles:!0,autoFocus:!1};m.displayName="KendoReactInput";m.propTypes={label:a.string,labelClassName:a.string,validationMessage:a.string,required:a.bool,validate:a.bool,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,ariaLabel:a.string,autoFocus:a.bool,value:a.oneOfType([a.string,a.number,a.array])};exports.Input=m;exports.InputPropsContext=O;
|
package/input/Input.mjs
CHANGED
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
+
"use client";
|
|
8
9
|
import * as r from "react";
|
|
9
10
|
import a from "prop-types";
|
|
10
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";
|
|
@@ -35,9 +36,9 @@ const C = r.forwardRef((I, L) => {
|
|
|
35
36
|
...B
|
|
36
37
|
} = i, D = W(), u = R || D, O = u && u.uInput, S = X(), [T, q] = r.useState({
|
|
37
38
|
value: k
|
|
38
|
-
}), g = N || S, e = r.useRef(null), s = r.useRef(void 0),
|
|
39
|
+
}), g = N || S, e = r.useRef(null), s = r.useRef(void 0), c = r.useRef(null), A = () => {
|
|
39
40
|
e.current && e.current.focus();
|
|
40
|
-
},
|
|
41
|
+
}, d = () => s.current !== void 0 ? s.current : i.value !== void 0 ? i.value : T.value, l = () => {
|
|
41
42
|
const t = {
|
|
42
43
|
badInput: e.current ? e.current.validity.badInput : !1,
|
|
43
44
|
patternMismatch: e.current ? e.current.validity.patternMismatch : !1,
|
|
@@ -54,18 +55,18 @@ const C = r.forwardRef((I, L) => {
|
|
|
54
55
|
valid: f !== void 0 ? f : e.current ? !G(t) : !0
|
|
55
56
|
};
|
|
56
57
|
};
|
|
57
|
-
r.useImperativeHandle(
|
|
58
|
+
r.useImperativeHandle(c, () => ({
|
|
58
59
|
element: e.current,
|
|
59
60
|
props: i,
|
|
60
61
|
get value() {
|
|
61
|
-
return
|
|
62
|
+
return d();
|
|
62
63
|
},
|
|
63
64
|
name: i.name,
|
|
64
65
|
get validity() {
|
|
65
66
|
return l();
|
|
66
67
|
},
|
|
67
68
|
focus: A
|
|
68
|
-
})), r.useImperativeHandle(L, () =>
|
|
69
|
+
})), r.useImperativeHandle(L, () => c.current);
|
|
69
70
|
const G = (t) => {
|
|
70
71
|
let n = !1;
|
|
71
72
|
for (const h in t)
|
|
@@ -87,7 +88,7 @@ const C = r.forwardRef((I, L) => {
|
|
|
87
88
|
syntheticEvent: t,
|
|
88
89
|
nativeEvent: t.nativeEvent,
|
|
89
90
|
value: t.target.value,
|
|
90
|
-
target:
|
|
91
|
+
target: c.current
|
|
91
92
|
}), s.current = void 0;
|
|
92
93
|
}, z = (t) => {
|
|
93
94
|
if (t.animationName === "autoFillStart") {
|
|
@@ -110,7 +111,7 @@ const C = r.forwardRef((I, L) => {
|
|
|
110
111
|
"aria-label": U || void 0,
|
|
111
112
|
...B,
|
|
112
113
|
style: o ? void 0 : y,
|
|
113
|
-
value:
|
|
114
|
+
value: d(),
|
|
114
115
|
id: g,
|
|
115
116
|
autoFocus: V,
|
|
116
117
|
className: H,
|
|
@@ -125,7 +126,7 @@ const C = r.forwardRef((I, L) => {
|
|
|
125
126
|
label: o,
|
|
126
127
|
labelClassName: E,
|
|
127
128
|
editorId: g,
|
|
128
|
-
editorValue: String(
|
|
129
|
+
editorValue: String(d()),
|
|
129
130
|
editorValid: v,
|
|
130
131
|
editorDisabled: i.disabled,
|
|
131
132
|
editorPlaceholder: i.placeholder,
|
package/input/InputClearValue.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 i=require("react"),r=require("@progress/kendo-react-common");function m(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,u.get?u:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=m(i),l=n.forwardRef((e,a)=>{const t=n.useRef(null),u=n.useRef(null),s=r.useUnstyled(),c=s&&s.uInput,o=r.classNames(r.uInput.clearButton({c}),e.className);return n.useImperativeHandle(t,()=>({element:u.current})),n.useImperativeHandle(a,()=>t.current),n.createElement("span",{...e,className:o})});l.displayName="KendoReactInputClearValue";exports.InputClearValue=l;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),r=require("@progress/kendo-react-common");function m(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,u.get?u:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=m(i),l=n.forwardRef((e,a)=>{const t=n.useRef(null),u=n.useRef(null),s=r.useUnstyled(),c=s&&s.uInput,o=r.classNames(r.uInput.clearButton({c}),e.className);return n.useImperativeHandle(t,()=>({element:u.current})),n.useImperativeHandle(a,()=>t.current),n.createElement("span",{...e,className:o})});l.displayName="KendoReactInputClearValue";exports.InputClearValue=l;
|