@indigina/ui-kit 1.1.30 → 1.1.31
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.
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { ChangeDetectionStrategy, Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation } from '@angular/core';
|
|
2
2
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
|
-
import * as i1 from "@angular
|
|
5
|
-
import * as i2 from "
|
|
6
|
-
import * as i3 from "../kit-input-
|
|
7
|
-
import * as i4 from "../kit-input-label/kit-input-label.component";
|
|
4
|
+
import * as i1 from "@progress/kendo-angular-inputs";
|
|
5
|
+
import * as i2 from "../kit-input-message/kit-input-message.component";
|
|
6
|
+
import * as i3 from "../kit-input-label/kit-input-label.component";
|
|
8
7
|
export class KitToggleComponent {
|
|
9
8
|
constructor() {
|
|
10
9
|
/**
|
|
@@ -19,18 +18,6 @@ export class KitToggleComponent {
|
|
|
19
18
|
* Defines a default value
|
|
20
19
|
*/
|
|
21
20
|
this.defaultChecked = false;
|
|
22
|
-
/**
|
|
23
|
-
* Defines whether to display On/Off labels
|
|
24
|
-
*/
|
|
25
|
-
this.onOffLabel = true;
|
|
26
|
-
/**
|
|
27
|
-
* Defines On label of the toggle, default is "On"
|
|
28
|
-
*/
|
|
29
|
-
this.onLabel = '';
|
|
30
|
-
/**
|
|
31
|
-
* Defines Off label of the toggle, default is "Off"
|
|
32
|
-
*/
|
|
33
|
-
this.offLabel = '';
|
|
34
21
|
/**
|
|
35
22
|
* Occurs as soon as toggle state is changed
|
|
36
23
|
*/
|
|
@@ -67,11 +54,11 @@ export class KitToggleComponent {
|
|
|
67
54
|
this.disabled = disabled;
|
|
68
55
|
}
|
|
69
56
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
70
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.7", type: KitToggleComponent, selector: "kit-toggle", inputs: { label: "label", disabled: "disabled", readonly: "readonly", defaultChecked: "defaultChecked",
|
|
57
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.7", type: KitToggleComponent, selector: "kit-toggle", inputs: { label: "label", disabled: "disabled", readonly: "readonly", defaultChecked: "defaultChecked", leftLabel: "leftLabel", rightLabel: "rightLabel", messageIcon: "messageIcon", messageText: "messageText" }, outputs: { changed: "changed" }, providers: [{
|
|
71
58
|
provide: NG_VALUE_ACCESSOR,
|
|
72
59
|
useExisting: forwardRef(() => KitToggleComponent),
|
|
73
60
|
multi: true,
|
|
74
|
-
}], ngImport: i0, template: "<div class=\"kit-toggle\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n <div class=\"kit-toggle-wrapper\">\n <
|
|
61
|
+
}], ngImport: i0, template: "<div class=\"kit-toggle\"\n [class.disabled]=\"disabled\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n\n <div class=\"kit-toggle-wrapper\">\n @if (leftLabel) {\n <div class=\"toggle-label\">{{ leftLabel }}</div>\n }\n <kendo-switch [checked]=\"defaultChecked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (valueChange)=\"onInputStateChange($event)\"\n ></kendo-switch>\n @if (rightLabel) {\n <div class=\"toggle-label\">{{ rightLabel }}</div>\n }\n </div>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-toggle .label{display:block;margin-bottom:4px}.kit-toggle-wrapper{display:inline-flex;align-items:center;gap:10px;padding:0 20px;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-toggle .toggle-label{color:var(--ui-kit-color-grey-10);font-size:14px}.kit-toggle .k-switch{width:44px;height:22px}.kit-toggle .k-switch-track{display:flex;align-items:center;width:100%;height:100%;box-shadow:none;border:none;border-radius:14px;background:var(--ui-kit-color-grey-12)}.kit-toggle .k-switch-track:hover{box-shadow:none}.kit-toggle .k-switch-thumb{width:18px;height:18px;border:none;border-radius:50%;background:var(--ui-kit-color-grey-13);box-shadow:0 2px 4px #00230b33}.kit-toggle .k-switch-label-on,.kit-toggle .k-switch-label-off{display:none}.kit-toggle .k-focus .k-switch-track{outline:none}.kit-toggle .k-switch-off .k-switch-thumb-wrap{left:11px}.kit-toggle .k-switch-on .k-switch-track{background:var(--ui-kit-color-main)}.kit-toggle .k-switch-on .k-switch-thumb-wrap{left:calc(100% - 11px)}.kit-toggle .k-disabled{opacity:1}.kit-toggle.disabled .toggle-label{color:var(--ui-kit-color-grey-12)}.kit-toggle.disabled .k-switch-track{background:var(--ui-kit-color-grey-13)}\n"], dependencies: [{ kind: "component", type: i1.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "component", type: i2.KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: i3.KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
75
62
|
}
|
|
76
63
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitToggleComponent, decorators: [{
|
|
77
64
|
type: Component,
|
|
@@ -79,7 +66,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
|
|
|
79
66
|
provide: NG_VALUE_ACCESSOR,
|
|
80
67
|
useExisting: forwardRef(() => KitToggleComponent),
|
|
81
68
|
multi: true,
|
|
82
|
-
}], template: "<div class=\"kit-toggle\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n <div class=\"kit-toggle-wrapper\">\n <
|
|
69
|
+
}], template: "<div class=\"kit-toggle\"\n [class.disabled]=\"disabled\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n\n <div class=\"kit-toggle-wrapper\">\n @if (leftLabel) {\n <div class=\"toggle-label\">{{ leftLabel }}</div>\n }\n <kendo-switch [checked]=\"defaultChecked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (valueChange)=\"onInputStateChange($event)\"\n ></kendo-switch>\n @if (rightLabel) {\n <div class=\"toggle-label\">{{ rightLabel }}</div>\n }\n </div>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-toggle .label{display:block;margin-bottom:4px}.kit-toggle-wrapper{display:inline-flex;align-items:center;gap:10px;padding:0 20px;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-toggle .toggle-label{color:var(--ui-kit-color-grey-10);font-size:14px}.kit-toggle .k-switch{width:44px;height:22px}.kit-toggle .k-switch-track{display:flex;align-items:center;width:100%;height:100%;box-shadow:none;border:none;border-radius:14px;background:var(--ui-kit-color-grey-12)}.kit-toggle .k-switch-track:hover{box-shadow:none}.kit-toggle .k-switch-thumb{width:18px;height:18px;border:none;border-radius:50%;background:var(--ui-kit-color-grey-13);box-shadow:0 2px 4px #00230b33}.kit-toggle .k-switch-label-on,.kit-toggle .k-switch-label-off{display:none}.kit-toggle .k-focus .k-switch-track{outline:none}.kit-toggle .k-switch-off .k-switch-thumb-wrap{left:11px}.kit-toggle .k-switch-on .k-switch-track{background:var(--ui-kit-color-main)}.kit-toggle .k-switch-on .k-switch-thumb-wrap{left:calc(100% - 11px)}.kit-toggle .k-disabled{opacity:1}.kit-toggle.disabled .toggle-label{color:var(--ui-kit-color-grey-12)}.kit-toggle.disabled .k-switch-track{background:var(--ui-kit-color-grey-13)}\n"] }]
|
|
83
70
|
}], propDecorators: { label: [{
|
|
84
71
|
type: Input
|
|
85
72
|
}], disabled: [{
|
|
@@ -88,11 +75,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
|
|
|
88
75
|
type: Input
|
|
89
76
|
}], defaultChecked: [{
|
|
90
77
|
type: Input
|
|
91
|
-
}],
|
|
92
|
-
type: Input
|
|
93
|
-
}], onLabel: [{
|
|
78
|
+
}], leftLabel: [{
|
|
94
79
|
type: Input
|
|
95
|
-
}],
|
|
80
|
+
}], rightLabel: [{
|
|
96
81
|
type: Input
|
|
97
82
|
}], messageIcon: [{
|
|
98
83
|
type: Input
|
|
@@ -101,4 +86,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
|
|
|
101
86
|
}], changed: [{
|
|
102
87
|
type: Output
|
|
103
88
|
}] } });
|
|
104
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
89
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia2l0LXRvZ2dsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQvc3JjL2xpYi9jb21wb25lbnRzL2tpdC10b2dnbGUva2l0LXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1raXQvc3JjL2xpYi9jb21wb25lbnRzL2tpdC10b2dnbGUva2l0LXRvZ2dsZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvSCxPQUFPLEVBQXdCLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7O0FBZXpFLE1BQU0sT0FBTyxrQkFBa0I7SUFaL0I7UUFrQkU7O1dBRUc7UUFDTSxhQUFRLEdBQVksS0FBSyxDQUFDO1FBRW5DOztXQUVHO1FBQ00sYUFBUSxHQUFZLEtBQUssQ0FBQztRQUVuQzs7V0FFRztRQUNNLG1CQUFjLEdBQVksS0FBSyxDQUFDO1FBc0J6Qzs7V0FFRztRQUNPLFlBQU8sR0FBMEIsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQVV2RTs7V0FFRztRQUNILGFBQVEsR0FBRyxDQUFDLEtBQWMsRUFBUSxFQUFFO1FBQ3BDLENBQUMsQ0FBQztRQUVGOztXQUVHO1FBQ0gsY0FBUyxHQUFHLEdBQVMsRUFBRTtRQUN2QixDQUFDLENBQUM7S0FrQkg7SUFwQ0M7O09BRUc7SUFDSCxrQkFBa0IsQ0FBQyxPQUFnQjtRQUNqQyxJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQzdCLENBQUM7SUFjRCxnQkFBZ0IsQ0FBQyxFQUF3QjtRQUN2QyxJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsaUJBQWlCLENBQUMsRUFBYztRQUM5QixJQUFJLENBQUMsU0FBUyxHQUFHLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsVUFBVSxDQUFDLEtBQWM7UUFDdkIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNyQixJQUFJLENBQUMsY0FBYyxHQUFHLEtBQUssQ0FBQztJQUM5QixDQUFDO0lBRUQsZ0JBQWdCLENBQUMsUUFBaUI7UUFDaEMsSUFBSSxDQUFDLFFBQVEsR0FBRyxRQUFRLENBQUM7SUFDM0IsQ0FBQzs4R0FqRlUsa0JBQWtCO2tHQUFsQixrQkFBa0IsMFJBTmxCLENBQUM7Z0JBQ1YsT0FBTyxFQUFFLGlCQUFpQjtnQkFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQztnQkFDakQsS0FBSyxFQUFFLElBQUk7YUFDWixDQUFDLDBCQ2RKLDh4QkE0QkE7OzJGRFphLGtCQUFrQjtrQkFaOUIsU0FBUzsrQkFDRSxZQUFZLG1CQUdMLHVCQUF1QixDQUFDLE1BQU0saUJBQ2hDLGlCQUFpQixDQUFDLElBQUksYUFDMUIsQ0FBQzs0QkFDVixPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxtQkFBbUIsQ0FBQzs0QkFDakQsS0FBSyxFQUFFLElBQUk7eUJBQ1osQ0FBQzs4QkFNTyxLQUFLO3NCQUFiLEtBQUs7Z0JBS0csUUFBUTtzQkFBaEIsS0FBSztnQkFLRyxRQUFRO3NCQUFoQixLQUFLO2dCQUtHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBS0csU0FBUztzQkFBakIsS0FBSztnQkFLRyxVQUFVO3NCQUFsQixLQUFLO2dCQUtHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBS0csV0FBVztzQkFBbkIsS0FBSztnQkFLSSxPQUFPO3NCQUFoQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBmb3J3YXJkUmVmLCBJbnB1dCwgT3V0cHV0LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgS2l0U3ZnSWNvbiB9IGZyb20gJy4uL2tpdC1zdmctaWNvbi9raXQtc3ZnLWljb24uY29uc3QnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdraXQtdG9nZ2xlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2tpdC10b2dnbGUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9raXQtdG9nZ2xlLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBwcm92aWRlcnM6IFt7XG4gICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gS2l0VG9nZ2xlQ29tcG9uZW50KSxcbiAgICBtdWx0aTogdHJ1ZSxcbiAgfV0sXG59KVxuZXhwb3J0IGNsYXNzIEtpdFRvZ2dsZUNvbXBvbmVudCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcbiAgLyoqXG4gICAqIERlZmluZXMgYSBsYWJlbCB0ZXh0IHdoaWNoIHdpbGwgYmUgZGlzcGxheWVkIG5leHQgdG8gdGhlIHRvZ2dsZVxuICAgKi9cbiAgQElucHV0KCkgbGFiZWw/OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgd2hldGhlciB0aGUgY29tcG9uZW50IHdpbGwgYmUgaW4gZGlzYWJsZWQgc3RhdGVcbiAgICovXG4gIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgd2hldGhlciB0aGUgY29tcG9uZW50IHdpbGwgYmUgaW4gcmVhZG9ubHkgc3RhdGVcbiAgICovXG4gIEBJbnB1dCgpIHJlYWRvbmx5OiBib29sZWFuID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIERlZmluZXMgYSBkZWZhdWx0IHZhbHVlXG4gICAqL1xuICBASW5wdXQoKSBkZWZhdWx0Q2hlY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIHRoZSBsZWZ0IGxhYmVsIG9mIHRoZSB0b2dnbGVcbiAgICovXG4gIEBJbnB1dCgpIGxlZnRMYWJlbD86IHN0cmluZztcblxuICAvKipcbiAgICogRGVmaW5lcyB0aGUgcmlnaHQgbGFiZWwgb2YgdGhlIHRvZ2dsZVxuICAgKi9cbiAgQElucHV0KCkgcmlnaHRMYWJlbD86IHN0cmluZztcblxuICAvKipcbiAgICogRGVmaW5lcyBhbiBpY29uIHdoaWNoIHdpbGwgYmUgdXNlZCB0byB0aGUgbGVmdCBvZiB0aGUgaW5mbyBtZXNzYWdlXG4gICAqL1xuICBASW5wdXQoKSBtZXNzYWdlSWNvbj86IEtpdFN2Z0ljb247XG5cbiAgLyoqXG4gICAqIERlZmluZXMgYSB2YWx1ZSB3aGljaCBnb2luZyB0byBiZSBhbiBpbmZvIG1lc3NhZ2UgdGV4dFxuICAgKi9cbiAgQElucHV0KCkgbWVzc2FnZVRleHQ/OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIE9jY3VycyBhcyBzb29uIGFzIHRvZ2dsZSBzdGF0ZSBpcyBjaGFuZ2VkXG4gICAqL1xuICBAT3V0cHV0KCkgY2hhbmdlZDogRXZlbnRFbWl0dGVyPGJvb2xlYW4+ID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIC8qKlxuICAgKiBGdW5jdGlvbiB0aGF0IGlzIGNhbGxlZCB3aGVuIHRvZ2dsZSBzdGF0ZSBjaGFuZ2VkXG4gICAqL1xuICBvbklucHV0U3RhdGVDaGFuZ2UoY2hlY2tlZDogYm9vbGVhbik6IHZvaWQge1xuICAgIHRoaXMub25DaGFuZ2UoY2hlY2tlZCk7XG4gICAgdGhpcy5jaGFuZ2VkLmVtaXQoY2hlY2tlZCk7XG4gIH1cblxuICAvKipcbiAgICogRnVuY3Rpb24gdGhhdCBzaG91bGQgYmUgY2FsbGVkIGV2ZXJ5IHRpbWUgdGhlIGZvcm0gY29udHJvbCB2YWx1ZSBjaGFuZ2VzXG4gICAqL1xuICBvbkNoYW5nZSA9ICh2YWx1ZTogYm9vbGVhbik6IHZvaWQgPT4ge1xuICB9O1xuXG4gIC8qKlxuICAgKiBGdW5jdGlvbiB0aGF0IHNob3VsZCBiZSBjYWxsZWQgd2hlbiBpbnB1dCBsb3N0IGZvY3VzIGFuZCBjaGFuZ2VkIGZvcm0gY29udHJvbCBzdGF0ZSB0byBcInRvdWNoZWRcIlxuICAgKi9cbiAgb25Ub3VjaGVkID0gKCk6IHZvaWQgPT4ge1xuICB9O1xuXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46IChfOiBib29sZWFuKSA9PiB2b2lkKTogdm9pZCB7XG4gICAgdGhpcy5vbkNoYW5nZSA9IGZuO1xuICB9XG5cbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46ICgpID0+IHZvaWQpOiB2b2lkIHtcbiAgICB0aGlzLm9uVG91Y2hlZCA9IGZuO1xuICB9XG5cbiAgd3JpdGVWYWx1ZSh2YWx1ZTogYm9vbGVhbik6IHZvaWQge1xuICAgIHRoaXMub25DaGFuZ2UodmFsdWUpO1xuICAgIHRoaXMuZGVmYXVsdENoZWNrZWQgPSB2YWx1ZTtcbiAgfVxuXG4gIHNldERpc2FibGVkU3RhdGUoZGlzYWJsZWQ6IGJvb2xlYW4pOiB2b2lkIHtcbiAgICB0aGlzLmRpc2FibGVkID0gZGlzYWJsZWQ7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJraXQtdG9nZ2xlXCJcbiAgICAgW2NsYXNzLmRpc2FibGVkXT1cImRpc2FibGVkXCI+XG4gIEBpZiAobGFiZWwpIHtcbiAgICA8a2l0LWlucHV0LWxhYmVsIGNsYXNzPVwibGFiZWxcIlxuICAgICAgICAgICAgICAgICAgICAgW3RleHRdPVwibGFiZWxcIlxuICAgID48L2tpdC1pbnB1dC1sYWJlbD5cbiAgfVxuXG4gIDxkaXYgY2xhc3M9XCJraXQtdG9nZ2xlLXdyYXBwZXJcIj5cbiAgICBAaWYgKGxlZnRMYWJlbCkge1xuICAgICAgPGRpdiBjbGFzcz1cInRvZ2dsZS1sYWJlbFwiPnt7IGxlZnRMYWJlbCB9fTwvZGl2PlxuICAgIH1cbiAgICA8a2VuZG8tc3dpdGNoIFtjaGVja2VkXT1cImRlZmF1bHRDaGVja2VkXCJcbiAgICAgICAgICAgICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gICAgICAgICAgICAgICAgICBbcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgICAgICAgICAgICAgICAgKHZhbHVlQ2hhbmdlKT1cIm9uSW5wdXRTdGF0ZUNoYW5nZSgkZXZlbnQpXCJcbiAgICA+PC9rZW5kby1zd2l0Y2g+XG4gICAgQGlmIChyaWdodExhYmVsKSB7XG4gICAgICA8ZGl2IGNsYXNzPVwidG9nZ2xlLWxhYmVsXCI+e3sgcmlnaHRMYWJlbCB9fTwvZGl2PlxuICAgIH1cbiAgPC9kaXY+XG5cbiAgQGlmIChtZXNzYWdlVGV4dCkge1xuICAgIDxraXQtaW5wdXQtbWVzc2FnZSBbaWNvbl09XCJtZXNzYWdlSWNvblwiXG4gICAgICAgICAgICAgICAgICAgICAgIFttZXNzYWdlXT1cIm1lc3NhZ2VUZXh0XCJcbiAgICA+PC9raXQtaW5wdXQtbWVzc2FnZT5cbiAgfVxuPC9kaXY+XG4iXX0=
|
|
@@ -2199,18 +2199,6 @@ class KitToggleComponent {
|
|
|
2199
2199
|
* Defines a default value
|
|
2200
2200
|
*/
|
|
2201
2201
|
this.defaultChecked = false;
|
|
2202
|
-
/**
|
|
2203
|
-
* Defines whether to display On/Off labels
|
|
2204
|
-
*/
|
|
2205
|
-
this.onOffLabel = true;
|
|
2206
|
-
/**
|
|
2207
|
-
* Defines On label of the toggle, default is "On"
|
|
2208
|
-
*/
|
|
2209
|
-
this.onLabel = '';
|
|
2210
|
-
/**
|
|
2211
|
-
* Defines Off label of the toggle, default is "Off"
|
|
2212
|
-
*/
|
|
2213
|
-
this.offLabel = '';
|
|
2214
2202
|
/**
|
|
2215
2203
|
* Occurs as soon as toggle state is changed
|
|
2216
2204
|
*/
|
|
@@ -2247,11 +2235,11 @@ class KitToggleComponent {
|
|
|
2247
2235
|
this.disabled = disabled;
|
|
2248
2236
|
}
|
|
2249
2237
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2250
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.7", type: KitToggleComponent, selector: "kit-toggle", inputs: { label: "label", disabled: "disabled", readonly: "readonly", defaultChecked: "defaultChecked",
|
|
2238
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.7", type: KitToggleComponent, selector: "kit-toggle", inputs: { label: "label", disabled: "disabled", readonly: "readonly", defaultChecked: "defaultChecked", leftLabel: "leftLabel", rightLabel: "rightLabel", messageIcon: "messageIcon", messageText: "messageText" }, outputs: { changed: "changed" }, providers: [{
|
|
2251
2239
|
provide: NG_VALUE_ACCESSOR,
|
|
2252
2240
|
useExisting: forwardRef(() => KitToggleComponent),
|
|
2253
2241
|
multi: true,
|
|
2254
|
-
}], ngImport: i0, template: "<div class=\"kit-toggle\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n <div class=\"kit-toggle-wrapper\">\n <
|
|
2242
|
+
}], ngImport: i0, template: "<div class=\"kit-toggle\"\n [class.disabled]=\"disabled\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n\n <div class=\"kit-toggle-wrapper\">\n @if (leftLabel) {\n <div class=\"toggle-label\">{{ leftLabel }}</div>\n }\n <kendo-switch [checked]=\"defaultChecked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (valueChange)=\"onInputStateChange($event)\"\n ></kendo-switch>\n @if (rightLabel) {\n <div class=\"toggle-label\">{{ rightLabel }}</div>\n }\n </div>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-toggle .label{display:block;margin-bottom:4px}.kit-toggle-wrapper{display:inline-flex;align-items:center;gap:10px;padding:0 20px;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-toggle .toggle-label{color:var(--ui-kit-color-grey-10);font-size:14px}.kit-toggle .k-switch{width:44px;height:22px}.kit-toggle .k-switch-track{display:flex;align-items:center;width:100%;height:100%;box-shadow:none;border:none;border-radius:14px;background:var(--ui-kit-color-grey-12)}.kit-toggle .k-switch-track:hover{box-shadow:none}.kit-toggle .k-switch-thumb{width:18px;height:18px;border:none;border-radius:50%;background:var(--ui-kit-color-grey-13);box-shadow:0 2px 4px #00230b33}.kit-toggle .k-switch-label-on,.kit-toggle .k-switch-label-off{display:none}.kit-toggle .k-focus .k-switch-track{outline:none}.kit-toggle .k-switch-off .k-switch-thumb-wrap{left:11px}.kit-toggle .k-switch-on .k-switch-track{background:var(--ui-kit-color-main)}.kit-toggle .k-switch-on .k-switch-thumb-wrap{left:calc(100% - 11px)}.kit-toggle .k-disabled{opacity:1}.kit-toggle.disabled .toggle-label{color:var(--ui-kit-color-grey-12)}.kit-toggle.disabled .k-switch-track{background:var(--ui-kit-color-grey-13)}\n"], dependencies: [{ kind: "component", type: i2.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2255
2243
|
}
|
|
2256
2244
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: KitToggleComponent, decorators: [{
|
|
2257
2245
|
type: Component,
|
|
@@ -2259,7 +2247,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
|
|
|
2259
2247
|
provide: NG_VALUE_ACCESSOR,
|
|
2260
2248
|
useExisting: forwardRef(() => KitToggleComponent),
|
|
2261
2249
|
multi: true,
|
|
2262
|
-
}], template: "<div class=\"kit-toggle\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n <div class=\"kit-toggle-wrapper\">\n <
|
|
2250
|
+
}], template: "<div class=\"kit-toggle\"\n [class.disabled]=\"disabled\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n ></kit-input-label>\n }\n\n <div class=\"kit-toggle-wrapper\">\n @if (leftLabel) {\n <div class=\"toggle-label\">{{ leftLabel }}</div>\n }\n <kendo-switch [checked]=\"defaultChecked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (valueChange)=\"onInputStateChange($event)\"\n ></kendo-switch>\n @if (rightLabel) {\n <div class=\"toggle-label\">{{ rightLabel }}</div>\n }\n </div>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-toggle .label{display:block;margin-bottom:4px}.kit-toggle-wrapper{display:inline-flex;align-items:center;gap:10px;padding:0 20px;height:40px;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-toggle .toggle-label{color:var(--ui-kit-color-grey-10);font-size:14px}.kit-toggle .k-switch{width:44px;height:22px}.kit-toggle .k-switch-track{display:flex;align-items:center;width:100%;height:100%;box-shadow:none;border:none;border-radius:14px;background:var(--ui-kit-color-grey-12)}.kit-toggle .k-switch-track:hover{box-shadow:none}.kit-toggle .k-switch-thumb{width:18px;height:18px;border:none;border-radius:50%;background:var(--ui-kit-color-grey-13);box-shadow:0 2px 4px #00230b33}.kit-toggle .k-switch-label-on,.kit-toggle .k-switch-label-off{display:none}.kit-toggle .k-focus .k-switch-track{outline:none}.kit-toggle .k-switch-off .k-switch-thumb-wrap{left:11px}.kit-toggle .k-switch-on .k-switch-track{background:var(--ui-kit-color-main)}.kit-toggle .k-switch-on .k-switch-thumb-wrap{left:calc(100% - 11px)}.kit-toggle .k-disabled{opacity:1}.kit-toggle.disabled .toggle-label{color:var(--ui-kit-color-grey-12)}.kit-toggle.disabled .k-switch-track{background:var(--ui-kit-color-grey-13)}\n"] }]
|
|
2263
2251
|
}], propDecorators: { label: [{
|
|
2264
2252
|
type: Input
|
|
2265
2253
|
}], disabled: [{
|
|
@@ -2268,11 +2256,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImpor
|
|
|
2268
2256
|
type: Input
|
|
2269
2257
|
}], defaultChecked: [{
|
|
2270
2258
|
type: Input
|
|
2271
|
-
}],
|
|
2272
|
-
type: Input
|
|
2273
|
-
}], onLabel: [{
|
|
2259
|
+
}], leftLabel: [{
|
|
2274
2260
|
type: Input
|
|
2275
|
-
}],
|
|
2261
|
+
}], rightLabel: [{
|
|
2276
2262
|
type: Input
|
|
2277
2263
|
}], messageIcon: [{
|
|
2278
2264
|
type: Input
|