@pecb-ui/components 1.1.20 → 1.1.24

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
@@ -7,21 +7,32 @@ import { ControlValueAccessor } from '@angular/forms';
7
7
  import * as _pecb_ui_components from '@pecb-ui/components';
8
8
  import { Observable } from 'rxjs';
9
9
 
10
- type ButtonVariant = 'primary' | 'primary-outline' | 'primary-2' | 'primary-2-outline' | 'neutral' | 'neutral-outline' | 'secondary' | 'text' | 'text-muted' | 'text-brand' | 'success' | 'destructive' | 'destructive-outline';
10
+ type ButtonVariant = 'primary' | 'primary-outline' | 'primary-2' | 'primary-2-outline' | 'neutral' | 'neutral-outline' | 'secondary' | 'light-outline' | 'text' | 'text-muted' | 'text-brand' | 'success' | 'destructive' | 'destructive-outline' | 'segment';
11
11
  type ButtonSize = 'sm' | 'md' | 'lg' | 'xl';
12
12
  type ButtonIconStyle = 'none' | 'leading' | 'trailing' | 'icon-only';
13
+ type ButtonShape = 'default' | 'pill';
13
14
  declare class ButtonComponent {
14
15
  private readonly sanitizer;
15
16
  private readonly registry;
16
17
  id: _angular_core.InputSignal<string>;
17
18
  /**
18
- * The visual style variant of the button
19
+ * The visual style variant of the button.
20
+ *
21
+ * `segment` renders a transparent track for segmented/toggle controls; its
22
+ * active state is driven by `ariaPressed` (a light `#ECECEC` fill with ink
23
+ * text), so a segmented control is authored as a row of
24
+ * `<pecb-button variant="segment" [ariaPressed]="isActive">`.
19
25
  */
20
26
  variant: _angular_core.InputSignal<ButtonVariant>;
21
27
  /**
22
28
  * The size of the button
23
29
  */
24
30
  size: _angular_core.InputSignal<ButtonSize>;
31
+ /**
32
+ * Corner shape. `pill` fully rounds the rendered `<button>` while keeping the
33
+ * padding and height that `size` sets — use it for switcher/filter pills.
34
+ */
35
+ shape: _angular_core.InputSignal<ButtonShape>;
25
36
  /**
26
37
  * Icon placement style
27
38
  */
@@ -107,7 +118,7 @@ declare class ButtonComponent {
107
118
  onClick(event: MouseEvent): void;
108
119
  onKeyDown(event: KeyboardEvent): void;
109
120
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonComponent, never>;
110
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "pecb-button", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "iconStyle": { "alias": "iconStyle"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; "isSignal": true; }; "ariaPressed": { "alias": "ariaPressed"; "required": false; "isSignal": true; }; "ariaHasPopup": { "alias": "ariaHasPopup"; "required": false; "isSignal": true; }; "ariaControls": { "alias": "ariaControls"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*"], true, never>;
121
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "pecb-button", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "iconStyle": { "alias": "iconStyle"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; "isSignal": true; }; "ariaPressed": { "alias": "ariaPressed"; "required": false; "isSignal": true; }; "ariaHasPopup": { "alias": "ariaHasPopup"; "required": false; "isSignal": true; }; "ariaControls": { "alias": "ariaControls"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*"], true, never>;
111
122
  }
112
123
 
113
124
  type CardElevation = 'none' | 'sm' | 'md' | 'lg' | 'xl';
@@ -274,7 +285,7 @@ declare class PaginationComponent {
274
285
  }
275
286
 
276
287
  type TableSize = 'sm' | 'md' | 'lg';
277
- type TableVariant = 'default' | 'striped' | 'bordered';
288
+ type TableVariant = 'default' | 'plain' | 'striped' | 'bordered';
278
289
  /**
279
290
  * Defines built-in column types
280
291
  */
@@ -377,7 +388,11 @@ declare class TableComponent {
377
388
  */
378
389
  size: _angular_core.InputSignal<TableSize>;
379
390
  /**
380
- * Visual variant of the table
391
+ * Visual variant of the table.
392
+ * - `default`: divided rows with a subtle zebra tint on even rows
393
+ * - `plain`: divided rows on a flat white surface (no zebra)
394
+ * - `striped`: zebra rows
395
+ * - `bordered`: every cell outlined
381
396
  * @default 'default'
382
397
  */
383
398
  variant: _angular_core.InputSignal<TableVariant>;
@@ -940,6 +955,20 @@ declare class InputComponent implements ControlValueAccessor {
940
955
  * Event emitted when clear button is clicked
941
956
  */
942
957
  cleared: _angular_core.OutputEmitterRef<void>;
958
+ /**
959
+ * Raw keydown from the underlying `<input>`. Use it for key-driven entry
960
+ * (committing a chip on comma/Enter, submitting on Enter, and so on) — the
961
+ * event is emitted un-modified, so the handler decides whether to
962
+ * `preventDefault()`.
963
+ *
964
+ * Named `inputKeydown` rather than `keydown` so it does not shadow the native
965
+ * DOM event on the host element.
966
+ */
967
+ inputKeydown: _angular_core.OutputEmitterRef<KeyboardEvent>;
968
+ /**
969
+ * Raw keyup from the underlying `<input>`. Companion to {@link inputKeydown}.
970
+ */
971
+ inputKeyup: _angular_core.OutputEmitterRef<KeyboardEvent>;
943
972
  value: _angular_core.WritableSignal<string>;
944
973
  isFocused: _angular_core.WritableSignal<boolean>;
945
974
  showPassword: _angular_core.WritableSignal<boolean>;
@@ -952,6 +981,8 @@ declare class InputComponent implements ControlValueAccessor {
952
981
  get computedLeftIcon(): string | undefined;
953
982
  get computedRightIcon(): string | undefined;
954
983
  onInput(event: Event): void;
984
+ onKeyDown(event: KeyboardEvent): void;
985
+ onKeyUp(event: KeyboardEvent): void;
955
986
  onFocus(): void;
956
987
  onBlur(): void;
957
988
  clearValue(event: MouseEvent): void;
@@ -963,7 +994,87 @@ declare class InputComponent implements ControlValueAccessor {
963
994
  registerOnTouched(fn: () => void): void;
964
995
  setDisabledState(isDisabled: boolean): void;
965
996
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputComponent, never>;
966
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputComponent, "pecb-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "showPasswordAriaLabel": { "alias": "showPasswordAriaLabel"; "required": false; "isSignal": true; }; "hidePasswordAriaLabel": { "alias": "hidePasswordAriaLabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "leftIcon": { "alias": "leftIcon"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "showInfoIcon": { "alias": "showInfoIcon"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "valueChange": "valueChange"; "blurred": "blurred"; "focused": "focused"; "cleared": "cleared"; }, never, never, true, never>;
997
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputComponent, "pecb-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "clearAriaLabel": { "alias": "clearAriaLabel"; "required": false; "isSignal": true; }; "showPasswordAriaLabel": { "alias": "showPasswordAriaLabel"; "required": false; "isSignal": true; }; "hidePasswordAriaLabel": { "alias": "hidePasswordAriaLabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "leftIcon": { "alias": "leftIcon"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "showInfoIcon": { "alias": "showInfoIcon"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "valueChange": "valueChange"; "blurred": "blurred"; "focused": "focused"; "cleared": "cleared"; "inputKeydown": "inputKeydown"; "inputKeyup": "inputKeyup"; }, never, never, true, never>;
998
+ }
999
+
1000
+ /**
1001
+ * A bordered, floating-label multiline field — the `pecb-input` look with a
1002
+ * `<textarea>` behind it. Supports optional auto-resize and a character
1003
+ * counter, and works with reactive forms via `ControlValueAccessor`.
1004
+ *
1005
+ * @example
1006
+ * ```html
1007
+ * <pecb-textarea
1008
+ * label="Description"
1009
+ * [rows]="5"
1010
+ * [maxLength]="500"
1011
+ * autoResize
1012
+ * formControlName="description"
1013
+ * ></pecb-textarea>
1014
+ * ```
1015
+ *
1016
+ * @publicApi
1017
+ */
1018
+ declare class TextareaComponent implements ControlValueAccessor {
1019
+ private readonly textareaEl;
1020
+ /** Unique ID for the textarea element */
1021
+ id: _angular_core.InputSignal<string>;
1022
+ /** Floating label text */
1023
+ label: _angular_core.InputSignal<string | undefined>;
1024
+ /** Placeholder text (shown when the label is absent or floated) */
1025
+ placeholder: _angular_core.InputSignal<string>;
1026
+ /** Visible rows — the field's resting height */
1027
+ rows: _angular_core.InputSignal<number>;
1028
+ /**
1029
+ * Grow the field to fit its content instead of scrolling. The `rows` value
1030
+ * still sets the starting height.
1031
+ */
1032
+ autoResize: _angular_core.InputSignalWithTransform<boolean, unknown>;
1033
+ /**
1034
+ * Hard character limit. When set, a `used / limit` counter is shown beneath
1035
+ * the field.
1036
+ */
1037
+ maxLength: _angular_core.InputSignal<number | undefined>;
1038
+ /** Width of the wrapper — any valid CSS value. Defaults to 100%. */
1039
+ width: _angular_core.InputSignal<string | undefined>;
1040
+ /** Whether the field is required */
1041
+ required: _angular_core.InputSignalWithTransform<boolean, unknown>;
1042
+ /** Whether the field is read-only */
1043
+ readonly: _angular_core.InputSignalWithTransform<boolean, unknown>;
1044
+ /** Whether the field is disabled */
1045
+ disabled: _angular_core.ModelSignal<boolean>;
1046
+ /** Whether to show the error state */
1047
+ error: _angular_core.InputSignalWithTransform<boolean, unknown>;
1048
+ /** Error message shown beneath the field when `error` is set */
1049
+ errorMessage: _angular_core.InputSignal<string | undefined>;
1050
+ /** Helper text shown beneath the field */
1051
+ helperText: _angular_core.InputSignal<string | undefined>;
1052
+ /** Emitted whenever the value changes */
1053
+ valueChange: _angular_core.OutputEmitterRef<string>;
1054
+ /** Emitted on blur */
1055
+ blurred: _angular_core.OutputEmitterRef<void>;
1056
+ /** Emitted on focus */
1057
+ focused: _angular_core.OutputEmitterRef<void>;
1058
+ value: _angular_core.WritableSignal<string>;
1059
+ isFocused: _angular_core.WritableSignal<boolean>;
1060
+ private onChange;
1061
+ private onTouched;
1062
+ constructor();
1063
+ get wrapperClasses(): string[];
1064
+ /** The counter is only meaningful once a limit exists. */
1065
+ showCharCount: _angular_core.Signal<boolean>;
1066
+ charCount: _angular_core.Signal<number>;
1067
+ hasDescription: _angular_core.Signal<boolean>;
1068
+ onInput(event: Event): void;
1069
+ onFocus(): void;
1070
+ onBlur(): void;
1071
+ focus(): void;
1072
+ writeValue(value: string): void;
1073
+ registerOnChange(fn: (value: string) => void): void;
1074
+ registerOnTouched(fn: () => void): void;
1075
+ setDisabledState(isDisabled: boolean): void;
1076
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
1077
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "pecb-textarea", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "autoResize": { "alias": "autoResize"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "valueChange": "valueChange"; "blurred": "blurred"; "focused": "focused"; }, never, never, true, never>;
967
1078
  }
968
1079
 
969
1080
  type RadioVariant = 'dot' | 'filled';
@@ -1123,10 +1234,19 @@ declare class DropdownComponent implements ControlValueAccessor {
1123
1234
  }
1124
1235
 
1125
1236
  type RightModalSize = 'sm' | 'md' | 'lg';
1237
+ type RightModalPosition = 'right' | 'center';
1126
1238
  declare class RightModalComponent implements OnDestroy {
1127
1239
  id: _angular_core.InputSignal<string>;
1128
1240
  isOpen: _angular_core.ModelSignal<boolean>;
1129
1241
  size: _angular_core.InputSignal<RightModalSize>;
1242
+ /**
1243
+ * Where the panel sits. `right` (default) is the full-height drawer;
1244
+ * `center` is a centered dialog that sizes to its content and rounds all
1245
+ * four corners. `size` still selects the width in both.
1246
+ *
1247
+ * Read when the modal opens — change it while closed, not mid-open.
1248
+ */
1249
+ position: _angular_core.InputSignal<RightModalPosition>;
1130
1250
  closeOnBackdropClick: _angular_core.InputSignal<boolean>;
1131
1251
  closeOnEscape: _angular_core.InputSignal<boolean>;
1132
1252
  showCloseButton: _angular_core.InputSignal<boolean>;
@@ -1152,7 +1272,7 @@ declare class RightModalComponent implements OnDestroy {
1152
1272
  private closeOverlay;
1153
1273
  private destroyOverlay;
1154
1274
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<RightModalComponent, never>;
1155
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<RightModalComponent, "pecb-right-modal", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; "isSignal": true; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; "isSignal": true; }; "closeAriaLabel": { "alias": "closeAriaLabel"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; }, { "isOpen": "isOpenChange"; "closed": "closed"; "opened": "opened"; }, never, ["[pecbRightModalHeader]", "[pecbRightModalContent]", "*", "[pecbRightModalFooter]"], true, never>;
1275
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<RightModalComponent, "pecb-right-modal", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; "isSignal": true; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; "isSignal": true; }; "closeAriaLabel": { "alias": "closeAriaLabel"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; }, { "isOpen": "isOpenChange"; "closed": "closed"; "opened": "opened"; }, never, ["[pecbRightModalHeader]", "[pecbRightModalContent]", "*", "[pecbRightModalFooter]"], true, never>;
1156
1276
  }
1157
1277
  declare class RightModalHeaderDirective {
1158
1278
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<RightModalHeaderDirective, never>;
@@ -2441,7 +2561,7 @@ type MetricsCardVariation = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8';
2441
2561
  type MetricsCardType = 'data+cta' | 'data-only';
2442
2562
  type MetricsCardOrientation = 'left-aligned' | 'center';
2443
2563
  type MetricsCardBadgeStatus = 'success' | 'warning' | 'error' | 'info';
2444
- type MetricsCardSize = 'md' | 'lg';
2564
+ type MetricsCardSize = 'md' | 'lg' | 'xl';
2445
2565
  type MetricsCardIconPosition = 'start' | 'end';
2446
2566
  type MetricsCardIconBg = 'white' | 'gray' | 'pending' | 'success' | 'error' | 'info' | 'purple';
2447
2567
  declare class MetricsCardComponent {
@@ -2519,7 +2639,7 @@ declare class MetricsCardComponent {
2519
2639
  * - `soft`: dot-less pill — tinted background + colored text (uses `status` for the tone)
2520
2640
  * - `ribbon`: colored tag with bottom-right arrow fold
2521
2641
  */
2522
- type BadgeVariant = 'dot' | 'count' | 'status' | 'soft' | 'ribbon';
2642
+ type BadgeVariant = 'dot' | 'count' | 'status' | 'soft' | 'solid' | 'inverse' | 'ribbon';
2523
2643
  /**
2524
2644
  * Count badge size.
2525
2645
  * - `default`: 20px height, 14px font
@@ -2529,7 +2649,7 @@ type BadgeSize = 'default' | 'small';
2529
2649
  /**
2530
2650
  * Status badge type — determines the dot color.
2531
2651
  */
2532
- type BadgeStatus = 'success' | 'error' | 'default' | 'processing' | 'warning';
2652
+ type BadgeStatus = 'success' | 'error' | 'default' | 'processing' | 'warning' | 'dark';
2533
2653
  /**
2534
2654
  * Ribbon badge color.
2535
2655
  */
@@ -2573,6 +2693,13 @@ declare class BadgeComponent {
2573
2693
  label: _angular_core.InputSignal<string>;
2574
2694
  /** Whether to show the label text (for variant='status') */
2575
2695
  showLabel: _angular_core.InputSignal<boolean>;
2696
+ /**
2697
+ * Optional hint for the dot-less pills (variant='soft' | 'solid' | 'inverse'):
2698
+ * renders a small info glyph inside the pill that shows this text in a tooltip.
2699
+ */
2700
+ hint: _angular_core.InputSignal<string>;
2701
+ /** Aria-label of the hint glyph (variant='soft' | 'solid' | 'inverse'); defaults to the hint text. */
2702
+ hintAriaLabel: _angular_core.InputSignal<string>;
2576
2703
  /** Ribbon color (for variant='ribbon') */
2577
2704
  ribbonColor: _angular_core.InputSignal<RibbonColor>;
2578
2705
  /** Ribbon/badge text (for variant='ribbon') */
@@ -2586,16 +2713,20 @@ declare class BadgeComponent {
2586
2713
  /** Status label — uses explicit label or falls back to status name */
2587
2714
  statusLabel: _angular_core.Signal<string>;
2588
2715
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<BadgeComponent, never>;
2589
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<BadgeComponent, "pecb-badge", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "maxCount": { "alias": "maxCount"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "ribbonColor": { "alias": "ribbonColor"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "notificationAriaLabel": { "alias": "notificationAriaLabel"; "required": false; "isSignal": true; }; "notificationsLabel": { "alias": "notificationsLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
2716
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<BadgeComponent, "pecb-badge", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "maxCount": { "alias": "maxCount"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "hintAriaLabel": { "alias": "hintAriaLabel"; "required": false; "isSignal": true; }; "ribbonColor": { "alias": "ribbonColor"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "notificationAriaLabel": { "alias": "notificationAriaLabel"; "required": false; "isSignal": true; }; "notificationsLabel": { "alias": "notificationsLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
2590
2717
  }
2591
2718
 
2592
2719
  /** Status pill colour. */
2593
- type CredentialCardTone = 'success' | 'warning' | 'error' | 'neutral';
2720
+ type CredentialCardTone = 'success' | 'warning' | 'error' | 'info' | 'neutral';
2594
2721
  /** Label/value row in the body (e.g. Issued / Expires). */
2595
2722
  interface CredentialCardMetaRow {
2596
2723
  label: string;
2597
2724
  value: string;
2725
+ /** When set the value renders as a text button and (metaAction) emits this id on click. */
2726
+ actionId?: string;
2598
2727
  }
2728
+ /** Head tile style: tone-tinted glyph tile, or a plain (self-coloured) 44px artwork. */
2729
+ type CredentialCardIconVariant = 'tinted' | 'plain';
2599
2730
  /** Progress line: label + counter over a bar with a "+" action (e.g. earned credits, paid fees). */
2600
2731
  interface CredentialCardProgress {
2601
2732
  /** Echoed back on (progressAction) */
@@ -2642,6 +2773,14 @@ declare class CredentialCardComponent {
2642
2773
  /** Raw SVG for the emblem tile; a rosette glyph is used when empty */
2643
2774
  icon: _angular_core.InputSignal<string>;
2644
2775
  /** Status pill text; pill hidden when empty */
2776
+ /** Muted line under the title (e.g. an id · duration) */
2777
+ subtitle: _angular_core.InputSignal<string>;
2778
+ /** Small label beside the head tile (e.g. the record type) */
2779
+ iconLabel: _angular_core.InputSignal<string>;
2780
+ /** `tinted` = tone-tinted tile around a stroke glyph; `plain` = the icon SVG is shown as-is (44px artwork) */
2781
+ iconVariant: _angular_core.InputSignal<CredentialCardIconVariant>;
2782
+ /** Footer button text size: `sm` 12px (default), `md` 14px */
2783
+ actionsSize: _angular_core.InputSignal<"sm" | "md">;
2645
2784
  statusLabel: _angular_core.InputSignal<string>;
2646
2785
  /** Label/value rows (Issued, Expires, ...) — label left, value right */
2647
2786
  metaRows: _angular_core.InputSignal<CredentialCardMetaRow[]>;
@@ -2663,6 +2802,8 @@ declare class CredentialCardComponent {
2663
2802
  progressAction: _angular_core.OutputEmitterRef<string>;
2664
2803
  /** A footer action clicked — emits the action id */
2665
2804
  actionClick: _angular_core.OutputEmitterRef<string>;
2805
+ /** Emits the row's actionId when a clickable meta value is pressed */
2806
+ metaAction: _angular_core.OutputEmitterRef<string>;
2666
2807
  /** The centered link clicked */
2667
2808
  linkClick: _angular_core.OutputEmitterRef<void>;
2668
2809
  readonly plusIcon: _angular_platform_browser.SafeHtml;
@@ -2674,7 +2815,7 @@ declare class CredentialCardComponent {
2674
2815
  actionClass(action: CredentialCardAction): string;
2675
2816
  safeSvg(svg: string | undefined): _angular_platform_browser.SafeHtml | null;
2676
2817
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<CredentialCardComponent, never>;
2677
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<CredentialCardComponent, "pecb-credential-card", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "statusLabel": { "alias": "statusLabel"; "required": false; "isSignal": true; }; "metaRows": { "alias": "metaRows"; "required": false; "isSignal": true; }; "progressRows": { "alias": "progressRows"; "required": false; "isSignal": true; }; "noticeText": { "alias": "noticeText"; "required": false; "isSignal": true; }; "noticeTone": { "alias": "noticeTone"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "actionsLayout": { "alias": "actionsLayout"; "required": false; "isSignal": true; }; "linkLabel": { "alias": "linkLabel"; "required": false; "isSignal": true; }; "footnote": { "alias": "footnote"; "required": false; "isSignal": true; }; }, { "progressAction": "progressAction"; "actionClick": "actionClick"; "linkClick": "linkClick"; }, never, never, true, never>;
2818
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<CredentialCardComponent, "pecb-credential-card", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "iconLabel": { "alias": "iconLabel"; "required": false; "isSignal": true; }; "iconVariant": { "alias": "iconVariant"; "required": false; "isSignal": true; }; "actionsSize": { "alias": "actionsSize"; "required": false; "isSignal": true; }; "statusLabel": { "alias": "statusLabel"; "required": false; "isSignal": true; }; "metaRows": { "alias": "metaRows"; "required": false; "isSignal": true; }; "progressRows": { "alias": "progressRows"; "required": false; "isSignal": true; }; "noticeText": { "alias": "noticeText"; "required": false; "isSignal": true; }; "noticeTone": { "alias": "noticeTone"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "actionsLayout": { "alias": "actionsLayout"; "required": false; "isSignal": true; }; "linkLabel": { "alias": "linkLabel"; "required": false; "isSignal": true; }; "footnote": { "alias": "footnote"; "required": false; "isSignal": true; }; }, { "progressAction": "progressAction"; "actionClick": "actionClick"; "metaAction": "metaAction"; "linkClick": "linkClick"; }, never, never, true, never>;
2678
2819
  }
2679
2820
 
2680
2821
  /** Action button rendered under the preview-card description. */
@@ -2882,6 +3023,170 @@ declare class NestedTableComponent {
2882
3023
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<NestedTableComponent, "pecb-nested-table", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "childColumns": { "alias": "childColumns"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "expandAriaLabel": { "alias": "expandAriaLabel"; "required": false; "isSignal": true; }; }, { "rowToggle": "rowToggle"; "childToggle": "childToggle"; }, ["childContent"], never, true, never>;
2883
3024
  }
2884
3025
 
3026
+ type StatusBannerTone = 'success' | 'warning' | 'error' | 'info' | 'neutral';
3027
+ type StatusBannerChipVariant = 'solid' | 'inverse' | 'soft';
3028
+ /** A pill rendered next to the banner title (e.g. a state and a product name). */
3029
+ interface StatusBannerChip {
3030
+ label: string;
3031
+ /** Badge colour; defaults to the banner tone's badge status. */
3032
+ status?: BadgeStatus;
3033
+ /** `solid` (filled) by default; `inverse` = white pill on the tinted surface. */
3034
+ variant?: StatusBannerChipVariant;
3035
+ }
3036
+ /**
3037
+ * Tinted, bordered banner strip: a white icon tile, a bold title with pills,
3038
+ * a one-line description and right-aligned actions (projected).
3039
+ * Used for plan / subscription states, account notices, etc.
3040
+ *
3041
+ * @example
3042
+ * <pecb-status-banner tone="success" [iconSvg]="shield" title="Annual plan"
3043
+ * [chips]="[{label: 'Active'}, {label: 'Product', variant: 'inverse'}]"
3044
+ * description="Renews on 4 Jun 2027.">
3045
+ * <pecb-button bannerActions variant="neutral-outline">Manage</pecb-button>
3046
+ * </pecb-status-banner>
3047
+ */
3048
+ declare class StatusBannerComponent {
3049
+ private readonly sanitizer;
3050
+ /** Colour family of the strip (background tint, border and text). */
3051
+ tone: _angular_core.InputSignal<StatusBannerTone>;
3052
+ /** Inline SVG for the 44px white icon tile (stroke="currentColor" inherits the tone). */
3053
+ iconSvg: _angular_core.InputSignal<string>;
3054
+ title: _angular_core.InputSignal<string>;
3055
+ description: _angular_core.InputSignal<string>;
3056
+ /** Pills shown after the title. */
3057
+ chips: _angular_core.InputSignal<StatusBannerChip[]>;
3058
+ readonly safeIconSvg: _angular_core.Signal<_angular_platform_browser.SafeHtml | null>;
3059
+ /** Badge status matching the tone (used when a chip has none). */
3060
+ readonly toneStatus: _angular_core.Signal<BadgeStatus>;
3061
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StatusBannerComponent, never>;
3062
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StatusBannerComponent, "pecb-status-banner", never, { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "iconSvg": { "alias": "iconSvg"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "chips": { "alias": "chips"; "required": false; "isSignal": true; }; }, {}, never, ["[bannerActions]"], true, never>;
3063
+ }
3064
+
3065
+ /**
3066
+ * Selectable option row: radio · icon tile · title + description · optional trailing chip.
3067
+ * A group of option cards behaves like a radio group — give them the same `name`
3068
+ * and drive `selected` from the consumer's current value.
3069
+ *
3070
+ * @example
3071
+ * <pecb-option-card name="method" [value]="1" [selected]="method === 1" [iconSvg]="card"
3072
+ * title="Card" description="Pay by card" chipLabel="Default" (selectionChange)="method = $event">
3073
+ * </pecb-option-card>
3074
+ */
3075
+ declare class OptionCardComponent {
3076
+ private readonly sanitizer;
3077
+ /** Radio group name shared by sibling cards. */
3078
+ name: _angular_core.InputSignal<string>;
3079
+ /** Value emitted when this card is chosen. */
3080
+ value: _angular_core.InputSignal<unknown>;
3081
+ selected: _angular_core.InputSignal<boolean>;
3082
+ disabled: _angular_core.InputSignal<boolean>;
3083
+ /** Inline SVG for the 42px icon tile (stroke="currentColor"). */
3084
+ iconSvg: _angular_core.InputSignal<string>;
3085
+ title: _angular_core.InputSignal<string>;
3086
+ description: _angular_core.InputSignal<string>;
3087
+ /** Trailing soft chip (e.g. "Default"); hidden when empty. */
3088
+ chipLabel: _angular_core.InputSignal<string>;
3089
+ chipStatus: _angular_core.InputSignal<BadgeStatus>;
3090
+ /** Emits `value` when the card is chosen. */
3091
+ selectionChange: _angular_core.OutputEmitterRef<unknown>;
3092
+ readonly safeIconSvg: _angular_core.Signal<_angular_platform_browser.SafeHtml | null>;
3093
+ choose(): void;
3094
+ onKeydown(event: KeyboardEvent): void;
3095
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<OptionCardComponent, never>;
3096
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<OptionCardComponent, "pecb-option-card", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "iconSvg": { "alias": "iconSvg"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "chipLabel": { "alias": "chipLabel"; "required": false; "isSignal": true; }; "chipStatus": { "alias": "chipStatus"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
3097
+ }
3098
+
3099
+ /** One label-over-value cell of the record grid. */
3100
+ interface RecordCardField {
3101
+ label: string;
3102
+ value: string;
3103
+ }
3104
+ /**
3105
+ * Bordered record card: icon tile · title + subtitle · projected header actions,
3106
+ * a divider, then a label/value grid. `emphasis` outlines the card in ink
3107
+ * (e.g. the default entry of a list).
3108
+ *
3109
+ * @example
3110
+ * <pecb-record-card [iconSvg]="building" title="Company Ltd" subtitle="Company" [emphasis]="true"
3111
+ * [fields]="[{label: 'City', value: 'Prishtina'}, {label: 'Country', value: 'Kosovo'}]">
3112
+ * <pecb-badge recordActions variant="solid" status="dark" label="Default"></pecb-badge>
3113
+ * </pecb-record-card>
3114
+ */
3115
+ declare class RecordCardComponent {
3116
+ private readonly sanitizer;
3117
+ /** Inline SVG for the 38px icon tile. */
3118
+ iconSvg: _angular_core.InputSignal<string>;
3119
+ title: _angular_core.InputSignal<string>;
3120
+ subtitle: _angular_core.InputSignal<string>;
3121
+ /** Ink outline (e.g. the default record). */
3122
+ emphasis: _angular_core.InputSignal<boolean>;
3123
+ fields: _angular_core.InputSignal<RecordCardField[]>;
3124
+ /** Grid columns on desktop (collapses to one column under 768px). */
3125
+ columns: _angular_core.InputSignal<2 | 1 | 3>;
3126
+ /** Placeholder shown for empty values. */
3127
+ emptyValue: _angular_core.InputSignal<string>;
3128
+ readonly safeIconSvg: _angular_core.Signal<_angular_platform_browser.SafeHtml | null>;
3129
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<RecordCardComponent, never>;
3130
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<RecordCardComponent, "pecb-record-card", never, { "iconSvg": { "alias": "iconSvg"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "emphasis": { "alias": "emphasis"; "required": false; "isSignal": true; }; "fields": { "alias": "fields"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "emptyValue": { "alias": "emptyValue"; "required": false; "isSignal": true; }; }, {}, never, ["[recordActions]", "*"], true, never>;
3131
+ }
3132
+
3133
+ /** One "label: value" entry of the card's footer row (e.g. debit / credit). */
3134
+ interface BalanceCardEntry {
3135
+ label: string;
3136
+ value: string;
3137
+ }
3138
+ /**
3139
+ * Currency balance card: a small code chip (e.g. "USD"), a headline row
3140
+ * "label · value" above a divider, then a footer row of label/value entries
3141
+ * spread across the card (debit / credit style).
3142
+ *
3143
+ * All values are pre-formatted strings — the consumer decides the number and
3144
+ * currency formatting.
3145
+ *
3146
+ * @example
3147
+ * <pecb-balance-card code="USD" label="Balance" value="-$26,950.90"
3148
+ * [entries]="[{label: 'Debit', value: '$27,180.85'}, {label: 'Credit', value: '$309.95'}]">
3149
+ * </pecb-balance-card>
3150
+ */
3151
+ declare class BalanceCardComponent {
3152
+ /** Chip text (currency code). Hidden when empty. */
3153
+ code: _angular_core.InputSignal<string>;
3154
+ /** Headline label (left). */
3155
+ label: _angular_core.InputSignal<string>;
3156
+ /** Headline value (right), pre-formatted. */
3157
+ value: _angular_core.InputSignal<string>;
3158
+ /** Footer entries rendered "label: value", spread across the row. */
3159
+ entries: _angular_core.InputSignal<BalanceCardEntry[]>;
3160
+ /** Separator between an entry's label and value. */
3161
+ separator: _angular_core.InputSignal<string>;
3162
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<BalanceCardComponent, never>;
3163
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<BalanceCardComponent, "pecb-balance-card", never, { "code": { "alias": "code"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "entries": { "alias": "entries"; "required": false; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
3164
+ }
3165
+
3166
+ interface SegmentedControlOption {
3167
+ label: string;
3168
+ value: unknown;
3169
+ disabled?: boolean;
3170
+ }
3171
+ type SegmentedControlTone = 'dark' | 'brand';
3172
+ /**
3173
+ * Equal-width segmented toggle (2–4 options, exactly one selected).
3174
+ * `tone="dark"` (default) fills the selected segment in ink, `brand` in the brand red.
3175
+ *
3176
+ * @example
3177
+ * <pecb-segmented-control [options]="[{label: 'Personal', value: 1}, {label: 'Company', value: 2}]" [(value)]="type"></pecb-segmented-control>
3178
+ */
3179
+ declare class SegmentedControlComponent {
3180
+ options: _angular_core.InputSignal<SegmentedControlOption[]>;
3181
+ value: _angular_core.ModelSignal<unknown>;
3182
+ tone: _angular_core.InputSignal<SegmentedControlTone>;
3183
+ disabled: _angular_core.InputSignal<boolean>;
3184
+ ariaLabel: _angular_core.InputSignal<string | undefined>;
3185
+ select(option: SegmentedControlOption): void;
3186
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SegmentedControlComponent, never>;
3187
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SegmentedControlComponent, "pecb-segmented-control", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
3188
+ }
3189
+
2885
3190
  /**
2886
3191
  * Payment plan card — one selectable payment option (e.g. "Pay annually" vs
2887
3192
  * "Pay full cycle"): centered title/description, applied-benefit chips, an
@@ -3177,6 +3482,107 @@ declare class TagSelectComponent implements ControlValueAccessor {
3177
3482
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagSelectComponent, "pecb-tag-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "noResultsText": { "alias": "noResultsText"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
3178
3483
  }
3179
3484
 
3485
+ /** Keys that commit the pending text as a chip, by default. */
3486
+ declare const DEFAULT_TAG_INPUT_SEPARATORS: string[];
3487
+ /**
3488
+ * Free-text chip entry: the user types a value and commits it as a chip with a
3489
+ * separator key (comma, space or Enter by default). Distinct from
3490
+ * `pecb-tag-select`, which picks from a fixed option list.
3491
+ *
3492
+ * The value is a `string[]` and the control works with reactive forms via
3493
+ * `ControlValueAccessor`.
3494
+ *
3495
+ * @example
3496
+ * ```html
3497
+ * <pecb-tag-input
3498
+ * label="Accounting contacts"
3499
+ * placeholder="Type an email and press Enter"
3500
+ * [validator]="isEmail"
3501
+ * formControlName="accountingEmails"
3502
+ * ></pecb-tag-input>
3503
+ * ```
3504
+ *
3505
+ * @publicApi
3506
+ */
3507
+ declare class TagInputComponent implements ControlValueAccessor {
3508
+ private readonly inputEl;
3509
+ /** Unique ID for the text entry element */
3510
+ id: _angular_core.InputSignal<string>;
3511
+ /** Floating label text */
3512
+ label: _angular_core.InputSignal<string | undefined>;
3513
+ /** Placeholder for the free-text entry */
3514
+ placeholder: _angular_core.InputSignal<string>;
3515
+ /**
3516
+ * Keys that commit the pending text as a chip. Values are matched against
3517
+ * `KeyboardEvent.key`, so a space is `' '` and Enter is `'Enter'`.
3518
+ */
3519
+ separatorKeys: _angular_core.InputSignal<string[]>;
3520
+ /**
3521
+ * Optional per-chip validation. A value that fails is not committed; it stays
3522
+ * in the entry field so the user can correct it, and `invalidEntry` fires.
3523
+ */
3524
+ validator: _angular_core.InputSignal<((value: string) => boolean) | undefined>;
3525
+ /** Allow the same value to be added more than once */
3526
+ allowDuplicates: _angular_core.InputSignalWithTransform<boolean, unknown>;
3527
+ /** Cap on the number of chips. Further entries are rejected once reached. */
3528
+ maxTags: _angular_core.InputSignal<number | undefined>;
3529
+ /** Commit any pending text when the field loses focus */
3530
+ addOnBlur: _angular_core.InputSignalWithTransform<boolean, unknown>;
3531
+ /** Width of the wrapper — any valid CSS value. Defaults to 100%. */
3532
+ width: _angular_core.InputSignal<string | undefined>;
3533
+ /** Whether the field is required */
3534
+ required: _angular_core.InputSignalWithTransform<boolean, unknown>;
3535
+ /** Whether the field is disabled */
3536
+ disabled: _angular_core.ModelSignal<boolean>;
3537
+ /** Whether to show the error state */
3538
+ error: _angular_core.InputSignalWithTransform<boolean, unknown>;
3539
+ /** Error message shown beneath the field when `error` is set */
3540
+ errorMessage: _angular_core.InputSignal<string | undefined>;
3541
+ /** Helper text shown beneath the field */
3542
+ helperText: _angular_core.InputSignal<string | undefined>;
3543
+ /** Aria-label for each chip's remove (×) button — override to localize. */
3544
+ removeAriaLabel: _angular_core.InputSignal<string>;
3545
+ /** Emitted with the full chip list whenever it changes */
3546
+ valueChange: _angular_core.OutputEmitterRef<string[]>;
3547
+ /** Emitted with the newly committed chip */
3548
+ tagAdded: _angular_core.OutputEmitterRef<string>;
3549
+ /** Emitted with the chip that was removed */
3550
+ tagRemoved: _angular_core.OutputEmitterRef<string>;
3551
+ /** Emitted with text that was rejected by `validator` or a duplicate/limit rule */
3552
+ invalidEntry: _angular_core.OutputEmitterRef<string>;
3553
+ /** Emitted on blur */
3554
+ blurred: _angular_core.OutputEmitterRef<void>;
3555
+ /** Emitted on focus */
3556
+ focused: _angular_core.OutputEmitterRef<void>;
3557
+ value: _angular_core.WritableSignal<string[]>;
3558
+ draft: _angular_core.WritableSignal<string>;
3559
+ isFocused: _angular_core.WritableSignal<boolean>;
3560
+ private onChange;
3561
+ private onTouched;
3562
+ get wrapperClasses(): string[];
3563
+ hasDescription: _angular_core.Signal<boolean>;
3564
+ /** Once the cap is hit the entry field stops accepting new chips. */
3565
+ isFull: _angular_core.Signal<boolean>;
3566
+ onKeyDown(event: KeyboardEvent): void;
3567
+ onInput(event: Event): void;
3568
+ onFocus(): void;
3569
+ onBlur(): void;
3570
+ removeAt(index: number): void;
3571
+ focus(): void;
3572
+ /**
3573
+ * Commit the pending text. Rejected text is deliberately left in the entry
3574
+ * field so the user can fix it rather than losing what they typed.
3575
+ */
3576
+ private commitDraft;
3577
+ private setValue;
3578
+ writeValue(value: string[] | null): void;
3579
+ registerOnChange(fn: (value: string[]) => void): void;
3580
+ registerOnTouched(fn: () => void): void;
3581
+ setDisabledState(isDisabled: boolean): void;
3582
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagInputComponent, never>;
3583
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagInputComponent, "pecb-tag-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "separatorKeys": { "alias": "separatorKeys"; "required": false; "isSignal": true; }; "validator": { "alias": "validator"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "maxTags": { "alias": "maxTags"; "required": false; "isSignal": true; }; "addOnBlur": { "alias": "addOnBlur"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "valueChange": "valueChange"; "tagAdded": "tagAdded"; "tagRemoved": "tagRemoved"; "invalidEntry": "invalidEntry"; "blurred": "blurred"; "focused": "focused"; }, never, never, true, never>;
3584
+ }
3585
+
3180
3586
  /**
3181
3587
  * Form section card — a numbered, collapsible container for one repeatable
3182
3588
  * form section (e.g. "Activity 1 of 3"): number badge, title, subtitle,
@@ -3933,6 +4339,13 @@ declare class AdminHeaderComponent {
3933
4339
  addActionAriaLabel: _angular_core.InputSignal<string>;
3934
4340
  /** Profile configuration. When omitted, no profile row renders. */
3935
4341
  profile: _angular_core.InputSignal<AdminHeaderProfile | undefined>;
4342
+ /**
4343
+ * Show a camera (edit photo) badge on the profile avatar, mirroring
4344
+ * `pecb-profile [badge="camera"]`. Clicking it emits `profilePhotoEdit`.
4345
+ */
4346
+ profilePhotoEditable: _angular_core.InputSignal<boolean>;
4347
+ /** Aria-label for the avatar's camera button. Override to localize. */
4348
+ editPhotoAriaLabel: _angular_core.InputSignal<string>;
3936
4349
  /** Action chips/buttons displayed to the right of the profile */
3937
4350
  actions: _angular_core.InputSignal<AdminHeaderAction[]>;
3938
4351
  /** Metadata items displayed to the right of the profile (alternative to actions) */
@@ -3943,6 +4356,8 @@ declare class AdminHeaderComponent {
3943
4356
  columns: _angular_core.InputSignal<2 | 1 | 3 | 4>;
3944
4357
  /** Emits when the top-right action button is clicked */
3945
4358
  headerActionClicked: _angular_core.OutputEmitterRef<void>;
4359
+ /** Emits when the avatar's camera (edit photo) badge is clicked */
4360
+ profilePhotoEdit: _angular_core.OutputEmitterRef<void>;
3946
4361
  /** Emits the action id/index when an action chip is clicked */
3947
4362
  actionClicked: _angular_core.OutputEmitterRef<{
3948
4363
  action: AdminHeaderAction;
@@ -4008,7 +4423,7 @@ declare class AdminHeaderComponent {
4008
4423
  onDropdownChange(field: AdminHeaderField, event: Event): void;
4009
4424
  onFieldOptionChange(field: AdminHeaderField, value: 'yes' | 'no'): void;
4010
4425
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<AdminHeaderComponent, never>;
4011
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<AdminHeaderComponent, "pecb-admin-header", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "backgroundUrl": { "alias": "backgroundUrl"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "headerActionIcon": { "alias": "headerActionIcon"; "required": false; "isSignal": true; }; "headerActionLabel": { "alias": "headerActionLabel"; "required": false; "isSignal": true; }; "yesLabel": { "alias": "yesLabel"; "required": false; "isSignal": true; }; "noLabel": { "alias": "noLabel"; "required": false; "isSignal": true; }; "addActionAriaLabel": { "alias": "addActionAriaLabel"; "required": false; "isSignal": true; }; "profile": { "alias": "profile"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "metadata": { "alias": "metadata"; "required": false; "isSignal": true; }; "fields": { "alias": "fields"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; }, { "headerActionClicked": "headerActionClicked"; "actionClicked": "actionClicked"; "actionRemoved": "actionRemoved"; "linkClicked": "linkClicked"; "dropdownChanged": "dropdownChanged"; "fieldOptionChanged": "fieldOptionChanged"; }, ["fieldTemplates"], never, true, never>;
4426
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<AdminHeaderComponent, "pecb-admin-header", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "backgroundUrl": { "alias": "backgroundUrl"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "headerActionIcon": { "alias": "headerActionIcon"; "required": false; "isSignal": true; }; "headerActionLabel": { "alias": "headerActionLabel"; "required": false; "isSignal": true; }; "yesLabel": { "alias": "yesLabel"; "required": false; "isSignal": true; }; "noLabel": { "alias": "noLabel"; "required": false; "isSignal": true; }; "addActionAriaLabel": { "alias": "addActionAriaLabel"; "required": false; "isSignal": true; }; "profile": { "alias": "profile"; "required": false; "isSignal": true; }; "profilePhotoEditable": { "alias": "profilePhotoEditable"; "required": false; "isSignal": true; }; "editPhotoAriaLabel": { "alias": "editPhotoAriaLabel"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "metadata": { "alias": "metadata"; "required": false; "isSignal": true; }; "fields": { "alias": "fields"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; }, { "headerActionClicked": "headerActionClicked"; "profilePhotoEdit": "profilePhotoEdit"; "actionClicked": "actionClicked"; "actionRemoved": "actionRemoved"; "linkClicked": "linkClicked"; "dropdownChanged": "dropdownChanged"; "fieldOptionChanged": "fieldOptionChanged"; }, ["fieldTemplates"], never, true, never>;
4012
4427
  }
4013
4428
 
4014
4429
  type SocialIconStyle = 'brand' | 'original' | 'white' | 'dark';
@@ -7037,6 +7452,8 @@ declare const PECB_CUSTOM_ICONS: Record<string, string>;
7037
7452
  * | xl | 24px |
7038
7453
  * | 2xl | 32px |
7039
7454
  */
7455
+ /** Track packing for `columns="auto"`. */
7456
+ type GridAutoFlow = 'fit' | 'fill';
7040
7457
  type GridGap = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
7041
7458
  /**
7042
7459
  * Predefined padding sizes mapped to the PECB spacing tokens.
@@ -7094,6 +7511,14 @@ declare class GridComponent {
7094
7511
  * Accepts any CSS length value. Defaults to '200px'.
7095
7512
  */
7096
7513
  minChildWidth: _angular_core.InputSignal<string>;
7514
+ /**
7515
+ * How `columns="auto"` packs tracks (CSS `auto-fit` vs `auto-fill`):
7516
+ * - `fit` (default): empty tracks collapse, so a short last row stretches its items
7517
+ * - `fill`: tracks stay reserved, so items keep their column width — a lone card stays
7518
+ * one column wide instead of spanning the row (card grids whose column count must
7519
+ * follow the container's own width, e.g. next to a sidebar)
7520
+ */
7521
+ autoFlow: _angular_core.InputSignal<GridAutoFlow>;
7097
7522
  /** Gap between all grid items (row and column). Overridden by rowGap / columnGap. */
7098
7523
  gap: _angular_core.InputSignal<GridGap>;
7099
7524
  /** Row gap — overrides `gap` for the vertical axis */
@@ -7117,7 +7542,7 @@ declare class GridComponent {
7117
7542
  '--pecb-grid-min-child-width'?: undefined;
7118
7543
  }>;
7119
7544
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<GridComponent, never>;
7120
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridComponent, "pecb-grid", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "minChildWidth": { "alias": "minChildWidth"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "rowGap": { "alias": "rowGap"; "required": false; "isSignal": true; }; "columnGap": { "alias": "columnGap"; "required": false; "isSignal": true; }; "padding": { "alias": "padding"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "verticalAlign": { "alias": "verticalAlign"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
7545
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridComponent, "pecb-grid", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "minChildWidth": { "alias": "minChildWidth"; "required": false; "isSignal": true; }; "autoFlow": { "alias": "autoFlow"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "rowGap": { "alias": "rowGap"; "required": false; "isSignal": true; }; "columnGap": { "alias": "columnGap"; "required": false; "isSignal": true; }; "padding": { "alias": "padding"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "verticalAlign": { "alias": "verticalAlign"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
7121
7546
  }
7122
7547
  declare class GridItemComponent {
7123
7548
  /** Number of columns this item should span */
@@ -7146,6 +7571,45 @@ declare class SpacerComponent {
7146
7571
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpacerComponent, "pecb-spacer", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
7147
7572
  }
7148
7573
 
7574
+ /**
7575
+ * A read-only label/value row — the primitive that read (non-edit) views are
7576
+ * built from. Renders a muted 12px label above a 14px value.
7577
+ *
7578
+ * Pass simple text through `value`; for richer values (links, tags, badges)
7579
+ * leave `value` unset and project the content instead.
7580
+ *
7581
+ * @example
7582
+ * ```html
7583
+ * <pecb-grid [columns]="3">
7584
+ * <pecb-field label="Full name" value="Jane Doe"></pecb-field>
7585
+ * <pecb-field label="Status">
7586
+ * <pecb-status type="success" label="Active"></pecb-status>
7587
+ * </pecb-field>
7588
+ * <pecb-field label="Bio" fullWidth>Long-form text…</pecb-field>
7589
+ * </pecb-grid>
7590
+ * ```
7591
+ *
7592
+ * @publicApi
7593
+ */
7594
+ declare class FieldComponent {
7595
+ id: _angular_core.InputSignal<string>;
7596
+ /** The muted caption shown above the value */
7597
+ label: _angular_core.InputSignal<string | undefined>;
7598
+ /**
7599
+ * The value text. Leave unset and project content instead when the value is
7600
+ * richer than a string.
7601
+ */
7602
+ value: _angular_core.InputSignal<string | undefined>;
7603
+ /**
7604
+ * Span every column of the surrounding grid. Applies when the field is a
7605
+ * direct child of a CSS grid (e.g. `pecb-grid`); inside a `pecb-grid-item`,
7606
+ * use that component's `span="full"` instead.
7607
+ */
7608
+ fullWidth: _angular_core.InputSignalWithTransform<boolean, unknown>;
7609
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<FieldComponent, never>;
7610
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<FieldComponent, "pecb-field", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
7611
+ }
7612
+
7149
7613
  type DashboardGridLayout = '1' | '2' | '3' | '4' | 'sidebar-1col' | 'sidebar-2col' | 'sidebar-3col' | 'sidebar-4col' | 'custom';
7150
7614
  type DashboardGridGap = 'none' | 'sm' | 'md' | 'lg';
7151
7615
  declare class DashboardGridComponent {
@@ -7801,6 +8265,7 @@ type SearchMode = 'none' | 'simple' | 'advanced';
7801
8265
  * ```
7802
8266
  */
7803
8267
  declare class GeneralComponent {
8268
+ private readonly sanitizer;
7804
8269
  /** Unique element ID */
7805
8270
  id: _angular_core.InputSignal<string>;
7806
8271
  /** Whether the toolbar has action buttons */
@@ -7837,6 +8302,9 @@ declare class GeneralComponent {
7837
8302
  ariaLabel: _angular_core.InputSignal<string>;
7838
8303
  /** Accessible label for the advanced search toggle button. */
7839
8304
  advancedSearchToggleAriaLabel: _angular_core.InputSignal<string>;
8305
+ /** Optional inline SVG replacing the default sliders glyph of the advanced search toggle. */
8306
+ advancedSearchToggleIcon: _angular_core.InputSignal<string>;
8307
+ readonly safeAdvancedSearchToggleIcon: _angular_core.Signal<_angular_platform_browser.SafeHtml | null>;
7840
8308
  /** Whether a search bar is present */
7841
8309
  hasSearch: _angular_core.Signal<boolean>;
7842
8310
  /** Whether any button (projected or built-in) is visible */
@@ -7857,7 +8325,7 @@ declare class GeneralComponent {
7857
8325
  layoutMode: _angular_core.Signal<"flat" | "banner">;
7858
8326
  onAdvancedSearchToggle(): void;
7859
8327
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<GeneralComponent, never>;
7860
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<GeneralComponent, "pecb-general", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "hasButtons": { "alias": "hasButtons"; "required": false; "isSignal": true; }; "showPrimaryBtn": { "alias": "showPrimaryBtn"; "required": false; "isSignal": true; }; "showSecondaryBtn": { "alias": "showSecondaryBtn"; "required": false; "isSignal": true; }; "showSecondaryBtn2": { "alias": "showSecondaryBtn2"; "required": false; "isSignal": true; }; "hasTabs": { "alias": "hasTabs"; "required": false; "isSignal": true; }; "hasBanner": { "alias": "hasBanner"; "required": false; "isSignal": true; }; "profileImage": { "alias": "profileImage"; "required": false; "isSignal": true; }; "profileName": { "alias": "profileName"; "required": false; "isSignal": true; }; "profileEmail": { "alias": "profileEmail"; "required": false; "isSignal": true; }; "profileId": { "alias": "profileId"; "required": false; "isSignal": true; }; "profileRoles": { "alias": "profileRoles"; "required": false; "isSignal": true; }; "hasBackButton": { "alias": "hasBackButton"; "required": false; "isSignal": true; }; "searchMode": { "alias": "searchMode"; "required": false; "isSignal": true; }; "advancedSearchOpen": { "alias": "advancedSearchOpen"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "advancedSearchToggleAriaLabel": { "alias": "advancedSearchToggleAriaLabel"; "required": false; "isSignal": true; }; }, { "advancedSearchToggle": "advancedSearchToggle"; }, never, ["[toolbarBackButton]", "[toolbarButtons]", "[toolbarPrimaryBtn]", "[toolbarSecondaryBtn]", "[toolbarSecondaryBtn2]", "[toolbarBanner]", "[toolbarTabs]", "[toolbarSearch]", "[toolbarAdvancedSearch]"], true, never>;
8328
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<GeneralComponent, "pecb-general", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "hasButtons": { "alias": "hasButtons"; "required": false; "isSignal": true; }; "showPrimaryBtn": { "alias": "showPrimaryBtn"; "required": false; "isSignal": true; }; "showSecondaryBtn": { "alias": "showSecondaryBtn"; "required": false; "isSignal": true; }; "showSecondaryBtn2": { "alias": "showSecondaryBtn2"; "required": false; "isSignal": true; }; "hasTabs": { "alias": "hasTabs"; "required": false; "isSignal": true; }; "hasBanner": { "alias": "hasBanner"; "required": false; "isSignal": true; }; "profileImage": { "alias": "profileImage"; "required": false; "isSignal": true; }; "profileName": { "alias": "profileName"; "required": false; "isSignal": true; }; "profileEmail": { "alias": "profileEmail"; "required": false; "isSignal": true; }; "profileId": { "alias": "profileId"; "required": false; "isSignal": true; }; "profileRoles": { "alias": "profileRoles"; "required": false; "isSignal": true; }; "hasBackButton": { "alias": "hasBackButton"; "required": false; "isSignal": true; }; "searchMode": { "alias": "searchMode"; "required": false; "isSignal": true; }; "advancedSearchOpen": { "alias": "advancedSearchOpen"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "advancedSearchToggleAriaLabel": { "alias": "advancedSearchToggleAriaLabel"; "required": false; "isSignal": true; }; "advancedSearchToggleIcon": { "alias": "advancedSearchToggleIcon"; "required": false; "isSignal": true; }; }, { "advancedSearchToggle": "advancedSearchToggle"; }, never, ["[toolbarBackButton]", "[toolbarButtons]", "[toolbarPrimaryBtn]", "[toolbarSecondaryBtn]", "[toolbarSecondaryBtn2]", "[toolbarBanner]", "[toolbarTabs]", "[toolbarSearch]", "[toolbarAdvancedSearch]"], true, never>;
7861
8329
  }
7862
8330
 
7863
8331
  type ContentStyle = 'card' | 'transparent' | 'white';
@@ -8586,17 +9054,31 @@ declare class TestimonialComponent {
8586
9054
 
8587
9055
  type TagStyle = 'light' | 'dark';
8588
9056
  type TagAction = 'none' | 'close' | 'plus';
9057
+ type TagAppearance = 'tag' | 'chip';
8589
9058
  declare class TagComponent {
8590
9059
  id: _angular_core.InputSignal<string>;
8591
9060
  label: _angular_core.InputSignal<string>;
8592
9061
  tagStyle: _angular_core.InputSignal<TagStyle>;
8593
9062
  action: _angular_core.InputSignal<TagAction>;
9063
+ /**
9064
+ * Rendering style. `tag` is the original chip-with-affordance look; `chip` is
9065
+ * the display-only variant from the design system (`#ECECEC` / `#313131` on a
9066
+ * 6px radius for `light`, inverted for `dark`).
9067
+ *
9068
+ * `chip` is non-interactive by definition, so it suppresses `action` — use
9069
+ * the default `tag` appearance when you need the close or plus affordance.
9070
+ */
9071
+ appearance: _angular_core.InputSignal<TagAppearance>;
8594
9072
  /** Aria-label for the close (×) action — override to localize (audit F20). */
8595
9073
  removeAriaLabel: _angular_core.InputSignal<string>;
8596
9074
  tagClose: _angular_core.OutputEmitterRef<void>;
9075
+ /** Chips render no affordance regardless of `action`. */
9076
+ private readonly interactive;
9077
+ showPlus: _angular_core.Signal<boolean>;
9078
+ showClose: _angular_core.Signal<boolean>;
8597
9079
  tagClasses: _angular_core.Signal<string[]>;
8598
9080
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagComponent, never>;
8599
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagComponent, "pecb-tag", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "tagStyle": { "alias": "tagStyle"; "required": false; "isSignal": true; }; "action": { "alias": "action"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; }, { "tagClose": "tagClose"; }, never, never, true, never>;
9081
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagComponent, "pecb-tag", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "tagStyle": { "alias": "tagStyle"; "required": false; "isSignal": true; }; "action": { "alias": "action"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "removeAriaLabel": { "alias": "removeAriaLabel"; "required": false; "isSignal": true; }; }, { "tagClose": "tagClose"; }, never, never, true, never>;
8600
9082
  }
8601
9083
 
8602
9084
  type LinkButtonType = 'go-back' | 'view-details' | 'read-more' | 'show-credential';
@@ -8880,19 +9362,39 @@ declare class CancelUpdateButtonsComponent {
8880
9362
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<CancelUpdateButtonsComponent, "pecb-cancel-update-buttons", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "cancelLabel": { "alias": "cancelLabel"; "required": false; "isSignal": true; }; "updateLabel": { "alias": "updateLabel"; "required": false; "isSignal": true; }; }, { "cancelClick": "cancelClick"; "updateClick": "updateClick"; }, never, never, true, never>;
8881
9363
  }
8882
9364
 
8883
- type InformationBoxVariant = 'default' | 'developer';
9365
+ type InformationBoxVariant = 'default' | 'developer' | 'neutral';
8884
9366
  declare class InformationBoxComponent {
9367
+ private readonly sanitizer;
9368
+ private readonly registry;
8885
9369
  id: _angular_core.InputSignal<string>;
9370
+ /**
9371
+ * Visual style. `neutral` is the muted legend bar — `#FAFAFA` background,
9372
+ * `#ECECEC` border, `#616161` icon and text on an 8px radius — and lays the
9373
+ * icon and text out on a single row.
9374
+ */
8886
9375
  variant: _angular_core.InputSignal<InformationBoxVariant>;
8887
9376
  text: _angular_core.InputSignal<string>;
8888
9377
  title: _angular_core.InputSignal<string>;
9378
+ /**
9379
+ * Optional leading icon: a registered {@link IconRegistry} name or a raw
9380
+ * inline SVG string (anything starting with `<`). `variant="neutral"` shows
9381
+ * a default info glyph when this is unset; the other variants show no icon
9382
+ * unless one is given here.
9383
+ */
9384
+ icon: _angular_core.InputSignal<string | undefined>;
8889
9385
  boxClasses: _angular_core.Signal<{
8890
9386
  'pecb-info-box': boolean;
8891
9387
  'pecb-info-box--default': boolean;
8892
9388
  'pecb-info-box--developer': boolean;
9389
+ 'pecb-info-box--neutral': boolean;
8893
9390
  }>;
9391
+ /** The icon name/SVG actually rendered, falling back to the neutral default. */
9392
+ private readonly effectiveIcon;
9393
+ private readonly resolvedIconSvg;
9394
+ showIcon: _angular_core.Signal<boolean>;
9395
+ safeIconHtml: _angular_core.Signal<SafeHtml>;
8894
9396
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<InformationBoxComponent, never>;
8895
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<InformationBoxComponent, "pecb-information-box", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
9397
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<InformationBoxComponent, "pecb-information-box", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
8896
9398
  }
8897
9399
 
8898
9400
  declare class RequestSentByComponent {
@@ -9901,5 +10403,5 @@ declare class CourseCardComponent {
9901
10403
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<CourseCardComponent, "pecb-course-card", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconSrc": { "alias": "iconSrc"; "required": false; "isSignal": true; }; "iconSvg": { "alias": "iconSvg"; "required": false; "isSignal": true; }; "iconLabel": { "alias": "iconLabel"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "statusLabel": { "alias": "statusLabel"; "required": false; "isSignal": true; }; "statusTone": { "alias": "statusTone"; "required": false; "isSignal": true; }; "metaRows": { "alias": "metaRows"; "required": false; "isSignal": true; }; "progress": { "alias": "progress"; "required": false; "isSignal": true; }; "noteText": { "alias": "noteText"; "required": false; "isSignal": true; }; "noteTone": { "alias": "noteTone"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "actionsLayout": { "alias": "actionsLayout"; "required": false; "isSignal": true; }; "dimmed": { "alias": "dimmed"; "required": false; "isSignal": true; }; }, { "actionClick": "actionClick"; }, never, ["*"], true, never>;
9902
10404
  }
9903
10405
 
9904
- export { APP_HEADER_TRANSLATIONS, APP_SHELL_LOCALES, APP_SIDEBAR_MENU_ICONS, APP_SIDEBAR_MENU_TRANSLATIONS, APP_SIDEBAR_TRANSLATIONS, AccordionItemComponent, AccordionSmallComponent, ActionItemComponent, 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, CourseCardComponent, CourseContentPanelComponent, CoursePlayerComponent, CourseTileComponent, CredentialCardComponent, 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_SLIDE_VIEWER_KEY_MAP, DEFAULT_SLIDE_VIEWER_LABELS, DEFAULT_SLIDE_VIEWER_TOOLS, DEFAULT_SLIDE_VIEWER_ZOOM_STEPS, DEFAULT_VIDEO_PLAYER_LABELS, DEFAULT_VIDEO_PLAYER_RATES, DashboardGridComponent, DatepickerComponent, DividerComponent, DropdownComponent, EMPTY_STATE_MAX_BUTTONS, EditButtonComponent, EditCoverPhotoComponent, EmptyStateComponent, ExpandableRowTableComponent, FileUploadComponent, FilterColumnsComponent, FloatButtonComponent, FloatButtonItemComponent, FormSectionCardComponent, FullscreenModalComponent, FullscreenModalContentDirective, FullscreenModalFooterDirective, FullscreenModalHeaderDirective, GeneralComponent, GridComponent, GridItemComponent, HeaderActionsComponent, HeaderComponent, HeaderDividerComponent, HeaderLanguageComponent, HeaderSearchComponent, HeaderUserComponent, HierarchicalTableComponent, HorizontalStepsComponent, HubCardComponent, HubCardGridComponent, IconComponent, IconRegistry, IconTagComponent, InformationBoxComponent, InputComponent, LanguageDropdownComponent, LinkButtonComponent, ListItemComponent, LoadingService, MediaComponent, MessageBubbleComponent, MessageItemComponent, MetricsCardComponent, MiniIconButtonComponent, NestedTableComponent, NoResultsComponent, NoteSidebarItemComponent, NotesPanelComponent, NotificationService, NotificationStatusLinkComponent, OutlinedFieldComponent, PECB_COLOR_PALETTE, PECB_CUSTOM_ICONS, PECB_FONT_STYLES, PECB_ICONS, PECB_TYPE_SCALE, PaginationComponent, PaymentPlanCardComponent, PaymentScheduleCardComponent, PaymentSummaryComponent, PeriodPaymentModalComponent, PreviewCardComponent, PriceMethodComponent, ProfileComponent, ProfileElementsCardComponent, ProfileGroupComponent, ProgressArcComponent, ProgressBarComponent, ProgressCircleComponent, ProjectLayoutComponent, QuantitySelectorComponent, QuestionTypeTagComponent, RadioComponent, RadioDisplayComponent, RatingNumberComponent, ReasonForReturnComponent, RequestSentByComponent, RequestStatusBarComponent, ResultPageComponent, RightModalComponent, RightModalContentDirective, RightModalFooterDirective, RightModalHeaderDirective, ShadowDirective, SidebarComponent, SkeletonComponent, SlidePointsComponent, SlideViewerComponent, SlideViewerDayDirective, SlideViewerThumbnailDirective, SpacerComponent, SpinnerComponent, StandardsPdfCardComponent, StatisticsCardComponent, StatusComponent, StepperComponent, TabComponent, TableComponent, TagComponent, TagSelectComponent, TestimonialComponent, TextFormFieldComponent, ThemeService, TimelineComponent, ToggleComponent, ToolbarBarComponent, TooltipComponent, TooltipDirective, TourComponent, TranscriptLineComponent, TypographyComponent, UserWithEmailComponent, VerifyChecklistComponent, VideoPlayerComponent, VideoUploadBarComponent, VirtualTableComponent, addClass, announceToScreenReader, appHeaderLabels, appSidebarLabels, appSidebarMenu, appSidebarRoles, capitalize, clampSlidePage, 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 };
9905
- export type { AccordionVariant, ActionItemPriority, 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, CourseCardAction, CourseCardMetaRow, CourseCardNoteTone, CourseCardProgress, CourseCardTone, CourseContentPanelAccent, CourseContentPanelDensity, CourseContentPanelLabels, CourseContentPanelLayout, CourseContentPanelTab, CourseLesson, CourseLessonRunView, CourseLessonStatus, CourseLessonType, CourseLessonView, CourseModule, CourseModuleStats, CourseModuleView, CoursePlayerPanelPosition, CourseProgressStats, CourseTimelineRow, CourseTranscriptCue, CourseTranscriptRow, CredentialCardAction, CredentialCardMetaRow, CredentialCardProgress, CredentialCardTone, 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, HubCardSize, IconColor, IconName, IconShape, IconSize, IconTagType, InformationBoxVariant, InputSize, InputType, LanguageDisplayMode, LanguageOption, LinkButtonType, Loadable, LoadingState, MarkedDate, MediaGroup, MediaItem, MediaSize, MediaType, MenuItem, MessageBubbleType, MessageDirection, MessageItemStatus, MetricsCardBadgeStatus, MetricsCardIconBg, MetricsCardIconPosition, MetricsCardOrientation, MetricsCardSize, MetricsCardType, MetricsCardVariation, MiniIconAction, NestedTableCellType, NestedTableChildContext, NestedTableChildRow, NestedTableChip, NestedTableColumn, NestedTableGroup, NestedTableProgress, NestedTableRow, NonNullableProps, NoteGroup, NoteItem, NoteSidebarPosition, NoteSidebarState, Notification, NotificationConfig, NotificationPosition, NotificationStatusType, NotificationType, OptionalProps, Orientation, OverlayComponent, PageChangeEvent, PaginationSize, PaginationState, PaginationVariant, PaymentScheduleCardAction, PaymentScheduleCardMeta, PaymentScheduleCardPeriod, PaymentScheduleCardTone, PaymentSummaryRow, PdfCardVariant, PecbError, PecbTableColumn, PecbTableColumnComponent, PecbTableColumnType, PeriodPaymentModalPeriod, Position, PreviewCardAction, ProfileBadge, ProfileGroupItem, ProfileGroupSize, ProfileIndicator, ProfileSize, ProfileType, ProgressArcSize, 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, SlideViewerDay, SlideViewerDayContext, SlideViewerKeyAction, SlideViewerKeyMap, SlideViewerLabels, SlideViewerMoveEvent, SlideViewerPageEvent, SlideViewerSearchEvent, SlideViewerSidebarPosition, SlideViewerSlide, SlideViewerThumbnailContext, SlideViewerTool, SlideViewerToolEvent, 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, TagSelectOption, TagStyle, Templatable, TestimonialData, TestimonialVariant, TextFormFieldType, ThemeConfig, ThemeMode, ThemeVariables, TimelineItem, TimelineTone, 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 };
10406
+ export { APP_HEADER_TRANSLATIONS, APP_SHELL_LOCALES, APP_SIDEBAR_MENU_ICONS, APP_SIDEBAR_MENU_TRANSLATIONS, APP_SIDEBAR_TRANSLATIONS, AccordionItemComponent, AccordionSmallComponent, ActionItemComponent, AddButtonComponent, AdminHeaderComponent, AdminHeaderFieldTemplateDirective, AffixComponent, AlertComponent, AnchorComponent, AppHeaderComponent, AppSidebarComponent, ApplicationStatusBarComponent, AuditorStatusComponent, AuthorDateTimeComponent, BackToTopComponent, BadgeComponent, BalanceCardComponent, BlurDirective, BottomSheetComponent, BreadcrumbsComponent, ButtonComponent, ButtonGroupComponent, ButtonGroupItemComponent, CancelUpdateButtonsComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CertificateUploadBarComponent, CheckDeleteIconComponent, CheckboxComponent, CheckboxDisplayComponent, CodeInputComponent, CodeSnippetComponent, ColorPaletteComponent, ConfirmationComponent, ContentTypeTagComponent, CourseCardComponent, CourseContentPanelComponent, CoursePlayerComponent, CourseTileComponent, CredentialCardComponent, 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_SLIDE_VIEWER_KEY_MAP, DEFAULT_SLIDE_VIEWER_LABELS, DEFAULT_SLIDE_VIEWER_TOOLS, DEFAULT_SLIDE_VIEWER_ZOOM_STEPS, DEFAULT_TAG_INPUT_SEPARATORS, DEFAULT_VIDEO_PLAYER_LABELS, DEFAULT_VIDEO_PLAYER_RATES, DashboardGridComponent, DatepickerComponent, DividerComponent, DropdownComponent, EMPTY_STATE_MAX_BUTTONS, EditButtonComponent, EditCoverPhotoComponent, EmptyStateComponent, ExpandableRowTableComponent, FieldComponent, FileUploadComponent, FilterColumnsComponent, FloatButtonComponent, FloatButtonItemComponent, FormSectionCardComponent, FullscreenModalComponent, FullscreenModalContentDirective, FullscreenModalFooterDirective, FullscreenModalHeaderDirective, GeneralComponent, GridComponent, GridItemComponent, HeaderActionsComponent, HeaderComponent, HeaderDividerComponent, HeaderLanguageComponent, HeaderSearchComponent, HeaderUserComponent, HierarchicalTableComponent, HorizontalStepsComponent, HubCardComponent, HubCardGridComponent, IconComponent, IconRegistry, IconTagComponent, InformationBoxComponent, InputComponent, LanguageDropdownComponent, LinkButtonComponent, ListItemComponent, LoadingService, MediaComponent, MessageBubbleComponent, MessageItemComponent, MetricsCardComponent, MiniIconButtonComponent, NestedTableComponent, NoResultsComponent, NoteSidebarItemComponent, NotesPanelComponent, NotificationService, NotificationStatusLinkComponent, OptionCardComponent, OutlinedFieldComponent, PECB_COLOR_PALETTE, PECB_CUSTOM_ICONS, PECB_FONT_STYLES, PECB_ICONS, PECB_TYPE_SCALE, PaginationComponent, PaymentPlanCardComponent, PaymentScheduleCardComponent, PaymentSummaryComponent, PeriodPaymentModalComponent, PreviewCardComponent, PriceMethodComponent, ProfileComponent, ProfileElementsCardComponent, ProfileGroupComponent, ProgressArcComponent, ProgressBarComponent, ProgressCircleComponent, ProjectLayoutComponent, QuantitySelectorComponent, QuestionTypeTagComponent, RadioComponent, RadioDisplayComponent, RatingNumberComponent, ReasonForReturnComponent, RecordCardComponent, RequestSentByComponent, RequestStatusBarComponent, ResultPageComponent, RightModalComponent, RightModalContentDirective, RightModalFooterDirective, RightModalHeaderDirective, SegmentedControlComponent, ShadowDirective, SidebarComponent, SkeletonComponent, SlidePointsComponent, SlideViewerComponent, SlideViewerDayDirective, SlideViewerThumbnailDirective, SpacerComponent, SpinnerComponent, StandardsPdfCardComponent, StatisticsCardComponent, StatusBannerComponent, StatusComponent, StepperComponent, TabComponent, TableComponent, TagComponent, TagInputComponent, TagSelectComponent, TestimonialComponent, TextFormFieldComponent, TextareaComponent, ThemeService, TimelineComponent, ToggleComponent, ToolbarBarComponent, TooltipComponent, TooltipDirective, TourComponent, TranscriptLineComponent, TypographyComponent, UserWithEmailComponent, VerifyChecklistComponent, VideoPlayerComponent, VideoUploadBarComponent, VirtualTableComponent, addClass, announceToScreenReader, appHeaderLabels, appSidebarLabels, appSidebarMenu, appSidebarRoles, capitalize, clampSlidePage, 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 };
10407
+ export type { AccordionVariant, ActionItemPriority, 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, BalanceCardEntry, BlurSize, BreadcrumbItem, BreadcrumbSeparator, Breakpoint, ButtonGroupIconMode, ButtonGroupItemPosition, ButtonIconStyle, ButtonShape, 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, CourseCardAction, CourseCardMetaRow, CourseCardNoteTone, CourseCardProgress, CourseCardTone, CourseContentPanelAccent, CourseContentPanelDensity, CourseContentPanelLabels, CourseContentPanelLayout, CourseContentPanelTab, CourseLesson, CourseLessonRunView, CourseLessonStatus, CourseLessonType, CourseLessonView, CourseModule, CourseModuleStats, CourseModuleView, CoursePlayerPanelPosition, CourseProgressStats, CourseTimelineRow, CourseTranscriptCue, CourseTranscriptRow, CredentialCardAction, CredentialCardIconVariant, CredentialCardMetaRow, CredentialCardProgress, CredentialCardTone, 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, GridAutoFlow, GridColumns, GridGap, GridItemSpan, GridPadding, GridVerticalAlign, HeaderActionButton, HeaderLanguageOption, HeaderSearchCategory, HeaderSearchType, HierarchicalTableAction, HierarchicalTableColumn, HierarchicalTablePageEvent, HubCardSize, IconColor, IconName, IconShape, IconSize, IconTagType, InformationBoxVariant, InputSize, InputType, LanguageDisplayMode, LanguageOption, LinkButtonType, Loadable, LoadingState, MarkedDate, MediaGroup, MediaItem, MediaSize, MediaType, MenuItem, MessageBubbleType, MessageDirection, MessageItemStatus, MetricsCardBadgeStatus, MetricsCardIconBg, MetricsCardIconPosition, MetricsCardOrientation, MetricsCardSize, MetricsCardType, MetricsCardVariation, MiniIconAction, NestedTableCellType, NestedTableChildContext, NestedTableChildRow, NestedTableChip, NestedTableColumn, NestedTableGroup, NestedTableProgress, NestedTableRow, NonNullableProps, NoteGroup, NoteItem, NoteSidebarPosition, NoteSidebarState, Notification, NotificationConfig, NotificationPosition, NotificationStatusType, NotificationType, OptionalProps, Orientation, OverlayComponent, PageChangeEvent, PaginationSize, PaginationState, PaginationVariant, PaymentScheduleCardAction, PaymentScheduleCardMeta, PaymentScheduleCardPeriod, PaymentScheduleCardTone, PaymentSummaryRow, PdfCardVariant, PecbError, PecbTableColumn, PecbTableColumnComponent, PecbTableColumnType, PeriodPaymentModalPeriod, Position, PreviewCardAction, ProfileBadge, ProfileGroupItem, ProfileGroupSize, ProfileIndicator, ProfileSize, ProfileType, ProgressArcSize, ProgressBarSize, ProgressCircleSize, ProgressType, QuestionTagDisplay, QuestionTagType, QuizType, RadioDisplayState, RadioLabelPosition, RadioVariant, RadiusScale, RatingStyle, RecordCardField, RequestStatusIconType, RequireProps, ResultPageAction, ResultPageIcon, RibbonColor, RightModalPosition, RightModalSize, SearchMode, SegmentedControlOption, SegmentedControlTone, SelectableItem, ShadowHardSize, ShadowSize, ShadowSoftSize, ShadowType, SidebarMenuItem, SidebarSection, Size, Sizeable, SkeletonShape, SkeletonSize, SkeletonType, SlideViewerDay, SlideViewerDayContext, SlideViewerKeyAction, SlideViewerKeyMap, SlideViewerLabels, SlideViewerMoveEvent, SlideViewerPageEvent, SlideViewerSearchEvent, SlideViewerSidebarPosition, SlideViewerSlide, SlideViewerThumbnailContext, SlideViewerTool, SlideViewerToolEvent, SortState, SpacerSize, SpacingScale, StateVariant, StatisticsIconColor, StatusBannerChip, StatusBannerChipVariant, StatusBannerTone, StatusColor, StatusSize, StatusType, StatusVariant, StepItem, StepOrder, StepState, StepperDirection, StepperSize, StepperTailStyle, StepperType, TabItem, TabSize, TabStyle, TableAction, TableColumn, TableRowActionEvent, TableSelectionEvent, TableSize, TableSortEvent, TableStatusConfig, TableUserConfig, TableVariant, TagAction, TagAppearance, TagSelectOption, TagStyle, Templatable, TestimonialData, TestimonialVariant, TextFormFieldType, ThemeConfig, ThemeMode, ThemeVariables, TimelineItem, TimelineTone, 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 };