@indigina/ui-kit 1.1.459 → 1.1.461

package/fesm2022/indigina-ui-kit.mjs

@@ -4584,6 +4584,10 @@ class KitMultiselectComponent {
          * An items list which is going to be rendered as multiselect items
          */
         this.items = [];
+        /**
+         * Defines whether the component will be in disabled state
+         */
+        this.disabled = model(...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
         /**
          * Determines whether to close the popup of the multiSelect after the item selection, false by default
          */
@@ -4687,7 +4691,7 @@ class KitMultiselectComponent {
         this.onTouched = fn;
     }
     setDisabledState(disabled) {
-        this.disabled = disabled;
+        this.disabled.set(disabled);
     }
     buildPopupSettings() {
         return {
@@ -4836,11 +4840,11 @@ class KitMultiselectComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitMultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitMultiselectComponent, isStandalone: true, selector: "kit-multiselect", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: false, isRequired: false, transformFunction: null }, messageIcon: { classPropertyName: "messageIcon", publicName: "messageIcon", isSignal: false, isRequired: false, transformFunction: null }, messageText: { classPropertyName: "messageText", publicName: "messageText", isSignal: false, isRequired: false, transformFunction: null }, shouldAddAllAsOption: { classPropertyName: "shouldAddAllAsOption", publicName: "shouldAddAllAsOption", isSignal: true, isRequired: false, transformFunction: null }, allOptionLabel: { classPropertyName: "allOptionLabel", publicName: "allOptionLabel", isSignal: true, isRequired: false, transformFunction: null }, tagMapper: { classPropertyName: "tagMapper", publicName: "tagMapper", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, useCheckboxes: { classPropertyName: "useCheckboxes", publicName: "useCheckboxes", isSignal: true, isRequired: false, transformFunction: null }, popupClass: { classPropertyName: "popupClass", publicName: "popupClass", isSignal: true, isRequired: false, transformFunction: null }, listHeight: { classPropertyName: "listHeight", publicName: "listHeight", isSignal: true, isRequired: false, transformFunction: null }, allowCustom: { classPropertyName: "allowCustom", publicName: "allowCustom", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, itemsDirection: { classPropertyName: "itemsDirection", publicName: "itemsDirection", isSignal: true, isRequired: false, transformFunction: null }, autoSummaryTag: { classPropertyName: "autoSummaryTag", publicName: "autoSummaryTag", isSignal: true, isRequired: false, transformFunction: null }, autoSummaryTagContainerClass: { classPropertyName: "autoSummaryTagContainerClass", publicName: "autoSummaryTagContainerClass", isSignal: true, isRequired: false, transformFunction: null }, fallbackGroupChipWidth: { classPropertyName: "fallbackGroupChipWidth", publicName: "fallbackGroupChipWidth", isSignal: true, isRequired: false, transformFunction: null }, showCheckIcon: { classPropertyName: "showCheckIcon", publicName: "showCheckIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, providers: [{
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitMultiselectComponent, isStandalone: true, selector: "kit-multiselect", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: false, isRequired: false, transformFunction: null }, messageIcon: { classPropertyName: "messageIcon", publicName: "messageIcon", isSignal: false, isRequired: false, transformFunction: null }, messageText: { classPropertyName: "messageText", publicName: "messageText", isSignal: false, isRequired: false, transformFunction: null }, shouldAddAllAsOption: { classPropertyName: "shouldAddAllAsOption", publicName: "shouldAddAllAsOption", isSignal: true, isRequired: false, transformFunction: null }, allOptionLabel: { classPropertyName: "allOptionLabel", publicName: "allOptionLabel", isSignal: true, isRequired: false, transformFunction: null }, tagMapper: { classPropertyName: "tagMapper", publicName: "tagMapper", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, useCheckboxes: { classPropertyName: "useCheckboxes", publicName: "useCheckboxes", isSignal: true, isRequired: false, transformFunction: null }, popupClass: { classPropertyName: "popupClass", publicName: "popupClass", isSignal: true, isRequired: false, transformFunction: null }, listHeight: { classPropertyName: "listHeight", publicName: "listHeight", isSignal: true, isRequired: false, transformFunction: null }, allowCustom: { classPropertyName: "allowCustom", publicName: "allowCustom", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null }, itemsDirection: { classPropertyName: "itemsDirection", publicName: "itemsDirection", isSignal: true, isRequired: false, transformFunction: null }, autoSummaryTag: { classPropertyName: "autoSummaryTag", publicName: "autoSummaryTag", isSignal: true, isRequired: false, transformFunction: null }, autoSummaryTagContainerClass: { classPropertyName: "autoSummaryTagContainerClass", publicName: "autoSummaryTagContainerClass", isSignal: true, isRequired: false, transformFunction: null }, fallbackGroupChipWidth: { classPropertyName: "fallbackGroupChipWidth", publicName: "fallbackGroupChipWidth", isSignal: true, isRequired: false, transformFunction: null }, showCheckIcon: { classPropertyName: "showCheckIcon", publicName: "showCheckIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", changed: "changed" }, providers: [{
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => KitMultiselectComponent),
                 multi: true,
-            }], queries: [{ propertyName: "multiSelectGroupTagTemplate", first: true, predicate: KitMultiselectGroupTagTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "multiselectComponent", first: true, predicate: MultiSelectComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"kit-multiselect\"\n     [class.disabled]=\"disabled\"\n     [class.all-option-selected]=\"hasSelectedAllOption\"\n     [class.invalid]=\"invalid()\">\n  @if (label) {\n    <kit-form-label class=\"label\"\n                    [text]=\"label\"\n                    [for]=\"multiselect\"\n    ></kit-form-label>\n  }\n  <kendo-multiselect #multiselect\n                     valueField=\"value\"\n                     textField=\"text\"\n                     kendoDropDownFilter\n                     [ngClass]=\"[size(), itemsDirection()]\"\n                     [data]=\"items\"\n                     [disabled]=\"disabled\"\n                     [autoClose]=\"autoClose\"\n                     [placeholder]=\"placeholder\"\n                     [valuePrimitive]=\"true\"\n                     [itemDisabled]=\"onItemDisabled()\"\n                     [popupSettings]=\"buildPopupSettings()\"\n                     [tagMapper]=\"tagMapper()\"\n                     [kendoMultiSelectSummaryTag]=\"autoSummaryTagValue()\"\n                     [checkboxes]=\"useCheckboxes()\"\n                     [listHeight]=\"listHeight()\"\n                     [allowCustom]=\"allowCustom()\"\n                     [filterable]=\"filterable()\"\n                     [(ngModel)]=\"selectedItems\">\n    <ng-template kendoMultiSelectTagTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"chip-text\"\n              [class.all-option]=\"dataItem.value === allOption().value\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      <kit-svg-icon class=\"chip-icon\"\n                    [icon]=\"KitSvgIcon.CROSS\"\n      ></kit-svg-icon>\n    </ng-template>\n    <ng-template kendoMultiSelectItemTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"option-text\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      @if (showCheckIcon()) {\n        <kit-svg-icon class=\"option-icon\"\n                      [icon]=\"KitSvgIcon.CHECK\"\n        ></kit-svg-icon>\n      }\n    </ng-template>\n    <ng-template kendoMultiSelectGroupTagTemplate let-dataItems>\n      <ng-container *ngTemplateOutlet=\"multiSelectGroupTagTemplate(); context: { dataItems }\"/>\n    </ng-template>\n  </kendo-multiselect>\n\n  @if (messageText) {\n    <kit-form-message [icon]=\"messageIcon\"\n                      [message]=\"messageText\"\n    ></kit-form-message>\n  }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input .k-chip-list{display:flex}.kit-multiselect .k-input.ltr .k-chip-list{flex-direction:row}.kit-multiselect .k-input.rtl .k-chip-list{flex-direction:row-reverse}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-chip:last-child:has(.k-chip-content .group-tag) .k-chip-actions{display:none}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect.invalid .k-multiselect{border-color:var(--ui-kit-color-red-1)}.kit-multiselect.invalid .kit-form-message-text{color:var(--ui-kit-color-red-1)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;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-multiselect-popup.k-popup{padding:4px}.kit-multiselect-popup .k-list-ul{gap:4px}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i1$5.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i1$5.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }, { kind: "directive", type: i1$5.SummaryTagDirective, selector: "[kendoMultiSelectSummaryTag]", inputs: ["kendoMultiSelectSummaryTag"] }, { kind: "directive", type: i1$5.GroupTagTemplateDirective, selector: "[kendoMultiSelectGroupTagTemplate],[kendoMultiSelectTreeGroupTagTemplate]" }, { kind: "directive", type: i1$5.TagTemplateDirective, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]" }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitFormMessageComponent, selector: "kit-form-message", inputs: ["icon", "message"] }, { kind: "component", type: KitFormLabelComponent, selector: "kit-form-label", inputs: ["text", "for", "tooltip", "popoverConfig"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+            }], queries: [{ propertyName: "multiSelectGroupTagTemplate", first: true, predicate: KitMultiselectGroupTagTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "multiselectComponent", first: true, predicate: MultiSelectComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"kit-multiselect\"\n     [class.disabled]=\"disabled()\"\n     [class.all-option-selected]=\"hasSelectedAllOption\"\n     [class.invalid]=\"invalid()\">\n  @if (label) {\n    <kit-form-label class=\"label\"\n                    [text]=\"label\"\n                    [for]=\"multiselect\"\n    ></kit-form-label>\n  }\n  <kendo-multiselect #multiselect\n                     valueField=\"value\"\n                     textField=\"text\"\n                     kendoDropDownFilter\n                     [ngClass]=\"[size(), itemsDirection()]\"\n                     [data]=\"items\"\n                     [disabled]=\"disabled()\"\n                     [autoClose]=\"autoClose\"\n                     [placeholder]=\"placeholder\"\n                     [valuePrimitive]=\"true\"\n                     [itemDisabled]=\"onItemDisabled()\"\n                     [popupSettings]=\"buildPopupSettings()\"\n                     [tagMapper]=\"tagMapper()\"\n                     [kendoMultiSelectSummaryTag]=\"autoSummaryTagValue()\"\n                     [checkboxes]=\"useCheckboxes()\"\n                     [listHeight]=\"listHeight()\"\n                     [allowCustom]=\"allowCustom()\"\n                     [filterable]=\"filterable()\"\n                     [(ngModel)]=\"selectedItems\">\n    <ng-template kendoMultiSelectTagTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"chip-text\"\n              [class.all-option]=\"dataItem.value === allOption().value\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      <kit-svg-icon class=\"chip-icon\"\n                    [icon]=\"KitSvgIcon.CROSS\"\n      ></kit-svg-icon>\n    </ng-template>\n    <ng-template kendoMultiSelectItemTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"option-text\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      @if (showCheckIcon()) {\n        <kit-svg-icon class=\"option-icon\"\n                      [icon]=\"KitSvgIcon.CHECK\"\n        ></kit-svg-icon>\n      }\n    </ng-template>\n    <ng-template kendoMultiSelectGroupTagTemplate let-dataItems>\n      <ng-container *ngTemplateOutlet=\"multiSelectGroupTagTemplate(); context: { dataItems }\"/>\n    </ng-template>\n  </kendo-multiselect>\n\n  @if (messageText) {\n    <kit-form-message [icon]=\"messageIcon\"\n                      [message]=\"messageText\"\n    ></kit-form-message>\n  }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input .k-chip-list{display:flex}.kit-multiselect .k-input.ltr .k-chip-list{flex-direction:row}.kit-multiselect .k-input.rtl .k-chip-list{flex-direction:row-reverse}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-chip:last-child:has(.k-chip-content .group-tag) .k-chip-actions{display:none}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect.invalid .k-multiselect{border-color:var(--ui-kit-color-red-1)}.kit-multiselect.invalid .kit-form-message-text{color:var(--ui-kit-color-red-1)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;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-multiselect-popup.k-popup{padding:4px}.kit-multiselect-popup .k-list-ul{gap:4px}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i1$5.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i1$5.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }, { kind: "directive", type: i1$5.SummaryTagDirective, selector: "[kendoMultiSelectSummaryTag]", inputs: ["kendoMultiSelectSummaryTag"] }, { kind: "directive", type: i1$5.GroupTagTemplateDirective, selector: "[kendoMultiSelectGroupTagTemplate],[kendoMultiSelectTreeGroupTagTemplate]" }, { kind: "directive", type: i1$5.TagTemplateDirective, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]" }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitFormMessageComponent, selector: "kit-form-message", inputs: ["icon", "message"] }, { kind: "component", type: KitFormLabelComponent, selector: "kit-form-label", inputs: ["text", "for", "tooltip", "popoverConfig"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitMultiselectComponent, decorators: [{
             type: Component,
@@ -4857,16 +4861,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         KitFormLabelComponent,
                         NgClass,
                         KitTruncateTextComponent,
-                    ], template: "<div class=\"kit-multiselect\"\n     [class.disabled]=\"disabled\"\n     [class.all-option-selected]=\"hasSelectedAllOption\"\n     [class.invalid]=\"invalid()\">\n  @if (label) {\n    <kit-form-label class=\"label\"\n                    [text]=\"label\"\n                    [for]=\"multiselect\"\n    ></kit-form-label>\n  }\n  <kendo-multiselect #multiselect\n                     valueField=\"value\"\n                     textField=\"text\"\n                     kendoDropDownFilter\n                     [ngClass]=\"[size(), itemsDirection()]\"\n                     [data]=\"items\"\n                     [disabled]=\"disabled\"\n                     [autoClose]=\"autoClose\"\n                     [placeholder]=\"placeholder\"\n                     [valuePrimitive]=\"true\"\n                     [itemDisabled]=\"onItemDisabled()\"\n                     [popupSettings]=\"buildPopupSettings()\"\n                     [tagMapper]=\"tagMapper()\"\n                     [kendoMultiSelectSummaryTag]=\"autoSummaryTagValue()\"\n                     [checkboxes]=\"useCheckboxes()\"\n                     [listHeight]=\"listHeight()\"\n                     [allowCustom]=\"allowCustom()\"\n                     [filterable]=\"filterable()\"\n                     [(ngModel)]=\"selectedItems\">\n    <ng-template kendoMultiSelectTagTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"chip-text\"\n              [class.all-option]=\"dataItem.value === allOption().value\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      <kit-svg-icon class=\"chip-icon\"\n                    [icon]=\"KitSvgIcon.CROSS\"\n      ></kit-svg-icon>\n    </ng-template>\n    <ng-template kendoMultiSelectItemTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"option-text\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      @if (showCheckIcon()) {\n        <kit-svg-icon class=\"option-icon\"\n                      [icon]=\"KitSvgIcon.CHECK\"\n        ></kit-svg-icon>\n      }\n    </ng-template>\n    <ng-template kendoMultiSelectGroupTagTemplate let-dataItems>\n      <ng-container *ngTemplateOutlet=\"multiSelectGroupTagTemplate(); context: { dataItems }\"/>\n    </ng-template>\n  </kendo-multiselect>\n\n  @if (messageText) {\n    <kit-form-message [icon]=\"messageIcon\"\n                      [message]=\"messageText\"\n    ></kit-form-message>\n  }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input .k-chip-list{display:flex}.kit-multiselect .k-input.ltr .k-chip-list{flex-direction:row}.kit-multiselect .k-input.rtl .k-chip-list{flex-direction:row-reverse}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-chip:last-child:has(.k-chip-content .group-tag) .k-chip-actions{display:none}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect.invalid .k-multiselect{border-color:var(--ui-kit-color-red-1)}.kit-multiselect.invalid .kit-form-message-text{color:var(--ui-kit-color-red-1)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;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-multiselect-popup.k-popup{padding:4px}.kit-multiselect-popup .k-list-ul{gap:4px}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"] }]
+                    ], template: "<div class=\"kit-multiselect\"\n     [class.disabled]=\"disabled()\"\n     [class.all-option-selected]=\"hasSelectedAllOption\"\n     [class.invalid]=\"invalid()\">\n  @if (label) {\n    <kit-form-label class=\"label\"\n                    [text]=\"label\"\n                    [for]=\"multiselect\"\n    ></kit-form-label>\n  }\n  <kendo-multiselect #multiselect\n                     valueField=\"value\"\n                     textField=\"text\"\n                     kendoDropDownFilter\n                     [ngClass]=\"[size(), itemsDirection()]\"\n                     [data]=\"items\"\n                     [disabled]=\"disabled()\"\n                     [autoClose]=\"autoClose\"\n                     [placeholder]=\"placeholder\"\n                     [valuePrimitive]=\"true\"\n                     [itemDisabled]=\"onItemDisabled()\"\n                     [popupSettings]=\"buildPopupSettings()\"\n                     [tagMapper]=\"tagMapper()\"\n                     [kendoMultiSelectSummaryTag]=\"autoSummaryTagValue()\"\n                     [checkboxes]=\"useCheckboxes()\"\n                     [listHeight]=\"listHeight()\"\n                     [allowCustom]=\"allowCustom()\"\n                     [filterable]=\"filterable()\"\n                     [(ngModel)]=\"selectedItems\">\n    <ng-template kendoMultiSelectTagTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"chip-text\"\n              [class.all-option]=\"dataItem.value === allOption().value\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      <kit-svg-icon class=\"chip-icon\"\n                    [icon]=\"KitSvgIcon.CROSS\"\n      ></kit-svg-icon>\n    </ng-template>\n    <ng-template kendoMultiSelectItemTemplate\n                 let-dataItem>\n      <kit-truncate-text>\n        <span class=\"option-text\"\n              [ngClass]=\"dataItem?.optionClass\">\n          {{ dataItem?.text }}\n        </span>\n      </kit-truncate-text>\n      @if (showCheckIcon()) {\n        <kit-svg-icon class=\"option-icon\"\n                      [icon]=\"KitSvgIcon.CHECK\"\n        ></kit-svg-icon>\n      }\n    </ng-template>\n    <ng-template kendoMultiSelectGroupTagTemplate let-dataItems>\n      <ng-container *ngTemplateOutlet=\"multiSelectGroupTagTemplate(); context: { dataItems }\"/>\n    </ng-template>\n  </kendo-multiselect>\n\n  @if (messageText) {\n    <kit-form-message [icon]=\"messageIcon\"\n                      [message]=\"messageText\"\n    ></kit-form-message>\n  }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input .k-chip-list{display:flex}.kit-multiselect .k-input.ltr .k-chip-list{flex-direction:row}.kit-multiselect .k-input.rtl .k-chip-list{flex-direction:row-reverse}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-chip:last-child:has(.k-chip-content .group-tag) .k-chip-actions{display:none}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect.invalid .k-multiselect{border-color:var(--ui-kit-color-red-1)}.kit-multiselect.invalid .kit-form-message-text{color:var(--ui-kit-color-red-1)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;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-multiselect-popup.k-popup{padding:4px}.kit-multiselect-popup .k-list-ul{gap:4px}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { items: [{
                 type: Input
             }], selectedItems: [{
                 type: Input
             }], label: [{
                 type: Input
-            }], disabled: [{
-                type: Input
-            }], placeholder: [{
+            }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], placeholder: [{
                 type: Input
             }], autoClose: [{
                 type: Input
@@ -5955,7 +5957,7 @@ class KitCollapsedListComponent {
         this.shouldShowDropdown.set(resizeParams.shouldShowDropdown);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitCollapsedListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitCollapsedListComponent, isStandalone: true, selector: "kit-collapsed-list", inputs: { itemList: { classPropertyName: "itemList", publicName: "itemList", isSignal: true, isRequired: true, transformFunction: null }, lineHeight: { classPropertyName: "lineHeight", publicName: "lineHeight", isSignal: true, isRequired: false, transformFunction: null }, dropdownDefaultValueText: { classPropertyName: "dropdownDefaultValueText", publicName: "dropdownDefaultValueText", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, disableActions: { classPropertyName: "disableActions", publicName: "disableActions", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownFooterTemplate: { classPropertyName: "dropdownFooterTemplate", publicName: "dropdownFooterTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownItemTemplate: { classPropertyName: "dropdownItemTemplate", publicName: "dropdownItemTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownNoDataTemplate: { classPropertyName: "dropdownNoDataTemplate", publicName: "dropdownNoDataTemplate", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowDropdown: { classPropertyName: "alwaysShowDropdown", publicName: "alwaysShowDropdown", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectItem: "selectItem" }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrapper"], descendants: true, isSignal: true }, { propertyName: "wrapperInner", first: true, predicate: ["wrapperInner"], descendants: true, isSignal: true }, { propertyName: "measureItem", predicate: ["measureItem"], descendants: true, isSignal: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, read: ElementRef, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div #wrapper\n     class=\"kit-collapsed-list\"\n     [ngClass]=\"dropdownAlign()\"\n     [style.--kit-collapsed-list-height.px]=\"lineHeight()\"\n     [style.--kit-collapsed-list-gap.px]=\"gap()\">\n  <div #wrapperInner \n       class=\"wrapper-inner\">\n    @if (visibleItems().length) {\n      <div class=\"element-container\">\n        @for (item of visibleItems(); track $index) {\n          <div class=\"item-wrapper\"\n               (click)=\"selectionChange(item)\">\n            <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate, context: { $implicit: item }\" />\n          </div>\n        }\n      </div>\n    }\n    @if (shouldShowDropdown()) {\n      <kit-dropdown #dropdown\n                    class=\"collapsed-list-dropdown\"\n                    [class.selected]=\"dropdownSelectedItem().value !== defaultSelectedItem().value\"\n                    [items]=\"dropdownItems()\"\n                    [selectedItem]=\"dropdownSelectedItem()\"\n                    [disabled]=\"disableActions()\"\n                    [size]=\"kitDropdownSize.SMALL\"\n                    [popupSettings]=\"popupSettings\"\n                    [isValuePrimitive]=\"false\"\n                    [footerTemplate]=\"dropdownFooterTemplate()\"\n                    [noDataTemplate]=\"dropdownNoDataTemplate()\"\n                    (selected)=\"selectionChange($event)\">\n        @if (dropdownItemTemplate()) {\n          <ng-template kitDropdownItemTemplate let-dataItem>\n            <ng-container *ngTemplateOutlet=\"dropdownItemTemplate(), context: { $implicit: dataItem }\" />\n          </ng-template>\n        }\n      </kit-dropdown>\n    }\n  </div>\n\n  <div class=\"wrapper-inner measure-container\">\n    <div class=\"element-container\">\n      @for (item of itemList(); track $index) {\n        <div #measureItem\n             class=\"item-wrapper\">\n          <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate; context: { $implicit: item }\" />\n        </div>\n      }\n    </div>\n  </div>\n</div>\n\n<ng-template #defaultItemTemplate let-item>\n  <kit-button class=\"item\"\n              [class.active]=\"item.value === _selectedItem().value\"\n              [label]=\"item.text\"\n              [type]=\"kitButtonType.GHOST\"\n              [kind]=\"kitButtonKind.SMALL\"\n              [disabled]=\"disableActions()\" />\n</ng-template>\n", styles: [".kit-collapsed-list.inline .wrapper-inner{justify-content:flex-start}.kit-collapsed-list.end .wrapper-inner{justify-content:space-between}.kit-collapsed-list .wrapper-inner{position:relative;display:flex;gap:var(--kit-collapsed-list-gap, 20px);width:100%;min-width:max-content;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner.measure-container{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;height:0;overflow:hidden}.kit-collapsed-list .wrapper-inner .element-container{display:flex;gap:var(--kit-collapsed-list-gap, 20px)}.kit-collapsed-list .wrapper-inner .element-container .item ::ng-deep .kit-button .k-button{height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown{max-width:100%;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown ::ng-deep .kit-dropdown.small .dropdown{height:var(--kit-collapsed-list-height, 24px)}\n"], dependencies: [{ kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "invalid", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon", "popupSettings", "isValuePrimitive", "footerTemplate", "noDataTemplate", "readonly", "size"], outputs: ["selectedItemChange", "disabledChange", "selected"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: DropDownListModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitCollapsedListComponent, isStandalone: true, selector: "kit-collapsed-list", inputs: { itemList: { classPropertyName: "itemList", publicName: "itemList", isSignal: true, isRequired: true, transformFunction: null }, lineHeight: { classPropertyName: "lineHeight", publicName: "lineHeight", isSignal: true, isRequired: false, transformFunction: null }, dropdownDefaultValueText: { classPropertyName: "dropdownDefaultValueText", publicName: "dropdownDefaultValueText", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, disableActions: { classPropertyName: "disableActions", publicName: "disableActions", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownFooterTemplate: { classPropertyName: "dropdownFooterTemplate", publicName: "dropdownFooterTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownItemTemplate: { classPropertyName: "dropdownItemTemplate", publicName: "dropdownItemTemplate", isSignal: true, isRequired: false, transformFunction: null }, dropdownNoDataTemplate: { classPropertyName: "dropdownNoDataTemplate", publicName: "dropdownNoDataTemplate", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowDropdown: { classPropertyName: "alwaysShowDropdown", publicName: "alwaysShowDropdown", isSignal: true, isRequired: false, transformFunction: null }, dropdownAlign: { classPropertyName: "dropdownAlign", publicName: "dropdownAlign", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectItem: "selectItem" }, viewQueries: [{ propertyName: "wrapper", first: true, predicate: ["wrapper"], descendants: true, isSignal: true }, { propertyName: "wrapperInner", first: true, predicate: ["wrapperInner"], descendants: true, isSignal: true }, { propertyName: "measureItem", predicate: ["measureItem"], descendants: true, isSignal: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, read: ElementRef, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div #wrapper\n     class=\"kit-collapsed-list\"\n     [ngClass]=\"dropdownAlign()\"\n     [style.--kit-collapsed-list-height.px]=\"lineHeight()\"\n     [style.--kit-collapsed-list-gap.px]=\"gap()\">\n  <div #wrapperInner \n       class=\"wrapper-inner\">\n    @if (visibleItems().length) {\n      <div class=\"element-container\">\n        @for (item of visibleItems(); track $index) {\n          <div class=\"item-wrapper\"\n               (click)=\"selectionChange(item)\">\n            <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate, context: { $implicit: item }\" />\n          </div>\n        }\n      </div>\n    }\n    @if (shouldShowDropdown()) {\n      <kit-dropdown #dropdown\n                    class=\"collapsed-list-dropdown\"\n                    [class.selected]=\"dropdownSelectedItem().value !== defaultSelectedItem().value\"\n                    [items]=\"dropdownItems()\"\n                    [selectedItem]=\"dropdownSelectedItem()\"\n                    [disabled]=\"disableActions()\"\n                    [size]=\"kitDropdownSize.SMALL\"\n                    [popupSettings]=\"popupSettings\"\n                    [isValuePrimitive]=\"false\"\n                    [footerTemplate]=\"dropdownFooterTemplate()\"\n                    [noDataTemplate]=\"dropdownNoDataTemplate()\"\n                    (selected)=\"selectionChange($event)\">\n        @if (dropdownItemTemplate()) {\n          <ng-template kitDropdownItemTemplate let-dataItem>\n            <ng-container *ngTemplateOutlet=\"dropdownItemTemplate(), context: { $implicit: dataItem }\" />\n          </ng-template>\n        }\n      </kit-dropdown>\n    }\n  </div>\n\n  <div class=\"wrapper-inner measure-container\">\n    <div class=\"element-container\">\n      @for (item of itemList(); track $index) {\n        <div #measureItem\n             class=\"item-wrapper\">\n          <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate; context: { $implicit: item }\" />\n        </div>\n      }\n    </div>\n  </div>\n</div>\n\n<ng-template #defaultItemTemplate let-item>\n  <kit-button class=\"item\"\n              [class.active]=\"item.value === _selectedItem().value\"\n              [label]=\"item.text\"\n              [type]=\"kitButtonType.GHOST\"\n              [kind]=\"kitButtonKind.SMALL\"\n              [active]=\"item.value === _selectedItem().value\"\n              [disabled]=\"disableActions()\" />\n</ng-template>\n", styles: [".kit-collapsed-list.inline .wrapper-inner{justify-content:flex-start}.kit-collapsed-list.end .wrapper-inner{justify-content:space-between}.kit-collapsed-list .wrapper-inner{position:relative;display:flex;gap:var(--kit-collapsed-list-gap, 20px);width:100%;min-width:max-content;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner.measure-container{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;height:0;overflow:hidden}.kit-collapsed-list .wrapper-inner .element-container{display:flex;gap:var(--kit-collapsed-list-gap, 20px)}.kit-collapsed-list .wrapper-inner .element-container .item ::ng-deep .kit-button .k-button{height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown{max-width:100%;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown ::ng-deep .kit-dropdown.small .dropdown{height:var(--kit-collapsed-list-height, 24px)}\n"], dependencies: [{ kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "invalid", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon", "popupSettings", "isValuePrimitive", "footerTemplate", "noDataTemplate", "readonly", "size"], outputs: ["selectedItemChange", "disabledChange", "selected"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: DropDownListModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitCollapsedListComponent, decorators: [{
             type: Component,
@@ -5965,7 +5967,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         NgTemplateOutlet,
                         DropDownListModule,
                         NgClass,
-                    ], template: "<div #wrapper\n     class=\"kit-collapsed-list\"\n     [ngClass]=\"dropdownAlign()\"\n     [style.--kit-collapsed-list-height.px]=\"lineHeight()\"\n     [style.--kit-collapsed-list-gap.px]=\"gap()\">\n  <div #wrapperInner \n       class=\"wrapper-inner\">\n    @if (visibleItems().length) {\n      <div class=\"element-container\">\n        @for (item of visibleItems(); track $index) {\n          <div class=\"item-wrapper\"\n               (click)=\"selectionChange(item)\">\n            <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate, context: { $implicit: item }\" />\n          </div>\n        }\n      </div>\n    }\n    @if (shouldShowDropdown()) {\n      <kit-dropdown #dropdown\n                    class=\"collapsed-list-dropdown\"\n                    [class.selected]=\"dropdownSelectedItem().value !== defaultSelectedItem().value\"\n                    [items]=\"dropdownItems()\"\n                    [selectedItem]=\"dropdownSelectedItem()\"\n                    [disabled]=\"disableActions()\"\n                    [size]=\"kitDropdownSize.SMALL\"\n                    [popupSettings]=\"popupSettings\"\n                    [isValuePrimitive]=\"false\"\n                    [footerTemplate]=\"dropdownFooterTemplate()\"\n                    [noDataTemplate]=\"dropdownNoDataTemplate()\"\n                    (selected)=\"selectionChange($event)\">\n        @if (dropdownItemTemplate()) {\n          <ng-template kitDropdownItemTemplate let-dataItem>\n            <ng-container *ngTemplateOutlet=\"dropdownItemTemplate(), context: { $implicit: dataItem }\" />\n          </ng-template>\n        }\n      </kit-dropdown>\n    }\n  </div>\n\n  <div class=\"wrapper-inner measure-container\">\n    <div class=\"element-container\">\n      @for (item of itemList(); track $index) {\n        <div #measureItem\n             class=\"item-wrapper\">\n          <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate; context: { $implicit: item }\" />\n        </div>\n      }\n    </div>\n  </div>\n</div>\n\n<ng-template #defaultItemTemplate let-item>\n  <kit-button class=\"item\"\n              [class.active]=\"item.value === _selectedItem().value\"\n              [label]=\"item.text\"\n              [type]=\"kitButtonType.GHOST\"\n              [kind]=\"kitButtonKind.SMALL\"\n              [disabled]=\"disableActions()\" />\n</ng-template>\n", styles: [".kit-collapsed-list.inline .wrapper-inner{justify-content:flex-start}.kit-collapsed-list.end .wrapper-inner{justify-content:space-between}.kit-collapsed-list .wrapper-inner{position:relative;display:flex;gap:var(--kit-collapsed-list-gap, 20px);width:100%;min-width:max-content;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner.measure-container{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;height:0;overflow:hidden}.kit-collapsed-list .wrapper-inner .element-container{display:flex;gap:var(--kit-collapsed-list-gap, 20px)}.kit-collapsed-list .wrapper-inner .element-container .item ::ng-deep .kit-button .k-button{height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown{max-width:100%;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown ::ng-deep .kit-dropdown.small .dropdown{height:var(--kit-collapsed-list-height, 24px)}\n"] }]
+                    ], template: "<div #wrapper\n     class=\"kit-collapsed-list\"\n     [ngClass]=\"dropdownAlign()\"\n     [style.--kit-collapsed-list-height.px]=\"lineHeight()\"\n     [style.--kit-collapsed-list-gap.px]=\"gap()\">\n  <div #wrapperInner \n       class=\"wrapper-inner\">\n    @if (visibleItems().length) {\n      <div class=\"element-container\">\n        @for (item of visibleItems(); track $index) {\n          <div class=\"item-wrapper\"\n               (click)=\"selectionChange(item)\">\n            <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate, context: { $implicit: item }\" />\n          </div>\n        }\n      </div>\n    }\n    @if (shouldShowDropdown()) {\n      <kit-dropdown #dropdown\n                    class=\"collapsed-list-dropdown\"\n                    [class.selected]=\"dropdownSelectedItem().value !== defaultSelectedItem().value\"\n                    [items]=\"dropdownItems()\"\n                    [selectedItem]=\"dropdownSelectedItem()\"\n                    [disabled]=\"disableActions()\"\n                    [size]=\"kitDropdownSize.SMALL\"\n                    [popupSettings]=\"popupSettings\"\n                    [isValuePrimitive]=\"false\"\n                    [footerTemplate]=\"dropdownFooterTemplate()\"\n                    [noDataTemplate]=\"dropdownNoDataTemplate()\"\n                    (selected)=\"selectionChange($event)\">\n        @if (dropdownItemTemplate()) {\n          <ng-template kitDropdownItemTemplate let-dataItem>\n            <ng-container *ngTemplateOutlet=\"dropdownItemTemplate(), context: { $implicit: dataItem }\" />\n          </ng-template>\n        }\n      </kit-dropdown>\n    }\n  </div>\n\n  <div class=\"wrapper-inner measure-container\">\n    <div class=\"element-container\">\n      @for (item of itemList(); track $index) {\n        <div #measureItem\n             class=\"item-wrapper\">\n          <ng-container *ngTemplateOutlet=\"itemTemplate() || defaultItemTemplate; context: { $implicit: item }\" />\n        </div>\n      }\n    </div>\n  </div>\n</div>\n\n<ng-template #defaultItemTemplate let-item>\n  <kit-button class=\"item\"\n              [class.active]=\"item.value === _selectedItem().value\"\n              [label]=\"item.text\"\n              [type]=\"kitButtonType.GHOST\"\n              [kind]=\"kitButtonKind.SMALL\"\n              [active]=\"item.value === _selectedItem().value\"\n              [disabled]=\"disableActions()\" />\n</ng-template>\n", styles: [".kit-collapsed-list.inline .wrapper-inner{justify-content:flex-start}.kit-collapsed-list.end .wrapper-inner{justify-content:space-between}.kit-collapsed-list .wrapper-inner{position:relative;display:flex;gap:var(--kit-collapsed-list-gap, 20px);width:100%;min-width:max-content;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner.measure-container{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;height:0;overflow:hidden}.kit-collapsed-list .wrapper-inner .element-container{display:flex;gap:var(--kit-collapsed-list-gap, 20px)}.kit-collapsed-list .wrapper-inner .element-container .item ::ng-deep .kit-button .k-button{height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown{max-width:100%;height:var(--kit-collapsed-list-height, 24px)}.kit-collapsed-list .wrapper-inner .collapsed-list-dropdown ::ng-deep .kit-dropdown.small .dropdown{height:var(--kit-collapsed-list-height, 24px)}\n"] }]
         }], propDecorators: { itemList: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemList", required: true }] }], lineHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineHeight", required: false }] }], dropdownDefaultValueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownDefaultValueText", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], disableActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableActions", required: false }] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], dropdownFooterTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownFooterTemplate", required: false }] }], dropdownItemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownItemTemplate", required: false }] }], dropdownNoDataTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownNoDataTemplate", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], alwaysShowDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "alwaysShowDropdown", required: false }] }], dropdownAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownAlign", required: false }] }], selectItem: [{ type: i0.Output, args: ["selectItem"] }], wrapper: [{ type: i0.ViewChild, args: ['wrapper', { isSignal: true }] }], wrapperInner: [{ type: i0.ViewChild, args: ['wrapperInner', { isSignal: true }] }], measureItem: [{ type: i0.ViewChildren, args: ['measureItem', { isSignal: true }] }], dropdown: [{ type: i0.ViewChild, args: ['dropdown', { ...{
                             read: ElementRef,
                         }, isSignal: true }] }] } });
