@indice/ng-components 0.2.155-beta.1 → 0.2.157
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/README.md +4 -4
- package/_styles.css +3571 -3571
- package/esm2020/lib/controls/avatar-initials/avatar-initials.component.mjs +3 -3
- package/esm2020/lib/controls/collapsible-panel/collapsible-panel.component.mjs +3 -3
- package/esm2020/lib/controls/combobox/combobox.component.mjs +3 -3
- package/esm2020/lib/controls/date-picker/date-picker.component.mjs +3 -3
- package/esm2020/lib/controls/drop-down-menu/drop-down-menu.component.mjs +3 -3
- package/esm2020/lib/controls/kpi-tile/kpi-tile.component.mjs +3 -3
- package/esm2020/lib/controls/language-selection/language-selection.component.mjs +3 -3
- package/esm2020/lib/controls/list-view/list-column.component.mjs +1 -1
- package/esm2020/lib/controls/list-view/list-details-section.component.mjs +1 -1
- package/esm2020/lib/controls/list-view/list-tile.component.mjs +1 -1
- package/esm2020/lib/controls/list-view/list-view-empty-state.component.mjs +3 -3
- package/esm2020/lib/controls/list-view/list-view.component.mjs +3 -3
- package/esm2020/lib/controls/nav-links-list/nav-links-list.component.mjs +3 -3
- package/esm2020/lib/controls/notifications-indicator/notifications-indicator.component.mjs +3 -3
- package/esm2020/lib/controls/pager/pager.component.mjs +3 -3
- package/esm2020/lib/controls/side-pane/side-pane.component.mjs +3 -3
- package/esm2020/lib/controls/skeleton-loader/skeleton-loader.component.mjs +3 -3
- package/esm2020/lib/controls/stepper/lib-step-info.directive.mjs +1 -1
- package/esm2020/lib/controls/stepper/lib-step-label.directive.mjs +1 -1
- package/esm2020/lib/controls/stepper/lib-step.component.mjs +9 -9
- package/esm2020/lib/controls/stepper/lib-stepper.component.mjs +3 -3
- package/esm2020/lib/controls/stepper/types/step-selected-event.mjs +1 -1
- package/esm2020/lib/controls/stepper/types/stepper-type.mjs +1 -1
- package/esm2020/lib/controls/tabs/lib-tab-group.component.mjs +3 -3
- package/esm2020/lib/controls/tabs/lib-tab.component.mjs +9 -9
- package/esm2020/lib/controls/toaster/toaster-container.component.mjs +3 -3
- package/esm2020/lib/controls/toaster/toaster.component.mjs +3 -3
- package/esm2020/lib/controls/toggle/toggle.component.mjs +3 -3
- package/esm2020/lib/controls/user-profile-menu/user-profile-menu.component.mjs +3 -3
- package/esm2020/lib/directives/click-outside.directive.mjs +1 -1
- package/esm2020/lib/directives/dynamic-component-host.directive.mjs +1 -1
- package/esm2020/lib/helpers/base-list.component.mjs +1 -1
- package/esm2020/lib/icons.mjs +1 -1
- package/esm2020/lib/layouts/shell/shell-footer/shell-footer.component.mjs +3 -3
- package/esm2020/lib/layouts/shell/shell-header/shell-header.component.mjs +3 -3
- package/esm2020/lib/layouts/shell/shell-layout/shell-layout.component.mjs +3 -3
- package/esm2020/lib/layouts/shell/shell-sidebar/shell-sidebar.component.mjs +3 -3
- package/esm2020/lib/layouts/views/form-layout/form-layout.component.mjs +3 -3
- package/esm2020/lib/layouts/views/model-view-layout/model-view-layout.component.mjs +3 -3
- package/esm2020/lib/layouts/views/side-view-layout/side-view-layout.component.mjs +3 -3
- package/esm2020/lib/layouts/views/view-layout/view-layout.component.mjs +3 -3
- package/esm2020/lib/ng-components.module.mjs +1 -1
- package/esm2020/lib/pages/auth/auth-callback/auth-callback.component.mjs +1 -1
- package/esm2020/lib/pages/auth/auth-renew/auth-renew.component.mjs +1 -1
- package/esm2020/lib/pages/auth/logged-out/logged-out.component.mjs +1 -1
- package/esm2020/lib/pages/http-status/error/error.component.mjs +3 -3
- package/esm2020/lib/pages/http-status/page-not-found/page-not-found.component.mjs +3 -3
- package/esm2020/lib/pages/http-status/unauthorized/unauthorized.component.mjs +3 -3
- package/esm2020/lib/pipes/address.pipe.mjs +1 -1
- package/esm2020/lib/pipes/duration-format.pipe.mjs +1 -1
- package/esm2020/lib/services/component-loader/component-loader-options.class.mjs +1 -1
- package/esm2020/lib/services/component-loader/component-loader.class.mjs +1 -1
- package/esm2020/lib/services/component-loader/component-loader.factory.mjs +1 -1
- package/esm2020/lib/services/component-loader/content-ref.class.mjs +1 -1
- package/esm2020/lib/services/modal-service/modal-backdrop-component.mjs +1 -1
- package/esm2020/lib/services/modal-service/modal-container-component.mjs +13 -13
- package/esm2020/lib/services/modal-service/modal-options.class.mjs +1 -1
- package/esm2020/lib/services/modal-service/modal-service.mjs +1 -1
- package/esm2020/lib/services/modal-service/modal-styles.class.mjs +1 -1
- package/esm2020/lib/services/modal-service/modal.class.mjs +1 -1
- package/esm2020/lib/services/toaster.service.mjs +1 -1
- package/esm2020/lib/tokens.mjs +1 -1
- package/esm2020/lib/types.mjs +1 -1
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/indice-ng-components.mjs +91 -91
- package/fesm2015/indice-ng-components.mjs.map +1 -1
- package/fesm2020/indice-ng-components.mjs +91 -91
- package/fesm2020/indice-ng-components.mjs.map +1 -1
- package/lib/types.d.ts +1 -0
- package/modal.css +157 -157
- package/package.json +5 -5
- package/public-api.d.ts +1 -0
|
@@ -239,10 +239,10 @@ class DropDownMenuComponent {
|
|
|
239
239
|
}
|
|
240
240
|
}
|
|
241
241
|
DropDownMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DropDownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
242
|
-
DropDownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder" }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\
|
|
242
|
+
DropDownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder" }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\n <button\n type=\"button\"\n (click)=\"expanded = !expanded\"\n class=\"dropdown-button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"true\"\n aria-labelledby=\"listbox-label\"\n >\n <span class=\"dropdown-selected-text\">\n {{ selectedOption?.text || placeholder }}\n </span>\n <span class=\"dropdown-button-icon\">\n <!-- Heroicon name: solid/selector -->\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path\n fill-rule=\"evenodd\"\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\"\n />\n </svg>\n </span>\n </button>\n <ul\n *ngIf=\"expanded && options && options.length > 0\"\n class=\"dropdown-ul\"\n tabindex=\"-1\"\n role=\"listbox\"\n aria-labelledby=\"listbox-label\"\n aria-activedescendant=\"listbox-option-3\"\n >\n <ng-container *ngFor=\"let option of options\">\n <li\n [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\"\n (click)=\"selectOption(option)\"\n id=\"listbox-option-0\"\n role=\"option\"\n >\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\n {{ option.text }}\n </span>\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\n <!-- Heroicon name: solid/check -->\n <svg\n class=\"dropdown-li-selected-indicator\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n clip-rule=\"evenodd\"\n />\n </svg>\n </span>\n </li>\n </ng-container>\n </ul>\n</div>\n", dependencies: [{ 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: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] });
|
|
243
243
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DropDownMenuComponent, decorators: [{
|
|
244
244
|
type: Component,
|
|
245
|
-
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\
|
|
245
|
+
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\n <button\n type=\"button\"\n (click)=\"expanded = !expanded\"\n class=\"dropdown-button\"\n aria-haspopup=\"listbox\"\n aria-expanded=\"true\"\n aria-labelledby=\"listbox-label\"\n >\n <span class=\"dropdown-selected-text\">\n {{ selectedOption?.text || placeholder }}\n </span>\n <span class=\"dropdown-button-icon\">\n <!-- Heroicon name: solid/selector -->\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path\n fill-rule=\"evenodd\"\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\"\n />\n </svg>\n </span>\n </button>\n <ul\n *ngIf=\"expanded && options && options.length > 0\"\n class=\"dropdown-ul\"\n tabindex=\"-1\"\n role=\"listbox\"\n aria-labelledby=\"listbox-label\"\n aria-activedescendant=\"listbox-option-3\"\n >\n <ng-container *ngFor=\"let option of options\">\n <li\n [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\"\n (click)=\"selectOption(option)\"\n id=\"listbox-option-0\"\n role=\"option\"\n >\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\n {{ option.text }}\n </span>\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\n <!-- Heroicon name: solid/check -->\n <svg\n class=\"dropdown-li-selected-indicator\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\n clip-rule=\"evenodd\"\n />\n </svg>\n </span>\n </li>\n </ng-container>\n </ul>\n</div>\n" }]
|
|
246
246
|
}], ctorParameters: function () { return []; }, propDecorators: { options: [{
|
|
247
247
|
type: Input
|
|
248
248
|
}], selectedValue: [{
|
|
@@ -503,10 +503,10 @@ class PagerComponent {
|
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
505
|
PagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: PagerComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
506
|
-
PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: PagerComponent, selector: "lib-pager", inputs: { busy: "busy", count: "count", page: "page", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], sortOptions: ["sort-options", "sortOptions"], sort: "sort", sortdir: ["sort-dir", "sortdir"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"pager-container\">\
|
|
506
|
+
PagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: PagerComponent, selector: "lib-pager", inputs: { busy: "busy", count: "count", page: "page", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], sortOptions: ["sort-options", "sortOptions"], sort: "sort", sortdir: ["sort-dir", "sortdir"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"pager-container\">\n <div class=\"pager-container-inner\">\n <div class=\"inline-flex\" *ngIf=\"sortOptions && sortOptions.length > 0\">\n <lib-drop-down-menu [options]=\"sortOptions\" [selected]=\"sort\" (selectedChanged)=\"sortOptionChanged($event)\"></lib-drop-down-menu>\n <button (click)=\"toggleSortdir()\" [disabled]=\"!sort || busy\" class=\"pager-icon-button\">\n <span class=\"sr-only\">sort direction</span>\n <span class=\"inline-block relative\">\n <i [class]=\"sortdirIcon\"></i>\n </span>\n </button>\n </div>\n <div class=\"pager-pages-container\">\n <lib-drop-down-menu [options]=\"pageSizeOptions\" [selected]=\"pageSize\" (selectedChanged)=\"pageSizeOptionChanged($event)\"></lib-drop-down-menu>\n <div class=\"mx-2\" *ngIf=\"count !== null && count > pageSize\">\n <button [disabled]=\"!canPreviousPage || busy\" (click)=\"previousPage()\"\n class=\"pager-arrow-button-left\">\n <span class=\"sr-only\">Previous</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n <button [disabled]=\"!canNextPage || busy\" (click)=\"nextPage()\"\n class=\"pager-arrow-button-right\">\n <span class=\"sr-only\">Next</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n <lib-drop-down-menu *ngIf=\"(pages && pages.length > 0) && (count !== null && count > pageSize)\" [options]=\"pages\" [selected]=\"page\" (selectedChanged)=\"pageOptionChanged($event)\"></lib-drop-down-menu>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder"], outputs: ["selectedChange", "selectedChanged"] }] });
|
|
507
507
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: PagerComponent, decorators: [{
|
|
508
508
|
type: Component,
|
|
509
|
-
args: [{ selector: 'lib-pager', template: "<div class=\"pager-container\">\
|
|
509
|
+
args: [{ selector: 'lib-pager', template: "<div class=\"pager-container\">\n <div class=\"pager-container-inner\">\n <div class=\"inline-flex\" *ngIf=\"sortOptions && sortOptions.length > 0\">\n <lib-drop-down-menu [options]=\"sortOptions\" [selected]=\"sort\" (selectedChanged)=\"sortOptionChanged($event)\"></lib-drop-down-menu>\n <button (click)=\"toggleSortdir()\" [disabled]=\"!sort || busy\" class=\"pager-icon-button\">\n <span class=\"sr-only\">sort direction</span>\n <span class=\"inline-block relative\">\n <i [class]=\"sortdirIcon\"></i>\n </span>\n </button>\n </div>\n <div class=\"pager-pages-container\">\n <lib-drop-down-menu [options]=\"pageSizeOptions\" [selected]=\"pageSize\" (selectedChanged)=\"pageSizeOptionChanged($event)\"></lib-drop-down-menu>\n <div class=\"mx-2\" *ngIf=\"count !== null && count > pageSize\">\n <button [disabled]=\"!canPreviousPage || busy\" (click)=\"previousPage()\"\n class=\"pager-arrow-button-left\">\n <span class=\"sr-only\">Previous</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n <button [disabled]=\"!canNextPage || busy\" (click)=\"nextPage()\"\n class=\"pager-arrow-button-right\">\n <span class=\"sr-only\">Next</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n <lib-drop-down-menu *ngIf=\"(pages && pages.length > 0) && (count !== null && count > pageSize)\" [options]=\"pages\" [selected]=\"page\" (selectedChanged)=\"pageOptionChanged($event)\"></lib-drop-down-menu>\n </div>\n </div>\n</div>\n" }]
|
|
510
510
|
}], ctorParameters: function () { return [{ type: i1$1.Router }]; }, propDecorators: { busy: [{
|
|
511
511
|
type: Input
|
|
512
512
|
}], count: [{
|
|
@@ -603,10 +603,10 @@ class ListViewEmptyStateComponent {
|
|
|
603
603
|
}
|
|
604
604
|
}
|
|
605
605
|
ListViewEmptyStateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ListViewEmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
606
|
-
ListViewEmptyStateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: { title: "title", subTitle: ["sub-title", "subTitle"], newItemLabel: ["new-item-label", "newItemLabel"] }, ngImport: i0, template: "<div class=\"p-20\">\
|
|
606
|
+
ListViewEmptyStateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: { title: "title", subTitle: ["sub-title", "subTitle"], newItemLabel: ["new-item-label", "newItemLabel"] }, ngImport: i0, template: "<div class=\"p-20\">\n <div class=\"text-center p-2\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\n </svg>\n <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\n <p class=\"mt-1 text-sm text-gray-500\">\n {{subTitle}}\n </p>\n <div class=\"mt-6\" *ngIf=\"false\">\n <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\n <!-- Heroicon name: solid/plus -->\n <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\n </svg>\n {{newItemLabel}}\n </button>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
607
607
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ListViewEmptyStateComponent, decorators: [{
|
|
608
608
|
type: Component,
|
|
609
|
-
args: [{ selector: 'lib-list-view-empty-state', template: "<div class=\"p-20\">\
|
|
609
|
+
args: [{ selector: 'lib-list-view-empty-state', template: "<div class=\"p-20\">\n <div class=\"text-center p-2\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\n </svg>\n <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\n <p class=\"mt-1 text-sm text-gray-500\">\n {{subTitle}}\n </p>\n <div class=\"mt-6\" *ngIf=\"false\">\n <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\n <!-- Heroicon name: solid/plus -->\n <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\n </svg>\n {{newItemLabel}}\n </button>\n </div>\n </div>\n</div>\n" }]
|
|
610
610
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
611
611
|
type: Input
|
|
612
612
|
}], subTitle: [{
|
|
@@ -629,10 +629,10 @@ class SkeletonLoaderComponent {
|
|
|
629
629
|
}
|
|
630
630
|
}
|
|
631
631
|
SkeletonLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SkeletonLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
632
|
-
SkeletonLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: { count: "count", type: "type" }, ngImport: i0, template: "<!-- <h1>SKELETON LOADER!</h1> -->\
|
|
632
|
+
SkeletonLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: { count: "count", type: "type" }, ngImport: i0, template: "<!-- <h1>SKELETON LOADER!</h1> -->\n<ng-container *ngSwitch=\"type\">\n <div class=\"cards-deck-4\" *ngSwitchCase=\"'tiles'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-3\" *ngSwitchCase=\"'large-tiles'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-52 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-1\" *ngSwitchCase=\"'table'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"border border-light-blue-300 shadow rounded-sm p-4 max-w-sm w-full mx-auto mb-4\">\n <div class=\"animate-pulse flex space-x-4\">\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\"> </div>\n <div class=\"flex-1 space-y-4 py-1\">\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\"> </div>\n <div class=\"space-y-2\">\n <div class=\"h-4 bg-light-blue-400 rounded\"> </div>\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\"> </div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-3\" *ngSwitchDefault>\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-52 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
|
|
633
633
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SkeletonLoaderComponent, decorators: [{
|
|
634
634
|
type: Component,
|
|
635
|
-
args: [{ selector: 'lib-skeleton-loader', template: "<!-- <h1>SKELETON LOADER!</h1> -->\
|
|
635
|
+
args: [{ selector: 'lib-skeleton-loader', template: "<!-- <h1>SKELETON LOADER!</h1> -->\n<ng-container *ngSwitch=\"type\">\n <div class=\"cards-deck-4\" *ngSwitchCase=\"'tiles'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-3\" *ngSwitchCase=\"'large-tiles'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-52 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-1\" *ngSwitchCase=\"'table'\">\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"border border-light-blue-300 shadow rounded-sm p-4 max-w-sm w-full mx-auto mb-4\">\n <div class=\"animate-pulse flex space-x-4\">\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\"> </div>\n <div class=\"flex-1 space-y-4 py-1\">\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\"> </div>\n <div class=\"space-y-2\">\n <div class=\"h-4 bg-light-blue-400 rounded\"> </div>\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\"> </div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"cards-deck-3\" *ngSwitchDefault>\n <ng-container *ngFor=\"let i of counter(count)\">\n <div class=\"relative p-4 w-full bg-white rounded-lg overflow-hidden shadow hover:shadow-md rounded-lg\">\n <div class=\"animate-pulse flex flex-col\">\n <div class=\"rounded w-full h-52 bg-gray-200\"></div>\n <div class=\"flex flex-col mt-5\">\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\n </div>\n\n <div class=\"flex items-center mt-5\">\n <div>\n <div class=\"rounded-full bg-gray-200 w-10 h-10\"></div>\n </div>\n <div class=\"flex justify-between w-full ml-3\">\n <div class=\"w-5/12 h-3 bg-gray-200 rounded\"></div>\n <div class=\"w-2/12 h-3 bg-gray-200 rounded\"></div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n</ng-container>\n" }]
|
|
636
636
|
}], ctorParameters: function () { return []; }, propDecorators: { count: [{
|
|
637
637
|
type: Input
|
|
638
638
|
}], type: [{
|
|
@@ -753,10 +753,10 @@ class ListViewComponent {
|
|
|
753
753
|
}
|
|
754
754
|
}
|
|
755
755
|
ListViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
756
|
-
ListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ListViewComponent, selector: "lib-list-view", inputs: { busy: "busy", items: "items", showPager: ["show-pager", "showPager"], count: "count", page: "page", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], detailsSectionPropertyCount: ["details-section-property-count", "detailsSectionPropertyCount"], sortOptions: ["sort-options", "sortOptions"], sort: "sort", sortdir: ["sort-dir", "sortdir"], view: "view", tilesCount: ["tiles-count", "tilesCount"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", detailsOpened: "detailsOpened", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged" }, queries: [{ propertyName: "tiles", first: true, predicate: ListTileComponent, descendants: true, read: ListTileComponent }, { propertyName: "details", first: true, predicate: ListDetailsSectionComponent, descendants: true, read: ListDetailsSectionComponent }, { propertyName: "cols", predicate: ListColumnComponent, read: ListColumnComponent }], usesOnChanges: true, ngImport: i0, template: "<div class=\"px-2\">\
|
|
756
|
+
ListViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ListViewComponent, selector: "lib-list-view", inputs: { busy: "busy", items: "items", showPager: ["show-pager", "showPager"], count: "count", page: "page", pageSize: ["page-size", "pageSize"], pageSizeOptions: ["page-size-options", "pageSizeOptions"], detailsSectionPropertyCount: ["details-section-property-count", "detailsSectionPropertyCount"], sortOptions: ["sort-options", "sortOptions"], sort: "sort", sortdir: ["sort-dir", "sortdir"], view: "view", tilesCount: ["tiles-count", "tilesCount"] }, outputs: { pageChanged: "pageChanged", pageSizeChanged: "pageSizeChanged", detailsOpened: "detailsOpened", sortChanged: "sortChanged", sortdirChanged: "sortdirChanged" }, queries: [{ propertyName: "tiles", first: true, predicate: ListTileComponent, descendants: true, read: ListTileComponent }, { propertyName: "details", first: true, predicate: ListDetailsSectionComponent, descendants: true, read: ListDetailsSectionComponent }, { propertyName: "cols", predicate: ListColumnComponent, read: ListColumnComponent }], usesOnChanges: true, ngImport: i0, template: "<div class=\"px-2\">\n\n <lib-pager *ngIf=\"showPager\"\n [page]=\"page\"\n [page-size]=\"pageSize\"\n [count]=\"count\"\n [sort-options]=\"sortOptions\"\n [sort]=\"sort\"\n [sort-dir]=\"sortdir\"\n [busy]=\"busy\"\n (pageChanged)=\"emitPageChanged($event)\"\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\n (sortChanged)=\"emitSortChanged($event)\"\n (sortdirChanged)=\"emitSortdirChanged($event)\">\n </lib-pager>\n</div>\n\n<ng-container [ngSwitch]=\"view\">\n\n <ng-container *ngSwitchCase=\"'tiles'\">\n <div [class]=\"tilesDeckClass\">\n\n <lib-skeleton-loader *ngIf=\"busy\" [count]=\"5\" [type]=\"'tiles'\"></lib-skeleton-loader>\n\n <ng-container *ngIf=\"items && items.length > 0\">\n <ng-container *ngFor=\"let item of items\">\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </ng-container>\n </ng-container>\n\n </div>\n </ng-container>\n\n\n <!-- *ngSwitchCase=\"'gallery'\" -->\n <ng-container *ngSwitchCase=\"'gallery'\">\n <ul role=\"list\" [class]=\"tilesDeckClass\">\n\n <lib-skeleton-loader *ngIf=\"busy\" [count]=\"5\" [type]=\"'tiles'\"></lib-skeleton-loader>\n\n <ng-container *ngIf=\"!busy && items && items.length > 0\">\n <ng-container *ngFor=\"let item of items\">\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </ng-container>\n </ng-container>\n </ul>\n </ng-container>\n\n <!-- *ngSwitchCase=\"'table'\" -->\n <ng-container *ngSwitchDefault>\n\n <div class=\"list-view-container\">\n <div class=\"list-view-container-inner\">\n <table class=\"list-view-table\">\n <thead class=\"list-view-thead\">\n <tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <th class=\"list-view-th-details\"></th>\n </ng-container>\n <ng-container *ngFor=\"let col of columns\">\n <th scope=\"col\"\n [class]=\"col.fullWidth ? fullWidthTHClass : 'list-view-th'\">\n {{col.title}}\n </th>\n </ng-container>\n </tr>\n </thead>\n <tbody class=\"list-view-tbody\" *ngIf=\"busy\">\n <ng-container *ngFor=\"let item of loaderItems;let i=index\">\n <tr class=\"list-view-tr\">\n <ng-container *ngIf=\"detailsSectionSupported\">\n <td class=\"list-view-td-details\"\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\n <button disabled\n type=\"button\"\n class=\"expand-collapse-button\">\n <!-- Heroicon name: solid/plus -->\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\n </button>\n </td>\n <ng-template #hiddenDetailsButton>\n <td class=\"list-view-td-details\"></td>\n </ng-template>\n </ng-container>\n <td *ngFor=\"let col of columns\"\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\n <div class=\"w-full animate-pulse h-8 bg-gray-200 rounded\"></div>\n </td>\n </tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <tr *ngIf=\"item.detailsExpanded\">\n <td [colSpan]=\"columns.length + 1\"\n class=\"list-view-td bg-gray-100\">\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n <tbody class=\"list-view-tbody\" *ngIf=\"!busy\">\n <ng-container *ngFor=\"let item of items;let i=index\">\n <tr class=\"list-view-tr\">\n <ng-container *ngIf=\"detailsSectionSupported\">\n <td class=\"list-view-td-details\"\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\n <button (click)=\"toggleDetails(item)\"\n type=\"button\"\n class=\"expand-collapse-button\">\n <!-- Heroicon name: solid/plus -->\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\n </button>\n </td>\n <ng-template #hiddenDetailsButton>\n <td class=\"list-view-td-details\"></td>\n </ng-template>\n </ng-container>\n <td *ngFor=\"let col of columns\"\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\n <ng-template [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <tr *ngIf=\"item.detailsExpanded\">\n <td [colSpan]=\"columns.length + 1\"\n class=\"list-view-td bg-gray-100\">\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n </table>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!busy && items && items.length === 0\">\n <div class=\"cards-deck-1\">\n <lib-list-view-empty-state></lib-list-view-empty-state>\n </div>\n </ng-container>\n</ng-container>\n\n<ng-content></ng-content>\n", dependencies: [{ 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: PagerComponent, selector: "lib-pager", inputs: ["busy", "count", "page", "page-size", "page-size-options", "sort-options", "sort", "sort-dir"], outputs: ["pageChanged", "pageSizeChanged", "sortChanged", "sortdirChanged"] }, { kind: "component", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: ["title", "sub-title", "new-item-label"] }, { kind: "component", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: ["count", "type"] }] });
|
|
757
757
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ListViewComponent, decorators: [{
|
|
758
758
|
type: Component,
|
|
759
|
-
args: [{ selector: 'lib-list-view', template: "<div class=\"px-2\">\
|
|
759
|
+
args: [{ selector: 'lib-list-view', template: "<div class=\"px-2\">\n\n <lib-pager *ngIf=\"showPager\"\n [page]=\"page\"\n [page-size]=\"pageSize\"\n [count]=\"count\"\n [sort-options]=\"sortOptions\"\n [sort]=\"sort\"\n [sort-dir]=\"sortdir\"\n [busy]=\"busy\"\n (pageChanged)=\"emitPageChanged($event)\"\n (pageSizeChanged)=\"emitPageSizeChanged($event)\"\n (sortChanged)=\"emitSortChanged($event)\"\n (sortdirChanged)=\"emitSortdirChanged($event)\">\n </lib-pager>\n</div>\n\n<ng-container [ngSwitch]=\"view\">\n\n <ng-container *ngSwitchCase=\"'tiles'\">\n <div [class]=\"tilesDeckClass\">\n\n <lib-skeleton-loader *ngIf=\"busy\" [count]=\"5\" [type]=\"'tiles'\"></lib-skeleton-loader>\n\n <ng-container *ngIf=\"items && items.length > 0\">\n <ng-container *ngFor=\"let item of items\">\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </ng-container>\n </ng-container>\n\n </div>\n </ng-container>\n\n\n <!-- *ngSwitchCase=\"'gallery'\" -->\n <ng-container *ngSwitchCase=\"'gallery'\">\n <ul role=\"list\" [class]=\"tilesDeckClass\">\n\n <lib-skeleton-loader *ngIf=\"busy\" [count]=\"5\" [type]=\"'tiles'\"></lib-skeleton-loader>\n\n <ng-container *ngIf=\"!busy && items && items.length > 0\">\n <ng-container *ngFor=\"let item of items\">\n <span *ngIf=\"!tileTemplate || !tileTemplate.template\">template missing..</span>\n <ng-template [ngTemplateOutlet]=\"tileTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </ng-container>\n </ng-container>\n </ul>\n </ng-container>\n\n <!-- *ngSwitchCase=\"'table'\" -->\n <ng-container *ngSwitchDefault>\n\n <div class=\"list-view-container\">\n <div class=\"list-view-container-inner\">\n <table class=\"list-view-table\">\n <thead class=\"list-view-thead\">\n <tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <th class=\"list-view-th-details\"></th>\n </ng-container>\n <ng-container *ngFor=\"let col of columns\">\n <th scope=\"col\"\n [class]=\"col.fullWidth ? fullWidthTHClass : 'list-view-th'\">\n {{col.title}}\n </th>\n </ng-container>\n </tr>\n </thead>\n <tbody class=\"list-view-tbody\" *ngIf=\"busy\">\n <ng-container *ngFor=\"let item of loaderItems;let i=index\">\n <tr class=\"list-view-tr\">\n <ng-container *ngIf=\"detailsSectionSupported\">\n <td class=\"list-view-td-details\"\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\n <button disabled\n type=\"button\"\n class=\"expand-collapse-button\">\n <!-- Heroicon name: solid/plus -->\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\n </button>\n </td>\n <ng-template #hiddenDetailsButton>\n <td class=\"list-view-td-details\"></td>\n </ng-template>\n </ng-container>\n <td *ngFor=\"let col of columns\"\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\n <div class=\"w-full animate-pulse h-8 bg-gray-200 rounded\"></div>\n </td>\n </tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <tr *ngIf=\"item.detailsExpanded\">\n <td [colSpan]=\"columns.length + 1\"\n class=\"list-view-td bg-gray-100\">\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n <tbody class=\"list-view-tbody\" *ngIf=\"!busy\">\n <ng-container *ngFor=\"let item of items;let i=index\">\n <tr class=\"list-view-tr\">\n <ng-container *ngIf=\"detailsSectionSupported\">\n <td class=\"list-view-td-details\"\n *ngIf=\"detailsSectionPropertyCount !== null ? item[detailsSectionPropertyCount] !== 0 : true; else hiddenDetailsButton\">\n <button (click)=\"toggleDetails(item)\"\n type=\"button\"\n class=\"expand-collapse-button\">\n <!-- Heroicon name: solid/plus -->\n <i [class]=\"item.detailsExpanded ? collapseIcon : expandIcon\"></i>\n </button>\n </td>\n <ng-template #hiddenDetailsButton>\n <td class=\"list-view-td-details\"></td>\n </ng-template>\n </ng-container>\n <td *ngFor=\"let col of columns\"\n [class]=\"col.fullWidth ? fullWidthTDClass : 'list-view-td'\">\n <ng-template [ngTemplateOutlet]=\"col.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n <ng-container *ngIf=\"detailsSectionSupported\">\n <tr *ngIf=\"item.detailsExpanded\">\n <td [colSpan]=\"columns.length + 1\"\n class=\"list-view-td bg-gray-100\">\n <ng-template [ngTemplateOutlet]=\"detailsTemplate.template\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-template>\n </td>\n </tr>\n </ng-container>\n </ng-container>\n </tbody>\n </table>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"!busy && items && items.length === 0\">\n <div class=\"cards-deck-1\">\n <lib-list-view-empty-state></lib-list-view-empty-state>\n </div>\n </ng-container>\n</ng-container>\n\n<ng-content></ng-content>\n" }]
|
|
760
760
|
}], ctorParameters: function () { return []; }, propDecorators: { busy: [{
|
|
761
761
|
type: Input
|
|
762
762
|
}], items: [{
|
|
@@ -820,10 +820,10 @@ class CollapsiblePanelComponent {
|
|
|
820
820
|
}
|
|
821
821
|
}
|
|
822
822
|
CollapsiblePanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: CollapsiblePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
823
|
-
CollapsiblePanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: CollapsiblePanelComponent, selector: "lib-collapsible-panel", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"collapsible-panel-container\">\
|
|
823
|
+
CollapsiblePanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: CollapsiblePanelComponent, selector: "lib-collapsible-panel", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"collapsible-panel-container\">\n <div class=\"collapsible-panel-container-shadow\">\n <div class=\"collapsible-panel-container-inner\">\n <button type=\"button\" class=\"collapsible-panel-button\" (click)=\"visible = !visible\">\n <div class=\"collapsible-panel-button-content-container\">\n <span>{{ title }} </span>\n <span class=\"ico-plus\"></span>\n </div>\n </button>\n <div class=\"collapsible-panel-content-container\" *ngIf=\"visible\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
824
824
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: CollapsiblePanelComponent, decorators: [{
|
|
825
825
|
type: Component,
|
|
826
|
-
args: [{ selector: 'lib-collapsible-panel', template: "<div class=\"collapsible-panel-container\">\
|
|
826
|
+
args: [{ selector: 'lib-collapsible-panel', template: "<div class=\"collapsible-panel-container\">\n <div class=\"collapsible-panel-container-shadow\">\n <div class=\"collapsible-panel-container-inner\">\n <button type=\"button\" class=\"collapsible-panel-button\" (click)=\"visible = !visible\">\n <div class=\"collapsible-panel-button-content-container\">\n <span>{{ title }} </span>\n <span class=\"ico-plus\"></span>\n </div>\n </button>\n <div class=\"collapsible-panel-content-container\" *ngIf=\"visible\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
827
827
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
828
828
|
type: Input
|
|
829
829
|
}] } });
|
|
@@ -846,10 +846,10 @@ class KpiTileComponent {
|
|
|
846
846
|
}
|
|
847
847
|
}
|
|
848
848
|
KpiTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: KpiTileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
849
|
-
KpiTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: KpiTileComponent, selector: "lib-kpi-tile", inputs: { title: "title", busy: "busy", kpi: "kpi" }, outputs: { tileAction: "tile-action" }, ngImport: i0, template: "<div class=\"card\"\
|
|
849
|
+
KpiTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: KpiTileComponent, selector: "lib-kpi-tile", inputs: { title: "title", busy: "busy", kpi: "kpi" }, outputs: { tileAction: "tile-action" }, ngImport: i0, template: "<div class=\"card\"\n [ngClass]=\"{'card-deck-busy' : busy }\">\n <div class=\"card-body\">\n <div class=\"kpi-tile-title-container\">\n <a href=\"#\"\n class=\"kpi-tile-action\"\n (click)=\"emitTileAction($event)\">{{title || '-'}}</a>\n </div>\n <p class=\"kpi-tile-value\">{{kpi || '-'}}</p>\n <div class=\"card-footer\">\n <div class=\"text-xs\">\n <a href=\"#\"\n class=\"kpi-tile-action\"\n (click)=\"emitTileAction($event)\">\u03A0\u03B5\u03C1\u03B9\u03C3\u03C3\u03CC\u03C4\u03B5\u03C1\u03B1</a>\n </div>\n </div>\n </div>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
850
850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: KpiTileComponent, decorators: [{
|
|
851
851
|
type: Component,
|
|
852
|
-
args: [{ selector: 'lib-kpi-tile', template: "<div class=\"card\"\
|
|
852
|
+
args: [{ selector: 'lib-kpi-tile', template: "<div class=\"card\"\n [ngClass]=\"{'card-deck-busy' : busy }\">\n <div class=\"card-body\">\n <div class=\"kpi-tile-title-container\">\n <a href=\"#\"\n class=\"kpi-tile-action\"\n (click)=\"emitTileAction($event)\">{{title || '-'}}</a>\n </div>\n <p class=\"kpi-tile-value\">{{kpi || '-'}}</p>\n <div class=\"card-footer\">\n <div class=\"text-xs\">\n <a href=\"#\"\n class=\"kpi-tile-action\"\n (click)=\"emitTileAction($event)\">\u03A0\u03B5\u03C1\u03B9\u03C3\u03C3\u03CC\u03C4\u03B5\u03C1\u03B1</a>\n </div>\n </div>\n </div>\n</div>" }]
|
|
853
853
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
854
854
|
type: Input
|
|
855
855
|
}], busy: [{
|
|
@@ -1088,7 +1088,7 @@ DatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
1088
1088
|
useExisting: forwardRef(() => DatepickerComponent),
|
|
1089
1089
|
multi: true
|
|
1090
1090
|
}
|
|
1091
|
-
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], ngImport: i0, template: "<div class=\"relative flex\"\
|
|
1091
|
+
], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], ngImport: i0, template: "<div class=\"relative flex\"\n (clickOutside)=\"closeCalendar()\">\n\n <input type=\"text\"\n #dateInput\n [readonly]=\"readonly\"\n name=\"dateInput\"\n (blur)=\"onBlur($event)\"\n id=\"dateInput\"\n (focus)=\"showCalendar = false\"\n [value]=\"value | date: displayFormat\"\n class=\"w-full focus:ring-0 focus:outline-none rounded-none sm:text-sm border-gray-300 focus:border-0\"\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\n [placeholder]=\"disabled ? '' : placeholder\">\n\n <button type=\"button\"\n class=\"relative inline-flex items-center px-2 py-2 border border-gray-300 text-sm font-medium rounded-r-sm text-gray-700 bg-gray-50 hover:bg-gray-100 focus:outline-none focus:ring-1 focus:ring-gray-500 focus:border-gray-500\"\n [disabled]=\"disabled\"\n (click)=\"openCalendar()\"\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\n </button>\n\n <div *ngIf=\"showCalendar\"\n class=\"bg-gray-100 mt-10 rounded-sm shadow-md p-4 absolute left-0 z-50 w-full\"\n style=\"height:18rem;min-width:16rem;\"\n name=\"calendar\">\n <div class=\"flex justify-between items-center mb-2\">\n <div>\n <button type=\"button\"\n (click)=\"openYears()\">\n <span class=\"text-lg font-bold text-gray-800\">\n {{monthNames[month]}}\n </span>\n <span class=\"ml-1 text-lg text-gray-600 font-normal\">\n {{year}}</span>\n </button>\n </div>\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25\"\n (click)=\"previousMonth();\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 19l-7-7 7-7\" />\n </svg>\n </button>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25\"\n (click)=\"nextMonth()\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 5l7 7-7 7\" />\n </svg>\n </button>\n </div>\n <ng-template #showYearsPickerTmpl>\n <div>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25 w-1/2\"\n (click)=\"previousYear();\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 19l-7-7 7-7\" />\n </svg>\n </button>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25 w-1/2\"\n (click)=\"nextYear()\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 5l7 7-7 7\" />\n </svg>\n </button>\n </div>\n </ng-template>\n </div>\n\n <div class=\"flex flex-wrap mb-3 -mx-1\"\n *ngIf=\"!showYears; else showCalYearsTmpl\">\n <div *ngFor=\"let day of dayNames\"\n class=\"text-gray-800 font-medium text-center text-sm uppercase\"\n style=\"width: 14.28%\">{{day}}</div>\n </div>\n\n <ng-template #showCalYearsTmpl>\n <div class=\"flex flex-wrap -mx-1 items-center\">\n <div *ngFor=\"let year of showCalendarYears\"\n style=\"width: 18.28%\"\n class=\"px-1 mb-1\">\n <div (click)=\"selectYearValue(year)\"\n class=\"cursor-pointer text-center hover:text-blue-600 text-sm leading-none rounded-full leading-loose transition ease-in-out duration-100\"\n [class]=\"year.selected ? 'bg-gray-700 text-blue-600 font-medium' : 'text-gray-800 hover:bg-gray-800'\">{{year.year}}</div>\n </div>\n </div>\n </ng-template>\n\n <div class=\"flex flex-wrap -mx-1 items-center\"\n *ngIf=\"!showYears\">\n <div *ngFor=\"let blankday of blankDays\"\n style=\"width: 14.28%\"\n class=\"text-center border p-1 border-transparent text-sm opacity-50\">{{blankday}}</div>\n <div *ngFor=\"let date of calendarDates\"\n style=\"width: 14.28%\"\n class=\"px-1 mb-1\">\n <div (click)=\"selectDateValue(date)\"\n class=\"cursor-pointer text-center hover:text-blue-600 text-sm leading-none rounded-full leading-loose transition ease-in-out duration-100\"\n [class]=\"date.selected ? 'bg-gray-700 text-blue-600 font-medium' : 'text-gray-800 hover:bg-gray-800'\">{{date.day}}</div>\n </div>\n </div>\n </div>\n\n</div>", 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: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
|
|
1092
1092
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DatepickerComponent, decorators: [{
|
|
1093
1093
|
type: Component,
|
|
1094
1094
|
args: [{ selector: 'lib-date-picker', providers: [
|
|
@@ -1097,7 +1097,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImpor
|
|
|
1097
1097
|
useExisting: forwardRef(() => DatepickerComponent),
|
|
1098
1098
|
multi: true
|
|
1099
1099
|
}
|
|
1100
|
-
], template: "<div class=\"relative flex\"\
|
|
1100
|
+
], template: "<div class=\"relative flex\"\n (clickOutside)=\"closeCalendar()\">\n\n <input type=\"text\"\n #dateInput\n [readonly]=\"readonly\"\n name=\"dateInput\"\n (blur)=\"onBlur($event)\"\n id=\"dateInput\"\n (focus)=\"showCalendar = false\"\n [value]=\"value | date: displayFormat\"\n class=\"w-full focus:ring-0 focus:outline-none rounded-none sm:text-sm border-gray-300 focus:border-0\"\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\n [placeholder]=\"disabled ? '' : placeholder\">\n\n <button type=\"button\"\n class=\"relative inline-flex items-center px-2 py-2 border border-gray-300 text-sm font-medium rounded-r-sm text-gray-700 bg-gray-50 hover:bg-gray-100 focus:outline-none focus:ring-1 focus:ring-gray-500 focus:border-gray-500\"\n [disabled]=\"disabled\"\n (click)=\"openCalendar()\"\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\n </button>\n\n <div *ngIf=\"showCalendar\"\n class=\"bg-gray-100 mt-10 rounded-sm shadow-md p-4 absolute left-0 z-50 w-full\"\n style=\"height:18rem;min-width:16rem;\"\n name=\"calendar\">\n <div class=\"flex justify-between items-center mb-2\">\n <div>\n <button type=\"button\"\n (click)=\"openYears()\">\n <span class=\"text-lg font-bold text-gray-800\">\n {{monthNames[month]}}\n </span>\n <span class=\"ml-1 text-lg text-gray-600 font-normal\">\n {{year}}</span>\n </button>\n </div>\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25\"\n (click)=\"previousMonth();\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 19l-7-7 7-7\" />\n </svg>\n </button>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25\"\n (click)=\"nextMonth()\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 5l7 7-7 7\" />\n </svg>\n </button>\n </div>\n <ng-template #showYearsPickerTmpl>\n <div>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25 w-1/2\"\n (click)=\"previousYear();\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 19l-7-7 7-7\" />\n </svg>\n </button>\n <button type=\"button\"\n class=\"transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 p-1 rounded-full disabled:opacity-25 w-1/2\"\n (click)=\"nextYear()\">\n <svg class=\"h-6 w-6 text-gray-500 inline-flex\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 5l7 7-7 7\" />\n </svg>\n </button>\n </div>\n </ng-template>\n </div>\n\n <div class=\"flex flex-wrap mb-3 -mx-1\"\n *ngIf=\"!showYears; else showCalYearsTmpl\">\n <div *ngFor=\"let day of dayNames\"\n class=\"text-gray-800 font-medium text-center text-sm uppercase\"\n style=\"width: 14.28%\">{{day}}</div>\n </div>\n\n <ng-template #showCalYearsTmpl>\n <div class=\"flex flex-wrap -mx-1 items-center\">\n <div *ngFor=\"let year of showCalendarYears\"\n style=\"width: 18.28%\"\n class=\"px-1 mb-1\">\n <div (click)=\"selectYearValue(year)\"\n class=\"cursor-pointer text-center hover:text-blue-600 text-sm leading-none rounded-full leading-loose transition ease-in-out duration-100\"\n [class]=\"year.selected ? 'bg-gray-700 text-blue-600 font-medium' : 'text-gray-800 hover:bg-gray-800'\">{{year.year}}</div>\n </div>\n </div>\n </ng-template>\n\n <div class=\"flex flex-wrap -mx-1 items-center\"\n *ngIf=\"!showYears\">\n <div *ngFor=\"let blankday of blankDays\"\n style=\"width: 14.28%\"\n class=\"text-center border p-1 border-transparent text-sm opacity-50\">{{blankday}}</div>\n <div *ngFor=\"let date of calendarDates\"\n style=\"width: 14.28%\"\n class=\"px-1 mb-1\">\n <div (click)=\"selectDateValue(date)\"\n class=\"cursor-pointer text-center hover:text-blue-600 text-sm leading-none rounded-full leading-loose transition ease-in-out duration-100\"\n [class]=\"date.selected ? 'bg-gray-700 text-blue-600 font-medium' : 'text-gray-800 hover:bg-gray-800'\">{{date.day}}</div>\n </div>\n </div>\n </div>\n\n</div>" }]
|
|
1101
1101
|
}], ctorParameters: function () { return []; }, propDecorators: { readonly: [{
|
|
1102
1102
|
type: Input
|
|
1103
1103
|
}], disabled: [{
|
|
@@ -1151,10 +1151,10 @@ class ToasterComponent {
|
|
|
1151
1151
|
}
|
|
1152
1152
|
}
|
|
1153
1153
|
ToasterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ToasterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1154
|
-
ToasterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ToasterComponent, selector: "lib-toaster", inputs: { toast: "toast", i: "i" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div aria-live=\"assertive\"\
|
|
1154
|
+
ToasterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ToasterComponent, selector: "lib-toaster", inputs: { toast: "toast", i: "i" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div aria-live=\"assertive\"\n [ngClass]=\"closed ? 'toast-closed': 'toast z-50'\"\n [ngStyle]=\"isMobile ? { 'margin-bottom.px': i * 85 } : {'margin-top.px': i * 85 }\">\n <div class=\"toast-container\">\n <div class=\"toast-pill\">\n <div class=\"toast-context-padding\">\n <div class=\"toast-context\"\n [ngSwitch]=\"toast?.type\">\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'info'\">\n <svg class=\"h-5 w-5 text-blue-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'success'\">\n <svg class=\"h-5 w-5 text-green-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'error'\">\n <svg class=\"h-5 w-5 text-red-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'warning'\">\n <svg class=\"h-5 w-5 text-yellow-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchDefault>\n <svg class=\"h-5 w-5 text-green-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n </div>\n\n <div class=\"ml-3 w-0 flex-1\">\n <p class=\"toast-title\"\n *ngIf=\"toast?.title\">\n {{toast?.title}}\n </p>\n <p class=\"toast-body\">\n {{toast?.body}}\n </p>\n </div>\n <div class=\"toast-close-icon\">\n <button class=\"toast-close-button\"\n (click)=\"closeToast(i)\">\n <span class=\"sr-only\">Close</span>\n <!-- Heroicon name: solid/x -->\n <svg class=\"h-5 w-5\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", 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: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
|
|
1155
1155
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ToasterComponent, decorators: [{
|
|
1156
1156
|
type: Component,
|
|
1157
|
-
args: [{ selector: 'lib-toaster', template: "<div aria-live=\"assertive\"\
|
|
1157
|
+
args: [{ selector: 'lib-toaster', template: "<div aria-live=\"assertive\"\n [ngClass]=\"closed ? 'toast-closed': 'toast z-50'\"\n [ngStyle]=\"isMobile ? { 'margin-bottom.px': i * 85 } : {'margin-top.px': i * 85 }\">\n <div class=\"toast-container\">\n <div class=\"toast-pill\">\n <div class=\"toast-context-padding\">\n <div class=\"toast-context\"\n [ngSwitch]=\"toast?.type\">\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'info'\">\n <svg class=\"h-5 w-5 text-blue-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'success'\">\n <svg class=\"h-5 w-5 text-green-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'error'\">\n <svg class=\"h-5 w-5 text-red-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchCase=\"'warning'\">\n <svg class=\"h-5 w-5 text-yellow-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z\"\n clip-rule=\"evenodd\" />\n </svg>\n </div>\n <div class=\"toast-icon\"\n *ngSwitchDefault>\n <svg class=\"h-5 w-5 text-green-400\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\" />\n </svg>\n </div>\n\n <div class=\"ml-3 w-0 flex-1\">\n <p class=\"toast-title\"\n *ngIf=\"toast?.title\">\n {{toast?.title}}\n </p>\n <p class=\"toast-body\">\n {{toast?.body}}\n </p>\n </div>\n <div class=\"toast-close-icon\">\n <button class=\"toast-close-button\"\n (click)=\"closeToast(i)\">\n <span class=\"sr-only\">Close</span>\n <!-- Heroicon name: solid/x -->\n <svg class=\"h-5 w-5\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>" }]
|
|
1158
1158
|
}], ctorParameters: function () { return []; }, propDecorators: { toast: [{
|
|
1159
1159
|
type: Input
|
|
1160
1160
|
}], i: [{
|
|
@@ -1180,10 +1180,10 @@ class ToasterContainerComponent {
|
|
|
1180
1180
|
}
|
|
1181
1181
|
}
|
|
1182
1182
|
ToasterContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ToasterContainerComponent, deps: [{ token: ToasterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1183
|
-
ToasterContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ToasterContainerComponent, selector: "lib-toaster-container", ngImport: i0, template: "<lib-toaster *ngFor=\"let toast of toasts; let i=index\" [toast]=\"toast\" [i]=\"i\" (remove)=\"remove($event)\"></lib-toaster>\
|
|
1183
|
+
ToasterContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ToasterContainerComponent, selector: "lib-toaster-container", ngImport: i0, template: "<lib-toaster *ngFor=\"let toast of toasts; let i=index\" [toast]=\"toast\" [i]=\"i\" (remove)=\"remove($event)\"></lib-toaster>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ToasterComponent, selector: "lib-toaster", inputs: ["toast", "i"], outputs: ["remove"] }] });
|
|
1184
1184
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ToasterContainerComponent, decorators: [{
|
|
1185
1185
|
type: Component,
|
|
1186
|
-
args: [{ selector: 'lib-toaster-container', template: "<lib-toaster *ngFor=\"let toast of toasts; let i=index\" [toast]=\"toast\" [i]=\"i\" (remove)=\"remove($event)\"></lib-toaster>\
|
|
1186
|
+
args: [{ selector: 'lib-toaster-container', template: "<lib-toaster *ngFor=\"let toast of toasts; let i=index\" [toast]=\"toast\" [i]=\"i\" (remove)=\"remove($event)\"></lib-toaster>\n" }]
|
|
1187
1187
|
}], ctorParameters: function () { return [{ type: ToasterService }]; } });
|
|
1188
1188
|
|
|
1189
1189
|
class AvatarInitialsComponent {
|
|
@@ -1221,10 +1221,10 @@ class AvatarInitialsComponent {
|
|
|
1221
1221
|
}
|
|
1222
1222
|
}
|
|
1223
1223
|
AvatarInitialsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: AvatarInitialsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1224
|
-
AvatarInitialsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: AvatarInitialsComponent, selector: "lib-avatar-initials", inputs: { name: "name", large: "large" }, ngImport: i0, template: "<div [ngClass]=\"large ? 'avatar-container-large': 'avatar-container'\">\
|
|
1224
|
+
AvatarInitialsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: AvatarInitialsComponent, selector: "lib-avatar-initials", inputs: { name: "name", large: "large" }, ngImport: i0, template: "<div [ngClass]=\"large ? 'avatar-container-large': 'avatar-container'\">\n <span [ngClass]=\"large ? 'avatar-text-large': 'avatar-text'\">{{ initials }}</span>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
1225
1225
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: AvatarInitialsComponent, decorators: [{
|
|
1226
1226
|
type: Component,
|
|
1227
|
-
args: [{ selector: 'lib-avatar-initials', template: "<div [ngClass]=\"large ? 'avatar-container-large': 'avatar-container'\">\
|
|
1227
|
+
args: [{ selector: 'lib-avatar-initials', template: "<div [ngClass]=\"large ? 'avatar-container-large': 'avatar-container'\">\n <span [ngClass]=\"large ? 'avatar-text-large': 'avatar-text'\">{{ initials }}</span>\n</div>\n" }]
|
|
1228
1228
|
}], ctorParameters: function () { return []; }, propDecorators: { name: [{
|
|
1229
1229
|
type: Input
|
|
1230
1230
|
}], large: [{
|
|
@@ -1273,7 +1273,7 @@ ToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
|
|
|
1273
1273
|
useExisting: forwardRef(() => ToggleComponent),
|
|
1274
1274
|
multi: true
|
|
1275
1275
|
}
|
|
1276
|
-
], ngImport: i0, template: "<button type=\"button\"\
|
|
1276
|
+
], ngImport: i0, template: "<button type=\"button\"\n [ngClass]=\"value ? (disabled ? 'on disabled' : 'on') : 'off'\"\n class=\"toggle-button\"\n role=\"switch\"\n aria-checked=\"false\"\n aria-labelledby=\"isPrivate\"\n (click)=\"changeValue()\"\n (blur)=\"onBlur($event)\"\n value=\"{{value}}\"\n [disabled]=\"disabled\"\n [title]=\"disabled ? '\u03A4\u03BF \u03B1\u03C1\u03C7\u03B5\u03AF\u03BF \u03C0\u03C1\u03AD\u03C0\u03B5\u03B9 \u03BD\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B9\u03B4\u03C9\u03C4\u03B9\u03BA\u03CC' : '\u0399\u03B4\u03B9\u03C9\u03C4\u03B9\u03BA\u03CC'\">\n <span aria-hidden=\"true\"\n [ngClass]=\"value ? 'enabled-anim' : 'disabled-anim'\"\n class=\"toggle-span\"></span>\n</button>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
1277
1277
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
1278
1278
|
type: Component,
|
|
1279
1279
|
args: [{ selector: 'lib-toggle', providers: [
|
|
@@ -1282,7 +1282,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImpor
|
|
|
1282
1282
|
useExisting: forwardRef(() => ToggleComponent),
|
|
1283
1283
|
multi: true
|
|
1284
1284
|
}
|
|
1285
|
-
], template: "<button type=\"button\"\
|
|
1285
|
+
], template: "<button type=\"button\"\n [ngClass]=\"value ? (disabled ? 'on disabled' : 'on') : 'off'\"\n class=\"toggle-button\"\n role=\"switch\"\n aria-checked=\"false\"\n aria-labelledby=\"isPrivate\"\n (click)=\"changeValue()\"\n (blur)=\"onBlur($event)\"\n value=\"{{value}}\"\n [disabled]=\"disabled\"\n [title]=\"disabled ? '\u03A4\u03BF \u03B1\u03C1\u03C7\u03B5\u03AF\u03BF \u03C0\u03C1\u03AD\u03C0\u03B5\u03B9 \u03BD\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B9\u03B4\u03C9\u03C4\u03B9\u03BA\u03CC' : '\u0399\u03B4\u03B9\u03C9\u03C4\u03B9\u03BA\u03CC'\">\n <span aria-hidden=\"true\"\n [ngClass]=\"value ? 'enabled-anim' : 'disabled-anim'\"\n class=\"toggle-span\"></span>\n</button>" }]
|
|
1286
1286
|
}], ctorParameters: function () { return []; }, propDecorators: { value: [{
|
|
1287
1287
|
type: Input
|
|
1288
1288
|
}], disabled: [{
|
|
@@ -1343,10 +1343,10 @@ class SidePaneComponent {
|
|
|
1343
1343
|
}
|
|
1344
1344
|
}
|
|
1345
1345
|
SidePaneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SidePaneComponent, deps: [{ token: i1$1.Router }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
|
|
1346
|
-
SidePaneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SidePaneComponent, selector: "lib-side-pane", inputs: { showPane: ["visible", "showPane"] }, outputs: { onComplete: "onComplete" }, ngImport: i0, template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\
|
|
1346
|
+
SidePaneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SidePaneComponent, selector: "lib-side-pane", inputs: { showPane: ["visible", "showPane"] }, outputs: { onComplete: "onComplete" }, ngImport: i0, template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\n <div [class]=\"showPane ? overlayStyle : 'hidden'\" aria-hidden=\"true\"></div>\n <div [class]=\"showPane ? 'side-pane-container' : 'hidden'\">\n <div [class]=\"sizeContainerStyle\">\n <div class=\"side-pane\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1347
1347
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SidePaneComponent, decorators: [{
|
|
1348
1348
|
type: Component,
|
|
1349
|
-
args: [{ selector: 'lib-side-pane', template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\
|
|
1349
|
+
args: [{ selector: 'lib-side-pane', template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\n <div [class]=\"showPane ? overlayStyle : 'hidden'\" aria-hidden=\"true\"></div>\n <div [class]=\"showPane ? 'side-pane-container' : 'hidden'\">\n <div [class]=\"sizeContainerStyle\">\n <div class=\"side-pane\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
1350
1350
|
}], ctorParameters: function () { return [{ type: i1$1.Router }, { type: undefined, decorators: [{
|
|
1351
1351
|
type: Inject,
|
|
1352
1352
|
args: [DOCUMENT]
|
|
@@ -1372,10 +1372,10 @@ class NavLinksListComponent {
|
|
|
1372
1372
|
}
|
|
1373
1373
|
}
|
|
1374
1374
|
NavLinksListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: NavLinksListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1375
|
-
NavLinksListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: { links: "links", activeFragment: ["active-fragment", "activeFragment"], navLinkClass: ["link-class", "navLinkClass"], navLinkActiveClass: ["link-active-class", "navLinkActiveClass"], containerClass: ["container-class", "containerClass"], showIcons: ["show-icons", "showIcons"] }, ngImport: i0, template: "\
|
|
1375
|
+
NavLinksListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: { links: "links", activeFragment: ["active-fragment", "activeFragment"], navLinkClass: ["link-class", "navLinkClass"], navLinkActiveClass: ["link-active-class", "navLinkActiveClass"], containerClass: ["container-class", "containerClass"], showIcons: ["show-icons", "showIcons"] }, ngImport: i0, template: "\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\n <div class=\"nav-link-list-container-inner\">\n <ng-container *ngFor=\"let link of links | async\">\n <ng-container [ngSwitch]=\"link.type\">\n <a *ngSwitchCase=\"'router'\"\n href=\"#\"\n [routerLink]=\"[link.path]\"\n [routerLinkActive]=\"navLinkActiveClass\"\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon + ' mr-3'\"></i>{{ link.text }}\n </a>\n <a *ngSwitchCase=\"'external'\"\n [href]=\"link.path\"\n [attr.target]=\"link.external ? '_blank' : '_self'\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon+ ' mr-3'\"></i>{{ link.text }}\n </a>\n <a *ngSwitchCase=\"'fragment'\"\n routerLink=\".\"\n [fragment]=\"link.path\"\n [class.active]=\"(activeFragment | async) === link.path\"\n [routerLinkActive]=\"navLinkActiveClass\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon+ ' mr-3'\"></i>{{ link.text }}\n </a>\n </ng-container>\n </ng-container>\n </div>\n</div>\n", dependencies: [{ 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: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
1376
1376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: NavLinksListComponent, decorators: [{
|
|
1377
1377
|
type: Component,
|
|
1378
|
-
args: [{ selector: 'lib-nav-links-list', template: "\
|
|
1378
|
+
args: [{ selector: 'lib-nav-links-list', template: "\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\n <div class=\"nav-link-list-container-inner\">\n <ng-container *ngFor=\"let link of links | async\">\n <ng-container [ngSwitch]=\"link.type\">\n <a *ngSwitchCase=\"'router'\"\n href=\"#\"\n [routerLink]=\"[link.path]\"\n [routerLinkActive]=\"navLinkActiveClass\"\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon + ' mr-3'\"></i>{{ link.text }}\n </a>\n <a *ngSwitchCase=\"'external'\"\n [href]=\"link.path\"\n [attr.target]=\"link.external ? '_blank' : '_self'\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon+ ' mr-3'\"></i>{{ link.text }}\n </a>\n <a *ngSwitchCase=\"'fragment'\"\n routerLink=\".\"\n [fragment]=\"link.path\"\n [class.active]=\"(activeFragment | async) === link.path\"\n [routerLinkActive]=\"navLinkActiveClass\"\n [class]=\"navLinkClass\">\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon+ ' mr-3'\"></i>{{ link.text }}\n </a>\n </ng-container>\n </ng-container>\n </div>\n</div>\n" }]
|
|
1379
1379
|
}], ctorParameters: function () { return []; }, propDecorators: { links: [{
|
|
1380
1380
|
type: Input
|
|
1381
1381
|
}], activeFragment: [{
|
|
@@ -1460,10 +1460,10 @@ class ComboboxComponent {
|
|
|
1460
1460
|
}
|
|
1461
1461
|
}
|
|
1462
1462
|
ComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ComboboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1463
|
-
ComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ComboboxComponent, selector: "lib-combobox", inputs: { id: "id", items: "items", itemTemplate: "itemTemplate", selectedItemsFilter: "selectedItemsFilter", selectedItemTemplate: "selectedItemTemplate", busy: "busy", debounceMs: "debounceMs" }, outputs: { onSearch: "onSearch", onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div class=\"relative mt-1\">\
|
|
1463
|
+
ComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ComboboxComponent, selector: "lib-combobox", inputs: { id: "id", items: "items", itemTemplate: "itemTemplate", selectedItemsFilter: "selectedItemsFilter", selectedItemTemplate: "selectedItemTemplate", busy: "busy", debounceMs: "debounceMs" }, outputs: { onSearch: "onSearch", onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div class=\"relative mt-1\">\n <form autocomplete=\"off\" [id]=\"id + '-form'\">\n <input [id]=\"id + '-input'\" type=\"text\" (click)=\"onInputClick()\" (clickOutside)=\"onInputClickOutside()\" (keyup)=\"onInputKeyUp($event)\"\n class=\"w-full rounded-md border border-gray-300 bg-white py-2 pl-3 pr-12 shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 sm:text-sm\" role=\"combobox\" aria-controls=\"options\"\n aria-expanded=\"false\" autocomplete=\"off\" list=\"autocomplete\">\n </form>\n <div class=\"absolute inset-y-0 right-0 flex items-center rounded-r-md px-2 focus:outline-none\">\n <svg *ngIf=\"!busy\" xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\" />\n </svg>\n <svg *ngIf=\"busy\" class=\"animate-spin h-6 w-6 text-gray-400\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"></path>\n </svg>\n </div>\n <ul [id]=\"id + '-options'\" *ngIf=\"showOptions\" class=\"absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm\" role=\"listbox\">\n <li *ngFor=\"let item of items; let i = index;\" [id]=\"'option-'+ i\" (click)=\"onListItemSelected(item)\" role=\"option\" tabindex=\"-1\">\n <ng-container [ngTemplateOutlet]=\"itemTemplate || defaultItemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </li>\n </ul>\n</div>\n<ul *ngIf=\"selectedItems.length > 0\" role=\"list\" class=\"grid grid-cols-1\">\n <li *ngFor=\"let item of selectedItems; let i = index;\" class=\"mt-3\">\n <ng-container [ngTemplateOutlet]=\"selectedItemTemplate || defaultSelectedItemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </li>\n</ul>\n<ng-template #defaultItemTemplate let-item>\n <span class=\"hover:bg-gray-100 relative cursor-pointer select-none py-2 pl-3 pr-3 block truncate\">{{ item }}</span>\n</ng-template>\n<ng-template #defaultSelectedItemTemplate let-item>\n <div class=\"grid grid-cols-1\">\n <div class=\"relative rounded-lg border border-gray-300 bg-white px-6 py-5 shadow-sm flex items-center space-x-3 hover:border-gray-400\">\n <div class=\"flex-1 min-w-0\">\n <div class=\"focus:outline-none\">\n <span class=\"absolute\" aria-hidden=\"true\"></span>\n <p class=\"text-sm font-medium text-gray-900\">{{ item }}</p>\n </div>\n </div>\n <div class=\"ml-4 flex-shrink-0 flex\">\n <button type=\"button\" (click)=\"removeSelectedItem(item)\" class=\"cursor-pointer bg-white rounded-md inline-flex text-gray-400 hover:text-gray-500\">\n <span class=\"sr-only\">Close</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n</ng-template>", dependencies: [{ 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] });
|
|
1464
1464
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ComboboxComponent, decorators: [{
|
|
1465
1465
|
type: Component,
|
|
1466
|
-
args: [{ selector: 'lib-combobox', template: "<div class=\"relative mt-1\">\
|
|
1466
|
+
args: [{ selector: 'lib-combobox', template: "<div class=\"relative mt-1\">\n <form autocomplete=\"off\" [id]=\"id + '-form'\">\n <input [id]=\"id + '-input'\" type=\"text\" (click)=\"onInputClick()\" (clickOutside)=\"onInputClickOutside()\" (keyup)=\"onInputKeyUp($event)\"\n class=\"w-full rounded-md border border-gray-300 bg-white py-2 pl-3 pr-12 shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 sm:text-sm\" role=\"combobox\" aria-controls=\"options\"\n aria-expanded=\"false\" autocomplete=\"off\" list=\"autocomplete\">\n </form>\n <div class=\"absolute inset-y-0 right-0 flex items-center rounded-r-md px-2 focus:outline-none\">\n <svg *ngIf=\"!busy\" xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\" />\n </svg>\n <svg *ngIf=\"busy\" class=\"animate-spin h-6 w-6 text-gray-400\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"></path>\n </svg>\n </div>\n <ul [id]=\"id + '-options'\" *ngIf=\"showOptions\" class=\"absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm\" role=\"listbox\">\n <li *ngFor=\"let item of items; let i = index;\" [id]=\"'option-'+ i\" (click)=\"onListItemSelected(item)\" role=\"option\" tabindex=\"-1\">\n <ng-container [ngTemplateOutlet]=\"itemTemplate || defaultItemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </li>\n </ul>\n</div>\n<ul *ngIf=\"selectedItems.length > 0\" role=\"list\" class=\"grid grid-cols-1\">\n <li *ngFor=\"let item of selectedItems; let i = index;\" class=\"mt-3\">\n <ng-container [ngTemplateOutlet]=\"selectedItemTemplate || defaultSelectedItemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: item }\"></ng-container>\n </li>\n</ul>\n<ng-template #defaultItemTemplate let-item>\n <span class=\"hover:bg-gray-100 relative cursor-pointer select-none py-2 pl-3 pr-3 block truncate\">{{ item }}</span>\n</ng-template>\n<ng-template #defaultSelectedItemTemplate let-item>\n <div class=\"grid grid-cols-1\">\n <div class=\"relative rounded-lg border border-gray-300 bg-white px-6 py-5 shadow-sm flex items-center space-x-3 hover:border-gray-400\">\n <div class=\"flex-1 min-w-0\">\n <div class=\"focus:outline-none\">\n <span class=\"absolute\" aria-hidden=\"true\"></span>\n <p class=\"text-sm font-medium text-gray-900\">{{ item }}</p>\n </div>\n </div>\n <div class=\"ml-4 flex-shrink-0 flex\">\n <button type=\"button\" (click)=\"removeSelectedItem(item)\" class=\"cursor-pointer bg-white rounded-md inline-flex text-gray-400 hover:text-gray-500\">\n <span class=\"sr-only\">Close</span>\n <svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clip-rule=\"evenodd\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n</ng-template>" }]
|
|
1467
1467
|
}], ctorParameters: function () { return []; }, propDecorators: { id: [{
|
|
1468
1468
|
type: Input
|
|
1469
1469
|
}], items: [{
|
|
@@ -1514,19 +1514,19 @@ class LibTabComponent {
|
|
|
1514
1514
|
}
|
|
1515
1515
|
}
|
|
1516
1516
|
LibTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibTabComponent, deps: [{ token: LIBTABGROUP_ACCESSOR, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1517
|
-
LibTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibTabComponent, selector: "lib-tab", inputs: { label: "label", id: "id" }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
|
|
1518
|
-
<ng-template>
|
|
1519
|
-
<ng-content></ng-content>
|
|
1520
|
-
</ng-template>
|
|
1517
|
+
LibTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibTabComponent, selector: "lib-tab", inputs: { label: "label", id: "id" }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
|
|
1518
|
+
<ng-template>
|
|
1519
|
+
<ng-content></ng-content>
|
|
1520
|
+
</ng-template>
|
|
1521
1521
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1522
1522
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibTabComponent, decorators: [{
|
|
1523
1523
|
type: Component,
|
|
1524
1524
|
args: [{
|
|
1525
1525
|
selector: 'lib-tab',
|
|
1526
|
-
template: `
|
|
1527
|
-
<ng-template>
|
|
1528
|
-
<ng-content></ng-content>
|
|
1529
|
-
</ng-template>
|
|
1526
|
+
template: `
|
|
1527
|
+
<ng-template>
|
|
1528
|
+
<ng-content></ng-content>
|
|
1529
|
+
</ng-template>
|
|
1530
1530
|
`,
|
|
1531
1531
|
encapsulation: ViewEncapsulation.None,
|
|
1532
1532
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
@@ -1586,12 +1586,12 @@ class LibTabGroupComponent {
|
|
|
1586
1586
|
LibTabGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibTabGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1587
1587
|
LibTabGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibTabGroupComponent, selector: "lib-tab-group", outputs: { tabChanged: "tabChanged" }, providers: [
|
|
1588
1588
|
{ provide: LIBTABGROUP_ACCESSOR, useExisting: forwardRef(() => LibTabGroupComponent) }
|
|
1589
|
-
], queries: [{ propertyName: "tabs", predicate: LibTabComponent, descendants: true }], ngImport: i0, template: "<div class=\"sm:hidden\">\
|
|
1589
|
+
], queries: [{ propertyName: "tabs", predicate: LibTabComponent, descendants: true }], ngImport: i0, template: "<div class=\"sm:hidden\">\n <label for=\"tabs\" class=\"sr-only\">Select a tab</label>\n <select id=\"tabs\" name=\"tabs\" (change)=\"onTabSelectChanged(+tabsSelect.value)\" class=\"tab-group-select\" #tabsSelect>\n <option [value]=\"i\" *ngFor=\"let tab of tabs; let i = index\">{{ tab.label }}</option>\n </select>\n</div>\n<div class=\"hidden sm:block\">\n <div class=\"tab-group-container\">\n <nav class=\"-mb-px flex space-x-8\" aria-label=\"Tabs\">\n <a *ngFor=\"let tab of tabs\" href=\"javascript:void(0)\" [class.tab]=\"!tab.isActive\" [class.tab-active]=\"tab.isActive\" (click)=\"onTabChanged(tab)\">\n {{ tab.label }}\n </a>\n </nav>\n </div>\n</div>\n<div *ngIf=\"currentTab?.content\">\n <ng-container [ngTemplateOutlet]=\"currentTab!.content\"></ng-container>\n</div>", dependencies: [{ 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
1590
1590
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibTabGroupComponent, decorators: [{
|
|
1591
1591
|
type: Component,
|
|
1592
1592
|
args: [{ selector: 'lib-tab-group', providers: [
|
|
1593
1593
|
{ provide: LIBTABGROUP_ACCESSOR, useExisting: forwardRef(() => LibTabGroupComponent) }
|
|
1594
|
-
], template: "<div class=\"sm:hidden\">\
|
|
1594
|
+
], template: "<div class=\"sm:hidden\">\n <label for=\"tabs\" class=\"sr-only\">Select a tab</label>\n <select id=\"tabs\" name=\"tabs\" (change)=\"onTabSelectChanged(+tabsSelect.value)\" class=\"tab-group-select\" #tabsSelect>\n <option [value]=\"i\" *ngFor=\"let tab of tabs; let i = index\">{{ tab.label }}</option>\n </select>\n</div>\n<div class=\"hidden sm:block\">\n <div class=\"tab-group-container\">\n <nav class=\"-mb-px flex space-x-8\" aria-label=\"Tabs\">\n <a *ngFor=\"let tab of tabs\" href=\"javascript:void(0)\" [class.tab]=\"!tab.isActive\" [class.tab-active]=\"tab.isActive\" (click)=\"onTabChanged(tab)\">\n {{ tab.label }}\n </a>\n </nav>\n </div>\n</div>\n<div *ngIf=\"currentTab?.content\">\n <ng-container [ngTemplateOutlet]=\"currentTab!.content\"></ng-container>\n</div>" }]
|
|
1595
1595
|
}], ctorParameters: function () { return []; }, propDecorators: { tabs: [{
|
|
1596
1596
|
type: ContentChildren,
|
|
1597
1597
|
args: [LibTabComponent, { descendants: true }]
|
|
@@ -1666,19 +1666,19 @@ class LibStepComponent {
|
|
|
1666
1666
|
}
|
|
1667
1667
|
}
|
|
1668
1668
|
LibStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibStepComponent, deps: [{ token: LIBSTEPPER_ACCESSOR, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1669
|
-
LibStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibStepComponent, selector: "lib-step", inputs: { class: "class", stepControl: "stepControl" }, queries: [{ propertyName: "stepLabel", first: true, predicate: LibStepLabelDirective, descendants: true }, { propertyName: "stepInfo", first: true, predicate: LibStepInfoDirective, descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
|
|
1670
|
-
<ng-template>
|
|
1671
|
-
<ng-content></ng-content>
|
|
1672
|
-
</ng-template>
|
|
1669
|
+
LibStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibStepComponent, selector: "lib-step", inputs: { class: "class", stepControl: "stepControl" }, queries: [{ propertyName: "stepLabel", first: true, predicate: LibStepLabelDirective, descendants: true }, { propertyName: "stepInfo", first: true, predicate: LibStepInfoDirective, descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
|
|
1670
|
+
<ng-template>
|
|
1671
|
+
<ng-content></ng-content>
|
|
1672
|
+
</ng-template>
|
|
1673
1673
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1674
1674
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibStepComponent, decorators: [{
|
|
1675
1675
|
type: Component,
|
|
1676
1676
|
args: [{
|
|
1677
1677
|
selector: 'lib-step',
|
|
1678
|
-
template: `
|
|
1679
|
-
<ng-template>
|
|
1680
|
-
<ng-content></ng-content>
|
|
1681
|
-
</ng-template>
|
|
1678
|
+
template: `
|
|
1679
|
+
<ng-template>
|
|
1680
|
+
<ng-content></ng-content>
|
|
1681
|
+
</ng-template>
|
|
1682
1682
|
`,
|
|
1683
1683
|
encapsulation: ViewEncapsulation.None,
|
|
1684
1684
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
@@ -1777,12 +1777,12 @@ class LibStepperComponent {
|
|
|
1777
1777
|
LibStepperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1778
1778
|
LibStepperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LibStepperComponent, selector: "lib-stepper", inputs: { linear: "linear", type: "type" }, outputs: { stepChanged: "stepChanged" }, providers: [
|
|
1779
1779
|
{ provide: LIBSTEPPER_ACCESSOR, useExisting: forwardRef(() => LibStepperComponent) }
|
|
1780
|
-
], queries: [{ propertyName: "steps", predicate: LibStepComponent, descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\r\n <!-- Bullets -->\r\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Bullets\">\r\n <p class=\"text-sm font-medium\">Step {{ currentStepIndex + 1 }} of {{ steps.length }}</p>\r\n <ol role=\"list\" class=\"ml-8 flex items-center space-x-5\">\r\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\r\n <!-- Completed Step -->\r\n <div class=\"block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"relative flex items-center justify-center\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"absolute w-5 h-5 p-px flex\" aria-hidden=\"true\">\r\n <span class=\"w-full h-full rounded-full bg-blue-200\"></span>\r\n </span>\r\n <span class=\"relative block w-2.5 h-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div href=\"#\" class=\"block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Bullets & Text -->\r\n <div class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.BulletsAndText\">\r\n <nav aria-label=\"Progress\">\r\n <ol role=\"list\" class=\"space-y-6\">\r\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\r\n <!-- Complete Step -->\r\n <div class=\"group\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"flex items-start\">\r\n <span class=\"flex-shrink-0 relative h-5 w-5 flex items-center justify-center\">\r\n <svg class=\"h-full w-full text-blue-600 group-hover:text-blue-800\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n <span class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"flex items-start\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\r\n <span class=\"absolute h-4 w-4 rounded-full bg-blue-200\"></span>\r\n <span class=\"relative block w-2 h-2 bg-blue-600 rounded-full\"></span>\r\n </span>\r\n <span class=\"ml-3 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"group\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"flex items-start\">\r\n <div class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\r\n <div class=\"h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400\"></div>\r\n </div>\r\n <p class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n </div>\r\n <!-- Circles -->\r\n <nav class=\"flex justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Circles\">\r\n <ol class=\"flex items-center\" role=\"list\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pr-8 sm:pr-20 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-blue-600\"></div>\r\n </div>\r\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full hover:bg-blue-900\">\r\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n <!-- Active Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Active\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\r\n </div>\r\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\" aria-current=\"step\">\r\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n <!-- Upcoming Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\r\n </div>\r\n <div class=\"group relative w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full hover:border-gray-400\">\r\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Circles With Text -->\r\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.CirclesWithText\">\r\n <ol role=\"list\" class=\"overflow-hidden\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pb-10 cursor-pointer\">\r\n <!-- Complete Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-blue-600\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div class=\"relative flex items-start group\">\r\n <span class=\"h-9 flex items-center\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\r\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n <!-- Active Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Active\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div class=\"relative flex items-start group\" aria-current=\"step\">\r\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\">\r\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\"></span>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n <!-- Upcoming Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div href=\"#\" class=\"relative flex items-start group\">\r\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\r\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\"></span>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase text-gray-500\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Panels -->\r\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Panels\">\r\n <ol role=\"list\" class=\"border border-gray-300 rounded-md divide-y divide-gray-300 md:flex md:divide-y-0\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative md:flex-1 md:flex cursor-pointer\">\r\n <!-- Completed step -->\r\n <div class=\"group flex items-center w-full\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\r\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Active step -->\r\n <div class=\"px-6 py-4 flex items-center text-sm font-medium\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\r\n <span class=\"text-blue-600\">{{ (step.index + 1) }}</span>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming step -->\r\n <div class=\"group flex items-center\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\r\n <span class=\"text-gray-500 group-hover:text-gray-900\">{{ (step.index + 1) }}</span>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Arrow separator for lg screens and up -->\r\n <div *ngIf=\"!step.isLast\" class=\"hidden md:block absolute top-0 right-0 h-full w-5\" aria-hidden=\"true\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 22 80\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0 -2L20 40L0 82\" vector-effect=\"non-scaling-stroke\" stroke=\"currentcolor\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Panels With Border -->\r\n <div class=\"lg:border-t lg:border-b lg:border-gray-200\" *ngSwitchCase=\"StepperType.PanelsWithBorder\">\r\n <nav class=\"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8\" aria-label=\"Progress\">\r\n <ol role=\"list\" class=\"rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative overflow-hidden lg:flex-1 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <div class=\"border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0\" *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"group\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full\">\r\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"border border-gray-200 overflow-hidden lg:border-0\" *ngIf=\"step.state === StepState.Active\">\r\n <div aria-current=\"step\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\r\n <span class=\"text-blue-600\">{{ step.index + 1 }}</span>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold text-blue-600 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Separator -->\r\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"group\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full\">\r\n <span class=\"text-gray-500\">{{ step.index + 1 }}</span>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold text-gray-500 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Separator -->\r\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\r\n </svg>\r\n </div>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n </div>\r\n <!-- Progress -->\r\n <div *ngSwitchCase=\"StepperType.Progress\">\r\n <!-- <h4 class=\"sr-only\">Status</h4>\r\n <p class=\"text-sm font-medium text-gray-900\">Migrating MySQL database...</p> -->\r\n <div class=\"mt-6\" aria-hidden=\"true\">\r\n <div class=\"bg-gray-200 rounded-full overflow-hidden\">\r\n <div class=\"h-2 bg-blue-600 rounded-full\" [style.width]=\"(((currentStepIndex + 1) / steps.length) * 100) + '%'\"></div>\r\n </div>\r\n <div class=\"hidden sm:grid grid-cols-4 text-sm font-medium text-gray-600 mt-6\">\r\n <div *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"text-blue-600 cursor-pointer\">\r\n <ng-container *ngIf=\"step.stepLabel\" [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Simple -->\r\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Simple\">\r\n <ol role=\"list\" class=\"space-y-4 md:flex md:space-y-0 md:space-x-8\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"md:flex-1 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-blue-600 hover:border-blue-800 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase group-hover:text-blue-800\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"pl-4 py-2 flex flex-col border-l-4 border-blue-600 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-gray-200 hover:border-gray-300 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"text-xs text-gray-500 font-semibold tracking-wide uppercase group-hover:text-gray-700\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n</ng-container>\r\n<ng-container *ngFor=\"let step of steps\">\r\n <ng-container *ngIf=\"step.state === StepState.Active\" [ngTemplateOutlet]=\"step.content\"></ng-container>\r\n</ng-container>", dependencies: [{ 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
|
|
1780
|
+
], queries: [{ propertyName: "steps", predicate: LibStepComponent, descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\n <!-- Bullets -->\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Bullets\">\n <p class=\"text-sm font-medium\">Step {{ currentStepIndex + 1 }} of {{ steps.length }}</p>\n <ol role=\"list\" class=\"ml-8 flex items-center space-x-5\">\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\n <!-- Completed Step -->\n <div class=\"block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n <!-- Active Step -->\n <div class=\"relative flex items-center justify-center\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"absolute w-5 h-5 p-px flex\" aria-hidden=\"true\">\n <span class=\"w-full h-full rounded-full bg-blue-200\"></span>\n </span>\n <span class=\"relative block w-2.5 h-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n <!-- Upcoming Step -->\n <div href=\"#\" class=\"block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n </li>\n </ol>\n </nav>\n <!-- Bullets & Text -->\n <div class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.BulletsAndText\">\n <nav aria-label=\"Progress\">\n <ol role=\"list\" class=\"space-y-6\">\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\n <!-- Complete Step -->\n <div class=\"group\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"flex items-start\">\n <span class=\"flex-shrink-0 relative h-5 w-5 flex items-center justify-center\">\n <svg class=\"h-full w-full text-blue-600 group-hover:text-blue-800\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n <span class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Active Step -->\n <div class=\"flex items-start\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\n <span class=\"absolute h-4 w-4 rounded-full bg-blue-200\"></span>\n <span class=\"relative block w-2 h-2 bg-blue-600 rounded-full\"></span>\n </span>\n <span class=\"ml-3 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming Step -->\n <div class=\"group\" *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"flex items-start\">\n <div class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\n <div class=\"h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400\"></div>\n </div>\n <p class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </p>\n </div>\n </div>\n </li>\n </ol>\n </nav>\n </div>\n <!-- Circles -->\n <nav class=\"flex justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Circles\">\n <ol class=\"flex items-center\" role=\"list\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pr-8 sm:pr-20 cursor-pointer\">\n <!-- Completed Step -->\n <ng-container *ngIf=\"step.state === StepState.Completed\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-blue-600\"></div>\n </div>\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full hover:bg-blue-900\">\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n <!-- Active Step -->\n <ng-container *ngIf=\"step.state === StepState.Active\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\n </div>\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\" aria-current=\"step\">\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n <!-- Upcoming Step -->\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\n </div>\n <div class=\"group relative w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full hover:border-gray-400\">\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n </li>\n </ol>\n </nav>\n <!-- Circles With Text -->\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.CirclesWithText\">\n <ol role=\"list\" class=\"overflow-hidden\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pb-10 cursor-pointer\">\n <!-- Complete Step -->\n <ng-container *ngIf=\"step.state === StepState.Completed\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-blue-600\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div class=\"relative flex items-start group\">\n <span class=\"h-9 flex items-center\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n <!-- Active Step -->\n <ng-container *ngIf=\"step.state === StepState.Active\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div class=\"relative flex items-start group\" aria-current=\"step\">\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\">\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\"></span>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n <!-- Upcoming Step -->\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div href=\"#\" class=\"relative flex items-start group\">\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\"></span>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase text-gray-500\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n </li>\n </ol>\n </nav>\n <!-- Panels -->\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Panels\">\n <ol role=\"list\" class=\"border border-gray-300 rounded-md divide-y divide-gray-300 md:flex md:divide-y-0\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative md:flex-1 md:flex cursor-pointer\">\n <!-- Completed step -->\n <div class=\"group flex items-center w-full\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n <span class=\"ml-4 text-sm font-medium text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Active step -->\n <div class=\"px-6 py-4 flex items-center text-sm font-medium\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\n <span class=\"text-blue-600\">{{ (step.index + 1) }}</span>\n </span>\n <span class=\"ml-4 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming step -->\n <div class=\"group flex items-center\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\n <span class=\"text-gray-500 group-hover:text-gray-900\">{{ (step.index + 1) }}</span>\n </span>\n <span class=\"ml-4 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Arrow separator for lg screens and up -->\n <div *ngIf=\"!step.isLast\" class=\"hidden md:block absolute top-0 right-0 h-full w-5\" aria-hidden=\"true\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 22 80\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0 -2L20 40L0 82\" vector-effect=\"non-scaling-stroke\" stroke=\"currentcolor\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </li>\n </ol>\n </nav>\n <!-- Panels With Border -->\n <div class=\"lg:border-t lg:border-b lg:border-gray-200\" *ngSwitchCase=\"StepperType.PanelsWithBorder\">\n <nav class=\"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8\" aria-label=\"Progress\">\n <ol role=\"list\" class=\"rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative overflow-hidden lg:flex-1 cursor-pointer\">\n <!-- Completed Step -->\n <div class=\"border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0\" *ngIf=\"step.state === StepState.Completed\">\n <div class=\"group\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full\">\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n </div>\n <!-- Active Step -->\n <div class=\"border border-gray-200 overflow-hidden lg:border-0\" *ngIf=\"step.state === StepState.Active\">\n <div aria-current=\"step\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\n <span class=\"text-blue-600\">{{ step.index + 1 }}</span>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold text-blue-600 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n <!-- Separator -->\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\n </svg>\n </div>\n </div>\n <!-- Upcoming Step -->\n <div class=\"border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0\" *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"group\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full\">\n <span class=\"text-gray-500\">{{ step.index + 1 }}</span>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold text-gray-500 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n <!-- Separator -->\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\n </svg>\n </div>\n </div>\n </li>\n </ol>\n </nav>\n </div>\n <!-- Progress -->\n <div *ngSwitchCase=\"StepperType.Progress\">\n <!-- <h4 class=\"sr-only\">Status</h4>\n <p class=\"text-sm font-medium text-gray-900\">Migrating MySQL database...</p> -->\n <div class=\"mt-6\" aria-hidden=\"true\">\n <div class=\"bg-gray-200 rounded-full overflow-hidden\">\n <div class=\"h-2 bg-blue-600 rounded-full\" [style.width]=\"(((currentStepIndex + 1) / steps.length) * 100) + '%'\"></div>\n </div>\n <div class=\"hidden sm:grid grid-cols-4 text-sm font-medium text-gray-600 mt-6\">\n <div *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"text-blue-600 cursor-pointer\">\n <ng-container *ngIf=\"step.stepLabel\" [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n <!-- Simple -->\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Simple\">\n <ol role=\"list\" class=\"space-y-4 md:flex md:space-y-0 md:space-x-8\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"md:flex-1 cursor-pointer\">\n <!-- Completed Step -->\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-blue-600 hover:border-blue-800 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase group-hover:text-blue-800\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Active Step -->\n <div class=\"pl-4 py-2 flex flex-col border-l-4 border-blue-600 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming Step -->\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-gray-200 hover:border-gray-300 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"text-xs text-gray-500 font-semibold tracking-wide uppercase group-hover:text-gray-700\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n </li>\n </ol>\n </nav>\n</ng-container>\n<ng-container *ngFor=\"let step of steps\">\n <ng-container *ngIf=\"step.state === StepState.Active\" [ngTemplateOutlet]=\"step.content\"></ng-container>\n</ng-container>", dependencies: [{ 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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
|
|
1781
1781
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LibStepperComponent, decorators: [{
|
|
1782
1782
|
type: Component,
|
|
1783
1783
|
args: [{ selector: 'lib-stepper', providers: [
|
|
1784
1784
|
{ provide: LIBSTEPPER_ACCESSOR, useExisting: forwardRef(() => LibStepperComponent) }
|
|
1785
|
-
], template: "<ng-container [ngSwitch]=\"type\">\r\n <!-- Bullets -->\r\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Bullets\">\r\n <p class=\"text-sm font-medium\">Step {{ currentStepIndex + 1 }} of {{ steps.length }}</p>\r\n <ol role=\"list\" class=\"ml-8 flex items-center space-x-5\">\r\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\r\n <!-- Completed Step -->\r\n <div class=\"block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"relative flex items-center justify-center\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"absolute w-5 h-5 p-px flex\" aria-hidden=\"true\">\r\n <span class=\"w-full h-full rounded-full bg-blue-200\"></span>\r\n </span>\r\n <span class=\"relative block w-2.5 h-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div href=\"#\" class=\"block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"sr-only\">Step {{ step.index }}</span>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Bullets & Text -->\r\n <div class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.BulletsAndText\">\r\n <nav aria-label=\"Progress\">\r\n <ol role=\"list\" class=\"space-y-6\">\r\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\r\n <!-- Complete Step -->\r\n <div class=\"group\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"flex items-start\">\r\n <span class=\"flex-shrink-0 relative h-5 w-5 flex items-center justify-center\">\r\n <svg class=\"h-full w-full text-blue-600 group-hover:text-blue-800\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n <span class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"flex items-start\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\r\n <span class=\"absolute h-4 w-4 rounded-full bg-blue-200\"></span>\r\n <span class=\"relative block w-2 h-2 bg-blue-600 rounded-full\"></span>\r\n </span>\r\n <span class=\"ml-3 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"group\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"flex items-start\">\r\n <div class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\r\n <div class=\"h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400\"></div>\r\n </div>\r\n <p class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n </div>\r\n <!-- Circles -->\r\n <nav class=\"flex justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Circles\">\r\n <ol class=\"flex items-center\" role=\"list\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pr-8 sm:pr-20 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-blue-600\"></div>\r\n </div>\r\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full hover:bg-blue-900\">\r\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n <!-- Active Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Active\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\r\n </div>\r\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\" aria-current=\"step\">\r\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n <!-- Upcoming Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\r\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\r\n </div>\r\n <div class=\"group relative w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full hover:border-gray-400\">\r\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\" aria-hidden=\"true\"></span>\r\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\r\n </div>\r\n </ng-container>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Circles With Text -->\r\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.CirclesWithText\">\r\n <ol role=\"list\" class=\"overflow-hidden\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pb-10 cursor-pointer\">\r\n <!-- Complete Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-blue-600\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div class=\"relative flex items-start group\">\r\n <span class=\"h-9 flex items-center\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\r\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n <!-- Active Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Active\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div class=\"relative flex items-start group\" aria-current=\"step\">\r\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\">\r\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\"></span>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n <!-- Upcoming Step -->\r\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\r\n <div href=\"#\" class=\"relative flex items-start group\">\r\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\r\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\r\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\"></span>\r\n </span>\r\n </span>\r\n <span class=\"ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase text-gray-500\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n </ng-container>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Panels -->\r\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Panels\">\r\n <ol role=\"list\" class=\"border border-gray-300 rounded-md divide-y divide-gray-300 md:flex md:divide-y-0\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative md:flex-1 md:flex cursor-pointer\">\r\n <!-- Completed step -->\r\n <div class=\"group flex items-center w-full\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\r\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Active step -->\r\n <div class=\"px-6 py-4 flex items-center text-sm font-medium\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\r\n <span class=\"text-blue-600\">{{ (step.index + 1) }}</span>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming step -->\r\n <div class=\"group flex items-center\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\r\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\r\n <span class=\"text-gray-500 group-hover:text-gray-900\">{{ (step.index + 1) }}</span>\r\n </span>\r\n <span class=\"ml-4 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Arrow separator for lg screens and up -->\r\n <div *ngIf=\"!step.isLast\" class=\"hidden md:block absolute top-0 right-0 h-full w-5\" aria-hidden=\"true\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 22 80\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0 -2L20 40L0 82\" vector-effect=\"non-scaling-stroke\" stroke=\"currentcolor\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n <!-- Panels With Border -->\r\n <div class=\"lg:border-t lg:border-b lg:border-gray-200\" *ngSwitchCase=\"StepperType.PanelsWithBorder\">\r\n <nav class=\"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8\" aria-label=\"Progress\">\r\n <ol role=\"list\" class=\"rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative overflow-hidden lg:flex-1 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <div class=\"border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0\" *ngIf=\"step.state === StepState.Completed\">\r\n <div class=\"group\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full\">\r\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\r\n </svg>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"border border-gray-200 overflow-hidden lg:border-0\" *ngIf=\"step.state === StepState.Active\">\r\n <div aria-current=\"step\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\r\n <span class=\"text-blue-600\">{{ step.index + 1 }}</span>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold text-blue-600 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Separator -->\r\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <div class=\"group\">\r\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\r\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\r\n <span class=\"flex-shrink-0\">\r\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full\">\r\n <span class=\"text-gray-500\">{{ step.index + 1 }}</span>\r\n </span>\r\n </span>\r\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\r\n <span class=\"text-xs font-semibold text-gray-500 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\r\n </span>\r\n </span>\r\n </span>\r\n </div>\r\n <!-- Separator -->\r\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\r\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\r\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\r\n </svg>\r\n </div>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n </div>\r\n <!-- Progress -->\r\n <div *ngSwitchCase=\"StepperType.Progress\">\r\n <!-- <h4 class=\"sr-only\">Status</h4>\r\n <p class=\"text-sm font-medium text-gray-900\">Migrating MySQL database...</p> -->\r\n <div class=\"mt-6\" aria-hidden=\"true\">\r\n <div class=\"bg-gray-200 rounded-full overflow-hidden\">\r\n <div class=\"h-2 bg-blue-600 rounded-full\" [style.width]=\"(((currentStepIndex + 1) / steps.length) * 100) + '%'\"></div>\r\n </div>\r\n <div class=\"hidden sm:grid grid-cols-4 text-sm font-medium text-gray-600 mt-6\">\r\n <div *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"text-blue-600 cursor-pointer\">\r\n <ng-container *ngIf=\"step.stepLabel\" [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Simple -->\r\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Simple\">\r\n <ol role=\"list\" class=\"space-y-4 md:flex md:space-y-0 md:space-x-8\">\r\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"md:flex-1 cursor-pointer\">\r\n <!-- Completed Step -->\r\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-blue-600 hover:border-blue-800 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Completed\">\r\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase group-hover:text-blue-800\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Active Step -->\r\n <div class=\"pl-4 py-2 flex flex-col border-l-4 border-blue-600 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\r\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n <!-- Upcoming Step -->\r\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-gray-200 hover:border-gray-300 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Upcoming\">\r\n <span class=\"text-xs text-gray-500 font-semibold tracking-wide uppercase group-hover:text-gray-700\">Step {{ step.index + 1 }}</span>\r\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\r\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\r\n </span>\r\n </div>\r\n </li>\r\n </ol>\r\n </nav>\r\n</ng-container>\r\n<ng-container *ngFor=\"let step of steps\">\r\n <ng-container *ngIf=\"step.state === StepState.Active\" [ngTemplateOutlet]=\"step.content\"></ng-container>\r\n</ng-container>" }]
|
|
1785
|
+
], template: "<ng-container [ngSwitch]=\"type\">\n <!-- Bullets -->\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Bullets\">\n <p class=\"text-sm font-medium\">Step {{ currentStepIndex + 1 }} of {{ steps.length }}</p>\n <ol role=\"list\" class=\"ml-8 flex items-center space-x-5\">\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\n <!-- Completed Step -->\n <div class=\"block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n <!-- Active Step -->\n <div class=\"relative flex items-center justify-center\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"absolute w-5 h-5 p-px flex\" aria-hidden=\"true\">\n <span class=\"w-full h-full rounded-full bg-blue-200\"></span>\n </span>\n <span class=\"relative block w-2.5 h-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n <!-- Upcoming Step -->\n <div href=\"#\" class=\"block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"sr-only\">Step {{ step.index }}</span>\n </div>\n </li>\n </ol>\n </nav>\n <!-- Bullets & Text -->\n <div class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.BulletsAndText\">\n <nav aria-label=\"Progress\">\n <ol role=\"list\" class=\"space-y-6\">\n <li class=\"cursor-pointer\" *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\">\n <!-- Complete Step -->\n <div class=\"group\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"flex items-start\">\n <span class=\"flex-shrink-0 relative h-5 w-5 flex items-center justify-center\">\n <svg class=\"h-full w-full text-blue-600 group-hover:text-blue-800\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n <span class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Active Step -->\n <div class=\"flex items-start\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\n <span class=\"absolute h-4 w-4 rounded-full bg-blue-200\"></span>\n <span class=\"relative block w-2 h-2 bg-blue-600 rounded-full\"></span>\n </span>\n <span class=\"ml-3 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming Step -->\n <div class=\"group\" *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"flex items-start\">\n <div class=\"flex-shrink-0 h-5 w-5 relative flex items-center justify-center\" aria-hidden=\"true\">\n <div class=\"h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400\"></div>\n </div>\n <p class=\"ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </p>\n </div>\n </div>\n </li>\n </ol>\n </nav>\n </div>\n <!-- Circles -->\n <nav class=\"flex justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Circles\">\n <ol class=\"flex items-center\" role=\"list\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pr-8 sm:pr-20 cursor-pointer\">\n <!-- Completed Step -->\n <ng-container *ngIf=\"step.state === StepState.Completed\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-blue-600\"></div>\n </div>\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full hover:bg-blue-900\">\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n <!-- Active Step -->\n <ng-container *ngIf=\"step.state === StepState.Active\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\n </div>\n <div class=\"relative w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\" aria-current=\"step\">\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n <!-- Upcoming Step -->\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"absolute inset-0 flex items-center\" aria-hidden=\"true\">\n <div class=\"h-0.5 w-full bg-gray-200\"></div>\n </div>\n <div class=\"group relative w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full hover:border-gray-400\">\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Step {{ step.index + 1 }}</span>\n </div>\n </ng-container>\n </li>\n </ol>\n </nav>\n <!-- Circles With Text -->\n <nav class=\"flex items-center justify-center\" aria-label=\"Progress\" *ngSwitchCase=\"StepperType.CirclesWithText\">\n <ol role=\"list\" class=\"overflow-hidden\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative pb-10 cursor-pointer\">\n <!-- Complete Step -->\n <ng-container *ngIf=\"step.state === StepState.Completed\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-blue-600\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div class=\"relative flex items-start group\">\n <span class=\"h-9 flex items-center\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\n <svg class=\"w-5 h-5 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n <!-- Active Step -->\n <ng-container *ngIf=\"step.state === StepState.Active\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div class=\"relative flex items-start group\" aria-current=\"step\">\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-blue-600 rounded-full\">\n <span class=\"h-2.5 w-2.5 bg-blue-600 rounded-full\"></span>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n <!-- Upcoming Step -->\n <ng-container *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"-ml-px absolute mt-0.5 top-4 left-4 w-0.5 h-full bg-gray-300\" aria-hidden=\"true\" *ngIf=\"!step.isLast\"></div>\n <div href=\"#\" class=\"relative flex items-start group\">\n <span class=\"h-9 flex items-center\" aria-hidden=\"true\">\n <span class=\"relative z-10 w-8 h-8 flex items-center justify-center bg-white border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\n <span class=\"h-2.5 w-2.5 bg-transparent rounded-full group-hover:bg-gray-300\"></span>\n </span>\n </span>\n <span class=\"ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase text-gray-500\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </div>\n </ng-container>\n </li>\n </ol>\n </nav>\n <!-- Panels -->\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Panels\">\n <ol role=\"list\" class=\"border border-gray-300 rounded-md divide-y divide-gray-300 md:flex md:divide-y-0\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative md:flex-1 md:flex cursor-pointer\">\n <!-- Completed step -->\n <div class=\"group flex items-center w-full\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full group-hover:bg-blue-800\">\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n <span class=\"ml-4 text-sm font-medium text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Active step -->\n <div class=\"px-6 py-4 flex items-center text-sm font-medium\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\n <span class=\"text-blue-600\">{{ (step.index + 1) }}</span>\n </span>\n <span class=\"ml-4 text-sm font-medium text-blue-600\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming step -->\n <div class=\"group flex items-center\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"px-6 py-4 flex items-center text-sm font-medium\">\n <span class=\"flex-shrink-0 w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full group-hover:border-gray-400\">\n <span class=\"text-gray-500 group-hover:text-gray-900\">{{ (step.index + 1) }}</span>\n </span>\n <span class=\"ml-4 text-sm font-medium text-gray-500 group-hover:text-gray-900\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </span>\n </div>\n <!-- Arrow separator for lg screens and up -->\n <div *ngIf=\"!step.isLast\" class=\"hidden md:block absolute top-0 right-0 h-full w-5\" aria-hidden=\"true\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 22 80\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0 -2L20 40L0 82\" vector-effect=\"non-scaling-stroke\" stroke=\"currentcolor\" stroke-linejoin=\"round\" />\n </svg>\n </div>\n </li>\n </ol>\n </nav>\n <!-- Panels With Border -->\n <div class=\"lg:border-t lg:border-b lg:border-gray-200\" *ngSwitchCase=\"StepperType.PanelsWithBorder\">\n <nav class=\"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8\" aria-label=\"Progress\">\n <ol role=\"list\" class=\"rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"relative overflow-hidden lg:flex-1 cursor-pointer\">\n <!-- Completed Step -->\n <div class=\"border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0\" *ngIf=\"step.state === StepState.Completed\">\n <div class=\"group\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full\">\n <svg class=\"w-6 h-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n </div>\n <!-- Active Step -->\n <div class=\"border border-gray-200 overflow-hidden lg:border-0\" *ngIf=\"step.state === StepState.Active\">\n <div aria-current=\"step\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full\">\n <span class=\"text-blue-600\">{{ step.index + 1 }}</span>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold text-blue-600 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n <!-- Separator -->\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\n </svg>\n </div>\n </div>\n <!-- Upcoming Step -->\n <div class=\"border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0\" *ngIf=\"step.state === StepState.Upcoming\">\n <div class=\"group\">\n <span class=\"absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto\" aria-hidden=\"true\"></span>\n <span class=\"px-6 py-5 flex items-start text-sm font-medium lg:pl-9\">\n <span class=\"flex-shrink-0\">\n <span class=\"w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full\">\n <span class=\"text-gray-500\">{{ step.index + 1 }}</span>\n </span>\n </span>\n <span class=\"mt-0.5 ml-4 min-w-0 flex flex-col\">\n <span class=\"text-xs font-semibold text-gray-500 tracking-wide uppercase\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n <span class=\"text-sm font-medium text-gray-500\" *ngIf=\"step.stepInfo\">\n <ng-container [ngTemplateOutlet]=\"step.stepInfo.template\"></ng-container>\n </span>\n </span>\n </span>\n </div>\n <!-- Separator -->\n <div class=\"hidden absolute top-0 left-0 w-3 inset-0 lg:block\" aria-hidden=\"true\" *ngIf=\"step.index !== 0\">\n <svg class=\"h-full w-full text-gray-300\" viewBox=\"0 0 12 82\" fill=\"none\" preserveAspectRatio=\"none\">\n <path d=\"M0.5 0V31L10.5 41L0.5 51V82\" stroke=\"currentcolor\" vector-effect=\"non-scaling-stroke\" />\n </svg>\n </div>\n </div>\n </li>\n </ol>\n </nav>\n </div>\n <!-- Progress -->\n <div *ngSwitchCase=\"StepperType.Progress\">\n <!-- <h4 class=\"sr-only\">Status</h4>\n <p class=\"text-sm font-medium text-gray-900\">Migrating MySQL database...</p> -->\n <div class=\"mt-6\" aria-hidden=\"true\">\n <div class=\"bg-gray-200 rounded-full overflow-hidden\">\n <div class=\"h-2 bg-blue-600 rounded-full\" [style.width]=\"(((currentStepIndex + 1) / steps.length) * 100) + '%'\"></div>\n </div>\n <div class=\"hidden sm:grid grid-cols-4 text-sm font-medium text-gray-600 mt-6\">\n <div *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"text-blue-600 cursor-pointer\">\n <ng-container *ngIf=\"step.stepLabel\" [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </div>\n </div>\n </div>\n </div>\n <!-- Simple -->\n <nav aria-label=\"Progress\" *ngSwitchCase=\"StepperType.Simple\">\n <ol role=\"list\" class=\"space-y-4 md:flex md:space-y-0 md:space-x-8\">\n <li *ngFor=\"let step of steps\" (click)=\"onSelectStep(step)\" class=\"md:flex-1 cursor-pointer\">\n <!-- Completed Step -->\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-blue-600 hover:border-blue-800 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Completed\">\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase group-hover:text-blue-800\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Active Step -->\n <div class=\"pl-4 py-2 flex flex-col border-l-4 border-blue-600 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" aria-current=\"step\" *ngIf=\"step.state === StepState.Active\">\n <span class=\"text-xs text-blue-600 font-semibold tracking-wide uppercase\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n <!-- Upcoming Step -->\n <div class=\"group pl-4 py-2 flex flex-col border-l-4 border-gray-200 hover:border-gray-300 md:pl-0 md:pt-4 md:pb-0 md:border-l-0 md:border-t-4\" *ngIf=\"step.state === StepState.Upcoming\">\n <span class=\"text-xs text-gray-500 font-semibold tracking-wide uppercase group-hover:text-gray-700\">Step {{ step.index + 1 }}</span>\n <span class=\"text-sm font-medium\" *ngIf=\"step.stepLabel\">\n <ng-container [ngTemplateOutlet]=\"step.stepLabel.template\"></ng-container>\n </span>\n </div>\n </li>\n </ol>\n </nav>\n</ng-container>\n<ng-container *ngFor=\"let step of steps\">\n <ng-container *ngIf=\"step.state === StepState.Active\" [ngTemplateOutlet]=\"step.content\"></ng-container>\n</ng-container>" }]
|
|
1786
1786
|
}], ctorParameters: function () { return []; }, propDecorators: { steps: [{
|
|
1787
1787
|
type: ContentChildren,
|
|
1788
1788
|
args: [LibStepComponent, { descendants: true }]
|
|
@@ -2091,10 +2091,10 @@ class NotificationsIndicatorComponent {
|
|
|
2091
2091
|
}
|
|
2092
2092
|
}
|
|
2093
2093
|
NotificationsIndicatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: NotificationsIndicatorComponent, deps: [{ token: APP_NOTIFICATIONS }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2094
|
-
NotificationsIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator", ngImport: i0, template: "<div class=\"relative\"\
|
|
2094
|
+
NotificationsIndicatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator", ngImport: i0, template: "<div class=\"relative\"\n(clickOutside)=\"onClickOutside($event)\">\n <!-- Notifications Button -->\n <button type=\"button\"\n (click)=\"doInboxAction()\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">View notifications</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\">\n <i class=\"ms-Icon hover:text-blue-400\"\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\n [class.text-sky-400]=\"unreadCount > 0\"\n [class.animate-notification]=\"newArrival\"\n [class.ms-Icon--Message]=\"unreadCount === 0\">\n </i>\n </span>\n <span\n *ngIf=\"unreadCount > 0\"\n [class.animate-pulse]=\"newArrival\"\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\n {{ unreadCount }}\n </span>\n </span>\n </button>\n\n <!-- Notifications dropdown -->\n <div *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\n <div class=\"notifications-nav-link hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\n </ng-container>\n <ng-template #messagesDropDown>\n <ul class=\"pr-1.5\">\n <ng-container *ngIf=\"items; else loading\">\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\n <div class=\"notifications-nav-link hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\n </ng-container>\n <ng-container *ngFor=\"let message of items; let i = index\">\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\n <div class=\"flex justify-between\">\n <div class=\"flex-grow\">\n <a\n [routerLink]=\"message.path\"\n (click)=\"removeItem(i)\"\n class=\"notifications-nav-link grid\"\n [ngClass]=\"!message.data.isRead ? ' hover:bg-blue-50' : 'border-b border-gray-100'\"\n >\n <div class=\"flex flex-col\">\n <div class=\"font-thin tracking-tighter\">\n {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\n </div>\n <div class=\"font-bold\">\n {{ message.data.text }}\n </div>\n </div>\n </a>\n </div>\n </div>\n </li>\n </ng-container>\n </ng-container>\n\n <ng-template #loading>\n <div class=\"h-32 flex items-center justify-center\">\n <div class=\"animate-pulse text-s text-gray-600\">Loading...</div>\n </div>\n </ng-template>\n </ul>\n </ng-template>\n </div>\n <div class=\"p-1 rounded-sm\">\n <a [routerLink]=\"allNotificationsLink!.path\">\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\n </a>\n </div>\n </div>\n</div>\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: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
|
|
2095
2095
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: NotificationsIndicatorComponent, decorators: [{
|
|
2096
2096
|
type: Component,
|
|
2097
|
-
args: [{ selector: 'lib-notifications-indicator', template: "<div class=\"relative\"\
|
|
2097
|
+
args: [{ selector: 'lib-notifications-indicator', template: "<div class=\"relative\"\n(clickOutside)=\"onClickOutside($event)\">\n <!-- Notifications Button -->\n <button type=\"button\"\n (click)=\"doInboxAction()\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">View notifications</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\">\n <i class=\"ms-Icon hover:text-blue-400\"\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\n [class.text-sky-400]=\"unreadCount > 0\"\n [class.animate-notification]=\"newArrival\"\n [class.ms-Icon--Message]=\"unreadCount === 0\">\n </i>\n </span>\n <span\n *ngIf=\"unreadCount > 0\"\n [class.animate-pulse]=\"newArrival\"\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\n {{ unreadCount }}\n </span>\n </span>\n </button>\n\n <!-- Notifications dropdown -->\n <div *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\n <div class=\"notifications-nav-link hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\n </ng-container>\n <ng-template #messagesDropDown>\n <ul class=\"pr-1.5\">\n <ng-container *ngIf=\"items; else loading\">\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\n <div class=\"notifications-nav-link hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\n </ng-container>\n <ng-container *ngFor=\"let message of items; let i = index\">\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\n <div class=\"flex justify-between\">\n <div class=\"flex-grow\">\n <a\n [routerLink]=\"message.path\"\n (click)=\"removeItem(i)\"\n class=\"notifications-nav-link grid\"\n [ngClass]=\"!message.data.isRead ? ' hover:bg-blue-50' : 'border-b border-gray-100'\"\n >\n <div class=\"flex flex-col\">\n <div class=\"font-thin tracking-tighter\">\n {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\n </div>\n <div class=\"font-bold\">\n {{ message.data.text }}\n </div>\n </div>\n </a>\n </div>\n </div>\n </li>\n </ng-container>\n </ng-container>\n\n <ng-template #loading>\n <div class=\"h-32 flex items-center justify-center\">\n <div class=\"animate-pulse text-s text-gray-600\">Loading...</div>\n </div>\n </ng-template>\n </ul>\n </ng-template>\n </div>\n <div class=\"p-1 rounded-sm\">\n <a [routerLink]=\"allNotificationsLink!.path\">\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\n </a>\n </div>\n </div>\n</div>\n" }]
|
|
2098
2098
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
2099
2099
|
type: Inject,
|
|
2100
2100
|
args: [APP_NOTIFICATIONS]
|
|
@@ -2120,10 +2120,10 @@ class LanguageSelectionComponent {
|
|
|
2120
2120
|
}
|
|
2121
2121
|
}
|
|
2122
2122
|
LanguageSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LanguageSelectionComponent, deps: [{ token: APP_LANGUAGES }], target: i0.ɵɵFactoryTarget.Component });
|
|
2123
|
-
LanguageSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LanguageSelectionComponent, selector: "lib-language-selection", ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\
|
|
2123
|
+
LanguageSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: LanguageSelectionComponent, selector: "lib-language-selection", ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\n <button class=\"text-blue-300 hover:text-blue-400\" (click)=\"menuExpanded = !menuExpanded\">\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--Globe\"></i>\n <span>{{langsService?.selected || langsService?.default}}</span>\n </button>\n\n <div\n [class]=\"menuExpanded ? 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none':'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\n <div class=\"py-1\" role=\"none\">\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\n <a (click)=\"selectLang(lang)\" *ngIf=\"lang.value != langsService?.selected\" class=\"nav-link-profile\" role=\"menuitem\" tabindex=\"-1\" id=\"menu-item-0\">\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--GlobeFavorite\"></i>\n {{lang.description}}\n </a>\n </ng-container>\n </div>\n </div>\n</div>\n", dependencies: [{ 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: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
2124
2124
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: LanguageSelectionComponent, decorators: [{
|
|
2125
2125
|
type: Component,
|
|
2126
|
-
args: [{ selector: 'lib-language-selection', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\
|
|
2126
|
+
args: [{ selector: 'lib-language-selection', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\n <button class=\"text-blue-300 hover:text-blue-400\" (click)=\"menuExpanded = !menuExpanded\">\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--Globe\"></i>\n <span>{{langsService?.selected || langsService?.default}}</span>\n </button>\n\n <div\n [class]=\"menuExpanded ? 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none':'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\n <div class=\"py-1\" role=\"none\">\n <ng-container *ngFor=\"let lang of langsService?.options | async\">\n <a (click)=\"selectLang(lang)\" *ngIf=\"lang.value != langsService?.selected\" class=\"nav-link-profile\" role=\"menuitem\" tabindex=\"-1\" id=\"menu-item-0\">\n <i class=\"text-xs mr-1 ms-Icon ms-Icon--GlobeFavorite\"></i>\n {{lang.description}}\n </a>\n </ng-container>\n </div>\n </div>\n</div>\n" }]
|
|
2127
2127
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
2128
2128
|
type: Inject,
|
|
2129
2129
|
args: [APP_LANGUAGES]
|
|
@@ -2172,10 +2172,10 @@ class UserProfileMenuComponent {
|
|
|
2172
2172
|
}
|
|
2173
2173
|
}
|
|
2174
2174
|
UserProfileMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: UserProfileMenuComponent, deps: [{ token: AuthService }, { token: Router }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2175
|
-
UserProfileMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: { showUserName: ["show-user-name", "showUserName"] }, ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\" (click)=\"userMenuExpanded = !userMenuExpanded\">\
|
|
2175
|
+
UserProfileMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: { showUserName: ["show-user-name", "showUserName"] }, ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\" (click)=\"userMenuExpanded = !userMenuExpanded\">\n\n <div class=\"inline-flex\">\n <!-- Username -->\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\n {{ user.profile.name }}\n </div>\n </div>\n\n <div [class.ml-2]=\"showUserName\">\n <button type=\"button\" *ngIf=\"user\"\n class=\"shell-header-profile-dropdown-button\"\n id=\"user-menu\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">Open user menu</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\">{{this.avatarName}}</span>\n </span>\n </button>\n\n <button type=\"button\"\n *ngIf=\"!user\"\n (click)=\"signin(null)\"\n class=\"shell-header-profile-dropdown-button\"\n id=\"user-menu\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">sign in</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\"><i class=\"ms-Icon ms-Icon--Signin\"></i></span>\n </span>\n </button>\n </div>\n </div>\n\n <div [class]=\"userMenuExpanded ?\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\n :\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\n <lib-nav-links-list\n [links]=\"links.profile\"\n [link-class]=\"'nav-link-profile'\"\n [link-active-class]=\"'nav-link-profile-active'\">\n </lib-nav-links-list>\n </div>\n\n</div>\n\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: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons"] }] });
|
|
2176
2176
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: UserProfileMenuComponent, decorators: [{
|
|
2177
2177
|
type: Component,
|
|
2178
|
-
args: [{ selector: 'lib-user-profile-menu', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\" (click)=\"userMenuExpanded = !userMenuExpanded\">\
|
|
2178
|
+
args: [{ selector: 'lib-user-profile-menu', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\" (click)=\"userMenuExpanded = !userMenuExpanded\">\n\n <div class=\"inline-flex\">\n <!-- Username -->\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\n {{ user.profile.name }}\n </div>\n </div>\n\n <div [class.ml-2]=\"showUserName\">\n <button type=\"button\" *ngIf=\"user\"\n class=\"shell-header-profile-dropdown-button\"\n id=\"user-menu\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">Open user menu</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\">{{this.avatarName}}</span>\n </span>\n </button>\n\n <button type=\"button\"\n *ngIf=\"!user\"\n (click)=\"signin(null)\"\n class=\"shell-header-profile-dropdown-button\"\n id=\"user-menu\"\n aria-expanded=\"false\"\n aria-haspopup=\"true\">\n <span class=\"sr-only\">sign in</span>\n <span class=\"avatar-container\">\n <span class=\"avatar-text\"><i class=\"ms-Icon ms-Icon--Signin\"></i></span>\n </span>\n </button>\n </div>\n </div>\n\n <div [class]=\"userMenuExpanded ?\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\n :\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\n <lib-nav-links-list\n [links]=\"links.profile\"\n [link-class]=\"'nav-link-profile'\"\n [link-active-class]=\"'nav-link-profile-active'\">\n </lib-nav-links-list>\n </div>\n\n</div>\n\n" }]
|
|
2179
2179
|
}], ctorParameters: function () { return [{ type: i2.AuthService, decorators: [{
|
|
2180
2180
|
type: Inject,
|
|
2181
2181
|
args: [AuthService]
|
|
@@ -2267,10 +2267,10 @@ class ShellHeaderComponent {
|
|
|
2267
2267
|
}
|
|
2268
2268
|
}
|
|
2269
2269
|
ShellHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellHeaderComponent, deps: [{ token: AuthService }, { token: Router }, { token: ActivatedRoute }, { token: SHELL_CONFIG }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2270
|
-
ShellHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], profileMenuVisible: ["profile-menu", "profileMenuVisible"], showUserNameOnHeader: ["show-userName", "showUserNameOnHeader"], showAlerts: ["show-alerts", "showAlerts"], shellLayout: ["shell-layout", "shellLayout"], border: "border" }, ngImport: i0, template: "<nav>\
|
|
2270
|
+
ShellHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], profileMenuVisible: ["profile-menu", "profileMenuVisible"], showUserNameOnHeader: ["show-userName", "showUserNameOnHeader"], showAlerts: ["show-alerts", "showAlerts"], shellLayout: ["shell-layout", "shellLayout"], border: "border" }, ngImport: i0, template: "<nav>\n <div class=\"shell-header-paddings\">\n <div [class]=\"border ? 'shell-header-border' : ''\">\n <div class=\"shell-header-menu-container\">\n <div *ngIf=\"shellLayout==='Stacked'\" class=\"shell-header-logo-container\">\n <div>\n <a href=\"#\" [routerLink]=\"['/']\"><img class=\"app-logo\" [src]=\"config.appLogo\" [alt]=\"config.appLogoAlt\" /></a>\n </div>\n </div>\n\n <div *ngIf=\"shellLayout==='Stacked'\" class=\"shell-header-link-container\">\n <div class=\"shell-header-link-container-inner\">\n <lib-nav-links-list\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link'\"\n [link-active-class]=\"'nav-link-active'\">\n </lib-nav-links-list>\n </div>\n </div>\n\n <div class=\"shell-header-md-visible\">\n\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\n\n <lib-nav-links-list\n [links]=\"links.profileActions\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'shell-header-menu-rounded-button'\"\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\n </lib-nav-links-list>\n\n\n <!-- Profile dropdown -->\n <div *ngIf=\"profileMenuVisible\" class=\"ml-2\">\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\n </div>\n\n <!-- Notifications dropdown -->\n <div *ngIf=\"showAlerts && user\" class=\"ml-2\">\n <lib-notifications-indicator></lib-notifications-indicator>\n </div>\n\n <!-- languages dropdown -->\n <div *ngIf=\"config.showLangsOnHeader\" class=\"ml-2\">\n <lib-language-selection></lib-language-selection>\n </div>\n </div>\n </div>\n\n <div class=\"mobile-menu-button-container\" *ngIf=\"shellLayout === 'Stacked'\">\n <!-- Mobile menu button -->\n <button type=\"button\"\n (click)=\"mobileMenuExpanded = !mobileMenuExpanded\"\n class=\"mobile-menu-button\"\n aria-controls=\"mobile-menu\"\n [attr.aria-expanded]=\"mobileMenuExpanded\">\n <span class=\"sr-only\">Open main menu</span>\n <!--Heroicon name: outline/menu Menu open: \"hidden\", Menu closed: \"block\"-->\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M4 6h16M4 12h16M4 18h16\" />\n </svg>\n <!--Heroicon name: outline/x Menu open: \"block\", Menu closed: \"hidden\"-->\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n\n </div>\n </div>\n </div>\n <!-- Mobile menu, show/hide based on menu state. -->\n <div class=\"mobile-menu-container\" *ngIf=\"mobileMenuExpanded\" id=\"mobile-menu\">\n <lib-nav-links-list\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link-mobile'\"\n [link-active-class]=\"'nav-link-mobile-active'\"\n [container-class]=\"'mobile-menu-link-container'\">\n </lib-nav-links-list>\n\n <div *ngIf=\"!user\">\n <a href=\"#\" (click)=\"signin($event)\" class=\"nav-link-mobile\">\n <i class=\"ms-Icon ms-Icon--Signin mr-2\"></i>\u03A3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7\n </a>\n </div>\n\n <div class=\"mobile-menu-user-info-container\" *ngIf=\"user\">\n <div class=\"mobile-menu-user-info-container-inner\">\n <div class=\"flex-shrink-0\">\n <span class=\"mobile-menu-avatar-container\">\n <span class=\"mobile-menu-avatar-name\">{{ this.avatarName }}</span>\n </span>\n </div>\n <div class=\"ml-3\">\n <div class=\"mobile-menu-user-name\">{{ user.profile.name }}</div>\n <div class=\"mobile-menu-user-email\">{{ user.profile.email }}</div>\n </div>\n <!--\n <button class=\"mobile-menu-rounded-button\">\n <span class=\"sr-only\">View notifications</span>\n <svg class=\"mobile-menu-rounded-button-icon-style\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\" />\n </svg>\n </button>\n -->\n </div>\n </div>\n\n <lib-nav-links-list\n [links]=\"links.profile\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link-mobile'\"\n [link-active-class]=\"'nav-link-mobile-active'\"\n [container-class]=\"'mobile-menu-link-container'\">\n </lib-nav-links-list>\n </div>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons"] }, { kind: "component", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator" }, { kind: "component", type: LanguageSelectionComponent, selector: "lib-language-selection" }, { kind: "component", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: ["show-user-name"] }] });
|
|
2271
2271
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellHeaderComponent, decorators: [{
|
|
2272
2272
|
type: Component,
|
|
2273
|
-
args: [{ selector: 'lib-shell-header', template: "<nav>\
|
|
2273
|
+
args: [{ selector: 'lib-shell-header', template: "<nav>\n <div class=\"shell-header-paddings\">\n <div [class]=\"border ? 'shell-header-border' : ''\">\n <div class=\"shell-header-menu-container\">\n <div *ngIf=\"shellLayout==='Stacked'\" class=\"shell-header-logo-container\">\n <div>\n <a href=\"#\" [routerLink]=\"['/']\"><img class=\"app-logo\" [src]=\"config.appLogo\" [alt]=\"config.appLogoAlt\" /></a>\n </div>\n </div>\n\n <div *ngIf=\"shellLayout==='Stacked'\" class=\"shell-header-link-container\">\n <div class=\"shell-header-link-container-inner\">\n <lib-nav-links-list\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link'\"\n [link-active-class]=\"'nav-link-active'\">\n </lib-nav-links-list>\n </div>\n </div>\n\n <div class=\"shell-header-md-visible\">\n\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\n\n <lib-nav-links-list\n [links]=\"links.profileActions\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'shell-header-menu-rounded-button'\"\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\n </lib-nav-links-list>\n\n\n <!-- Profile dropdown -->\n <div *ngIf=\"profileMenuVisible\" class=\"ml-2\">\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\n </div>\n\n <!-- Notifications dropdown -->\n <div *ngIf=\"showAlerts && user\" class=\"ml-2\">\n <lib-notifications-indicator></lib-notifications-indicator>\n </div>\n\n <!-- languages dropdown -->\n <div *ngIf=\"config.showLangsOnHeader\" class=\"ml-2\">\n <lib-language-selection></lib-language-selection>\n </div>\n </div>\n </div>\n\n <div class=\"mobile-menu-button-container\" *ngIf=\"shellLayout === 'Stacked'\">\n <!-- Mobile menu button -->\n <button type=\"button\"\n (click)=\"mobileMenuExpanded = !mobileMenuExpanded\"\n class=\"mobile-menu-button\"\n aria-controls=\"mobile-menu\"\n [attr.aria-expanded]=\"mobileMenuExpanded\">\n <span class=\"sr-only\">Open main menu</span>\n <!--Heroicon name: outline/menu Menu open: \"hidden\", Menu closed: \"block\"-->\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M4 6h16M4 12h16M4 18h16\" />\n </svg>\n <!--Heroicon name: outline/x Menu open: \"block\", Menu closed: \"hidden\"-->\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\"\n [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n\n </div>\n </div>\n </div>\n <!-- Mobile menu, show/hide based on menu state. -->\n <div class=\"mobile-menu-container\" *ngIf=\"mobileMenuExpanded\" id=\"mobile-menu\">\n <lib-nav-links-list\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link-mobile'\"\n [link-active-class]=\"'nav-link-mobile-active'\"\n [container-class]=\"'mobile-menu-link-container'\">\n </lib-nav-links-list>\n\n <div *ngIf=\"!user\">\n <a href=\"#\" (click)=\"signin($event)\" class=\"nav-link-mobile\">\n <i class=\"ms-Icon ms-Icon--Signin mr-2\"></i>\u03A3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7\n </a>\n </div>\n\n <div class=\"mobile-menu-user-info-container\" *ngIf=\"user\">\n <div class=\"mobile-menu-user-info-container-inner\">\n <div class=\"flex-shrink-0\">\n <span class=\"mobile-menu-avatar-container\">\n <span class=\"mobile-menu-avatar-name\">{{ this.avatarName }}</span>\n </span>\n </div>\n <div class=\"ml-3\">\n <div class=\"mobile-menu-user-name\">{{ user.profile.name }}</div>\n <div class=\"mobile-menu-user-email\">{{ user.profile.email }}</div>\n </div>\n <!--\n <button class=\"mobile-menu-rounded-button\">\n <span class=\"sr-only\">View notifications</span>\n <svg class=\"mobile-menu-rounded-button-icon-style\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n aria-hidden=\"true\">\n <path stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\" />\n </svg>\n </button>\n -->\n </div>\n </div>\n\n <lib-nav-links-list\n [links]=\"links.profile\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'nav-link-mobile'\"\n [link-active-class]=\"'nav-link-mobile-active'\"\n [container-class]=\"'mobile-menu-link-container'\">\n </lib-nav-links-list>\n </div>\n</nav>\n" }]
|
|
2274
2274
|
}], ctorParameters: function () { return [{ type: i2.AuthService, decorators: [{
|
|
2275
2275
|
type: Inject,
|
|
2276
2276
|
args: [AuthService]
|
|
@@ -2311,10 +2311,10 @@ class ShellFooterComponent {
|
|
|
2311
2311
|
}
|
|
2312
2312
|
}
|
|
2313
2313
|
ShellFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellFooterComponent, deps: [{ token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2314
|
-
ShellFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellFooterComponent, selector: "lib-shell-footer", ngImport: i0, template: "<footer class=\"shell-footer-component-container\">\
|
|
2314
|
+
ShellFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellFooterComponent, selector: "lib-shell-footer", ngImport: i0, template: "<footer class=\"shell-footer-component-container\">\n <div class=\"shell-footer-paddings\">\n <div class=\"shell-footer-component-container-inner\">\n <div class=\"shell-footer-sections-container\">\n <div class=\"shell-footer-section\">\n <img class=\"shell-footer-logo-h\" src=\"assets/images/branding/indice.png\" alt=\"INDICE logo\" />\n <nav class=\"mt-4\">\n <ul class=\"space-y-2\">\n <ng-container *ngFor=\"let link of links.brand | async\">\n <li>\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\n </li>\n </ng-container>\n </ul>\n </nav>\n </div>\n <div class=\"shell-footer-section-links\">\n <h5 class=\"shell-footer-section-title\">Legal</h5>\n <nav class=\"mt-4\">\n <ul class=\"grid lg:grid-cols-2\">\n <ng-container *ngFor=\"let link of links.legal | async\">\n <li class=\"mb-2\">\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\n </li>\n </ng-container>\n </ul>\n </nav>\n </div>\n <div class=\"shell-footer-section-links\">\n <h5 class=\"shell-footer-section-title\">Follow us</h5>\n <nav class=\"mt-4\">\n <ul class=\"grid lg:grid-cols-2\">\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84\"/>\n </svg>\n <span> Twitter </span>\n </a>\n </li>\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path fill-rule=\"evenodd\" d=\"M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z\" clip-rule=\"evenodd\"/>\n </svg>\n <span> Instagram </span>\n </a>\n </li>\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\" >\n <path fill-rule=\"evenodd\" d=\"M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z\" clip-rule=\"evenodd\"/>\n </svg>\n <span> Facebook </span>\n </a>\n </li>\n </ul>\n </nav>\n </div>\n </div>\n </div>\n <div class=\"shell-footer-copyright\">\n <!--<nav class=\"flex flex-wrap justify-center space-x-6\">\n <a href=\"#\" class=\"font-normal text-sm hover:text-gray-100 mb-2\">Cookie settings</a>\n </nav>-->\n <p class=\"text-sm text-center sm:text-right\">\n \u00A9 2021 INDICE. All rights reserved.\n </p>\n </div>\n </div>\n</footer>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
2315
2315
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellFooterComponent, decorators: [{
|
|
2316
2316
|
type: Component,
|
|
2317
|
-
args: [{ selector: 'lib-shell-footer', template: "<footer class=\"shell-footer-component-container\">\
|
|
2317
|
+
args: [{ selector: 'lib-shell-footer', template: "<footer class=\"shell-footer-component-container\">\n <div class=\"shell-footer-paddings\">\n <div class=\"shell-footer-component-container-inner\">\n <div class=\"shell-footer-sections-container\">\n <div class=\"shell-footer-section\">\n <img class=\"shell-footer-logo-h\" src=\"assets/images/branding/indice.png\" alt=\"INDICE logo\" />\n <nav class=\"mt-4\">\n <ul class=\"space-y-2\">\n <ng-container *ngFor=\"let link of links.brand | async\">\n <li>\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\n </li>\n </ng-container>\n </ul>\n </nav>\n </div>\n <div class=\"shell-footer-section-links\">\n <h5 class=\"shell-footer-section-title\">Legal</h5>\n <nav class=\"mt-4\">\n <ul class=\"grid lg:grid-cols-2\">\n <ng-container *ngFor=\"let link of links.legal | async\">\n <li class=\"mb-2\">\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\n </li>\n </ng-container>\n </ul>\n </nav>\n </div>\n <div class=\"shell-footer-section-links\">\n <h5 class=\"shell-footer-section-title\">Follow us</h5>\n <nav class=\"mt-4\">\n <ul class=\"grid lg:grid-cols-2\">\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84\"/>\n </svg>\n <span> Twitter </span>\n </a>\n </li>\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path fill-rule=\"evenodd\" d=\"M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z\" clip-rule=\"evenodd\"/>\n </svg>\n <span> Instagram </span>\n </a>\n </li>\n <li class=\"mb-2\">\n <a href=\"#\" class=\"shell-footer-social\">\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\" >\n <path fill-rule=\"evenodd\" d=\"M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z\" clip-rule=\"evenodd\"/>\n </svg>\n <span> Facebook </span>\n </a>\n </li>\n </ul>\n </nav>\n </div>\n </div>\n </div>\n <div class=\"shell-footer-copyright\">\n <!--<nav class=\"flex flex-wrap justify-center space-x-6\">\n <a href=\"#\" class=\"font-normal text-sm hover:text-gray-100 mb-2\">Cookie settings</a>\n </nav>-->\n <p class=\"text-sm text-center sm:text-right\">\n \u00A9 2021 INDICE. All rights reserved.\n </p>\n </div>\n </div>\n</footer>\n" }]
|
|
2318
2318
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
2319
2319
|
type: Inject,
|
|
2320
2320
|
args: [APP_LINKS]
|
|
@@ -2338,10 +2338,10 @@ class ShellSidebarComponent {
|
|
|
2338
2338
|
}
|
|
2339
2339
|
}
|
|
2340
2340
|
ShellSidebarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellSidebarComponent, deps: [{ token: Router }, { token: ActivatedRoute }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2341
|
-
ShellSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellSidebarComponent, selector: "lib-shell-sidebar", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], shellConfig: ["config", "shellConfig"] }, ngImport: i0, template: "<!-- Sidebar component, swap this element with another sidebar if you like -->\
|
|
2341
|
+
ShellSidebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellSidebarComponent, selector: "lib-shell-sidebar", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], shellConfig: ["config", "shellConfig"] }, ngImport: i0, template: "<!-- Sidebar component, swap this element with another sidebar if you like -->\n<div class=\"flex w-full flex-col h-full min-h-0 bg-gray-800\">\n <div class=\"flex items-center h-16 flex-shrink-0 px-4 bg-gray-900\">\n <!-- <img class=\"h-8 w-auto\" src=\"https://tailwindui.com/img/logos/workflow-logo-indigo-500-mark-white-text.svg\" alt=\"Workflow\"> -->\n <a href=\"#\" [routerLink]=\"['/']\"><img class=\"app-logo\" [src]=\"shellConfig?.appLogo\" [alt]=\"shellConfig?.appLogoAlt\" /></a>\n </div>\n <div class=\"pt-4 px-2 sidebar\">\n <lib-nav-links-list\n [show-icons]=\"true\"\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'sidebar nav-link group'\"\n [link-active-class]=\"'sidebar nav-link-active group'\">\n </lib-nav-links-list>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons"] }] });
|
|
2342
2342
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellSidebarComponent, decorators: [{
|
|
2343
2343
|
type: Component,
|
|
2344
|
-
args: [{ selector: 'lib-shell-sidebar', template: "<!-- Sidebar component, swap this element with another sidebar if you like -->\
|
|
2344
|
+
args: [{ selector: 'lib-shell-sidebar', template: "<!-- Sidebar component, swap this element with another sidebar if you like -->\n<div class=\"flex w-full flex-col h-full min-h-0 bg-gray-800\">\n <div class=\"flex items-center h-16 flex-shrink-0 px-4 bg-gray-900\">\n <!-- <img class=\"h-8 w-auto\" src=\"https://tailwindui.com/img/logos/workflow-logo-indigo-500-mark-white-text.svg\" alt=\"Workflow\"> -->\n <a href=\"#\" [routerLink]=\"['/']\"><img class=\"app-logo\" [src]=\"shellConfig?.appLogo\" [alt]=\"shellConfig?.appLogoAlt\" /></a>\n </div>\n <div class=\"pt-4 px-2 sidebar\">\n <lib-nav-links-list\n [show-icons]=\"true\"\n [links]=\"sectionLinks\"\n [active-fragment]=\"activeFragment\"\n [link-class]=\"'sidebar nav-link group'\"\n [link-active-class]=\"'sidebar nav-link-active group'\">\n </lib-nav-links-list>\n </div>\n</div>\n" }]
|
|
2345
2345
|
}], ctorParameters: function () { return [{ type: i1$1.Router, decorators: [{
|
|
2346
2346
|
type: Inject,
|
|
2347
2347
|
args: [Router]
|
|
@@ -2430,10 +2430,10 @@ class ShellLayoutComponent {
|
|
|
2430
2430
|
}
|
|
2431
2431
|
}
|
|
2432
2432
|
ShellLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellLayoutComponent, deps: [{ token: DOCUMENT }, { token: i1$1.Router }, { token: i1.Location }, { token: SHELL_CONFIG }, { token: ComponentLoaderFactory }], target: i0.ɵɵFactoryTarget.Component });
|
|
2433
|
-
ShellLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellLayoutComponent, selector: "lib-shell-layout", viewQueries: [{ propertyName: "dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0, template: "<div *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\" [style.display]=\"!loaded ? 'none':'block'\" class=\"shell-container active-side-pane\">\
|
|
2433
|
+
ShellLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ShellLayoutComponent, selector: "lib-shell-layout", viewQueries: [{ propertyName: "dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0, template: "<div *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\" [style.display]=\"!loaded ? 'none':'block'\" class=\"shell-container active-side-pane\">\n\n <div class=\"shell-header-container\" *ngIf=\"activeConfig.showHeader\">\n <div [class]=\"activeConfig.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\n <ng-container *ngIf=\"activeConfig.customHeaderComponent\">\n <div appDynamicComponentHost =\"Header\"></div>\n </ng-container>\n <lib-shell-header *ngIf=\"!activeConfig.customHeaderComponent\" [show-userName]=\"activeConfig.showUserNameOnHeader\"\n [show-alerts]=\"activeConfig.showAlertsOnHeader\">\n </lib-shell-header>\n </div>\n </div>\n\n <main [class]=\"activeConfig.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\n <div [class]=\"activeConfig.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\n <router-outlet *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\"></router-outlet>\n </div>\n </main>\n\n <div class=\"shell-footer-container\" *ngIf=\"activeConfig.showFooter\">\n <div [class]=\"activeConfig.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\n <ng-container *ngIf=\"activeConfig.customFooterComponent\">\n <div appDynamicComponentHost hostName=\"Footer\"></div>\n </ng-container>\n <lib-shell-footer *ngIf=\"!activeConfig.customFooterComponent\"></lib-shell-footer>\n </div>\n </div>\n\n <lib-side-pane #rightPane>\n <router-outlet name=\"rightpane\" (activate)=\"rightPane.onSidePaneActivated($event)\" (deactivate)=\"rightPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n\n <lib-toaster-container></lib-toaster-container>\n</div>\n\n<!-- SIDEBAR LAYOUT -->\n\n<div *ngIf=\"loaded && activeConfig.layout === 'Sidebar'\" [style.display]=\"!loaded ? 'none':'block'\" class=\"sidebar shell-container active-side-pane\">\n\n <!-- Static sidebar for desktop -->\n <div class=\"hidden w-0 sm:w-64 flex-col inset-y-0 bg-gray-800\" [class.hidden]=\"hideSidebar\" [class.fixed]=\"!hideSidebar\">\n <lib-shell-sidebar [config]=\"activeConfig\" ></lib-shell-sidebar>\n </div>\n\n <div class=\"flex flex-col\" [class.pl-64]=\"!hideSidebar\">\n <div class=\"sticky top-0 z-10 flex-shrink-0 flex h-16 bg-gray-800\">\n\n <button type=\"button\" class=\"hidden sm:block px-4 border-0 text-white focus:outline-none\" (click)=\"hideSidebar = !hideSidebar\">\n <span class=\"sr-only\">Open sidebar</span>\n <!-- Heroicon name: outline/menu-alt-2 -->\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\n </svg>\n </button>\n\n <button type=\"button\" class=\"block sm:hidden px-4 border-0 text-gray-200 focus:outline-none\" (click)=\"hideSidebar = !hideSidebar\">\n <span class=\"sr-only\">Open sidebar</span>\n <!-- Heroicon name: outline/menu-alt-2 --> 111\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\n </svg>\n </button>\n\n <div class=\"flex-1\">\n <div class=\"shell-header-container\">\n <lib-shell-header [shell-layout]=\"activeConfig.layout\" [show-userName]=\"activeConfig.showUserNameOnHeader\" [show-alerts]=\"activeConfig.showAlertsOnHeader\"></lib-shell-header>\n </div>\n </div>\n </div>\n\n <main class=\"shell-content-container-sidebar\">\n <div class=\"shell-content-container-inner\">\n <router-outlet *ngIf=\"loaded && activeConfig.layout === 'Sidebar'\"></router-outlet>\n </div>\n </main>\n </div>\n\n <lib-side-pane #rightPane>\n <router-outlet name=\"rightpane\" (activate)=\"rightPane.onSidePaneActivated($event)\" (deactivate)=\"rightPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n\n <lib-toaster-container></lib-toaster-container>\n\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: DynamicComponentHostDirective, selector: "[appDynamicComponentHost]", inputs: ["hostName"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete"] }, { kind: "component", type: ToasterContainerComponent, selector: "lib-toaster-container" }, { kind: "component", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: ["section-links", "profile-menu", "show-userName", "show-alerts", "shell-layout", "border"] }, { kind: "component", type: ShellFooterComponent, selector: "lib-shell-footer" }, { kind: "component", type: ShellSidebarComponent, selector: "lib-shell-sidebar", inputs: ["section-links", "config"] }] });
|
|
2434
2434
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ShellLayoutComponent, decorators: [{
|
|
2435
2435
|
type: Component,
|
|
2436
|
-
args: [{ selector: 'lib-shell-layout', template: "<div *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\" [style.display]=\"!loaded ? 'none':'block'\" class=\"shell-container active-side-pane\">\
|
|
2436
|
+
args: [{ selector: 'lib-shell-layout', template: "<div *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\" [style.display]=\"!loaded ? 'none':'block'\" class=\"shell-container active-side-pane\">\n\n <div class=\"shell-header-container\" *ngIf=\"activeConfig.showHeader\">\n <div [class]=\"activeConfig.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\n <ng-container *ngIf=\"activeConfig.customHeaderComponent\">\n <div appDynamicComponentHost =\"Header\"></div>\n </ng-container>\n <lib-shell-header *ngIf=\"!activeConfig.customHeaderComponent\" [show-userName]=\"activeConfig.showUserNameOnHeader\"\n [show-alerts]=\"activeConfig.showAlertsOnHeader\">\n </lib-shell-header>\n </div>\n </div>\n\n <main [class]=\"activeConfig.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\n <div [class]=\"activeConfig.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\n <router-outlet *ngIf=\"loaded && (activeConfig.layout === 'Stacked' || !activeConfig.layout)\"></router-outlet>\n </div>\n </main>\n\n <div class=\"shell-footer-container\" *ngIf=\"activeConfig.showFooter\">\n <div [class]=\"activeConfig.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\n <ng-container *ngIf=\"activeConfig.customFooterComponent\">\n <div appDynamicComponentHost hostName=\"Footer\"></div>\n </ng-container>\n <lib-shell-footer *ngIf=\"!activeConfig.customFooterComponent\"></lib-shell-footer>\n </div>\n </div>\n\n <lib-side-pane #rightPane>\n <router-outlet name=\"rightpane\" (activate)=\"rightPane.onSidePaneActivated($event)\" (deactivate)=\"rightPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n\n <lib-toaster-container></lib-toaster-container>\n</div>\n\n<!-- SIDEBAR LAYOUT -->\n\n<div *ngIf=\"loaded && activeConfig.layout === 'Sidebar'\" [style.display]=\"!loaded ? 'none':'block'\" class=\"sidebar shell-container active-side-pane\">\n\n <!-- Static sidebar for desktop -->\n <div class=\"hidden w-0 sm:w-64 flex-col inset-y-0 bg-gray-800\" [class.hidden]=\"hideSidebar\" [class.fixed]=\"!hideSidebar\">\n <lib-shell-sidebar [config]=\"activeConfig\" ></lib-shell-sidebar>\n </div>\n\n <div class=\"flex flex-col\" [class.pl-64]=\"!hideSidebar\">\n <div class=\"sticky top-0 z-10 flex-shrink-0 flex h-16 bg-gray-800\">\n\n <button type=\"button\" class=\"hidden sm:block px-4 border-0 text-white focus:outline-none\" (click)=\"hideSidebar = !hideSidebar\">\n <span class=\"sr-only\">Open sidebar</span>\n <!-- Heroicon name: outline/menu-alt-2 -->\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\n </svg>\n </button>\n\n <button type=\"button\" class=\"block sm:hidden px-4 border-0 text-gray-200 focus:outline-none\" (click)=\"hideSidebar = !hideSidebar\">\n <span class=\"sr-only\">Open sidebar</span>\n <!-- Heroicon name: outline/menu-alt-2 --> 111\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\n </svg>\n </button>\n\n <div class=\"flex-1\">\n <div class=\"shell-header-container\">\n <lib-shell-header [shell-layout]=\"activeConfig.layout\" [show-userName]=\"activeConfig.showUserNameOnHeader\" [show-alerts]=\"activeConfig.showAlertsOnHeader\"></lib-shell-header>\n </div>\n </div>\n </div>\n\n <main class=\"shell-content-container-sidebar\">\n <div class=\"shell-content-container-inner\">\n <router-outlet *ngIf=\"loaded && activeConfig.layout === 'Sidebar'\"></router-outlet>\n </div>\n </main>\n </div>\n\n <lib-side-pane #rightPane>\n <router-outlet name=\"rightpane\" (activate)=\"rightPane.onSidePaneActivated($event)\" (deactivate)=\"rightPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n\n <lib-toaster-container></lib-toaster-container>\n\n</div>\n" }]
|
|
2437
2437
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
2438
2438
|
type: Inject,
|
|
2439
2439
|
args: [DOCUMENT]
|
|
@@ -2509,10 +2509,10 @@ class ViewLayoutComponent {
|
|
|
2509
2509
|
}
|
|
2510
2510
|
}
|
|
2511
2511
|
ViewLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ViewLayoutComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2512
|
-
ViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: { header: ["show-header", "header"], fluid: "fluid", title: "title", icon: "icon", actions: "actions", busy: "busy", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], view: "view", metaItems: ["meta-items", "metaItems"] }, outputs: { onAction: "onAction", onSearch: "onSearch" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\
|
|
2512
|
+
ViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: { header: ["show-header", "header"], fluid: "fluid", title: "title", icon: "icon", actions: "actions", busy: "busy", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], view: "view", metaItems: ["meta-items", "metaItems"] }, outputs: { onAction: "onAction", onSearch: "onSearch" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\n\n <div class=\"view-layout-title-container\">\n\n <div class=\"view-layout-title-container-inner\">\n <div class=\"flex items-center\">\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title}}</h1>\n </div>\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\n <ng-container *ngFor=\"let meta of metaItems\">\n <div class=\"meta-item-container\">\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\n <span class=\"meta-text\">{{meta.text}}</span>\n </div>\n </ng-container>\n </div>\n </div>\n\n <div class=\"flex items-center justify-end\">\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\n\n <ng-container *ngSwitchCase=\"'switch-view'\">\n <button [disabled]=\"view === action.param\" type=\"button\" href=\"#\" class=\"ml-1 disabled:opacity-50 btn-view-header\" (click)=\"switchViewActionClick(action)\">\n <span class=\"inline-block relative\">\n <i [class]=\"action.icon\"></i>\n <span *ngIf=\"view === action.param\" class=\"selected-view-indicator\"></span>\n </span>\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'search'\">\n <label for=\"search\" class=\"sr-only\">Search</label>\n <div class=\"search-container\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\n <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\n </svg>-->\n </div>\n <input id=\"search\" #search class=\"search-input\" [placeholder]=\"searchPlaceholder\"\n type=\"search\" name=\"search\" (input)=\"searchActionType(search.value)\" (onsearch)=\"handleClear($event)\">\n </div>\n <button type=\"button\" href=\"#\" class=\"btn-view-header rounded-l-none\" [title]=\"action.tooltip\" (click)=\"searchActionClick(action, search.value)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'router-link'\">\n <button type=\"button\" href=\"#\" class=\"ml-1 btn-view-header\" [title]=\"action.tooltip\" (click)=\"routerLinkActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n\n\n <ng-container *ngSwitchDefault>\n <button type=\"button\" class=\"ml-1 btn-view-header\" [title]=\"action.tooltip\" (click)=\"emitActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n</header>\n\n<!-- component -->\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\n <ng-content></ng-content>\n</div>\n", dependencies: [{ 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: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
|
|
2513
2513
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ViewLayoutComponent, decorators: [{
|
|
2514
2514
|
type: Component,
|
|
2515
|
-
args: [{ selector: 'lib-view-layout', template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\
|
|
2515
|
+
args: [{ selector: 'lib-view-layout', template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\n\n <div class=\"view-layout-title-container\">\n\n <div class=\"view-layout-title-container-inner\">\n <div class=\"flex items-center\">\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title}}</h1>\n </div>\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\n <ng-container *ngFor=\"let meta of metaItems\">\n <div class=\"meta-item-container\">\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\n <span class=\"meta-text\">{{meta.text}}</span>\n </div>\n </ng-container>\n </div>\n </div>\n\n <div class=\"flex items-center justify-end\">\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\n\n <ng-container *ngSwitchCase=\"'switch-view'\">\n <button [disabled]=\"view === action.param\" type=\"button\" href=\"#\" class=\"ml-1 disabled:opacity-50 btn-view-header\" (click)=\"switchViewActionClick(action)\">\n <span class=\"inline-block relative\">\n <i [class]=\"action.icon\"></i>\n <span *ngIf=\"view === action.param\" class=\"selected-view-indicator\"></span>\n </span>\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'search'\">\n <label for=\"search\" class=\"sr-only\">Search</label>\n <div class=\"search-container\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\n <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\n </svg>-->\n </div>\n <input id=\"search\" #search class=\"search-input\" [placeholder]=\"searchPlaceholder\"\n type=\"search\" name=\"search\" (input)=\"searchActionType(search.value)\" (onsearch)=\"handleClear($event)\">\n </div>\n <button type=\"button\" href=\"#\" class=\"btn-view-header rounded-l-none\" [title]=\"action.tooltip\" (click)=\"searchActionClick(action, search.value)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'router-link'\">\n <button type=\"button\" href=\"#\" class=\"ml-1 btn-view-header\" [title]=\"action.tooltip\" (click)=\"routerLinkActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n\n\n <ng-container *ngSwitchDefault>\n <button type=\"button\" class=\"ml-1 btn-view-header\" [title]=\"action.tooltip\" (click)=\"emitActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n</header>\n\n<!-- component -->\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
2516
2516
|
}], ctorParameters: function () { return [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }]; }, propDecorators: { searchInput$: [{
|
|
2517
2517
|
type: ViewChild,
|
|
2518
2518
|
args: ['search']
|
|
@@ -2570,10 +2570,10 @@ class ModelViewLayoutComponent {
|
|
|
2570
2570
|
}
|
|
2571
2571
|
}
|
|
2572
2572
|
ModelViewLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ModelViewLayoutComponent, deps: [{ token: i1.Location }], target: i0.ɵɵFactoryTarget.Component });
|
|
2573
|
-
ModelViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ModelViewLayoutComponent, selector: "lib-model-view-layout", inputs: { title: "title", primary: ["primary-links", "primary"], secondary: ["secondary-links", "secondary"], metaItems: ["meta-items", "metaItems"] }, ngImport: i0, template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\">\
|
|
2573
|
+
ModelViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ModelViewLayoutComponent, selector: "lib-model-view-layout", inputs: { title: "title", primary: ["primary-links", "primary"], secondary: ["secondary-links", "secondary"], metaItems: ["meta-items", "metaItems"] }, ngImport: i0, template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\">\n <main class=\"model-view-container\">\n <div class=\"model-view-container-inner\">\n <aside class=\"model-view-aside\">\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\n <div class=\"model-view-aside-header-container\">\n <div class=\"model-view-aside-header-container-inner\">\n <ng-content></ng-content>\n </div>\n <!-- menu items -->\n <div class=\"model-view-menu-container\">\n <nav class=\"model-view-menu-nav\">\n <div class=\"model-view-menu-item\">\n <ng-container *ngFor=\"let section of primary\">\n <a href=\"#\"\n [routerLinkActive]=\"['view-nav-link-active']\"\n [routerLink]=\"section.link\"\n class=\"view-nav-link\">\n {{section.text}}\n </a>\n </ng-container>\n </div>\n <div class=\"model-view-menu-item-far\">\n <ng-container *ngFor=\"let section of secondary\">\n <a href=\"#\"\n [routerLinkActive]=\"['view-nav-link-active']\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n [routerLink]=\"section.link\"\n class=\"view-nav-link\">\n {{section.text}}\n </a>\n </ng-container>\n </div>\n </nav>\n </div>\n </div>\n </section>\n </aside>\n <div class=\"model-view-details-container\">\n <router-outlet></router-outlet>\n </div>\n </div>\n </main>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] });
|
|
2574
2574
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ModelViewLayoutComponent, decorators: [{
|
|
2575
2575
|
type: Component,
|
|
2576
|
-
args: [{ selector: 'lib-model-view-layout', template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\">\
|
|
2576
|
+
args: [{ selector: 'lib-model-view-layout', template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\">\n <main class=\"model-view-container\">\n <div class=\"model-view-container-inner\">\n <aside class=\"model-view-aside\">\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\n <div class=\"model-view-aside-header-container\">\n <div class=\"model-view-aside-header-container-inner\">\n <ng-content></ng-content>\n </div>\n <!-- menu items -->\n <div class=\"model-view-menu-container\">\n <nav class=\"model-view-menu-nav\">\n <div class=\"model-view-menu-item\">\n <ng-container *ngFor=\"let section of primary\">\n <a href=\"#\"\n [routerLinkActive]=\"['view-nav-link-active']\"\n [routerLink]=\"section.link\"\n class=\"view-nav-link\">\n {{section.text}}\n </a>\n </ng-container>\n </div>\n <div class=\"model-view-menu-item-far\">\n <ng-container *ngFor=\"let section of secondary\">\n <a href=\"#\"\n [routerLinkActive]=\"['view-nav-link-active']\"\n [routerLinkActiveOptions]=\"{ exact: true }\"\n [routerLink]=\"section.link\"\n class=\"view-nav-link\">\n {{section.text}}\n </a>\n </ng-container>\n </div>\n </nav>\n </div>\n </div>\n </section>\n </aside>\n <div class=\"model-view-details-container\">\n <router-outlet></router-outlet>\n </div>\n </div>\n </main>\n" }]
|
|
2577
2577
|
}], ctorParameters: function () { return [{ type: i1.Location }]; }, propDecorators: { title: [{
|
|
2578
2578
|
type: Input
|
|
2579
2579
|
}], primary: [{
|
|
@@ -2644,10 +2644,10 @@ class SideViewLayoutComponent {
|
|
|
2644
2644
|
}
|
|
2645
2645
|
}
|
|
2646
2646
|
SideViewLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SideViewLayoutComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2647
|
-
SideViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SideViewLayoutComponent, selector: "lib-side-view-layout", inputs: { title: "title", showActions: "showActions", disabled: "disabled", returnPath: ["return-path", "returnPath"], okLabel: ["ok-label", "okLabel"], okShow: ["ok-show", "okShow"], closeOnOk: ["ok-close-dialog", "closeOnOk"], cancelLabel: ["cancel-label", "cancelLabel"], cancelShow: ["cancel-show", "cancelShow"], forceLocationBack: ["force-location-back", "forceLocationBack"] }, outputs: { cancel: "cancel", ok: "ok" }, ngImport: i0, template: "<div class=\"side-view-layout-size-box\">\
|
|
2647
|
+
SideViewLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: SideViewLayoutComponent, selector: "lib-side-view-layout", inputs: { title: "title", showActions: "showActions", disabled: "disabled", returnPath: ["return-path", "returnPath"], okLabel: ["ok-label", "okLabel"], okShow: ["ok-show", "okShow"], closeOnOk: ["ok-close-dialog", "closeOnOk"], cancelLabel: ["cancel-label", "cancelLabel"], cancelShow: ["cancel-show", "cancelShow"], forceLocationBack: ["force-location-back", "forceLocationBack"] }, outputs: { cancel: "cancel", ok: "ok" }, ngImport: i0, template: "<div class=\"side-view-layout-size-box\">\n <div class=\"side-view-layout-container\">\n <div class=\"side-view-layout-container-inner\">\n <div class=\"side-view-layout-header-margins\">\n <div class=\"side-view-layout-header-container\">\n <h2 class=\"side-view-layout-header-title\" id=\"slide-over-title\">\n {{title}}\n </h2>\n <div class=\"side-view-layout-close-button-container\">\n <button (click)=\"emitClose()\" class=\"side-view-layout-close-button\">\n <span class=\"sr-only\">Close panel</span>\n <!-- Heroicon name: outline/x -->\n <svg class=\"side-view-layout-close-button-icon\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n <div class=\"side-view-layout-content-container\">\n <!-- Replace with your content -->\n <ng-content></ng-content>\n <!-- /End replace -->\n </div>\n </div>\n <div *ngIf=\"showActions\" class=\"side-view-layout-actions-container\">\n <button *ngIf=\"cancelShow\" (click)=\"emitCancel()\" type=\"button\" class=\"side-view-layout-action-button-cancel\">\n {{cancelLabel}}\n </button>\n <button *ngIf=\"okShow\" (click)=\"emitOK()\" class=\"side-view-layout-action-button-submit\" [disabled]=\"disabled\">\n {{okLabel}}\n </button>\n </div>\n </div>\n</div>\n\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
2648
2648
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: SideViewLayoutComponent, decorators: [{
|
|
2649
2649
|
type: Component,
|
|
2650
|
-
args: [{ selector: 'lib-side-view-layout', template: "<div class=\"side-view-layout-size-box\">\
|
|
2650
|
+
args: [{ selector: 'lib-side-view-layout', template: "<div class=\"side-view-layout-size-box\">\n <div class=\"side-view-layout-container\">\n <div class=\"side-view-layout-container-inner\">\n <div class=\"side-view-layout-header-margins\">\n <div class=\"side-view-layout-header-container\">\n <h2 class=\"side-view-layout-header-title\" id=\"slide-over-title\">\n {{title}}\n </h2>\n <div class=\"side-view-layout-close-button-container\">\n <button (click)=\"emitClose()\" class=\"side-view-layout-close-button\">\n <span class=\"sr-only\">Close panel</span>\n <!-- Heroicon name: outline/x -->\n <svg class=\"side-view-layout-close-button-icon\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n </div>\n </div>\n <div class=\"side-view-layout-content-container\">\n <!-- Replace with your content -->\n <ng-content></ng-content>\n <!-- /End replace -->\n </div>\n </div>\n <div *ngIf=\"showActions\" class=\"side-view-layout-actions-container\">\n <button *ngIf=\"cancelShow\" (click)=\"emitCancel()\" type=\"button\" class=\"side-view-layout-action-button-cancel\">\n {{cancelLabel}}\n </button>\n <button *ngIf=\"okShow\" (click)=\"emitOK()\" class=\"side-view-layout-action-button-submit\" [disabled]=\"disabled\">\n {{okLabel}}\n </button>\n </div>\n </div>\n</div>\n\n" }]
|
|
2651
2651
|
}], ctorParameters: function () { return [{ type: i1.Location }, { type: i1$1.Router }]; }, propDecorators: { title: [{
|
|
2652
2652
|
type: Input
|
|
2653
2653
|
}], showActions: [{
|
|
@@ -2729,10 +2729,10 @@ class FormLayoutComponent {
|
|
|
2729
2729
|
}
|
|
2730
2730
|
}
|
|
2731
2731
|
FormLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: FormLayoutComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2732
|
-
FormLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], actions: "actions", subTitle: ["sub-title", "subTitle"] }, outputs: { onAction: "onAction", onSearch: "onSearch", onComplete: "onComplete" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<div class=\"form-layout-container\">\
|
|
2732
|
+
FormLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], actions: "actions", subTitle: ["sub-title", "subTitle"] }, outputs: { onAction: "onAction", onSearch: "onSearch", onComplete: "onComplete" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<div class=\"form-layout-container\">\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\n <div class=\"form-header-inner\">\n <h3 class=\"form-title\">\n {{ title }}\n </h3>\n <p class=\"form-subtitle\">\n {{ subTitle }}\n </p>\n </div>\n <div class=\"form-header-actions\">\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\n <ng-container *ngSwitchCase=\"'search'\">\n <label for=\"search\" class=\"sr-only\">Search</label>\n <div class=\"search-container\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\n <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\n </svg>-->\n </div>\n <input id=\"search\"\n #search\n class=\"form-search-input\"\n [placeholder]=\"searchPlaceholder\"\n type=\"search\"\n name=\"search\"\n (input)=\"searchActionType(search.value)\">\n </div>\n <button type=\"button\"\n href=\"#\"\n class=\"btn-form-view-header-search\"\n [title]=\"action.tooltip\"\n (click)=\"searchActionClick(action, search.value)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"'router-link'\">\n <button type=\"button\"\n href=\"#\"\n class=\"ml-1 btn-form-view-header\"\n [title]=\"action.tooltip\"\n (click)=\"routerLinkActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button type=\"button\"\n class=\"ml-1 btn-form-view-header\"\n [title]=\"action.tooltip\"\n (click)=\"emitActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n <div class=\"form-content-container\">\n <div [ngClass]=\"{'form-content-container-inner': actions}\">\n <ng-content></ng-content>\n </div>\n </div>\n <lib-side-pane #formPane (onComplete)=\"onSidePaneDeactivated($event)\">\n <router-outlet name=\"formRightPane\"\n (activate)=\"formPane.onSidePaneActivated($event)\"\n (deactivate)=\"formPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n</div>\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: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete"] }] });
|
|
2733
2733
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: FormLayoutComponent, decorators: [{
|
|
2734
2734
|
type: Component,
|
|
2735
|
-
args: [{ selector: 'lib-form-layout', template: "<div class=\"form-layout-container\">\
|
|
2735
|
+
args: [{ selector: 'lib-form-layout', template: "<div class=\"form-layout-container\">\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\n <div class=\"form-header-inner\">\n <h3 class=\"form-title\">\n {{ title }}\n </h3>\n <p class=\"form-subtitle\">\n {{ subTitle }}\n </p>\n </div>\n <div class=\"form-header-actions\">\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\n <ng-container *ngSwitchCase=\"'search'\">\n <label for=\"search\" class=\"sr-only\">Search</label>\n <div class=\"search-container\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\n <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\n </svg>-->\n </div>\n <input id=\"search\"\n #search\n class=\"form-search-input\"\n [placeholder]=\"searchPlaceholder\"\n type=\"search\"\n name=\"search\"\n (input)=\"searchActionType(search.value)\">\n </div>\n <button type=\"button\"\n href=\"#\"\n class=\"btn-form-view-header-search\"\n [title]=\"action.tooltip\"\n (click)=\"searchActionClick(action, search.value)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"'router-link'\">\n <button type=\"button\"\n href=\"#\"\n class=\"ml-1 btn-form-view-header\"\n [title]=\"action.tooltip\"\n (click)=\"routerLinkActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button type=\"button\"\n class=\"ml-1 btn-form-view-header\"\n [title]=\"action.tooltip\"\n (click)=\"emitActionClick(action)\">\n <i [class]=\"action.icon\"></i>\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n <div class=\"form-content-container\">\n <div [ngClass]=\"{'form-content-container-inner': actions}\">\n <ng-content></ng-content>\n </div>\n </div>\n <lib-side-pane #formPane (onComplete)=\"onSidePaneDeactivated($event)\">\n <router-outlet name=\"formRightPane\"\n (activate)=\"formPane.onSidePaneActivated($event)\"\n (deactivate)=\"formPane.onSidePaneDeactivated($event)\"></router-outlet>\n </lib-side-pane>\n</div>\n" }]
|
|
2736
2736
|
}], ctorParameters: function () { return [{ type: i1$1.Router }]; }, propDecorators: { searchInput$: [{
|
|
2737
2737
|
type: ViewChild,
|
|
2738
2738
|
args: ['search']
|
|
@@ -2835,10 +2835,10 @@ class ErrorComponent {
|
|
|
2835
2835
|
}
|
|
2836
2836
|
}
|
|
2837
2837
|
ErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2838
|
-
ErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ErrorComponent, selector: "lib-error", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\
|
|
2838
|
+
ErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ErrorComponent, selector: "lib-error", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\n <div class=\"bg-gray-600 view-container\">\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\n <span class=\"block\">500</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n</lib-view-layout>\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] });
|
|
2839
2839
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ErrorComponent, decorators: [{
|
|
2840
2840
|
type: Component,
|
|
2841
|
-
args: [{ selector: 'lib-error', template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\
|
|
2841
|
+
args: [{ selector: 'lib-error', template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\n <div class=\"bg-gray-600 view-container\">\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\n <span class=\"block\">500</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n</lib-view-layout>\n" }]
|
|
2842
2842
|
}] });
|
|
2843
2843
|
|
|
2844
2844
|
class PageNotFoundComponent {
|
|
@@ -2847,10 +2847,10 @@ class PageNotFoundComponent {
|
|
|
2847
2847
|
}
|
|
2848
2848
|
}
|
|
2849
2849
|
PageNotFoundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2850
|
-
PageNotFoundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: PageNotFoundComponent, selector: "lib-page-not-found", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\
|
|
2850
|
+
PageNotFoundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: PageNotFoundComponent, selector: "lib-page-not-found", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\n <div class=\"text-gray-900\">\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\n <span class=\"block\">404</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\n <a href=\"/\"\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n</lib-view-layout>\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] });
|
|
2851
2851
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: PageNotFoundComponent, decorators: [{
|
|
2852
2852
|
type: Component,
|
|
2853
|
-
args: [{ selector: 'lib-page-not-found', template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\
|
|
2853
|
+
args: [{ selector: 'lib-page-not-found', template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\n <div class=\"text-gray-900\">\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\n <span class=\"block\">404</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\n <a href=\"/\"\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n</lib-view-layout>\n" }]
|
|
2854
2854
|
}], ctorParameters: function () { return []; } });
|
|
2855
2855
|
|
|
2856
2856
|
class UnauthorizedComponent {
|
|
@@ -2858,10 +2858,10 @@ class UnauthorizedComponent {
|
|
|
2858
2858
|
ngOnInit() { }
|
|
2859
2859
|
}
|
|
2860
2860
|
UnauthorizedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: UnauthorizedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2861
|
-
UnauthorizedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: UnauthorizedComponent, selector: "lib-unauthorized", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\
|
|
2861
|
+
UnauthorizedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: UnauthorizedComponent, selector: "lib-unauthorized", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\n <div class=\"bg-gray-600 view-container\">\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\n <span class=\"block\">401</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n </lib-view-layout>\n\n\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] });
|
|
2862
2862
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: UnauthorizedComponent, decorators: [{
|
|
2863
2863
|
type: Component,
|
|
2864
|
-
args: [{ selector: 'lib-unauthorized', template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\
|
|
2864
|
+
args: [{ selector: 'lib-unauthorized', template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\n <div class=\"bg-gray-600 view-container\">\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\n <span class=\"block\">401</span>\n </h2>\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\n </a>\n </div>\n </div>\n </lib-view-layout>\n\n\n" }]
|
|
2865
2865
|
}], ctorParameters: function () { return []; } });
|
|
2866
2866
|
|
|
2867
2867
|
class AddressPipe {
|
|
@@ -3286,23 +3286,23 @@ class ModalContainerComponent {
|
|
|
3286
3286
|
}
|
|
3287
3287
|
}
|
|
3288
3288
|
ModalContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ModalContainerComponent, deps: [{ token: ModalOptions }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
3289
|
-
ModalContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ModalContainerComponent, selector: "lib-modal-container", host: { attributes: { "role": "dialog", "tabindex": "-1" }, listeners: { "mousedown": "onClickStarted($event)", "click": "onClickStop($event)", "window:popstate": "onPopState()", "window:keydown.esc": "onEsc($event)" }, properties: { "attr.aria-modal": "true", "attr.aria-labelledby": "config.ariaLabelledBy", "attr.aria-describedby": "config.ariaDescribedby" }, classAttribute: "modal" }, ngImport: i0, template: `
|
|
3290
|
-
<div [class]="'modal-dialog' + (config.class ? ' ' + config.class : '')" role="document" focusTrap>
|
|
3291
|
-
<div class="modal-content">
|
|
3292
|
-
<ng-content></ng-content>
|
|
3293
|
-
</div>
|
|
3294
|
-
</div>
|
|
3289
|
+
ModalContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: ModalContainerComponent, selector: "lib-modal-container", host: { attributes: { "role": "dialog", "tabindex": "-1" }, listeners: { "mousedown": "onClickStarted($event)", "click": "onClickStop($event)", "window:popstate": "onPopState()", "window:keydown.esc": "onEsc($event)" }, properties: { "attr.aria-modal": "true", "attr.aria-labelledby": "config.ariaLabelledBy", "attr.aria-describedby": "config.ariaDescribedby" }, classAttribute: "modal" }, ngImport: i0, template: `
|
|
3290
|
+
<div [class]="'modal-dialog' + (config.class ? ' ' + config.class : '')" role="document" focusTrap>
|
|
3291
|
+
<div class="modal-content">
|
|
3292
|
+
<ng-content></ng-content>
|
|
3293
|
+
</div>
|
|
3294
|
+
</div>
|
|
3295
3295
|
`, isInline: true });
|
|
3296
3296
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: ModalContainerComponent, decorators: [{
|
|
3297
3297
|
type: Component,
|
|
3298
3298
|
args: [{
|
|
3299
3299
|
selector: 'lib-modal-container',
|
|
3300
|
-
template: `
|
|
3301
|
-
<div [class]="'modal-dialog' + (config.class ? ' ' + config.class : '')" role="document" focusTrap>
|
|
3302
|
-
<div class="modal-content">
|
|
3303
|
-
<ng-content></ng-content>
|
|
3304
|
-
</div>
|
|
3305
|
-
</div>
|
|
3300
|
+
template: `
|
|
3301
|
+
<div [class]="'modal-dialog' + (config.class ? ' ' + config.class : '')" role="document" focusTrap>
|
|
3302
|
+
<div class="modal-content">
|
|
3303
|
+
<ng-content></ng-content>
|
|
3304
|
+
</div>
|
|
3305
|
+
</div>
|
|
3306
3306
|
`,
|
|
3307
3307
|
host: {
|
|
3308
3308
|
class: 'modal',
|
|
@@ -3782,5 +3782,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImpor
|
|
|
3782
3782
|
* Generated bundle index. Do not edit.
|
|
3783
3783
|
*/
|
|
3784
3784
|
|
|
3785
|
-
export { APP_LANGUAGES, APP_LINKS, APP_NOTIFICATIONS, AddressPipe, AuthCallbackComponent, AuthRenewComponent, AvatarInitialsComponent, BaseListComponent, ClickOutsideDirective, CollapsiblePanelComponent, ComboboxComponent, ComponentLoaderFactory, DatepickerComponent, DefaultShellConfig, DropDownMenuComponent, DurationFormatPipe, ErrorComponent, ExternalNavLink, FormLayoutComponent, FragmentNavLink, HeaderMetaItem, Icons, IndiceComponentsModule, KpiTileComponent, LIBSTEPPER_ACCESSOR, LIBTABGROUP_ACCESSOR, LibStepComponent, LibStepInfoDirective, LibStepLabelDirective, LibStepperComponent, LibTabComponent, LibTabGroupComponent, ListColumnComponent, ListDetailsSectionComponent, ListTileComponent, ListViewComponent, ListViewEmptyStateComponent, ListViewType, LoggedOutComponent, MODAL_CONFIG_DEFAULT_OVERRIDE, MenuOption, Modal, ModalOptions, ModalService, ModelViewLayoutComponent, NULL_TOAST, NavLink, NavLinksListComponent, NotificationNavLink, PageNotFoundComponent, PagerComponent, RouterViewAction, SCREEN_SIZE, SHELL_CONFIG, ShellFooterComponent, ShellHeaderComponent, ShellLayoutComponent, ShellLayoutType, SidePaneComponent, SidePaneOverlayType, SidePaneSize, SideViewLayoutComponent, SkeletonLoaderComponent, StepState, SwitchViewAction, ToastType, ToasterComponent, ToasterContainerComponent, ToasterService, ToggleComponent, UnauthorizedComponent, ViewAction, ViewLayoutComponent };
|
|
3785
|
+
export { APP_LANGUAGES, APP_LINKS, APP_NOTIFICATIONS, AddressPipe, AuthCallbackComponent, AuthRenewComponent, AvatarInitialsComponent, BaseListComponent, ClickOutsideDirective, CollapsiblePanelComponent, ComboboxComponent, ComponentLoaderFactory, DatepickerComponent, DefaultShellConfig, DropDownMenuComponent, DurationFormatPipe, ErrorComponent, ExternalNavLink, FormLayoutComponent, FragmentNavLink, HeaderMetaItem, Icons, IndiceComponentsModule, KpiTileComponent, LIBSTEPPER_ACCESSOR, LIBTABGROUP_ACCESSOR, LibStepComponent, LibStepInfoDirective, LibStepLabelDirective, LibStepperComponent, LibTabComponent, LibTabGroupComponent, ListColumnComponent, ListDetailsSectionComponent, ListTileComponent, ListViewComponent, ListViewEmptyStateComponent, ListViewType, LoggedOutComponent, MODAL_CONFIG_DEFAULT_OVERRIDE, MenuOption, Modal, ModalOptions, ModalService, ModelViewLayoutComponent, NULL_TOAST, NavLink, NavLinksListComponent, NotificationNavLink, PageNotFoundComponent, PagerComponent, RouterViewAction, SCREEN_SIZE, SHELL_CONFIG, ShellFooterComponent, ShellHeaderComponent, ShellLayoutComponent, ShellLayoutType, SidePaneComponent, SidePaneOverlayType, SidePaneSize, SideViewLayoutComponent, SkeletonLoaderComponent, StepState, StepperType, SwitchViewAction, ToastType, ToasterComponent, ToasterContainerComponent, ToasterService, ToggleComponent, UnauthorizedComponent, ViewAction, ViewLayoutComponent };
|
|
3786
3786
|
//# sourceMappingURL=indice-ng-components.mjs.map
|