herum-shared 0.1.65-amit-beta.2 → 0.1.65-amit-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/atoms/index.d.ts +2 -1
- package/fesm2022/herum-shared-atoms.mjs +8 -5
- package/fesm2022/herum-shared-atoms.mjs.map +1 -1
- package/fesm2022/herum-shared-molecules.mjs +1 -1
- package/fesm2022/herum-shared-molecules.mjs.map +1 -1
- package/fesm2022/herum-shared.mjs +9 -6
- package/fesm2022/herum-shared.mjs.map +1 -1
- package/index.d.ts +4 -3
- package/molecules/index.d.ts +1 -1
- package/package.json +1 -1
package/atoms/index.d.ts
CHANGED
|
@@ -110,6 +110,7 @@ declare class HerumChipComponent {
|
|
|
110
110
|
isActive: boolean;
|
|
111
111
|
isMenuMode: boolean;
|
|
112
112
|
type: 'positive' | 'negative' | 'regular';
|
|
113
|
+
size: 'responsive' | 'one-line';
|
|
113
114
|
remove: EventEmitter<boolean>;
|
|
114
115
|
chipsActivation: EventEmitter<boolean>;
|
|
115
116
|
_onRemove(): void;
|
|
@@ -117,7 +118,7 @@ declare class HerumChipComponent {
|
|
|
117
118
|
get splittedTitle(): string;
|
|
118
119
|
get isTitleToBeSplitted(): boolean;
|
|
119
120
|
static ɵfac: i0.ɵɵFactoryDeclaration<HerumChipComponent, never>;
|
|
120
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<HerumChipComponent, "herum-chip", never, { "title": { "alias": "title"; "required": false; }; "isDeleteButtonNeeded": { "alias": "isDeleteButtonNeeded"; "required": false; }; "isActive": { "alias": "isActive"; "required": false; }; "isMenuMode": { "alias": "isMenuMode"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "remove": "remove"; "chipsActivation": "chipsActivation"; }, never, never, false, never>;
|
|
121
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<HerumChipComponent, "herum-chip", never, { "title": { "alias": "title"; "required": false; }; "isDeleteButtonNeeded": { "alias": "isDeleteButtonNeeded"; "required": false; }; "isActive": { "alias": "isActive"; "required": false; }; "isMenuMode": { "alias": "isMenuMode"; "required": false; }; "type": { "alias": "type"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "remove": "remove"; "chipsActivation": "chipsActivation"; }, never, never, false, never>;
|
|
121
122
|
}
|
|
122
123
|
|
|
123
124
|
declare class HerumCircularProgressBarComponent {
|
|
@@ -222,6 +222,7 @@ class HerumChipComponent {
|
|
|
222
222
|
isActive = false;
|
|
223
223
|
isMenuMode = false;
|
|
224
224
|
type = 'regular';
|
|
225
|
+
size = 'responsive';
|
|
225
226
|
remove = new EventEmitter();
|
|
226
227
|
chipsActivation = new EventEmitter();
|
|
227
228
|
_onRemove() {
|
|
@@ -255,11 +256,11 @@ class HerumChipComponent {
|
|
|
255
256
|
return this.title?.includes(splitKey);
|
|
256
257
|
}
|
|
257
258
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
258
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumChipComponent, isStandalone: false, selector: "herum-chip", inputs: { title: "title", isDeleteButtonNeeded: "isDeleteButtonNeeded", isActive: "isActive", isMenuMode: "isMenuMode", type: "type" }, outputs: { remove: "remove", chipsActivation: "chipsActivation" }, ngImport: i0, template: "<div class=\"herum-chip-container\" [
|
|
259
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumChipComponent, isStandalone: false, selector: "herum-chip", inputs: { title: "title", isDeleteButtonNeeded: "isDeleteButtonNeeded", isActive: "isActive", isMenuMode: "isMenuMode", type: "type", size: "size" }, outputs: { remove: "remove", chipsActivation: "chipsActivation" }, ngImport: i0, template: "<div class=\"herum-chip-container\" [ngClass]=\"[type, size, isActive ? 'active' : '', isMenuMode ? 'menu-chip' : '']\"\r\n (click)=\"_onChipsSelect()\" dir=\"rtl\">\r\n\r\n <ng-container *ngIf=\"isTitleToBeSplitted; else defaultTitle\">\r\n <span [innerHTML]=\"splittedTitle | safeHtml\"></span>\r\n </ng-container>\r\n\r\n <ng-template #defaultTitle>{{title}}</ng-template>\r\n\r\n <img *ngIf=\"isDeleteButtonNeeded\" src=\"../../assets/general/secondary-x.svg\" (click)=\"_onRemove()\">\r\n</div>", styles: [".herum-chip-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:center;width:fit-content;gap:5px;padding:0 5px;background-color:transparent;color:var(--secondary-color);border:1px solid var(--secondary-color);border-radius:32px;box-shadow:0 0 6px #61606029}.herum-chip-container.one-line{flex-wrap:nowrap;white-space:nowrap}.herum-chip-container:hover{background-color:var(--hover-background)}.active{background-color:var(--secondary-color);color:#fff}.active:hover{background-color:var(--darker-secondary-color);color:#fff}.positive,.negative{color:var(--icons-color);border:1px solid var(--icons-color)}.menu-chip{cursor:pointer;font-size:12px;height:24px;text-align:center;justify-content:center;display:flex;padding:0 7px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: i4.SafeHtmlPipe, name: "safeHtml" }] });
|
|
259
260
|
}
|
|
260
261
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumChipComponent, decorators: [{
|
|
261
262
|
type: Component,
|
|
262
|
-
args: [{ standalone: false, selector: 'herum-chip', template: "<div class=\"herum-chip-container\" [
|
|
263
|
+
args: [{ standalone: false, selector: 'herum-chip', template: "<div class=\"herum-chip-container\" [ngClass]=\"[type, size, isActive ? 'active' : '', isMenuMode ? 'menu-chip' : '']\"\r\n (click)=\"_onChipsSelect()\" dir=\"rtl\">\r\n\r\n <ng-container *ngIf=\"isTitleToBeSplitted; else defaultTitle\">\r\n <span [innerHTML]=\"splittedTitle | safeHtml\"></span>\r\n </ng-container>\r\n\r\n <ng-template #defaultTitle>{{title}}</ng-template>\r\n\r\n <img *ngIf=\"isDeleteButtonNeeded\" src=\"../../assets/general/secondary-x.svg\" (click)=\"_onRemove()\">\r\n</div>", styles: [".herum-chip-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:center;width:fit-content;gap:5px;padding:0 5px;background-color:transparent;color:var(--secondary-color);border:1px solid var(--secondary-color);border-radius:32px;box-shadow:0 0 6px #61606029}.herum-chip-container.one-line{flex-wrap:nowrap;white-space:nowrap}.herum-chip-container:hover{background-color:var(--hover-background)}.active{background-color:var(--secondary-color);color:#fff}.active:hover{background-color:var(--darker-secondary-color);color:#fff}.positive,.negative{color:var(--icons-color);border:1px solid var(--icons-color)}.menu-chip{cursor:pointer;font-size:12px;height:24px;text-align:center;justify-content:center;display:flex;padding:0 7px}\n"] }]
|
|
263
264
|
}], propDecorators: { title: [{
|
|
264
265
|
type: Input
|
|
265
266
|
}], isDeleteButtonNeeded: [{
|
|
@@ -270,6 +271,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
|
|
|
270
271
|
type: Input
|
|
271
272
|
}], type: [{
|
|
272
273
|
type: Input
|
|
274
|
+
}], size: [{
|
|
275
|
+
type: Input
|
|
273
276
|
}], remove: [{
|
|
274
277
|
type: Output
|
|
275
278
|
}], chipsActivation: [{
|
|
@@ -1069,7 +1072,7 @@ class HerumMultiSelectComponent {
|
|
|
1069
1072
|
this.destroySubject$.complete();
|
|
1070
1073
|
}
|
|
1071
1074
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumMultiSelectComponent, isStandalone: false, selector: "herum-multi-select", inputs: { placeholder: "placeholder", options: "options", titledOptionsList: "titledOptionsList", recursiveTitledOption: "recursiveTitledOption", selectedOptionsInput: "selectedOptionsInput", maxChips: "maxChips", disabled: "disabled", size: "size", isDropDownInPositionFixed: "isDropDownInPositionFixed", dropDownDirection: "dropDownDirection", isMultiHeads: "isMultiHeads" }, outputs: { selectedOptions: "selectedOptions", selectedRecursiveOptions: "selectedRecursiveOptions" }, host: { listeners: { "window:click": "onClick($event)" } }, providers: [CUSTOM_MULTI_SELECT_CONTROL_VALUE_ACCESSOR], viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }, { propertyName: "dropContainer", first: true, predicate: ["dropContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #dropContainer class=\"dropdown\" dir=\"rtl\" [ngClass]=\"{'w-100': size === 'responsive'}\">\r\n <button class=\"drop-button internal\" [class]=\"size\"\r\n [ngClass]=\"(isDropdownOpen ? 'open-drop-button-' + dropDownDirection : '')\" (click)=\"toggleDropdown()\">\r\n <span class=\"button-placeholder internal\" *ngIf=\"!selectedOptionsValue?.length\">{{placeholder}}</span>\r\n\r\n <div class=\"herum-chips-container\">\r\n <herum-chip *ngFor=\"let option of getLimitedList()\" [title]=\"option.name\"\r\n (remove)=\"removeSelectedOption(option)\"></herum-chip>\r\n\r\n <ng-container *ngIf=\"selectedOptionsValue && selectedOptionsValue.length > maxChips\">\r\n <herum-chip class=\"last-chip\" [matTooltip]=\"_getHiddenOptions()\"\r\n [title]=\"(selectedOptionsValue.length - maxChips) + '+'\" [isDeleteButtonNeeded]=\"false\">\r\n </herum-chip>\r\n </ng-container>\r\n </div>\r\n\r\n <span class=\"shevron-icon internal\" [ngClass]=\"{'rotate-chevron': isDropdownOpen}\">\r\n <svg class=\"internal\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11.299\" height=\"6.649\" viewBox=\"0 0 11.299 6.649\">\r\n <path id=\"Vector_43-2\" data-name=\"Vector 43-2\" d=\"M1006.235,549.5,1002,553.735l-4.236-4.235\"\r\n transform=\"translate(-996.35 -548.086)\" fill=\"none\" stroke=\"var(--icons-color)\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" />\r\n </svg>\r\n </span>\r\n </button>\r\n\r\n <div id=\"myDropdown\" class=\"internal\" [ngClass]=\"dropdownClasses\" [@openClose]=\"_getDropdownStates\">\r\n <herum-input-field #filterInput *ngIf=\"optionsLength>2\" class=\"input-filter\" [type]=\"'search'\"\r\n [placeholder]=\"'\u05D7\u05E4\u05E9/\u05D9 \u05E2\u05E8\u05DA \u05DE\u05D1\u05D5\u05E7\u05E9...'\" (click)=\"_onStopPropagation($event)\"\r\n (inputValueEmitter)=\"_onFilterDropDown($event)\"></herum-input-field>\r\n\r\n <ng-container *ngIf=\"options\">\r\n <herum-options-list [options]=\"filteredOptions\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\">\r\n </herum-options-list>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"titledOptionsList\">\r\n <ng-container *ngFor=\"let filteredTitledOptions of filteredTitledOptionsList\">\r\n <herum-expendable-panel [title]=\"filteredTitledOptions.title\" [isBoldTitle]=\"true\">\r\n <herum-options-list [options]=\"filteredTitledOptions.options\"\r\n [isContentInsideExpendablePanel]=\"true\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\"></herum-options-list>\r\n </herum-expendable-panel>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"recursiveTitledOption\">\r\n <ng-container *ngIf=\"isMultiHeads\">\r\n <herum-recursive-hierarchy-options-list *ngFor=\"let treeHead of recursiveTitledOption\"\r\n [recursiveTitledOption]=\"treeHead\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\"\r\n (selectedRecursiveOptionsEmitter)=\"_selectRecursive($event)\">\r\n </herum-recursive-hierarchy-options-list>\r\n </ng-container>\r\n\r\n <herum-recursive-hierarchy-options-list *ngIf=\"!isMultiHeads\"\r\n [recursiveTitledOption]=\"recursiveTitledOption\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\">\r\n </herum-recursive-hierarchy-options-list>\r\n </ng-container>\r\n\r\n <a class=\"text-center\" *ngIf=\"hasNoResults()\">\u05DC\u05D0 \u05E0\u05DE\u05E6\u05D0\u05D5 \u05EA\u05D5\u05E6\u05D0\u05D5\u05EA</a>\r\n </div>\r\n</div>", styles: [".drop-button{gap:8px}.button-placeholder{color:var(--disabled-text-color)}.last-chip{margin-inline-end:20px}.herum-chips-container{display:flex;gap:8px}.big-scroll-view{overflow-y:auto;max-height:600px}\n", ".drop-button{display:flex;background-color:var(--light-background-color);color:var(--disabled-text-color);border:none;cursor:pointer;border-radius:var(--border-radius);box-shadow:0 0 var(--box-shadow-blur) #00000029!important;text-align:right;font-size:var(--standard-font-size);align-items:center;justify-content:space-between}.responsive,.responsive-dropdown{width:100%}.default,.big,.default-dropdown,.big-dropdown{min-width:300px}.responsive,.default,.big{padding:16px}.responsive,.default{height:var(--atom-input-height)}.big{height:42px}.fit,.fit-dropdown{min-width:180px}.min,.min-dropdown{min-width:95px}.fit,.min{padding:8px}.drop-button:hover,.drop-button:focus{outline:1px solid var(--icons-color-light-2)}.dropdown{position:relative;display:inline-block}button{position:relative}::ng-deep .dropdown-content{position:absolute;background-color:#fff;box-shadow:0 1px 4px #0000002b;z-index:10;min-width:120px}.open-drop-button-downwards,.open-drop-button-upwards{box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.open-drop-button-downwards{border-radius:var(--border-radius) var(--border-radius) 0 0}.open-drop-button-upwards{border-radius:0 0 var(--border-radius) var(--border-radius)}.dropdown-downwards{border-top:1px solid var(--chips-divider-color);border-radius:0 0 var(--border-radius) var(--border-radius)}.dropdown-upwards{border-bottom:1px solid var(--chips-divider-color);border-radius:var(--border-radius) var(--border-radius) 0 0;top:0}.dropdown-content a{color:#000;padding:6px 16px;text-decoration:none;display:block;font-size:var(--standard-font-size)}.dropdown a:hover{background-color:var(--hover-background);cursor:pointer}.shevron-icon{cursor:pointer;color:var(--icons-color)!important;transition:transform .3s ease}.selected{color:var(--icons-color)!important;font-weight:bolder}.input-filter{height:36px;display:block}.scrollable-settings{max-height:164px;overflow-y:auto}.fixed{position:fixed}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: HerumChipComponent, selector: "herum-chip", inputs: ["title", "isDeleteButtonNeeded", "isActive", "isMenuMode", "type"], outputs: ["remove", "chipsActivation"] }, { kind: "component", type: HerumInputFieldComponent, selector: "herum-input-field", inputs: ["type", "placeholder", "disabled", "isBlocked", "isValid", "errorMsg", "showErrorMsgGap", "inputValue", "isLoading", "id", "debounceTime", "minValue", "maxValue", "isBlurred", "touched", "ltrMode", "preventMacroKeysPressEvent"], outputs: ["inputValueEmitter"] }, { kind: "component", type: HerumOptionsListComponent, selector: "herum-options-list", inputs: ["options", "selectedOptions", "isContentInsideExpendablePanel", "isInternalMode"], outputs: ["selectedOptionsEmitter"] }, { kind: "component", type: HerumRecursiveHierarchyOptionsListComponent, selector: "herum-recursive-hierarchy-options-list", inputs: ["options", "selectedOptions", "recursiveTitledOption"], outputs: ["selectedOptionsEmitter", "selectedRecursiveOptionsEmitter"] }], animations: [openClose] });
|
|
1075
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumMultiSelectComponent, isStandalone: false, selector: "herum-multi-select", inputs: { placeholder: "placeholder", options: "options", titledOptionsList: "titledOptionsList", recursiveTitledOption: "recursiveTitledOption", selectedOptionsInput: "selectedOptionsInput", maxChips: "maxChips", disabled: "disabled", size: "size", isDropDownInPositionFixed: "isDropDownInPositionFixed", dropDownDirection: "dropDownDirection", isMultiHeads: "isMultiHeads" }, outputs: { selectedOptions: "selectedOptions", selectedRecursiveOptions: "selectedRecursiveOptions" }, host: { listeners: { "window:click": "onClick($event)" } }, providers: [CUSTOM_MULTI_SELECT_CONTROL_VALUE_ACCESSOR], viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["filterInput"], descendants: true }, { propertyName: "dropContainer", first: true, predicate: ["dropContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #dropContainer class=\"dropdown\" dir=\"rtl\" [ngClass]=\"{'w-100': size === 'responsive'}\">\r\n <button class=\"drop-button internal\" [class]=\"size\"\r\n [ngClass]=\"(isDropdownOpen ? 'open-drop-button-' + dropDownDirection : '')\" (click)=\"toggleDropdown()\">\r\n <span class=\"button-placeholder internal\" *ngIf=\"!selectedOptionsValue?.length\">{{placeholder}}</span>\r\n\r\n <div class=\"herum-chips-container\">\r\n <herum-chip *ngFor=\"let option of getLimitedList()\" [title]=\"option.name\"\r\n (remove)=\"removeSelectedOption(option)\"></herum-chip>\r\n\r\n <ng-container *ngIf=\"selectedOptionsValue && selectedOptionsValue.length > maxChips\">\r\n <herum-chip class=\"last-chip\" [matTooltip]=\"_getHiddenOptions()\"\r\n [title]=\"(selectedOptionsValue.length - maxChips) + '+'\" [isDeleteButtonNeeded]=\"false\">\r\n </herum-chip>\r\n </ng-container>\r\n </div>\r\n\r\n <span class=\"shevron-icon internal\" [ngClass]=\"{'rotate-chevron': isDropdownOpen}\">\r\n <svg class=\"internal\" xmlns=\"http://www.w3.org/2000/svg\" width=\"11.299\" height=\"6.649\" viewBox=\"0 0 11.299 6.649\">\r\n <path id=\"Vector_43-2\" data-name=\"Vector 43-2\" d=\"M1006.235,549.5,1002,553.735l-4.236-4.235\"\r\n transform=\"translate(-996.35 -548.086)\" fill=\"none\" stroke=\"var(--icons-color)\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" />\r\n </svg>\r\n </span>\r\n </button>\r\n\r\n <div id=\"myDropdown\" class=\"internal\" [ngClass]=\"dropdownClasses\" [@openClose]=\"_getDropdownStates\">\r\n <herum-input-field #filterInput *ngIf=\"optionsLength>2\" class=\"input-filter\" [type]=\"'search'\"\r\n [placeholder]=\"'\u05D7\u05E4\u05E9/\u05D9 \u05E2\u05E8\u05DA \u05DE\u05D1\u05D5\u05E7\u05E9...'\" (click)=\"_onStopPropagation($event)\"\r\n (inputValueEmitter)=\"_onFilterDropDown($event)\"></herum-input-field>\r\n\r\n <ng-container *ngIf=\"options\">\r\n <herum-options-list [options]=\"filteredOptions\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\">\r\n </herum-options-list>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"titledOptionsList\">\r\n <ng-container *ngFor=\"let filteredTitledOptions of filteredTitledOptionsList\">\r\n <herum-expendable-panel [title]=\"filteredTitledOptions.title\" [isBoldTitle]=\"true\">\r\n <herum-options-list [options]=\"filteredTitledOptions.options\"\r\n [isContentInsideExpendablePanel]=\"true\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\"></herum-options-list>\r\n </herum-expendable-panel>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"recursiveTitledOption\">\r\n <ng-container *ngIf=\"isMultiHeads\">\r\n <herum-recursive-hierarchy-options-list *ngFor=\"let treeHead of recursiveTitledOption\"\r\n [recursiveTitledOption]=\"treeHead\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\"\r\n (selectedRecursiveOptionsEmitter)=\"_selectRecursive($event)\">\r\n </herum-recursive-hierarchy-options-list>\r\n </ng-container>\r\n\r\n <herum-recursive-hierarchy-options-list *ngIf=\"!isMultiHeads\"\r\n [recursiveTitledOption]=\"recursiveTitledOption\" [selectedOptions]=\"selectedOptionsValue\"\r\n (selectedOptionsEmitter)=\"_select($event)\">\r\n </herum-recursive-hierarchy-options-list>\r\n </ng-container>\r\n\r\n <a class=\"text-center\" *ngIf=\"hasNoResults()\">\u05DC\u05D0 \u05E0\u05DE\u05E6\u05D0\u05D5 \u05EA\u05D5\u05E6\u05D0\u05D5\u05EA</a>\r\n </div>\r\n</div>", styles: [".drop-button{gap:8px}.button-placeholder{color:var(--disabled-text-color)}.last-chip{margin-inline-end:20px}.herum-chips-container{display:flex;gap:8px}.big-scroll-view{overflow-y:auto;max-height:600px}\n", ".drop-button{display:flex;background-color:var(--light-background-color);color:var(--disabled-text-color);border:none;cursor:pointer;border-radius:var(--border-radius);box-shadow:0 0 var(--box-shadow-blur) #00000029!important;text-align:right;font-size:var(--standard-font-size);align-items:center;justify-content:space-between}.responsive,.responsive-dropdown{width:100%}.default,.big,.default-dropdown,.big-dropdown{min-width:300px}.responsive,.default,.big{padding:16px}.responsive,.default{height:var(--atom-input-height)}.big{height:42px}.fit,.fit-dropdown{min-width:180px}.min,.min-dropdown{min-width:95px}.fit,.min{padding:8px}.drop-button:hover,.drop-button:focus{outline:1px solid var(--icons-color-light-2)}.dropdown{position:relative;display:inline-block}button{position:relative}::ng-deep .dropdown-content{position:absolute;background-color:#fff;box-shadow:0 1px 4px #0000002b;z-index:10;min-width:120px}.open-drop-button-downwards,.open-drop-button-upwards{box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.open-drop-button-downwards{border-radius:var(--border-radius) var(--border-radius) 0 0}.open-drop-button-upwards{border-radius:0 0 var(--border-radius) var(--border-radius)}.dropdown-downwards{border-top:1px solid var(--chips-divider-color);border-radius:0 0 var(--border-radius) var(--border-radius)}.dropdown-upwards{border-bottom:1px solid var(--chips-divider-color);border-radius:var(--border-radius) var(--border-radius) 0 0;top:0}.dropdown-content a{color:#000;padding:6px 16px;text-decoration:none;display:block;font-size:var(--standard-font-size)}.dropdown a:hover{background-color:var(--hover-background);cursor:pointer}.shevron-icon{cursor:pointer;color:var(--icons-color)!important;transition:transform .3s ease}.selected{color:var(--icons-color)!important;font-weight:bolder}.input-filter{height:36px;display:block}.scrollable-settings{max-height:164px;overflow-y:auto}.fixed{position:fixed}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "directive", type: i3$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: HerumChipComponent, selector: "herum-chip", inputs: ["title", "isDeleteButtonNeeded", "isActive", "isMenuMode", "type", "size"], outputs: ["remove", "chipsActivation"] }, { kind: "component", type: HerumInputFieldComponent, selector: "herum-input-field", inputs: ["type", "placeholder", "disabled", "isBlocked", "isValid", "errorMsg", "showErrorMsgGap", "inputValue", "isLoading", "id", "debounceTime", "minValue", "maxValue", "isBlurred", "touched", "ltrMode", "preventMacroKeysPressEvent"], outputs: ["inputValueEmitter"] }, { kind: "component", type: HerumOptionsListComponent, selector: "herum-options-list", inputs: ["options", "selectedOptions", "isContentInsideExpendablePanel", "isInternalMode"], outputs: ["selectedOptionsEmitter"] }, { kind: "component", type: HerumRecursiveHierarchyOptionsListComponent, selector: "herum-recursive-hierarchy-options-list", inputs: ["options", "selectedOptions", "recursiveTitledOption"], outputs: ["selectedOptionsEmitter", "selectedRecursiveOptionsEmitter"] }], animations: [openClose] });
|
|
1073
1076
|
}
|
|
1074
1077
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumMultiSelectComponent, decorators: [{
|
|
1075
1078
|
type: Component,
|
|
@@ -2078,11 +2081,11 @@ class HerumToggleButtonComponent {
|
|
|
2078
2081
|
this.onTouched = fn;
|
|
2079
2082
|
}
|
|
2080
2083
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2081
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumToggleButtonComponent, isStandalone: false, selector: "herum-toggle-button", inputs: { options: "options", selectedOption: "selectedOption", disabled: "disabled" }, outputs: { onSelectedOption: "onSelectedOption" }, providers: [CUSTOM_TOGGLE_BUTTON_CONTROL_VALUE_ACCESSOR], usesOnChanges: true, ngImport: i0, template: "<div class=\"toggle-container\">\r\n <div *ngFor=\"let option of options; let i = index\">\r\n <button [value]=\"i\" (click)=\"toggleOption(i)\" class=\"small\" type=\"button\"\r\n [class.primary]=\"isOptionSelected(i)\" [disabled]=\"disabled\">\r\n {{option}}\r\n </button>\r\n </div>\r\n</div>", styles: [".toggle-container{display:flex;background-color:var(--panels-fill-color);width:fit-content;padding:4px;border-radius:var(--border-radius);transition:background-color
|
|
2084
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: HerumToggleButtonComponent, isStandalone: false, selector: "herum-toggle-button", inputs: { options: "options", selectedOption: "selectedOption", disabled: "disabled" }, outputs: { onSelectedOption: "onSelectedOption" }, providers: [CUSTOM_TOGGLE_BUTTON_CONTROL_VALUE_ACCESSOR], usesOnChanges: true, ngImport: i0, template: "<div class=\"toggle-container\">\r\n <div *ngFor=\"let option of options; let i = index\">\r\n <button [value]=\"i\" (click)=\"toggleOption(i)\" class=\"small\" type=\"button\"\r\n [class.primary]=\"isOptionSelected(i)\" [disabled]=\"disabled\">\r\n {{option}}\r\n </button>\r\n </div>\r\n</div>", styles: [".toggle-container{display:flex;background-color:var(--panels-fill-color);width:fit-content;padding:4px;border-radius:var(--border-radius);transition:background-color .5s ease-in-out;box-shadow:0 0 var(--box-shadow-blur) #00000029!important}button{padding:10px;cursor:pointer;color:var(--text-color);border:none;border-radius:var(--border-radius);background-color:transparent;transition:background-color .5s ease-in-out,color .5s ease-in-out}button.primary{background-color:var(--primary-color);color:#fff}.small{box-shadow:none!important}.border-right{border-right:1px solid var(--chips-divider-color)}.hidden-input{display:none}\n", "button{padding:var(--button-padding-size);width:100%;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-weight:500;font-size:var(--standard-font-size);box-shadow:0 0 var(--box-shadow-blur) #00000029!important}button:active{transform:scale(.96)}button:focus-visible{outline:none;transform:scale(.96)}.default-rounded-corners{border-radius:var(--border-radius)}.up-rounded-corners{border-radius:8px 8px 0 0}.down-rounded-corners{border-radius:0 0 8px 8px}shadow{box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.fit{width:fit-content;height:fit-content;padding:4px 8px}.small{min-width:var(--minimum-small-button-width-size);height:var(--small-button-height-size)}.medium{min-width:var(--minimum-medium-button-width-size);height:var(--medium-button-height-size)}.big{min-width:var(--minimum-medium-button-width-size);height:var(--big-button-height-size)}.medium-square{min-width:var(--minimum-medium-quare-button-width-size);height:var(--medium-button-height-size)}.primary{background:var(--primary-color);color:var(--light-text-color)}.primary:hover{background:var(--lighter-primary-color)}.primary:active{background:var(--darker-primary-color)}.white{background:#fff;color:var(--icons-color)}.primary[disabled]{background:var(--disabled-background-color);color:var(--disabled-text-color)}.secondary{background:var(--light-background-color);border:var(--secondary-color) 2px solid;color:var(--secondary-color)}.secondary:hover{background:var(--light-background-color);border:var(--lighter-secondary-color) 2px solid;color:var(--lighter-secondary-color)}.secondary:active{border:var(--darker-secondary-color) 2px solid;color:var(--darker-secondary-color)}.secondary[disabled]{background:var(--disabled-background-color);border:var(--disabled-background-color);color:var(--disabled-text-color)}.ghost{background:transparent;outline:transparent;color:var(--secondary-color);box-shadow:none!important;stroke:var(--secondary-color)}.ghost:hover:not([disabled]){color:var(--lighter-secondary-color);stroke:var(--lighter-secondary-color)}.ghost:active{background:var(--darker-light-background-color);outline:transparent;color:var(--secondary-color);box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.ghost[disabled]{color:var(--disabled-text-color);background-color:transparent}[disabled]{cursor:not-allowed;color:var(--disabled-text-color);stroke:var(--disabled-text-color)}.error{background:var(--error-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
2082
2085
|
}
|
|
2083
2086
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: HerumToggleButtonComponent, decorators: [{
|
|
2084
2087
|
type: Component,
|
|
2085
|
-
args: [{ standalone: false, selector: 'herum-toggle-button', providers: [CUSTOM_TOGGLE_BUTTON_CONTROL_VALUE_ACCESSOR], template: "<div class=\"toggle-container\">\r\n <div *ngFor=\"let option of options; let i = index\">\r\n <button [value]=\"i\" (click)=\"toggleOption(i)\" class=\"small\" type=\"button\"\r\n [class.primary]=\"isOptionSelected(i)\" [disabled]=\"disabled\">\r\n {{option}}\r\n </button>\r\n </div>\r\n</div>", styles: [".toggle-container{display:flex;background-color:var(--panels-fill-color);width:fit-content;padding:4px;border-radius:var(--border-radius);transition:background-color
|
|
2088
|
+
args: [{ standalone: false, selector: 'herum-toggle-button', providers: [CUSTOM_TOGGLE_BUTTON_CONTROL_VALUE_ACCESSOR], template: "<div class=\"toggle-container\">\r\n <div *ngFor=\"let option of options; let i = index\">\r\n <button [value]=\"i\" (click)=\"toggleOption(i)\" class=\"small\" type=\"button\"\r\n [class.primary]=\"isOptionSelected(i)\" [disabled]=\"disabled\">\r\n {{option}}\r\n </button>\r\n </div>\r\n</div>", styles: [".toggle-container{display:flex;background-color:var(--panels-fill-color);width:fit-content;padding:4px;border-radius:var(--border-radius);transition:background-color .5s ease-in-out;box-shadow:0 0 var(--box-shadow-blur) #00000029!important}button{padding:10px;cursor:pointer;color:var(--text-color);border:none;border-radius:var(--border-radius);background-color:transparent;transition:background-color .5s ease-in-out,color .5s ease-in-out}button.primary{background-color:var(--primary-color);color:#fff}.small{box-shadow:none!important}.border-right{border-right:1px solid var(--chips-divider-color)}.hidden-input{display:none}\n", "button{padding:var(--button-padding-size);width:100%;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-weight:500;font-size:var(--standard-font-size);box-shadow:0 0 var(--box-shadow-blur) #00000029!important}button:active{transform:scale(.96)}button:focus-visible{outline:none;transform:scale(.96)}.default-rounded-corners{border-radius:var(--border-radius)}.up-rounded-corners{border-radius:8px 8px 0 0}.down-rounded-corners{border-radius:0 0 8px 8px}shadow{box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.fit{width:fit-content;height:fit-content;padding:4px 8px}.small{min-width:var(--minimum-small-button-width-size);height:var(--small-button-height-size)}.medium{min-width:var(--minimum-medium-button-width-size);height:var(--medium-button-height-size)}.big{min-width:var(--minimum-medium-button-width-size);height:var(--big-button-height-size)}.medium-square{min-width:var(--minimum-medium-quare-button-width-size);height:var(--medium-button-height-size)}.primary{background:var(--primary-color);color:var(--light-text-color)}.primary:hover{background:var(--lighter-primary-color)}.primary:active{background:var(--darker-primary-color)}.white{background:#fff;color:var(--icons-color)}.primary[disabled]{background:var(--disabled-background-color);color:var(--disabled-text-color)}.secondary{background:var(--light-background-color);border:var(--secondary-color) 2px solid;color:var(--secondary-color)}.secondary:hover{background:var(--light-background-color);border:var(--lighter-secondary-color) 2px solid;color:var(--lighter-secondary-color)}.secondary:active{border:var(--darker-secondary-color) 2px solid;color:var(--darker-secondary-color)}.secondary[disabled]{background:var(--disabled-background-color);border:var(--disabled-background-color);color:var(--disabled-text-color)}.ghost{background:transparent;outline:transparent;color:var(--secondary-color);box-shadow:none!important;stroke:var(--secondary-color)}.ghost:hover:not([disabled]){color:var(--lighter-secondary-color);stroke:var(--lighter-secondary-color)}.ghost:active{background:var(--darker-light-background-color);outline:transparent;color:var(--secondary-color);box-shadow:0 0 var(--box-shadow-blur) #00000029!important}.ghost[disabled]{color:var(--disabled-text-color);background-color:transparent}[disabled]{cursor:not-allowed;color:var(--disabled-text-color);stroke:var(--disabled-text-color)}.error{background:var(--error-color)}\n"] }]
|
|
2086
2089
|
}], propDecorators: { options: [{
|
|
2087
2090
|
type: Input
|
|
2088
2091
|
}], selectedOption: [{
|