@@ -6437,6 +6439,11 @@ const fileTypeGroupMap = {
         KitFileCardFileType.BMP,
     ],
 };
+var KitFileCardSize;
+(function (KitFileCardSize) {
+    KitFileCardSize["LARGE"] = "large";
+    KitFileCardSize["SMALL"] = "small";
+})(KitFileCardSize || (KitFileCardSize = {}));
 
 class KitFileCardComponent {
     constructor() {
@@ -6456,6 +6463,7 @@ class KitFileCardComponent {
          * Defines a value that will be used as a card date
          */
         this.date = '';
+        this.size = input(KitFileCardSize.LARGE, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
         /**
          * Defines a value that will be used as a card name
          */
@@ -6472,7 +6480,9 @@ class KitFileCardComponent {
         this.customMessages = null;
         this.kitSvgIcon = KitSvgIcon;
         this.kitButtonType = KitButtonType;
+        this.kitButtonKind = KitButtonKind;
         this.kitButtonIconPosition = KitButtonIconPosition;
+        this.kitFileCardSize = KitFileCardSize;
         this.dateFormat = 'MMM dd, y hh:mm:ss';
         this.createDateLabel = 'Create Date';
         this.createdByLabel = 'Created By';
@@ -6497,7 +6507,7 @@ class KitFileCardComponent {
         return browserViewableFileTypes.includes(fileType);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitFileCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitFileCardComponent, isStandalone: true, selector: "kit-file-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, fileType: { classPropertyName: "fileType", publicName: "fileType", isSignal: false, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, fileSize: { classPropertyName: "fileSize", publicName: "fileSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { viewButtonClicked: "viewButtonClicked", downloadButtonClicked: "downloadButtonClicked" }, queries: [{ propertyName: "customMessages", first: true, predicate: KitFileCardMessagesComponent, descendants: true }], ngImport: i0, template: "<div class=\"kit-file-card\"\n     [ngClass]=\"type\">\n  <div class=\"kit-file-card-header\">\n    <div class=\"card-title\">{{ title }}</div>\n    <div class=\"card-type\">{{ label }}</div>\n  </div>\n  <div class=\"kit-file-card-content\">\n    <kit-svg-icon class=\"card-icon\"\n                  [icon]=\"getFileIconByExtension(fileType)\">\n    </kit-svg-icon>\n    <div class=\"card-main\">\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createDate ?? createDateLabel }}</div>\n        <div class=\"item-value\">{{ date | date: dateFormat : 'UTC' }}</div>\n      </div>\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createdBy ?? createdByLabel }}</div>\n        <div class=\"item-value\">{{ name }}</div>\n      </div>\n      @if (fileSize()) {\n        <div class=\"card-main-item\">\n          <div class=\"item-label\">{{ customMessages?.fileSize ?? 'File Size' }}</div>\n          <div class=\"item-value\">{{ fileSize() }}</div>\n        </div>\n      }\n    </div>\n  </div>\n  <div class=\"kit-file-card-action\">\n    @if (hasViewFileButton(fileType)) {\n      <kit-button class=\"action-button\"\n                  [label]=\"customMessages?.viewButtonLabel ?? viewButtonLabel\"\n                  [icon]=\"kitSvgIcon.EYE\"\n                  [type]=\"kitButtonType.GHOST\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  (clicked)=\"viewButtonClicked.emit()\"\n      ></kit-button>\n    }\n    <kit-button class=\"action-button\"\n                [label]=\"customMessages?.downloadButtonLabel ?? downloadButtonLabel\"\n                [icon]=\"kitSvgIcon.DOWNLOAD\"\n                [type]=\"kitButtonType.GHOST\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                (clicked)=\"downloadButtonClicked.emit()\"\n    ></kit-button>\n  </div>\n  <ng-content></ng-content>\n</div>\n", styles: [".kit-file-card{padding:25px;color:var(--ui-kit-color-grey-10);border-radius:10px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-file-card-header{display:flex;flex-direction:column;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-file-card .card-title{font-size:16px;font-weight:400}.kit-file-card .card-type{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:0 8px;height:20px;font-size:12px;font-weight:500;color:var(--ui-kit-color-main);border:1px solid var(--ui-kit-color-main);border-radius:4px}.kit-file-card-content{display:flex;align-items:center;gap:24px;padding:17px 0}.kit-file-card .card-icon{width:78px;height:100px}.kit-file-card .card-main{display:flex;flex-direction:column;gap:12px}.kit-file-card .card-main-item{line-height:22px}.kit-file-card .card-main .item-label{color:var(--ui-kit-color-grey-14);font-size:13px}.kit-file-card .card-main .item-value{font-size:16px}.kit-file-card-action{display:flex;gap:15px;padding-top:15px;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-file-card-action .action-button{flex:1}.kit-file-card .action-button ::ng-deep .k-button{width:100%}.kit-file-card.blue .card-type{color:var(--ui-kit-color-blue);border-color:var(--ui-kit-color-blue);background-color:var(--ui-kit-color-blue-1)}.kit-file-card.purple .card-type{color:var(--ui-kit-color-purple);border-color:var(--ui-kit-color-purple);background-color:var(--ui-kit-color-purple-1)}.kit-file-card.teal .card-type{color:var(--ui-kit-color-teal);border-color:var(--ui-kit-color-teal);background-color:var(--ui-kit-color-teal-1)}.kit-file-card.orange .card-type{color:var(--ui-kit-color-orange-2);border-color:var(--ui-kit-color-orange-2);background-color:var(--ui-kit-color-orange-3)}.kit-file-card.green .card-type{color:var(--ui-kit-color-green-1);border-color:var(--ui-kit-color-green-1);background-color:var(--ui-kit-color-green-4)}.kit-file-card.grey .card-type{color:var(--ui-kit-color-grey-10);border-color:var(--ui-kit-color-grey-10);background-color:var(--ui-kit-color-grey-16)}.kit-file-card.red .card-type{color:var(--ui-kit-color-red-1);border-color:var(--ui-kit-color-red-1);background-color:var(--ui-kit-color-red-3)}.kit-file-card.pink .card-type{color:var(--ui-kit-color-pink);border-color:var(--ui-kit-color-pink);background-color:var(--ui-kit-color-pink-1)}\n"], dependencies: [{ kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitFileCardComponent, isStandalone: true, selector: "kit-file-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, fileType: { classPropertyName: "fileType", publicName: "fileType", isSignal: false, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, fileSize: { classPropertyName: "fileSize", publicName: "fileSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { viewButtonClicked: "viewButtonClicked", downloadButtonClicked: "downloadButtonClicked" }, queries: [{ propertyName: "customMessages", first: true, predicate: KitFileCardMessagesComponent, descendants: true }], ngImport: i0, template: "<div class=\"kit-file-card\"\n     [ngClass]=\"type ? [type, size()] : [size()]\">\n  <div class=\"kit-file-card-header\">\n    <div class=\"card-title\">{{ title }}</div>\n    <div class=\"card-type\">{{ label }}</div>\n  </div>\n  <div class=\"kit-file-card-content\">\n    <kit-svg-icon class=\"card-icon\"\n                  [icon]=\"getFileIconByExtension(fileType)\">\n    </kit-svg-icon>\n    <div class=\"card-main\">\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createDate ?? createDateLabel }}</div>\n        <div class=\"item-value\">{{ date | date: dateFormat : 'UTC' }}</div>\n      </div>\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createdBy ?? createdByLabel }}</div>\n        <div class=\"item-value\">{{ name }}</div>\n      </div>\n      @if (fileSize()) {\n        <div class=\"card-main-item\">\n          <div class=\"item-label\">{{ customMessages?.fileSize ?? 'File Size' }}</div>\n          <div class=\"item-value\">{{ fileSize() }}</div>\n        </div>\n      }\n    </div>\n  </div>\n  <div class=\"kit-file-card-action\">\n    @if (hasViewFileButton(fileType)) {\n      <kit-button class=\"action-button\"\n                  [label]=\"customMessages?.viewButtonLabel ?? viewButtonLabel\"\n                  [icon]=\"kitSvgIcon.EYE\"\n                  [type]=\"kitButtonType.GHOST\"\n                  [kind]=\"size() === kitFileCardSize.LARGE ? kitButtonKind.LARGE : kitButtonKind.SMALL\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  (clicked)=\"viewButtonClicked.emit()\"\n      ></kit-button>\n    }\n    <kit-button class=\"action-button\"\n                [label]=\"customMessages?.downloadButtonLabel ?? downloadButtonLabel\"\n                [icon]=\"kitSvgIcon.DOWNLOAD\"\n                [type]=\"kitButtonType.GHOST\"\n                [kind]=\"size() === kitFileCardSize.LARGE ? kitButtonKind.LARGE : kitButtonKind.SMALL\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                (clicked)=\"downloadButtonClicked.emit()\"\n    ></kit-button>\n  </div>\n  <ng-content></ng-content>\n</div>\n", styles: [".kit-file-card{padding:25px;color:var(--ui-kit-color-grey-10);border-radius:10px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-file-card-header{display:flex;flex-direction:column;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-file-card .card-title{font-size:16px;font-weight:400}.kit-file-card .card-type{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:0 8px;height:20px;font-size:12px;font-weight:500;color:var(--ui-kit-color-main);border:1px solid var(--ui-kit-color-main);border-radius:4px}.kit-file-card-content{display:flex;align-items:center;gap:24px;padding:17px 0}.kit-file-card .card-icon{width:78px;height:100px}.kit-file-card .card-main{display:flex;flex-direction:column;gap:12px}.kit-file-card .card-main-item{line-height:22px}.kit-file-card .card-main .item-label{color:var(--ui-kit-color-grey-14);font-size:13px}.kit-file-card .card-main .item-value{font-size:16px}.kit-file-card-action{display:flex;gap:15px;padding-top:15px;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-file-card-action .action-button{flex:1}.kit-file-card .action-button ::ng-deep .k-button{width:100%}.kit-file-card.blue .card-type{color:var(--ui-kit-color-blue);border-color:var(--ui-kit-color-blue);background-color:var(--ui-kit-color-blue-1)}.kit-file-card.purple .card-type{color:var(--ui-kit-color-purple);border-color:var(--ui-kit-color-purple);background-color:var(--ui-kit-color-purple-1)}.kit-file-card.teal .card-type{color:var(--ui-kit-color-teal);border-color:var(--ui-kit-color-teal);background-color:var(--ui-kit-color-teal-1)}.kit-file-card.orange .card-type{color:var(--ui-kit-color-orange-2);border-color:var(--ui-kit-color-orange-2);background-color:var(--ui-kit-color-orange-3)}.kit-file-card.green .card-type{color:var(--ui-kit-color-green-1);border-color:var(--ui-kit-color-green-1);background-color:var(--ui-kit-color-green-4)}.kit-file-card.grey .card-type{color:var(--ui-kit-color-grey-10);border-color:var(--ui-kit-color-grey-10);background-color:var(--ui-kit-color-grey-16)}.kit-file-card.red .card-type{color:var(--ui-kit-color-red-1);border-color:var(--ui-kit-color-red-1);background-color:var(--ui-kit-color-red-3)}.kit-file-card.pink .card-type{color:var(--ui-kit-color-pink);border-color:var(--ui-kit-color-pink);background-color:var(--ui-kit-color-pink-1)}.kit-file-card.small{padding:20px;min-width:270px}.kit-file-card.small-content{gap:15px;padding:17px 10px}.kit-file-card.small .card-title{font-size:15px}.kit-file-card.small .card-icon{width:63px;height:80px}.kit-file-card.small .card-main{gap:8px}.kit-file-card.small .card-main-item{line-height:20px}.kit-file-card.small .card-main .item-value{font-size:14px}\n"], dependencies: [{ kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitFileCardComponent, decorators: [{
             type: Component,
@@ -6506,7 +6516,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                         KitSvgIconComponent,
                         DatePipe,
                         NgClass,
-                    ], template: "<div class=\"kit-file-card\"\n     [ngClass]=\"type\">\n  <div class=\"kit-file-card-header\">\n    <div class=\"card-title\">{{ title }}</div>\n    <div class=\"card-type\">{{ label }}</div>\n  </div>\n  <div class=\"kit-file-card-content\">\n    <kit-svg-icon class=\"card-icon\"\n                  [icon]=\"getFileIconByExtension(fileType)\">\n    </kit-svg-icon>\n    <div class=\"card-main\">\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createDate ?? createDateLabel }}</div>\n        <div class=\"item-value\">{{ date | date: dateFormat : 'UTC' }}</div>\n      </div>\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createdBy ?? createdByLabel }}</div>\n        <div class=\"item-value\">{{ name }}</div>\n      </div>\n      @if (fileSize()) {\n        <div class=\"card-main-item\">\n          <div class=\"item-label\">{{ customMessages?.fileSize ?? 'File Size' }}</div>\n          <div class=\"item-value\">{{ fileSize() }}</div>\n        </div>\n      }\n    </div>\n  </div>\n  <div class=\"kit-file-card-action\">\n    @if (hasViewFileButton(fileType)) {\n      <kit-button class=\"action-button\"\n                  [label]=\"customMessages?.viewButtonLabel ?? viewButtonLabel\"\n                  [icon]=\"kitSvgIcon.EYE\"\n                  [type]=\"kitButtonType.GHOST\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  (clicked)=\"viewButtonClicked.emit()\"\n      ></kit-button>\n    }\n    <kit-button class=\"action-button\"\n                [label]=\"customMessages?.downloadButtonLabel ?? downloadButtonLabel\"\n                [icon]=\"kitSvgIcon.DOWNLOAD\"\n                [type]=\"kitButtonType.GHOST\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                (clicked)=\"downloadButtonClicked.emit()\"\n    ></kit-button>\n  </div>\n  <ng-content></ng-content>\n</div>\n", styles: [".kit-file-card{padding:25px;color:var(--ui-kit-color-grey-10);border-radius:10px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-file-card-header{display:flex;flex-direction:column;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-file-card .card-title{font-size:16px;font-weight:400}.kit-file-card .card-type{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:0 8px;height:20px;font-size:12px;font-weight:500;color:var(--ui-kit-color-main);border:1px solid var(--ui-kit-color-main);border-radius:4px}.kit-file-card-content{display:flex;align-items:center;gap:24px;padding:17px 0}.kit-file-card .card-icon{width:78px;height:100px}.kit-file-card .card-main{display:flex;flex-direction:column;gap:12px}.kit-file-card .card-main-item{line-height:22px}.kit-file-card .card-main .item-label{color:var(--ui-kit-color-grey-14);font-size:13px}.kit-file-card .card-main .item-value{font-size:16px}.kit-file-card-action{display:flex;gap:15px;padding-top:15px;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-file-card-action .action-button{flex:1}.kit-file-card .action-button ::ng-deep .k-button{width:100%}.kit-file-card.blue .card-type{color:var(--ui-kit-color-blue);border-color:var(--ui-kit-color-blue);background-color:var(--ui-kit-color-blue-1)}.kit-file-card.purple .card-type{color:var(--ui-kit-color-purple);border-color:var(--ui-kit-color-purple);background-color:var(--ui-kit-color-purple-1)}.kit-file-card.teal .card-type{color:var(--ui-kit-color-teal);border-color:var(--ui-kit-color-teal);background-color:var(--ui-kit-color-teal-1)}.kit-file-card.orange .card-type{color:var(--ui-kit-color-orange-2);border-color:var(--ui-kit-color-orange-2);background-color:var(--ui-kit-color-orange-3)}.kit-file-card.green .card-type{color:var(--ui-kit-color-green-1);border-color:var(--ui-kit-color-green-1);background-color:var(--ui-kit-color-green-4)}.kit-file-card.grey .card-type{color:var(--ui-kit-color-grey-10);border-color:var(--ui-kit-color-grey-10);background-color:var(--ui-kit-color-grey-16)}.kit-file-card.red .card-type{color:var(--ui-kit-color-red-1);border-color:var(--ui-kit-color-red-1);background-color:var(--ui-kit-color-red-3)}.kit-file-card.pink .card-type{color:var(--ui-kit-color-pink);border-color:var(--ui-kit-color-pink);background-color:var(--ui-kit-color-pink-1)}\n"] }]
+                    ], template: "<div class=\"kit-file-card\"\n     [ngClass]=\"type ? [type, size()] : [size()]\">\n  <div class=\"kit-file-card-header\">\n    <div class=\"card-title\">{{ title }}</div>\n    <div class=\"card-type\">{{ label }}</div>\n  </div>\n  <div class=\"kit-file-card-content\">\n    <kit-svg-icon class=\"card-icon\"\n                  [icon]=\"getFileIconByExtension(fileType)\">\n    </kit-svg-icon>\n    <div class=\"card-main\">\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createDate ?? createDateLabel }}</div>\n        <div class=\"item-value\">{{ date | date: dateFormat : 'UTC' }}</div>\n      </div>\n      <div class=\"card-main-item\">\n        <div class=\"item-label\">{{ customMessages?.createdBy ?? createdByLabel }}</div>\n        <div class=\"item-value\">{{ name }}</div>\n      </div>\n      @if (fileSize()) {\n        <div class=\"card-main-item\">\n          <div class=\"item-label\">{{ customMessages?.fileSize ?? 'File Size' }}</div>\n          <div class=\"item-value\">{{ fileSize() }}</div>\n        </div>\n      }\n    </div>\n  </div>\n  <div class=\"kit-file-card-action\">\n    @if (hasViewFileButton(fileType)) {\n      <kit-button class=\"action-button\"\n                  [label]=\"customMessages?.viewButtonLabel ?? viewButtonLabel\"\n                  [icon]=\"kitSvgIcon.EYE\"\n                  [type]=\"kitButtonType.GHOST\"\n                  [kind]=\"size() === kitFileCardSize.LARGE ? kitButtonKind.LARGE : kitButtonKind.SMALL\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  (clicked)=\"viewButtonClicked.emit()\"\n      ></kit-button>\n    }\n    <kit-button class=\"action-button\"\n                [label]=\"customMessages?.downloadButtonLabel ?? downloadButtonLabel\"\n                [icon]=\"kitSvgIcon.DOWNLOAD\"\n                [type]=\"kitButtonType.GHOST\"\n                [kind]=\"size() === kitFileCardSize.LARGE ? kitButtonKind.LARGE : kitButtonKind.SMALL\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                (clicked)=\"downloadButtonClicked.emit()\"\n    ></kit-button>\n  </div>\n  <ng-content></ng-content>\n</div>\n", styles: [".kit-file-card{padding:25px;color:var(--ui-kit-color-grey-10);border-radius:10px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-file-card-header{display:flex;flex-direction:column;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ui-kit-color-grey-11)}.kit-file-card .card-title{font-size:16px;font-weight:400}.kit-file-card .card-type{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;padding:0 8px;height:20px;font-size:12px;font-weight:500;color:var(--ui-kit-color-main);border:1px solid var(--ui-kit-color-main);border-radius:4px}.kit-file-card-content{display:flex;align-items:center;gap:24px;padding:17px 0}.kit-file-card .card-icon{width:78px;height:100px}.kit-file-card .card-main{display:flex;flex-direction:column;gap:12px}.kit-file-card .card-main-item{line-height:22px}.kit-file-card .card-main .item-label{color:var(--ui-kit-color-grey-14);font-size:13px}.kit-file-card .card-main .item-value{font-size:16px}.kit-file-card-action{display:flex;gap:15px;padding-top:15px;border-top:1px solid var(--ui-kit-color-grey-11)}.kit-file-card-action .action-button{flex:1}.kit-file-card .action-button ::ng-deep .k-button{width:100%}.kit-file-card.blue .card-type{color:var(--ui-kit-color-blue);border-color:var(--ui-kit-color-blue);background-color:var(--ui-kit-color-blue-1)}.kit-file-card.purple .card-type{color:var(--ui-kit-color-purple);border-color:var(--ui-kit-color-purple);background-color:var(--ui-kit-color-purple-1)}.kit-file-card.teal .card-type{color:var(--ui-kit-color-teal);border-color:var(--ui-kit-color-teal);background-color:var(--ui-kit-color-teal-1)}.kit-file-card.orange .card-type{color:var(--ui-kit-color-orange-2);border-color:var(--ui-kit-color-orange-2);background-color:var(--ui-kit-color-orange-3)}.kit-file-card.green .card-type{color:var(--ui-kit-color-green-1);border-color:var(--ui-kit-color-green-1);background-color:var(--ui-kit-color-green-4)}.kit-file-card.grey .card-type{color:var(--ui-kit-color-grey-10);border-color:var(--ui-kit-color-grey-10);background-color:var(--ui-kit-color-grey-16)}.kit-file-card.red .card-type{color:var(--ui-kit-color-red-1);border-color:var(--ui-kit-color-red-1);background-color:var(--ui-kit-color-red-3)}.kit-file-card.pink .card-type{color:var(--ui-kit-color-pink);border-color:var(--ui-kit-color-pink);background-color:var(--ui-kit-color-pink-1)}.kit-file-card.small{padding:20px;min-width:270px}.kit-file-card.small-content{gap:15px;padding:17px 10px}.kit-file-card.small .card-title{font-size:15px}.kit-file-card.small .card-icon{width:63px;height:80px}.kit-file-card.small .card-main{gap:8px}.kit-file-card.small .card-main-item{line-height:20px}.kit-file-card.small .card-main .item-value{font-size:14px}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], type: [{
@@ -6517,7 +6527,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                 type: Input
             }], date: [{
                 type: Input
-            }], name: [{
+            }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], name: [{
                 type: Input
             }], fileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileSize", required: false }] }], viewButtonClicked: [{
                 type: Output
@@ -7820,17 +7830,6 @@ const kitShouldResetGridState = ({ stateColumns, availableColumns, }) => {
     return !stateTitles.every(field => availableTitles.has(field));
 };
 
-var KitUsersSettingsDetailsField;
-(function (KitUsersSettingsDetailsField) {
-    KitUsersSettingsDetailsField["USER_NAME"] = "userName";
-    KitUsersSettingsDetailsField["FIRST_NAME"] = "firstName";
-    KitUsersSettingsDetailsField["LAST_NAME"] = "lastName";
-    KitUsersSettingsDetailsField["EMAIL"] = "email";
-    KitUsersSettingsDetailsField["PASSWORD"] = "password";
-    KitUsersSettingsDetailsField["MFA"] = "mfaEnabled";
-    KitUsersSettingsDetailsField["FORCE_PASSWORD"] = "forcePassword";
-})(KitUsersSettingsDetailsField || (KitUsersSettingsDetailsField = {}));
-
 var KitUsersSettingsServerErrorTitle;
 (function (KitUsersSettingsServerErrorTitle) {
     KitUsersSettingsServerErrorTitle["PASSWORD_TOO_WEAK"] = "Your password is too weak.";
@@ -7841,12 +7840,6 @@ const kitUsersSettingsErrorTranslationMap = {
     [KitUsersSettingsServerErrorTitle.INVALID_USER_NAME]: 'kit.usersSettings.details.userNameInvalid',
 };
 
-const kitApiResponseDefaultEntities = () => ({
-    data: [],
-    total: 0,
-    loading: true,
-});
-
 class KitFetchUsersSettings extends KitAbstractPayloadAction {
     static { this.type = '[KitUsersSettings] Fetch Users'; }
 }
@@ -7923,6 +7916,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             type: Injectable
         }] });
 
+const kitApiResponseDefaultEntities = () => ({
+    data: [],
+    total: 0,
+    loading: true,
+});
+
 const KIT_USERS_SETTINGS_STATE_TOKEN = new StateToken('usersSettings');
 let KitUsersSettingsState = class KitUsersSettingsState {
     constructor() {
@@ -8061,6 +8060,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             type: Injectable
         }], propDecorators: { fetchUsers: [], fetchUserDetails: [], updateUserDetails: [], createUser: [], deleteUser: [] } });
 
+var KitUsersSettingsDetailsField;
+(function (KitUsersSettingsDetailsField) {
+    KitUsersSettingsDetailsField["USER_NAME"] = "userName";
+    KitUsersSettingsDetailsField["FIRST_NAME"] = "firstName";
+    KitUsersSettingsDetailsField["LAST_NAME"] = "lastName";
+    KitUsersSettingsDetailsField["EMAIL"] = "email";
+    KitUsersSettingsDetailsField["PASSWORD"] = "password";
+    KitUsersSettingsDetailsField["MFA"] = "mfaEnabled";
+    KitUsersSettingsDetailsField["FORCE_PASSWORD"] = "forcePassword";
+})(KitUsersSettingsDetailsField || (KitUsersSettingsDetailsField = {}));
 const kitUsersSettingsDetailsFormServerErrorFieldMap = {
     [KitUsersSettingsServerErrorTitle.PASSWORD_TOO_WEAK]: KitUsersSettingsDetailsField.PASSWORD,
     [KitUsersSettingsServerErrorTitle.INVALID_USER_NAME]: KitUsersSettingsDetailsField.USER_NAME,
@@ -8215,6 +8224,464 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     ], template: "@if (opened()) {\n  <kit-dialog class=\"kit-user-settings-create-dialog\"\n              [type]=\"kitDialogType.Declarative\">\n    <kit-dialog-titlebar (closed)=\"opened.set(false)\">\n      {{ \"kit.usersSettings.createDialog.title\" | translate }}\n    </kit-dialog-titlebar>\n\n    <div class=\"kit-user-settings-create-dialog-content\">\n      <kit-users-settings-details-form [isCreatingNewUser]=\"true\" />\n    </div>\n\n    <kit-dialog-actions>\n      <kit-button [label]=\"'kit.usersSettings.createDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"opened.set(false)\" />\n      <kit-button [label]=\"'kit.usersSettings.createDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [disabled]=\"isFormDisabled\"\n                  (clicked)=\"onConfirm()\" />\n    </kit-dialog-actions>\n  </kit-dialog>\n}\n", styles: [".kit-user-settings-create-dialog-content{padding:15px 20px;display:flex;flex-direction:column;gap:15px}\n"] }]
         }], propDecorators: { detailsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsDetailsFormComponent), { isSignal: true }] }], opened: [{ type: i0.Input, args: [{ isSignal: true, alias: "opened", required: false }] }, { type: i0.Output, args: ["openedChange"] }] } });
 
