@n-isi-platform/design-system 1.0.43 → 1.0.45
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.
|
@@ -936,7 +936,7 @@ class AccordionComponent {
|
|
|
936
936
|
}
|
|
937
937
|
ButtonColor = ButtonColor;
|
|
938
938
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
939
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: AccordionComponent, isStandalone: true, selector: "lib-accordion[headerTitle]", inputs: { isHeaderEditable: "isHeaderEditable", isAccordionDeletable: "isAccordionDeletable", isAccordionCloneable: "isAccordionCloneable", headerTitle: "headerTitle", selected: "selected", icon: "icon", headerTitlePlaceholder: "headerTitlePlaceholder", headerTitleEditable: "headerTitleEditable", group: "group", controlName: "controlName", name: "name", canDisable: "canDisable", toggleLabel: "toggleLabel", toggleControlName: "toggleControlName" }, outputs: { clickEvent: "clickEvent", clickToggleEvent: "clickToggleEvent", clickCloneEvent: "clickCloneEvent" }, ngImport: i0, template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"], dependencies: [{ kind: "component", type: Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i1$4.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i1$4.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i1$4.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "size", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
|
|
939
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: AccordionComponent, isStandalone: true, selector: "lib-accordion[headerTitle]", inputs: { isHeaderEditable: "isHeaderEditable", isAccordionDeletable: "isAccordionDeletable", isAccordionCloneable: "isAccordionCloneable", headerTitle: "headerTitle", selected: "selected", icon: "icon", headerTitlePlaceholder: "headerTitlePlaceholder", headerTitleEditable: "headerTitleEditable", group: "group", controlName: "controlName", name: "name", canDisable: "canDisable", toggleLabel: "toggleLabel", toggleControlName: "toggleControlName" }, outputs: { clickEvent: "clickEvent", clickToggleEvent: "clickToggleEvent", clickCloneEvent: "clickCloneEvent" }, ngImport: i0, template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filters,:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem 1.5rem;align-items:start}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}@media screen and (min-width:1400px){:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filters,:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filter-grid{grid-template-columns:repeat(6,minmax(220px,1fr))}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"], dependencies: [{ kind: "component", type: Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i1$4.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i1$4.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i1$4.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "size", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
|
|
940
940
|
}
|
|
941
941
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
942
942
|
type: Component,
|
|
@@ -952,7 +952,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
952
952
|
PopoverModule,
|
|
953
953
|
SelectButton,
|
|
954
954
|
ButtonComponent,
|
|
955
|
-
], template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"] }]
|
|
955
|
+
], template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n <p-accordion-panel [value]=\"1\">\r\n <p-accordion-header>\r\n <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n <ng-container>\r\n <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n <i [ngClass]=\"icon\"></i>\r\n <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n </div>\r\n <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n <i [ngClass]=\"icon\"></i>\r\n <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n (keydown.space)=\"$event.stopPropagation()\"/>\r\n </div>\r\n <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n <div class=\"controls-lg-screen\">\r\n <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </p-accordion-header>\r\n <p-accordion-content>\r\n <ng-content></ng-content>\r\n </p-accordion-content>\r\n </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n <div class=\"controls\">\r\n <div class=\"flex align-items-center\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"ml-5 clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n </div>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-5 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n <div class=\"flex-column p-1\">\r\n <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n <p-selectButton\r\n (click)=\"clickToggleButton($event)\"\r\n [options]=\"stateOptions\"\r\n [formControlName]=\"toggleControlName\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n ></p-selectButton>\r\n </form>\r\n\r\n <div class=\"flex align-items-center mt-2\">\r\n <lib-button\r\n *ngIf=\"isAccordionCloneable\"\r\n class=\"clone-button\"\r\n label=\"Kopiraj okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-clone\"\r\n (clickEvent)=\"clickCloneButton($event)\"\r\n [color]=\"ButtonColor.warning\"\r\n ></lib-button>\r\n\r\n <lib-button\r\n *ngIf=\"isAccordionDeletable\"\r\n class=\"ml-2 delete-button\"\r\n label=\"Izbri\u0161i okence\"\r\n [hasIcon]=\"true\"\r\n icon=\"pi pi-trash\"\r\n (clickEvent)=\"click($event)\"\r\n [color]=\"ButtonColor.danger\"\r\n ></lib-button>\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filters,:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem 1.5rem;align-items:start}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}@media screen and (min-width:1400px){:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filters,:host ::ng-deep .p-accordion .p-accordioncontent-content .accordion .filter-grid{grid-template-columns:repeat(6,minmax(220px,1fr))}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"] }]
|
|
956
956
|
}], propDecorators: { isHeaderEditable: [{
|
|
957
957
|
type: Input
|
|
958
958
|
}], isAccordionDeletable: [{
|
|
@@ -3293,7 +3293,7 @@ class ModalComponent {
|
|
|
3293
3293
|
this.changeVisibility(false);
|
|
3294
3294
|
}
|
|
3295
3295
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3296
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ModalComponent, isStandalone: true, selector: "lib-modal", inputs: { header: "header", headerColor: "headerColor", width: "width", height: "height", dynamicContentTemplate: "dynamicContentTemplate", resizable: "resizable", draggable: "draggable", visible: "visible", closable: "closable", modal: "modal", body: "body", position: "position", mode: "mode", btnLabel: "btnLabel", btnColor: "btnColor", btnIcon: "btnIcon", hasIcon: "hasIcon", disabled: "disabled", hasLeftButton: "hasLeftButton", appendTo: "appendTo", leftBtnLabel: "leftBtnLabel", leftBtnColor: "leftBtnColor", leftBtnIcon: "leftBtnIcon", leftHasIcon: "leftHasIcon", leftDisabled: "leftDisabled", isFooterVisible: "isFooterVisible", dismissableMask: "dismissableMask" }, outputs: { buttonClickEvent: "buttonClickEvent", visibleChange: "visibleChange", leftButtonClickEvent: "leftButtonClickEvent", scrollEvent: "scrollEvent", modalClosed: "modalClosed" }, ngImport: i0, template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [appendTo]=\"appendTo\"\r\n [
|
|
3296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ModalComponent, isStandalone: true, selector: "lib-modal", inputs: { header: "header", headerColor: "headerColor", width: "width", height: "height", dynamicContentTemplate: "dynamicContentTemplate", resizable: "resizable", draggable: "draggable", visible: "visible", closable: "closable", modal: "modal", body: "body", position: "position", mode: "mode", btnLabel: "btnLabel", btnColor: "btnColor", btnIcon: "btnIcon", hasIcon: "hasIcon", disabled: "disabled", hasLeftButton: "hasLeftButton", appendTo: "appendTo", leftBtnLabel: "leftBtnLabel", leftBtnColor: "leftBtnColor", leftBtnIcon: "leftBtnIcon", leftHasIcon: "leftHasIcon", leftDisabled: "leftDisabled", isFooterVisible: "isFooterVisible", dismissableMask: "dismissableMask" }, outputs: { buttonClickEvent: "buttonClickEvent", visibleChange: "visibleChange", leftButtonClickEvent: "leftButtonClickEvent", scrollEvent: "scrollEvent", modalClosed: "modalClosed" }, ngImport: i0, template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [appendTo]=\"appendTo\"\r\n [styleClass]=\"headerClassMap[headerColor]\"\r\n [closable]=\"closable\"\r\n [footerTemplate]=\"isFooterVisible ? footer : undefined\"\r\n (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n <ng-template pTemplate=\"content\">\r\n <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n <div class=\"w-full flex\"\r\n [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n <lib-button\r\n *ngIf=\"hasLeftButton\"\r\n [disabled]=\"leftDisabled\"\r\n (click)=\"leftButtonClick($event)\"\r\n [label]=\"leftBtnLabel\"\r\n [color]=\"leftBtnColor\"\r\n [icon]=\"leftBtnIcon\"\r\n [hasIcon]=\"leftHasIcon\"\r\n ></lib-button>\r\n <lib-button\r\n [disabled]=\"disabled\"\r\n (click)=\"buttonCloseModal($event)\"\r\n [label]=\"btnLabel\"\r\n [color]=\"btnColor\"\r\n [icon]=\"btnIcon\"\r\n [hasIcon]=\"hasIcon\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"], dependencies: [{ kind: "component", type: Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
|
|
3297
3297
|
}
|
|
3298
3298
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, decorators: [{
|
|
3299
3299
|
type: Component,
|
|
@@ -3304,7 +3304,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
3304
3304
|
NgTemplateOutlet,
|
|
3305
3305
|
NgIf,
|
|
3306
3306
|
ButtonComponent,
|
|
3307
|
-
], template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [appendTo]=\"appendTo\"\r\n [
|
|
3307
|
+
], template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n [dismissableMask]=\"dismissableMask\"\r\n [appendTo]=\"appendTo\"\r\n [styleClass]=\"headerClassMap[headerColor]\"\r\n [closable]=\"closable\"\r\n [footerTemplate]=\"isFooterVisible ? footer : undefined\"\r\n (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n <ng-template pTemplate=\"content\">\r\n <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n <div class=\"w-full flex\"\r\n [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n <lib-button\r\n *ngIf=\"hasLeftButton\"\r\n [disabled]=\"leftDisabled\"\r\n (click)=\"leftButtonClick($event)\"\r\n [label]=\"leftBtnLabel\"\r\n [color]=\"leftBtnColor\"\r\n [icon]=\"leftBtnIcon\"\r\n [hasIcon]=\"leftHasIcon\"\r\n ></lib-button>\r\n <lib-button\r\n [disabled]=\"disabled\"\r\n (click)=\"buttonCloseModal($event)\"\r\n [label]=\"btnLabel\"\r\n [color]=\"btnColor\"\r\n [icon]=\"btnIcon\"\r\n [hasIcon]=\"hasIcon\"\r\n ></lib-button>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"] }]
|
|
3308
3308
|
}], propDecorators: { header: [{
|
|
3309
3309
|
type: Input
|
|
3310
3310
|
}], headerColor: [{
|
|
@@ -3597,11 +3597,11 @@ class TableColumnSelectComponent {
|
|
|
3597
3597
|
}
|
|
3598
3598
|
}
|
|
3599
3599
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TableColumnSelectComponent, deps: [{ token: LocalStorageService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3600
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TableColumnSelectComponent, isStandalone: true, selector: "table-column-select", inputs: { columns: "columns", defaultColumns: "defaultColumns", enableResizableColumns: "enableResizableColumns", pregled: "pregled" }, outputs: { updateColumns: "updateColumns", updateResizableColumns: "updateResizableColumns" }, usesOnChanges: true, ngImport: i0, template: "<p-button (click)=\"showDialog()\" icon=\"pi pi-cog\" aria-label=\"Save\" />\r\n\r\n<lib-modal\r\n header=\"{{ 'components.modals.tableColumnSelect.title' | translate }}\"\r\n btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n [(visible)]=\"visible\"\r\n [closable]=\"true\"\r\n [modal]=\"true\"\r\n width=\"30vw\"\r\n (buttonClickEvent)=\"changeValue()\"\r\n [dynamicContentTemplate]=\"dynamicContentCollection\">\r\n</lib-modal>\r\n\r\n<ng-template class=\"modal-content\" #dynamicContentCollection>\r\n <div class=\"flex w-full justify-content-between align-items-center gap-2\">\r\n <lib-button label=\"{{'components.modals.tableColumnSelect.ponastaviStolpce' | translate}}\" (click)=\"onReset()\">\r\n </lib-button>\r\n <div class=\"flex gap-2\">\r\n <p-checkbox [binary]=\"true\" [(ngModel)]=\"enableResizableColumns\" /> \r\n <h4>{{ 'components.modals.tableColumnSelect.spreminjanjeVelikostiStolpcev' | translate }}</h4>\r\n </div>\r\n </div>\r\n \r\n <div pDroppable (onDrop)=\"drop(i)\" [pDroppableDisabled]=\"i < 2 ? true : false\" *ngFor=\"let item of dropContainers; index as i\" class=\"drop-container\">\r\n <div (onDragStart)=\"dragStart(item.items[0])\" [dragHandle]=\"i < 2 ? 'invalid' : undefined\" pDraggable [ngClass]=\"i < 2 ? 'disabled': ''\" class=\"item\">\r\n <p-checkbox [inputId]=\"item.items[0].field\" [disabled]=\"i < 2\" name=\"group\" [value]=\"item.items[0]\" [(ngModel)]=\"selectedColumns\" /> \r\n <h4>{{item.items[0].header}}</h4>\r\n </div> \r\n </div>\r\n</ng-template>\r\n", styles: [".item{display:flex;gap:8px;margin-top:8px;border:1px solid #d7d7d7;border-radius:12px;padding:6px}.disabled{background-color:#d7d7d7}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ListboxModule }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4$2.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: OrderListModule }, { kind: "component", type: ModalComponent, selector: "lib-modal", inputs: ["header", "headerColor", "width", "height", "dynamicContentTemplate", "resizable", "draggable", "visible", "closable", "modal", "body", "position", "mode", "btnLabel", "btnColor", "btnIcon", "hasIcon", "disabled", "hasLeftButton", "appendTo", "leftBtnLabel", "leftBtnColor", "leftBtnIcon", "leftHasIcon", "leftDisabled", "isFooterVisible", "dismissableMask"], outputs: ["buttonClickEvent", "visibleChange", "leftButtonClickEvent", "scrollEvent", "modalClosed"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "directive", type: Droppable, selector: "[pDroppable]", inputs: ["pDroppable", "pDroppableDisabled", "dropEffect"], outputs: ["onDragEnter", "onDragLeave", "onDrop"] }, { kind: "directive", type: Draggable, selector: "[pDraggable]", inputs: ["pDraggable", "dragEffect", "dragHandle", "pDraggableDisabled"], outputs: ["onDragStart", "onDragEnd", "onDrag"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
|
|
3600
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TableColumnSelectComponent, isStandalone: true, selector: "table-column-select", inputs: { columns: "columns", defaultColumns: "defaultColumns", enableResizableColumns: "enableResizableColumns", pregled: "pregled" }, outputs: { updateColumns: "updateColumns", updateResizableColumns: "updateResizableColumns" }, usesOnChanges: true, ngImport: i0, template: "<p-button (click)=\"showDialog()\" icon=\"pi pi-cog\" aria-label=\"Save\" />\r\n\r\n<lib-modal\r\n header=\"{{ 'components.modals.tableColumnSelect.title' | translate }}\"\r\n btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n [(visible)]=\"visible\"\r\n [closable]=\"true\"\r\n [appendTo]=\"'body'\"\r\n [modal]=\"true\"\r\n width=\"30vw\"\r\n (buttonClickEvent)=\"changeValue()\"\r\n [dynamicContentTemplate]=\"dynamicContentCollection\">\r\n</lib-modal>\r\n\r\n<ng-template class=\"modal-content\" #dynamicContentCollection>\r\n <div class=\"flex w-full justify-content-between align-items-center gap-2\">\r\n <lib-button label=\"{{'components.modals.tableColumnSelect.ponastaviStolpce' | translate}}\" (click)=\"onReset()\">\r\n </lib-button>\r\n <div class=\"flex gap-2\">\r\n <p-checkbox [binary]=\"true\" [(ngModel)]=\"enableResizableColumns\" /> \r\n <h4>{{ 'components.modals.tableColumnSelect.spreminjanjeVelikostiStolpcev' | translate }}</h4>\r\n </div>\r\n </div>\r\n \r\n <div pDroppable (onDrop)=\"drop(i)\" [pDroppableDisabled]=\"i < 2 ? true : false\" *ngFor=\"let item of dropContainers; index as i\" class=\"drop-container\">\r\n <div (onDragStart)=\"dragStart(item.items[0])\" [dragHandle]=\"i < 2 ? 'invalid' : undefined\" pDraggable [ngClass]=\"i < 2 ? 'disabled': ''\" class=\"item\">\r\n <p-checkbox [inputId]=\"item.items[0].field\" [disabled]=\"i < 2\" name=\"group\" [value]=\"item.items[0]\" [(ngModel)]=\"selectedColumns\" /> \r\n <h4>{{item.items[0].header}}</h4>\r\n </div> \r\n </div>\r\n</ng-template>\r\n", styles: [".item{display:flex;gap:8px;margin-top:8px;border:1px solid #d7d7d7;border-radius:12px;padding:6px}.disabled{background-color:#d7d7d7}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ListboxModule }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4$2.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: OrderListModule }, { kind: "component", type: ModalComponent, selector: "lib-modal", inputs: ["header", "headerColor", "width", "height", "dynamicContentTemplate", "resizable", "draggable", "visible", "closable", "modal", "body", "position", "mode", "btnLabel", "btnColor", "btnIcon", "hasIcon", "disabled", "hasLeftButton", "appendTo", "leftBtnLabel", "leftBtnColor", "leftBtnIcon", "leftHasIcon", "leftDisabled", "isFooterVisible", "dismissableMask"], outputs: ["buttonClickEvent", "visibleChange", "leftButtonClickEvent", "scrollEvent", "modalClosed"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "directive", type: Droppable, selector: "[pDroppable]", inputs: ["pDroppable", "pDroppableDisabled", "dropEffect"], outputs: ["onDragEnter", "onDragLeave", "onDrop"] }, { kind: "directive", type: Draggable, selector: "[pDraggable]", inputs: ["pDraggable", "dragEffect", "dragHandle", "pDraggableDisabled"], outputs: ["onDragStart", "onDragEnd", "onDrag"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
|
|
3601
3601
|
}
|
|
3602
3602
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TableColumnSelectComponent, decorators: [{
|
|
3603
3603
|
type: Component,
|
|
3604
|
-
args: [{ selector: 'table-column-select', imports: [ButtonModule, ListboxModule, DialogModule, CheckboxModule, CommonModule, FormsModule, OrderListModule, ModalComponent, TranslateModule, Droppable, Draggable, ButtonComponent], template: "<p-button (click)=\"showDialog()\" icon=\"pi pi-cog\" aria-label=\"Save\" />\r\n\r\n<lib-modal\r\n header=\"{{ 'components.modals.tableColumnSelect.title' | translate }}\"\r\n btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n [(visible)]=\"visible\"\r\n [closable]=\"true\"\r\n [modal]=\"true\"\r\n width=\"30vw\"\r\n (buttonClickEvent)=\"changeValue()\"\r\n [dynamicContentTemplate]=\"dynamicContentCollection\">\r\n</lib-modal>\r\n\r\n<ng-template class=\"modal-content\" #dynamicContentCollection>\r\n <div class=\"flex w-full justify-content-between align-items-center gap-2\">\r\n <lib-button label=\"{{'components.modals.tableColumnSelect.ponastaviStolpce' | translate}}\" (click)=\"onReset()\">\r\n </lib-button>\r\n <div class=\"flex gap-2\">\r\n <p-checkbox [binary]=\"true\" [(ngModel)]=\"enableResizableColumns\" /> \r\n <h4>{{ 'components.modals.tableColumnSelect.spreminjanjeVelikostiStolpcev' | translate }}</h4>\r\n </div>\r\n </div>\r\n \r\n <div pDroppable (onDrop)=\"drop(i)\" [pDroppableDisabled]=\"i < 2 ? true : false\" *ngFor=\"let item of dropContainers; index as i\" class=\"drop-container\">\r\n <div (onDragStart)=\"dragStart(item.items[0])\" [dragHandle]=\"i < 2 ? 'invalid' : undefined\" pDraggable [ngClass]=\"i < 2 ? 'disabled': ''\" class=\"item\">\r\n <p-checkbox [inputId]=\"item.items[0].field\" [disabled]=\"i < 2\" name=\"group\" [value]=\"item.items[0]\" [(ngModel)]=\"selectedColumns\" /> \r\n <h4>{{item.items[0].header}}</h4>\r\n </div> \r\n </div>\r\n</ng-template>\r\n", styles: [".item{display:flex;gap:8px;margin-top:8px;border:1px solid #d7d7d7;border-radius:12px;padding:6px}.disabled{background-color:#d7d7d7}\n"] }]
|
|
3604
|
+
args: [{ selector: 'table-column-select', imports: [ButtonModule, ListboxModule, DialogModule, CheckboxModule, CommonModule, FormsModule, OrderListModule, ModalComponent, TranslateModule, Droppable, Draggable, ButtonComponent], template: "<p-button (click)=\"showDialog()\" icon=\"pi pi-cog\" aria-label=\"Save\" />\r\n\r\n<lib-modal\r\n header=\"{{ 'components.modals.tableColumnSelect.title' | translate }}\"\r\n btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n [(visible)]=\"visible\"\r\n [closable]=\"true\"\r\n [appendTo]=\"'body'\"\r\n [modal]=\"true\"\r\n width=\"30vw\"\r\n (buttonClickEvent)=\"changeValue()\"\r\n [dynamicContentTemplate]=\"dynamicContentCollection\">\r\n</lib-modal>\r\n\r\n<ng-template class=\"modal-content\" #dynamicContentCollection>\r\n <div class=\"flex w-full justify-content-between align-items-center gap-2\">\r\n <lib-button label=\"{{'components.modals.tableColumnSelect.ponastaviStolpce' | translate}}\" (click)=\"onReset()\">\r\n </lib-button>\r\n <div class=\"flex gap-2\">\r\n <p-checkbox [binary]=\"true\" [(ngModel)]=\"enableResizableColumns\" /> \r\n <h4>{{ 'components.modals.tableColumnSelect.spreminjanjeVelikostiStolpcev' | translate }}</h4>\r\n </div>\r\n </div>\r\n \r\n <div pDroppable (onDrop)=\"drop(i)\" [pDroppableDisabled]=\"i < 2 ? true : false\" *ngFor=\"let item of dropContainers; index as i\" class=\"drop-container\">\r\n <div (onDragStart)=\"dragStart(item.items[0])\" [dragHandle]=\"i < 2 ? 'invalid' : undefined\" pDraggable [ngClass]=\"i < 2 ? 'disabled': ''\" class=\"item\">\r\n <p-checkbox [inputId]=\"item.items[0].field\" [disabled]=\"i < 2\" name=\"group\" [value]=\"item.items[0]\" [(ngModel)]=\"selectedColumns\" /> \r\n <h4>{{item.items[0].header}}</h4>\r\n </div> \r\n </div>\r\n</ng-template>\r\n", styles: [".item{display:flex;gap:8px;margin-top:8px;border:1px solid #d7d7d7;border-radius:12px;padding:6px}.disabled{background-color:#d7d7d7}\n"] }]
|
|
3605
3605
|
}], ctorParameters: () => [{ type: LocalStorageService }, { type: i1$2.TranslateService }], propDecorators: { columns: [{
|
|
3606
3606
|
type: Input
|
|
3607
3607
|
}], defaultColumns: [{
|