aril 1.2.7 → 1.2.8
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/esm2022/theme/layout/app/site-map/site-map-sidebar.component.mjs +3 -3
- package/esm2022/ui-business/trace-drawer/index.mjs +3 -1
- package/esm2022/ui-business/trace-drawer/src/app-log.service.mjs +25 -0
- package/esm2022/ui-business/trace-drawer/src/interfaces.mjs +1 -1
- package/esm2022/ui-business/trace-drawer/src/trace-drawer.component.mjs +143 -15
- package/esm2022/util/sync-active-tab-route/src/sync-active-tab-route.directive.mjs +1 -1
- package/fesm2022/aril-theme-layout.mjs +2 -2
- package/fesm2022/aril-theme-layout.mjs.map +1 -1
- package/fesm2022/aril-ui-business-trace-drawer.mjs +162 -16
- package/fesm2022/aril-ui-business-trace-drawer.mjs.map +1 -1
- package/fesm2022/aril-util-sync-active-tab-route.mjs.map +1 -1
- package/package.json +170 -170
- package/theme/layout/app/site-map/site-map-sidebar.component.html +121 -121
- package/ui-business/trace-drawer/index.d.ts +2 -0
- package/ui-business/trace-drawer/src/app-log.service.d.ts +10 -0
- package/ui-business/trace-drawer/src/interfaces.d.ts +32 -0
- package/ui-business/trace-drawer/src/trace-drawer.component.d.ts +22 -1
|
@@ -1121,7 +1121,7 @@ class SiteMapSidebarComponent {
|
|
|
1121
1121
|
return node.key || `${index}`;
|
|
1122
1122
|
}
|
|
1123
1123
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SiteMapSidebarComponent, deps: [{ token: LayoutService }, { token: i5.TranslocoService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1124
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: SiteMapSidebarComponent, isStandalone: true, selector: "app-site-map-sidebar", ngImport: i0, template: "<p-sidebar\r\n\t[(visible)]=\"visible\"\r\n\tposition=\"right\"\r\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\r\n\tstyleClass=\"layout-sitemap-sidebar w-full sm:w-30rem\"\r\n\t*transloco=\"let t; read: 'siteMap'\">\r\n\t<ng-template pTemplate=\"header\">\r\n\t\t<div class=\"flex align-items-center justify-content-between gap-2 w-full\">\r\n\t\t\t<div class=\"flex align-items-center gap-2\">\r\n\t\t\t\t<i class=\"pi pi-sitemap text-primary text-xl\"></i>\r\n\t\t\t\t<span class=\"font-bold text-lg\">{{ t('siteMap') }}</span>\r\n\t\t\t\t<span class=\"total-pages\">{{ totalPages() }} {{ t('pages') }}</span>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-template>\r\n\r\n\t<div class=\"sitemap-content\">\r\n\t\t<div class=\"search-section grid p-fluid m-0\">\r\n\t\t\t<aril-text\r\n\t\t\t\t[placeholder]=\"t('searchPages')\"\r\n\t\t\t\t[(ngModel)]=\"searchTerm\"\r\n\t\t\t\t(ngModelChange)=\"onSearchChange()\"\r\n\t\t\t\tclass=\"col-10 m-0\">\r\n\t\t\t</aril-text>\r\n\t\t\t@if (filteredNodes().length > 0) {\r\n\t\t\t<div class=\"col-2 flex align-items-center m-0 p-0\">\r\n\t\t\t\t\t<fa-icon\r\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesDown\"\r\n\t\t\t\t\t\tsize=\"xl\"\r\n\t\t\t\t\t\tstyle=\"color: var(--primary-color)\"\r\n\t\t\t\t\t\tclass=\"col-1 cursor-pointer\"\r\n\t\t\t\t\t\t[pTooltip]=\"t('expandAll')\"\r\n\t\t\t\t\t\ttooltipPosition=\"top\"\r\n\t\t\t\t\t\t(click)=\"expandAll()\">\r\n\t\t\t\t\t</fa-icon>\r\n\t\t\t\t\t<fa-icon\r\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesUp\"\r\n\t\t\t\t\t\tsize=\"xl\"\r\n\t\t\t\t\t\tstyle=\"color: var(--red-500)\"\r\n\t\t\t\t\t\tclass=\"col-1 ml-3 cursor-pointer\"\r\n\t\t\t\t\t\t[pTooltip]=\"t('collapseAll')\"\r\n\t\t\t\t\t\ttooltipPosition=\"top\"\r\n\t\t\t\t\t\t(click)=\"collapseAll()\">\r\n\t\t\t\t\t</fa-icon>\r\n\t\t\t\t</div>\r\n\t\t\t}\r\n\t\t</div>\r\n\r\n\t\t<!-- Site Map Tree -->\r\n\t\t@if (filteredNodes().length > 0) {\r\n\t\t\t<div class=\"sitemap-tree\">\r\n\t\t\t\t<p-scrollPanel [style]=\"{ width: '100%', height: '100%' }\">\r\n\t\t\t\t\t<div class=\"tree-container\">\r\n\t\t\t\t\t\t@for (node of filteredNodes(); track trackByKey($index, node)) {\r\n\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: node, level: 0 }\"></ng-container>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</p-scrollPanel>\r\n\t\t\t</div>\r\n\t\t} @else {\r\n\t\t\t<div class=\"empty-state\">\r\n\t\t\t\t<div class=\"empty-content\">\r\n\t\t\t\t\t<i class=\"pi pi-sitemap empty-icon\"></i>\r\n\t\t\t\t\t<h3 class=\"empty-title\">\r\n\t\t\t\t\t\t{{ searchTerm() ? t('noSearchResults') : t('noPages') }}\r\n\t\t\t\t\t</h3>\r\n\t\t\t\t\t<p class=\"empty-message\">\r\n\t\t\t\t\t\t{{ searchTerm() ? t('tryDifferentKeywords') : '' }}\r\n\t\t\t\t\t</p>\r\n\t\t\t\t\t@if (searchTerm()) {\r\n\t\t\t\t\t\t<aril-button\r\n\t\t\t\t\t\t\t[label]=\"t('clearSearch')\"\r\n\t\t\t\t\t\t\ticon=\"TIMES\"\r\n\t\t\t\t\t\t\tcolor=\"secondary\"\r\n\t\t\t\t\t\t\t[outlined]=\"true\"\r\n\t\t\t\t\t\t\tsize=\"sm\"\r\n\t\t\t\t\t\t\t(clickEvent)=\"searchTerm.set(''); onSearchChange()\">\r\n\t\t\t\t\t\t</aril-button>\r\n\t\t\t\t\t}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t}\r\n\r\n\t\t<!-- Recursive Tree Node Template -->\r\n\t\t<ng-template #treeNodeTemplate let-node let-level=\"level\">\r\n\t\t\t<div class=\"tree-node\" [style.margin-left.px]=\"level * 20\">\r\n\t\t\t\t<div\r\n\t\t\t\t\tclass=\"node-item\"\r\n\t\t\t\t\t[class.has-children]=\"node.children && node.children.length > 0\"\r\n\t\t\t\t\t[class.is-page]=\"node.routerLink\"\r\n\t\t\t\t\t[routerLink]=\"node.routerLink\"\r\n\t\t\t\t\t(click)=\"!node.routerLink ? toggleNode(node) : (visible = false)\">\r\n\t\t\t\t\t<div class=\"node-content\">\r\n\t\t\t\t\t\t@if (node.children && node.children.length > 0) {\r\n\t\t\t\t\t\t\t<div class=\"toggle-btn\" (click)=\"$event.stopPropagation(); toggleNode(node)\">\r\n\t\t\t\t\t\t\t\t<i class=\"pi\" [class.pi-chevron-right]=\"!node.expanded\" [class.pi-chevron-down]=\"node.expanded\"></i>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t@if (node.icon) {\r\n\t\t\t\t\t\t\t<i class=\"node-icon\" [class]=\"node.icon\"></i>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\t<span class=\"node-label\">{{ node.label | translateJson }}</span>\r\n\r\n\t\t\t\t\t\t@if (node.routerLink) {\r\n\t\t\t\t\t\t\t<i class=\"external-icon pi pi-external-link\"></i>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<!-- Recursive Children -->\r\n\t\t\t\t@if (node.children && node.expanded) {\r\n\t\t\t\t\t@for (child of node.children; track trackByKey($index, child)) {\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: child, level: level + 1 }\"></ng-container>\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t</div>\r\n\t\t</ng-template>\r\n\t</div>\r\n</p-sidebar>\r\n", styles: [":host ::ng-deep .layout-sitemap-sidebar .p-sidebar-content{padding:0;background:var(--surface-ground)}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header{background:var(--primary-color);color:var(--primary-color-text);padding:1rem .5rem}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header span{font-size:1.1rem;font-weight:600}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header .total-pages{background:#fff3;color:#ffffffe6;padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.sitemap-content{display:flex;flex-direction:column;height:100%;background:var(--surface-ground)}.search-section{padding:1rem;border-bottom:1px solid var(--surface-border);background:var(--surface-0)}.sitemap-tree{flex:1;overflow:hidden}.tree-container{padding:.5rem 0}.tree-node .node-item{display:flex;align-items:center;padding:.5rem 1rem;border-radius:6px;margin:.1rem .5rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.tree-node .node-item:hover{background:var(--surface-hover);border-color:var(--surface-border)}.tree-node .node-item.is-page:hover{background:var(--primary-50);border-color:var(--primary-200)}.tree-node .node-item.is-page:hover .external-icon{opacity:1}.tree-node .node-item.has-children{font-weight:500}.tree-node .node-content{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.tree-node .toggle-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:transparent;border:none;border-radius:4px;color:var(--text-color-secondary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.tree-node .toggle-btn:hover{background:var(--surface-hover);color:var(--primary-color)}.tree-node .toggle-btn i{font-size:.7rem}.tree-node .node-icon{color:var(--primary-color);font-size:.9rem;flex-shrink:0}.tree-node .node-label{flex:1;font-size:.9rem;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-node .external-icon{color:var(--text-color-secondary);font-size:.7rem;opacity:.6;transition:opacity .2s ease;flex-shrink:0}.empty-state{flex:1;display:flex;align-items:center;justify-content:center;padding:2rem}.empty-content{text-align:center;max-width:300px}.empty-icon{font-size:3rem;color:var(--text-color-secondary);margin-bottom:1rem;opacity:.5}.empty-message{font-size:.9rem;color:var(--text-color-secondary);line-height:1.4;margin-bottom:1.5rem}:host ::ng-deep .p-scrollpanel-bar-y{background:var(--primary-200);width:4px;border-radius:2px}:host ::ng-deep .p-scrollpanel-bar-y:hover{background:var(--primary-300)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i6$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ScrollPanelModule }, { kind: "component", type: i7$1.ScrollPanel, selector: "p-scrollPanel", inputs: ["style", "styleClass", "step"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: ButtonComponent, selector: "aril-button:not([click])", inputs: ["label", "loading", "disabled", "raised", "rounded", "text", "outlined", "badge", "size", "icon", "iconPos", "color"], outputs: ["clickEvent"] }, { kind: "component", type: TextComponent, selector: "aril-text[ngModel], aril-text[formControl], aril-text[formControlName]", inputs: ["placeholder", "tabindex", "icon", "iconPos", "size"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "directive", type: i5.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: TranslateJsonPipe, name: "translateJson" }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i10.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] }); }
|
|
1124
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: SiteMapSidebarComponent, isStandalone: true, selector: "app-site-map-sidebar", ngImport: i0, template: "<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-sitemap-sidebar w-full sm:w-30rem\"\n\t*transloco=\"let t; read: 'siteMap'\">\n\t<ng-template pTemplate=\"header\">\n\t\t<div class=\"flex align-items-center justify-content-between gap-2 w-full\">\n\t\t\t<div class=\"flex align-items-center gap-2\">\n\t\t\t\t<i class=\"pi pi-sitemap text-primary text-xl\"></i>\n\t\t\t\t<span class=\"font-bold text-lg\">{{ t('siteMap') }}</span>\n\t\t\t\t<span class=\"total-pages\">{{ totalPages() }} {{ t('pages') }}</span>\n\t\t\t</div>\n\t\t</div>\n\t</ng-template>\n\n\t<div class=\"sitemap-content\">\n\t\t<div class=\"search-section grid p-fluid m-0\">\n\t\t\t<aril-text\n\t\t\t\t[placeholder]=\"t('searchPages')\"\n\t\t\t\t[(ngModel)]=\"searchTerm\"\n\t\t\t\t(ngModelChange)=\"onSearchChange()\"\n\t\t\t\tclass=\"col-10 m-0\">\n\t\t\t</aril-text>\n\t\t\t@if (filteredNodes().length > 0) {\n\t\t\t<div class=\"col-2 flex align-items-center m-0 p-0\">\n\t\t\t\t\t<fa-icon\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesDown\"\n\t\t\t\t\t\tsize=\"xl\"\n\t\t\t\t\t\tstyle=\"color: var(--primary-color)\"\n\t\t\t\t\t\tclass=\"col-1 cursor-pointer\"\n\t\t\t\t\t\t[pTooltip]=\"t('expandAll')\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t(click)=\"expandAll()\">\n\t\t\t\t\t</fa-icon>\n\t\t\t\t\t<fa-icon\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesUp\"\n\t\t\t\t\t\tsize=\"xl\"\n\t\t\t\t\t\tstyle=\"color: var(--red-500)\"\n\t\t\t\t\t\tclass=\"col-1 ml-3 cursor-pointer\"\n\t\t\t\t\t\t[pTooltip]=\"t('collapseAll')\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t(click)=\"collapseAll()\">\n\t\t\t\t\t</fa-icon>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\n\t\t<!-- Site Map Tree -->\n\t\t@if (filteredNodes().length > 0) {\n\t\t\t<div class=\"sitemap-tree\">\n\t\t\t\t<p-scrollPanel [style]=\"{ width: '100%', height: '100%' }\">\n\t\t\t\t\t<div class=\"tree-container\">\n\t\t\t\t\t\t@for (node of filteredNodes(); track trackByKey($index, node)) {\n\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: node, level: 0 }\"></ng-container>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</p-scrollPanel>\n\t\t\t</div>\n\t\t} @else {\n\t\t\t<div class=\"empty-state\">\n\t\t\t\t<div class=\"empty-content\">\n\t\t\t\t\t<i class=\"pi pi-sitemap empty-icon\"></i>\n\t\t\t\t\t<h3 class=\"empty-title\">\n\t\t\t\t\t\t{{ searchTerm() ? t('noSearchResults') : t('noPages') }}\n\t\t\t\t\t</h3>\n\t\t\t\t\t<p class=\"empty-message\">\n\t\t\t\t\t\t{{ searchTerm() ? t('tryDifferentKeywords') : '' }}\n\t\t\t\t\t</p>\n\t\t\t\t\t@if (searchTerm()) {\n\t\t\t\t\t\t<aril-button\n\t\t\t\t\t\t\t[label]=\"t('clearSearch')\"\n\t\t\t\t\t\t\ticon=\"TIMES\"\n\t\t\t\t\t\t\tcolor=\"secondary\"\n\t\t\t\t\t\t\t[outlined]=\"true\"\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t(clickEvent)=\"searchTerm.set(''); onSearchChange()\">\n\t\t\t\t\t\t</aril-button>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\n\t\t<!-- Recursive Tree Node Template -->\n\t\t<ng-template #treeNodeTemplate let-node let-level=\"level\">\n\t\t\t<div class=\"tree-node\" [style.margin-left.px]=\"level * 20\">\n\t\t\t\t<div\n\t\t\t\t\tclass=\"node-item\"\n\t\t\t\t\t[class.has-children]=\"node.children && node.children.length > 0\"\n\t\t\t\t\t[class.is-page]=\"node.routerLink\"\n\t\t\t\t\t[routerLink]=\"node.routerLink\"\n\t\t\t\t\t(click)=\"!node.routerLink ? toggleNode(node) : (visible = false)\">\n\t\t\t\t\t<div class=\"node-content\">\n\t\t\t\t\t\t@if (node.children && node.children.length > 0) {\n\t\t\t\t\t\t\t<div class=\"toggle-btn\" (click)=\"$event.stopPropagation(); toggleNode(node)\">\n\t\t\t\t\t\t\t\t<i class=\"pi\" [class.pi-chevron-right]=\"!node.expanded\" [class.pi-chevron-down]=\"node.expanded\"></i>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t@if (node.icon) {\n\t\t\t\t\t\t\t<i class=\"node-icon\" [class]=\"node.icon\"></i>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<span class=\"node-label\">{{ node.label | translateJson }}</span>\n\n\t\t\t\t\t\t@if (node.routerLink) {\n\t\t\t\t\t\t\t<i class=\"external-icon pi pi-external-link\"></i>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Recursive Children -->\n\t\t\t\t@if (node.children && node.expanded) {\n\t\t\t\t\t@for (child of node.children; track trackByKey($index, child)) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: child, level: level + 1 }\"></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t</ng-template>\n\t</div>\n</p-sidebar>\n", styles: [":host ::ng-deep .layout-sitemap-sidebar .p-sidebar-content{padding:0;background:var(--surface-ground)}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header{background:var(--primary-color);color:var(--primary-color-text);padding:1rem .5rem}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header span{font-size:1.1rem;font-weight:600}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header .total-pages{background:#fff3;color:#ffffffe6;padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.sitemap-content{display:flex;flex-direction:column;height:100%;background:var(--surface-ground)}.search-section{padding:1rem;border-bottom:1px solid var(--surface-border);background:var(--surface-0)}.sitemap-tree{flex:1;overflow:hidden}.tree-container{padding:.5rem 0}.tree-node .node-item{display:flex;align-items:center;padding:.5rem 1rem;border-radius:6px;margin:.1rem .5rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.tree-node .node-item:hover{background:var(--surface-hover);border-color:var(--surface-border)}.tree-node .node-item.is-page:hover{background:var(--primary-50);border-color:var(--primary-200)}.tree-node .node-item.is-page:hover .external-icon{opacity:1}.tree-node .node-item.has-children{font-weight:500}.tree-node .node-content{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.tree-node .toggle-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:transparent;border:none;border-radius:4px;color:var(--text-color-secondary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.tree-node .toggle-btn:hover{background:var(--surface-hover);color:var(--primary-color)}.tree-node .toggle-btn i{font-size:.7rem}.tree-node .node-icon{color:var(--primary-color);font-size:.9rem;flex-shrink:0}.tree-node .node-label{flex:1;font-size:.9rem;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-node .external-icon{color:var(--text-color-secondary);font-size:.7rem;opacity:.6;transition:opacity .2s ease;flex-shrink:0}.empty-state{flex:1;display:flex;align-items:center;justify-content:center;padding:2rem}.empty-content{text-align:center;max-width:300px}.empty-icon{font-size:3rem;color:var(--text-color-secondary);margin-bottom:1rem;opacity:.5}.empty-message{font-size:.9rem;color:var(--text-color-secondary);line-height:1.4;margin-bottom:1.5rem}:host ::ng-deep .p-scrollpanel-bar-y{background:var(--primary-200);width:4px;border-radius:2px}:host ::ng-deep .p-scrollpanel-bar-y:hover{background:var(--primary-300)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: SidebarModule }, { kind: "component", type: i6$1.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ScrollPanelModule }, { kind: "component", type: i7$1.ScrollPanel, selector: "p-scrollPanel", inputs: ["style", "styleClass", "step"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i8.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: ButtonComponent, selector: "aril-button:not([click])", inputs: ["label", "loading", "disabled", "raised", "rounded", "text", "outlined", "badge", "size", "icon", "iconPos", "color"], outputs: ["clickEvent"] }, { kind: "component", type: TextComponent, selector: "aril-text[ngModel], aril-text[formControl], aril-text[formControlName]", inputs: ["placeholder", "tabindex", "icon", "iconPos", "size"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "directive", type: i5.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: TranslateJsonPipe, name: "translateJson" }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i10.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] }); }
|
|
1125
1125
|
}
|
|
1126
1126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SiteMapSidebarComponent, decorators: [{
|
|
1127
1127
|
type: Component,
|
|
@@ -1137,7 +1137,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImpor
|
|
|
1137
1137
|
TranslocoModule,
|
|
1138
1138
|
TranslateJsonPipe,
|
|
1139
1139
|
FontAwesomeModule
|
|
1140
|
-
], template: "<p-sidebar\
|
|
1140
|
+
], template: "<p-sidebar\n\t[(visible)]=\"visible\"\n\tposition=\"right\"\n\t[transitionOptions]=\"'.3s cubic-bezier(0, 0, 0.2, 1)'\"\n\tstyleClass=\"layout-sitemap-sidebar w-full sm:w-30rem\"\n\t*transloco=\"let t; read: 'siteMap'\">\n\t<ng-template pTemplate=\"header\">\n\t\t<div class=\"flex align-items-center justify-content-between gap-2 w-full\">\n\t\t\t<div class=\"flex align-items-center gap-2\">\n\t\t\t\t<i class=\"pi pi-sitemap text-primary text-xl\"></i>\n\t\t\t\t<span class=\"font-bold text-lg\">{{ t('siteMap') }}</span>\n\t\t\t\t<span class=\"total-pages\">{{ totalPages() }} {{ t('pages') }}</span>\n\t\t\t</div>\n\t\t</div>\n\t</ng-template>\n\n\t<div class=\"sitemap-content\">\n\t\t<div class=\"search-section grid p-fluid m-0\">\n\t\t\t<aril-text\n\t\t\t\t[placeholder]=\"t('searchPages')\"\n\t\t\t\t[(ngModel)]=\"searchTerm\"\n\t\t\t\t(ngModelChange)=\"onSearchChange()\"\n\t\t\t\tclass=\"col-10 m-0\">\n\t\t\t</aril-text>\n\t\t\t@if (filteredNodes().length > 0) {\n\t\t\t<div class=\"col-2 flex align-items-center m-0 p-0\">\n\t\t\t\t\t<fa-icon\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesDown\"\n\t\t\t\t\t\tsize=\"xl\"\n\t\t\t\t\t\tstyle=\"color: var(--primary-color)\"\n\t\t\t\t\t\tclass=\"col-1 cursor-pointer\"\n\t\t\t\t\t\t[pTooltip]=\"t('expandAll')\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t(click)=\"expandAll()\">\n\t\t\t\t\t</fa-icon>\n\t\t\t\t\t<fa-icon\n\t\t\t\t\t\t[icon]=\"solidIcons.faAnglesUp\"\n\t\t\t\t\t\tsize=\"xl\"\n\t\t\t\t\t\tstyle=\"color: var(--red-500)\"\n\t\t\t\t\t\tclass=\"col-1 ml-3 cursor-pointer\"\n\t\t\t\t\t\t[pTooltip]=\"t('collapseAll')\"\n\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t(click)=\"collapseAll()\">\n\t\t\t\t\t</fa-icon>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\n\t\t<!-- Site Map Tree -->\n\t\t@if (filteredNodes().length > 0) {\n\t\t\t<div class=\"sitemap-tree\">\n\t\t\t\t<p-scrollPanel [style]=\"{ width: '100%', height: '100%' }\">\n\t\t\t\t\t<div class=\"tree-container\">\n\t\t\t\t\t\t@for (node of filteredNodes(); track trackByKey($index, node)) {\n\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: node, level: 0 }\"></ng-container>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</p-scrollPanel>\n\t\t\t</div>\n\t\t} @else {\n\t\t\t<div class=\"empty-state\">\n\t\t\t\t<div class=\"empty-content\">\n\t\t\t\t\t<i class=\"pi pi-sitemap empty-icon\"></i>\n\t\t\t\t\t<h3 class=\"empty-title\">\n\t\t\t\t\t\t{{ searchTerm() ? t('noSearchResults') : t('noPages') }}\n\t\t\t\t\t</h3>\n\t\t\t\t\t<p class=\"empty-message\">\n\t\t\t\t\t\t{{ searchTerm() ? t('tryDifferentKeywords') : '' }}\n\t\t\t\t\t</p>\n\t\t\t\t\t@if (searchTerm()) {\n\t\t\t\t\t\t<aril-button\n\t\t\t\t\t\t\t[label]=\"t('clearSearch')\"\n\t\t\t\t\t\t\ticon=\"TIMES\"\n\t\t\t\t\t\t\tcolor=\"secondary\"\n\t\t\t\t\t\t\t[outlined]=\"true\"\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t(clickEvent)=\"searchTerm.set(''); onSearchChange()\">\n\t\t\t\t\t\t</aril-button>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\n\t\t<!-- Recursive Tree Node Template -->\n\t\t<ng-template #treeNodeTemplate let-node let-level=\"level\">\n\t\t\t<div class=\"tree-node\" [style.margin-left.px]=\"level * 20\">\n\t\t\t\t<div\n\t\t\t\t\tclass=\"node-item\"\n\t\t\t\t\t[class.has-children]=\"node.children && node.children.length > 0\"\n\t\t\t\t\t[class.is-page]=\"node.routerLink\"\n\t\t\t\t\t[routerLink]=\"node.routerLink\"\n\t\t\t\t\t(click)=\"!node.routerLink ? toggleNode(node) : (visible = false)\">\n\t\t\t\t\t<div class=\"node-content\">\n\t\t\t\t\t\t@if (node.children && node.children.length > 0) {\n\t\t\t\t\t\t\t<div class=\"toggle-btn\" (click)=\"$event.stopPropagation(); toggleNode(node)\">\n\t\t\t\t\t\t\t\t<i class=\"pi\" [class.pi-chevron-right]=\"!node.expanded\" [class.pi-chevron-down]=\"node.expanded\"></i>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t@if (node.icon) {\n\t\t\t\t\t\t\t<i class=\"node-icon\" [class]=\"node.icon\"></i>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<span class=\"node-label\">{{ node.label | translateJson }}</span>\n\n\t\t\t\t\t\t@if (node.routerLink) {\n\t\t\t\t\t\t\t<i class=\"external-icon pi pi-external-link\"></i>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- Recursive Children -->\n\t\t\t\t@if (node.children && node.expanded) {\n\t\t\t\t\t@for (child of node.children; track trackByKey($index, child)) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"treeNodeTemplate; context: { $implicit: child, level: level + 1 }\"></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t</ng-template>\n\t</div>\n</p-sidebar>\n", styles: [":host ::ng-deep .layout-sitemap-sidebar .p-sidebar-content{padding:0;background:var(--surface-ground)}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header{background:var(--primary-color);color:var(--primary-color-text);padding:1rem .5rem}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header span{font-size:1.1rem;font-weight:600}:host ::ng-deep .layout-sitemap-sidebar .p-sidebar-header .total-pages{background:#fff3;color:#ffffffe6;padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.sitemap-content{display:flex;flex-direction:column;height:100%;background:var(--surface-ground)}.search-section{padding:1rem;border-bottom:1px solid var(--surface-border);background:var(--surface-0)}.sitemap-tree{flex:1;overflow:hidden}.tree-container{padding:.5rem 0}.tree-node .node-item{display:flex;align-items:center;padding:.5rem 1rem;border-radius:6px;margin:.1rem .5rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent}.tree-node .node-item:hover{background:var(--surface-hover);border-color:var(--surface-border)}.tree-node .node-item.is-page:hover{background:var(--primary-50);border-color:var(--primary-200)}.tree-node .node-item.is-page:hover .external-icon{opacity:1}.tree-node .node-item.has-children{font-weight:500}.tree-node .node-content{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.tree-node .toggle-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:transparent;border:none;border-radius:4px;color:var(--text-color-secondary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.tree-node .toggle-btn:hover{background:var(--surface-hover);color:var(--primary-color)}.tree-node .toggle-btn i{font-size:.7rem}.tree-node .node-icon{color:var(--primary-color);font-size:.9rem;flex-shrink:0}.tree-node .node-label{flex:1;font-size:.9rem;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-node .external-icon{color:var(--text-color-secondary);font-size:.7rem;opacity:.6;transition:opacity .2s ease;flex-shrink:0}.empty-state{flex:1;display:flex;align-items:center;justify-content:center;padding:2rem}.empty-content{text-align:center;max-width:300px}.empty-icon{font-size:3rem;color:var(--text-color-secondary);margin-bottom:1rem;opacity:.5}.empty-message{font-size:.9rem;color:var(--text-color-secondary);line-height:1.4;margin-bottom:1.5rem}:host ::ng-deep .p-scrollpanel-bar-y{background:var(--primary-200);width:4px;border-radius:2px}:host ::ng-deep .p-scrollpanel-bar-y:hover{background:var(--primary-300)}\n"] }]
|
|
1141
1141
|
}], ctorParameters: () => [{ type: LayoutService }, { type: i5.TranslocoService }] });
|
|
1142
1142
|
|
|
1143
1143
|
// API Endpoints
|