+var KitUsersSettingsEntitlementsField;
+(function (KitUsersSettingsEntitlementsField) {
+    KitUsersSettingsEntitlementsField["IDENTITY_TYPE"] = "identityType";
+    KitUsersSettingsEntitlementsField["PARTNERS"] = "partners";
+    KitUsersSettingsEntitlementsField["ALIAS"] = "alias";
+    KitUsersSettingsEntitlementsField["ROLES"] = "roles";
+})(KitUsersSettingsEntitlementsField || (KitUsersSettingsEntitlementsField = {}));
+;
+
+var KitUsersSettingsEntitlementType;
+(function (KitUsersSettingsEntitlementType) {
+    KitUsersSettingsEntitlementType["ADMIN"] = "Admin";
+    KitUsersSettingsEntitlementType["USER"] = "User";
+})(KitUsersSettingsEntitlementType || (KitUsersSettingsEntitlementType = {}));
+
+class KitUsersSettingsReferenceService {
+    constructor() {
+        this.httpClient = inject(HttpClient);
+        this.baseUrl = `${trimTrailingSlash(inject(KIT_BASE_PATH))}/`;
+    }
+    getPartners() {
+        const url = `${this.baseUrl}private/partners`;
+        return this.httpClient.get(url, {
+            params: kitBuildHttpParams({ $orderby: 'name' }),
+        }).pipe(map((response) => response.data));
+    }
+    getRoles(filter) {
+        const url = `${this.baseUrl}users/roles`;
+        return this.httpClient.get(url, {
+            params: kitBuildHttpParams({ $filter: filter }),
+        }).pipe(map((response) => response.data));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsReferenceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsReferenceService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsReferenceService, decorators: [{
+            type: Injectable
+        }] });
+
+class KitFetchUsersSettingsEntitlements extends KitAbstractPayloadAction {
+    static { this.type = '[KitUsersSettings] Fetch User Entitlements'; }
+}
+class KitFetchUsersSettingsEntitlementDetails extends KitAbstractPayloadAction {
+    static { this.type = '[KitUsersSettings] Fetch User Entitlement Details'; }
+}
+class KitDeleteUsersSettingsEntitlement extends KitAbstractPayloadAction {
+    static { this.type = '[KitUsersSettings] Delete User Entitlement'; }
+}
+class KitCreateUsersSettingsEntitlement extends KitAbstractPayloadAction {
+    static { this.type = '[KitUsersSettings] Create User Entitlement'; }
+}
+class KitUpdateUsersSettingsEntitlement extends KitAbstractPayloadAction {
+    static { this.type = '[KitUsersSettings] Update User Entitlement'; }
+}
+
+class KitUsersSettingsEntitlementsService {
+    constructor() {
+        this.httpClient = inject(HttpClient);
+        this.baseUrl = `${trimTrailingSlash(inject(KIT_BASE_PATH))}/`;
+    }
+    getUserEntitlements(id) {
+        const url = `${this.baseUrl}users/${id}/identities`;
+        return this.httpClient.get(url);
+    }
+    getEntitlementDetails(userId, entitlementId) {
+        const url = `${this.baseUrl}users/${userId}/identities/${entitlementId}`;
+        return this.httpClient.get(url);
+    }
+    createEntitlement(userId, payload) {
+        const url = `${this.baseUrl}users/${userId}/identities`;
+        return this.httpClient.post(url, payload);
+    }
+    updateEntitlement(userId, entitlementId, payload) {
+        const url = `${this.baseUrl}users/${userId}/identities/${entitlementId}`;
+        return this.httpClient.put(url, payload);
+    }
+    deleteEntitlement(userId, entitlementId) {
+        const url = `${this.baseUrl}users/${userId}/identities/${entitlementId}`;
+        return this.httpClient.delete(url);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsService, decorators: [{
+            type: Injectable
+        }] });
+
+const KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN = new StateToken('usersSettingsEntitlements');
+let KitUsersSettingsEntitlementsState = class KitUsersSettingsEntitlementsState {
+    constructor() {
+        this.kitUsersSettingsService = inject(KitUsersSettingsEntitlementsService);
+    }
+    fetchUserEntitlements(ctx, action) {
+        const currentState = ctx.getState();
+        ctx.patchState({
+            userEntitlements: { ...currentState.userEntitlements, loading: true },
+        });
+        return this.kitUsersSettingsService.getUserEntitlements(action.payload).pipe(tap(data => {
+            ctx.patchState({
+                userEntitlements: {
+                    loading: false,
+                    data: data.data,
+                },
+            });
+        }), catchError(err => {
+            ctx.patchState({
+                userEntitlements: { ...ctx.getState().userEntitlements, loading: false },
+            });
+            return throwError(() => err);
+        }));
+    }
+    fetchUserEntitlementDetails(ctx, action) {
+        ctx.patchState({
+            userEntitlementDetails: { loading: true, data: null },
+        });
+        return this.kitUsersSettingsService.getEntitlementDetails(action.payload.userId, action.payload.entitlementId).pipe(tap(data => {
+            ctx.patchState({
+                userEntitlementDetails: { loading: false, data },
+            });
+        }), catchError(err => {
+            ctx.patchState({
+                userEntitlementDetails: { loading: false, data: null },
+            });
+            return throwError(() => err);
+        }));
+    }
+    deleteEntitlement(ctx, action) {
+        return this.kitUsersSettingsService.deleteEntitlement(action.payload.userId, action.payload.entitlementId).pipe(tap(() => {
+            const currentState = ctx.getState();
+            ctx.patchState({
+                userEntitlements: {
+                    ...currentState.userEntitlements,
+                    data: currentState.userEntitlements.data.filter(entitlement => entitlement.id !== action.payload.entitlementId),
+                },
+                userEntitlementDetails: { loading: false, data: null },
+            });
+        }));
+    }
+    createEntitlement(ctx, action) {
+        return this.kitUsersSettingsService.createEntitlement(action.payload.userId, action.payload.payload).pipe(tap(data => {
+            const currentState = ctx.getState();
+            ctx.patchState({
+                userEntitlements: {
+                    ...currentState.userEntitlements,
+                    data: [
+                        ...currentState.userEntitlements.data,
+                        { ...data, isCurrent: false },
+                    ],
+                },
+            });
+        }), catchError(err => {
+            ctx.patchState({
+                userEntitlementDetails: { ...ctx.getState().userEntitlementDetails, loading: false },
+            });
+            return throwError(() => err);
+        }));
+    }
+    updateEntitlement(ctx, action) {
+        return this.kitUsersSettingsService.updateEntitlement(action.payload.userId, action.payload.entitlementId, action.payload.payload).pipe(tap(data => {
+            ctx.patchState({
+                userEntitlementDetails: { loading: false, data },
+            });
+        }), catchError(err => {
+            ctx.patchState({
+                userEntitlementDetails: { ...ctx.getState().userEntitlementDetails, loading: false },
+            });
+            return throwError(() => err);
+        }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsState, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsState }); }
+};
+__decorate([
+    Action(KitFetchUsersSettingsEntitlements)
+], KitUsersSettingsEntitlementsState.prototype, "fetchUserEntitlements", null);
+__decorate([
+    Action(KitFetchUsersSettingsEntitlementDetails)
+], KitUsersSettingsEntitlementsState.prototype, "fetchUserEntitlementDetails", null);
+__decorate([
+    Action(KitDeleteUsersSettingsEntitlement)
+], KitUsersSettingsEntitlementsState.prototype, "deleteEntitlement", null);
+__decorate([
+    Action(KitCreateUsersSettingsEntitlement)
+], KitUsersSettingsEntitlementsState.prototype, "createEntitlement", null);
+__decorate([
+    Action(KitUpdateUsersSettingsEntitlement)
+], KitUsersSettingsEntitlementsState.prototype, "updateEntitlement", null);
+KitUsersSettingsEntitlementsState = __decorate([
+    State({
+        name: KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN,
+        defaults: {
+            userEntitlements: kitApiResponseDefaultEntities(),
+            userEntitlementDetails: {
+                loading: false,
+                data: null,
+            },
+        },
+    })
+], KitUsersSettingsEntitlementsState);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsState, decorators: [{
+            type: Injectable
+        }], propDecorators: { fetchUserEntitlements: [], fetchUserEntitlementDetails: [], deleteEntitlement: [], createEntitlement: [], updateEntitlement: [] } });
+
+class KitUsersSettingsEntitlementsFormComponent {
+    constructor() {
+        this.formBuilder = inject(FormBuilder);
+        this.store = inject(Store);
+        this.translateService = inject(TranslateService);
+        this.referenceService = inject(KitUsersSettingsReferenceService);
+        this.isCreating = input(false, ...(ngDevMode ? [{ debugName: "isCreating" }] : /* istanbul ignore next */ []));
+        this.showIdentityType = input.required(...(ngDevMode ? [{ debugName: "showIdentityType" }] : /* istanbul ignore next */ []));
+        this.identityTypeItems = computed(() => [
+            {
+                text: this.translateService.instant('kit.common.selectValue'),
+                value: null,
+            },
+            ...Object.values(KitUsersSettingsEntitlementType).map((value) => ({ text: value, value })),
+        ], ...(ngDevMode ? [{ debugName: "identityTypeItems" }] : /* istanbul ignore next */ []));
+        this.kitUsersSettingsEntitlementsField = KitUsersSettingsEntitlementsField;
+        this.form = this.formBuilder.group({
+            [KitUsersSettingsEntitlementsField.IDENTITY_TYPE]: this.formBuilder.control(null),
+            [KitUsersSettingsEntitlementsField.PARTNERS]: this.formBuilder.control(null),
+            [KitUsersSettingsEntitlementsField.ALIAS]: this.formBuilder.nonNullable.control('', Validators.required),
+            [KitUsersSettingsEntitlementsField.ROLES]: this.formBuilder.control(null, Validators.required),
+        });
+        this.kitUsersSettingsEntitlementType = KitUsersSettingsEntitlementType;
+        this.roleItems = computed(() => this.roles().map((role) => ({
+            text: role.name,
+            value: role.id.toString(),
+        })), ...(ngDevMode ? [{ debugName: "roleItems" }] : /* istanbul ignore next */ []));
+        this.partnerItems = computed(() => {
+            const partnersItems = this.partners().map((partner) => ({
+                text: partner.name,
+                value: partner.id.toString(),
+            }));
+            return [
+                {
+                    text: this.translateService.instant('kit.common.selectValue'),
+                    value: null,
+                },
+                ...partnersItems,
+            ];
+        }, ...(ngDevMode ? [{ debugName: "partnerItems" }] : /* istanbul ignore next */ []));
+        this.userEntitlements = computed(() => this.store.selectSignal(KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN)().userEntitlements, ...(ngDevMode ? [{ debugName: "userEntitlements" }] : /* istanbul ignore next */ []));
+        this.userEntitlementDetails = computed(() => (this.store.selectSignal(KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN)().userEntitlementDetails.data), ...(ngDevMode ? [{ debugName: "userEntitlementDetails" }] : /* istanbul ignore next */ []));
+        this.userId = computed(() => (this.store.selectSignal(KIT_USERS_SETTINGS_STATE_TOKEN)().userDetails.data?.id ?? null), ...(ngDevMode ? [{ debugName: "userId" }] : /* istanbul ignore next */ []));
+        this.partners = signal([], ...(ngDevMode ? [{ debugName: "partners" }] : /* istanbul ignore next */ []));
+        this.roles = signal([], ...(ngDevMode ? [{ debugName: "roles" }] : /* istanbul ignore next */ []));
+        effect(() => this.updateFormFields());
+        effect(() => this.loadFormData());
+        effect(() => this.updateDisabledState());
+    }
+    get showPartnersControl() {
+        return this.form.get(KitUsersSettingsEntitlementsField.IDENTITY_TYPE)?.value === KitUsersSettingsEntitlementType.USER
+            && this.showIdentityType();
+    }
+    submit() {
+        const userId = this.userId();
+        if (!userId) {
+            return;
+        }
+        if (this.isCreating()) {
+            const payload = this.buildCreatePayload();
+            this.dispatchAndMarkPristine(new KitCreateUsersSettingsEntitlement({
+                userId,
+                payload,
+            }));
+            return;
+        }
+        this.submitUpdate(userId);
+    }
+    submitUpdate(userId) {
+        const formValue = this.form.getRawValue();
+        const entitlementDetails = this.userEntitlementDetails();
+        if (!entitlementDetails) {
+            return;
+        }
+        const updatePayload = this.buildUpdatePayload(formValue, entitlementDetails, userId);
+        this.dispatchAndMarkPristine(new KitUpdateUsersSettingsEntitlement({
+            userId,
+            entitlementId: entitlementDetails.id,
+            payload: updatePayload,
+        }));
+    }
+    buildCreatePayload() {
+        const formValue = this.form.getRawValue();
+        return {
+            alias: formValue.alias,
+            type: formValue.identityType ?? undefined,
+            roles: (formValue.roles ?? []).map(Number),
+            partnerId: this.resolvePartnerId(formValue.identityType, formValue.partners),
+        };
+    }
+    buildUpdatePayload(formValue, entitlementDetails, userId) {
+        return {
+            id: entitlementDetails.id,
+            userId,
+            type: formValue.identityType ?? entitlementDetails.type,
+            alias: formValue.alias,
+            partnerId: this.resolvePartnerId(formValue.identityType, formValue.partners),
+            roles: (formValue.roles ?? []).map(Number),
+            scopes: entitlementDetails.scopes,
+        };
+    }
+    resolvePartnerId(identityType, partnerId) {
+        if (identityType === KitUsersSettingsEntitlementType.USER && partnerId) {
+            return Number(partnerId);
+        }
+        return undefined;
+    }
+    dispatchAndMarkPristine(action) {
+        this.store.dispatch(action).pipe(tap(() => this.form.markAsPristine())).subscribe();
+    }
+    updateDisabledState() {
+        const disabled = (!this.userEntitlementDetails() || this.userEntitlements().loading) && !this.isCreating();
+        if (disabled) {
+            this.form.get(KitUsersSettingsEntitlementsField.ALIAS)?.disable();
+            this.form.get(KitUsersSettingsEntitlementsField.ROLES)?.disable();
+        }
+        else {
+            this.form.get(KitUsersSettingsEntitlementsField.ALIAS)?.enable();
+            this.form.get(KitUsersSettingsEntitlementsField.ROLES)?.enable();
+        }
+    }
+    updateFormFields() {
+        const userEntitlementDetails = this.userEntitlementDetails();
+        if (!this.isCreating() && userEntitlementDetails) {
+            this.form.patchValue({
+                [KitUsersSettingsEntitlementsField.IDENTITY_TYPE]: userEntitlementDetails.type,
+                [KitUsersSettingsEntitlementsField.PARTNERS]: userEntitlementDetails.partnerId?.toString() ?? null,
+                [KitUsersSettingsEntitlementsField.ALIAS]: userEntitlementDetails.alias,
+                [KitUsersSettingsEntitlementsField.ROLES]: userEntitlementDetails.roles?.map(String) ?? null,
+            });
+            this.form.get(KitUsersSettingsEntitlementsField.IDENTITY_TYPE)?.disable();
+            this.form.get(KitUsersSettingsEntitlementsField.PARTNERS)?.disable();
+            this.form.markAsPristine();
+        }
+    }
+    loadFormData() {
+        const context = this.getFormDataContext();
+        if (!context) {
+            return;
+        }
+        const rolesFilter = this.buildRolesFilter(context.identityType, context.partnerId);
+        this.loadPartners();
+        this.loadRoles(rolesFilter);
+    }
+    getFormDataContext() {
+        if (this.isCreating()) {
+            const formPartnerId = Number(this.form.value[KitUsersSettingsEntitlementsField.PARTNERS]) || null;
+            const formIdentityType = this.form.value[KitUsersSettingsEntitlementsField.IDENTITY_TYPE] ?? null;
+            return {
+                partnerId: formPartnerId,
+                identityType: formIdentityType,
+            };
+        }
+        const details = this.userEntitlementDetails();
+        if (!details) {
+            return null;
+        }
+        return {
+            partnerId: details.partnerId ? Number(details.partnerId) : null,
+            identityType: details.type ?? null,
+        };
+    }
+    loadPartners() {
+        if (this.showIdentityType()) {
+            this.referenceService.getPartners().pipe(tap((partners) => {
+                this.partners.set(partners);
+            })).subscribe();
+        }
+    }
+    loadRoles(rolesFilter) {
+        this.referenceService.getRoles(rolesFilter).pipe(tap((roles) => {
+            this.roles.set(roles);
+        })).subscribe();
+    }
+    buildRolesFilter(identityType, partnerId) {
+        const filters = [];
+        if (!identityType || (identityType === KitUsersSettingsEntitlementType.USER && !partnerId || !this.showIdentityType())) {
+            return undefined;
+        }
+        if (identityType === KitUsersSettingsEntitlementType.ADMIN) {
+            const adminFilter = {
+                field: 'type',
+                operator: KitFilterOperator.EQ,
+                value: 'Admin',
+            };
+            filters.push(adminFilter);
+        }
+        if (identityType === KitUsersSettingsEntitlementType.USER && partnerId) {
+            const typeFilter = {
+                field: 'type',
+                operator: KitFilterOperator.EQ,
+                value: 'User',
+            };
+            const partnerFilter = {
+                field: 'partnerId',
+                operator: KitFilterOperator.EQ,
+                value: partnerId,
+            };
+            filters.push(typeFilter, partnerFilter);
+        }
+        return kitDataStateToODataString({
+            filter: {
+                logic: KitFilterLogic.AND,
+                filters,
+            },
+        }).replace('$filter=', '');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitUsersSettingsEntitlementsFormComponent, isStandalone: true, selector: "kit-users-settings-entitlements-form", inputs: { isCreating: { classPropertyName: "isCreating", publicName: "isCreating", isSignal: true, isRequired: false, transformFunction: null }, showIdentityType: { classPropertyName: "showIdentityType", publicName: "showIdentityType", isSignal: true, isRequired: true, transformFunction: null } }, providers: [KitFormErrors], ngImport: i0, template: "<form class=\"kit-user-settings-entitlements-form\"\n      [formGroup]=\"form\">\n  @if (showIdentityType()) {\n    <kit-dropdown [formControlName]=\"kitUsersSettingsEntitlementsField.IDENTITY_TYPE\"\n                  [items]=\"identityTypeItems()\"\n                  [label]=\"'kit.usersSettings.entitlements.identityType' | translate\">\n    </kit-dropdown>\n  }\n  @if (showPartnersControl) {\n    <kit-dropdown [formControlName]=\"kitUsersSettingsEntitlementsField.PARTNERS\"\n                  [items]=\"partnerItems()\"\n                  [label]=\"'kit.usersSettings.entitlements.partners' | translate\">\n    </kit-dropdown>\n  }\n  <kit-textbox [formControlName]=\"kitUsersSettingsEntitlementsField.ALIAS\"\n               [label]=\"'kit.usersSettings.entitlements.alias' | translate\">\n  </kit-textbox>\n  <kit-multiselect [formControlName]=\"kitUsersSettingsEntitlementsField.ROLES\"\n                   [items]=\"roleItems()\"\n                   [label]=\"'kit.usersSettings.entitlements.roles' | translate\">\n  </kit-multiselect>\n</form>\n", styles: [".kit-user-settings-entitlements-form{display:flex;flex-direction:column;gap:10px;width:100%}\n"], dependencies: [{ kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon", "readonly", "customStateIcon", "type"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "component", type: KitDropdownComponent, selector: "kit-dropdown", inputs: ["items", "selectedItem", "label", "disabled", "messageIcon", "messageText", "invalid", "defaultItem", "listHeight", "hideDefaultItem", "toggleIcon", "popupSettings", "isValuePrimitive", "footerTemplate", "noDataTemplate", "readonly", "size"], outputs: ["selectedItemChange", "disabledChange", "selected"] }, { kind: "component", type: KitMultiselectComponent, selector: "kit-multiselect", inputs: ["items", "selectedItems", "label", "disabled", "placeholder", "autoClose", "messageIcon", "messageText", "shouldAddAllAsOption", "allOptionLabel", "tagMapper", "size", "useCheckboxes", "popupClass", "listHeight", "allowCustom", "invalid", "filterable", "itemsDirection", "autoSummaryTag", "autoSummaryTagContainerClass", "fallbackGroupChipWidth", "showCheckIcon"], outputs: ["disabledChange", "changed"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-users-settings-entitlements-form', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        TranslatePipe,
+                        KitTextboxComponent,
+                        KitDropdownComponent,
+                        KitMultiselectComponent,
+                        ReactiveFormsModule,
+                    ], providers: [KitFormErrors], template: "<form class=\"kit-user-settings-entitlements-form\"\n      [formGroup]=\"form\">\n  @if (showIdentityType()) {\n    <kit-dropdown [formControlName]=\"kitUsersSettingsEntitlementsField.IDENTITY_TYPE\"\n                  [items]=\"identityTypeItems()\"\n                  [label]=\"'kit.usersSettings.entitlements.identityType' | translate\">\n    </kit-dropdown>\n  }\n  @if (showPartnersControl) {\n    <kit-dropdown [formControlName]=\"kitUsersSettingsEntitlementsField.PARTNERS\"\n                  [items]=\"partnerItems()\"\n                  [label]=\"'kit.usersSettings.entitlements.partners' | translate\">\n    </kit-dropdown>\n  }\n  <kit-textbox [formControlName]=\"kitUsersSettingsEntitlementsField.ALIAS\"\n               [label]=\"'kit.usersSettings.entitlements.alias' | translate\">\n  </kit-textbox>\n  <kit-multiselect [formControlName]=\"kitUsersSettingsEntitlementsField.ROLES\"\n                   [items]=\"roleItems()\"\n                   [label]=\"'kit.usersSettings.entitlements.roles' | translate\">\n  </kit-multiselect>\n</form>\n", styles: [".kit-user-settings-entitlements-form{display:flex;flex-direction:column;gap:10px;width:100%}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { isCreating: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCreating", required: false }] }], showIdentityType: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIdentityType", required: true }] }] } });
+
+class KitUsersSettingsCreateEntitlementDialogComponent {
+    constructor() {
+        this.entitlementsForm = viewChild.required(KitUsersSettingsEntitlementsFormComponent);
+        this.showIdentityType = input.required(...(ngDevMode ? [{ debugName: "showIdentityType" }] : /* istanbul ignore next */ []));
+        this.opened = model(false, ...(ngDevMode ? [{ debugName: "opened" }] : /* istanbul ignore next */ []));
+        this.kitDialogType = KitDialogType;
+        this.kitButtonKind = KitButtonKind;
+        this.kitButtonType = KitButtonType;
+    }
+    get isFormDisabled() {
+        return this.entitlementsForm().form.pristine || this.entitlementsForm().form.invalid;
+    }
+    onConfirm() {
+        this.entitlementsForm().submit();
+        this.opened.set(false);
+    }
+    onClose() {
+        this.opened.set(false);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsCreateEntitlementDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitUsersSettingsCreateEntitlementDialogComponent, isStandalone: true, selector: "kit-users-settings-create-entitlement-dialog", inputs: { showIdentityType: { classPropertyName: "showIdentityType", publicName: "showIdentityType", isSignal: true, isRequired: true, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "openedChange" }, viewQueries: [{ propertyName: "entitlementsForm", first: true, predicate: KitUsersSettingsEntitlementsFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (opened()) {\n  <kit-dialog class=\"kit-user-settings-create-entitlement-dialog\"\n              [type]=\"kitDialogType.Declarative\">\n    <kit-dialog-titlebar (closed)=\"onClose()\">\n      {{ \"kit.usersSettings.profile.createEntitlement\" | translate }}\n    </kit-dialog-titlebar>\n\n    <div class=\"kit-user-settings-create-entitlement-dialog-content\">\n      <kit-users-settings-entitlements-form [showIdentityType]=\"showIdentityType()\"\n                                            [isCreating]=\"true\" />\n    </div>\n\n    <kit-dialog-actions>\n      <kit-button [label]=\"'kit.usersSettings.createDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"onClose()\" />\n      <kit-button [label]=\"'kit.usersSettings.createDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [disabled]=\"isFormDisabled\"\n                  (clicked)=\"onConfirm()\" />\n    </kit-dialog-actions>\n  </kit-dialog>\n}\n", styles: [".kit-user-settings-create-entitlement-dialog-content{min-width:560px;padding:15px 20px}\n"], dependencies: [{ kind: "component", type: KitDialogComponent, selector: "kit-dialog", inputs: ["type", "backUrl"] }, { kind: "component", type: KitDialogTitlebarComponent, selector: "kit-dialog-titlebar", outputs: ["closed"] }, { kind: "component", type: KitDialogActionsComponent, selector: "kit-dialog-actions" }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitUsersSettingsEntitlementsFormComponent, selector: "kit-users-settings-entitlements-form", inputs: ["isCreating", "showIdentityType"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsCreateEntitlementDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-users-settings-create-entitlement-dialog', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        KitDialogComponent,
+                        KitDialogTitlebarComponent,
+                        KitDialogActionsComponent,
+                        KitButtonComponent,
+                        TranslatePipe,
+                        KitUsersSettingsEntitlementsFormComponent,
+                    ], template: "@if (opened()) {\n  <kit-dialog class=\"kit-user-settings-create-entitlement-dialog\"\n              [type]=\"kitDialogType.Declarative\">\n    <kit-dialog-titlebar (closed)=\"onClose()\">\n      {{ \"kit.usersSettings.profile.createEntitlement\" | translate }}\n    </kit-dialog-titlebar>\n\n    <div class=\"kit-user-settings-create-entitlement-dialog-content\">\n      <kit-users-settings-entitlements-form [showIdentityType]=\"showIdentityType()\"\n                                            [isCreating]=\"true\" />\n    </div>\n\n    <kit-dialog-actions>\n      <kit-button [label]=\"'kit.usersSettings.createDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"onClose()\" />\n      <kit-button [label]=\"'kit.usersSettings.createDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [disabled]=\"isFormDisabled\"\n                  (clicked)=\"onConfirm()\" />\n    </kit-dialog-actions>\n  </kit-dialog>\n}\n", styles: [".kit-user-settings-create-entitlement-dialog-content{min-width:560px;padding:15px 20px}\n"] }]
+        }], propDecorators: { entitlementsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsEntitlementsFormComponent), { isSignal: true }] }], showIdentityType: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIdentityType", required: true }] }], opened: [{ type: i0.Input, args: [{ isSignal: true, alias: "opened", required: false }] }, { type: i0.Output, args: ["openedChange"] }] } });
+
 var KitUsersSettingsPasswordDialogField;
 (function (KitUsersSettingsPasswordDialogField) {
     KitUsersSettingsPasswordDialogField["PASSWORD"] = "password";
@@ -8315,37 +8782,170 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
                     ], providers: [KitFormErrors], template: "@if (opened()) {\n  <kit-dialog class=\"kit-users-settings-password-dialog\"\n              [type]=\"kitDialogType.Declarative\">\n    <kit-dialog-titlebar (closed)=\"opened.set(false)\">\n      {{ \"kit.usersSettings.passwordDialog.title\" | translate }}\n    </kit-dialog-titlebar>\n\n    <form class=\"kit-users-settings-password-dialog-content\"\n          [formGroup]=\"form\">\n      <kit-textbox type=\"password\"\n                   class=\"kit-users-settings-password-dialog-textbox\"\n                   [formControlName]=\"kitUsersSettingsPasswordDialogField.PASSWORD\"\n                   [label]=\"'kit.usersSettings.passwordDialog.newPassword' | translate\"\n                   [state]=\"getTextboxState(kitUsersSettingsPasswordDialogField.PASSWORD)\"\n                   [messageText]=\"getTextboxMessageText(kitUsersSettingsPasswordDialogField.PASSWORD) | translate\"></kit-textbox>\n      <kit-textbox type=\"password\"\n                   class=\"kit-users-settings-password-dialog-textbox\"\n                   [formControlName]=\"kitUsersSettingsPasswordDialogField.REPEAT_PASSWORD\"\n                   [label]=\"'kit.usersSettings.passwordDialog.repeatNewPassword' | translate\"\n                   [state]=\"getTextboxState(kitUsersSettingsPasswordDialogField.REPEAT_PASSWORD)\"\n                   [messageText]=\"getTextboxMessageText(kitUsersSettingsPasswordDialogField.REPEAT_PASSWORD) | translate\"></kit-textbox>\n      <kit-toggle class=\"kit-users-settings-password-dialog-toggle\"\n                  [formControlName]=\"kitUsersSettingsPasswordDialogField.FORCE_PASSWORD\"\n                  [label]=\"'kit.usersSettings.passwordDialog.forcePassword' | translate\"></kit-toggle>\n    </form>\n\n    <kit-dialog-actions>\n      <kit-button [label]=\"'kit.usersSettings.passwordDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"opened.set(false)\" />\n      <kit-button [label]=\"'kit.usersSettings.passwordDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [disabled]=\"isFormDisabled\"\n                  (clicked)=\"onConfirm()\" />\n    </kit-dialog-actions>\n  </kit-dialog>\n}", styles: [".kit-users-settings-password-dialog-content{width:400px;padding:15px 20px;display:flex;flex-direction:column;gap:15px}.kit-users-settings-password-dialog-toggle ::ng-deep .kit-toggle{display:flex;align-items:center;justify-content:space-between;gap:15px}\n"] }]
         }], propDecorators: { opened: [{ type: i0.Input, args: [{ isSignal: true, alias: "opened", required: false }] }, { type: i0.Output, args: ["openedChange"] }] } });
 
