@paulo-studio/theme-shared

Shared Paulo theme tokens, layout shell, and navigation primitives for Angular applications.

Install

npm install @paulo-studio/theme-shared

Peer dependencies

Peer dependencies are declared in package.json. Install matching Angular 19, PrimeNG 19, and any listed @paulo-studio/* peer packages in the consuming app.

Existing notes

Shared UI primitives for the Paulo Portal stack. Mirrors @abp/ng.theme-shared but built on top of PrimeNG (Paulo preset).

What it provides

• PauloPreset — PrimeNG definePreset used as the project-wide design tokens source.
• ToasterService + <pl-toast-container> — toast notifications backed by PrimeNG <p-toast>.
• ConfirmationService + <pl-confirmation-dialog> — confirm prompts backed by PrimeNG <p-confirmDialog>.
• <pl-loader-bar> — global progress bar bound to HttpWaitService + RouterWaitService from @paulo-studio/core.
• Error handler infra — bridges HttpErrorReporterService from @paulo-studio/core into toaster + status-coded handlers.
• <pl-language-selector> + <pl-current-user> — topbar primitives.

Layout components + dynamic layout + shell slots

Theme-shared sở hữu toàn bộ layout shell (mirror @abp/ng.theme.basic):

• 6 layout component ở src/lib/layout/: PlShellComponent (application), AccountLayoutComponent (account), EmptyLayoutComponent (empty) + PlSidebarComponent / PlTopbarComponent / PlFooterComponent.
• Dynamic layout map — providePauloThemeShared() đăng ký DEFAULT_LAYOUTS vào DYNAMIC_LAYOUTS_TOKEN; DynamicLayoutComponent (@paulo-studio/core) resolve route.data.layout qua map này. Host đổi shell qua feature withLayouts({...}) — không fork.
• Shell slots — overlay widget (Permission/Feature Management, cookie-consent) render qua *plReplaceableTemplate theo key ePauloShellSlots; package register component qua ReplaceableComponentsService.add(...). Giữ chiều phụ thuộc theme-shared ← package (không circular-dep).

Cách dùng + cách sửa UI layout / thêm nav / register widget mới: docs/architecture/modular-nav-and-layout.md.

Wire-up

import { providePauloThemeShared, PauloPreset } from '@paulo-studio/theme-shared';

bootstrapApplication(AppComponent, {
  providers: [
    providePauloCore({ /* ... */ }),
    providePauloHttp(),
    providePauloThemeShared(),
    providePrimeNG({ theme: { preset: PauloPreset } }),
  ],
});

Build

cd packages/pl-theme-shared
../../portal-fe/node_modules/.bin/ng build pl-theme-shared

License

Licensed under AGPL-3.0-only. Commercial licensing is available separately.