@fuentis/phoenix-ui 0.0.9-alpha.176 → 0.0.9-alpha.178
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.
|
@@ -470,7 +470,7 @@ class SearchBarComponent {
|
|
|
470
470
|
this.reloadSubscription$.unsubscribe();
|
|
471
471
|
}
|
|
472
472
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: SearchBarComponent, deps: [{ token: i3$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
473
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: SearchBarComponent, isStandalone: true, selector: "pho-search-bar", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "nes", first: true, predicate: ["op"], descendants: true }, { propertyName: "elm", first: true, predicate: ["elm"], descendants: true, static: true }], ngImport: i0, template: "<div (click)=\"onParentClick($event)\" class=\"p-input-icon-left ml-1\" #elm>\n <p-iconfield>\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n [@openClose]=\"isOpen ? 'open' : 'closed'\"\n type=\"text\"\n pInputText\n placeholder=\"{{ 'SEARCH_PLACEHOLDERS.GLOBAL_SEARCH' | translate }}\"\n (input)=\"valueChanges.next($event)\"\n (focus)=\"onParentClick($event); expand()\"\n />\n </p-iconfield>\n</div>\n<p-popover\n [dismissable]=\"true\"\n [showTransitionOptions]=\"'.2s ease-out'\"\n [autoZIndex]=\"true\"\n #op\n [style]=\"{ width: '50vw', paddingLeft: '0' }\"\n
|
|
473
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.11", type: SearchBarComponent, isStandalone: true, selector: "pho-search-bar", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "nes", first: true, predicate: ["op"], descendants: true }, { propertyName: "elm", first: true, predicate: ["elm"], descendants: true, static: true }], ngImport: i0, template: "<div (click)=\"onParentClick($event)\" class=\"p-input-icon-left ml-1\" #elm>\n <p-iconfield>\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n [@openClose]=\"isOpen ? 'open' : 'closed'\"\n type=\"text\"\n pInputText\n placeholder=\"{{ 'SEARCH_PLACEHOLDERS.GLOBAL_SEARCH' | translate }}\"\n (input)=\"valueChanges.next($event)\"\n (focus)=\"onParentClick($event); expand()\"\n />\n </p-iconfield>\n</div>\n<p-popover\n [dismissable]=\"true\"\n [showTransitionOptions]=\"'.2s ease-out'\"\n [autoZIndex]=\"true\"\n #op\n [style]=\"{ width: '50vw', paddingLeft: '0' }\"\n styleClass=\"global-search\"\n (onHide)=\"isOpen = false\"\n>\n <div\n *ngIf=\"!inputText\"\n class=\"flex align-items-start gap-2 p-3 border-1 border-blue-300 surface-50 text-blue-700 border-round w-full\"\n >\n <i class=\"pi pi-info-circle mt-1 text-blue-500\"></i>\n <span class=\"text-sm\">{{ \"MESSAGES.START_TYPING\" | translate }}</span>\n </div>\n\n <ng-template pTemplate=\"content\">\n @if(inputText) {\n <p-tabs [value]=\"tabIndex\">\n <p-tablist>\n @for (tab of tabs(); track tab.id) {\n <p-tab [value]=\"tab.id\" (click)=\"onTabClick(tab.id)\">\n <span>{{ tab.header }}</span>\n </p-tab>\n }\n </p-tablist>\n <p-tabpanels>\n @for (tab of tabs(); track tab.id) {\n <p-tabpanel [value]=\"tab.id\">\n <pho-serach-card\n [tab]=\"tab.id\"\n [mocekedFilters]=\"mocekedFilters\"\n [searchData]=\"searchData\"\n [checkboxes]=\"checkboxes\"\n (onScrollEvent)=\"onScroll($event)\"\n (onSelectLinkEvent)=\"setLinkUrl($event?.url)\"\n (onSelectFilterEvent)=\"onClick($event)\"\n >\n </pho-serach-card>\n </p-tabpanel>\n }\n </p-tabpanels> </p-tabs\n >}\n </ng-template>\n</p-popover>\n", styles: [".p-popover:after,.p-popover:before{content:none!important}.p-popover-panel{width:100%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$2.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i4$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i6.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i6.TabPanel, selector: "p-tabpanel", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: i6.TabList, selector: "p-tablist" }, { kind: "component", type: i6.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: MessageModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "component", type: SearchCardComponent, selector: "pho-serach-card", inputs: ["searchData", "tab", "mocekedFilters", "checkboxes"], outputs: ["onScrollEvent", "onSelectLinkEvent", "onSelectFilterEvent"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i7$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i8.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }], animations: [
|
|
474
474
|
trigger('openClose', [
|
|
475
475
|
state('open', style({
|
|
476
476
|
width: '50vw',
|
|
@@ -508,7 +508,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
|
|
|
508
508
|
})),
|
|
509
509
|
transition('* <=> *', [animate('0.1s ease-in-out')]),
|
|
510
510
|
]),
|
|
511
|
-
], template: "<div (click)=\"onParentClick($event)\" class=\"p-input-icon-left ml-1\" #elm>\n <p-iconfield>\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n [@openClose]=\"isOpen ? 'open' : 'closed'\"\n type=\"text\"\n pInputText\n placeholder=\"{{ 'SEARCH_PLACEHOLDERS.GLOBAL_SEARCH' | translate }}\"\n (input)=\"valueChanges.next($event)\"\n (focus)=\"onParentClick($event); expand()\"\n />\n </p-iconfield>\n</div>\n<p-popover\n [dismissable]=\"true\"\n [showTransitionOptions]=\"'.2s ease-out'\"\n [autoZIndex]=\"true\"\n #op\n [style]=\"{ width: '50vw', paddingLeft: '0' }\"\n
|
|
511
|
+
], template: "<div (click)=\"onParentClick($event)\" class=\"p-input-icon-left ml-1\" #elm>\n <p-iconfield>\n <p-inputicon styleClass=\"pi pi-search\" />\n <input\n [@openClose]=\"isOpen ? 'open' : 'closed'\"\n type=\"text\"\n pInputText\n placeholder=\"{{ 'SEARCH_PLACEHOLDERS.GLOBAL_SEARCH' | translate }}\"\n (input)=\"valueChanges.next($event)\"\n (focus)=\"onParentClick($event); expand()\"\n />\n </p-iconfield>\n</div>\n<p-popover\n [dismissable]=\"true\"\n [showTransitionOptions]=\"'.2s ease-out'\"\n [autoZIndex]=\"true\"\n #op\n [style]=\"{ width: '50vw', paddingLeft: '0' }\"\n styleClass=\"global-search\"\n (onHide)=\"isOpen = false\"\n>\n <div\n *ngIf=\"!inputText\"\n class=\"flex align-items-start gap-2 p-3 border-1 border-blue-300 surface-50 text-blue-700 border-round w-full\"\n >\n <i class=\"pi pi-info-circle mt-1 text-blue-500\"></i>\n <span class=\"text-sm\">{{ \"MESSAGES.START_TYPING\" | translate }}</span>\n </div>\n\n <ng-template pTemplate=\"content\">\n @if(inputText) {\n <p-tabs [value]=\"tabIndex\">\n <p-tablist>\n @for (tab of tabs(); track tab.id) {\n <p-tab [value]=\"tab.id\" (click)=\"onTabClick(tab.id)\">\n <span>{{ tab.header }}</span>\n </p-tab>\n }\n </p-tablist>\n <p-tabpanels>\n @for (tab of tabs(); track tab.id) {\n <p-tabpanel [value]=\"tab.id\">\n <pho-serach-card\n [tab]=\"tab.id\"\n [mocekedFilters]=\"mocekedFilters\"\n [searchData]=\"searchData\"\n [checkboxes]=\"checkboxes\"\n (onScrollEvent)=\"onScroll($event)\"\n (onSelectLinkEvent)=\"setLinkUrl($event?.url)\"\n (onSelectFilterEvent)=\"onClick($event)\"\n >\n </pho-serach-card>\n </p-tabpanel>\n }\n </p-tabpanels> </p-tabs\n >}\n </ng-template>\n</p-popover>\n", styles: [".p-popover:after,.p-popover:before{content:none!important}.p-popover-panel{width:100%!important}\n"] }]
|
|
512
512
|
}], ctorParameters: () => [{ type: i3$1.TranslateService }], propDecorators: { nes: [{
|
|
513
513
|
type: ViewChild,
|
|
514
514
|
args: ['op']
|
|
@@ -721,7 +721,7 @@ class TopbarComponent {
|
|
|
721
721
|
: `url('assets/default-user.png')`;
|
|
722
722
|
}
|
|
723
723
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
724
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.11", type: TopbarComponent, isStandalone: true, selector: "pho-topbar", inputs: { homeUrl: { classPropertyName: "homeUrl", publicName: "homeUrl", isSignal: false, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: false, isRequired: false, transformFunction: null }, shortModuleName: { classPropertyName: "shortModuleName", publicName: "shortModuleName", isSignal: false, isRequired: false, transformFunction: null }, topbarModulesMenu: { classPropertyName: "topbarModulesMenu", publicName: "topbarModulesMenu", isSignal: false, isRequired: false, transformFunction: null }, darkModeSelector: { classPropertyName: "darkModeSelector", publicName: "darkModeSelector", isSignal: false, isRequired: false, transformFunction: null }, footerConfig: { classPropertyName: "footerConfig", publicName: "footerConfig", isSignal: false, isRequired: false, transformFunction: null }, searchConfig: { classPropertyName: "searchConfig", publicName: "searchConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDarkModeSelect: "onDarkModeSelect", onUserPopoverAction: "onUserPopoverAction" }, ngImport: i0, template: "<div\n class=\"h-full px-2 justify-content-between w-full flex align-items-center shadow-1 topbar\"\n>\n <!-- Title -->\n <div class=\"flex align-items-center justify-content-center mb-2 ml-2\">\n <img class=\"h-2rem\" src=\"assets/logo_rose.png\" alt=\"fuentis_logo_white\" />\n\n <span *ngIf=\"shortModuleName\" class=\"text-3xl text-300\">|</span>\n <span class=\"text-xl text-400 mt-2\">\n {{ shortModuleName }}\n </span>\n </div>\n <!-- children -->\n <ng-content></ng-content>\n\n <div class=\"flex align-items-center gap-2\">\n <!-- Search Bar -->\n <pho-search-bar [tabs]=\"searchConfig()\"></pho-search-bar>\n\n <!-- ToggleDarkmode -->\n <p-button\n (onClick)=\"onDarkModeSelectEmit()\"\n [icon]=\"darkModeSelector.mode === 'dark' ? 'pi pi-sun' : 'pi pi-moon'\"\n variant=\"outlined\"\n />\n\n <!-- Side Panel (Opens Sidebar) -->\n <p-button\n (onClick)=\"openSidebarPanel()\"\n icon=\"pi pi-th-large\"\n variant=\"outlined\"\n />\n\n <!-- User Icon -->\n <pho-user\n [user]=\"user\"\n (editSettings)=\"onUserPopoverAction.emit('EDIT')\"\n (logout)=\"onUserPopoverAction.emit('LOGOUT')\"\n />\n </div>\n</div>\n\n<!-- Sidebar Menu -->\n<p-drawer\n styleClass=\"w-20rem\"\n position=\"right\"\n [(visible)]=\"isSidebarVisible\"\n [closable]=\"false\"\n>\n <div class=\"flex flex-column h-full\">\n <!-- Loop through module groups (e.g., 'Management Modules', 'Support') -->\n <ng-container\n *ngFor=\"let moduleGroup of topbarModulesMenu; let last = last\"\n >\n <h4 class=\"mt-5 ml-3\">{{ moduleGroup.label | translate }}</h4>\n\n <div class=\"grid\">\n <!-- If layout is 'full', it takes up the entire row -->\n <ng-container *ngIf=\"moduleGroup.layout === 'full'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-12 p-3 hover:surface-100 cursor-pointer\"\n >\n <a\n class=\"text-primary flex align-items-center gap-3\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-3rem h-3rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <div>\n <h4 class=\"mb-0 mt-0\">{{ module.label | translate }}</h4>\n <p class=\"w-11rem text-500 text-sm line-height-1 m-0\">\n {{ module.fullName || \"\" | translate }}\n </p>\n </div>\n </a>\n </div>\n </ng-container>\n\n <!-- If layout is 'grid', modules are arranged in a 3-column grid -->\n <ng-container *ngIf=\"moduleGroup.layout === 'grid'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-4 p-3 hover:surface-100 cursor-pointer p-0 m-0\"\n >\n <a\n class=\"text-primary flex flex-column align-items-center gap-2\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-4rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <span class=\"text-sm text-center\">{{\n module.label | translate\n }}</span>\n </a>\n </div>\n </ng-container>\n </div>\n\n <!-- Divider between module groups (except after the last one) -->\n <p-divider *ngIf=\"!last\" class=\"mt-3 mb-3\"></p-divider>\n </ng-container>\n\n <!-- Footer links -->\n <div class=\"mt-auto p-2\">\n <p-divider class=\"mt-2 mb-2\"></p-divider>\n <div class=\"flex justify-content-between pb-3\">\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.guideUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle p-2\"></i>\n {{ footerConfig.guideLabel | translate }}\n </span>\n </a>\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.companyUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-globe p-2\"></i>\n {{ footerConfig.companyName | translate }}\n </span>\n </a>\n </div>\n\n <div class=\"text-500 text-sm pl-2\">\n {{ footerConfig.copyrightText | translate }}\n </div>\n </div>\n </div>\n</p-drawer>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchBarComponent, selector: "pho-search-bar", inputs: ["tabs"] }, { kind: "component", type: UserComponent, selector: "pho-user", inputs: ["user"], outputs: ["logout", "editSettings"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i3$4.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i4.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
724
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.11", type: TopbarComponent, isStandalone: true, selector: "pho-topbar", inputs: { homeUrl: { classPropertyName: "homeUrl", publicName: "homeUrl", isSignal: false, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: false, isRequired: false, transformFunction: null }, shortModuleName: { classPropertyName: "shortModuleName", publicName: "shortModuleName", isSignal: false, isRequired: false, transformFunction: null }, topbarModulesMenu: { classPropertyName: "topbarModulesMenu", publicName: "topbarModulesMenu", isSignal: false, isRequired: false, transformFunction: null }, darkModeSelector: { classPropertyName: "darkModeSelector", publicName: "darkModeSelector", isSignal: false, isRequired: false, transformFunction: null }, footerConfig: { classPropertyName: "footerConfig", publicName: "footerConfig", isSignal: false, isRequired: false, transformFunction: null }, searchConfig: { classPropertyName: "searchConfig", publicName: "searchConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDarkModeSelect: "onDarkModeSelect", onUserPopoverAction: "onUserPopoverAction" }, ngImport: i0, template: "<div\n class=\"h-full px-2 justify-content-between w-full flex align-items-center shadow-1 topbar\"\n>\n <!-- Title -->\n <div class=\"flex align-items-center justify-content-center mb-2 ml-2\">\n <img class=\"h-2rem\" src=\"assets/logo_rose.png\" alt=\"fuentis_logo_white\" />\n\n <span *ngIf=\"shortModuleName\" class=\"text-3xl text-300\">|</span>\n <span class=\"text-xl text-400 mt-2\">\n {{ shortModuleName }}\n </span>\n </div>\n <!-- children -->\n <ng-content></ng-content>\n\n <div class=\"flex align-items-center gap-2\">\n <!-- Search Bar -->\n <pho-search-bar [tabs]=\"searchConfig()\"></pho-search-bar>\n\n <!-- ToggleDarkmode -->\n <p-button\n (onClick)=\"onDarkModeSelectEmit()\"\n [icon]=\"darkModeSelector.mode === 'dark' ? 'pi pi-sun' : 'pi pi-moon'\"\n variant=\"outlined\"\n />\n\n <!-- Side Panel (Opens Sidebar) -->\n <p-button\n (onClick)=\"openSidebarPanel()\"\n icon=\"pi pi-th-large\"\n variant=\"outlined\"\n />\n\n <!-- User Icon -->\n <pho-user\n [user]=\"user\"\n (editSettings)=\"onUserPopoverAction.emit('EDIT')\"\n (logout)=\"onUserPopoverAction.emit('LOGOUT')\"\n />\n </div>\n</div>\n\n<!-- Sidebar Menu -->\n<p-drawer\n styleClass=\"w-20rem\"\n position=\"right\"\n [(visible)]=\"isSidebarVisible\"\n [closable]=\"false\"\n>\n <div class=\"flex flex-column h-full\">\n <!-- Loop through module groups (e.g., 'Management Modules', 'Support') -->\n <ng-container\n *ngFor=\"let moduleGroup of topbarModulesMenu; let last = last\"\n >\n <h4 class=\"mt-5 ml-3\">{{ moduleGroup.label | translate }}</h4>\n\n <div class=\"grid\">\n <!-- If layout is 'full', it takes up the entire row -->\n <ng-container *ngIf=\"moduleGroup.layout === 'full'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-12 p-3 hover:surface-100 cursor-pointer\"\n [ngClass]=\"{ 'opacity-40 pointer-events-none': module?.disabled }\"\n >\n <a\n class=\"text-primary flex align-items-center gap-3\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-3rem h-3rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <div>\n <h4 class=\"mb-0 mt-0\">{{ module.label | translate }}</h4>\n <p class=\"w-11rem text-500 text-sm line-height-1 m-0\">\n {{ module.fullName || \"\" | translate }}\n </p>\n </div>\n </a>\n </div>\n </ng-container>\n\n <!-- If layout is 'grid', modules are arranged in a 3-column grid -->\n <ng-container *ngIf=\"moduleGroup.layout === 'grid'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-4 p-3 hover:surface-100 cursor-pointer p-0 m-0\"\n [ngClass]=\"{ 'opacity-30 pointer-events-none': module?.disabled }\"\n >\n <a\n class=\"text-primary flex flex-column align-items-center gap-2\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-4rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <span class=\"text-sm text-center\">{{\n module.label | translate\n }}</span>\n </a>\n </div>\n </ng-container>\n </div>\n\n <!-- Divider between module groups (except after the last one) -->\n <p-divider *ngIf=\"!last\" class=\"mt-3 mb-3\"></p-divider>\n </ng-container>\n\n <!-- Footer links -->\n <div class=\"mt-auto p-2\">\n <p-divider class=\"mt-2 mb-2\"></p-divider>\n <div class=\"flex justify-content-between pb-3\">\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.guideUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle p-2\"></i>\n {{ footerConfig.guideLabel | translate }}\n </span>\n </a>\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.companyUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-globe p-2\"></i>\n {{ footerConfig.companyName | translate }}\n </span>\n </a>\n </div>\n\n <div class=\"text-500 text-sm pl-2\">\n {{ footerConfig.copyrightText | translate }}\n </div>\n </div>\n </div>\n</p-drawer>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchBarComponent, selector: "pho-search-bar", inputs: ["tabs"] }, { kind: "component", type: UserComponent, selector: "pho-user", inputs: ["user"], outputs: ["logout", "editSettings"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i3$4.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i4.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
725
725
|
}
|
|
726
726
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
727
727
|
type: Component,
|
|
@@ -734,7 +734,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
|
|
|
734
734
|
DrawerModule,
|
|
735
735
|
DividerModule,
|
|
736
736
|
ButtonModule,
|
|
737
|
-
], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"h-full px-2 justify-content-between w-full flex align-items-center shadow-1 topbar\"\n>\n <!-- Title -->\n <div class=\"flex align-items-center justify-content-center mb-2 ml-2\">\n <img class=\"h-2rem\" src=\"assets/logo_rose.png\" alt=\"fuentis_logo_white\" />\n\n <span *ngIf=\"shortModuleName\" class=\"text-3xl text-300\">|</span>\n <span class=\"text-xl text-400 mt-2\">\n {{ shortModuleName }}\n </span>\n </div>\n <!-- children -->\n <ng-content></ng-content>\n\n <div class=\"flex align-items-center gap-2\">\n <!-- Search Bar -->\n <pho-search-bar [tabs]=\"searchConfig()\"></pho-search-bar>\n\n <!-- ToggleDarkmode -->\n <p-button\n (onClick)=\"onDarkModeSelectEmit()\"\n [icon]=\"darkModeSelector.mode === 'dark' ? 'pi pi-sun' : 'pi pi-moon'\"\n variant=\"outlined\"\n />\n\n <!-- Side Panel (Opens Sidebar) -->\n <p-button\n (onClick)=\"openSidebarPanel()\"\n icon=\"pi pi-th-large\"\n variant=\"outlined\"\n />\n\n <!-- User Icon -->\n <pho-user\n [user]=\"user\"\n (editSettings)=\"onUserPopoverAction.emit('EDIT')\"\n (logout)=\"onUserPopoverAction.emit('LOGOUT')\"\n />\n </div>\n</div>\n\n<!-- Sidebar Menu -->\n<p-drawer\n styleClass=\"w-20rem\"\n position=\"right\"\n [(visible)]=\"isSidebarVisible\"\n [closable]=\"false\"\n>\n <div class=\"flex flex-column h-full\">\n <!-- Loop through module groups (e.g., 'Management Modules', 'Support') -->\n <ng-container\n *ngFor=\"let moduleGroup of topbarModulesMenu; let last = last\"\n >\n <h4 class=\"mt-5 ml-3\">{{ moduleGroup.label | translate }}</h4>\n\n <div class=\"grid\">\n <!-- If layout is 'full', it takes up the entire row -->\n <ng-container *ngIf=\"moduleGroup.layout === 'full'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-12 p-3 hover:surface-100 cursor-pointer\"\n >\n <a\n class=\"text-primary flex align-items-center gap-3\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-3rem h-3rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <div>\n <h4 class=\"mb-0 mt-0\">{{ module.label | translate }}</h4>\n <p class=\"w-11rem text-500 text-sm line-height-1 m-0\">\n {{ module.fullName || \"\" | translate }}\n </p>\n </div>\n </a>\n </div>\n </ng-container>\n\n <!-- If layout is 'grid', modules are arranged in a 3-column grid -->\n <ng-container *ngIf=\"moduleGroup.layout === 'grid'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-4 p-3 hover:surface-100 cursor-pointer p-0 m-0\"\n >\n <a\n class=\"text-primary flex flex-column align-items-center gap-2\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-4rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <span class=\"text-sm text-center\">{{\n module.label | translate\n }}</span>\n </a>\n </div>\n </ng-container>\n </div>\n\n <!-- Divider between module groups (except after the last one) -->\n <p-divider *ngIf=\"!last\" class=\"mt-3 mb-3\"></p-divider>\n </ng-container>\n\n <!-- Footer links -->\n <div class=\"mt-auto p-2\">\n <p-divider class=\"mt-2 mb-2\"></p-divider>\n <div class=\"flex justify-content-between pb-3\">\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.guideUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle p-2\"></i>\n {{ footerConfig.guideLabel | translate }}\n </span>\n </a>\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.companyUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-globe p-2\"></i>\n {{ footerConfig.companyName | translate }}\n </span>\n </a>\n </div>\n\n <div class=\"text-500 text-sm pl-2\">\n {{ footerConfig.copyrightText | translate }}\n </div>\n </div>\n </div>\n</p-drawer>\n" }]
|
|
737
|
+
], encapsulation: ViewEncapsulation.None, template: "<div\n class=\"h-full px-2 justify-content-between w-full flex align-items-center shadow-1 topbar\"\n>\n <!-- Title -->\n <div class=\"flex align-items-center justify-content-center mb-2 ml-2\">\n <img class=\"h-2rem\" src=\"assets/logo_rose.png\" alt=\"fuentis_logo_white\" />\n\n <span *ngIf=\"shortModuleName\" class=\"text-3xl text-300\">|</span>\n <span class=\"text-xl text-400 mt-2\">\n {{ shortModuleName }}\n </span>\n </div>\n <!-- children -->\n <ng-content></ng-content>\n\n <div class=\"flex align-items-center gap-2\">\n <!-- Search Bar -->\n <pho-search-bar [tabs]=\"searchConfig()\"></pho-search-bar>\n\n <!-- ToggleDarkmode -->\n <p-button\n (onClick)=\"onDarkModeSelectEmit()\"\n [icon]=\"darkModeSelector.mode === 'dark' ? 'pi pi-sun' : 'pi pi-moon'\"\n variant=\"outlined\"\n />\n\n <!-- Side Panel (Opens Sidebar) -->\n <p-button\n (onClick)=\"openSidebarPanel()\"\n icon=\"pi pi-th-large\"\n variant=\"outlined\"\n />\n\n <!-- User Icon -->\n <pho-user\n [user]=\"user\"\n (editSettings)=\"onUserPopoverAction.emit('EDIT')\"\n (logout)=\"onUserPopoverAction.emit('LOGOUT')\"\n />\n </div>\n</div>\n\n<!-- Sidebar Menu -->\n<p-drawer\n styleClass=\"w-20rem\"\n position=\"right\"\n [(visible)]=\"isSidebarVisible\"\n [closable]=\"false\"\n>\n <div class=\"flex flex-column h-full\">\n <!-- Loop through module groups (e.g., 'Management Modules', 'Support') -->\n <ng-container\n *ngFor=\"let moduleGroup of topbarModulesMenu; let last = last\"\n >\n <h4 class=\"mt-5 ml-3\">{{ moduleGroup.label | translate }}</h4>\n\n <div class=\"grid\">\n <!-- If layout is 'full', it takes up the entire row -->\n <ng-container *ngIf=\"moduleGroup.layout === 'full'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-12 p-3 hover:surface-100 cursor-pointer\"\n [ngClass]=\"{ 'opacity-40 pointer-events-none': module?.disabled }\"\n >\n <a\n class=\"text-primary flex align-items-center gap-3\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-3rem h-3rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <div>\n <h4 class=\"mb-0 mt-0\">{{ module.label | translate }}</h4>\n <p class=\"w-11rem text-500 text-sm line-height-1 m-0\">\n {{ module.fullName || \"\" | translate }}\n </p>\n </div>\n </a>\n </div>\n </ng-container>\n\n <!-- If layout is 'grid', modules are arranged in a 3-column grid -->\n <ng-container *ngIf=\"moduleGroup.layout === 'grid'\">\n <div\n *ngFor=\"let module of moduleGroup.items\"\n class=\"col-4 p-3 hover:surface-100 cursor-pointer p-0 m-0\"\n [ngClass]=\"{ 'opacity-30 pointer-events-none': module?.disabled }\"\n >\n <a\n class=\"text-primary flex flex-column align-items-center gap-2\"\n [href]=\"module.url || '#'\"\n style=\"text-decoration: none; cursor: pointer\"\n >\n <div\n class=\"w-4rem border-round-sm flex justify-content-center align-items-center\"\n [style.backgroundColor]=\"\n moduleGroup.showIconBackground\n ? module.disabled\n ? '#ccc'\n : '#e74360'\n : 'transparent'\n \"\n >\n <img *ngIf=\"module.icon\" [src]=\"module.icon\" class=\"w-2rem\" />\n </div>\n <span class=\"text-sm text-center\">{{\n module.label | translate\n }}</span>\n </a>\n </div>\n </ng-container>\n </div>\n\n <!-- Divider between module groups (except after the last one) -->\n <p-divider *ngIf=\"!last\" class=\"mt-3 mb-3\"></p-divider>\n </ng-container>\n\n <!-- Footer links -->\n <div class=\"mt-auto p-2\">\n <p-divider class=\"mt-2 mb-2\"></p-divider>\n <div class=\"flex justify-content-between pb-3\">\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.guideUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle p-2\"></i>\n {{ footerConfig.guideLabel | translate }}\n </span>\n </a>\n <a\n class=\"text-primary no-underline text-sm\"\n [href]=\"footerConfig.companyUrl\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n <span class=\"flex align-items-center\">\n <i class=\"pi pi-globe p-2\"></i>\n {{ footerConfig.companyName | translate }}\n </span>\n </a>\n </div>\n\n <div class=\"text-500 text-sm pl-2\">\n {{ footerConfig.copyrightText | translate }}\n </div>\n </div>\n </div>\n</p-drawer>\n" }]
|
|
738
738
|
}], propDecorators: { homeUrl: [{
|
|
739
739
|
type: Input
|
|
740
740
|
}], user: [{
|