@pecb-ui/components 1.1.11 → 1.1.13

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/index.d.ts CHANGED
@@ -311,8 +311,27 @@ interface PecbTableColumn {
311
311
  width?: string;
312
312
  /** Caps the cell width so long text truncates with an ellipsis (e.g. '240px'). */
313
313
  maxWidth?: string;
314
+ /** Floor for the column width so it is never squeezed to nothing (e.g. '120px'). */
315
+ minWidth?: string;
314
316
  /** Wrap long text onto multiple lines instead of truncating. Overrides the table-level `wrapText`. */
315
317
  wrap?: boolean;
318
+ /**
319
+ * Caps wrapped text at N lines and ellipsises the rest. Implies `wrap`.
320
+ * Overrides the table-level `maxLines`.
321
+ */
322
+ maxLines?: number;
323
+ /**
324
+ * Hard character cap. Longer values are cut at the last word boundary and
325
+ * suffixed with an ellipsis; the full value stays available on hover.
326
+ * Use it when the column width must not depend on font metrics.
327
+ */
328
+ maxChars?: number;
329
+ /**
330
+ * Hover-hint behaviour for this column: `'auto'` (default) reveals the full
331
+ * value only when it is actually clipped, `'always'` always reveals it,
332
+ * `'never'` disables the hint.
333
+ */
334
+ hint?: 'auto' | 'always' | 'never';
316
335
  align?: 'left' | 'center' | 'right';
317
336
  sortable?: boolean;
318
337
  cellTemplate?: TemplateRef<any>;
@@ -444,6 +463,28 @@ declare class TableComponent {
444
463
  * value is shown on hover via the cell's title. Per-column `wrap` overrides this.
445
464
  */
446
465
  wrapText: _angular_core.InputSignal<boolean>;
466
+ /**
467
+ * Default width cap for plain text / link / user columns that declare no
468
+ * `width` or `maxWidth`. This is what keeps a single long column (a URL, a
469
+ * description, an unbroken token) from stretching the whole table and forcing
470
+ * a horizontal scrollbar - the cell truncates or wraps instead.
471
+ *
472
+ * Pass `'none'` to opt out and restore raw browser sizing.
473
+ * @default '320px'
474
+ */
475
+ cellMaxWidth: _angular_core.InputSignal<string>;
476
+ /**
477
+ * When cells wrap, cap them at this many lines and ellipsise the rest.
478
+ * `undefined` (default) leaves wrapped text unbounded.
479
+ * Per-column `maxLines` overrides this.
480
+ */
481
+ maxLines: _angular_core.InputSignal<number | undefined>;
482
+ /**
483
+ * Truncate long header labels to one line with an ellipsis and show the full
484
+ * label on hover, so a verbose header never widens its column.
485
+ * @default true
486
+ */
487
+ truncateHeaders: _angular_core.InputSignal<boolean>;
447
488
  /**
448
489
  * Column key currently being sorted
449
490
  */
@@ -492,10 +533,56 @@ declare class TableComponent {
492
533
  get tableClasses(): string;
493
534
  getCellValue(row: any, key: string): any;
494
535
  getAlignmentClass(column: PecbTableColumn): string;
536
+ /**
537
+ * Columns whose content is plain text the table itself renders, and which are
538
+ * therefore safe to cap and ellipsise automatically. Custom templates, dynamic
539
+ * components, status pills and action buttons are left to size themselves.
540
+ */
541
+ private isTextualColumn;
495
542
  /** Whether a column's cells wrap long text (per-column overrides the table default). */
496
543
  isCellWrapped(column: PecbTableColumn): boolean;
497
- /** Full text shown on hover for truncated text/link cells (so nothing is lost). */
544
+ /** Line cap for wrapped cells, or `null` when wrapped text is unbounded. */
545
+ getCellLineClamp(column: PecbTableColumn): number | null;
546
+ /** `ngStyle` map that applies the line cap (a no-op when there is none). */
547
+ getCellTextStyle(column: PecbTableColumn): Record<string, string> | null;
548
+ /**
549
+ * Width cap for a cell. Explicit `maxWidth`/`width` win; otherwise textual
550
+ * columns fall back to the table-wide `cellMaxWidth` so no single column can
551
+ * stretch the table.
552
+ */
553
+ getCellMaxWidth(column: PecbTableColumn): string | null;
554
+ /** Lower bound for a column's width, so narrow viewports do not crush it. */
555
+ getCellMinWidth(column: PecbTableColumn): string | null;
556
+ /** The raw, untruncated value of a cell as a string. */
557
+ private getCellText;
558
+ /**
559
+ * The text actually rendered in a cell: the raw value, shortened to
560
+ * `column.maxChars` at the last word boundary when one is configured.
561
+ */
562
+ getDisplayValue(row: any, column: PecbTableColumn): string;
563
+ /** Cuts `text` to `max` characters on a word boundary and appends an ellipsis. */
564
+ private clampChars;
565
+ /**
566
+ * Full text shown on hover for a cell, or `null` when the column opts out.
567
+ * Whether it is actually applied is decided per-cell in {@link onCellEnter}.
568
+ */
498
569
  getCellTitle(row: any, column: PecbTableColumn): string | null;
570
+ /**
571
+ * Attaches the hover hint lazily, on the way in, so it only appears when the
572
+ * value is genuinely clipped - by width, by line cap, or by `maxChars`.
573
+ * A `title` on every cell would otherwise fire on harmless short values.
574
+ */
575
+ onCellEnter(event: Event, row: any, column: PecbTableColumn): void;
576
+ /** Same lazy hint for header labels, which truncate on their own width. */
577
+ onHeaderEnter(event: Event, column: PecbTableColumn): void;
578
+ /** True when an element's content overflows its box horizontally or vertically. */
579
+ private isElementClipped;
580
+ /**
581
+ * A `-webkit-line-clamp` box reports `scrollHeight === clientHeight`, so the
582
+ * plain overflow check above can never see a clamped cell as clipped. Lift the
583
+ * clamp for one synchronous measurement and put it straight back.
584
+ */
585
+ private isLineClampOverflowing;
499
586
  onRowClick(row: any, index: number): void;
500
587
  onRowAction(action: string, row: any, index: number, event: Event): void;
501
588
  onHeaderClick(column: PecbTableColumn): void;
@@ -529,7 +616,7 @@ declare class TableComponent {
529
616
  getLinkHref(value: string): string;
530
617
  private emitSelectionChange;
531
618
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableComponent, never>;
532
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent, "pecb-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "hoverable": { "alias": "hoverable"; "required": false; "isSignal": true; }; "showPagination": { "alias": "showPagination"; "required": false; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": false; "isSignal": true; }; "currentPage": { "alias": "currentPage"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "showPageSizeSelector": { "alias": "showPageSizeSelector"; "required": false; "isSignal": true; }; "paginationVariant": { "alias": "paginationVariant"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "selectedIndices": { "alias": "selectedIndices"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "wrapText": { "alias": "wrapText"; "required": false; "isSignal": true; }; "sortColumn": { "alias": "sortColumn"; "required": false; "isSignal": true; }; "sortDirection": { "alias": "sortDirection"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "selectAllAriaLabel": { "alias": "selectAllAriaLabel"; "required": false; "isSignal": true; }; "selectRowAriaLabel": { "alias": "selectRowAriaLabel"; "required": false; "isSignal": true; }; }, { "currentPage": "currentPageChange"; "pageSize": "pageSizeChange"; "selectedIndices": "selectedIndicesChange"; "sortColumn": "sortColumnChange"; "sortDirection": "sortDirectionChange"; "pageChange": "pageChange"; "rowClick": "rowClick"; "rowAction": "rowAction"; "sortChange": "sortChange"; "selectionChange": "selectionChange"; }, ["emptyTemplate", "loadingTemplate"], never, true, never>;
619
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent, "pecb-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "hoverable": { "alias": "hoverable"; "required": false; "isSignal": true; }; "showPagination": { "alias": "showPagination"; "required": false; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": false; "isSignal": true; }; "currentPage": { "alias": "currentPage"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "showPageSizeSelector": { "alias": "showPageSizeSelector"; "required": false; "isSignal": true; }; "paginationVariant": { "alias": "paginationVariant"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "selectedIndices": { "alias": "selectedIndices"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "wrapText": { "alias": "wrapText"; "required": false; "isSignal": true; }; "cellMaxWidth": { "alias": "cellMaxWidth"; "required": false; "isSignal": true; }; "maxLines": { "alias": "maxLines"; "required": false; "isSignal": true; }; "truncateHeaders": { "alias": "truncateHeaders"; "required": false; "isSignal": true; }; "sortColumn": { "alias": "sortColumn"; "required": false; "isSignal": true; }; "sortDirection": { "alias": "sortDirection"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "selectAllAriaLabel": { "alias": "selectAllAriaLabel"; "required": false; "isSignal": true; }; "selectRowAriaLabel": { "alias": "selectRowAriaLabel"; "required": false; "isSignal": true; }; }, { "currentPage": "currentPageChange"; "pageSize": "pageSizeChange"; "selectedIndices": "selectedIndicesChange"; "sortColumn": "sortColumnChange"; "sortDirection": "sortDirectionChange"; "pageChange": "pageChange"; "rowClick": "rowClick"; "rowAction": "rowAction"; "sortChange": "sortChange"; "selectionChange": "selectionChange"; }, ["emptyTemplate", "loadingTemplate"], never, true, never>;
533
620
  }
534
621
 
535
622
  type TabStyle = 'rounded' | 'line';
@@ -975,6 +1062,7 @@ declare class DropdownComponent implements ControlValueAccessor {
975
1062
  private readonly overlay;
976
1063
  readonly scrollStrategy: ScrollStrategy;
977
1064
  searchInput?: ElementRef<HTMLInputElement>;
1065
+ triggerEl?: ElementRef<HTMLElement>;
978
1066
  id: _angular_core.InputSignal<string>;
979
1067
  label: _angular_core.InputSignal<string | undefined>;
980
1068
  /** Placeholder shown in the trigger when no option is selected. */
@@ -1000,6 +1088,13 @@ declare class DropdownComponent implements ControlValueAccessor {
1000
1088
  searchQuery: _angular_core.WritableSignal<string>;
1001
1089
  selectedValues: _angular_core.WritableSignal<unknown[]>;
1002
1090
  focusedIndex: _angular_core.WritableSignal<number>;
1091
+ /**
1092
+ * Width the overlay panel is pinned to, so it lines up edge-to-edge with the
1093
+ * trigger. Measured with `getBoundingClientRect()` rather than `offsetWidth`
1094
+ * because the latter rounds to whole pixels and leaves the panel a hair off in
1095
+ * fluid layouts.
1096
+ */
1097
+ triggerWidth: _angular_core.WritableSignal<number>;
1003
1098
  /** Overlay positions: prefer below the trigger, flip above when there's no room. */
1004
1099
  overlayPositions: ConnectedPosition[];
1005
1100
  private onChange;
@@ -1009,6 +1104,9 @@ declare class DropdownComponent implements ControlValueAccessor {
1009
1104
  get filteredOptions(): DropdownOption[];
1010
1105
  get displayText(): string;
1011
1106
  clearAll(event: MouseEvent): void;
1107
+ /** Re-measure the trigger so a resize doesn't leave an open panel misaligned. */
1108
+ syncTriggerWidth(): void;
1109
+ private measureTrigger;
1012
1110
  toggleDropdown(): void;
1013
1111
  selectOption(option: DropdownOption): void;
1014
1112
  isSelected(option: DropdownOption): boolean;
@@ -1113,6 +1211,878 @@ declare class SidebarComponent {
1113
1211
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SidebarComponent, "pecb-sidebar", never, { "sections": { "alias": "sections"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "logoSrc": { "alias": "logoSrc"; "required": false; "isSignal": true; }; "sidebarLogo": { "alias": "sidebarLogo"; "required": false; "isSignal": true; }; "collapsedLogo": { "alias": "collapsedLogo"; "required": false; "isSignal": true; }; "showFooter": { "alias": "showFooter"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "expandSidebarAriaLabel": { "alias": "expandSidebarAriaLabel"; "required": false; "isSignal": true; }; "collapseSidebarAriaLabel": { "alias": "collapseSidebarAriaLabel"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; "itemClick": "itemClick"; "collapseChange": "collapseChange"; }, never, ["[sidebar-header]", "[sidebar-footer]"], true, never>;
1114
1212
  }
1115
1213
 
1214
+ /**
1215
+ * Public data contracts for {@link AppSidebarComponent}.
1216
+ *
1217
+ * Everything the sidebar renders is plain, serialisable data — no template
1218
+ * plumbing required at the call site. Icons are accepted either as inline SVG
1219
+ * markup (`icon`) or as an image URL (`iconSrc`).
1220
+ *
1221
+ * @module components/app-sidebar
1222
+ */
1223
+ /**
1224
+ * Angular Router wiring, shared by every clickable entry.
1225
+ *
1226
+ * Setting {@link AppSidebarRouterLink.routerLink} makes the entry render as a
1227
+ * `routerLink` anchor and highlight itself through `routerLinkActive`, so the
1228
+ * sidebar follows real navigation — including back/forward and deep links.
1229
+ *
1230
+ * `@angular/router` is an **optional** peer dependency: the router directives
1231
+ * are only instantiated for entries that actually carry a `routerLink`, so
1232
+ * router-free applications are unaffected.
1233
+ */
1234
+ interface AppSidebarRouterLink {
1235
+ /** Router commands, e.g. `'/courses'` or `['/courses', id]`. */
1236
+ routerLink?: string | unknown[];
1237
+ /** Query parameters passed to the router. */
1238
+ queryParams?: Record<string, unknown>;
1239
+ /** URL fragment passed to the router. */
1240
+ fragment?: string;
1241
+ /** Match the full URL rather than a prefix when deciding the active state. */
1242
+ routerLinkActiveExact?: boolean;
1243
+ }
1244
+ /**
1245
+ * A single navigation entry.
1246
+ *
1247
+ * An item renders as a `routerLink` anchor when `routerLink` is set, a plain
1248
+ * `<a>` when only `href` is set, and a `<button>` otherwise — so keyboard and
1249
+ * screen-reader semantics stay correct either way.
1250
+ */
1251
+ interface AppSidebarNavItem extends AppSidebarRouterLink {
1252
+ /** Stable identity. Used for tracking, active state and expansion state. */
1253
+ id: string;
1254
+ /** Visible label. Also used as the collapsed-mode tooltip. */
1255
+ label: string;
1256
+ /** Inline SVG markup for the leading icon. */
1257
+ icon?: string;
1258
+ /** Image URL for the leading icon. Ignored when `icon` is set. */
1259
+ iconSrc?: string;
1260
+ /** Link target. When omitted, and with no `routerLink`, this is a button. */
1261
+ href?: string;
1262
+ /** Anchor target, e.g. `_blank`. Only applies when `href` is set. */
1263
+ target?: '_blank' | '_self' | '_parent' | '_top';
1264
+ /** Small trailing badge — a count or short word. */
1265
+ badge?: string | number;
1266
+ /** Renders the item non-interactive. */
1267
+ disabled?: boolean;
1268
+ /**
1269
+ * Sub-items, nestable up to three levels. They expand inline while the rail
1270
+ * is expanded, and inside the flyout while it is collapsed.
1271
+ */
1272
+ children?: AppSidebarNavItem[];
1273
+ /** Arbitrary payload echoed back on `navigate`. */
1274
+ data?: unknown;
1275
+ }
1276
+ /** A titled block of navigation items. */
1277
+ interface AppSidebarNavGroup {
1278
+ /** Stable identity. */
1279
+ id: string;
1280
+ /** Optional uppercase heading shown above the group (hidden when collapsed). */
1281
+ label?: string;
1282
+ /** The group's items. */
1283
+ items: AppSidebarNavItem[];
1284
+ }
1285
+ /**
1286
+ * An entry in the product switcher at the top of the sidebar.
1287
+ *
1288
+ * A product may own its navigation. When the active product declares `items`
1289
+ * or `groups`, the rail renders *those* and ignores the component-level
1290
+ * navigation entirely — switching product swaps the whole tab set, which is how
1291
+ * a multi-product shell like the Central Hub actually behaves. A hub product
1292
+ * that only needs a dashboard simply declares one item.
1293
+ */
1294
+ interface AppSidebarProduct extends AppSidebarRouterLink {
1295
+ /** Stable identity, matched against `activeProductId`. */
1296
+ id: string;
1297
+ /** Product name. */
1298
+ label: string;
1299
+ /**
1300
+ * Navigation shown while this product is active. Takes over the rail from
1301
+ * the component-level `items` / `groups`.
1302
+ */
1303
+ items?: AppSidebarNavItem[];
1304
+ /** Grouped navigation shown while this product is active. */
1305
+ groups?: AppSidebarNavGroup[];
1306
+ /** Secondary line shown under the name in the trigger. */
1307
+ description?: string;
1308
+ /** Inline SVG markup for the product tile. */
1309
+ icon?: string;
1310
+ /** Short text for the tile when no `icon` is given, e.g. `"St"`. */
1311
+ initials?: string;
1312
+ /** Link target for the menu entry. */
1313
+ href?: string;
1314
+ /** Anchor target, e.g. `_blank`. Only applies when `href` is set. */
1315
+ target?: '_blank' | '_self' | '_parent' | '_top';
1316
+ /** Groups the entry under an uppercase heading in the menu. */
1317
+ section?: string;
1318
+ /** Renders the entry non-interactive. */
1319
+ disabled?: boolean;
1320
+ /** Muted note under the label, e.g. `"Coming soon"`. */
1321
+ hint?: string;
1322
+ /** Gives the entry the dark "hub" tile and bolder label. */
1323
+ featured?: boolean;
1324
+ }
1325
+ /** The signed-in user rendered at the bottom of the sidebar. */
1326
+ interface AppSidebarUser {
1327
+ /** Display name. */
1328
+ name: string;
1329
+ /**
1330
+ * Secondary line, e.g. the active role. A menu submenu marked
1331
+ * {@link AppSidebarMenuItem.reflectsRole} overrides it live, so the block
1332
+ * always shows the role that is actually selected.
1333
+ */
1334
+ role?: string;
1335
+ /** Avatar image URL. */
1336
+ avatarSrc?: string;
1337
+ /** Fallback initials when no avatar image is available. */
1338
+ initials?: string;
1339
+ }
1340
+ /** A selectable choice inside a profile-menu submenu (language, role, …). */
1341
+ interface AppSidebarMenuOption {
1342
+ /** Stable identity. */
1343
+ id: string;
1344
+ /** Visible label. */
1345
+ label: string;
1346
+ /** Inline SVG markup shown before the label. */
1347
+ icon?: string;
1348
+ }
1349
+ /**
1350
+ * An entry in the profile dropdown.
1351
+ *
1352
+ * Supplying {@link AppSidebarMenuItem.options} turns the entry into a submenu
1353
+ * that flies out beside the dropdown and reports selections through
1354
+ * `menuOptionChange`.
1355
+ */
1356
+ interface AppSidebarMenuItem extends AppSidebarRouterLink {
1357
+ /** Stable identity. */
1358
+ id: string;
1359
+ /** Visible label. */
1360
+ label: string;
1361
+ /** Inline SVG markup for the leading icon. */
1362
+ icon?: string;
1363
+ /** Link target. When omitted the entry renders as a button. */
1364
+ href?: string;
1365
+ /** Anchor target, e.g. `_blank`. Only applies when `href` is set. */
1366
+ target?: '_blank' | '_self' | '_parent' | '_top';
1367
+ /** `danger` paints the entry in the destructive colour (e.g. Log out). */
1368
+ variant?: 'default' | 'danger';
1369
+ /** Draws a separator above the entry. */
1370
+ dividerBefore?: boolean;
1371
+ /** Renders the entry non-interactive. */
1372
+ disabled?: boolean;
1373
+ /** Turns the entry into a submenu of selectable choices. */
1374
+ options?: AppSidebarMenuOption[];
1375
+ /** Initially selected option id. Selection is tracked internally afterwards. */
1376
+ selectedOptionId?: string;
1377
+ /**
1378
+ * Mirrors this submenu's selected option as the account block's subtitle —
1379
+ * the "Member / Partner / Trainer" line under the user's name. Set it on the
1380
+ * role switcher so picking a role updates the profile block immediately,
1381
+ * with no round-trip through the host application.
1382
+ */
1383
+ reflectsRole?: boolean;
1384
+ }
1385
+ /** Payload emitted when a submenu choice is picked. */
1386
+ interface AppSidebarMenuOptionChange {
1387
+ /** The menu entry that owns the submenu. */
1388
+ item: AppSidebarMenuItem;
1389
+ /** The chosen option. */
1390
+ option: AppSidebarMenuOption;
1391
+ }
1392
+ /**
1393
+ * Every user-visible string that is not supplied through data.
1394
+ * Override any subset via the `labels` input to translate the component.
1395
+ */
1396
+ interface AppSidebarLabels {
1397
+ /** Aria-label of the rail toggle while the sidebar is expanded. */
1398
+ collapse: string;
1399
+ /** Aria-label of the rail toggle while the sidebar is collapsed. */
1400
+ expand: string;
1401
+ /** Aria-label of the drawer close button on small screens. */
1402
+ closeNavigation: string;
1403
+ /** Aria-label of the `<nav>` landmark. */
1404
+ navigation: string;
1405
+ /** Aria-label of the product switcher trigger. */
1406
+ switchProduct: string;
1407
+ /** Aria-label of the profile trigger. */
1408
+ accountMenu: string;
1409
+ /** Alt text for the logo image. */
1410
+ logo: string;
1411
+ }
1412
+ /** Default English strings used when `labels` is not overridden. */
1413
+ declare const DEFAULT_APP_SIDEBAR_LABELS: AppSidebarLabels;
1414
+
1415
+ /**
1416
+ * Locale identifiers shared by the application-shell components.
1417
+ *
1418
+ * The keys are deliberately the same ids the shell's own language picker uses
1419
+ * (`DEFAULT_APP_SIDEBAR_LANGUAGES`), so switching language is a direct lookup:
1420
+ *
1421
+ * ```ts
1422
+ * onLanguage(change: AppSidebarMenuOptionChange) {
1423
+ * this.locale.set(change.option.id as AppShellLocale);
1424
+ * }
1425
+ * ```
1426
+ *
1427
+ * @module types
1428
+ */
1429
+ /** A locale the shell ships translations for. */
1430
+ type AppShellLocale = 'en' | 'fr' | 'es' | 'de' | 'ja' | 'ko';
1431
+ /** Every shipped locale, in the order the language picker lists them. */
1432
+ declare const APP_SHELL_LOCALES: readonly AppShellLocale[];
1433
+ /**
1434
+ * A complete set of translations for one label bundle — every locale present,
1435
+ * every key filled. Anything narrower would let a locale fall back to English
1436
+ * silently, which is the failure mode translations exist to prevent.
1437
+ */
1438
+ type AppShellTranslations<T> = Record<AppShellLocale, T>;
1439
+ /**
1440
+ * Resolve a bundle for a locale, tolerating region tags and unknown input.
1441
+ *
1442
+ * `'fr-CA'` resolves to `fr`; anything unrecognised falls back to `'en'` rather
1443
+ * than rendering blank labels.
1444
+ */
1445
+ declare function resolveAppShellLocale(locale: string | null | undefined): AppShellLocale;
1446
+
1447
+ /**
1448
+ * Shipped translations for {@link AppSidebarComponent}.
1449
+ *
1450
+ * Nothing the rail renders is hard-coded English: the chrome strings come from
1451
+ * the `labels` input, and the ready-made account menu is built per locale.
1452
+ * These bundles cover the six languages the shell's own picker offers, so
1453
+ * switching language is a lookup rather than a translation project:
1454
+ *
1455
+ * ```ts
1456
+ * labels = computed(() => APP_SIDEBAR_TRANSLATIONS[this.locale()]);
1457
+ * menu = computed(() => appSidebarMenu(this.locale()));
1458
+ * ```
1459
+ *
1460
+ * Supplying your own strings stays supported — `labels` takes any partial
1461
+ * bundle and merges it over the defaults, so you can override a single word
1462
+ * without restating the rest.
1463
+ *
1464
+ * @module components/app-sidebar
1465
+ */
1466
+
1467
+ /** Chrome strings — the labels the rail renders itself, per locale. */
1468
+ declare const APP_SIDEBAR_TRANSLATIONS: AppShellTranslations<AppSidebarLabels>;
1469
+ /** The label of each entry in the ready-made account menu, per locale. */
1470
+ interface AppSidebarMenuStrings {
1471
+ profile: string;
1472
+ role: string;
1473
+ language: string;
1474
+ billing: string;
1475
+ support: string;
1476
+ logout: string;
1477
+ member: string;
1478
+ partner: string;
1479
+ trainer: string;
1480
+ }
1481
+ /** Account-menu strings per locale. */
1482
+ declare const APP_SIDEBAR_MENU_TRANSLATIONS: AppShellTranslations<AppSidebarMenuStrings>;
1483
+ /**
1484
+ * The rail's chrome strings for a locale. Accepts region tags (`'fr-CA'`) and
1485
+ * falls back to English for anything unrecognised.
1486
+ */
1487
+ declare function appSidebarLabels(locale: string | AppShellLocale): AppSidebarLabels;
1488
+
1489
+ /**
1490
+ * Ready-made data for {@link AppSidebarComponent}.
1491
+ *
1492
+ * The account dropdown is the same everywhere in the PECB estate, so it ships
1493
+ * ready to use rather than being retyped per application — and it is built per
1494
+ * locale, so none of its labels are hard-coded English:
1495
+ *
1496
+ * ```ts
1497
+ * menu = computed(() => appSidebarMenu(this.locale()));
1498
+ * ```
1499
+ *
1500
+ * `DEFAULT_APP_SIDEBAR_MENU` is simply the English build. Spread any entry to
1501
+ * adjust it:
1502
+ *
1503
+ * ```ts
1504
+ * menu = appSidebarMenu('fr').map(item =>
1505
+ * item.id === 'profile' ? { ...item, routerLink: '/me' } : item,
1506
+ * );
1507
+ * ```
1508
+ *
1509
+ * @module components/app-sidebar
1510
+ */
1511
+
1512
+ /**
1513
+ * The line icons used by {@link DEFAULT_APP_SIDEBAR_MENU}. Exported so the same
1514
+ * set can be reused for navigation items without redrawing them.
1515
+ */
1516
+ declare const APP_SIDEBAR_MENU_ICONS: {
1517
+ profile: string;
1518
+ billing: string;
1519
+ language: string;
1520
+ roles: string;
1521
+ support: string;
1522
+ logout: string;
1523
+ partner: string;
1524
+ trainer: string;
1525
+ };
1526
+ /**
1527
+ * The languages the account menu offers.
1528
+ *
1529
+ * Endonyms on purpose: a language picker names each language in that language,
1530
+ * so "Deutsch" reads the same whatever the current locale is. These ids are the
1531
+ * {@link AppShellLocale} keys, so a selection maps straight to a translation.
1532
+ */
1533
+ declare const DEFAULT_APP_SIDEBAR_LANGUAGES: AppSidebarMenuOption[];
1534
+ /** The roles the account menu offers, translated for `locale`. */
1535
+ declare function appSidebarRoles(locale?: string | AppShellLocale): AppSidebarMenuOption[];
1536
+ /**
1537
+ * The account dropdown, translated for `locale`, in the order the Central Hub
1538
+ * renders it: Profile, Switch Roles, Language, Billing & Payments, Customer
1539
+ * Service, and Log Out below a separator.
1540
+ *
1541
+ * Switch Roles is marked `reflectsRole`, so picking a role updates the line
1542
+ * under the user's name straight away — the profile block doubles as the role
1543
+ * select.
1544
+ *
1545
+ * Pass it straight to the `menu` input, or spread an entry to adjust it.
1546
+ */
1547
+ declare function appSidebarMenu(locale?: string | AppShellLocale): AppSidebarMenuItem[];
1548
+ /**
1549
+ * The English build of {@link appSidebarMenu}. Kept as a constant for the
1550
+ * common case; call the factory when the shell is localised.
1551
+ */
1552
+ declare const DEFAULT_APP_SIDEBAR_MENU: AppSidebarMenuItem[];
1553
+ /** The English build of {@link appSidebarRoles}. */
1554
+ declare const DEFAULT_APP_SIDEBAR_ROLES: AppSidebarMenuOption[];
1555
+
1556
+ /** Which floating layer is currently open. Only one may be open at a time. */
1557
+ type AppSidebarLayer = 'product' | 'account' | null;
1558
+ /**
1559
+ * Application shell sidebar — the collapsible navigation rail used by the
1560
+ * PECB Central Hub.
1561
+ *
1562
+ * It bundles the four pieces that always ship together: the product switcher,
1563
+ * the navigation tree, the collapse/expand rail, and the account dropdown with
1564
+ * its language / role submenus. Everything is driven by plain data, so a host
1565
+ * application only has to describe its navigation and listen for events.
1566
+ *
1567
+ * **Navigation belongs to the product.** Give each {@link AppSidebarProduct}
1568
+ * its own `items` (or `groups`) and switching product swaps the entire tab set:
1569
+ * a hub product declaring a single Dashboard shows nothing else, and the real
1570
+ * tabs appear only once the user switches into a product. A single-product
1571
+ * shell uses the component-level `items` / `groups` instead.
1572
+ *
1573
+ * **The account block is the role select.** Mark the role submenu
1574
+ * `reflectsRole` and the line under the user's name follows the selection with
1575
+ * no round-trip through the host — see `DEFAULT_APP_SIDEBAR_MENU`.
1576
+ *
1577
+ * **Layout.** The host is a plain flex child that owns its own width, so the
1578
+ * app shell is just a flex row — no magic margins to keep in sync:
1579
+ *
1580
+ * ```html
1581
+ * <div style="display:flex; min-height:100vh">
1582
+ * <pecb-app-sidebar [items]="nav" [(collapsed)]="collapsed" />
1583
+ * <main style="flex:1; min-width:0"><!-- page --></main>
1584
+ * </div>
1585
+ * ```
1586
+ *
1587
+ * **Responsive.** Below `mobileBreakpoint` the rail turns into an off-canvas
1588
+ * drawer with a scrim, a focus trap and body scroll-lock. Bind `mobileOpen`
1589
+ * to a hamburger button in the header — `collapsed` is ignored while the
1590
+ * drawer is in play, and navigating closes it automatically.
1591
+ *
1592
+ * **Floating layers** (product menu, account menu, collapsed flyouts and
1593
+ * tooltips) all render through the CDK overlay, so they are never clipped by
1594
+ * the scroll container and reposition themselves inside the viewport.
1595
+ *
1596
+ * @example
1597
+ * ```html
1598
+ * <pecb-app-sidebar
1599
+ * [logoSrc]="'assets/my-pecb.svg'"
1600
+ * [collapsedLogoSrc]="'assets/pecb-mark.svg'"
1601
+ * [products]="products"
1602
+ * [(activeProductId)]="productId"
1603
+ * [items]="navItems"
1604
+ * [(activeItemId)]="activeId"
1605
+ * [user]="user"
1606
+ * [menu]="accountMenu"
1607
+ * [(collapsed)]="collapsed"
1608
+ * [(mobileOpen)]="drawerOpen"
1609
+ * (navigate)="go($event)"
1610
+ * (menuItemClick)="onAccountAction($event)"
1611
+ * (menuOptionChange)="onLanguageOrRole($event)"
1612
+ * />
1613
+ * ```
1614
+ */
1615
+ declare class AppSidebarComponent {
1616
+ private readonly sanitizer;
1617
+ private readonly overlay;
1618
+ private readonly platformId;
1619
+ private readonly destroyRef;
1620
+ private readonly host;
1621
+ /** Logo image URL shown while the sidebar is expanded. */
1622
+ readonly logoSrc: _angular_core.InputSignal<string | undefined>;
1623
+ /** Compact logo/mark image URL shown while the sidebar is collapsed. */
1624
+ readonly collapsedLogoSrc: _angular_core.InputSignal<string | undefined>;
1625
+ /**
1626
+ * Inline SVG markup for the expanded logo. Preferred over `logoSrc` when both
1627
+ * are given — vector markup stays crisp at any density and inherits colour.
1628
+ */
1629
+ readonly logo: _angular_core.InputSignal<string | undefined>;
1630
+ /** Inline SVG markup for the collapsed mark. Preferred over `collapsedLogoSrc`. */
1631
+ readonly collapsedLogo: _angular_core.InputSignal<string | undefined>;
1632
+ /** Link the logo navigates to. Renders a plain image when omitted. */
1633
+ readonly logoHref: _angular_core.InputSignal<string | undefined>;
1634
+ /** Whether anything was supplied to render in the logo slot. */
1635
+ readonly hasLogo: _angular_core.Signal<boolean>;
1636
+ /** Product switcher entries. The switcher is hidden when empty. */
1637
+ readonly products: _angular_core.InputSignal<AppSidebarProduct[]>;
1638
+ /** Id of the product shown in the switcher trigger. Two-way bindable. */
1639
+ readonly activeProductId: _angular_core.ModelSignal<string | null>;
1640
+ /** Flat navigation list — the common case. Merged after `groups`. */
1641
+ readonly items: _angular_core.InputSignal<AppSidebarNavItem[]>;
1642
+ /** Grouped navigation, for sidebars with titled sections. */
1643
+ readonly groups: _angular_core.InputSignal<AppSidebarNavGroup[]>;
1644
+ /** Id of the highlighted item. Updated on click, so it works uncontrolled. */
1645
+ readonly activeItemId: _angular_core.ModelSignal<string | null>;
1646
+ /** Signed-in user. The account block is hidden when `null`. */
1647
+ readonly user: _angular_core.InputSignal<AppSidebarUser | null>;
1648
+ /** Entries of the account dropdown. The dropdown is skipped when empty. */
1649
+ readonly menu: _angular_core.InputSignal<AppSidebarMenuItem[]>;
1650
+ /** Whether the rail can be collapsed. Hides the toggle when `false`. */
1651
+ readonly collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
1652
+ /** Collapsed state. Two-way bindable; ignored while the drawer is active. */
1653
+ readonly collapsed: _angular_core.ModelSignal<boolean>;
1654
+ /** Off-canvas drawer state on small screens. Two-way bindable. */
1655
+ readonly mobileOpen: _angular_core.ModelSignal<boolean>;
1656
+ /** Viewport width (px) at or below which the rail becomes a drawer. */
1657
+ readonly mobileBreakpoint: _angular_core.InputSignalWithTransform<number, unknown>;
1658
+ /**
1659
+ * Expanded rail width in px. Leave unset to inherit
1660
+ * `--pecb-app-sidebar-width` from an ancestor (default 270).
1661
+ */
1662
+ readonly width: _angular_core.InputSignal<number | undefined>;
1663
+ /**
1664
+ * Collapsed rail width in px. Leave unset to inherit
1665
+ * `--pecb-app-sidebar-collapsed-width` from an ancestor (default 84).
1666
+ */
1667
+ readonly collapsedWidth: _angular_core.InputSignal<number | undefined>;
1668
+ /** Keep at most one navigation branch expanded at a time. */
1669
+ readonly autoCollapseSiblings: _angular_core.InputSignalWithTransform<boolean, unknown>;
1670
+ /**
1671
+ * After switching to a product that owns its navigation, land on that
1672
+ * product's first selectable tab and emit `navigate` for it. Turn it off to
1673
+ * leave the rail unselected until the user picks a tab themselves.
1674
+ */
1675
+ readonly autoSelectFirstItem: _angular_core.InputSignalWithTransform<boolean, unknown>;
1676
+ /** Show tooltips beside icons while collapsed. */
1677
+ readonly showTooltips: _angular_core.InputSignalWithTransform<boolean, unknown>;
1678
+ /**
1679
+ * `localStorage` key for persisting the collapsed state. Persistence is off
1680
+ * when omitted; state then lives entirely in the `collapsed` binding.
1681
+ */
1682
+ readonly storageKey: _angular_core.InputSignal<string | undefined>;
1683
+ /** Overrides for user-visible strings. Merged over the English defaults. */
1684
+ readonly labels: _angular_core.InputSignal<Partial<AppSidebarLabels>>;
1685
+ /** A leaf navigation item was activated. */
1686
+ readonly navigate: _angular_core.OutputEmitterRef<AppSidebarNavItem>;
1687
+ /** A product was picked in the switcher. */
1688
+ readonly productChange: _angular_core.OutputEmitterRef<AppSidebarProduct>;
1689
+ /** An account-menu entry without submenu was activated. */
1690
+ readonly menuItemClick: _angular_core.OutputEmitterRef<AppSidebarMenuItem>;
1691
+ /** A submenu choice (language, role, …) was picked. */
1692
+ readonly menuOptionChange: _angular_core.OutputEmitterRef<AppSidebarMenuOptionChange>;
1693
+ /** The account block was clicked while no `menu` is configured. */
1694
+ readonly userClick: _angular_core.OutputEmitterRef<AppSidebarUser>;
1695
+ private readonly mobile;
1696
+ /** `true` while the viewport is at or below `mobileBreakpoint` — i.e. while
1697
+ * the rail is rendered as an off-canvas drawer. Read it from a template
1698
+ * reference to show a hamburger only when it is needed. */
1699
+ readonly isMobile: _angular_core.Signal<boolean>;
1700
+ /** Which of the two anchored menus is open. */
1701
+ readonly openLayer: _angular_core.WritableSignal<AppSidebarLayer>;
1702
+ /** Navigation branch shown as a flyout while collapsed. */
1703
+ readonly flyoutItem: _angular_core.WritableSignal<AppSidebarNavItem | null>;
1704
+ /** Account-menu entry whose submenu is open. */
1705
+ readonly submenuItem: _angular_core.WritableSignal<AppSidebarMenuItem | null>;
1706
+ /** Navigation item currently hovered while collapsed. */
1707
+ readonly tooltipItem: _angular_core.WritableSignal<AppSidebarNavItem | null>;
1708
+ /** Anchors for the overlays. Captured on interaction, so the origins stay
1709
+ * valid across the collapsed / drawer re-layouts. */
1710
+ readonly productOrigin: _angular_core.WritableSignal<HTMLElement | null>;
1711
+ readonly accountOrigin: _angular_core.WritableSignal<HTMLElement | null>;
1712
+ readonly flyoutOrigin: _angular_core.WritableSignal<HTMLElement | null>;
1713
+ readonly submenuOrigin: _angular_core.WritableSignal<HTMLElement | null>;
1714
+ readonly tooltipOrigin: _angular_core.WritableSignal<HTMLElement | null>;
1715
+ /** Ids of expanded navigation branches. */
1716
+ private readonly expandedIds;
1717
+ /** Measured trigger width, so anchored menus line up with their trigger. */
1718
+ private readonly triggerWidth;
1719
+ /**
1720
+ * Selected option per submenu entry. Seeded from the data and updated on
1721
+ * click, so selection is correct even when the host does not feed it back.
1722
+ */
1723
+ private readonly selectedOptionIds;
1724
+ /** Sanitised icon markup, cached so change detection does not re-sanitise. */
1725
+ private readonly iconCache;
1726
+ /**
1727
+ * Overlays follow their anchor while the sidebar scrolls.
1728
+ *
1729
+ * A `ScrollStrategy` instance belongs to exactly one overlay, and the account
1730
+ * menu and its submenu are open at the same time — so each layer gets its own.
1731
+ */
1732
+ readonly productScroll: ScrollStrategy;
1733
+ readonly accountScroll: ScrollStrategy;
1734
+ readonly submenuScroll: ScrollStrategy;
1735
+ readonly flyoutScroll: ScrollStrategy;
1736
+ readonly tooltipScroll: ScrollStrategy;
1737
+ private repositionScroll;
1738
+ /** Resolved strings, defaults merged with the `labels` overrides. */
1739
+ readonly text: _angular_core.Signal<AppSidebarLabels>;
1740
+ /** `true` only when the rail is genuinely rendered narrow (never on mobile). */
1741
+ readonly isCollapsed: _angular_core.Signal<boolean>;
1742
+ /**
1743
+ * The navigation the rail is currently showing.
1744
+ *
1745
+ * A product that declares its own `items` / `groups` owns the rail outright,
1746
+ * so switching product swaps the whole tab set. Otherwise the component-level
1747
+ * navigation is used: `groups` first, then a trailing untitled group for the
1748
+ * flat `items` list.
1749
+ */
1750
+ readonly navGroups: _angular_core.Signal<AppSidebarNavGroup[]>;
1751
+ /** Flattened lookup used for active-branch resolution. */
1752
+ private readonly allItems;
1753
+ /** The product rendered in the switcher trigger. */
1754
+ readonly activeProduct: _angular_core.Signal<AppSidebarProduct | null>;
1755
+ /** Product entries grouped by their `section`, preserving declaration order. */
1756
+ readonly productSections: _angular_core.Signal<{
1757
+ key: string;
1758
+ label?: string;
1759
+ products: AppSidebarProduct[];
1760
+ }[]>;
1761
+ /**
1762
+ * The subtitle under the user's name.
1763
+ *
1764
+ * A submenu marked `reflectsRole` (the role switcher) wins over the static
1765
+ * `user.role`, so the profile block always shows the role that is selected —
1766
+ * the host does not have to feed the choice back in.
1767
+ */
1768
+ readonly accountRole: _angular_core.Signal<string | null>;
1769
+ /** Width applied to the anchored menus — matched to the trigger they open from. */
1770
+ readonly menuWidth: _angular_core.Signal<number>;
1771
+ /** Product menu: under the trigger when expanded, beside it when collapsed. */
1772
+ readonly productPositions: _angular_core.Signal<ConnectedPosition[]>;
1773
+ /** Account menu: above the trigger when expanded, beside it when collapsed. */
1774
+ readonly accountPositions: _angular_core.Signal<ConnectedPosition[]>;
1775
+ /** Flyouts and submenus sit beside their anchor and flip when short on room. */
1776
+ readonly flyoutPositions: ConnectedPosition[];
1777
+ /** Tooltips sit to the right of the icon, vertically centred. */
1778
+ readonly tooltipPositions: ConnectedPosition[];
1779
+ private sidePositions;
1780
+ constructor();
1781
+ /** Collapse or expand the rail. No-op when `collapsible` is `false`. */
1782
+ toggleCollapsed(): void;
1783
+ /** Open the off-canvas drawer. */
1784
+ openMobile(): void;
1785
+ /** Close the off-canvas drawer. */
1786
+ closeMobile(): void;
1787
+ /** Toggle the off-canvas drawer — wire this to a header hamburger. */
1788
+ toggleMobile(): void;
1789
+ /** Close the product menu, the account menu and every flyout. */
1790
+ closeAllLayers(): void;
1791
+ /** `true` when the item itself is the active one. */
1792
+ isActive(item: AppSidebarNavItem): boolean;
1793
+ /** `true` when the item or any descendant is active. */
1794
+ isActiveBranch(item: AppSidebarNavItem): boolean;
1795
+ /** `true` when the item's inline branch is open. */
1796
+ isExpanded(item: AppSidebarNavItem): boolean;
1797
+ /**
1798
+ * Class list for one navigation entry.
1799
+ *
1800
+ * Built here rather than as a stack of `[class.…]` bindings because the same
1801
+ * markup is emitted from three branches (routerLink / href / button) at three
1802
+ * depths — one source of truth keeps them from drifting apart.
1803
+ */
1804
+ navItemClass(item: AppSidebarNavItem, depth: number): string;
1805
+ /**
1806
+ * Handle a click on a navigation item, in the rail or inside a flyout.
1807
+ *
1808
+ * Branches toggle — inline while expanded, as a flyout while collapsed —
1809
+ * and leaves become the active item, emit `navigate` and close the drawer.
1810
+ */
1811
+ onNavClick(item: AppSidebarNavItem, event: MouseEvent, source?: 'rail' | 'flyout'): void;
1812
+ private toggleExpanded;
1813
+ private siblingsOf;
1814
+ /** Open or close the product menu, anchoring it to the trigger. */
1815
+ toggleProductMenu(event: MouseEvent): void;
1816
+ /** Class list for one product-menu entry. */
1817
+ productItemClass(product: AppSidebarProduct): string;
1818
+ /**
1819
+ * Pick a product.
1820
+ *
1821
+ * When the product owns its navigation the rail swaps tab sets, so the stale
1822
+ * expansion state is dropped and — unless `autoSelectFirstItem` is off — the
1823
+ * rail lands on the new product's first selectable tab, emitting `navigate`
1824
+ * for it so the host can route in the one place it already listens.
1825
+ */
1826
+ selectProduct(product: AppSidebarProduct, event: MouseEvent): void;
1827
+ /** The first enabled leaf of the current navigation, depth-first. */
1828
+ private firstSelectableItem;
1829
+ /** Open or close the account dropdown. */
1830
+ toggleAccountMenu(event: MouseEvent): void;
1831
+ /** Class list for one account-menu entry. */
1832
+ menuRowClass(item: AppSidebarMenuItem): string;
1833
+ /** Handle a click on an account-menu entry. */
1834
+ onMenuItemClick(item: AppSidebarMenuItem, event: MouseEvent): void;
1835
+ /** Pick a submenu choice; emits `menuOptionChange`. */
1836
+ selectMenuOption(item: AppSidebarMenuItem, option: AppSidebarMenuOption): void;
1837
+ /** `true` when `option` is the current choice of `item`. */
1838
+ isOptionSelected(item: AppSidebarMenuItem, option: AppSidebarMenuOption): boolean;
1839
+ /** Show the collapsed-mode tooltip for a navigation item. */
1840
+ onItemEnter(item: AppSidebarNavItem, event: Event): void;
1841
+ /** Hide the collapsed-mode tooltip. */
1842
+ onItemLeave(): void;
1843
+ /**
1844
+ * Trust inline SVG markup supplied through the data inputs.
1845
+ *
1846
+ * Icons come from the host application's own code, never from user input —
1847
+ * the same contract as the rest of the library's icon inputs. Results are
1848
+ * cached so repeated change detection does not re-run the sanitizer.
1849
+ */
1850
+ safeIcon(markup: string): SafeHtml;
1851
+ /** Initials fallback for the avatar, derived from the name when not given. */
1852
+ userInitials(user: AppSidebarUser): string;
1853
+ /** Close everything on Escape; a second Escape closes the mobile drawer. */
1854
+ onEscape(): void;
1855
+ /** Close only the submenu layer — used when the parent menu is dismissed. */
1856
+ onMenuOutsideClick(): void;
1857
+ private measureTrigger;
1858
+ /**
1859
+ * Restore the collapsed state from `localStorage` once the key is known
1860
+ * (inputs are not available in the constructor), then keep writing it back.
1861
+ *
1862
+ * Split across two effects so the restoring write never re-triggers the
1863
+ * effect that performed it.
1864
+ */
1865
+ private syncCollapsedWithStorage;
1866
+ private readStoredCollapsed;
1867
+ private trackViewport;
1868
+ private lockBodyScroll;
1869
+ /** The host element — handy for hosts that need to measure the rail. */
1870
+ get element(): HTMLElement;
1871
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<AppSidebarComponent, never>;
1872
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<AppSidebarComponent, "pecb-app-sidebar", never, { "logoSrc": { "alias": "logoSrc"; "required": false; "isSignal": true; }; "collapsedLogoSrc": { "alias": "collapsedLogoSrc"; "required": false; "isSignal": true; }; "logo": { "alias": "logo"; "required": false; "isSignal": true; }; "collapsedLogo": { "alias": "collapsedLogo"; "required": false; "isSignal": true; }; "logoHref": { "alias": "logoHref"; "required": false; "isSignal": true; }; "products": { "alias": "products"; "required": false; "isSignal": true; }; "activeProductId": { "alias": "activeProductId"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "activeItemId": { "alias": "activeItemId"; "required": false; "isSignal": true; }; "user": { "alias": "user"; "required": false; "isSignal": true; }; "menu": { "alias": "menu"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "mobileOpen": { "alias": "mobileOpen"; "required": false; "isSignal": true; }; "mobileBreakpoint": { "alias": "mobileBreakpoint"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "collapsedWidth": { "alias": "collapsedWidth"; "required": false; "isSignal": true; }; "autoCollapseSiblings": { "alias": "autoCollapseSiblings"; "required": false; "isSignal": true; }; "autoSelectFirstItem": { "alias": "autoSelectFirstItem"; "required": false; "isSignal": true; }; "showTooltips": { "alias": "showTooltips"; "required": false; "isSignal": true; }; "storageKey": { "alias": "storageKey"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; }, { "activeProductId": "activeProductIdChange"; "activeItemId": "activeItemIdChange"; "collapsed": "collapsedChange"; "mobileOpen": "mobileOpenChange"; "navigate": "navigate"; "productChange": "productChange"; "menuItemClick": "menuItemClick"; "menuOptionChange": "menuOptionChange"; "userClick": "userClick"; }, never, ["[appSidebarHeader]", "[appSidebarPromo]", "[appSidebarFooter]"], true, never>;
1873
+ }
1874
+
1875
+ /**
1876
+ * Public data contracts for {@link AppHeaderComponent}.
1877
+ *
1878
+ * @module components/app-header
1879
+ */
1880
+ /** Colour treatment of the status chip beside the page title. */
1881
+ type AppHeaderChipTone = 'neutral' | 'success' | 'warning' | 'danger' | 'info';
1882
+ /** The small pill beside the page title — a role, a state, a plan. */
1883
+ interface AppHeaderChip {
1884
+ /** Visible text. */
1885
+ label: string;
1886
+ /** Colour treatment. Defaults to `success`, matching the Central Hub role chip. */
1887
+ tone?: AppHeaderChipTone;
1888
+ }
1889
+ /** An icon button in the header's action cluster (cart, help, …). */
1890
+ interface AppHeaderAction {
1891
+ /** Stable identity, echoed back on `actionClick`. */
1892
+ id: string;
1893
+ /** Inline SVG markup for the glyph. */
1894
+ icon: string;
1895
+ /** Accessible name. Also used as the native tooltip. */
1896
+ label: string;
1897
+ /**
1898
+ * Corner badge. A `0` renders nothing, so a cart count can be bound
1899
+ * unconditionally.
1900
+ */
1901
+ badge?: number | string;
1902
+ /** Renders the button as a link. */
1903
+ href?: string;
1904
+ /** Anchor target, e.g. `_blank`. Only applies when `href` is set. */
1905
+ target?: '_blank' | '_self' | '_parent' | '_top';
1906
+ /** Renders the action non-interactive. */
1907
+ disabled?: boolean;
1908
+ }
1909
+ /** One entry in the notification dropdown. */
1910
+ interface AppHeaderNotification {
1911
+ /** Stable identity, echoed back on `notificationClick`. */
1912
+ id: string;
1913
+ /** Headline text. */
1914
+ title: string;
1915
+ /** Secondary line — timestamp, priority, … */
1916
+ meta?: string;
1917
+ /** Read entries lose the tint and the unread dot. */
1918
+ read?: boolean;
1919
+ /** Inline SVG markup for the leading tile. */
1920
+ icon?: string;
1921
+ /** Tile foreground colour, e.g. `#a11e29`. */
1922
+ iconColor?: string;
1923
+ /** Tile background colour, e.g. `#fbeaea`. */
1924
+ iconBackground?: string;
1925
+ }
1926
+ /**
1927
+ * Every user-visible string the header renders itself.
1928
+ * Override any subset via the `labels` input to translate the component.
1929
+ */
1930
+ interface AppHeaderLabels {
1931
+ /** Aria-label of the hamburger. */
1932
+ openNavigation: string;
1933
+ /** Aria-label of the bell button. */
1934
+ notifications: string;
1935
+ /** Heading of the notification dropdown. */
1936
+ notificationsTitle: string;
1937
+ /** Footer link of the notification dropdown. */
1938
+ viewAll: string;
1939
+ /** Shown when there is nothing to report. */
1940
+ empty: string;
1941
+ /**
1942
+ * Screen-reader suffix for the unread count on the bell.
1943
+ * `{n}` is replaced with the number.
1944
+ */
1945
+ unreadCount: string;
1946
+ }
1947
+ /** Default English strings used when `labels` is not overridden. */
1948
+ declare const DEFAULT_APP_HEADER_LABELS: AppHeaderLabels;
1949
+
1950
+ /**
1951
+ * Shipped translations for {@link AppHeaderComponent}.
1952
+ *
1953
+ * Every string the bar renders itself lives here; the title, chip, actions and
1954
+ * notifications are consumer data and are translated wherever that data comes
1955
+ * from.
1956
+ *
1957
+ * ```ts
1958
+ * labels = computed(() => APP_HEADER_TRANSLATIONS[this.locale()]);
1959
+ * ```
1960
+ *
1961
+ * @module components/app-header
1962
+ */
1963
+
1964
+ /**
1965
+ * Chrome strings per locale.
1966
+ *
1967
+ * `unreadCount` carries a `{n}` placeholder that the component substitutes, so
1968
+ * each locale controls where the number sits — Japanese and Korean put it after
1969
+ * the word, unlike the European forms.
1970
+ */
1971
+ declare const APP_HEADER_TRANSLATIONS: AppShellTranslations<AppHeaderLabels>;
1972
+ /**
1973
+ * The bar's chrome strings for a locale. Accepts region tags (`'fr-CA'`) and
1974
+ * falls back to English for anything unrecognised.
1975
+ */
1976
+ declare function appHeaderLabels(locale: string | AppShellLocale): AppHeaderLabels;
1977
+
1978
+ /**
1979
+ * Application shell header — the bar that sits above the page beside
1980
+ * {@link AppSidebarComponent}.
1981
+ *
1982
+ * Page title, an optional status chip, a cluster of icon actions with corner
1983
+ * badges, and the notification bell with its dropdown (unread tint, coloured
1984
+ * icon tiles, "view all" footer and an empty state).
1985
+ *
1986
+ * It pairs with the sidebar without either knowing about the other — bind the
1987
+ * hamburger to the rail's own drawer state:
1988
+ *
1989
+ * ```html
1990
+ * <div style="display:flex; min-height:100vh">
1991
+ * <pecb-app-sidebar #rail [items]="nav" [(mobileOpen)]="drawerOpen" />
1992
+ * <div style="flex:1; min-width:0">
1993
+ * <pecb-app-header
1994
+ * heading="Central Hub"
1995
+ * [chip]="{ label: 'Member' }"
1996
+ * [actions]="[cart]"
1997
+ * [notifications]="notifications"
1998
+ * [showMenuButton]="rail.isMobile()"
1999
+ * (menuClick)="rail.toggleMobile()"
2000
+ * (actionClick)="onAction($event)"
2001
+ * (notificationClick)="open($event)"
2002
+ * (viewAllNotifications)="goToInbox()"
2003
+ * />
2004
+ * <main><!-- page --></main>
2005
+ * </div>
2006
+ * </div>
2007
+ * ```
2008
+ *
2009
+ * The dropdown renders through the CDK overlay, so it is never clipped by the
2010
+ * header's own stacking context and repositions itself inside the viewport.
2011
+ */
2012
+ declare class AppHeaderComponent {
2013
+ private readonly sanitizer;
2014
+ private readonly overlay;
2015
+ /** Page title. Omit it and project `[appHeaderTitle]` for custom markup. */
2016
+ readonly heading: _angular_core.InputSignal<string | undefined>;
2017
+ /** Status pill shown beside the title. */
2018
+ readonly chip: _angular_core.InputSignal<AppHeaderChip | null>;
2019
+ /** Icon buttons in the action cluster, in render order. */
2020
+ readonly actions: _angular_core.InputSignal<AppHeaderAction[]>;
2021
+ /** Whether the notification bell is rendered. */
2022
+ readonly showNotifications: _angular_core.InputSignalWithTransform<boolean, unknown>;
2023
+ /** Notification entries. An empty list renders the dropdown's empty state. */
2024
+ readonly notifications: _angular_core.InputSignal<AppHeaderNotification[]>;
2025
+ /** How many entries the dropdown shows before the "view all" footer. */
2026
+ readonly notificationsLimit: _angular_core.InputSignalWithTransform<number, unknown>;
2027
+ /** Whether the dropdown is open. Two-way bindable. */
2028
+ readonly notificationsOpen: _angular_core.ModelSignal<boolean>;
2029
+ /**
2030
+ * Whether the hamburger is rendered. Bind it to the sidebar's drawer state —
2031
+ * `[showMenuButton]="rail.isMobile()"` — so the two never disagree.
2032
+ */
2033
+ readonly showMenuButton: _angular_core.InputSignalWithTransform<boolean, unknown>;
2034
+ /** Keeps the header pinned while the page scrolls. */
2035
+ readonly sticky: _angular_core.InputSignalWithTransform<boolean, unknown>;
2036
+ /** Overrides for user-visible strings. Merged over the English defaults. */
2037
+ readonly labels: _angular_core.InputSignal<Partial<AppHeaderLabels>>;
2038
+ /** The hamburger was pressed. */
2039
+ readonly menuClick: _angular_core.OutputEmitterRef<void>;
2040
+ /** An action button was pressed. */
2041
+ readonly actionClick: _angular_core.OutputEmitterRef<AppHeaderAction>;
2042
+ /** A notification entry was pressed. */
2043
+ readonly notificationClick: _angular_core.OutputEmitterRef<AppHeaderNotification>;
2044
+ /** The dropdown's footer link was pressed. */
2045
+ readonly viewAllNotifications: _angular_core.OutputEmitterRef<void>;
2046
+ /** Anchor for the notification overlay, captured when the bell is pressed. */
2047
+ readonly bellOrigin: _angular_core.WritableSignal<HTMLElement | null>;
2048
+ /** The dropdown follows the bell while the page scrolls. */
2049
+ readonly scrollStrategy: ScrollStrategy;
2050
+ /** Below the bell, right-aligned; flips above when there is no room. */
2051
+ readonly overlayPositions: ConnectedPosition[];
2052
+ /** Resolved strings, defaults merged with the `labels` overrides. */
2053
+ readonly text: _angular_core.Signal<AppHeaderLabels>;
2054
+ /** How many notifications are unread. */
2055
+ readonly unreadCount: _angular_core.Signal<number>;
2056
+ /** The slice shown in the dropdown. */
2057
+ readonly visibleNotifications: _angular_core.Signal<AppHeaderNotification[]>;
2058
+ /** Screen-reader text for the bell's unread badge. */
2059
+ readonly unreadLabel: _angular_core.Signal<string>;
2060
+ /** Open or close the notification dropdown. */
2061
+ toggleNotifications(event: MouseEvent): void;
2062
+ /** Close the notification dropdown. */
2063
+ closeNotifications(): void;
2064
+ /** Handle a press on an action button. */
2065
+ onActionClick(action: AppHeaderAction, event: MouseEvent): void;
2066
+ /** Handle a press on a notification entry. */
2067
+ onNotificationClick(notification: AppHeaderNotification): void;
2068
+ /** Handle a press on the dropdown footer. */
2069
+ onViewAll(): void;
2070
+ /** A badge renders only for a non-zero count or a non-empty string. */
2071
+ hasBadge(action: AppHeaderAction): boolean;
2072
+ /** Class list for the status chip. */
2073
+ chipClass(chip: AppHeaderChip): string;
2074
+ /**
2075
+ * Trust inline SVG markup supplied through the data inputs.
2076
+ *
2077
+ * Icons come from the host application's own code, never from user input.
2078
+ * Results are cached so change detection does not re-run the sanitizer.
2079
+ */
2080
+ safeIcon(markup: string): SafeHtml;
2081
+ private readonly iconCache;
2082
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<AppHeaderComponent, never>;
2083
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<AppHeaderComponent, "pecb-app-header", never, { "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "chip": { "alias": "chip"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "showNotifications": { "alias": "showNotifications"; "required": false; "isSignal": true; }; "notifications": { "alias": "notifications"; "required": false; "isSignal": true; }; "notificationsLimit": { "alias": "notificationsLimit"; "required": false; "isSignal": true; }; "notificationsOpen": { "alias": "notificationsOpen"; "required": false; "isSignal": true; }; "showMenuButton": { "alias": "showMenuButton"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; }, { "notificationsOpen": "notificationsOpenChange"; "menuClick": "menuClick"; "actionClick": "actionClick"; "notificationClick": "notificationClick"; "viewAllNotifications": "viewAllNotifications"; }, never, ["[appHeaderStart]", "[appHeaderTitle]", "[appHeaderEnd]"], true, never>;
2084
+ }
2085
+
1116
2086
  type ConfirmationIconType = 'success' | 'warning' | 'error' | 'info';
1117
2087
  declare class ConfirmationComponent implements OnDestroy {
1118
2088
  id: _angular_core.InputSignal<string>;
@@ -5673,6 +6643,10 @@ declare class ProjectLayoutComponent {
5673
6643
  calendarAriaLabel: _angular_core.InputSignal<string>;
5674
6644
  /** Prefix for the profile button accessible label (e.g. "Profile: Jane Doe"). */
5675
6645
  profileAriaLabel: _angular_core.InputSignal<string>;
6646
+ /** Accessible label for the mobile hamburger that opens the sidebar drawer. */
6647
+ openNavAriaLabel: _angular_core.InputSignal<string>;
6648
+ /** Accessible label for the backdrop that closes the sidebar drawer. */
6649
+ closeNavAriaLabel: _angular_core.InputSignal<string>;
5676
6650
  showLanguage: _angular_core.InputSignal<boolean>;
5677
6651
  language: _angular_core.InputSignal<string>;
5678
6652
  showBell: _angular_core.InputSignal<boolean>;
@@ -5701,11 +6675,23 @@ declare class ProjectLayoutComponent {
5701
6675
  profileClick: _angular_core.OutputEmitterRef<void>;
5702
6676
  sidebarItemClick: _angular_core.OutputEmitterRef<SidebarMenuItem>;
5703
6677
  sidebarCollapsed: _angular_core.WritableSignal<boolean>;
6678
+ /**
6679
+ * Whether the off-canvas sidebar drawer is open. Only has a visual effect
6680
+ * below the `sm` breakpoint — above it the sidebar is always in the grid,
6681
+ * and the CSS that reads this flag is scoped to the mobile media query.
6682
+ */
6683
+ mobileNavOpen: _angular_core.WritableSignal<boolean>;
5704
6684
  onCategoryChange(event: Event): void;
6685
+ toggleMobileNav(): void;
6686
+ closeMobileNav(): void;
6687
+ /** Closing on Escape matches the drawer/modal behaviour elsewhere. */
6688
+ onEscape(): void;
6689
+ /** Navigating away should dismiss the drawer it was opened from. */
6690
+ onSidebarItemClick(item: SidebarMenuItem): void;
5705
6691
  layoutClasses: _angular_core.Signal<string[]>;
5706
6692
  contentClasses: _angular_core.Signal<string[]>;
5707
6693
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProjectLayoutComponent, never>;
5708
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProjectLayoutComponent, "pecb-project-layout", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "pageTitle": { "alias": "pageTitle"; "required": false; "isSignal": true; }; "contentStyle": { "alias": "contentStyle"; "required": false; "isSignal": true; }; "showSidebar": { "alias": "showSidebar"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "sidebarSections": { "alias": "sidebarSections"; "required": false; "isSignal": true; }; "sidebarShowHeader": { "alias": "sidebarShowHeader"; "required": false; "isSignal": true; }; "sidebarLogoSrc": { "alias": "sidebarLogoSrc"; "required": false; "isSignal": true; }; "sidebarLogo": { "alias": "sidebarLogo"; "required": false; "isSignal": true; }; "sidebarCollapsedLogo": { "alias": "sidebarCollapsedLogo"; "required": false; "isSignal": true; }; "sidebarShowFooter": { "alias": "sidebarShowFooter"; "required": false; "isSignal": true; }; "searchType": { "alias": "searchType"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "productSearchPlaceholder": { "alias": "productSearchPlaceholder"; "required": false; "isSignal": true; }; "productCategories": { "alias": "productCategories"; "required": false; "isSignal": true; }; "searchAriaLabel": { "alias": "searchAriaLabel"; "required": false; "isSignal": true; }; "productSearchAriaLabel": { "alias": "productSearchAriaLabel"; "required": false; "isSignal": true; }; "categoryAriaLabel": { "alias": "categoryAriaLabel"; "required": false; "isSignal": true; }; "notificationsAriaLabel": { "alias": "notificationsAriaLabel"; "required": false; "isSignal": true; }; "cartAriaLabel": { "alias": "cartAriaLabel"; "required": false; "isSignal": true; }; "calendarAriaLabel": { "alias": "calendarAriaLabel"; "required": false; "isSignal": true; }; "profileAriaLabel": { "alias": "profileAriaLabel"; "required": false; "isSignal": true; }; "showLanguage": { "alias": "showLanguage"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "showBell": { "alias": "showBell"; "required": false; "isSignal": true; }; "showCart": { "alias": "showCart"; "required": false; "isSignal": true; }; "showCalendar": { "alias": "showCalendar"; "required": false; "isSignal": true; }; "profileName": { "alias": "profileName"; "required": false; "isSignal": true; }; "profileRole": { "alias": "profileRole"; "required": false; "isSignal": true; }; "profileImage": { "alias": "profileImage"; "required": false; "isSignal": true; }; "profileType": { "alias": "profileType"; "required": false; "isSignal": true; }; }, { "searchChange": "searchChange"; "productSearchChange": "productSearchChange"; "categoryChange": "categoryChange"; "languageClick": "languageClick"; "bellClick": "bellClick"; "cartClick": "cartClick"; "calendarClick": "calendarClick"; "profileClick": "profileClick"; "sidebarItemClick": "sidebarItemClick"; }, never, ["[sidebar-header]", "[sidebar-footer]", "[layoutHeaderActions]", "[layoutContent]"], true, never>;
6694
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProjectLayoutComponent, "pecb-project-layout", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "pageTitle": { "alias": "pageTitle"; "required": false; "isSignal": true; }; "contentStyle": { "alias": "contentStyle"; "required": false; "isSignal": true; }; "showSidebar": { "alias": "showSidebar"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "sidebarSections": { "alias": "sidebarSections"; "required": false; "isSignal": true; }; "sidebarShowHeader": { "alias": "sidebarShowHeader"; "required": false; "isSignal": true; }; "sidebarLogoSrc": { "alias": "sidebarLogoSrc"; "required": false; "isSignal": true; }; "sidebarLogo": { "alias": "sidebarLogo"; "required": false; "isSignal": true; }; "sidebarCollapsedLogo": { "alias": "sidebarCollapsedLogo"; "required": false; "isSignal": true; }; "sidebarShowFooter": { "alias": "sidebarShowFooter"; "required": false; "isSignal": true; }; "searchType": { "alias": "searchType"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "productSearchPlaceholder": { "alias": "productSearchPlaceholder"; "required": false; "isSignal": true; }; "productCategories": { "alias": "productCategories"; "required": false; "isSignal": true; }; "searchAriaLabel": { "alias": "searchAriaLabel"; "required": false; "isSignal": true; }; "productSearchAriaLabel": { "alias": "productSearchAriaLabel"; "required": false; "isSignal": true; }; "categoryAriaLabel": { "alias": "categoryAriaLabel"; "required": false; "isSignal": true; }; "notificationsAriaLabel": { "alias": "notificationsAriaLabel"; "required": false; "isSignal": true; }; "cartAriaLabel": { "alias": "cartAriaLabel"; "required": false; "isSignal": true; }; "calendarAriaLabel": { "alias": "calendarAriaLabel"; "required": false; "isSignal": true; }; "profileAriaLabel": { "alias": "profileAriaLabel"; "required": false; "isSignal": true; }; "openNavAriaLabel": { "alias": "openNavAriaLabel"; "required": false; "isSignal": true; }; "closeNavAriaLabel": { "alias": "closeNavAriaLabel"; "required": false; "isSignal": true; }; "showLanguage": { "alias": "showLanguage"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "showBell": { "alias": "showBell"; "required": false; "isSignal": true; }; "showCart": { "alias": "showCart"; "required": false; "isSignal": true; }; "showCalendar": { "alias": "showCalendar"; "required": false; "isSignal": true; }; "profileName": { "alias": "profileName"; "required": false; "isSignal": true; }; "profileRole": { "alias": "profileRole"; "required": false; "isSignal": true; }; "profileImage": { "alias": "profileImage"; "required": false; "isSignal": true; }; "profileType": { "alias": "profileType"; "required": false; "isSignal": true; }; }, { "searchChange": "searchChange"; "productSearchChange": "productSearchChange"; "categoryChange": "categoryChange"; "languageClick": "languageClick"; "bellClick": "bellClick"; "cartClick": "cartClick"; "calendarClick": "calendarClick"; "profileClick": "profileClick"; "sidebarItemClick": "sidebarItemClick"; }, never, ["[sidebar-header]", "[sidebar-footer]", "[layoutHeaderActions]", "[layoutContent]"], true, never>;
5709
6695
  }
5710
6696
 
5711
6697
  interface HierarchicalTableColumn {
@@ -7378,5 +8364,5 @@ declare class TourComponent implements OnInit, OnChanges {
7378
8364
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<TourComponent, "pecb-tour", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "indicatorType": { "alias": "indicatorType"; "required": false; "isSignal": true; }; "steps": { "alias": "steps"; "required": false; "isSignal": true; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "previousLabel": { "alias": "previousLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "finishLabel": { "alias": "finishLabel"; "required": false; "isSignal": true; }; "closeAriaLabel": { "alias": "closeAriaLabel"; "required": false; "isSignal": true; }; "initialStep": { "alias": "initialStep"; "required": false; "isSignal": true; }; }, { "isOpen": "isOpenChange"; "closed": "closed"; "previousClicked": "previousClicked"; "nextClicked": "nextClicked"; "finished": "finished"; "stepChanged": "stepChanged"; }, never, never, true, never>;
7379
8365
  }
7380
8366
 
7381
- export { AccordionItemComponent, AccordionSmallComponent, AddButtonComponent, AdminHeaderComponent, AdminHeaderFieldTemplateDirective, AffixComponent, AlertComponent, AnchorComponent, ApplicationStatusBarComponent, AuditorStatusComponent, AuthorDateTimeComponent, BackToTopComponent, BadgeComponent, BlurDirective, BottomSheetComponent, BreadcrumbsComponent, ButtonComponent, ButtonGroupComponent, ButtonGroupItemComponent, CancelUpdateButtonsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CertificateUploadBarComponent, CheckDeleteIconComponent, CheckboxComponent, CheckboxDisplayComponent, CodeInputComponent, CodeSnippetComponent, ColorPaletteComponent, ConfirmationComponent, ContentTypeTagComponent, CourseContentPanelComponent, CoursePlayerComponent, DEFAULT_COURSE_CONTENT_PANEL_LABELS, DEFAULT_LANGUAGES, DEFAULT_VIDEO_PLAYER_LABELS, DEFAULT_VIDEO_PLAYER_RATES, DashboardGridComponent, DatepickerComponent, DividerComponent, DropdownComponent, EMPTY_STATE_MAX_BUTTONS, EditButtonComponent, EditCoverPhotoComponent, EmptyStateComponent, ExpandableRowTableComponent, FileUploadComponent, FilterColumnsComponent, FloatButtonComponent, FloatButtonItemComponent, FullscreenModalComponent, FullscreenModalContentDirective, FullscreenModalFooterDirective, FullscreenModalHeaderDirective, GeneralComponent, GridComponent, GridItemComponent, HeaderActionsComponent, HeaderComponent, HeaderDividerComponent, HeaderLanguageComponent, HeaderSearchComponent, HeaderUserComponent, HierarchicalTableComponent, HorizontalStepsComponent, IconComponent, IconRegistry, IconTagComponent, InformationBoxComponent, InputComponent, LanguageDropdownComponent, LinkButtonComponent, LoadingService, MediaComponent, MessageBubbleComponent, MessageItemComponent, MetricsCardComponent, MiniIconButtonComponent, NoResultsComponent, NoteSidebarItemComponent, NotesPanelComponent, NotificationService, NotificationStatusLinkComponent, PECB_COLOR_PALETTE, PECB_CUSTOM_ICONS, PECB_FONT_STYLES, PECB_ICONS, PECB_TYPE_SCALE, PaginationComponent, PriceMethodComponent, ProfileComponent, ProfileElementsCardComponent, ProfileGroupComponent, ProgressBarComponent, ProgressCircleComponent, ProjectLayoutComponent, QuantitySelectorComponent, QuestionTypeTagComponent, RadioComponent, RadioDisplayComponent, RatingNumberComponent, ReasonForReturnComponent, RequestSentByComponent, RequestStatusBarComponent, ResultPageComponent, RightModalComponent, RightModalContentDirective, RightModalFooterDirective, RightModalHeaderDirective, ShadowDirective, SidebarComponent, SkeletonComponent, SlidePointsComponent, SpacerComponent, SpinnerComponent, StandardsPdfCardComponent, StatisticsCardComponent, StatusComponent, StepperComponent, TabComponent, TableComponent, TagComponent, TestimonialComponent, TextFormFieldComponent, ThemeService, ToggleComponent, ToolbarBarComponent, TooltipComponent, TooltipDirective, TourComponent, TranscriptLineComponent, TypographyComponent, UserWithEmailComponent, VerifyChecklistComponent, VideoPlayerComponent, VideoUploadBarComponent, VirtualTableComponent, addClass, announceToScreenReader, capitalize, closestElement, copyToClipboard, courseModuleStats, courseProgress, createAuthError, createAuthorizationError, createConfigError, createError, createNetworkError, createValidationError, disableBodyScroll, escapeHtml, findCourseLesson, findCourseModule, formatCount, formatCourseDuration, formatCourseTime, formatErrorForLog, formatErrorMessage, formatVideoTime, generateLinkedIds, generateUniqueId, getAriaCurrent, getButtonAriaAttributes, getComputedStyleValue, getDialogAriaAttributes, getFocusableElements, getInitials, getInputAriaAttributes, getOptionAriaAttributes, getProgressAriaAttributes, getScrollParent, getTabAriaAttributes, getVisuallyHiddenStyles, handleError, hasClass, isBlank, isBrowser, isElementVisible, isNotBlank, isPecbError, isRecoverableError, matchesSelector, parseLessonPartTitle, pluralize, prefersHighContrast, prefersReducedMotion, registerErrorHandler, removeClass, resolveLessonStatus, scrollIntoView, slugify, stripHtml, toCamelCase, toKebabCase, toPascalCase, toSnakeCase, toggleClass, trapFocus, truncate, tryAsync, trySync, wrapError };
7382
- export type { AccordionVariant, AddButtonVariant, AdminHeaderAction, AdminHeaderActionType, AdminHeaderBadgeVariant, AdminHeaderField, AdminHeaderFieldType, AdminHeaderMetadata, AdminHeaderMetadataType, AdminHeaderProfile, AffixPosition, AlertType, AlertVariant, Alignment, AnchorDirection, AnchorItem, AnchorLevel, AnimationTiming, AppStatusColor, AriaAttributes, AriaLive, AriaRole, AuditorStatusType, BadgeSize, BadgeStatus, BadgeVariant, BlurSize, BreadcrumbItem, BreadcrumbSeparator, Breakpoint, ButtonGroupIconMode, ButtonGroupItemPosition, ButtonIconStyle, ButtonSize, ButtonVariant, CalendarDay, Callback, CardElevation, CardRadius, CardRole, CheckDeleteType, CheckboxDisplayState, CheckboxLabelPosition, ClosableWithHooks, CodeInputDirection, CodeInputState, CodeSnippetTheme, CodeSnippetVariant, ColorPaletteGroup, ColorPaletteItem, ColorVariant, Colorable, ColumnOption, ComponentSize, ConfirmationIconType, ContentStyle, ContentTagDisplay, ContentTagType, CourseContentPanelAccent, CourseContentPanelDensity, CourseContentPanelLabels, CourseContentPanelLayout, CourseContentPanelTab, CourseLesson, CourseLessonRunView, CourseLessonStatus, CourseLessonType, CourseLessonView, CourseModule, CourseModuleStats, CourseModuleView, CoursePlayerPanelPosition, CourseProgressStats, CourseTimelineRow, CourseTranscriptCue, CourseTranscriptRow, CustomIconName, DashboardGridGap, DashboardGridLayout, DatepickerSize, Direction, Disableable, DividerType, DropdownOption, DropdownSize, EditButtonVariant, ElevationLevel, EmptyStateButton, EmptyStateIconTheme, ErrorCategory, ErrorHandler, ErrorOptions, ErrorSeverity, EventHandler, ExpandableRowColumn, ExpandableRowPageEvent, ExpandableRowProgressConfig, ExtendedColorVariant, FieldItem, FieldStyle, FileUploadEvent, FileUploadState, FileUploadVariant, FilterColumnsActiveTab, FilterColumnsApplyEvent, FilterField, FilterFieldType, FilterState, FloatButtonAction, FloatButtonPosition, Focusable, FormControlBase, GridAlign, GridColumns, GridGap, GridItemSpan, GridPadding, GridVerticalAlign, HeaderActionButton, HeaderLanguageOption, HeaderSearchCategory, HeaderSearchType, HierarchicalTableAction, HierarchicalTableColumn, HierarchicalTablePageEvent, IconColor, IconName, IconShape, IconSize, IconTagType, InformationBoxVariant, InputSize, InputType, LanguageDisplayMode, LanguageOption, LinkButtonType, Loadable, LoadingState, MarkedDate, MediaGroup, MediaItem, MediaSize, MediaType, MenuItem, MessageBubbleType, MessageDirection, MessageItemStatus, MetricsCardBadgeStatus, MetricsCardIconBg, MetricsCardOrientation, MetricsCardType, MetricsCardVariation, MiniIconAction, NonNullableProps, NoteGroup, NoteItem, NoteSidebarPosition, NoteSidebarState, Notification, NotificationConfig, NotificationPosition, NotificationStatusType, NotificationType, OptionalProps, Orientation, OverlayComponent, PageChangeEvent, PaginationSize, PaginationState, PaginationVariant, PdfCardVariant, PecbError, PecbTableColumn, PecbTableColumnComponent, PecbTableColumnType, Position, ProfileBadge, ProfileGroupItem, ProfileGroupSize, ProfileIndicator, ProfileSize, ProfileType, ProgressBarSize, ProgressCircleSize, ProgressType, QuestionTagDisplay, QuestionTagType, QuizType, RadioDisplayState, RadioLabelPosition, RadioVariant, RadiusScale, RatingStyle, RequestStatusIconType, RequireProps, ResultPageAction, ResultPageIcon, RibbonColor, RightModalSize, SearchMode, SelectableItem, ShadowHardSize, ShadowSize, ShadowSoftSize, ShadowType, SidebarMenuItem, SidebarSection, Size, Sizeable, SkeletonShape, SkeletonSize, SkeletonType, SortState, SpacerSize, SpacingScale, StateVariant, StatisticsIconColor, StatusColor, StatusSize, StatusType, StatusVariant, StepItem, StepOrder, StepState, StepperDirection, StepperSize, StepperTailStyle, StepperType, TabItem, TabSize, TabStyle, TableAction, TableColumn, TableRowActionEvent, TableSelectionEvent, TableSize, TableSortEvent, TableStatusConfig, TableUserConfig, TableVariant, TagAction, TagStyle, Templatable, TestimonialData, TestimonialVariant, TextFormFieldType, ThemeConfig, ThemeMode, ThemeVariables, ToggleLabelPosition, ToggleSize, ToolbarButton, ToolbarTab, ToolbarVariant, TooltipPointerPosition, TooltipTheme, TourIndicatorType, TourPlacement, TourStep, TourType, TranscriptLineState, TreeNode, TypographyScaleEntry, TypographyStyleEntry, UploadedFile, Validatable, ValidationError, ValidationState, VerifyChecklistItem, VerifyItemStatus, VideoPlayerError, VideoPlayerLabels, VideoPlayerPreload, VideoPlayerSource, VideoPlayerTimeEvent, VideoPlayerTrack, VirtualTableColumn, VirtualTablePageEvent, VirtualTableProgressConfig };
8367
+ export { APP_HEADER_TRANSLATIONS, APP_SHELL_LOCALES, APP_SIDEBAR_MENU_ICONS, APP_SIDEBAR_MENU_TRANSLATIONS, APP_SIDEBAR_TRANSLATIONS, AccordionItemComponent, AccordionSmallComponent, AddButtonComponent, AdminHeaderComponent, AdminHeaderFieldTemplateDirective, AffixComponent, AlertComponent, AnchorComponent, AppHeaderComponent, AppSidebarComponent, ApplicationStatusBarComponent, AuditorStatusComponent, AuthorDateTimeComponent, BackToTopComponent, BadgeComponent, BlurDirective, BottomSheetComponent, BreadcrumbsComponent, ButtonComponent, ButtonGroupComponent, ButtonGroupItemComponent, CancelUpdateButtonsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CertificateUploadBarComponent, CheckDeleteIconComponent, CheckboxComponent, CheckboxDisplayComponent, CodeInputComponent, CodeSnippetComponent, ColorPaletteComponent, ConfirmationComponent, ContentTypeTagComponent, CourseContentPanelComponent, CoursePlayerComponent, DEFAULT_APP_HEADER_LABELS, DEFAULT_APP_SIDEBAR_LABELS, DEFAULT_APP_SIDEBAR_LANGUAGES, DEFAULT_APP_SIDEBAR_MENU, DEFAULT_APP_SIDEBAR_ROLES, DEFAULT_COURSE_CONTENT_PANEL_LABELS, DEFAULT_LANGUAGES, DEFAULT_VIDEO_PLAYER_LABELS, DEFAULT_VIDEO_PLAYER_RATES, DashboardGridComponent, DatepickerComponent, DividerComponent, DropdownComponent, EMPTY_STATE_MAX_BUTTONS, EditButtonComponent, EditCoverPhotoComponent, EmptyStateComponent, ExpandableRowTableComponent, FileUploadComponent, FilterColumnsComponent, FloatButtonComponent, FloatButtonItemComponent, FullscreenModalComponent, FullscreenModalContentDirective, FullscreenModalFooterDirective, FullscreenModalHeaderDirective, GeneralComponent, GridComponent, GridItemComponent, HeaderActionsComponent, HeaderComponent, HeaderDividerComponent, HeaderLanguageComponent, HeaderSearchComponent, HeaderUserComponent, HierarchicalTableComponent, HorizontalStepsComponent, IconComponent, IconRegistry, IconTagComponent, InformationBoxComponent, InputComponent, LanguageDropdownComponent, LinkButtonComponent, LoadingService, MediaComponent, MessageBubbleComponent, MessageItemComponent, MetricsCardComponent, MiniIconButtonComponent, NoResultsComponent, NoteSidebarItemComponent, NotesPanelComponent, NotificationService, NotificationStatusLinkComponent, PECB_COLOR_PALETTE, PECB_CUSTOM_ICONS, PECB_FONT_STYLES, PECB_ICONS, PECB_TYPE_SCALE, PaginationComponent, PriceMethodComponent, ProfileComponent, ProfileElementsCardComponent, ProfileGroupComponent, ProgressBarComponent, ProgressCircleComponent, ProjectLayoutComponent, QuantitySelectorComponent, QuestionTypeTagComponent, RadioComponent, RadioDisplayComponent, RatingNumberComponent, ReasonForReturnComponent, RequestSentByComponent, RequestStatusBarComponent, ResultPageComponent, RightModalComponent, RightModalContentDirective, RightModalFooterDirective, RightModalHeaderDirective, ShadowDirective, SidebarComponent, SkeletonComponent, SlidePointsComponent, SpacerComponent, SpinnerComponent, StandardsPdfCardComponent, StatisticsCardComponent, StatusComponent, StepperComponent, TabComponent, TableComponent, TagComponent, TestimonialComponent, TextFormFieldComponent, ThemeService, ToggleComponent, ToolbarBarComponent, TooltipComponent, TooltipDirective, TourComponent, TranscriptLineComponent, TypographyComponent, UserWithEmailComponent, VerifyChecklistComponent, VideoPlayerComponent, VideoUploadBarComponent, VirtualTableComponent, addClass, announceToScreenReader, appHeaderLabels, appSidebarLabels, appSidebarMenu, appSidebarRoles, capitalize, closestElement, copyToClipboard, courseModuleStats, courseProgress, createAuthError, createAuthorizationError, createConfigError, createError, createNetworkError, createValidationError, disableBodyScroll, escapeHtml, findCourseLesson, findCourseModule, formatCount, formatCourseDuration, formatCourseTime, formatErrorForLog, formatErrorMessage, formatVideoTime, generateLinkedIds, generateUniqueId, getAriaCurrent, getButtonAriaAttributes, getComputedStyleValue, getDialogAriaAttributes, getFocusableElements, getInitials, getInputAriaAttributes, getOptionAriaAttributes, getProgressAriaAttributes, getScrollParent, getTabAriaAttributes, getVisuallyHiddenStyles, handleError, hasClass, isBlank, isBrowser, isElementVisible, isNotBlank, isPecbError, isRecoverableError, matchesSelector, parseLessonPartTitle, pluralize, prefersHighContrast, prefersReducedMotion, registerErrorHandler, removeClass, resolveAppShellLocale, resolveLessonStatus, scrollIntoView, slugify, stripHtml, toCamelCase, toKebabCase, toPascalCase, toSnakeCase, toggleClass, trapFocus, truncate, tryAsync, trySync, wrapError };
8368
+ export type { AccordionVariant, AddButtonVariant, AdminHeaderAction, AdminHeaderActionType, AdminHeaderBadgeVariant, AdminHeaderField, AdminHeaderFieldType, AdminHeaderMetadata, AdminHeaderMetadataType, AdminHeaderProfile, AffixPosition, AlertType, AlertVariant, Alignment, AnchorDirection, AnchorItem, AnchorLevel, AnimationTiming, AppHeaderAction, AppHeaderChip, AppHeaderChipTone, AppHeaderLabels, AppHeaderNotification, AppShellLocale, AppShellTranslations, AppSidebarLabels, AppSidebarMenuItem, AppSidebarMenuOption, AppSidebarMenuOptionChange, AppSidebarMenuStrings, AppSidebarNavGroup, AppSidebarNavItem, AppSidebarProduct, AppSidebarRouterLink, AppSidebarUser, AppStatusColor, AriaAttributes, AriaLive, AriaRole, AuditorStatusType, BadgeSize, BadgeStatus, BadgeVariant, BlurSize, BreadcrumbItem, BreadcrumbSeparator, Breakpoint, ButtonGroupIconMode, ButtonGroupItemPosition, ButtonIconStyle, ButtonSize, ButtonVariant, CalendarDay, Callback, CardElevation, CardRadius, CardRole, CheckDeleteType, CheckboxDisplayState, CheckboxLabelPosition, ClosableWithHooks, CodeInputDirection, CodeInputState, CodeSnippetTheme, CodeSnippetVariant, ColorPaletteGroup, ColorPaletteItem, ColorVariant, Colorable, ColumnOption, ComponentSize, ConfirmationIconType, ContentStyle, ContentTagDisplay, ContentTagType, CourseContentPanelAccent, CourseContentPanelDensity, CourseContentPanelLabels, CourseContentPanelLayout, CourseContentPanelTab, CourseLesson, CourseLessonRunView, CourseLessonStatus, CourseLessonType, CourseLessonView, CourseModule, CourseModuleStats, CourseModuleView, CoursePlayerPanelPosition, CourseProgressStats, CourseTimelineRow, CourseTranscriptCue, CourseTranscriptRow, CustomIconName, DashboardGridGap, DashboardGridLayout, DatepickerSize, Direction, Disableable, DividerType, DropdownOption, DropdownSize, EditButtonVariant, ElevationLevel, EmptyStateButton, EmptyStateIconTheme, ErrorCategory, ErrorHandler, ErrorOptions, ErrorSeverity, EventHandler, ExpandableRowColumn, ExpandableRowPageEvent, ExpandableRowProgressConfig, ExtendedColorVariant, FieldItem, FieldStyle, FileUploadEvent, FileUploadState, FileUploadVariant, FilterColumnsActiveTab, FilterColumnsApplyEvent, FilterField, FilterFieldType, FilterState, FloatButtonAction, FloatButtonPosition, Focusable, FormControlBase, GridAlign, GridColumns, GridGap, GridItemSpan, GridPadding, GridVerticalAlign, HeaderActionButton, HeaderLanguageOption, HeaderSearchCategory, HeaderSearchType, HierarchicalTableAction, HierarchicalTableColumn, HierarchicalTablePageEvent, IconColor, IconName, IconShape, IconSize, IconTagType, InformationBoxVariant, InputSize, InputType, LanguageDisplayMode, LanguageOption, LinkButtonType, Loadable, LoadingState, MarkedDate, MediaGroup, MediaItem, MediaSize, MediaType, MenuItem, MessageBubbleType, MessageDirection, MessageItemStatus, MetricsCardBadgeStatus, MetricsCardIconBg, MetricsCardOrientation, MetricsCardType, MetricsCardVariation, MiniIconAction, NonNullableProps, NoteGroup, NoteItem, NoteSidebarPosition, NoteSidebarState, Notification, NotificationConfig, NotificationPosition, NotificationStatusType, NotificationType, OptionalProps, Orientation, OverlayComponent, PageChangeEvent, PaginationSize, PaginationState, PaginationVariant, PdfCardVariant, PecbError, PecbTableColumn, PecbTableColumnComponent, PecbTableColumnType, Position, ProfileBadge, ProfileGroupItem, ProfileGroupSize, ProfileIndicator, ProfileSize, ProfileType, ProgressBarSize, ProgressCircleSize, ProgressType, QuestionTagDisplay, QuestionTagType, QuizType, RadioDisplayState, RadioLabelPosition, RadioVariant, RadiusScale, RatingStyle, RequestStatusIconType, RequireProps, ResultPageAction, ResultPageIcon, RibbonColor, RightModalSize, SearchMode, SelectableItem, ShadowHardSize, ShadowSize, ShadowSoftSize, ShadowType, SidebarMenuItem, SidebarSection, Size, Sizeable, SkeletonShape, SkeletonSize, SkeletonType, SortState, SpacerSize, SpacingScale, StateVariant, StatisticsIconColor, StatusColor, StatusSize, StatusType, StatusVariant, StepItem, StepOrder, StepState, StepperDirection, StepperSize, StepperTailStyle, StepperType, TabItem, TabSize, TabStyle, TableAction, TableColumn, TableRowActionEvent, TableSelectionEvent, TableSize, TableSortEvent, TableStatusConfig, TableUserConfig, TableVariant, TagAction, TagStyle, Templatable, TestimonialData, TestimonialVariant, TextFormFieldType, ThemeConfig, ThemeMode, ThemeVariables, ToggleLabelPosition, ToggleSize, ToolbarButton, ToolbarTab, ToolbarVariant, TooltipPointerPosition, TooltipTheme, TourIndicatorType, TourPlacement, TourStep, TourType, TranscriptLineState, TreeNode, TypographyScaleEntry, TypographyStyleEntry, UploadedFile, Validatable, ValidationError, ValidationState, VerifyChecklistItem, VerifyItemStatus, VideoPlayerError, VideoPlayerLabels, VideoPlayerPreload, VideoPlayerSource, VideoPlayerTimeEvent, VideoPlayerTrack, VirtualTableColumn, VirtualTablePageEvent, VirtualTableProgressConfig };