@progress/kendo-angular-inputs 7.5.1 → 8.0.0-dev.202112211528
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/dist/cdn/js/kendo-angular-inputs.js +2 -2
- package/dist/cdn/main.js +1 -1
- package/dist/es/checkbox/checkbox.directive.js +79 -3
- package/dist/es/colorpicker/color-contrast-svg.component.js +95 -0
- package/dist/es/colorpicker/color-gradient.component.js +109 -81
- package/dist/es/colorpicker/color-input.component.js +39 -18
- package/dist/es/colorpicker/color-palette.component.js +28 -18
- package/dist/es/colorpicker/colorpicker.component.js +279 -80
- package/dist/es/colorpicker/constants.js +12 -0
- package/dist/es/colorpicker/contrast-validation.component.js +8 -6
- package/dist/es/colorpicker/contrast.component.js +6 -8
- package/dist/es/colorpicker/{models → events}/active-color-click-event.js +0 -0
- package/dist/es/colorpicker/events/cancel-event.js +19 -0
- package/dist/es/colorpicker/events/close-event.js +17 -0
- package/dist/es/colorpicker/{models → events}/kendo-drag-event.js +0 -0
- package/dist/es/colorpicker/events/open-event.js +17 -0
- package/dist/es/colorpicker/events.js +8 -0
- package/dist/es/colorpicker/flatcolorpicker-actions.component.js +50 -0
- package/dist/es/colorpicker/flatcolorpicker-header.component.js +94 -0
- package/dist/es/colorpicker/flatcolorpicker.component.js +553 -0
- package/dist/es/colorpicker/localization/colorgradient-localization.service.js +7 -7
- package/dist/es/colorpicker/localization/colorpalette-localization.service.js +7 -7
- package/dist/es/colorpicker/localization/custom-messages.component.js +1 -1
- package/dist/es/colorpicker/localization/flatcolorpicker-localization.service.js +34 -0
- package/dist/es/colorpicker/localization/localized-colorpicker-messages.directive.js +1 -1
- package/dist/es/colorpicker/localization/messages.js +36 -0
- package/dist/es/colorpicker/models/{color-picker-view.js → actions-layout.js} +0 -0
- package/dist/{es2015/colorpicker/models/color-picker-view.js → es/colorpicker/models/colorpicker-view.js} +0 -0
- package/dist/es/colorpicker/{utils → models}/palette-presets.js +0 -0
- package/dist/es/colorpicker/models.js +1 -2
- package/dist/es/colorpicker/services/flatcolorpicker.service.js +41 -0
- package/dist/es/colorpicker/utils/color-parser.js +18 -5
- package/dist/es/colorpicker/utils/contrast-curve.js +91 -0
- package/dist/es/colorpicker/utils.js +1 -1
- package/dist/es/colorpicker.module.js +9 -1
- package/dist/es/common/models/fillmode.js +4 -0
- package/dist/es/common/models/rounded.js +4 -0
- package/dist/es/common/models/size.js +4 -0
- package/dist/es/common/models/styling-classes.js +4 -0
- package/dist/{es2015/colorpicker/models/kendo-drag-event.js → es/common/models.js} +0 -0
- package/dist/es/common/utils.js +37 -0
- package/dist/es/index.js +5 -0
- package/dist/es/main.js +4 -2
- package/dist/es/maskedtextbox/maskedtextbox.component.js +101 -6
- package/dist/es/numerictextbox/numerictextbox.component.js +116 -20
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/radiobutton/radiobutton.directive.js +52 -3
- package/dist/es/shared/textarea.directive.js +3 -2
- package/dist/es/shared/utils.js +23 -0
- package/dist/es/switch/switch.component.js +167 -21
- package/dist/es/text-fields-common/text-fields-base.js +1 -1
- package/dist/es/textarea/textarea.component.js +101 -5
- package/dist/es/textbox/textbox.component.js +111 -12
- package/dist/es/textbox/textbox.directive.js +3 -2
- package/dist/es/textbox.module.js +0 -3
- package/dist/es2015/checkbox/checkbox.directive.d.ts +31 -0
- package/dist/es2015/checkbox/checkbox.directive.js +68 -10
- package/dist/es2015/colorpicker/color-contrast-svg.component.d.ts +26 -0
- package/dist/es2015/colorpicker/color-contrast-svg.component.js +97 -0
- package/dist/es2015/colorpicker/color-gradient.component.d.ts +32 -43
- package/dist/es2015/colorpicker/color-gradient.component.js +126 -93
- package/dist/es2015/colorpicker/color-input.component.d.ts +11 -4
- package/dist/es2015/colorpicker/color-input.component.js +52 -32
- package/dist/es2015/colorpicker/color-palette.component.d.ts +8 -3
- package/dist/es2015/colorpicker/color-palette.component.js +28 -18
- package/dist/es2015/colorpicker/colorpicker.component.d.ts +127 -25
- package/dist/es2015/colorpicker/colorpicker.component.js +305 -125
- package/dist/es2015/colorpicker/constants.d.ts +12 -0
- package/dist/es2015/colorpicker/constants.js +12 -0
- package/dist/es2015/colorpicker/contrast-validation.component.d.ts +1 -1
- package/dist/es2015/colorpicker/contrast-validation.component.js +16 -12
- package/dist/es2015/colorpicker/contrast.component.d.ts +1 -3
- package/dist/es2015/colorpicker/contrast.component.js +17 -17
- package/dist/es2015/colorpicker/{models → events}/active-color-click-event.d.ts +0 -0
- package/dist/es2015/colorpicker/{models → events}/active-color-click-event.js +0 -0
- package/dist/es2015/colorpicker/events/cancel-event.d.ts +15 -0
- package/dist/es2015/colorpicker/events/cancel-event.js +14 -0
- package/dist/es2015/colorpicker/events/close-event.d.ts +10 -0
- package/dist/es2015/colorpicker/events/close-event.js +10 -0
- package/dist/es2015/colorpicker/{models → events}/kendo-drag-event.d.ts +0 -0
- package/dist/es2015/colorpicker/events/kendo-drag-event.js +4 -0
- package/dist/es2015/colorpicker/events/open-event.d.ts +10 -0
- package/dist/es2015/colorpicker/events/open-event.js +10 -0
- package/dist/es2015/colorpicker/events.d.ts +8 -0
- package/dist/es2015/colorpicker/events.js +8 -0
- package/dist/es2015/colorpicker/flatcolorpicker-actions.component.d.ts +18 -0
- package/dist/es2015/colorpicker/flatcolorpicker-actions.component.js +60 -0
- package/dist/es2015/colorpicker/flatcolorpicker-header.component.d.ts +30 -0
- package/dist/es2015/colorpicker/flatcolorpicker-header.component.js +131 -0
- package/dist/es2015/colorpicker/flatcolorpicker.component.d.ts +214 -0
- package/dist/es2015/colorpicker/flatcolorpicker.component.js +593 -0
- package/dist/es2015/colorpicker/localization/colorgradient-localization.service.d.ts +3 -3
- package/dist/es2015/colorpicker/localization/colorgradient-localization.service.js +7 -7
- package/dist/es2015/colorpicker/localization/colorpalette-localization.service.d.ts +3 -3
- package/dist/es2015/colorpicker/localization/colorpalette-localization.service.js +7 -7
- package/dist/es2015/colorpicker/localization/custom-messages.component.js +1 -1
- package/dist/es2015/colorpicker/localization/flatcolorpicker-localization.service.d.ts +14 -0
- package/dist/es2015/colorpicker/localization/flatcolorpicker-localization.service.js +31 -0
- package/dist/es2015/colorpicker/localization/localized-colorpicker-messages.directive.js +1 -1
- package/dist/es2015/colorpicker/localization/messages.d.ts +36 -0
- package/dist/es2015/colorpicker/localization/messages.js +36 -0
- package/dist/es2015/colorpicker/models/actions-layout.d.ts +8 -0
- package/dist/es2015/colorpicker/models/actions-layout.js +4 -0
- package/dist/es2015/colorpicker/models/colorpicker-view.d.ts +8 -0
- package/dist/es2015/colorpicker/models/colorpicker-view.js +4 -0
- package/dist/es2015/colorpicker/models/gradient-settings.d.ts +4 -3
- package/dist/es2015/colorpicker/models/output-format.d.ts +0 -5
- package/dist/es2015/colorpicker/{utils → models}/palette-presets.d.ts +0 -0
- package/dist/es2015/colorpicker/{utils → models}/palette-presets.js +0 -0
- package/dist/es2015/colorpicker/models/palette-settings.d.ts +2 -3
- package/dist/es2015/colorpicker/models/tile-size.d.ts +1 -5
- package/dist/es2015/colorpicker/models.d.ts +10 -10
- package/dist/es2015/colorpicker/models.js +1 -2
- package/dist/es2015/colorpicker/services/flatcolorpicker.service.d.ts +12 -0
- package/dist/es2015/colorpicker/services/flatcolorpicker.service.js +38 -0
- package/dist/es2015/colorpicker/utils/color-parser.d.ts +8 -2
- package/dist/es2015/colorpicker/utils/color-parser.js +15 -5
- package/dist/es2015/colorpicker/utils/contrast-curve.d.ts +37 -0
- package/dist/es2015/colorpicker/utils/contrast-curve.js +85 -0
- package/dist/es2015/colorpicker/utils.d.ts +1 -1
- package/dist/es2015/colorpicker/utils.js +1 -1
- package/dist/es2015/colorpicker.module.js +9 -1
- package/dist/es2015/{colorpicker/models/color-picker-view.d.ts → common/models/fillmode.d.ts} +5 -5
- package/dist/es2015/common/models/fillmode.js +4 -0
- package/dist/es2015/common/models/rounded.d.ts +23 -0
- package/dist/es2015/common/models/rounded.js +4 -0
- package/dist/es2015/common/models/size.d.ts +14 -0
- package/dist/es2015/common/models/size.js +4 -0
- package/dist/es2015/common/models/styling-classes.d.ts +11 -0
- package/dist/es2015/common/models/styling-classes.js +4 -0
- package/dist/es2015/common/models.d.ts +8 -0
- package/dist/es2015/common/models.js +4 -0
- package/dist/es2015/common/utils.d.ts +7 -0
- package/dist/es2015/common/utils.js +37 -0
- package/dist/es2015/index.d.ts +5 -0
- package/dist/es2015/index.js +5 -0
- package/dist/es2015/index.metadata.json +1 -1
- package/dist/es2015/main.d.ts +5 -2
- package/dist/es2015/main.js +4 -2
- package/dist/es2015/maskedtextbox/maskedtextbox.component.d.ts +39 -1
- package/dist/es2015/maskedtextbox/maskedtextbox.component.js +88 -6
- package/dist/es2015/numerictextbox/numerictextbox.component.d.ts +39 -2
- package/dist/es2015/numerictextbox/numerictextbox.component.js +124 -40
- package/dist/es2015/package-metadata.js +1 -1
- package/dist/es2015/radiobutton/radiobutton.directive.d.ts +18 -0
- package/dist/es2015/radiobutton/radiobutton.directive.js +46 -11
- package/dist/es2015/shared/textarea.directive.d.ts +1 -1
- package/dist/es2015/shared/textarea.directive.js +3 -2
- package/dist/es2015/shared/utils.d.ts +16 -0
- package/dist/es2015/shared/utils.js +23 -0
- package/dist/es2015/switch/switch.component.d.ts +48 -5
- package/dist/es2015/switch/switch.component.js +166 -24
- package/dist/es2015/text-fields-common/text-fields-base.js +1 -1
- package/dist/es2015/textarea/textarea.component.d.ts +39 -1
- package/dist/es2015/textarea/textarea.component.js +89 -5
- package/dist/es2015/textbox/textbox.component.d.ts +40 -1
- package/dist/es2015/textbox/textbox.component.js +99 -12
- package/dist/es2015/textbox/textbox.directive.d.ts +1 -1
- package/dist/es2015/textbox/textbox.directive.js +3 -2
- package/dist/es2015/textbox.module.js +0 -3
- package/dist/fesm2015/index.js +3118 -1477
- package/dist/fesm5/index.js +3040 -1387
- package/dist/npm/checkbox/checkbox.directive.js +78 -2
- package/dist/npm/colorpicker/color-contrast-svg.component.js +97 -0
- package/dist/npm/colorpicker/color-gradient.component.js +109 -81
- package/dist/npm/colorpicker/color-input.component.js +38 -17
- package/dist/npm/colorpicker/color-palette.component.js +29 -19
- package/dist/npm/colorpicker/colorpicker.component.js +285 -86
- package/dist/npm/colorpicker/constants.js +12 -0
- package/dist/npm/colorpicker/contrast-validation.component.js +8 -6
- package/dist/npm/colorpicker/contrast.component.js +6 -8
- package/dist/npm/colorpicker/{models → events}/active-color-click-event.js +0 -0
- package/dist/npm/colorpicker/events/cancel-event.js +21 -0
- package/dist/npm/colorpicker/events/close-event.js +19 -0
- package/dist/npm/colorpicker/{models → events}/kendo-drag-event.js +0 -0
- package/dist/npm/colorpicker/events/open-event.js +19 -0
- package/dist/npm/colorpicker/events.js +11 -0
- package/dist/npm/colorpicker/flatcolorpicker-actions.component.js +52 -0
- package/dist/npm/colorpicker/flatcolorpicker-header.component.js +96 -0
- package/dist/npm/colorpicker/flatcolorpicker.component.js +555 -0
- package/dist/npm/colorpicker/localization/colorgradient-localization.service.js +7 -7
- package/dist/npm/colorpicker/localization/colorpalette-localization.service.js +7 -7
- package/dist/npm/colorpicker/localization/custom-messages.component.js +1 -1
- package/dist/npm/colorpicker/localization/flatcolorpicker-localization.service.js +36 -0
- package/dist/npm/colorpicker/localization/localized-colorpicker-messages.directive.js +1 -1
- package/dist/npm/colorpicker/localization/messages.js +36 -0
- package/dist/npm/colorpicker/models/{color-picker-view.js → actions-layout.js} +0 -0
- package/dist/npm/colorpicker/models/colorpicker-view.js +6 -0
- package/dist/npm/colorpicker/{utils → models}/palette-presets.js +0 -0
- package/dist/npm/colorpicker/models.js +1 -2
- package/dist/npm/colorpicker/services/flatcolorpicker.service.js +43 -0
- package/dist/npm/colorpicker/utils/color-parser.js +18 -5
- package/dist/npm/colorpicker/utils/contrast-curve.js +93 -0
- package/dist/npm/colorpicker/utils.js +1 -1
- package/dist/npm/colorpicker.module.js +9 -1
- package/dist/npm/common/models/fillmode.js +6 -0
- package/dist/npm/common/models/rounded.js +6 -0
- package/dist/npm/common/models/size.js +6 -0
- package/dist/npm/common/models/styling-classes.js +6 -0
- package/dist/npm/common/models.js +6 -0
- package/dist/npm/common/utils.js +37 -0
- package/dist/npm/index.js +10 -0
- package/dist/npm/main.js +7 -4
- package/dist/npm/maskedtextbox/maskedtextbox.component.js +100 -5
- package/dist/npm/numerictextbox/numerictextbox.component.js +115 -19
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/radiobutton/radiobutton.directive.js +51 -2
- package/dist/npm/shared/textarea.directive.js +3 -2
- package/dist/npm/shared/utils.js +25 -0
- package/dist/npm/switch/switch.component.js +166 -20
- package/dist/npm/text-fields-common/text-fields-base.js +1 -1
- package/dist/npm/textarea/textarea.component.js +100 -4
- package/dist/npm/textbox/textbox.component.js +113 -14
- package/dist/npm/textbox/textbox.directive.js +3 -2
- package/dist/npm/textbox.module.js +0 -3
- package/dist/systemjs/kendo-angular-inputs.js +1 -1
- package/package.json +15 -12
- package/dist/es/colorpicker/models/preventable-event.js +0 -29
- package/dist/es/textbox/floating-label-input-adapter.js +0 -58
- package/dist/es/textbox/textbox-container.component.js +0 -224
- package/dist/es2015/colorpicker/models/preventable-event.d.ts +0 -21
- package/dist/es2015/colorpicker/models/preventable-event.js +0 -27
- package/dist/es2015/textbox/floating-label-input-adapter.d.ts +0 -20
- package/dist/es2015/textbox/floating-label-input-adapter.js +0 -52
- package/dist/es2015/textbox/textbox-container.component.d.ts +0 -59
- package/dist/es2015/textbox/textbox-container.component.js +0 -209
- package/dist/npm/colorpicker/models/preventable-event.js +0 -31
- package/dist/npm/textbox/floating-label-input-adapter.js +0 -60
- package/dist/npm/textbox/textbox-container.component.js +0 -226
|
@@ -3,18 +3,20 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import * as tslib_1 from "tslib";
|
|
6
|
+
import { isJapanese } from './../shared/utils';
|
|
6
7
|
import { closest } from './../common/dom-utils';
|
|
7
8
|
import { NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
|
|
8
9
|
import { Component, ElementRef, forwardRef, Input, Output, EventEmitter, HostBinding, ViewChild, NgZone, ChangeDetectorRef, Injector, ContentChild, Renderer2 } from '@angular/core';
|
|
9
10
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
10
11
|
import { packageMetadata } from '../package-metadata';
|
|
11
12
|
import { invokeElementMethod } from '../common/dom-utils';
|
|
12
|
-
import { areSame, requiresZoneOnBlur } from '../common/utils';
|
|
13
|
+
import { areSame, requiresZoneOnBlur, getStylingClasses } from '../common/utils';
|
|
13
14
|
import { guid, hasObservers, KendoInput, Keys } from '@progress/kendo-angular-common';
|
|
14
15
|
import { TextBoxSuffixTemplateDirective } from './textbox-suffix.directive';
|
|
15
16
|
import { TextBoxPrefixTemplateDirective } from './textbox-prefix.directive';
|
|
16
17
|
import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
|
|
17
|
-
|
|
18
|
+
import { isSafari } from '../shared/utils';
|
|
19
|
+
var FOCUSED = 'k-focus';
|
|
18
20
|
var TextBoxComponent = /** @class */ (function () {
|
|
19
21
|
function TextBoxComponent(localizationService, ngZone, changeDetector, renderer, injector, hostElement) {
|
|
20
22
|
var _this = this;
|
|
@@ -149,9 +151,12 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
149
151
|
* ```
|
|
150
152
|
*/
|
|
151
153
|
this.onBlur = new EventEmitter();
|
|
152
|
-
this.
|
|
154
|
+
this.hostClasses = true;
|
|
153
155
|
this._isFocused = false;
|
|
154
156
|
this.focusChangedProgrammatically = false;
|
|
157
|
+
this._size = 'medium';
|
|
158
|
+
this._rounded = 'medium';
|
|
159
|
+
this._fillMode = 'solid';
|
|
155
160
|
/**
|
|
156
161
|
* @hidden
|
|
157
162
|
*/
|
|
@@ -197,7 +202,7 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
197
202
|
* @hidden
|
|
198
203
|
*/
|
|
199
204
|
this.handleInput = function (ev) {
|
|
200
|
-
var incomingValue = ev.target.value;
|
|
205
|
+
var incomingValue = isSafari(navigator.userAgent) && isJapanese(ev.target.value) ? ev.data : ev.target.value;
|
|
201
206
|
_this.updateValue(incomingValue);
|
|
202
207
|
};
|
|
203
208
|
this.ngChange = function (_) { };
|
|
@@ -206,6 +211,70 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
206
211
|
this.direction = localizationService.rtl ? 'rtl' : 'ltr';
|
|
207
212
|
}
|
|
208
213
|
TextBoxComponent_1 = TextBoxComponent;
|
|
214
|
+
Object.defineProperty(TextBoxComponent.prototype, "size", {
|
|
215
|
+
get: function () {
|
|
216
|
+
return this._size;
|
|
217
|
+
},
|
|
218
|
+
/**
|
|
219
|
+
* The size property specifies the font size and line height of the TextBox
|
|
220
|
+
* ([see example]({% slug appearance_textbox %}#toc-size)).
|
|
221
|
+
*
|
|
222
|
+
* The possible values are:
|
|
223
|
+
* * `'small'`
|
|
224
|
+
* * `'medium'` (default)
|
|
225
|
+
* * `'large'`
|
|
226
|
+
* * `null`
|
|
227
|
+
*/
|
|
228
|
+
set: function (size) {
|
|
229
|
+
this.handleClasses(size, 'size');
|
|
230
|
+
this._size = size;
|
|
231
|
+
},
|
|
232
|
+
enumerable: true,
|
|
233
|
+
configurable: true
|
|
234
|
+
});
|
|
235
|
+
Object.defineProperty(TextBoxComponent.prototype, "rounded", {
|
|
236
|
+
get: function () {
|
|
237
|
+
return this._rounded;
|
|
238
|
+
},
|
|
239
|
+
/**
|
|
240
|
+
* The rounded property specifies the border radius of the TextBox
|
|
241
|
+
* ([see example]({% slug appearance_textbox %}#toc-rounded)).
|
|
242
|
+
*
|
|
243
|
+
* The possible values are:
|
|
244
|
+
* * `'small'`
|
|
245
|
+
* * `'medium'` (default)
|
|
246
|
+
* * `'large'`
|
|
247
|
+
* * `'full'`
|
|
248
|
+
* * `null`
|
|
249
|
+
*/
|
|
250
|
+
set: function (rounded) {
|
|
251
|
+
this.handleClasses(rounded, 'rounded');
|
|
252
|
+
this._rounded = rounded;
|
|
253
|
+
},
|
|
254
|
+
enumerable: true,
|
|
255
|
+
configurable: true
|
|
256
|
+
});
|
|
257
|
+
Object.defineProperty(TextBoxComponent.prototype, "fillMode", {
|
|
258
|
+
get: function () {
|
|
259
|
+
return this._fillMode;
|
|
260
|
+
},
|
|
261
|
+
/**
|
|
262
|
+
* The fillMode property specifies the background and border styles of the TextBox
|
|
263
|
+
* ([see example]({% slug appearance_textbox %}#toc-fillMode)).
|
|
264
|
+
*
|
|
265
|
+
* The possible values are:
|
|
266
|
+
* * `'flat'`
|
|
267
|
+
* * `'solid'` (default)
|
|
268
|
+
* * `'outline'`
|
|
269
|
+
* * `null`
|
|
270
|
+
*/
|
|
271
|
+
set: function (fillMode) {
|
|
272
|
+
this.handleClasses(fillMode, 'fillMode');
|
|
273
|
+
this._fillMode = fillMode;
|
|
274
|
+
},
|
|
275
|
+
enumerable: true,
|
|
276
|
+
configurable: true
|
|
277
|
+
});
|
|
209
278
|
Object.defineProperty(TextBoxComponent.prototype, "tabIndex", {
|
|
210
279
|
get: function () {
|
|
211
280
|
return this.tabindex;
|
|
@@ -282,6 +351,10 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
282
351
|
}
|
|
283
352
|
}));
|
|
284
353
|
});
|
|
354
|
+
var stylingInputs = ['size', 'rounded', 'fillMode'];
|
|
355
|
+
stylingInputs.forEach(function (input) {
|
|
356
|
+
_this.handleClasses(_this[input], input);
|
|
357
|
+
});
|
|
285
358
|
};
|
|
286
359
|
TextBoxComponent.prototype.ngOnChanges = function (changes) {
|
|
287
360
|
if (changes.disabled || changes.readonly || changes.value) {
|
|
@@ -415,8 +488,8 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
415
488
|
*/
|
|
416
489
|
get: function () {
|
|
417
490
|
return this.successIcon
|
|
418
|
-
? "
|
|
419
|
-
: "k-
|
|
491
|
+
? "" + this.successIcon
|
|
492
|
+
: "k-validation-icon k-icon k-i-check";
|
|
420
493
|
},
|
|
421
494
|
enumerable: true,
|
|
422
495
|
configurable: true
|
|
@@ -427,8 +500,8 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
427
500
|
*/
|
|
428
501
|
get: function () {
|
|
429
502
|
return this.errorIcon
|
|
430
|
-
? "
|
|
431
|
-
: "k-
|
|
503
|
+
? "" + this.errorIcon
|
|
504
|
+
: "k-validation-icon k-icon k-i-warning";
|
|
432
505
|
},
|
|
433
506
|
enumerable: true,
|
|
434
507
|
configurable: true
|
|
@@ -440,7 +513,7 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
440
513
|
get: function () {
|
|
441
514
|
return this.clearButtonIcon
|
|
442
515
|
? this.clearButtonIcon
|
|
443
|
-
: "k-icon k-i-
|
|
516
|
+
: "k-icon k-i-x";
|
|
444
517
|
},
|
|
445
518
|
enumerable: true,
|
|
446
519
|
configurable: true
|
|
@@ -519,6 +592,16 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
519
592
|
_this.isFocused = false;
|
|
520
593
|
});
|
|
521
594
|
};
|
|
595
|
+
TextBoxComponent.prototype.handleClasses = function (value, input) {
|
|
596
|
+
var elem = this.hostElement.nativeElement;
|
|
597
|
+
var classes = getStylingClasses('input', input, this[input], value);
|
|
598
|
+
if (classes.toRemove) {
|
|
599
|
+
this.renderer.removeClass(elem, classes.toRemove);
|
|
600
|
+
}
|
|
601
|
+
if (classes.toAdd) {
|
|
602
|
+
this.renderer.addClass(elem, classes.toAdd);
|
|
603
|
+
}
|
|
604
|
+
};
|
|
522
605
|
var TextBoxComponent_1;
|
|
523
606
|
tslib_1.__decorate([
|
|
524
607
|
Input(),
|
|
@@ -572,6 +655,21 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
572
655
|
Input(),
|
|
573
656
|
tslib_1.__metadata("design:type", String)
|
|
574
657
|
], TextBoxComponent.prototype, "clearButtonIcon", void 0);
|
|
658
|
+
tslib_1.__decorate([
|
|
659
|
+
Input(),
|
|
660
|
+
tslib_1.__metadata("design:type", String),
|
|
661
|
+
tslib_1.__metadata("design:paramtypes", [String])
|
|
662
|
+
], TextBoxComponent.prototype, "size", null);
|
|
663
|
+
tslib_1.__decorate([
|
|
664
|
+
Input(),
|
|
665
|
+
tslib_1.__metadata("design:type", String),
|
|
666
|
+
tslib_1.__metadata("design:paramtypes", [String])
|
|
667
|
+
], TextBoxComponent.prototype, "rounded", null);
|
|
668
|
+
tslib_1.__decorate([
|
|
669
|
+
Input(),
|
|
670
|
+
tslib_1.__metadata("design:type", String),
|
|
671
|
+
tslib_1.__metadata("design:paramtypes", [String])
|
|
672
|
+
], TextBoxComponent.prototype, "fillMode", null);
|
|
575
673
|
tslib_1.__decorate([
|
|
576
674
|
Input(),
|
|
577
675
|
tslib_1.__metadata("design:type", Number),
|
|
@@ -618,14 +716,15 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
618
716
|
tslib_1.__metadata("design:type", TextBoxPrefixTemplateDirective)
|
|
619
717
|
], TextBoxComponent.prototype, "prefixTemplate", void 0);
|
|
620
718
|
tslib_1.__decorate([
|
|
621
|
-
HostBinding('class.k-
|
|
719
|
+
HostBinding('class.k-disabled'),
|
|
622
720
|
tslib_1.__metadata("design:type", Boolean),
|
|
623
721
|
tslib_1.__metadata("design:paramtypes", [])
|
|
624
722
|
], TextBoxComponent.prototype, "disabledClass", null);
|
|
625
723
|
tslib_1.__decorate([
|
|
626
724
|
HostBinding('class.k-textbox'),
|
|
725
|
+
HostBinding('class.k-input'),
|
|
627
726
|
tslib_1.__metadata("design:type", Boolean)
|
|
628
|
-
], TextBoxComponent.prototype, "
|
|
727
|
+
], TextBoxComponent.prototype, "hostClasses", void 0);
|
|
629
728
|
tslib_1.__decorate([
|
|
630
729
|
HostBinding('attr.dir'),
|
|
631
730
|
tslib_1.__metadata("design:type", String)
|
|
@@ -644,7 +743,7 @@ var TextBoxComponent = /** @class */ (function () {
|
|
|
644
743
|
{ provide: KendoInput, useExisting: forwardRef(function () { return TextBoxComponent_1; }) }
|
|
645
744
|
],
|
|
646
745
|
selector: 'kendo-textbox',
|
|
647
|
-
template: "\n <ng-container kendoTextBoxLocalizedMessages\n i18n-clear=\"kendo.textbox.clear|The title for the **Clear** button in the TextBox.\"\n clear=\"Clear\">\n </ng-container>\n <span class=\"k-input-prefix\">\n <ng-template\n *ngIf=\"prefixTemplate\"\n [ngTemplateOutlet]=\"prefixTemplate?.templateRef\">\n </ng-template>\n </span>\n <input\n class=\"k-input\"\n #input\n [id]=\"focusableId\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.tabindex]=\"disabled ? undefined : tabindex\"\n [value]=\"value\"\n [attr.placeholder]=\"placeholder\"\n [attr.title]=\"title\"\n [attr.maxlength]=\"maxlength\"\n [kendoEventsOutsideAngular]=\"{\n focus: handleInputFocus,\n blur: handleInputBlur,\n input: handleInput}\"/>\n <span class=\"k-input-suffix\">\n <span *ngIf=\"hasErrors\" [ngClass]=\"errorIconClasses\"></span>\n <span *ngIf=\"isSuccessful\" [ngClass]=\"successIconClasses\"></span>\n <span\n role=\"button\"\n class=\"k-clear-value\"\n *ngIf=\"showClearButton\"\n (click)=\"clearValue()\"\n (mousedown)=\"$event.preventDefault()\"\n [tabindex]=\"tabIndex\"\n [attr.aria-label]=\"clearTitle()\"\n [title]=\"clearTitle()\"\n (keydown.enter)=\"clearValue($event)\"\n (keydown.space)=\"clearValue($event)\"\n >\n <span [ngClass]=\"clearButtonClasses\"></span>\n </span>\n <ng-template\n *ngIf=\"suffixTemplate\"\n [ngTemplateOutlet]=\"suffixTemplate?.templateRef\">\n </ng-template>\n </span>\n "
|
|
746
|
+
template: "\n <ng-container kendoTextBoxLocalizedMessages\n i18n-clear=\"kendo.textbox.clear|The title for the **Clear** button in the TextBox.\"\n clear=\"Clear\">\n </ng-container>\n <span class=\"k-input-prefix\">\n <ng-template\n *ngIf=\"prefixTemplate\"\n [ngTemplateOutlet]=\"prefixTemplate?.templateRef\">\n </ng-template>\n </span>\n <input\n class=\"k-input-inner\"\n #input\n [id]=\"focusableId\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.tabindex]=\"disabled ? undefined : tabindex\"\n [value]=\"value\"\n [attr.placeholder]=\"placeholder\"\n [attr.title]=\"title\"\n [attr.maxlength]=\"maxlength\"\n [kendoEventsOutsideAngular]=\"{\n focus: handleInputFocus,\n blur: handleInputBlur,\n input: handleInput}\"/>\n <span class=\"k-input-suffix\">\n <span *ngIf=\"hasErrors\" [ngClass]=\"errorIconClasses\"></span>\n <span *ngIf=\"isSuccessful\" [ngClass]=\"successIconClasses\"></span>\n <span\n role=\"button\"\n class=\"k-clear-value\"\n *ngIf=\"showClearButton\"\n (click)=\"clearValue()\"\n (mousedown)=\"$event.preventDefault()\"\n [tabindex]=\"tabIndex\"\n [attr.aria-label]=\"clearTitle()\"\n [title]=\"clearTitle()\"\n (keydown.enter)=\"clearValue($event)\"\n (keydown.space)=\"clearValue($event)\"\n >\n <span [ngClass]=\"clearButtonClasses\"></span>\n </span>\n <ng-template\n *ngIf=\"suffixTemplate\"\n [ngTemplateOutlet]=\"suffixTemplate?.templateRef\">\n </ng-template>\n </span>\n "
|
|
648
747
|
}),
|
|
649
748
|
tslib_1.__metadata("design:paramtypes", [LocalizationService,
|
|
650
749
|
NgZone,
|
|
@@ -21,7 +21,7 @@ var TextBoxDirective = /** @class */ (function () {
|
|
|
21
21
|
this.renderer = renderer;
|
|
22
22
|
this.inputElement = inputElement;
|
|
23
23
|
this.ngZone = ngZone;
|
|
24
|
-
this.
|
|
24
|
+
this.hostClasses = true;
|
|
25
25
|
/**
|
|
26
26
|
* @hidden
|
|
27
27
|
*/
|
|
@@ -99,8 +99,9 @@ var TextBoxDirective = /** @class */ (function () {
|
|
|
99
99
|
var TextBoxDirective_1;
|
|
100
100
|
tslib_1.__decorate([
|
|
101
101
|
HostBinding('class.k-textbox'),
|
|
102
|
+
HostBinding('class.k-input'),
|
|
102
103
|
tslib_1.__metadata("design:type", Boolean)
|
|
103
|
-
], TextBoxDirective.prototype, "
|
|
104
|
+
], TextBoxDirective.prototype, "hostClasses", void 0);
|
|
104
105
|
tslib_1.__decorate([
|
|
105
106
|
Input(),
|
|
106
107
|
tslib_1.__metadata("design:type", String),
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
import * as tslib_1 from "tslib";
|
|
6
6
|
import { NgModule } from "@angular/core";
|
|
7
7
|
import { TextBoxDirective } from "./textbox/textbox.directive";
|
|
8
|
-
import { TextBoxContainerComponent } from "./textbox/textbox-container.component";
|
|
9
8
|
import { TextBoxComponent } from "./textbox/textbox.component";
|
|
10
9
|
import { CommonModule } from "@angular/common";
|
|
11
10
|
import { EventsModule } from "@progress/kendo-angular-common";
|
|
@@ -52,7 +51,6 @@ var TextBoxModule = /** @class */ (function () {
|
|
|
52
51
|
NgModule({
|
|
53
52
|
declarations: [
|
|
54
53
|
TextBoxDirective,
|
|
55
|
-
TextBoxContainerComponent,
|
|
56
54
|
TextBoxComponent,
|
|
57
55
|
TextBoxSuffixTemplateDirective,
|
|
58
56
|
TextBoxPrefixTemplateDirective,
|
|
@@ -61,7 +59,6 @@ var TextBoxModule = /** @class */ (function () {
|
|
|
61
59
|
],
|
|
62
60
|
exports: [
|
|
63
61
|
TextBoxDirective,
|
|
64
|
-
TextBoxContainerComponent,
|
|
65
62
|
TextBoxComponent,
|
|
66
63
|
TextBoxSuffixTemplateDirective,
|
|
67
64
|
TextBoxPrefixTemplateDirective,
|
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { ElementRef, Renderer2 } from '@angular/core';
|
|
6
|
+
import { CheckBoxRounded, InputSize } from '../common/models';
|
|
5
7
|
/**
|
|
6
8
|
* Represents the directive that renders the [Kendo UI CheckBox]({% slug overview_checkbox %}) input component.
|
|
7
9
|
* The directive is placed on input type="checkbox" elements.
|
|
@@ -12,5 +14,34 @@
|
|
|
12
14
|
* ```
|
|
13
15
|
*/
|
|
14
16
|
export declare class CheckBoxDirective {
|
|
17
|
+
private renderer;
|
|
18
|
+
private hostElement;
|
|
15
19
|
kendoClass: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* The size property specifies the width and height of the CheckBox
|
|
22
|
+
* ([see example]({% slug appearance_checkboxdirective %}#toc-size)).
|
|
23
|
+
*
|
|
24
|
+
* The possible values are:
|
|
25
|
+
* * `'small'`
|
|
26
|
+
* * `'medium'` (default)
|
|
27
|
+
* * `'large'`
|
|
28
|
+
* * `null`
|
|
29
|
+
*/
|
|
30
|
+
size: InputSize;
|
|
31
|
+
/**
|
|
32
|
+
* The rounded property specifies the border radius of the CheckBox
|
|
33
|
+
* ([see example]({% slug appearance_checkboxdirective %}#toc-rounded)).
|
|
34
|
+
*
|
|
35
|
+
* The possible values are:
|
|
36
|
+
* * `'small'`
|
|
37
|
+
* * `'medium'` (default)
|
|
38
|
+
* * `'large'`
|
|
39
|
+
* * `null`
|
|
40
|
+
*/
|
|
41
|
+
rounded: CheckBoxRounded;
|
|
42
|
+
private _size;
|
|
43
|
+
private _rounded;
|
|
44
|
+
constructor(renderer: Renderer2, hostElement: ElementRef);
|
|
45
|
+
ngAfterViewInit(): void;
|
|
46
|
+
private handleClasses;
|
|
16
47
|
}
|
|
@@ -3,7 +3,8 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import * as tslib_1 from "tslib";
|
|
6
|
-
import { Directive, HostBinding } from '@angular/core';
|
|
6
|
+
import { Directive, ElementRef, HostBinding, Input, Renderer2 } from '@angular/core';
|
|
7
|
+
import { getStylingClasses } from '../common/utils';
|
|
7
8
|
/**
|
|
8
9
|
* Represents the directive that renders the [Kendo UI CheckBox]({% slug overview_checkbox %}) input component.
|
|
9
10
|
* The directive is placed on input type="checkbox" elements.
|
|
@@ -14,26 +15,83 @@ import { Directive, HostBinding } from '@angular/core';
|
|
|
14
15
|
* ```
|
|
15
16
|
*/
|
|
16
17
|
let CheckBoxDirective = class CheckBoxDirective {
|
|
18
|
+
constructor(renderer, hostElement) {
|
|
19
|
+
this.renderer = renderer;
|
|
20
|
+
this.hostElement = hostElement;
|
|
21
|
+
this.kendoClass = true;
|
|
22
|
+
this._size = 'medium';
|
|
23
|
+
this._rounded = 'medium';
|
|
24
|
+
}
|
|
17
25
|
/**
|
|
18
|
-
*
|
|
19
|
-
*
|
|
26
|
+
* The size property specifies the width and height of the CheckBox
|
|
27
|
+
* ([see example]({% slug appearance_checkboxdirective %}#toc-size)).
|
|
20
28
|
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
29
|
+
* The possible values are:
|
|
30
|
+
* * `'small'`
|
|
31
|
+
* * `'medium'` (default)
|
|
32
|
+
* * `'large'`
|
|
33
|
+
* * `null`
|
|
25
34
|
*/
|
|
26
|
-
|
|
27
|
-
this.
|
|
35
|
+
set size(size) {
|
|
36
|
+
this.handleClasses(size, 'size');
|
|
37
|
+
this._size = size;
|
|
38
|
+
}
|
|
39
|
+
get size() {
|
|
40
|
+
return this._size;
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* The rounded property specifies the border radius of the CheckBox
|
|
44
|
+
* ([see example]({% slug appearance_checkboxdirective %}#toc-rounded)).
|
|
45
|
+
*
|
|
46
|
+
* The possible values are:
|
|
47
|
+
* * `'small'`
|
|
48
|
+
* * `'medium'` (default)
|
|
49
|
+
* * `'large'`
|
|
50
|
+
* * `null`
|
|
51
|
+
*/
|
|
52
|
+
set rounded(rounded) {
|
|
53
|
+
this.handleClasses(rounded, 'rounded');
|
|
54
|
+
this._rounded = rounded;
|
|
55
|
+
}
|
|
56
|
+
get rounded() {
|
|
57
|
+
return this._rounded;
|
|
58
|
+
}
|
|
59
|
+
ngAfterViewInit() {
|
|
60
|
+
const stylingInputs = ['size', 'rounded'];
|
|
61
|
+
stylingInputs.forEach(input => {
|
|
62
|
+
this.handleClasses(this[input], input);
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
handleClasses(value, input) {
|
|
66
|
+
const elem = this.hostElement.nativeElement;
|
|
67
|
+
const classes = getStylingClasses('checkbox', input, this[input], value);
|
|
68
|
+
if (classes.toRemove) {
|
|
69
|
+
this.renderer.removeClass(elem, classes.toRemove);
|
|
70
|
+
}
|
|
71
|
+
if (classes.toAdd) {
|
|
72
|
+
this.renderer.addClass(elem, classes.toAdd);
|
|
73
|
+
}
|
|
28
74
|
}
|
|
29
75
|
};
|
|
30
76
|
tslib_1.__decorate([
|
|
31
77
|
HostBinding('class.k-checkbox'),
|
|
32
78
|
tslib_1.__metadata("design:type", Boolean)
|
|
33
79
|
], CheckBoxDirective.prototype, "kendoClass", void 0);
|
|
80
|
+
tslib_1.__decorate([
|
|
81
|
+
Input(),
|
|
82
|
+
tslib_1.__metadata("design:type", String),
|
|
83
|
+
tslib_1.__metadata("design:paramtypes", [String])
|
|
84
|
+
], CheckBoxDirective.prototype, "size", null);
|
|
85
|
+
tslib_1.__decorate([
|
|
86
|
+
Input(),
|
|
87
|
+
tslib_1.__metadata("design:type", String),
|
|
88
|
+
tslib_1.__metadata("design:paramtypes", [String])
|
|
89
|
+
], CheckBoxDirective.prototype, "rounded", null);
|
|
34
90
|
CheckBoxDirective = tslib_1.__decorate([
|
|
35
91
|
Directive({
|
|
36
92
|
selector: 'input[kendoCheckBox]'
|
|
37
|
-
})
|
|
93
|
+
}),
|
|
94
|
+
tslib_1.__metadata("design:paramtypes", [Renderer2,
|
|
95
|
+
ElementRef])
|
|
38
96
|
], CheckBoxDirective);
|
|
39
97
|
export { CheckBoxDirective };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { SimpleChanges, AfterViewInit, OnChanges } from '@angular/core';
|
|
6
|
+
import { BehaviorSubject } from 'rxjs';
|
|
7
|
+
import { HSVA } from './models';
|
|
8
|
+
/**
|
|
9
|
+
* @hidden
|
|
10
|
+
*/
|
|
11
|
+
export declare class ColorContrastSvgComponent implements AfterViewInit, OnChanges {
|
|
12
|
+
hostClass: boolean;
|
|
13
|
+
wrapper: any;
|
|
14
|
+
hsva: BehaviorSubject<HSVA>;
|
|
15
|
+
backgroundColor: string;
|
|
16
|
+
paths: any[];
|
|
17
|
+
oldHsva: HSVA;
|
|
18
|
+
oldH: number;
|
|
19
|
+
oldA: number;
|
|
20
|
+
metrics: any;
|
|
21
|
+
ngAfterViewInit(): void;
|
|
22
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
23
|
+
setPaths(): void;
|
|
24
|
+
private findValue;
|
|
25
|
+
private getPaths;
|
|
26
|
+
}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import * as tslib_1 from "tslib";
|
|
6
|
+
import { Component, HostBinding, Input } from '@angular/core';
|
|
7
|
+
import { BehaviorSubject } from 'rxjs';
|
|
8
|
+
import { isPresent } from '../common/utils';
|
|
9
|
+
import { AA_RATIO, STEP_COUNT, AAA_RATIO } from './constants';
|
|
10
|
+
import { bezierCommand, getContrastFromTwoRGBAs, getRGBA, getColorFromHSV, svgPath, controlPoint, line } from './utils';
|
|
11
|
+
/**
|
|
12
|
+
* @hidden
|
|
13
|
+
*/
|
|
14
|
+
let ColorContrastSvgComponent = class ColorContrastSvgComponent {
|
|
15
|
+
/**
|
|
16
|
+
* @hidden
|
|
17
|
+
*/
|
|
18
|
+
constructor() {
|
|
19
|
+
this.hostClass = true;
|
|
20
|
+
}
|
|
21
|
+
ngAfterViewInit() {
|
|
22
|
+
this.metrics = this.wrapper.getBoundingClientRect();
|
|
23
|
+
this.oldA = this.hsva.value.a;
|
|
24
|
+
this.oldH = this.hsva.value.h;
|
|
25
|
+
this.hsva.subscribe((value) => {
|
|
26
|
+
if (value.h !== this.oldH || value.a !== this.oldA) {
|
|
27
|
+
this.oldH = value.h;
|
|
28
|
+
this.oldA = value.a;
|
|
29
|
+
this.setPaths();
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
ngOnChanges(changes) {
|
|
34
|
+
if (isPresent(changes.backgroundColor) && this.metrics) {
|
|
35
|
+
this.setPaths();
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
setPaths() {
|
|
39
|
+
const bezierCommandCalc = bezierCommand(controlPoint(line));
|
|
40
|
+
this.paths = [svgPath(this.getPaths(AA_RATIO, STEP_COUNT), bezierCommandCalc),
|
|
41
|
+
svgPath(this.getPaths(AA_RATIO, STEP_COUNT, true), bezierCommandCalc),
|
|
42
|
+
svgPath(this.getPaths(AAA_RATIO, STEP_COUNT), bezierCommandCalc),
|
|
43
|
+
svgPath(this.getPaths(AAA_RATIO, STEP_COUNT, true), bezierCommandCalc)];
|
|
44
|
+
}
|
|
45
|
+
findValue(contrast, saturation, low, high, comparer) {
|
|
46
|
+
const mid = (low + high) / 2;
|
|
47
|
+
const hsva = Object.assign({}, this.hsva.value, { s: saturation / this.metrics.width, v: 1 - mid / this.metrics.height });
|
|
48
|
+
const currentContrast = getContrastFromTwoRGBAs(getRGBA(getColorFromHSV(hsva)), getRGBA(this.backgroundColor || ''));
|
|
49
|
+
if (low + 0.5 > high) {
|
|
50
|
+
if (currentContrast < contrast + 1 && currentContrast > contrast - 1) {
|
|
51
|
+
return mid;
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
return null;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
if (comparer(currentContrast, contrast)) {
|
|
58
|
+
return this.findValue(contrast, saturation, low, high - (high - low) / 2, comparer);
|
|
59
|
+
}
|
|
60
|
+
return this.findValue(contrast, saturation, low + (high - low) / 2, high, comparer);
|
|
61
|
+
}
|
|
62
|
+
getPaths(contrast, stepCount, reversed = false) {
|
|
63
|
+
const points = [];
|
|
64
|
+
for (let i = 0; i <= this.metrics.width; i += this.metrics.width / stepCount) {
|
|
65
|
+
const value = this.findValue(contrast, i, 0, this.metrics.height, reversed ? ((a, b) => a < b) : ((a, b) => a > b));
|
|
66
|
+
if (value !== null) {
|
|
67
|
+
points.push([i, value]);
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
return points;
|
|
71
|
+
}
|
|
72
|
+
};
|
|
73
|
+
tslib_1.__decorate([
|
|
74
|
+
HostBinding('class.k-color-contrast-svg'),
|
|
75
|
+
tslib_1.__metadata("design:type", Boolean)
|
|
76
|
+
], ColorContrastSvgComponent.prototype, "hostClass", void 0);
|
|
77
|
+
tslib_1.__decorate([
|
|
78
|
+
Input(),
|
|
79
|
+
tslib_1.__metadata("design:type", Object)
|
|
80
|
+
], ColorContrastSvgComponent.prototype, "wrapper", void 0);
|
|
81
|
+
tslib_1.__decorate([
|
|
82
|
+
Input(),
|
|
83
|
+
tslib_1.__metadata("design:type", BehaviorSubject)
|
|
84
|
+
], ColorContrastSvgComponent.prototype, "hsva", void 0);
|
|
85
|
+
tslib_1.__decorate([
|
|
86
|
+
Input(),
|
|
87
|
+
tslib_1.__metadata("design:type", String)
|
|
88
|
+
], ColorContrastSvgComponent.prototype, "backgroundColor", void 0);
|
|
89
|
+
ColorContrastSvgComponent = tslib_1.__decorate([
|
|
90
|
+
Component({
|
|
91
|
+
selector: '[kendoColorContrastSvg]',
|
|
92
|
+
template: `
|
|
93
|
+
<svg:path *ngFor="let path of paths" [attr.d]="path" fill="none" stroke="white" stroke-width="1"></svg:path>
|
|
94
|
+
`
|
|
95
|
+
})
|
|
96
|
+
], ColorContrastSvgComponent);
|
|
97
|
+
export { ColorContrastSvgComponent };
|