-class KitUsersSettingsDetailsComponent {
+var KitUsersSettingsProfileTab;
+(function (KitUsersSettingsProfileTab) {
+    KitUsersSettingsProfileTab["DETAILS"] = "details";
+    KitUsersSettingsProfileTab["ENTITLEMENTS"] = "entitlements";
+})(KitUsersSettingsProfileTab || (KitUsersSettingsProfileTab = {}));
+
+class KitUsersSettingsEntitlementsComponent {
     constructor() {
         this.store = inject(Store);
-        this.detailsForm = viewChild.required(KitUsersSettingsDetailsFormComponent);
-        this.usersSettingsState = this.store.selectSignal(KIT_USERS_SETTINGS_STATE_TOKEN);
-        this.userDetails = computed(() => this.usersSettingsState().userDetails, ...(ngDevMode ? [{ debugName: "userDetails" }] : /* istanbul ignore next */ []));
+        this.entitlementsForm = viewChild(KitUsersSettingsEntitlementsFormComponent, ...(ngDevMode ? [{ debugName: "entitlementsForm" }] : /* istanbul ignore next */ []));
+        this.collapsedList = viewChild(KitCollapsedListComponent, ...(ngDevMode ? [{ debugName: "collapsedList" }] : /* istanbul ignore next */ []));
+        this.showIdentityType = input.required(...(ngDevMode ? [{ debugName: "showIdentityType" }] : /* istanbul ignore next */ []));
+        this.userEntitlements = computed(() => this.store.selectSignal(KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN)().userEntitlements, ...(ngDevMode ? [{ debugName: "userEntitlements" }] : /* istanbul ignore next */ []));
+        this.userDetailsId = computed(() => (this.store.selectSignal(KIT_USERS_SETTINGS_STATE_TOKEN)().userDetails.data?.id), ...(ngDevMode ? [{ debugName: "userDetailsId" }] : /* istanbul ignore next */ []));
+        this.entitlementItems = computed(() => (this.userEntitlements().data).map(entitlement => ({ text: entitlement.alias, value: String(entitlement.id) })), ...(ngDevMode ? [{ debugName: "entitlementItems" }] : /* istanbul ignore next */ []));
+        this.selectedEntitlementId = signal(null, ...(ngDevMode ? [{ debugName: "selectedEntitlementId" }] : /* istanbul ignore next */ []));
+        effect(() => this.fetchEntitlements());
+        effect(() => this.fetchEntitlementDetails());
+        effect(() => this.selectFirstItem());
+    }
+    get isFormDisabled() {
+        const formComponent = this.entitlementsForm();
+        return !formComponent || formComponent.form.pristine || formComponent.form.invalid;
+    }
+    selectItem(item) {
+        const collapsedList = this.collapsedList();
+        if (collapsedList) {
+            collapsedList.setSelectedItem(item);
+            this.selectedEntitlementId.set(+item.value);
+        }
+        ;
+    }
+    submit() {
+        this.entitlementsForm()?.submit();
+    }
+    fetchEntitlements() {
+        const userId = this.userDetailsId();
+        if (userId) {
+            this.selectedEntitlementId.set(null);
+            this.store.dispatch(new KitFetchUsersSettingsEntitlements(userId));
+        }
+    }
+    selectFirstItem() {
+        const firstItem = this.userEntitlements().data[0];
+        if (firstItem) {
+            this.selectItem({ text: firstItem.alias, value: String(firstItem.id) });
+        }
+    }
+    fetchEntitlementDetails() {
+        const entitlementId = this.selectedEntitlementId();
+        const userId = this.userDetailsId();
+        if (entitlementId && userId) {
+            this.store.dispatch(new KitFetchUsersSettingsEntitlementDetails({
+                userId,
+                entitlementId,
+            }));
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitUsersSettingsEntitlementsComponent, isStandalone: true, selector: "kit-users-settings-entitlements", inputs: { showIdentityType: { classPropertyName: "showIdentityType", publicName: "showIdentityType", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "entitlementsForm", first: true, predicate: KitUsersSettingsEntitlementsFormComponent, descendants: true, isSignal: true }, { propertyName: "collapsedList", first: true, predicate: KitCollapsedListComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"kit-users-settings-entitlements\">\n  @if (userEntitlements().loading) {\n    <kit-skeleton [height]=\"24\" />\n  } @else {\n    <kit-collapsed-list [itemList]=\"entitlementItems()\"\n                        (selectItem)=\"selectItem($event)\" />\n  }\n  <kit-users-settings-entitlements-form [showIdentityType]=\"showIdentityType()\" />\n  <ng-content />\n</div>\n", styles: [".kit-users-settings-entitlements{display:flex;flex-direction:column;gap:16px}\n"], dependencies: [{ kind: "component", type: KitCollapsedListComponent, selector: "kit-collapsed-list", inputs: ["itemList", "lineHeight", "dropdownDefaultValueText", "gap", "disableActions", "itemTemplate", "dropdownFooterTemplate", "dropdownItemTemplate", "dropdownNoDataTemplate", "appendTo", "alwaysShowDropdown", "dropdownAlign"], outputs: ["selectItem"] }, { kind: "component", type: KitSkeletonComponent, selector: "kit-skeleton", inputs: ["width", "height", "shape", "animation"] }, { kind: "component", type: KitUsersSettingsEntitlementsFormComponent, selector: "kit-users-settings-entitlements-form", inputs: ["isCreating", "showIdentityType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsEntitlementsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-users-settings-entitlements', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        KitCollapsedListComponent,
+                        KitSkeletonComponent,
+                        KitUsersSettingsEntitlementsFormComponent,
+                    ], template: "<div class=\"kit-users-settings-entitlements\">\n  @if (userEntitlements().loading) {\n    <kit-skeleton [height]=\"24\" />\n  } @else {\n    <kit-collapsed-list [itemList]=\"entitlementItems()\"\n                        (selectItem)=\"selectItem($event)\" />\n  }\n  <kit-users-settings-entitlements-form [showIdentityType]=\"showIdentityType()\" />\n  <ng-content />\n</div>\n", styles: [".kit-users-settings-entitlements{display:flex;flex-direction:column;gap:16px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { entitlementsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsEntitlementsFormComponent), { isSignal: true }] }], collapsedList: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitCollapsedListComponent), { isSignal: true }] }], showIdentityType: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIdentityType", required: true }] }] } });
+
+class KitUsersSettingsProfileComponent {
+    constructor() {
+        this.store = inject(Store);
+        this.destroyRef = inject(DestroyRef);
+        this.kitDialogService = inject(KitDialogService);
+        this.translateService = inject(TranslateService);
+        this.viewContainerRef = inject(ViewContainerRef);
+        this.detailsForm = viewChild(KitUsersSettingsDetailsFormComponent, ...(ngDevMode ? [{ debugName: "detailsForm" }] : /* istanbul ignore next */ []));
+        this.entitlementsForm = viewChild(KitUsersSettingsEntitlementsComponent, ...(ngDevMode ? [{ debugName: "entitlementsForm" }] : /* istanbul ignore next */ []));
+        this.showIdentityType = input.required(...(ngDevMode ? [{ debugName: "showIdentityType" }] : /* istanbul ignore next */ []));
+        this.saveClicked = output();
+        this.userDetails = computed(() => this.store.selectSignal(KIT_USERS_SETTINGS_STATE_TOKEN)().userDetails, ...(ngDevMode ? [{ debugName: "userDetails" }] : /* istanbul ignore next */ []));
+        this.userEntitlementsDetails = computed(() => this.store.selectSignal(KIT_USERS_SETTINGS_ENTITLEMENTS_STATE_TOKEN)().userEntitlementDetails, ...(ngDevMode ? [{ debugName: "userEntitlementsDetails" }] : /* istanbul ignore next */ []));
+        this.currentTab = signal(KitUsersSettingsProfileTab.DETAILS, ...(ngDevMode ? [{ debugName: "currentTab" }] : /* istanbul ignore next */ []));
         this.isPasswordDialogOpened = signal(false, ...(ngDevMode ? [{ debugName: "isPasswordDialogOpened" }] : /* istanbul ignore next */ []));
+        this.isEntitlementDialogOpened = signal(false, ...(ngDevMode ? [{ debugName: "isEntitlementDialogOpened" }] : /* istanbul ignore next */ []));
         this.kitButtonKind = KitButtonKind;
         this.kitButtonType = KitButtonType;
         this.kitSvgIcon = KitSvgIcon;
+        this.kitSvgIconType = KitSvgIconType;
         this.kitButtonIconPosition = KitButtonIconPosition;
+        this.kitUsersSettingsProfileTab = KitUsersSettingsProfileTab;
+        this.cancelDeleteEntitlementAction = {
+            text: this.translateService.instant('kit.usersSettings.entitlements.deleteDialog.cancel'),
+            cssClass: `${KitButtonType.GHOST} ${KitButtonState.DEFAULT} ${KitButtonKind.MEDIUM}`,
+        };
+        this.confirmDeleteEntitlementAction = {
+            text: this.translateService.instant('kit.usersSettings.entitlements.deleteDialog.confirm'),
+            cssClass: `${KitButtonType.PRIMARY} ${KitButtonState.DEFAULT} ${KitButtonKind.MEDIUM}`,
+        };
     }
     get isFormDisabled() {
-        return this.detailsForm().form.pristine || this.detailsForm().form.invalid;
+        if (this.currentTab() === KitUsersSettingsProfileTab.DETAILS) {
+            const detailsForm = this.detailsForm();
+            return !detailsForm || detailsForm.form.pristine || detailsForm.form.invalid;
+        }
+        return this.entitlementsForm()?.isFormDisabled ?? true;
+    }
+    get isSaveLoading() {
+        if (this.currentTab() === KitUsersSettingsProfileTab.DETAILS) {
+            return this.userDetails().loading;
+        }
+        return this.userEntitlementsDetails().loading;
     }
     onSave() {
-        this.detailsForm().submit();
+        if (this.currentTab() === KitUsersSettingsProfileTab.DETAILS) {
+            this.detailsForm()?.submit();
+        }
+        else {
+            this.entitlementsForm()?.submit();
+        }
+        this.saveClicked.emit();
+    }
+    onTabSelected(event) {
+        const tabs = Object.values(KitUsersSettingsProfileTab);
+        this.currentTab.set(tabs[event.index]);
+    }
+    onDeleteEntitlement() {
+        const entitlementsDetails = this.userEntitlementsDetails().data;
+        if (!entitlementsDetails) {
+            return;
+        }
+        this.kitDialogService.openDialog({
+            title: this.translateService.instant('kit.usersSettings.entitlements.deleteDialog.title'),
+            content: this.translateService.instant('kit.usersSettings.entitlements.deleteDialog.content'),
+            appendTo: this.viewContainerRef,
+            actions: [
+                this.cancelDeleteEntitlementAction,
+                this.confirmDeleteEntitlementAction,
+            ],
+        });
+        this.kitDialogService.dialogRef?.result.pipe(takeUntilDestroyed(this.destroyRef), filter(action => action === this.confirmDeleteEntitlementAction), switchMap(() => this.store.dispatch(new KitDeleteUsersSettingsEntitlement({
+            userId: entitlementsDetails.userId,
+            entitlementId: entitlementsDetails.id,
+        })))).subscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: KitUsersSettingsDetailsComponent, isStandalone: true, selector: "kit-users-settings-details", viewQueries: [{ propertyName: "detailsForm", first: true, predicate: KitUsersSettingsDetailsFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"kit-user-settings-details\">\n  <kit-entity-section-container>\n    <ng-container title>\n      <div class=\"kit-user-settings-details-header\">\n        <span>{{ \"kit.usersSettings.details.title\" | translate }}</span>\n        <div class=\"kit-user-settings-details-actions\">\n          <kit-button [label]=\"'kit.usersSettings.details.changePassword' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [type]=\"kitButtonType.GHOST\"\n                      [disabled]=\"userDetails().loading\"\n                      (clicked)=\"isPasswordDialogOpened.set(true)\" />\n          <kit-button [label]=\"'kit.usersSettings.details.save' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [icon]=\"kitSvgIcon.DISKETTE\"\n                      [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                      [disabled]=\"isFormDisabled || userDetails().loading\"\n                      (clicked)=\"onSave()\" />\n        </div>\n      </div>\n    </ng-container>\n  </kit-entity-section-container>\n  <kit-users-settings-details-form />\n\n  <kit-users-settings-password-dialog [(opened)]=\"isPasswordDialogOpened\" />\n</div>", styles: [".kit-user-settings-details-header{display:flex;align-items:center;justify-content:space-between}.kit-user-settings-details-actions{display:flex;gap:8px}.kit-user-settings-details ::ng-deep .kit-entity-section-container{padding-bottom:10px;gap:0;margin-bottom:15px}\n"], dependencies: [{ kind: "component", type: KitEntitySectionContainerComponent, selector: "kit-entity-section-container" }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitUsersSettingsPasswordDialogComponent, selector: "kit-users-settings-password-dialog", inputs: ["opened"], outputs: ["openedChange"] }, { kind: "component", type: KitUsersSettingsDetailsFormComponent, selector: "kit-users-settings-details-form", inputs: ["isCreatingNewUser"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KitUsersSettingsProfileComponent, isStandalone: true, selector: "kit-users-settings-profile", inputs: { showIdentityType: { classPropertyName: "showIdentityType", publicName: "showIdentityType", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { saveClicked: "saveClicked" }, viewQueries: [{ propertyName: "detailsForm", first: true, predicate: KitUsersSettingsDetailsFormComponent, descendants: true, isSignal: true }, { propertyName: "entitlementsForm", first: true, predicate: KitUsersSettingsEntitlementsComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"kit-user-settings-profile\">\n  <kit-entity-section-container>\n    <ng-container title>\n      <div class=\"kit-user-settings-profile-header\">\n        <kit-tabs class=\"kit-user-settings-profile-tabs\"\n                  (tabSelected)=\"onTabSelected($event)\">\n        <kit-tab [title]=\"'kit.usersSettings.profile.tabs.details' | translate\"\n                 [selected]=\"true\" />\n        <kit-tab [title]=\"'kit.usersSettings.profile.tabs.entitlements' | translate\" />\n      </kit-tabs>\n        <div class=\"kit-user-settings-profile-actions\">\n          @if (currentTab() === kitUsersSettingsProfileTab.DETAILS) {\n            <kit-button [label]=\"'kit.usersSettings.profile.changePassword' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userDetails().loading\"\n                        (clicked)=\"isPasswordDialogOpened.set(true)\" />\n          } @else {\n            <kit-button [label]=\"'kit.usersSettings.profile.createEntitlement' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userDetails().loading\"\n                        [icon]=\"kitSvgIcon.PLUS\"\n                        [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                        (clicked)=\"isEntitlementDialogOpened.set(true)\" />\n            <kit-button [label]=\"'kit.usersSettings.profile.delete' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userEntitlementsDetails().loading || !userEntitlementsDetails().data\"\n                        [icon]=\"kitSvgIcon.TRASH\"\n                        [iconType]=\"kitSvgIconType.STROKE\"\n                        [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                        (clicked)=\"onDeleteEntitlement()\" />\n          }\n          <kit-button [label]=\"'kit.usersSettings.profile.save' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [icon]=\"kitSvgIcon.DISKETTE\"\n                      [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                      [disabled]=\"isFormDisabled || isSaveLoading\"\n                      (clicked)=\"onSave()\" />\n        </div>\n      </div>\n    </ng-container>\n  </kit-entity-section-container>\n  @if (currentTab() === kitUsersSettingsProfileTab.DETAILS) {\n    <kit-users-settings-details-form />\n  \n    <kit-users-settings-password-dialog [(opened)]=\"isPasswordDialogOpened\" />\n  } @else {\n    <ng-template #entitlementsExtraContent>\n      <ng-content />\n    </ng-template>\n\n    <kit-users-settings-create-entitlement-dialog [showIdentityType]=\"showIdentityType()\"\n                                                  [(opened)]=\"isEntitlementDialogOpened\">\n    </kit-users-settings-create-entitlement-dialog>\n\n    <kit-users-settings-entitlements [showIdentityType]=\"showIdentityType()\">\n      <ng-container [ngTemplateOutlet]=\"entitlementsExtraContent\" />\n    </kit-users-settings-entitlements>\n  }\n</div>", styles: [".kit-user-settings-profile-header{display:flex;align-items:center;justify-content:space-between}.kit-user-settings-profile-actions{display:flex;gap:8px}.kit-user-settings-profile ::ng-deep .kit-entity-section-container{padding-bottom:0;gap:0;margin-bottom:15px}.kit-user-settings-profile ::ng-deep .kit-user-settings-profile-tabs .k-link{display:inline-block;height:100%}\n"], dependencies: [{ kind: "component", type: KitEntitySectionContainerComponent, selector: "kit-entity-section-container" }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitUsersSettingsCreateEntitlementDialogComponent, selector: "kit-users-settings-create-entitlement-dialog", inputs: ["showIdentityType", "opened"], outputs: ["openedChange"] }, { kind: "component", type: KitUsersSettingsPasswordDialogComponent, selector: "kit-users-settings-password-dialog", inputs: ["opened"], outputs: ["openedChange"] }, { kind: "component", type: KitUsersSettingsDetailsFormComponent, selector: "kit-users-settings-details-form", inputs: ["isCreatingNewUser"] }, { kind: "component", type: KitUsersSettingsEntitlementsComponent, selector: "kit-users-settings-entitlements", inputs: ["showIdentityType"] }, { kind: "component", type: KitTabsComponent, selector: "kit-tabs", inputs: ["type", "size", "animate"], outputs: ["tabSelected"] }, { kind: "component", type: KitTabComponent, selector: "kit-tab", inputs: ["title", "icon", "iconType", "selected", "disabled"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsDetailsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsProfileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kit-users-settings-details', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+            args: [{ selector: 'kit-users-settings-profile', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         KitEntitySectionContainerComponent,
                         KitButtonComponent,
                         TranslatePipe,
+                        KitUsersSettingsCreateEntitlementDialogComponent,
                         KitUsersSettingsPasswordDialogComponent,
                         KitUsersSettingsDetailsFormComponent,
-                    ], template: "<div class=\"kit-user-settings-details\">\n  <kit-entity-section-container>\n    <ng-container title>\n      <div class=\"kit-user-settings-details-header\">\n        <span>{{ \"kit.usersSettings.details.title\" | translate }}</span>\n        <div class=\"kit-user-settings-details-actions\">\n          <kit-button [label]=\"'kit.usersSettings.details.changePassword' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [type]=\"kitButtonType.GHOST\"\n                      [disabled]=\"userDetails().loading\"\n                      (clicked)=\"isPasswordDialogOpened.set(true)\" />\n          <kit-button [label]=\"'kit.usersSettings.details.save' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [icon]=\"kitSvgIcon.DISKETTE\"\n                      [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                      [disabled]=\"isFormDisabled || userDetails().loading\"\n                      (clicked)=\"onSave()\" />\n        </div>\n      </div>\n    </ng-container>\n  </kit-entity-section-container>\n  <kit-users-settings-details-form />\n\n  <kit-users-settings-password-dialog [(opened)]=\"isPasswordDialogOpened\" />\n</div>", styles: [".kit-user-settings-details-header{display:flex;align-items:center;justify-content:space-between}.kit-user-settings-details-actions{display:flex;gap:8px}.kit-user-settings-details ::ng-deep .kit-entity-section-container{padding-bottom:10px;gap:0;margin-bottom:15px}\n"] }]
-        }], propDecorators: { detailsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsDetailsFormComponent), { isSignal: true }] }] } });
+                        KitUsersSettingsEntitlementsComponent,
+                        KitTabsComponent,
+                        KitTabComponent,
+                        NgTemplateOutlet,
+                    ], template: "<div class=\"kit-user-settings-profile\">\n  <kit-entity-section-container>\n    <ng-container title>\n      <div class=\"kit-user-settings-profile-header\">\n        <kit-tabs class=\"kit-user-settings-profile-tabs\"\n                  (tabSelected)=\"onTabSelected($event)\">\n        <kit-tab [title]=\"'kit.usersSettings.profile.tabs.details' | translate\"\n                 [selected]=\"true\" />\n        <kit-tab [title]=\"'kit.usersSettings.profile.tabs.entitlements' | translate\" />\n      </kit-tabs>\n        <div class=\"kit-user-settings-profile-actions\">\n          @if (currentTab() === kitUsersSettingsProfileTab.DETAILS) {\n            <kit-button [label]=\"'kit.usersSettings.profile.changePassword' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userDetails().loading\"\n                        (clicked)=\"isPasswordDialogOpened.set(true)\" />\n          } @else {\n            <kit-button [label]=\"'kit.usersSettings.profile.createEntitlement' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userDetails().loading\"\n                        [icon]=\"kitSvgIcon.PLUS\"\n                        [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                        (clicked)=\"isEntitlementDialogOpened.set(true)\" />\n            <kit-button [label]=\"'kit.usersSettings.profile.delete' | translate\"\n                        [kind]=\"kitButtonKind.MEDIUM\"\n                        [type]=\"kitButtonType.GHOST\"\n                        [disabled]=\"userEntitlementsDetails().loading || !userEntitlementsDetails().data\"\n                        [icon]=\"kitSvgIcon.TRASH\"\n                        [iconType]=\"kitSvgIconType.STROKE\"\n                        [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                        (clicked)=\"onDeleteEntitlement()\" />\n          }\n          <kit-button [label]=\"'kit.usersSettings.profile.save' | translate\"\n                      [kind]=\"kitButtonKind.MEDIUM\"\n                      [icon]=\"kitSvgIcon.DISKETTE\"\n                      [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                      [disabled]=\"isFormDisabled || isSaveLoading\"\n                      (clicked)=\"onSave()\" />\n        </div>\n      </div>\n    </ng-container>\n  </kit-entity-section-container>\n  @if (currentTab() === kitUsersSettingsProfileTab.DETAILS) {\n    <kit-users-settings-details-form />\n  \n    <kit-users-settings-password-dialog [(opened)]=\"isPasswordDialogOpened\" />\n  } @else {\n    <ng-template #entitlementsExtraContent>\n      <ng-content />\n    </ng-template>\n\n    <kit-users-settings-create-entitlement-dialog [showIdentityType]=\"showIdentityType()\"\n                                                  [(opened)]=\"isEntitlementDialogOpened\">\n    </kit-users-settings-create-entitlement-dialog>\n\n    <kit-users-settings-entitlements [showIdentityType]=\"showIdentityType()\">\n      <ng-container [ngTemplateOutlet]=\"entitlementsExtraContent\" />\n    </kit-users-settings-entitlements>\n  }\n</div>", styles: [".kit-user-settings-profile-header{display:flex;align-items:center;justify-content:space-between}.kit-user-settings-profile-actions{display:flex;gap:8px}.kit-user-settings-profile ::ng-deep .kit-entity-section-container{padding-bottom:0;gap:0;margin-bottom:15px}.kit-user-settings-profile ::ng-deep .kit-user-settings-profile-tabs .k-link{display:inline-block;height:100%}\n"] }]
+        }], propDecorators: { detailsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsDetailsFormComponent), { isSignal: true }] }], entitlementsForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitUsersSettingsEntitlementsComponent), { isSignal: true }] }], showIdentityType: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIdentityType", required: true }] }], saveClicked: [{ type: i0.Output, args: ["saveClicked"] }] } });
 
 class KitUsersSettingsComponent {
     constructor() {
@@ -8357,6 +8957,8 @@ class KitUsersSettingsComponent {
         this.cardDetailsComponent = viewChild.required(KitCardDetailsComponent);
         this.deleteDialogActionsTemplate = viewChild.required('deleteDialogActions', { read: TemplateRef });
         this.title = input.required(...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+        this.showIdentityType = input(true, ...(ngDevMode ? [{ debugName: "showIdentityType" }] : /* istanbul ignore next */ []));
+        this.saveClicked = output();
         this.currentUserId = this.store.selectSignal((state) => state.user?.data?.id?.toString() ?? null);
         this.isCreatingNewUser = signal(false, ...(ngDevMode ? [{ debugName: "isCreatingNewUser" }] : /* istanbul ignore next */ []));
         this.pendingDeleteUser = signal(null, ...(ngDevMode ? [{ debugName: "pendingDeleteUser" }] : /* istanbul ignore next */ []));
@@ -8426,19 +9028,19 @@ class KitUsersSettingsComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: KitUsersSettingsComponent, isStandalone: true, selector: "kit-users-settings", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "cardDetailsComponent", first: true, predicate: KitCardDetailsComponent, descendants: true, isSignal: true }, { propertyName: "deleteDialogActionsTemplate", first: true, predicate: ["deleteDialogActions"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<div class=\"kit-users-settings\">\n  <kit-card-details [title]=\"title()\"\n                    [pageSize]=\"pageSize\"\n                    [cardData$]=\"cardData$\"\n                    (cardClicked)=\"onCardSelected($event)\"\n                    (dataStateChanged)=\"onDataStateChanged($event)\">\n    <ng-template #headerActions>\n      <kit-button [label]=\"'kit.usersSettings.details.createNewUser' | translate\"\n                  [icon]=\"kitSvgIcon.PLUS\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"isCreatingNewUser.set(true)\" />\n    </ng-template>\n\n    <ng-template #cardElement\n                 let-user>\n      <div class=\"kit-users-settings-card-row\">\n        <kit-truncate-text class=\"kit-users-settings-card\">{{ getUserDisplayName(user) }}</kit-truncate-text>\n        <kit-button [icon]=\"kitSvgIcon.TRASH\"\n                    [kind]=\"kitButtonKind.SMALL\"\n                    [type]=\"kitButtonType.TEXT\"\n                    [iconType]=\"kitSvgIconType.STROKE\"\n                    [disabled]=\"isDeleteDisabled(user.id)\"\n                    (clicked)=\"onDeleteUser(user)\" />\n      </div>\n    </ng-template>\n\n    <ng-template #details\n                 let-activeId>\n      <kit-users-settings-details />\n    </ng-template>\n  </kit-card-details>\n\n  <kit-users-settings-create-dialog [(opened)]=\"isCreatingNewUser\" />\n\n  <ng-template #deleteDialogActions>\n    <div class=\"kit-users-settings-delete-dialog-actions\">\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"closeDeleteDialog()\" />\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  (clicked)=\"confirmDeleteUser()\" />\n    </div>\n  </ng-template>\n</div>\n", styles: [".kit-users-settings-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.kit-users-settings-card{margin:10px 0;min-width:0}::ng-deep .kit-users-settings-delete-dialog-actions{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "component", type: KitCardDetailsComponent, selector: "kit-card-details", inputs: ["cardData$", "pageSize", "title", "cardSkeletonConfig"], outputs: ["dataStateChanged", "cardClicked"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }, { kind: "component", type: KitUsersSettingsDetailsComponent, selector: "kit-users-settings-details" }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitUsersSettingsCreateDialogComponent, selector: "kit-users-settings-create-dialog", inputs: ["opened"], outputs: ["openedChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: KitUsersSettingsComponent, isStandalone: true, selector: "kit-users-settings", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, showIdentityType: { classPropertyName: "showIdentityType", publicName: "showIdentityType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { saveClicked: "saveClicked" }, viewQueries: [{ propertyName: "cardDetailsComponent", first: true, predicate: KitCardDetailsComponent, descendants: true, isSignal: true }, { propertyName: "deleteDialogActionsTemplate", first: true, predicate: ["deleteDialogActions"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<div class=\"kit-users-settings\">\n  <kit-card-details [title]=\"title()\"\n                    [pageSize]=\"pageSize\"\n                    [cardData$]=\"cardData$\"\n                    (cardClicked)=\"onCardSelected($event)\"\n                    (dataStateChanged)=\"onDataStateChanged($event)\">\n    <ng-template #headerActions>\n      <kit-button [label]=\"'kit.usersSettings.details.createNewUser' | translate\"\n                  [icon]=\"kitSvgIcon.PLUS\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"isCreatingNewUser.set(true)\" />\n    </ng-template>\n\n    <ng-template #cardElement\n                 let-user>\n      <div class=\"kit-users-settings-card-row\">\n        <kit-truncate-text class=\"kit-users-settings-card\">{{ getUserDisplayName(user) }}</kit-truncate-text>\n        <kit-button [icon]=\"kitSvgIcon.TRASH\"\n                    [kind]=\"kitButtonKind.SMALL\"\n                    [type]=\"kitButtonType.TEXT\"\n                    [iconType]=\"kitSvgIconType.STROKE\"\n                    [disabled]=\"isDeleteDisabled(user.id)\"\n                    (clicked)=\"onDeleteUser(user)\" />\n      </div>\n    </ng-template>\n\n    <ng-template #details\n                 let-activeId>\n      <kit-users-settings-profile [showIdentityType]=\"showIdentityType()\"\n                                  (saveClicked)=\"saveClicked.emit()\">\n        <ng-content select=\"[extended-entitlements]\" />\n      </kit-users-settings-profile>\n    </ng-template>\n  </kit-card-details>\n\n  <kit-users-settings-create-dialog [(opened)]=\"isCreatingNewUser\" />\n\n  <ng-template #deleteDialogActions>\n    <div class=\"kit-users-settings-delete-dialog-actions\">\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"closeDeleteDialog()\" />\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  (clicked)=\"confirmDeleteUser()\" />\n    </div>\n  </ng-template>\n</div>\n", styles: [".kit-users-settings-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.kit-users-settings-card{margin:10px 0;min-width:0}::ng-deep .kit-users-settings-delete-dialog-actions{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "component", type: KitCardDetailsComponent, selector: "kit-card-details", inputs: ["cardData$", "pageSize", "title", "cardSkeletonConfig"], outputs: ["dataStateChanged", "cardClicked"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }, { kind: "component", type: KitUsersSettingsProfileComponent, selector: "kit-users-settings-profile", inputs: ["showIdentityType"], outputs: ["saveClicked"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitUsersSettingsCreateDialogComponent, selector: "kit-users-settings-create-dialog", inputs: ["opened"], outputs: ["openedChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KitUsersSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kit-users-settings', imports: [
                         KitCardDetailsComponent,
                         KitTruncateTextComponent,
-                        KitUsersSettingsDetailsComponent,
+                        KitUsersSettingsProfileComponent,
                         KitButtonComponent,
                         TranslatePipe,
                         KitUsersSettingsCreateDialogComponent,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-users-settings\">\n  <kit-card-details [title]=\"title()\"\n                    [pageSize]=\"pageSize\"\n                    [cardData$]=\"cardData$\"\n                    (cardClicked)=\"onCardSelected($event)\"\n                    (dataStateChanged)=\"onDataStateChanged($event)\">\n    <ng-template #headerActions>\n      <kit-button [label]=\"'kit.usersSettings.details.createNewUser' | translate\"\n                  [icon]=\"kitSvgIcon.PLUS\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"isCreatingNewUser.set(true)\" />\n    </ng-template>\n\n    <ng-template #cardElement\n                 let-user>\n      <div class=\"kit-users-settings-card-row\">\n        <kit-truncate-text class=\"kit-users-settings-card\">{{ getUserDisplayName(user) }}</kit-truncate-text>\n        <kit-button [icon]=\"kitSvgIcon.TRASH\"\n                    [kind]=\"kitButtonKind.SMALL\"\n                    [type]=\"kitButtonType.TEXT\"\n                    [iconType]=\"kitSvgIconType.STROKE\"\n                    [disabled]=\"isDeleteDisabled(user.id)\"\n                    (clicked)=\"onDeleteUser(user)\" />\n      </div>\n    </ng-template>\n\n    <ng-template #details\n                 let-activeId>\n      <kit-users-settings-details />\n    </ng-template>\n  </kit-card-details>\n\n  <kit-users-settings-create-dialog [(opened)]=\"isCreatingNewUser\" />\n\n  <ng-template #deleteDialogActions>\n    <div class=\"kit-users-settings-delete-dialog-actions\">\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"closeDeleteDialog()\" />\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  (clicked)=\"confirmDeleteUser()\" />\n    </div>\n  </ng-template>\n</div>\n", styles: [".kit-users-settings-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.kit-users-settings-card{margin:10px 0;min-width:0}::ng-deep .kit-users-settings-delete-dialog-actions{display:flex;justify-content:space-between}\n"] }]
-        }], propDecorators: { cardDetailsComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitCardDetailsComponent), { isSignal: true }] }], deleteDialogActionsTemplate: [{ type: i0.ViewChild, args: ['deleteDialogActions', { ...{ read: TemplateRef }, isSignal: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }] } });
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-users-settings\">\n  <kit-card-details [title]=\"title()\"\n                    [pageSize]=\"pageSize\"\n                    [cardData$]=\"cardData$\"\n                    (cardClicked)=\"onCardSelected($event)\"\n                    (dataStateChanged)=\"onDataStateChanged($event)\">\n    <ng-template #headerActions>\n      <kit-button [label]=\"'kit.usersSettings.details.createNewUser' | translate\"\n                  [icon]=\"kitSvgIcon.PLUS\"\n                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"isCreatingNewUser.set(true)\" />\n    </ng-template>\n\n    <ng-template #cardElement\n                 let-user>\n      <div class=\"kit-users-settings-card-row\">\n        <kit-truncate-text class=\"kit-users-settings-card\">{{ getUserDisplayName(user) }}</kit-truncate-text>\n        <kit-button [icon]=\"kitSvgIcon.TRASH\"\n                    [kind]=\"kitButtonKind.SMALL\"\n                    [type]=\"kitButtonType.TEXT\"\n                    [iconType]=\"kitSvgIconType.STROKE\"\n                    [disabled]=\"isDeleteDisabled(user.id)\"\n                    (clicked)=\"onDeleteUser(user)\" />\n      </div>\n    </ng-template>\n\n    <ng-template #details\n                 let-activeId>\n      <kit-users-settings-profile [showIdentityType]=\"showIdentityType()\"\n                                  (saveClicked)=\"saveClicked.emit()\">\n        <ng-content select=\"[extended-entitlements]\" />\n      </kit-users-settings-profile>\n    </ng-template>\n  </kit-card-details>\n\n  <kit-users-settings-create-dialog [(opened)]=\"isCreatingNewUser\" />\n\n  <ng-template #deleteDialogActions>\n    <div class=\"kit-users-settings-delete-dialog-actions\">\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.cancel' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  [type]=\"kitButtonType.GHOST\"\n                  (clicked)=\"closeDeleteDialog()\" />\n      <kit-button [label]=\"'kit.usersSettings.deleteDialog.confirm' | translate\"\n                  [kind]=\"kitButtonKind.MEDIUM\"\n                  (clicked)=\"confirmDeleteUser()\" />\n    </div>\n  </ng-template>\n</div>\n", styles: [".kit-users-settings-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.kit-users-settings-card{margin:10px 0;min-width:0}::ng-deep .kit-users-settings-delete-dialog-actions{display:flex;justify-content:space-between}\n"] }]
+        }], propDecorators: { cardDetailsComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitCardDetailsComponent), { isSignal: true }] }], deleteDialogActionsTemplate: [{ type: i0.ViewChild, args: ['deleteDialogActions', { ...{ read: TemplateRef }, isSignal: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], showIdentityType: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIdentityType", required: false }] }], saveClicked: [{ type: i0.Output, args: ["saveClicked"] }] } });
 
 var KitThemes;
 (function (KitThemes) {
@@ -8613,9 +9215,7 @@ const kitTranslations = {
                     email: 'Email',
                     forcePassword: 'Force Password Reset',
                     mfa: 'Multi-Factor Authentication',
-                    save: 'Save',
                     createNewUser: 'Create New User',
-                    changePassword: 'Change Password',
                     password: 'Password',
                     passwordRequired: 'Password is required',
                     passwordTooWeak: 'Your password is too weak.',
@@ -8643,6 +9243,29 @@ const kitTranslations = {
                     confirm: 'Delete',
                     cancel: 'Cancel',
                 },
+                profile: {
+                    createEntitlement: 'Create Entitlement',
+                    save: 'Save',
+                    changePassword: 'Change Password',
+                    delete: 'Delete',
+                    tabs: {
+                        details: 'User Details',
+                        entitlements: 'User Entitlements',
+                    },
+                },
+                entitlements: {
+                    identityType: 'Identity Type',
+                    partners: 'Partners',
+                    alias: 'Alias',
+                    roles: 'Roles',
+                    updateSuccess: 'Entitlement updated successfully',
+                    deleteDialog: {
+                        title: 'Delete Entitlement',
+                        content: 'Are you sure you want to permanently delete this entitlement?',
+                        confirm: 'Delete',
+                        cancel: 'Cancel',
+                    },
+                },
             },
             globalSearch: {
                 placeholder: 'Global Search',
@@ -8682,6 +9305,7 @@ const kitTranslations = {
                 loading: 'Loading...',
                 error: 'An error occurred while loading data',
                 loadMore: 'Load More',
+                selectValue: 'Select value',
             },
             notFound: {
                 title: '404',
@@ -8814,9 +9438,7 @@ const kitTranslations = {
                     email: 'Email',
                     forcePassword: 'Принудительно изменить пароль',
                     mfa: 'Многофакторная аутентификация',
-                    save: 'Сохранить',
                     createNewUser: 'Создать нового пользователя',
-                    changePassword: 'Изменить пароль',
                     password: 'Пароль',
                     passwordRequired: 'Пароль обязателен',
                     passwordTooWeak: 'Пароль слишком слабый.',
@@ -8844,6 +9466,29 @@ const kitTranslations = {
                     confirm: 'Удалить',
                     cancel: 'Отмена',
                 },
+                profile: {
+                    createEntitlement: 'Создать право доступа',
+                    save: 'Сохранить',
+                    changePassword: 'Изменить пароль',
+                    delete: 'Удалить',
+                    tabs: {
+                        details: 'Детали пользователя',
+                        entitlements: 'Права доступа пользователя',
+                    },
+                },
+                entitlements: {
+                    identityType: 'Тип удостоверения',
+                    partners: 'Партнеры',
+                    alias: 'Псевдоним',
+                    roles: 'Роли',
+                    updateSuccess: 'Право доступа успешно обновлено',
+                    deleteDialog: {
+                        title: 'Удалить право доступа',
+                        content: 'Вы уверены, что хотите безвозвратно удалить это право доступа?',
+                        confirm: 'Удалить',
+                        cancel: 'Отмена',
+                    },
+                },
             },
             globalSearch: {
                 placeholder: 'Глобальный поиск',
@@ -8883,6 +9528,7 @@ const kitTranslations = {
                 loading: 'Загрузка...',
                 error: 'Произошла ошибка при загрузке данных',
                 loadMore: 'Загрузить еще',
+                selectValue: 'Выберите значение',
             },
             notFound: {
                 title: '404',
@@ -12990,5 +13636,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractKitCtaPanelConfirmationComponent, AddGridFilter, FetchApiTokens, FetchUser, FetchUserIdentities, FetchUserPermissions, FetchUserSettings, HighlightPipe, KIT_API_TOKENS_STATE_TOKEN, KIT_BASE_PATH, KIT_DATETIME_FORMAT_LONG, KIT_DATE_FORMAT, KIT_DATE_FORMAT_SHORT, KIT_GRID_CELL_DATE_FORMAT_CONFIG, KIT_GRID_COLUMN_WIDTH, KIT_GRID_PAGE_SIZE, KIT_GRID_STATE_TOKEN, KIT_TIME_FORMAT_SHORT, KIT_USERS_SETTINGS_STATE_TOKEN, KIT_USER_APPLICATIONS_PATH, KIT_USER_IDENTITIES_STATE_TOKEN, KIT_USER_PATH, KIT_USER_PERMISSIONS_PATH, KIT_USER_PERMISSIONS_STATE_TOKEN, KIT_USER_STATE_TOKEN, KitAbstractIdPayloadAction, KitAbstractPayloadAction, KitAccountService, KitApiTokenMaintenanceListComponent, KitApiTokenMaintenanceListState, KitApiTokensPermissionCategories, KitAutocompleteComponent, KitAutocompleteDirective, KitAvatarComponent, KitAvatarSize, KitBackButtonComponent, KitBadgeDirective, KitBadgeTheme, KitBreadcrumbsComponent, KitBreadcrumbsService, KitButtonComponent, KitButtonIconPosition, KitButtonKind, KitButtonState, KitButtonType, KitCardComponent, KitCardDetailsComponent, KitCardTheme, KitCheckboxComponent, KitCheckboxState, KitClipboardService, KitCollapsedListComponent, KitCollapsedListDropdownAlign, KitCopyTextComponent, KitCtaPanelAbstractConfirmationComponent, KitCtaPanelActionComponent, KitCtaPanelConfirmationComponent, KitCtaPanelItemComponent, KitCtaPanelItemType, KitDataFieldComponent, KitDataFieldState, KitDateRangeSingleInput, KitDatepickerComponent, KitDatepickerSize, KitDaterangeComponent, KitDaterangeType, KitDatetimepickerComponent, KitDeferredFailedRequestService, KitDialogActionsComponent, KitDialogComponent, KitDialogService, KitDialogTitlebarComponent, KitDialogType, KitDrawerComponent, KitDrawerContentTemplateDirective, KitDrawerFooterTemplateDirective, KitDrawerMode, KitDropdownComponent, KitDropdownItemTemplateDirective, KitDropdownSize, KitEmptySectionComponent, KitEntityGridComponent, KitEntitySectionComponent, KitEntitySectionContainerComponent, KitEntitySectionEditableActionsTemplateDirective, KitEntitySectionEditableComponent, KitEntitySectionEditableEditTemplateDirective, KitEntitySectionEditableMode, KitEntitySectionEditableViewTemplateDirective, KitEntityTitleComponent, KitExcelExportService, KitExpansionPanelComponent, KitExpansionPanelHeaderTemplateDirective, KitExpansionPanelToggleMode, KitFileCardComponent, KitFileCardMessagesComponent, KitFileUploadComponent, KitFilterCheckboxComponent, KitFilterDateRange, KitFilterLogic, KitFilterOperator, KitFilterType, KitForbiddenComponent, KitFormErrors, KitFormFieldComponent, KitFormLabelComponent, KitFormMessageComponent, KitGlobalSearchComponent, KitGridActionComponent, KitGridArchiveToggle, KitGridCellComponent, KitGridCellService, KitGridCellTemplateDirective, KitGridColumnComponent, KitGridColumnManagerComponent, KitGridComponent, KitGridDetailTemplateDirective, KitGridDetailsButtonComponent, KitGridExportComponent, KitGridFiltersComponent, KitGridLiveUpdatesControlComponent, KitGridSearchComponent, KitGridSortSettingsMode, KitGridState, KitGridUrlStateService, KitGridViewType, KitGridViewsComponent, KitGridViewsState, KitListComponent, KitLoaderComponent, KitLocationStepperComponent, KitLocationStepperIconTheme, KitLocationStepperTheme, KitMobileHeaderComponent, KitMobileMenuComponent, KitMobileMenuState, KitMultiselectComponent, KitMultiselectGroupTagTemplateDirective, KitMultiselectItemsDirection, KitMultiselectSize, KitNavigationMenuComponent, KitNavigationMenuService, KitNavigationMenuSubmenuComponent, KitNavigationTabsComponent, KitNavigationTabsType, KitNotFoundComponent, KitNoteComponent, KitNotificationComponent, KitNotificationService, KitNotificationType, KitNumericTextboxComponent, KitNumericTextboxSize, KitNumericTextboxState, KitOptionToggleComponent, KitOptionToggleSize, KitPageLayoutComponent, KitPermissionDirective, KitPillComponent, KitPillTheme, KitPillType, KitPopoverAnchorDirective, KitPopoverComponent, KitPopoverPosition, KitPopoverShowOption, KitPopupAlignHorizontal, KitPopupAlignVertical, KitPopupComponent, KitPopupPositionMode, KitProfileMenuComponent, KitQueryParamsName, KitQueryParamsService, KitRadioButtonComponent, KitRadioButtonType, KitRoutePathComponent, KitSchedulerAgendaTimeTemplateDirective, KitSchedulerComponent, KitSchedulerCustomViewTemplateDirective, KitSchedulerMonthEventTemplateDirective, KitSchedulerMonthHeaderCellTemplateDirective, KitSchedulerToolbarTemplateDirective, KitSchedulerWeekEventTemplateDirective, KitScrollNavigationComponent, KitScrollNavigationSectionComponent, KitSearchBarComponent, KitSidebarComponent, KitSkeletonAnimation, KitSkeletonComponent, KitSkeletonGridComponent, KitSkeletonSectionComponent, KitSkeletonShape, KitSortDirection, KitSortableComponent, KitSplitContainerComponent, KitStatusLabelColor, KitStatusLabelComponent, KitStatusLabelSize, KitSvgIcon, KitSvgIconComponent, KitSvgIconType, KitSvgSpriteComponent, KitSwitchComponent, KitSwitchMode, KitSwitchState, KitTabComponent, KitTabContentDirective, KitTabsComponent, KitTabsSize, KitTabsType, KitTextLabelComponent, KitTextLabelState, KitTextareaAutoresizeDirective, KitTextareaComponent, KitTextareaState, KitTextboxActionsComponent, KitTextboxComponent, KitTextboxSize, KitTextboxState, KitThemeService, KitThemes, KitTileLayoutComponent, KitTileLayoutItemComponent, KitTimelineCardComponent, KitTimelineComponent, KitTimelineTheme, KitTimelineType, KitTimepickerComponent, KitTitleTemplateDirective, KitToastrModule, KitToastrPosition, KitToastrService, KitToastrType, KitToggleComponent, KitToggleSize, KitTooltipDirective, KitTooltipPosition, KitTopBarComponent, KitTrackingCardComponent, KitTrackingTimelineComponent, KitTranslateLoader, KitTranslateService, KitTruncateTextComponent, KitUnitsTextboxComponent, KitUnitsTextboxDropdownPosition, KitUnitsTextboxType, KitUserApplicationsState, KitUserIdentitiesInterceptor, KitUserIdentitiesSelector, KitUserIdentitiesState, KitUserPermissionsState, KitUserSettingsComponent, KitUserSettingsKeys, KitUserSettingsState, KitUserState, KitUserType, KitUsersSettingsComponent, KitUsersSettingsDetailsField, KitUsersSettingsService, KitUsersSettingsState, RemoveGridFilter, SetGridColumns, SetGridFilters, SetGridSearch, SetGridSkip, SetGridSort, SetGridTake, SetUserIdentity, UpdateGridFilter, buildRandomUUID, changeFilterField, createDataFetcherFactory, findMatches, isKitFilterDescriptor, kitApiResponseDefaultEntities, kitApiTokenMaintenanceConfig, kitApiTokenMaintenanceRoutes, kitBuildFilterBooleanOptions, kitBuildFilterListOptions, kitBuildFilters, kitBuildGridColumn, kitBuildGridDataResults, kitBuildHttpParams, kitBuildOdataFilter, kitBuildSortString, kitDataStateToODataString, kitEncodeViewNameToUrl, kitFetchExportGridData, kitFetchGridData, kitFilterBy, kitFormatStringForSearch, kitGetPermissionTypesByCategory, kitHasPermission, kitNormalizeDateToUtc, kitShouldResetGridState, kitTranslations, kitUserPermissionsGuard, kitWhitespaceValidator, mapGlobalSearchResult, trimTrailingSlash };
+export { AbstractKitCtaPanelConfirmationComponent, AddGridFilter, FetchApiTokens, FetchUser, FetchUserIdentities, FetchUserPermissions, FetchUserSettings, HighlightPipe, KIT_API_TOKENS_STATE_TOKEN, KIT_BASE_PATH, KIT_DATETIME_FORMAT_LONG, KIT_DATE_FORMAT, KIT_DATE_FORMAT_SHORT, KIT_GRID_CELL_DATE_FORMAT_CONFIG, KIT_GRID_COLUMN_WIDTH, KIT_GRID_PAGE_SIZE, KIT_GRID_STATE_TOKEN, KIT_TIME_FORMAT_SHORT, KIT_USER_APPLICATIONS_PATH, KIT_USER_IDENTITIES_STATE_TOKEN, KIT_USER_PATH, KIT_USER_PERMISSIONS_PATH, KIT_USER_PERMISSIONS_STATE_TOKEN, KIT_USER_STATE_TOKEN, KitAbstractIdPayloadAction, KitAbstractPayloadAction, KitAccountService, KitApiTokenMaintenanceListComponent, KitApiTokenMaintenanceListState, KitApiTokensPermissionCategories, KitAutocompleteComponent, KitAutocompleteDirective, KitAvatarComponent, KitAvatarSize, KitBackButtonComponent, KitBadgeDirective, KitBadgeTheme, KitBreadcrumbsComponent, KitBreadcrumbsService, KitButtonComponent, KitButtonIconPosition, KitButtonKind, KitButtonState, KitButtonType, KitCardComponent, KitCardDetailsComponent, KitCardTheme, KitCheckboxComponent, KitCheckboxState, KitClipboardService, KitCollapsedListComponent, KitCollapsedListDropdownAlign, KitCopyTextComponent, KitCtaPanelAbstractConfirmationComponent, KitCtaPanelActionComponent, KitCtaPanelConfirmationComponent, KitCtaPanelItemComponent, KitCtaPanelItemType, KitDataFieldComponent, KitDataFieldState, KitDateRangeSingleInput, KitDatepickerComponent, KitDatepickerSize, KitDaterangeComponent, KitDaterangeType, KitDatetimepickerComponent, KitDeferredFailedRequestService, KitDialogActionsComponent, KitDialogComponent, KitDialogService, KitDialogTitlebarComponent, KitDialogType, KitDrawerComponent, KitDrawerContentTemplateDirective, KitDrawerFooterTemplateDirective, KitDrawerMode, KitDropdownComponent, KitDropdownItemTemplateDirective, KitDropdownSize, KitEmptySectionComponent, KitEntityGridComponent, KitEntitySectionComponent, KitEntitySectionContainerComponent, KitEntitySectionEditableActionsTemplateDirective, KitEntitySectionEditableComponent, KitEntitySectionEditableEditTemplateDirective, KitEntitySectionEditableMode, KitEntitySectionEditableViewTemplateDirective, KitEntityTitleComponent, KitExcelExportService, KitExpansionPanelComponent, KitExpansionPanelHeaderTemplateDirective, KitExpansionPanelToggleMode, KitFileCardComponent, KitFileCardMessagesComponent, KitFileCardSize, KitFileUploadComponent, KitFilterCheckboxComponent, KitFilterDateRange, KitFilterLogic, KitFilterOperator, KitFilterType, KitForbiddenComponent, KitFormErrors, KitFormFieldComponent, KitFormLabelComponent, KitFormMessageComponent, KitGlobalSearchComponent, KitGridActionComponent, KitGridArchiveToggle, KitGridCellComponent, KitGridCellService, KitGridCellTemplateDirective, KitGridColumnComponent, KitGridColumnManagerComponent, KitGridComponent, KitGridDetailTemplateDirective, KitGridDetailsButtonComponent, KitGridExportComponent, KitGridFiltersComponent, KitGridLiveUpdatesControlComponent, KitGridSearchComponent, KitGridSortSettingsMode, KitGridState, KitGridUrlStateService, KitGridViewType, KitGridViewsComponent, KitGridViewsState, KitListComponent, KitLoaderComponent, KitLocationStepperComponent, KitLocationStepperIconTheme, KitLocationStepperTheme, KitMobileHeaderComponent, KitMobileMenuComponent, KitMobileMenuState, KitMultiselectComponent, KitMultiselectGroupTagTemplateDirective, KitMultiselectItemsDirection, KitMultiselectSize, KitNavigationMenuComponent, KitNavigationMenuService, KitNavigationMenuSubmenuComponent, KitNavigationTabsComponent, KitNavigationTabsType, KitNotFoundComponent, KitNoteComponent, KitNotificationComponent, KitNotificationService, KitNotificationType, KitNumericTextboxComponent, KitNumericTextboxSize, KitNumericTextboxState, KitOptionToggleComponent, KitOptionToggleSize, KitPageLayoutComponent, KitPermissionDirective, KitPillComponent, KitPillTheme, KitPillType, KitPopoverAnchorDirective, KitPopoverComponent, KitPopoverPosition, KitPopoverShowOption, KitPopupAlignHorizontal, KitPopupAlignVertical, KitPopupComponent, KitPopupPositionMode, KitProfileMenuComponent, KitQueryParamsName, KitQueryParamsService, KitRadioButtonComponent, KitRadioButtonType, KitRoutePathComponent, KitSchedulerAgendaTimeTemplateDirective, KitSchedulerComponent, KitSchedulerCustomViewTemplateDirective, KitSchedulerMonthEventTemplateDirective, KitSchedulerMonthHeaderCellTemplateDirective, KitSchedulerToolbarTemplateDirective, KitSchedulerWeekEventTemplateDirective, KitScrollNavigationComponent, KitScrollNavigationSectionComponent, KitSearchBarComponent, KitSidebarComponent, KitSkeletonAnimation, KitSkeletonComponent, KitSkeletonGridComponent, KitSkeletonSectionComponent, KitSkeletonShape, KitSortDirection, KitSortableComponent, KitSplitContainerComponent, KitStatusLabelColor, KitStatusLabelComponent, KitStatusLabelSize, KitSvgIcon, KitSvgIconComponent, KitSvgIconType, KitSvgSpriteComponent, KitSwitchComponent, KitSwitchMode, KitSwitchState, KitTabComponent, KitTabContentDirective, KitTabsComponent, KitTabsSize, KitTabsType, KitTextLabelComponent, KitTextLabelState, KitTextareaAutoresizeDirective, KitTextareaComponent, KitTextareaState, KitTextboxActionsComponent, KitTextboxComponent, KitTextboxSize, KitTextboxState, KitThemeService, KitThemes, KitTileLayoutComponent, KitTileLayoutItemComponent, KitTimelineCardComponent, KitTimelineComponent, KitTimelineTheme, KitTimelineType, KitTimepickerComponent, KitTitleTemplateDirective, KitToastrModule, KitToastrPosition, KitToastrService, KitToastrType, KitToggleComponent, KitToggleSize, KitTooltipDirective, KitTooltipPosition, KitTopBarComponent, KitTrackingCardComponent, KitTrackingTimelineComponent, KitTranslateLoader, KitTranslateService, KitTruncateTextComponent, KitUnitsTextboxComponent, KitUnitsTextboxDropdownPosition, KitUnitsTextboxType, KitUserApplicationsState, KitUserIdentitiesInterceptor, KitUserIdentitiesSelector, KitUserIdentitiesState, KitUserPermissionsState, KitUserSettingsComponent, KitUserSettingsKeys, KitUserSettingsState, KitUserState, KitUserType, KitUsersSettingsComponent, KitUsersSettingsEntitlementsService, KitUsersSettingsEntitlementsState, KitUsersSettingsReferenceService, KitUsersSettingsService, KitUsersSettingsState, RemoveGridFilter, SetGridColumns, SetGridFilters, SetGridSearch, SetGridSkip, SetGridSort, SetGridTake, SetUserIdentity, UpdateGridFilter, buildRandomUUID, changeFilterField, createDataFetcherFactory, findMatches, isKitFilterDescriptor, kitApiResponseDefaultEntities, kitApiTokenMaintenanceConfig, kitApiTokenMaintenanceRoutes, kitBuildFilterBooleanOptions, kitBuildFilterListOptions, kitBuildFilters, kitBuildGridColumn, kitBuildGridDataResults, kitBuildHttpParams, kitBuildOdataFilter, kitBuildSortString, kitDataStateToODataString, kitEncodeViewNameToUrl, kitFetchExportGridData, kitFetchGridData, kitFilterBy, kitFormatStringForSearch, kitGetPermissionTypesByCategory, kitHasPermission, kitNormalizeDateToUtc, kitShouldResetGridState, kitTranslations, kitUserPermissionsGuard, kitWhitespaceValidator, mapGlobalSearchResult, trimTrailingSlash };
 //# sourceMappingURL=indigina-ui-kit.mjs.map