@progress/kendo-vue-inputs 2.7.3 → 3.0.0-dev.202201141128

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist/cdn/js/kendo-vue-inputs.js +1 -1
  2. package/dist/es/additionalTypes.ts +7 -1
  3. package/dist/es/checkbox/Checkbox.d.ts +5 -6
  4. package/dist/es/checkbox/Checkbox.js +38 -22
  5. package/dist/es/checkbox/interfaces/CheckboxProps.d.ts +24 -0
  6. package/dist/es/colors/ColorPalette.d.ts +6 -6
  7. package/dist/es/colors/ColorPalette.js +12 -4
  8. package/dist/es/colors/ColorPicker.d.ts +5 -6
  9. package/dist/es/colors/ColorPicker.js +66 -58
  10. package/dist/es/colors/Picker.d.ts +5 -6
  11. package/dist/es/colors/Picker.js +3 -3
  12. package/dist/es/colors/interfaces/ColorPickerProps.d.ts +2 -2
  13. package/dist/es/input/Input.d.ts +43 -7
  14. package/dist/es/input/Input.js +46 -23
  15. package/dist/es/main.d.ts +1 -1
  16. package/dist/es/main.js +1 -1
  17. package/dist/es/maskedtextbox/MaskedTextBox.d.ts +5 -6
  18. package/dist/es/maskedtextbox/MaskedTextBox.js +37 -13
  19. package/dist/es/maskedtextbox/MaskedTextBoxProps.d.ts +37 -0
  20. package/dist/es/numerictextbox/NumericTextBox.d.ts +5 -6
  21. package/dist/es/numerictextbox/NumericTextBox.js +60 -36
  22. package/dist/es/numerictextbox/interfaces/NumericTextBoxProps.d.ts +37 -0
  23. package/dist/es/package-metadata.js +1 -1
  24. package/dist/es/radiobutton/RadioButton.d.ts +5 -6
  25. package/dist/es/radiobutton/RadioButton.js +13 -8
  26. package/dist/es/radiobutton/RadioGroup.d.ts +5 -6
  27. package/dist/es/radiobutton/RadioGroup.js +3 -3
  28. package/dist/es/radiobutton/interfaces/RadioButtonProps.d.ts +12 -0
  29. package/dist/es/slider/Slider.d.ts +5 -6
  30. package/dist/es/slider/Slider.js +30 -25
  31. package/dist/es/slider/SliderLabel.d.ts +5 -6
  32. package/dist/es/slider/SliderLabel.js +3 -3
  33. package/dist/es/switch/Switch.d.ts +49 -6
  34. package/dist/es/switch/Switch.js +59 -27
  35. package/dist/es/textarea/TextArea.d.ts +5 -6
  36. package/dist/es/textarea/TextArea.js +40 -11
  37. package/dist/es/textarea/interfaces/TextAreaProps.d.ts +37 -0
  38. package/dist/npm/additionalTypes.ts +7 -1
  39. package/dist/npm/checkbox/Checkbox.d.ts +5 -6
  40. package/dist/npm/checkbox/Checkbox.js +39 -23
  41. package/dist/npm/checkbox/interfaces/CheckboxProps.d.ts +24 -0
  42. package/dist/npm/colors/ColorPalette.d.ts +6 -6
  43. package/dist/npm/colors/ColorPalette.js +13 -5
  44. package/dist/npm/colors/ColorPicker.d.ts +5 -6
  45. package/dist/npm/colors/ColorPicker.js +68 -60
  46. package/dist/npm/colors/Picker.d.ts +5 -6
  47. package/dist/npm/colors/Picker.js +5 -5
  48. package/dist/npm/colors/interfaces/ColorPickerProps.d.ts +2 -2
  49. package/dist/npm/input/Input.d.ts +43 -7
  50. package/dist/npm/input/Input.js +47 -24
  51. package/dist/npm/main.d.ts +1 -1
  52. package/dist/npm/main.js +1 -0
  53. package/dist/npm/maskedtextbox/MaskedTextBox.d.ts +5 -6
  54. package/dist/npm/maskedtextbox/MaskedTextBox.js +38 -14
  55. package/dist/npm/maskedtextbox/MaskedTextBoxProps.d.ts +37 -0
  56. package/dist/npm/numerictextbox/NumericTextBox.d.ts +5 -6
  57. package/dist/npm/numerictextbox/NumericTextBox.js +62 -37
  58. package/dist/npm/numerictextbox/interfaces/NumericTextBoxProps.d.ts +37 -0
  59. package/dist/npm/package-metadata.js +1 -1
  60. package/dist/npm/radiobutton/RadioButton.d.ts +5 -6
  61. package/dist/npm/radiobutton/RadioButton.js +14 -9
  62. package/dist/npm/radiobutton/RadioGroup.d.ts +5 -6
  63. package/dist/npm/radiobutton/RadioGroup.js +5 -5
  64. package/dist/npm/radiobutton/interfaces/RadioButtonProps.d.ts +12 -0
  65. package/dist/npm/slider/Slider.d.ts +5 -6
  66. package/dist/npm/slider/Slider.js +33 -27
  67. package/dist/npm/slider/SliderLabel.d.ts +5 -6
  68. package/dist/npm/slider/SliderLabel.js +5 -5
  69. package/dist/npm/switch/Switch.d.ts +49 -6
  70. package/dist/npm/switch/Switch.js +60 -28
  71. package/dist/npm/textarea/TextArea.d.ts +5 -6
  72. package/dist/npm/textarea/TextArea.js +41 -12
  73. package/dist/npm/textarea/interfaces/TextAreaProps.d.ts +37 -0
  74. package/package.json +10 -9
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.RadioButtonVue3 = exports.RadioButton = void 0; // @ts-ignore
6
+ exports.RadioButtonVue2 = exports.RadioButton = void 0; // @ts-ignore
7
7
 
