@indigina/ui-kit 1.1.496 → 1.1.498
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.
|
@@ -1649,6 +1649,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
1649
1649
|
class KitTextareaAutoresizeDirective {
|
|
1650
1650
|
constructor() {
|
|
1651
1651
|
this.elementRef = inject(ElementRef);
|
|
1652
|
+
this.previousValue = '';
|
|
1652
1653
|
}
|
|
1653
1654
|
onInput() {
|
|
1654
1655
|
this.resize();
|
|
@@ -1658,10 +1659,34 @@ class KitTextareaAutoresizeDirective {
|
|
|
1658
1659
|
this.resize();
|
|
1659
1660
|
}
|
|
1660
1661
|
}
|
|
1662
|
+
ngDoCheck() {
|
|
1663
|
+
const currentValue = this.elementRef.nativeElement.value;
|
|
1664
|
+
if (currentValue !== this.previousValue) {
|
|
1665
|
+
this.previousValue = currentValue;
|
|
1666
|
+
this.resize();
|
|
1667
|
+
}
|
|
1668
|
+
}
|
|
1661
1669
|
resize() {
|
|
1662
|
-
this.elementRef.nativeElement
|
|
1663
|
-
const
|
|
1664
|
-
|
|
1670
|
+
const el = this.elementRef.nativeElement;
|
|
1671
|
+
const scrollableParent = this.getScrollableParent(el);
|
|
1672
|
+
const savedScrollTop = scrollableParent?.scrollTop ?? 0;
|
|
1673
|
+
el.style.height = '0';
|
|
1674
|
+
const scrollHeight = el.scrollHeight;
|
|
1675
|
+
el.style.height = `${scrollHeight}px`;
|
|
1676
|
+
if (scrollableParent) {
|
|
1677
|
+
scrollableParent.scrollTop = savedScrollTop;
|
|
1678
|
+
}
|
|
1679
|
+
}
|
|
1680
|
+
getScrollableParent(el) {
|
|
1681
|
+
let parent = el.parentElement;
|
|
1682
|
+
while (parent) {
|
|
1683
|
+
const overflowY = globalThis.window.getComputedStyle(parent).overflowY;
|
|
1684
|
+
if (overflowY === 'auto' || overflowY === 'scroll') {
|
|
1685
|
+
return parent;
|
|
1686
|
+
}
|
|
1687
|
+
parent = parent.parentElement;
|
|
1688
|
+
}
|
|
1689
|
+
return document.scrollingElement;
|
|
1665
1690
|
}
|
|
1666
1691
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitTextareaAutoresizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1667
1692
|
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: KitTextareaAutoresizeDirective, isStandalone: true, selector: "[autoresize]", host: { listeners: { ":input": "onInput()" } }, ngImport: i0 }); }
|
|
@@ -2530,6 +2555,9 @@ class KitAutocompleteComponent {
|
|
|
2530
2555
|
this.onTouched = () => {
|
|
2531
2556
|
};
|
|
2532
2557
|
}
|
|
2558
|
+
openPopup() {
|
|
2559
|
+
this.comboboxComponent().toggle(true);
|
|
2560
|
+
}
|
|
2533
2561
|
/**
|
|
2534
2562
|
* Callback function that return dropdown list item text
|
|
2535
2563
|
*/
|
|
@@ -2573,7 +2601,6 @@ class KitAutocompleteComponent {
|
|
|
2573
2601
|
*/
|
|
2574
2602
|
onFocus() {
|
|
2575
2603
|
this.elementRef.nativeElement.querySelector('.k-input-inner').select();
|
|
2576
|
-
this.comboboxComponent().togglePopup(true);
|
|
2577
2604
|
this.focused.emit();
|
|
2578
2605
|
}
|
|
2579
2606
|
/**
|
|
@@ -2599,7 +2626,7 @@ class KitAutocompleteComponent {
|
|
|
2599
2626
|
this.comboboxComponent().focus();
|
|
2600
2627
|
}
|
|
2601
2628
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitAutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2602
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitAutocompleteComponent, isStandalone: true, selector: "kit-autocomplete", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, selectedValue: { classPropertyName: "selectedValue", publicName: "selectedValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loaderVisible: { classPropertyName: "loaderVisible", publicName: "loaderVisible", isSignal: true, isRequired: false, transformFunction: null }, messageIcon: { classPropertyName: "messageIcon", publicName: "messageIcon", isSignal: true, isRequired: false, transformFunction: null }, messageText: { classPropertyName: "messageText", publicName: "messageText", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, allowCustom: { classPropertyName: "allowCustom", publicName: "allowCustom", isSignal: true, isRequired: false, transformFunction: null }, closePopupIfDataNotFound: { classPropertyName: "closePopupIfDataNotFound", publicName: "closePopupIfDataNotFound", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, suggest: { classPropertyName: "suggest", publicName: "suggest", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedValue: "selectedValueChange", disabled: "disabledChange", filterChanged: "filterChanged", valueChanged: "valueChanged", selectionChanged: "selectionChanged", blured: "blured", focused: "focused" }, providers: [{
|
|
2629
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitAutocompleteComponent, isStandalone: true, selector: "kit-autocomplete", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, selectedValue: { classPropertyName: "selectedValue", publicName: "selectedValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loaderVisible: { classPropertyName: "loaderVisible", publicName: "loaderVisible", isSignal: true, isRequired: false, transformFunction: null }, messageIcon: { classPropertyName: "messageIcon", publicName: "messageIcon", isSignal: true, isRequired: false, transformFunction: null }, messageText: { classPropertyName: "messageText", publicName: "messageText", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, allowCustom: { classPropertyName: "allowCustom", publicName: "allowCustom", isSignal: true, isRequired: false, transformFunction: null }, closePopupIfDataNotFound: { classPropertyName: "closePopupIfDataNotFound", publicName: "closePopupIfDataNotFound", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, suggest: { classPropertyName: "suggest", publicName: "suggest", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedValue: "selectedValueChange", disabled: "disabledChange", filterChanged: "filterChanged", valueChanged: "valueChanged", selectionChanged: "selectionChanged", blured: "blured", focused: "focused" }, host: { listeners: { "click": "openPopup()" } }, providers: [{
|
|
2603
2630
|
provide: NG_VALUE_ACCESSOR,
|
|
2604
2631
|
useExisting: forwardRef(() => KitAutocompleteComponent),
|
|
2605
2632
|
multi: true,
|
|
@@ -2620,7 +2647,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
2620
2647
|
KitSvgIconComponent,
|
|
2621
2648
|
KitFormLabelComponent,
|
|
2622
2649
|
], template: "<div class=\"kit-autocomplete\"\n [class.empty]=\"!items() || !items().length\"\n [class.disabled]=\"disabled()\"\n [class.loading]=\"loaderVisible()\"\n [class.invalid]=\"invalid()\"\n [class.readonly]=\"readonly()\">\n @if (label()) {\n <kit-form-label class=\"label\"\n [text]=\"label()\"\n [for]=\"combobox\"\n ></kit-form-label>\n }\n <div class=\"autocomplete-wrap\">\n <kendo-combobox #combobox\n textField=\"text\"\n valueField=\"value\"\n kendoDropDownFilter\n [data]=\"items()\"\n [placeholder]=\"placeholder()\"\n [filterable]=\"true\"\n [valuePrimitive]=\"true\"\n [disabled]=\"disabled()\"\n [clearButton]=\"false\"\n [value]=\"selectedValue()\"\n [allowCustom]=\"allowCustom()\"\n [popupSettings]=\"dropdownPopupSettings()\"\n [suggest]=\"suggest()\"\n [readonly]=\"readonly()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (selectionChange)=\"onSelectionChange($event)\"\n (valueChange)=\"onValueChange($event)\"\n (filterChange)=\"onFilterChange($event)\">\n <ng-template kendoComboBoxHeaderTemplate>\n @if (loaderVisible()) {\n <div class=\"popup-loader\">\n <div class=\"popup-loader-dots\"></div>\n </div>\n }\n </ng-template>\n <ng-template kendoComboBoxItemTemplate\n let-item>\n <span class=\"template\">{{ getOptionText(item) }}</span>\n </ng-template>\n </kendo-combobox>\n <kit-svg-icon class=\"input-icon\"\n icon=\"search\"\n ></kit-svg-icon>\n </div>\n @if (messageText()) {\n <kit-form-message [icon]=\"messageIcon()\"\n [message]=\"messageText()\"\n ></kit-form-message>\n }\n</div>\n", styles: [".kit-autocomplete .label{display:block;margin-bottom:4px}.kit-autocomplete .autocomplete-wrap{position:relative;display:flex;align-items:center}.kit-autocomplete .k-input-button{display:none}.kit-autocomplete:hover .k-combobox{border-color:var(--ui-kit-color-hover)}.kit-autocomplete .k-combobox{height:40px;font-size:14px;font-weight:400;border-radius:8px;border:1px solid var(--ui-kit-color-grey-11);background-color:var(--ui-kit-color-white)}.kit-autocomplete .k-combobox.k-focus{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-autocomplete .k-combobox.k-focus+.input-icon{stroke:var(--ui-kit-color-main)}.kit-autocomplete .k-input .k-input-inner{padding:0 36px 0 12px}.kit-autocomplete .k-input-inner{color:var(--ui-kit-color-grey-10);line-height:1}.kit-autocomplete .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-autocomplete .k-input-inner::selection{color:var(--ui-kit-color-white);background:var(--ui-kit-color-main)}.kit-autocomplete .popup-loader{display:flex;justify-content:center;align-items:center;height:100%}.kit-autocomplete .popup-loader-dots{width:13px;aspect-ratio:1;border-radius:50%;animation:dots-animation 1s infinite linear alternate}.kit-autocomplete .input-icon{position:absolute;right:0;padding:0 12px 0 8px;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-grey-12);z-index:1}.kit-autocomplete.disabled .k-combobox{opacity:1;border-color:var(--ui-kit-color-grey-11)}.kit-autocomplete.disabled .k-input-inner{color:var(--ui-kit-color-grey-12);background-color:var(--ui-kit-color-grey-13)}.kit-autocomplete.disabled .input-icon{stroke:var(--ui-kit-color-grey-12)}.kit-autocomplete.readonly .k-combobox{border-color:var(--ui-kit-color-grey-11)}.kit-autocomplete.readonly .k-combobox.k-focus{box-shadow:none}.kit-autocomplete.readonly .k-combobox.k-focus+.input-icon{stroke:var(--ui-kit-color-grey-12)}.kit-autocomplete.readonly .k-input-inner{color:var(--ui-kit-color-grey-12)}.kit-autocomplete.empty .kit-autocomplete-popup{display:none}.kit-autocomplete.loading .kit-autocomplete-popup{display:block;height:150px}.kit-autocomplete.loading .kit-autocomplete-popup .k-no-data,.kit-autocomplete.loading .kit-autocomplete-popup .k-list{display:none}.kit-autocomplete.invalid .k-combobox{border-color:var(--ui-kit-color-red-1)}.kit-autocomplete.invalid .input-icon{stroke:var(--ui-kit-color-red-1)}.kit-autocomplete.invalid .kit-form-message-text{color:var(--ui-kit-color-red-1)}@keyframes dots-animation{0%{box-shadow:20px 0 var(--ui-kit-color-main),-20px 0 var(--ui-kit-color-grey-12);background:var(--ui-kit-color-main)}33%{box-shadow:20px 0 var(--ui-kit-color-main),-20px 0 var(--ui-kit-color-grey-12);background:var(--ui-kit-color-grey-12)}66%{box-shadow:20px 0 var(--ui-kit-color-grey-12),-20px 0 var(--ui-kit-color-main);background:var(--ui-kit-color-grey-12)}to{box-shadow:20px 0 var(--ui-kit-color-grey-12),-20px 0 var(--ui-kit-color-main);background:var(--ui-kit-color-main)}}.kit-autocomplete-popup{margin-top:10px;padding:8px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-autocomplete-popup .k-list-item{padding:6px 12px;font-size:14px;font-weight:400;line-height:1.26;box-shadow:none;border-radius:4px;background-color:var(--ui-kit-color-white);color:var(--ui-kit-color-grey-10)}.kit-autocomplete-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-autocomplete-popup .k-no-data{padding:6px 12px}\n"] }]
|
|
2623
|
-
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], selectedValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValue", required: false }] }, { type: i0.Output, args: ["selectedValueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], loaderVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "loaderVisible", required: false }] }], messageIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageIcon", required: false }] }], messageText: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageText", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], allowCustom: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCustom", required: false }] }], closePopupIfDataNotFound: [{ type: i0.Input, args: [{ isSignal: true, alias: "closePopupIfDataNotFound", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], suggest: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggest", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }], selectionChanged: [{ type: i0.Output, args: ["selectionChanged"] }], blured: [{ type: i0.Output, args: ["blured"] }], focused: [{ type: i0.Output, args: ["focused"] }], comboboxComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => ComboBoxComponent), { isSignal: true }] }]
|
|
2650
|
+
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], selectedValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValue", required: false }] }, { type: i0.Output, args: ["selectedValueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], loaderVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "loaderVisible", required: false }] }], messageIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageIcon", required: false }] }], messageText: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageText", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], allowCustom: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCustom", required: false }] }], closePopupIfDataNotFound: [{ type: i0.Input, args: [{ isSignal: true, alias: "closePopupIfDataNotFound", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], suggest: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggest", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], filterChanged: [{ type: i0.Output, args: ["filterChanged"] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }], selectionChanged: [{ type: i0.Output, args: ["selectionChanged"] }], blured: [{ type: i0.Output, args: ["blured"] }], focused: [{ type: i0.Output, args: ["focused"] }], comboboxComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => ComboBoxComponent), { isSignal: true }] }], openPopup: [{
|
|
2651
|
+
type: HostListener,
|
|
2652
|
+
args: ['click']
|
|
2653
|
+
}] } });
|
|
2624
2654
|
|
|
2625
2655
|
class KitAutocompleteDirective {
|
|
2626
2656
|
constructor() {
|