@progress/kendo-vue-inputs 2.7.2 → 2.8.0-dev.202201121019

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 +5 -4
  8. package/dist/es/colors/ColorPicker.d.ts +5 -6
  9. package/dist/es/colors/ColorPicker.js +47 -48
  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 +47 -24
  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 +38 -14
  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 +61 -37
  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 +45 -6
  34. package/dist/es/switch/Switch.js +56 -24
  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 +6 -5
  44. package/dist/npm/colors/ColorPicker.d.ts +5 -6
  45. package/dist/npm/colors/ColorPicker.js +50 -51
  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 +48 -25
  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 +39 -15
  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 +63 -38
  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 +45 -6
  70. package/dist/npm/switch/Switch.js +57 -25
  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
@@ -1,3 +1,9 @@
1
1
  // @ts-ignore
2
2
  import { DefineComponent } from 'vue';
3
- export { DefineComponent };
3
+ // @ts-ignore
4
+ import * as Vue from 'vue';
5
+ // @ts-ignore
6
+ type Vue2type = Vue.default;
7
+ // @ts-ignore
8
+ import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
9
+ export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };
@@ -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;
@@ -67,8 +66,8 @@ export interface CheckboxComputed {
67
66
  /**
68
67
  * @hidden
69
68
  */
70
- export interface CheckboxAll extends Vue, CheckboxMethods, CheckboxState, CheckboxData, CheckboxComputed {
69
+ export interface CheckboxAll extends Vue2type, CheckboxMethods, CheckboxState, CheckboxData, CheckboxComputed {
71
70
  }
72
- declare let Checkbox: ComponentOptions<CheckboxAll, DefaultData<CheckboxData>, DefaultMethods<CheckboxAll>, CheckboxComputed, RecordPropsDefinition<CheckboxProps>>;
73
- declare const CheckboxVue3: DefineComponent<CheckboxProps, any, CheckboxData, CheckboxComputed, CheckboxMethods, {}, {}, {}, string, CheckboxProps, CheckboxProps, {}>;
74
- export { Checkbox, CheckboxVue3 };
71
+ declare let CheckboxVue2: ComponentOptions<CheckboxAll, DefaultData<CheckboxData>, DefaultMethods<CheckboxAll>, CheckboxComputed, RecordPropsDefinition<CheckboxProps>>;
72
+ declare const Checkbox: DefineComponent<CheckboxProps, any, CheckboxData, CheckboxComputed, CheckboxMethods, {}, {}, {}, string, CheckboxProps, CheckboxProps, {}>;
73
+ export { Checkbox, CheckboxVue2 };
@@ -4,11 +4,11 @@ var allVue = Vue;
4
4
  var gh = allVue.h;
5
5
  var ref = allVue.ref;
6
6
  var inject = allVue.inject;
7
- import { Keys, classNames, guid, getTabIndex, getDefaultSlots, validatePackage, templateRendering, getTemplate, getListeners } from '@progress/kendo-vue-common';
7
+ import { Keys, classNames, guid, getTabIndex, getDefaultSlots, validatePackage, templateRendering, getTemplate, getListeners, kendoThemeMaps } from '@progress/kendo-vue-common';
8
8
  import { packageMetadata } from '../package-metadata';
9
9
  import { provideLocalizationService } from '@progress/kendo-vue-intl';
10
10
  import { messages, checkboxValidation, checkboxOptionalText } from './../messages';
11
- var Checkbox = {
11
+ var CheckboxVue2 = {
12
12
  name: 'KendoCheckbox',
13
13
  // @ts-ignore
14
14
  emits: {
@@ -53,6 +53,20 @@ var Checkbox = {
53
53
  labelPlacement: String,
54
54
  labelOptional: Boolean,
55
55
  name: String,
56
+ size: {
57
+ type: String,
58
+ default: 'medium',
59
+ validator: function validator(value) {
60
+ return [null, 'small', 'medium', 'large'].includes(value);
61
+ }
62
+ },
63
+ rounded: {
64
+ type: String,
65
+ default: 'medium',
66
+ validator: function validator(value) {
67
+ return [null, 'small', 'medium', 'large'].includes(value);
68
+ }
69
+ },
56
70
  tabIndex: Number,
57
71
  value: {
58
72
  type: [String, Boolean],
@@ -159,20 +173,24 @@ var Checkbox = {
159
173
  };
160
174
  },
161
175
  render: function render(createElement) {
176
+ var _a;
177
+
162
178
  var h = gh || createElement;
163
- var _a = this.$props,
164
- ariaDescribedBy = _a.ariaDescribedBy,
165
- ariaLabelledBy = _a.ariaLabelledBy,
166
- disabled = _a.disabled,
167
- id = _a.id,
168
- label = _a.label,
169
- labelRender = _a.labelRender,
170
- labelPlacement = _a.labelPlacement,
171
- name = _a.name,
172
- labelOptional = _a.labelOptional,
173
- tabIndex = _a.tabIndex,
174
- required = _a.required,
175
- validityStyles = _a.validityStyles;
179
+ var _b = this.$props,
180
+ ariaDescribedBy = _b.ariaDescribedBy,
181
+ ariaLabelledBy = _b.ariaLabelledBy,
182
+ disabled = _b.disabled,
183
+ id = _b.id,
184
+ label = _b.label,
185
+ labelRender = _b.labelRender,
186
+ labelPlacement = _b.labelPlacement,
187
+ name = _b.name,
188
+ labelOptional = _b.labelOptional,
189
+ tabIndex = _b.tabIndex,
190
+ required = _b.required,
191
+ validityStyles = _b.validityStyles,
192
+ size = _b.size,
193
+ rounded = _b.rounded;
176
194
  var defaultSlot = getDefaultSlots(this);
177
195
  var renderedLabel = label;
178
196
  this.localizationService = provideLocalizationService(this);
@@ -181,11 +199,9 @@ var Checkbox = {
181
199
  var checkboxClasses = classNames({
182
200
  'k-state-disabled': disabled
183
201
  });
184
- var inputClasses = classNames({
185
- 'k-checkbox': true,
186
- 'k-state-indeterminate': this.indeterminateProp,
187
- 'k-state-invalid k-invalid': !(this.isValid || validityStyles !== undefined || validityStyles === true)
188
- });
202
+ var inputClasses = classNames((_a = {
203
+ 'k-checkbox': true
204
+ }, _a["k-checkbox-" + kendoThemeMaps.sizeMap[size]] = size, _a["k-rounded-" + kendoThemeMaps.roundedMap[rounded]] = rounded, _a['k-state-indeterminate'] = this.indeterminateProp, _a['k-state-invalid k-invalid'] = !(this.isValid || validityStyles !== undefined || validityStyles === true), _a));
189
205
 
190
206
  var checkboxInput = function checkboxInput() {
191
207
  var _this = this;
@@ -348,5 +364,5 @@ var Checkbox = {
348
364
  }
349
365
  }
350
366
  };
351
- var CheckboxVue3 = Checkbox;
352
- export { Checkbox, CheckboxVue3 };
367
+ var Checkbox = CheckboxVue2;
368
+ export { Checkbox, CheckboxVue2 };
@@ -44,6 +44,30 @@ export interface CheckboxProps extends ToggleBaseProps, FormComponentProps {
44
44
  * Sets the `id` of the Checkbox.
45
45
  */
46
46
  id?: string;
47
+ /**
48
+ * Configures the `size` of the Checkbox.
49
+ *
50
+ * The available options are:
51
+ * - small
52
+ * - medium
53
+ * - large
54
+ * - null&mdash;Does not set a size `className`.
55
+ *
56
+ * @default `medium`
57
+ */
58
+ size?: null | 'small' | 'medium' | 'large' | string;
59
+ /**
60
+ * Configures the `rounded` style of the Checkbox.
61
+ *
62
+ * The available options are:
63
+ * - small
64
+ * - medium
65
+ * - large
66
+ * - null&mdash;Does not set a rounded `className`.
67
+ *
68
+ * @default `medium`
69
+ */
70
+ rounded?: null | 'small' | 'medium' | 'large' | string;
47
71
  /**
48
72
  * 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).
49
73
  * For example these elements could contain error or hint message.
@@ -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;
@@ -24,6 +23,7 @@ export declare const DEFAULT_PRESET = "office";
24
23
  export interface ColorPaletteState {
25
24
  wrapper: HTMLDivElement | null;
26
25
  paletteService: ColorPaletteService;
26
+ guid: string;
27
27
  }
28
28
  /**
29
29
  * @hidden
@@ -48,8 +48,8 @@ export interface ColorPaletteData {
48
48
  /**
49
49
  * @hidden
50
50
  */
51
- export interface ColorPaletteAll extends Vue, ColorPaletteMethods, ColorPaletteData, ColorPaletteComputed, ColorPaletteState {
51
+ export interface ColorPaletteAll extends Vue2type, ColorPaletteMethods, ColorPaletteData, ColorPaletteComputed, ColorPaletteState {
52
52
  }
53
- declare let ColorPalette: ComponentOptions<ColorPaletteAll, DefaultData<ColorPaletteData>, DefaultMethods<ColorPaletteAll>, ColorPaletteComputed, RecordPropsDefinition<ColorPaletteProps>>;
54
- declare const ColorPaletteVue3: DefineComponent<ColorPaletteProps, any, ColorPaletteData, ColorPaletteComputed, ColorPaletteMethods, {}, {}, {}, string, ColorPaletteProps, ColorPaletteProps, {}>;
55
- export { ColorPalette, ColorPaletteVue3 };
53
+ declare let ColorPaletteVue2: ComponentOptions<ColorPaletteAll, DefaultData<ColorPaletteData>, DefaultMethods<ColorPaletteAll>, ColorPaletteComputed, RecordPropsDefinition<ColorPaletteProps>>;
54
+ declare const ColorPalette: DefineComponent<ColorPaletteProps, any, ColorPaletteData, ColorPaletteComputed, ColorPaletteMethods, {}, {}, {}, string, ColorPaletteProps, ColorPaletteProps, {}>;
55
+ export { ColorPalette, ColorPaletteVue2 };
@@ -3,7 +3,7 @@ import * as Vue from 'vue';
3
3
  var allVue = Vue;
4
4
  var gh = allVue.h;
5
5
  import { ColorPaletteService } from './utils/color-palette.service';
6
- import { classNames, Keys, getTabIndex, validatePackage } from '@progress/kendo-vue-common';
6
+ import { classNames, Keys, guid, getTabIndex, validatePackage } from '@progress/kendo-vue-common';
7
7
  import { packageMetadata } from '../package-metadata';
8
8
  import { PALETTEPRESETS } from './models/palette-presets';
9
9
  import { isPresent } from './utils/misc';
@@ -24,7 +24,7 @@ export var DEFAULT_COLUMNS_COUNT = 10;
24
24
 
25
25
  export var DEFAULT_PRESET = 'office'; // tslint:enable:max-line-length
26
26
 
27
- var ColorPalette = {
27
+ var ColorPaletteVue2 = {
28
28
  name: 'KendoColorPalette',
29
29
  props: {
30
30
  palette: {
@@ -46,6 +46,7 @@ var ColorPalette = {
46
46
  },
47
47
  created: function created() {
48
48
  validatePackage(packageMetadata);
49
+ this.guid = guid();
49
50
  },
50
51
  mounted: function mounted() {
51
52
  this.wrapper = this.v3 ? this.wrapperRef : this.$refs.wrapper;
@@ -336,5 +337,5 @@ var ColorPalette = {
336
337
  }
337
338
  }
338
339
  };
339
- var ColorPaletteVue3 = ColorPalette;
340
- export { ColorPalette, ColorPaletteVue3 };
340
+ var ColorPalette = ColorPaletteVue2;
341
+ export { ColorPalette, ColorPaletteVue2 };
@@ -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 ColorPickerData {
45
44
  /**
46
45
  * @hidden
47
46
  */
48
- export interface ColorPickerAll extends Vue, ColorPickerMethods, ColorPickerData, ColorPickerComputed, ColorPickerState {
47
+ export interface ColorPickerAll extends Vue2type, ColorPickerMethods, ColorPickerData, ColorPickerComputed, ColorPickerState {
49
48
  }
50
- declare let ColorPicker: ComponentOptions<ColorPickerAll, DefaultData<ColorPickerData>, DefaultMethods<ColorPickerAll>, ColorPickerComputed, RecordPropsDefinition<ColorPickerProps>>;
51
- declare const ColorPickerVue3: DefineComponent<ColorPickerProps, any, ColorPickerData, ColorPickerComputed, ColorPickerMethods, {}, {}, {}, string, ColorPickerProps, ColorPickerProps, {}>;
52
- export { ColorPicker, ColorPickerVue3 };
49
+ declare let ColorPickerVue2: ComponentOptions<ColorPickerAll, DefaultData<ColorPickerData>, DefaultMethods<ColorPickerAll>, ColorPickerComputed, RecordPropsDefinition<ColorPickerProps>>;
50
+ declare const ColorPicker: DefineComponent<ColorPickerProps, any, ColorPickerData, ColorPickerComputed, ColorPickerMethods, {}, {}, {}, string, ColorPickerProps, ColorPickerProps, {}>;
51
+ export { ColorPicker, ColorPickerVue2 };
@@ -2,9 +2,9 @@
2
2
  import * as Vue from 'vue';
3
3
  var allVue = Vue;
4
4
  var gh = allVue.h;
5
+ import { Button } from '@progress/kendo-vue-buttons';
5
6
  import { classNames, Keys, // useDir,
6
- getTabIndex, guid } from '@progress/kendo-vue-common';
7
- import { validatePackage } from '@progress/kendo-vue-common';
7
+ getTabIndex, guid, kendoThemeMaps, validatePackage } from '@progress/kendo-vue-common';
8
8
  import { packageMetadata } from '../package-metadata';
9
9
  import { Picker } from './Picker';
10
10
  import { ColorPalette, DEFAULT_PRESET, DEFAULT_TILE_SIZE } from './ColorPalette';
@@ -32,7 +32,7 @@ var isControlled = function isControlled(prop) {
32
32
  }; // tslint:enable:max-line-length
33
33
 
34
34
 
35
- var ColorPicker = {
35
+ var ColorPickerVue2 = {
36
36
  name: 'KendoColorPicker',
37
37
  props: {
38
38
  value: {
@@ -78,7 +78,7 @@ var ColorPicker = {
78
78
  type: String,
79
79
  default: 'medium',
80
80
  validator: function validator(value) {
81
- return [null, 'small', 'medium', 'large', 'pill'].includes(value);
81
+ return [null, 'small', 'medium', 'large', 'full'].includes(value);
82
82
  }
83
83
  },
84
84
  fillMode: {
@@ -114,19 +114,16 @@ var ColorPicker = {
114
114
  return this.$props.iconClassName || icon && "k-icon k-i-" + icon;
115
115
  },
116
116
  wrapperClassName: function wrapperClassName() {
117
- return {
118
- 'k-widget': true,
119
- 'k-colorpicker': true,
120
- 'k-state-invalid': this.valid === false
121
- };
122
- },
123
- spanClassName: function spanClassName() {
124
- var disabled = this.$props.disabled;
125
- return {
126
- 'k-picker-wrap': true,
127
- 'k-state-disabled': disabled,
128
- 'k-state-focused': this.focused
129
- };
117
+ var _a;
118
+
119
+ var _b = this.$props,
120
+ size = _b.size,
121
+ fillMode = _b.fillMode,
122
+ rounded = _b.rounded;
123
+ return _a = {
124
+ 'k-picker': true,
125
+ 'k-colorpicker': true
126
+ }, _a["k-picker-" + (kendoThemeMaps.sizeMap[size] || size)] = size, _a["k-picker-" + fillMode] = fillMode, _a["k-rounded-" + (kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-valid'] = this.valid, _a['k-invalid'] = !this.valid, _a['k-disabled'] = this.disabled, _a['k-focus'] = this.focused, _a;
130
127
  }
131
128
  },
132
129
  created: function created() {
@@ -153,16 +150,18 @@ var ColorPicker = {
153
150
  render: function render(createElement) {
154
151
  var _this2 = this;
155
152
 
153
+ var _a;
154
+
156
155
  var _this = this;
157
156
 
158
157
  var h = gh || createElement;
159
- var _a = this.$props,
160
- disabled = _a.disabled,
161
- tabIndex = _a.tabIndex; // const dir = useDir(focusableElementGuid, props.dir);
158
+ var _b = this.$props,
159
+ disabled = _b.disabled,
160
+ tabIndex = _b.tabIndex; // const dir = useDir(focusableElementGuid, props.dir);
162
161
 
163
162
  return h("span", {
164
- "class": this.wrapperClassName
165
- }, [h("span", {
163
+ "class": this.wrapperClassName // dir={dir}
164
+ ,
166
165
  id: this.$props.id,
167
166
  attrs: this.v3 ? undefined : {
168
167
  id: this.$props.id,
@@ -173,7 +172,6 @@ var ColorPicker = {
173
172
  },
174
173
  "aria-labelledby": this.$props.ariaLabelledBy,
175
174
  "aria-describedby": this.$props.ariaDescribedBy,
176
- "class": this.spanClassName,
177
175
  ref: this.focusableElementGuid,
178
176
  tabIndex: getTabIndex(tabIndex, disabled),
179
177
  title: this.$props.title,
@@ -185,40 +183,41 @@ var ColorPicker = {
185
183
  },
186
184
  onFocusin: this.onFocusHandler,
187
185
  onFocusout: this.onBlurHandler
188
- }, [!this.computedIconClassName ? h("span", {
189
- onClick: this.onActiveColorClickHandler,
190
- on: this.v3 ? undefined : {
191
- "click": this.onActiveColorClickHandler
192
- },
193
- "class": 'k-selected-color',
194
- style: {
195
- backgroundColor: this.computedValue
196
- }
197
- }, [!this.computedValue && h("span", {
198
- "class": 'k-icon k-i-line'
199
- })]) : h("span", {
186
+ }, [h("span", {
200
187
  onClick: this.onActiveColorClickHandler,
201
188
  on: this.v3 ? undefined : {
202
189
  "click": this.onActiveColorClickHandler
203
190
  },
204
- "class": classNames('k-tool-icon', this.computedIconClassName)
191
+ "class": 'k-input-inner'
205
192
  }, [h("span", {
206
- "class": 'k-selected-color',
193
+ "class": classNames('k-value-icon', 'k-color-preview', {
194
+ 'k-no-color': !this.computedValue,
195
+ 'k-icon-color-preview': this.icon || this.iconClassName
196
+ })
197
+ }, [(this.iconClassName || this.icon) && h("span", {
198
+ "class": classNames('k-color-preview-icon', this.iconClassName, (_a = {}, _a["k-icon k-i-" + this.icon] = this.icon && !this.iconClassName, _a))
199
+ }), h("span", {
200
+ "class": "k-color-preview-mask",
207
201
  style: {
208
202
  backgroundColor: this.computedValue
209
203
  }
210
- })]), h("span", {
204
+ })])]), // @ts-ignore
205
+ h(Button, {
206
+ type: "button",
207
+ attrs: this.v3 ? undefined : {
208
+ type: "button",
209
+ icon: 'arrow-s'
210
+ },
211
+ ref: this.v3 ? function (el) {
212
+ _this.buttonRef = el;
213
+ } : 'button',
211
214
  onClick: this.onClickHandler,
212
215
  on: this.v3 ? undefined : {
213
216
  "click": this.onClickHandler
214
217
  },
215
- "class": 'k-select',
216
- ref: this.v3 ? function (el) {
217
- _this.buttonRef = el;
218
- } : 'button'
219
- }, [h("span", {
220
- "class": 'k-icon k-i-arrow-s'
221
- })]), // @ts-ignore function children
218
+ "class": "k-input-button",
219
+ icon: 'arrow-s'
220
+ }), // @ts-ignore function children
222
221
  h(Picker // dir={dir}
223
222
  , {
224
223
  open: this.computedOpen,
@@ -263,7 +262,7 @@ var ColorPicker = {
263
262
  value: _this2.computedValue || undefined
264
263
  },
265
264
  onChange: _this2.onPaletteChangeHandler
266
- })])])]);
265
+ })])]);
267
266
  },
268
267
  methods: {
269
268
  focusElement: function focusElement() {
@@ -378,5 +377,5 @@ var ColorPicker = {
378
377
  }
379
378
  }
380
379
  };
381
- var ColorPickerVue3 = ColorPicker;
382
- export { ColorPicker, ColorPickerVue3 };
380
+ var ColorPicker = ColorPickerVue2;
381
+ export { ColorPicker, ColorPickerVue2 };
@@ -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;
@@ -34,8 +33,8 @@ export interface PickerData {
34
33
  /**
35
34
  * @hidden
36
35
  */
37
- export interface PickerAll extends Vue, PickerMethods, PickerData, PickerComputed, PickerState {
36
+ export interface PickerAll extends Vue2type, PickerMethods, PickerData, PickerComputed, PickerState {
38
37
  }
39
- declare let Picker: ComponentOptions<PickerAll, DefaultData<PickerData>, DefaultMethods<PickerAll>, PickerComputed, RecordPropsDefinition<PickerProps>>;
40
- declare const PickerVue3: DefineComponent<PickerProps, any, PickerData, PickerComputed, PickerMethods, {}, {}, {}, string, PickerProps, PickerProps, {}>;
41
- export { Picker, PickerVue3 };
38
+ declare let PickerVue2: ComponentOptions<PickerAll, DefaultData<PickerData>, DefaultMethods<PickerAll>, PickerComputed, RecordPropsDefinition<PickerProps>>;
39
+ declare const Picker: DefineComponent<PickerProps, any, PickerData, PickerComputed, PickerMethods, {}, {}, {}, string, PickerProps, PickerProps, {}>;
40
+ export { Picker, PickerVue2 };
@@ -15,7 +15,7 @@ var ANCHOR_VERTICAL_ALIGN = 'bottom';
15
15
 
16
16
  var POPUP_VERTICAL_ALIGN = 'top'; // tslint:enable:max-line-length
17
17
 
18
- var Picker = {
18
+ var PickerVue2 = {
19
19
  name: 'KendoPicker',
20
20
  props: {
21
21
  popupSettings: Object,
@@ -90,5 +90,5 @@ var Picker = {
90
90
  }
91
91
  }
92
92
  };
93
- var PickerVue3 = Picker;
94
- export { Picker, PickerVue3 };
93
+ var Picker = PickerVue2;
94
+ export { Picker, PickerVue2 };
@@ -121,12 +121,12 @@ export interface ColorPickerProps {
121
121
  * - small
122
122
  * - medium
123
123
  * - large
124
- * - pill
124
+ * - full
125
125
  * - null&mdash;Does not set a rounded `className`.
126
126
  *
127
127
  * @default `medium`
128
128
  */
129
- rounded?: null | 'small' | 'medium' | 'large' | 'pill' | string;
129
+ rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
130
130
  /**
131
131
  * Configures the `fillMode` of the ColorPicker.
132
132
  *
@@ -1,6 +1,5 @@
1
- import { DefineComponent } from '../additionalTypes';
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
2
2
  import { FormComponentProps } from '@progress/kendo-vue-common';
3
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
4
3
  declare type DefaultData<V> = object | ((this: V) => InputData);
5
4
  declare type DefaultMethods<V> = {
6
5
  [key: string]: (this: V, ...args: any[]) => any;
@@ -19,6 +18,43 @@ export interface InputProps extends FormComponentProps {
19
18
  modelValue?: string | number;
20
19
  defaultValue?: string | string[] | number | undefined;
21
20
  validate?: boolean;
21
+ /**
22
+ * Configures the `size` of the MaskedTextBox.
23
+ *
24
+ * The available options are:
25
+ * - small
26
+ * - medium
27
+ * - large
28
+ * - null&mdash;Does not set a size `class`.
29
+ *
30
+ * @default `medium`
31
+ */
32
+ size?: null | 'small' | 'medium' | 'large' | string;
33
+ /**
34
+ * Configures the `roundness` of the MaskedTextBox.
35
+ *
36
+ * The available options are:
37
+ * - small
38
+ * - medium
39
+ * - large
40
+ * - full
41
+ * - null&mdash;Does not set a rounded `class`.
42
+ *
43
+ * @default `medium`
44
+ */
45
+ rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
46
+ /**
47
+ * Configures the `fillMode` of the MaskedTextBox.
48
+ *
49
+ * The available options are:
50
+ * - solid
51
+ * - outline
52
+ * - flat
53
+ * - null&mdash;Does not set a fillMode `class`.
54
+ *
55
+ * @default `solid`
56
+ */
57
+ fillMode?: null | 'solid' | 'flat' | 'outline' | string;
22
58
  dir?: string;
23
59
  onChange?: Element;
24
60
  onFocus?: (event: any) => void;
@@ -55,7 +91,6 @@ export interface InputMethods {
55
91
  emitBlur?: (_: any) => void;
56
92
  emitFocus?: (_: any) => void;
57
93
  focus?: () => void;
58
- inputClassNames: () => any;
59
94
  validity: () => any;
60
95
  isInvalid: (state: any) => any;
61
96
  setValidity: () => void;
@@ -71,12 +106,13 @@ export interface InputComputed {
71
106
  [key: string]: any;
72
107
  computedValue?: any;
73
108
  spanClassNames?: any;
109
+ inputWrapperClass?: any;
74
110
  }
75
111
  /**
76
112
  * @hidden
77
113
  */
78
- export interface InputAllMethods extends Vue, InputMethods, InputComputed, InputState {
114
+ export interface InputAllMethods extends Vue2type, InputMethods, InputComputed, InputState {
79
115
  }
80
- declare let Input: ComponentOptions<InputAllMethods, DefaultData<InputData>, DefaultMethods<InputAllMethods>, InputComputed, RecordPropsDefinition<InputProps>>;
81
- declare const InputVue3: DefineComponent<InputProps, any, InputData, InputComputed, InputMethods, {}, {}, {}, string, InputProps, InputProps, {}>;
82
- export { Input, InputVue3 };
116
+ declare let InputVue2: ComponentOptions<InputAllMethods, DefaultData<InputData>, DefaultMethods<InputAllMethods>, InputComputed, RecordPropsDefinition<InputProps>>;
117
+ declare const Input: DefineComponent<InputProps, any, InputData, InputComputed, InputMethods, {}, {}, {}, string, InputProps, InputProps, {}>;
118
+ export { Input, InputVue2 };