8
8
  var Vue = require("vue");
9
9
 
@@ -18,7 +18,7 @@ var kendo_vue_common_2 = require("@progress/kendo-vue-common");
18
18
 
19
19
  var package_metadata_1 = require("../package-metadata");
20
20
 
21
- var RadioButton = {
21
+ var RadioButtonVue2 = {
22
22
  name: 'KendoRadioButton',
23
23
  props: {
24
24
  ariaDescribedBy: String,
@@ -30,6 +30,13 @@ var RadioButton = {
30
30
  labelRender: [String, Number, Boolean, Object],
31
31
  labelPlacement: String,
32
32
  name: String,
33
+ size: {
34
+ type: String,
35
+ default: 'medium',
36
+ validator: function validator(value) {
37
+ return [null, 'small', 'medium', 'large'].includes(value);
38
+ }
39
+ },
33
40
  tabIndex: Number,
34
41
  value: [String, Number, Object],
35
42
  valid: {
@@ -55,10 +62,8 @@ var RadioButton = {
55
62
  var _a;
56
63
 
57
64
  return _a = {
58
- 'k-radio': true,
59
- 'k-state-invalid': this.$props.valid === false,
60
- 'k-invalid': this.$props.valid === false
61
- }, _a[this.$props.className] = this.$props.className, _a;
65
+ 'k-radio': true
66
+ }, _a["k-radio-" + kendo_vue_common_1.kendoThemeMaps.sizeMap[this.$props.size]] = this.$props.size, _a['k-state-invalid'] = this.$props.valid === false, _a['k-invalid'] = this.$props.valid === false, _a[this.$props.className] = this.$props.className, _a;
62
67
  }
63
68
  },
64
69
  methods: {
@@ -169,6 +174,6 @@ var RadioButton = {
169
174
  return labelPlacement === 'before' ? h("div", [radioButtonLabel, radio, defaultSlot]) : h("div", [radio, radioButtonLabel, defaultSlot]);
170
175
  }
171
176
  };
172
- exports.RadioButton = RadioButton;
173
- var RadioButtonVue3 = RadioButton;
174
- exports.RadioButtonVue3 = RadioButtonVue3;
177
+ exports.RadioButtonVue2 = RadioButtonVue2;
178
+ var RadioButton = RadioButtonVue2;
179
+ exports.RadioButton = RadioButton;
@@ -1,5 +1,4 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
3
2
  declare type DefaultData<V> = object | ((this: V) => {});
4
3
  declare type DefaultMethods<V> = {
5
4
  [key: string]: (this: V, ...args: any[]) => any;
@@ -45,8 +44,8 @@ export interface RadioGroupComputed {
45
44
  /**
46
45
  * @hidden
47
46
  */
48
- export interface RadioGroupAll extends Vue, RadioGroupMethods, RadioGroupComputed, RadioGroupState, RadioGroupData {
47
+ export interface RadioGroupAll extends Vue2type, RadioGroupMethods, RadioGroupComputed, RadioGroupState, RadioGroupData {
49
48
  }
50
- declare let RadioGroup: ComponentOptions<RadioGroupAll, DefaultData<RadioGroupData>, DefaultMethods<RadioGroupAll>, RadioGroupComputed, RecordPropsDefinition<RadioGroupProps>>;
51
- declare let RadioGroupVue3: DefineComponent<RadioGroupProps, any, RadioGroupData, RadioGroupComputed, RadioGroupMethods, {}, {}, {}, string, RadioGroupProps, RadioGroupProps, {}>;
52
- export { RadioGroup, RadioGroupVue3 };
49
+ declare let RadioGroupVue2: ComponentOptions<RadioGroupAll, DefaultData<RadioGroupData>, DefaultMethods<RadioGroupAll>, RadioGroupComputed, RecordPropsDefinition<RadioGroupProps>>;
50
+ declare let RadioGroup: DefineComponent<RadioGroupProps, any, RadioGroupData, RadioGroupComputed, RadioGroupMethods, {}, {}, {}, string, RadioGroupProps, RadioGroupProps, {}>;
51
+ export { RadioGroup, RadioGroupVue2 };
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.RadioGroupVue3 = exports.RadioGroup = void 0; // @ts-ignore
6
+ exports.RadioGroupVue2 = exports.RadioGroup = void 0; // @ts-ignore
7
7
 
8
8
  var Vue = require("vue");
9
9
 
@@ -18,7 +18,7 @@ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
18
18
 
19
19
  var package_metadata_1 = require("../package-metadata");
20
20
 
21
- var RadioGroup = {
21
+ var RadioGroupVue2 = {
22
22
  name: 'KendoRadioGroup',
23
23
  props: {
24
24
  ariaLabelledBy: String,
@@ -209,6 +209,6 @@ var RadioGroup = {
209
209
  }, [radioOptions]);
210
210
  }
211
211
  };
212
- exports.RadioGroup = RadioGroup;
213
- var RadioGroupVue3 = RadioGroup;
214
- exports.RadioGroupVue3 = RadioGroupVue3;
212
+ exports.RadioGroupVue2 = RadioGroupVue2;
213
+ var RadioGroup = RadioGroupVue2;
214
+ exports.RadioGroup = RadioGroup;
@@ -50,6 +50,18 @@ export interface RadioButtonProps {
50
50
  * Sets the `name` property of the Radio button.
51
51
  */
52
52
  name?: string;
53
+ /**
54
+ * Configures the `size` of the RadioButton.
55
+ *
56
+ * The available options are:
57
+ * - small
58
+ * - medium
59
+ * - large
60
+ * - null&mdash;Does not set a size `class`.
61
+ *
62
+ * @default `medium`
63
+ */
64
+ size?: null | 'small' | 'medium' | 'large' | string;
53
65
  /**
54
66
  * Sets the `tabIndex` property of the Radio button.
55
67
  * Defaults to `0`.
@@ -1,5 +1,4 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
3
2
  declare type DefaultData<V> = object | ((this: V) => {});
4
3
  declare type DefaultMethods<V> = {
5
4
  [key: string]: (this: V, ...args: any[]) => any;
@@ -124,8 +123,8 @@ export interface SliderComputed {
124
123
  /**
125
124
  * @hidden
126
125
  */
127
- export interface SliderAll extends Vue, SliderMethods, SliderComputed, SliderState, SliderData {
126
+ export interface SliderAll extends Vue2type, SliderMethods, SliderComputed, SliderState, SliderData {
128
127
  }
129
- declare let Slider: ComponentOptions<SliderAll, DefaultData<SliderData>, DefaultMethods<SliderAll>, SliderComputed, RecordPropsDefinition<SliderProps>>;
130
- declare const SliderVue3: DefineComponent<SliderProps, any, SliderData, SliderComputed, SliderMethods, {}, {}, {}, string, SliderProps, SliderProps, {}>;
131
- export { Slider, SliderVue3 };
128
+ declare let SliderVue2: ComponentOptions<SliderAll, DefaultData<SliderData>, DefaultMethods<SliderAll>, SliderComputed, RecordPropsDefinition<SliderProps>>;
129
+ declare const Slider: DefineComponent<SliderProps, any, SliderData, SliderComputed, SliderMethods, {}, {}, {}, string, SliderProps, SliderProps, {}>;
130
+ export { Slider, SliderVue2 };
@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
19
19
  Object.defineProperty(exports, "__esModule", {
20
20
  value: true
21
21
  });
22
- exports.SliderVue3 = exports.Slider = void 0; // @ts-ignore
22
+ exports.SliderVue2 = exports.Slider = void 0; // @ts-ignore
23
23
 
24
24
  var Vue = require("vue");
25
25
 
@@ -28,6 +28,8 @@ var gh = allVue.h;
28
28
  var ref = allVue.ref;
29
29
  var inject = allVue.inject;
30
30
 
31
+ var kendo_vue_buttons_1 = require("@progress/kendo-vue-buttons");
32
+
31
33
  var kendo_vue_common_1 = require("@progress/kendo-vue-common");
32
34
 
33
35
  var kendo_vue_common_2 = require("@progress/kendo-vue-common");
@@ -40,7 +42,7 @@ var SliderLabel_1 = require("./SliderLabel");
40
42
 
41
43
  var package_metadata_1 = require("../package-metadata");
42
44
 
43
- var Slider = {
45
+ var SliderVue2 = {
44
46
  name: 'KendoSlider',
45
47
  model: {
46
48
  event: 'changemodel'
@@ -220,25 +222,27 @@ var Slider = {
220
222
  position: 'relative',
221
223
  flexDirection: this.$props.vertical ? 'column-reverse' : 'row'
222
224
  }
223
- }, [this.$props.buttons && h("a", {
224
- "class": "k-button k-button-decrease",
225
+ }, [this.$props.buttons && // @ts-ignore
226
+ h(kendo_vue_buttons_1.Button, {
227
+ tabIndex: -1,
228
+ attrs: this.v3 ? undefined : {
229
+ tabIndex: -1,
230
+ icon: this.$props.vertical ? 'arrow-s' : 'arrow-w',
231
+ rounded: 'full',
232
+ title: lS.toLanguageString(messages_1.sliderDecreaseValue, messages_1.messages[messages_1.sliderDecreaseValue])
233
+ },
234
+ icon: this.$props.vertical ? 'arrow-s' : 'arrow-w',
225
235
  style: {
226
236
  position: 'relative'
227
237
  },
238
+ rounded: 'full',
239
+ "class": "k-button-decrease",
228
240
  title: lS.toLanguageString(messages_1.sliderDecreaseValue, messages_1.messages[messages_1.sliderDecreaseValue]),
229
- attrs: this.v3 ? undefined : {
230
- title: lS.toLanguageString(messages_1.sliderDecreaseValue, messages_1.messages[messages_1.sliderDecreaseValue])
231
- },
232
241
  onClick: this.decrement,
233
242
  on: this.v3 ? undefined : {
234
243
  "click": this.decrement
235
244
  }
236
- }, [h("span", {
237
- "class": kendo_vue_common_2.classNames('k-icon', {
238
- 'k-i-arrow-s': this.$props.vertical,
239
- 'k-i-arrow-w': !this.$props.vertical
240
- })
241
- })]), // @ts-ignore function children
245
+ }), // @ts-ignore function children
242
246
  h(kendo_vue_common_2.Draggable, {
243
247
  onDrag: this.dragOver,
244
248
  on: this.v3 ? undefined : {
@@ -321,25 +325,27 @@ var Slider = {
321
325
  bottom: 'calc(' + percentValue + '% - 8px)',
322
326
  zIndex: 1
323
327
  } : (_b = {}, _b[_this.currentDir === 'rtl' ? 'right' : 'left'] = 'calc(' + percentValue + '% - 8px)', _b.zIndex = 1, _b)
324
- })])])]), this.$props.buttons && h("a", {
325
- "class": "k-button k-button-increase",
328
+ })])])]), this.$props.buttons && // @ts-ignore
329
+ h(kendo_vue_buttons_1.Button, {
330
+ tabIndex: -1,
331
+ attrs: this.v3 ? undefined : {
332
+ tabIndex: -1,
333
+ icon: this.$props.vertical ? 'arrow-n' : 'arrow-e',
334
+ rounded: 'full',
335
+ title: lS.toLanguageString(messages_1.sliderIncreaseValue, messages_1.messages[messages_1.sliderIncreaseValue])
336
+ },
337
+ icon: this.$props.vertical ? 'arrow-n' : 'arrow-e',
338
+ rounded: 'full',
326
339
  style: {
327
340
  position: 'relative'
328
341
  },
342
+ "class": "k-button-increase",
329
343
  title: lS.toLanguageString(messages_1.sliderIncreaseValue, messages_1.messages[messages_1.sliderIncreaseValue]),
330
- attrs: this.v3 ? undefined : {
331
- title: lS.toLanguageString(messages_1.sliderIncreaseValue, messages_1.messages[messages_1.sliderIncreaseValue])
332
- },
333
344
  onClick: this.increment,
334
345
  on: this.v3 ? undefined : {
335
346
  "click": this.increment
336
347
  }
337
- }, [h("span", {
338
- "class": kendo_vue_common_2.classNames('k-icon', {
339
- 'k-i-arrow-n': this.$props.vertical,
340
- 'k-i-arrow-e': !this.$props.vertical
341
- })
342
- })])])]);
348
+ })])]);
343
349
  },
344
350
  methods: {
345
351
  focus: function focus() {
@@ -430,6 +436,6 @@ var Slider = {
430
436
  }
431
437
  }
432
438
  };
433
- exports.Slider = Slider;
434
- var SliderVue3 = Slider;
435
- exports.SliderVue3 = SliderVue3;
439
+ exports.SliderVue2 = SliderVue2;
440
+ var Slider = SliderVue2;
441
+ exports.Slider = Slider;
@@ -1,5 +1,4 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
3
2
  declare type DefaultData<V> = object | ((this: V) => {});
4
3
  declare type DefaultMethods<V> = {
5
4
  [key: string]: (this: V, ...args: any[]) => any;
@@ -51,8 +50,8 @@ export interface SliderLabelData {
51
50
  /**
52
51
  * @hidden
53
52
  */
54
- export interface SliderLabelAll extends Vue, SliderLabelMethods, SliderLabelData, SliderLabelState {
53
+ export interface SliderLabelAll extends Vue2type, SliderLabelMethods, SliderLabelData, SliderLabelState {
55
54
  }
56
- declare let SliderLabel: ComponentOptions<SliderLabelAll, DefaultData<SliderLabelData>, DefaultMethods<SliderLabelAll>, {}, RecordPropsDefinition<SliderLabelProps>>;
57
- declare const SliderLabelVue3: DefineComponent<SliderLabelProps, any, SliderLabelData, {}, SliderLabelMethods, {}, {}, {}, string, SliderLabelProps, SliderLabelProps, {}>;
58
- export { SliderLabel, SliderLabelVue3 };
55
+ declare let SliderLabelVue2: ComponentOptions<SliderLabelAll, DefaultData<SliderLabelData>, DefaultMethods<SliderLabelAll>, {}, RecordPropsDefinition<SliderLabelProps>>;
56
+ declare const SliderLabel: DefineComponent<SliderLabelProps, any, SliderLabelData, {}, SliderLabelMethods, {}, {}, {}, string, SliderLabelProps, SliderLabelProps, {}>;
57
+ export { SliderLabel, SliderLabelVue2 };
@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
19
19
  Object.defineProperty(exports, "__esModule", {
20
20
  value: true
21
21
  });
22
- exports.SliderLabelVue3 = exports.SliderLabel = exports.SLIDER_LABEL_ATTRIBUTE = void 0; // @ts-ignore
22
+ exports.SliderLabelVue2 = exports.SliderLabel = exports.SLIDER_LABEL_ATTRIBUTE = void 0; // @ts-ignore
23
23
 
24
24
  var Vue = require("vue");
25
25
 
@@ -35,7 +35,7 @@ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
35
35
 
36
36
  exports.SLIDER_LABEL_ATTRIBUTE = 'data-slider-label'; // tslint:enable:max-line-length
37
37
 
38
- var SliderLabel = {
38
+ var SliderLabelVue2 = {
39
39
  name: 'KendoSliderLabel',
40
40
  // @ts-ignore
41
41
  emits: {
@@ -116,6 +116,6 @@ var SliderLabel = {
116
116
  }
117
117
  }
118
118
  };
119
- exports.SliderLabel = SliderLabel;
120
- var SliderLabelVue3 = SliderLabel;
121
- exports.SliderLabelVue3 = SliderLabelVue3;
119
+ exports.SliderLabelVue2 = SliderLabelVue2;
120
+ var SliderLabel = SliderLabelVue2;
121
+ exports.SliderLabel = SliderLabel;
@@ -1,5 +1,4 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
3
2
  declare type DefaultData<V> = object | ((this: V) => {});
4
3
  declare type DefaultMethods<V> = {
5
4
  [key: string]: (this: V, ...args: any[]) => any;
@@ -20,6 +19,10 @@ export interface SwitchChangeEvent {
20
19
  * Represents the props of the [Kendo UI for Vue Switch component]({% slug overview_switch %}).
21
20
  */
22
21
  export interface SwitchProps extends ToggleBaseProps, FormComponentProps {
22
+ /**
23
+ * Specifies the `name` of the Switch.
24
+ */
25
+ name?: string;
23
26
  /**
24
27
  * Specifies the `accessKey` of the Switch.
25
28
  */
@@ -52,6 +55,46 @@ export interface SwitchProps extends ToggleBaseProps, FormComponentProps {
52
55
  * Sets the `id` of the Switch.
53
56
  */
54
57
  id?: string;
58
+ /**
59
+ * Configures the `size` of the Switch.
60
+ *
61
+ * The available options are:
62
+ * - small
63
+ * - medium
64
+ * - large
65
+ * - null&mdash;Does not set a size `className`.
66
+ *
67
+ * @default `medium`
68
+ */
69
+ size?: null | 'small' | 'medium' | 'large' | string;
70
+ /**
71
+ * Configures the `trackRounded` of the Switch.
72
+ *
73
+ * The available options are:
74
+ * - small
75
+ * - medium
76
+ * - large
77
+ * - full
78
+ * - circle
79
+ * - null&mdash;Does not set a trackRounded `className`.
80
+ *
81
+ * @default `full`
82
+ */
83
+ trackRounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
84
+ /**
85
+ * Configures the `thumbRounded` of the Switch.
86
+ *
87
+ * The available options are:
88
+ * - small
89
+ * - medium
90
+ * - large
91
+ * - full
92
+ * - circle
93
+ * - null&mdash;Does not set a thumbRounded `className`.
94
+ *
95
+ * @default `circle`
96
+ */
97
+ thumbRounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
55
98
  /**
56
99
  * Identifies the element(s) which will describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
57
100
  * For example these elements could contain error or hint message.
@@ -124,8 +167,8 @@ export interface SwitchData {
124
167
  /**
125
168
  * @hidden
126
169
  */
127
- export interface SwitchAll extends Vue, SwitchMethods, SwitchData, SwitchComputed, SwitchState {
170
+ export interface SwitchAll extends Vue2type, SwitchMethods, SwitchData, SwitchComputed, SwitchState {
128
171
  }
129
- declare let Switch: ComponentOptions<SwitchAll, DefaultData<SwitchData>, DefaultMethods<SwitchAll>, SwitchComputed, RecordPropsDefinition<SwitchProps>>;
130
- declare const SwitchVue3: DefineComponent<SwitchProps, any, SwitchData, SwitchComputed, SwitchMethods, {}, {}, {}, string, SwitchProps, SwitchProps, {}>;
131
- export { Switch, SwitchVue3 };
172
+ declare let SwitchVue2: ComponentOptions<SwitchAll, DefaultData<SwitchData>, DefaultMethods<SwitchAll>, SwitchComputed, RecordPropsDefinition<SwitchProps>>;
173
+ declare const Switch: DefineComponent<SwitchProps, any, SwitchData, SwitchComputed, SwitchMethods, {}, {}, {}, string, SwitchProps, SwitchProps, {}>;
174
+ export { Switch, SwitchVue2 };
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.SwitchVue3 = exports.Switch = void 0; // @ts-ignore
6
+ exports.SwitchVue2 = exports.Switch = void 0; // @ts-ignore
7
7
 
8
8
  var Vue = require("vue");
9
9
 
@@ -16,14 +16,10 @@ var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
16
16
 
17
17
  var messages_1 = require("./../messages");
18
18
 
19
- var package_metadata_1 = require("../package-metadata");
19
+ var package_metadata_1 = require("../package-metadata"); // tslint:enable:max-line-length
20
20
 
21
- var SWITCH_CONTAINER = 'k-switch-container';
22
- var SWITCH_HANDLE = 'k-switch-handle';
23
- var SWITCH_LABEL_ON = 'k-switch-label-on';
24
- var SWITCH_LABEL_OFF = 'k-switch-label-off'; // tslint:enable:max-line-length
25
21
 
26
- var Switch = {
22
+ var SwitchVue2 = {
27
23
  name: 'KendoSwitch',
28
24
  model: {
29
25
  event: 'changemodel'
@@ -37,6 +33,7 @@ var Switch = {
37
33
  'blur': null
38
34
  },
39
35
  props: {
36
+ name: String,
40
37
  accessKey: String,
41
38
  checked: {
42
39
  type: Boolean,
@@ -51,6 +48,27 @@ var Switch = {
51
48
  type: Boolean,
52
49
  default: false
53
50
  },
51
+ size: {
52
+ type: String,
53
+ default: 'medium',
54
+ validator: function validator(value) {
55
+ return [null, 'small', 'medium', 'large'].includes(value);
56
+ }
57
+ },
58
+ trackRounded: {
59
+ type: String,
60
+ default: 'full',
61
+ validator: function validator(value) {
62
+ return [null, 'small', 'medium', 'large', 'full'].includes(value);
63
+ }
64
+ },
65
+ thumbRounded: {
66
+ type: String,
67
+ default: 'full',
68
+ validator: function validator(value) {
69
+ return [null, 'small', 'medium', 'large', 'full'].includes(value);
70
+ }
71
+ },
54
72
  dir: String,
55
73
  id: String,
56
74
  ariaLabelledBy: String,
@@ -105,16 +123,26 @@ var Switch = {
105
123
  return this.valueDuringOnChange !== undefined ? this.valueDuringOnChange : this.$props.checked !== undefined ? this.$props.checked : this.$props.value !== undefined ? this.$props.value : this.$props.modelValue !== undefined ? this.$props.modelValue : this.currentChecked;
106
124
  },
107
125
  switchClassName: function switchClassName() {
126
+ var _a;
127
+
108
128
  var isValid = !this.validityStyles || this.validity().valid;
109
- return {
110
- 'k-widget': true,
111
- 'k-switch': true,
112
- 'k-switch-on': this.computedValue,
113
- 'k-switch-off': !this.computedValue,
114
- 'k-state-focused': this.focused,
115
- 'k-state-disabled': this.$props.disabled,
116
- 'k-state-invalid': !isValid
117
- };
129
+ return _a = {
130
+ 'k-switch': true
131
+ }, _a["k-switch-" + kendo_vue_common_1.kendoThemeMaps.sizeMap[this.$props.size]] = true, _a["k-rounded-" + this.$props.trackRounded] = this.$props.trackRounded, _a['k-switch-on'] = this.computedValue, _a['k-switch-off'] = !this.computedValue, _a['k-focus'] = this.focused, _a['k-disabled'] = this.$props.disabled, _a['k-invalid'] = !isValid, _a;
132
+ },
133
+ switchTrackClass: function switchTrackClass() {
134
+ var _a;
135
+
136
+ return _a = {
137
+ 'k-switch-track': true
138
+ }, _a["k-rounded-" + this.$props.trackRounded] = this.$props.trackRounded, _a;
139
+ },
140
+ switchThumbClass: function switchThumbClass() {
141
+ var _a;
142
+
143
+ return _a = {
144
+ 'k-switch-thumb': true
145
+ }, _a["k-rounded-" + this.$props.thumbRounded] = this.$props.thumbRounded, _a;
118
146
  }
119
147
  },
120
148
  mounted: function mounted() {
@@ -143,7 +171,8 @@ var Switch = {
143
171
  id = _a.id,
144
172
  offLabel = _a.offLabel,
145
173
  onLabel = _a.onLabel,
146
- tabIndex = _a.tabIndex;
174
+ tabIndex = _a.tabIndex,
175
+ required = _a.required;
147
176
  return h("span", {
148
177
  "class": this.switchClassName,
149
178
  dir: this.currentDir,
@@ -161,7 +190,7 @@ var Switch = {
161
190
  onFocusout: this.handleWrapperBlur,
162
191
  onFocusin: this.handleWrapperFocus
163
192
  }, [h("span", {
164
- "class": SWITCH_CONTAINER,
193
+ "class": this.switchTrackClass,
165
194
  id: id || this._id,
166
195
  attrs: this.v3 ? undefined : {
167
196
  id: id || this._id,
@@ -188,6 +217,8 @@ var Switch = {
188
217
  attrs: this.v3 ? undefined : {
189
218
  type: "checkbox",
190
219
  tabIndex: -1,
220
+ name: this.$props.name,
221
+ required: required !== undefined ? required : false,
191
222
  "aria-hidden": true
192
223
  },
193
224
  checked: this.v3 ? this.$props.checked : null,
@@ -199,6 +230,8 @@ var Switch = {
199
230
  _this.inputRef = el;
200
231
  } : 'input',
201
232
  tabIndex: -1,
233
+ name: this.$props.name,
234
+ required: required !== undefined ? required : false,
202
235
  "aria-hidden": true,
203
236
  value: this.v3 ? this.computedValue : null,
204
237
  style: {
@@ -214,12 +247,14 @@ var Switch = {
214
247
  "change": kendo_vue_common_1.noop
215
248
  }
216
249
  }), h("span", {
217
- "class": SWITCH_LABEL_ON
250
+ "class": 'k-switch-label-on'
218
251
  }, [onLabel]), h("span", {
219
- "class": SWITCH_LABEL_OFF
252
+ "class": 'k-switch-label-off'
220
253
  }, [offLabel]), h("span", {
221
- "class": SWITCH_HANDLE
222
- })])]);
254
+ "class": 'k-switch-thumb-wrap'
255
+ }, [h("span", {
256
+ "class": this.switchThumbClass
257
+ })])])]);
223
258
  },
224
259
  methods: {
225
260
  focus: function focus() {
@@ -230,9 +265,6 @@ var Switch = {
230
265
  element: function element() {
231
266
  return this._element;
232
267
  },
233
- name: function name() {
234
- return this.$props.name;
235
- },
236
268
  validity: function validity() {
237
269
  var customError = this.$props.validationMessage !== undefined;
238
270
  var isValid = this.$props.valid !== undefined ? this.$props.valid : !this.$props.required ? true : this.computedValue ? true : false;
@@ -315,6 +347,6 @@ var Switch = {
315
347
  }
316
348
  }
317
349
  };
318
- exports.Switch = Switch;
319
- var SwitchVue3 = Switch;
320
- exports.SwitchVue3 = SwitchVue3;
350
+ exports.SwitchVue2 = SwitchVue2;
351
+ var Switch = SwitchVue2;
352
+ exports.Switch = Switch;
@@ -1,5 +1,4 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
3
2
  declare type DefaultData<V> = object | ((this: V) => {});
4
3
  declare type DefaultMethods<V> = {
5
4
  [key: string]: (this: V, ...args: any[]) => any;
@@ -39,8 +38,8 @@ export interface TextAreaData {
39
38
  /**
40
39
  * @hidden
41
40
  */
42
- export interface TextAreaAll extends Vue, TextAreaMethods, TextAreaData, TextAreaComputed, TextAreaState {
41
+ export interface TextAreaAll extends Vue2type, TextAreaMethods, TextAreaData, TextAreaComputed, TextAreaState {
43
42
  }
44
- declare let TextArea: ComponentOptions<TextAreaAll, DefaultData<TextAreaData>, DefaultMethods<TextAreaAll>, TextAreaComputed, RecordPropsDefinition<TextAreaProps>>;
45
- declare const TextAreaVue3: DefineComponent<TextAreaProps, any, TextAreaData, TextAreaComputed, TextAreaMethods, {}, {}, {}, string, TextAreaProps, TextAreaProps, {}>;
46
- export { TextArea, TextAreaVue3 };
43
+ declare let TextAreaVue2: ComponentOptions<TextAreaAll, DefaultData<TextAreaData>, DefaultMethods<TextAreaAll>, TextAreaComputed, RecordPropsDefinition<TextAreaProps>>;
44
+ declare const TextArea: DefineComponent<TextAreaProps, any, TextAreaData, TextAreaComputed, TextAreaMethods, {}, {}, {}, string, TextAreaProps, TextAreaProps, {}>;
45
+ export { TextArea, TextAreaVue2 };
@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
19
19
  Object.defineProperty(exports, "__esModule", {
20
20
  value: true
21
21
  });
22
- exports.TextAreaVue3 = exports.TextArea = void 0; // @ts-ignore
22
+ exports.TextAreaVue2 = exports.TextArea = void 0; // @ts-ignore
23
23
 
24
24
  var Vue = require("vue");
25
25
 
@@ -31,7 +31,7 @@ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
31
31
  var package_metadata_1 = require("../package-metadata"); // tslint:enable:max-line-length
32
32
 
33
33
 
34
- var TextArea = {
34
+ var TextAreaVue2 = {
35
35
  name: 'KendoTextArea',
36
36
  inheritAttrs: false,
37
37
  model: {
@@ -61,6 +61,27 @@ var TextArea = {
61
61
  rows: Number,
62
62
  id: String,
63
63
  name: String,
64
+ size: {
65
+ type: String,
66
+ default: 'medium',
67
+ validator: function validator(value) {
68
+ return [null, 'small', 'medium', 'large'].includes(value);
69
+ }
70
+ },
71
+ rounded: {
72
+ type: String,
73
+ default: 'medium',
74
+ validator: function validator(value) {
75
+ return [null, 'small', 'medium', 'large', 'full'].includes(value);
76
+ }
77
+ },
78
+ fillMode: {
79
+ type: String,
80
+ default: 'solid',
81
+ validator: function validator(value) {
82
+ return [null, 'solid', 'flat', 'outline'].includes(value);
83
+ }
84
+ },
64
85
  required: Boolean,
65
86
  placeholder: String,
66
87
  tabIndex: Number,
@@ -80,11 +101,18 @@ var TextArea = {
80
101
  },
81
102
  computed: {
82
103
  rootClassName: function rootClassName() {
83
- return {
84
- 'k-textarea': true,
85
- 'k-state-invalid': this.validityStyles === true ? !this.isValid : false,
86
- 'k-state-disabled': this.$props.disabled
87
- };
104
+ var _a;
105
+
106
+ var _b = this.$props,
107
+ size = _b.size,
108
+ fillMode = _b.fillMode,
109
+ rounded = _b.rounded,
110
+ required = _b.required;
111
+ var invalid = this.validityStyles === true ? !this.isValid : false;
112
+ return _a = {
113
+ 'k-input': true,
114
+ 'k-textarea': true
115
+ }, _a["k-input-" + (kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a["k-input-" + fillMode] = fillMode, _a["k-rounded-" + (kendo_vue_common_1.kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-disabled'] = this.$props.disabled, _a['k-valid'] = !invalid, _a['k-invalid'] = invalid, _a['k-required'] = required, _a;
88
116
  },
89
117
  computedValue: function computedValue() {
90
118
  return this.$props.value !== undefined ? this.$props.value : this.$props.modelValue !== undefined ? this.$props.modelValue : this.currentValue;
@@ -151,7 +179,7 @@ var TextArea = {
151
179
 
152
180
  var textarea = h('textarea', __assign(__assign({}, textAreaAttrs), {
153
181
  attrs: this.v3 ? undefined : textAreaAttrs,
154
- 'class': 'k-input',
182
+ 'class': 'k-input-inner',
155
183
  ref: this.v3 ? function (el) {
156
184
  _this.elementRef = el;
157
185
  } : 'element',
@@ -180,7 +208,8 @@ var TextArea = {
180
208
  dir: this.currentDir,
181
209
  attrs: this.v3 ? undefined : {
182
210
  dir: this.currentDir
183
- }
211
+ },
212
+ style: this.$attrs.style
184
213
  }, [textarea]);
185
214
  },
186
215
  methods: {
@@ -256,6 +285,6 @@ var TextArea = {
256
285
  }
257
286
  }
258
287
  };
259
- exports.TextArea = TextArea;
260
- var TextAreaVue3 = TextArea;
261
- exports.TextAreaVue3 = TextAreaVue3;
288
+ exports.TextAreaVue2 = TextAreaVue2;
289
+ var TextArea = TextAreaVue2;
290
+ exports.TextArea = TextArea;