@lucca-front/ng 22.1.0-rc.4 → 22.1.1

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@lucca-front/ng",
-  "version": "22.1.0-rc.4",
-  "description": "A library of icons made by the team @Lucca",
+  "version": "22.1.1",
+  "description": "Angular components of the Lucca design system Prisme. Storybook: https://lucca-front.lucca.io, design system: https://prisme.lucca.io, LLM documentation: llms.txt in this package.",
+  "homepage": "https://prisme.lucca.io",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/LuccaSA/lucca-front.git",
@@ -20,7 +21,12 @@
   "public": true,
   "keywords": [
     "lucca",
-    "angular"
+    "angular",
+    "prisme",
+    "design-system",
+    "components",
+    "storybook",
+    "llms-txt"
   ],
   "author": "Guilde Front Lucca <guilde-front@lucca.fr>",
   "peerDependencies": {
@@ -28,12 +34,12 @@
     "@angular/core": "^22.0.0",
     "@angular/cdk": "^22.0.0",
     "@angular/animations": "^22.0.0",
-    "@lucca-front/icons": "22.1.0-rc.4",
-    "@lucca-front/scss": "22.1.0-rc.4",
-    "@lucca/prisme": "22.1.0-rc.4",
+    "@lucca-front/icons": "22.1.1",
+    "@lucca-front/scss": "22.1.1",
+    "@lucca/prisme": "22.1.1",
     "@types/dompurify": "^3.0.0",
     "isomorphic-dompurify": "^2.17.0",
-    "marked": "^14.1.0",
+    "marked": ">=14.1.0 <19.0.0",
     "date-fns": "^3.6.0",
     "ngx-mask": "^20.0.3",
     "rxjs": "^7.8.0",
@@ -50,6 +56,9 @@
     "@ngx-formly/core": "^6.3.11"
   },
   "peerDependenciesMeta": {
+    "marked": {
+      "optional": true
+    },
     "lexical": {
       "optional": true
     },
@@ -354,6 +363,10 @@
       "types": "./types/lucca-front-ng-input.d.ts",
       "default": "./fesm2022/lucca-front-ng-input.mjs"
     },
+    "./kbd": {
+      "types": "./types/lucca-front-ng-kbd.d.ts",
+      "default": "./fesm2022/lucca-front-ng-kbd.mjs"
+    },
     "./link": {
       "types": "./types/lucca-front-ng-link.d.ts",
       "default": "./fesm2022/lucca-front-ng-link.mjs"
@@ -438,9 +451,9 @@
       "types": "./types/lucca-front-ng-popup.d.ts",
       "default": "./fesm2022/lucca-front-ng-popup.mjs"
     },
-    "./priority-levels": {
-      "types": "./types/lucca-front-ng-priority-levels.d.ts",
-      "default": "./fesm2022/lucca-front-ng-priority-levels.mjs"
+    "./priority-level": {
+      "types": "./types/lucca-front-ng-priority-level.d.ts",
+      "default": "./fesm2022/lucca-front-ng-priority-level.mjs"
     },
     "./progress-bar": {
       "types": "./types/lucca-front-ng-progress-bar.d.ts",

package/schematics/lib/local-deps/package-lock.json

@@ -11,7 +11,7 @@
       "devDependencies": {
         "postcss": "8.5.26",
         "postcss-scss": "4.0.9",
-        "postcss-selector-parser": "7.1.0",
+        "postcss-selector-parser": "7.1.6",
         "postcss-value-parser": "4.2.0"
       }
     },
@@ -111,9 +111,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.0.tgz",
-      "integrity": "sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==",
+      "version": "7.1.6",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.6.tgz",
+      "integrity": "sha512-7qASPzhKF2l2KLboRZux8CCTRMdGiV08vWmyKzPz22qZ7ZjQBOeY7rNzNoCLSUiftJ7HUq0GERHmxw/t0dCdMw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -132,9 +132,9 @@
       "license": "MIT"
     },
     "node_modules/source-map-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.2.tgz",
+      "integrity": "sha512-KGj/8Y43x35aZVDtt+J4mK1hoLGHULMYfSkODJNQjNDC3oW1PqPoxMwo0pLUsWM/UEGzON/NxeHywEfNXNP3Vw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {

package/schematics/lib/local-deps/package.json

@@ -13,7 +13,7 @@
   "devDependencies": {
     "postcss": "8.5.26",
     "postcss-scss": "4.0.9",
-    "postcss-selector-parser": "7.1.0",
+    "postcss-selector-parser": "7.1.6",
     "postcss-value-parser": "4.2.0"
   },
   "volta": {

package/schematics/lu-button/migration.js

@@ -27,6 +27,12 @@ function migrateComponent(sourceFile, path, tree) {
                 if (button.inputs.palette) {
                     thingsToAdd += `palette="${button.inputs.palette}" `;
                 }
+                if (button.inputs.critical) {
+                    thingsToAdd += "critical ";
+                }
+                if (button.inputs.disabled) {
+                    thingsToAdd += "disabled ";
+                }
                 if (button.inputs.block) {
                     thingsToAdd += "block ";
                 }
@@ -39,23 +45,39 @@ function migrateComponent(sourceFile, path, tree) {
                  * Modify classes
                  */
                 const classes = classesNode.value;
-                const cleanedClasses = classes.split(' ').filter(c => {
-                    return ![
-                        'button',
-                        `mod-block`,
-                        `mod-disclosure`,
-                        `palette-${button.inputs.palette}`,
-                        `mod-text`,
-                        `mod-ghost`,
-                        `mod-outlined`,
-                        `mod-inverted`,
-                        `mod-onlyIcon`,
-                        `mod-withIcon`,
-                        `is-${button.inputs.state}`,
-                        `mod-delete`,
-                        `mod-${button.inputs.size}`
-                    ].includes(c);
-                }).join(' ');
+                const removedClasses = [
+                    'button',
+                    `mod-block`,
+                    `mod-disclosure`,
+                    `palette-${button.inputs.palette}`,
+                    `mod-text`,
+                    `mod-link`,
+                    `mod-ghost`,
+                    `mod-outline`,
+                    `mod-outlined`,
+                    `mod-AI`,
+                    `mod-onlyIcon`,
+                    `mod-withIcon`,
+                    `is-${button.inputs.state}`,
+                    `mod-delete`,
+                    `mod-critical`,
+                    // Bare state classes are deprecated aliases of .is-*
+                    'loading',
+                    'error',
+                    'success',
+                    `mod-${button.inputs.size}`
+                ];
+                // Invert is only carried by the ghost-invert and AI-invert types, otherwise the class is kept
+                const invertedByType = button.type.endsWith('-invert');
+                if (button.inputs.disabled) {
+                    removedClasses.push('disabled', 'is-disabled');
+                }
+                const cleanedClasses = classes.split(' ').filter(c => !removedClasses.includes(c) && !(invertedByType && INVERT_CLASSES.includes(c)))
+                    // .mod-invert is a deprecated alias of .mod-inverted
+                    .map(c => c === 'mod-invert' ? 'mod-inverted' : c)
+                    // .disabled is a deprecated alias of .is-disabled
+                    .map(c => c === 'disabled' ? 'is-disabled' : c)
+                    .join(' ');
                 templateUpdate.remove(button.nodeOffset + classesNode.keySpan.start.offset - 1, classesNode.sourceSpan.toString().length + 1);
                 if (cleanedClasses) {
                     templateUpdate.insertRight(button.nodeOffset + classesNode.keySpan.start.offset, `class="${cleanedClasses}"`);
@@ -80,17 +102,20 @@ function findCssButtons(sourceFile, basePath, tree) {
             if ((0, lib_1.isInterestingNode)(node) && ["button", "a"].includes(node.name)) {
                 const classes = node.attributes.find(attr => attr.name === 'class')?.value || "";
                 if (classes.split(" ").includes("button")) {
+                    const classList = classes.split(' ');
                     const inputs = {
-                        size: classes.split(' ').find(c => /mod-(XS|S|M|L|XL|XXL)/.test(c))?.replace('mod-', ''),
-                        block: classes.includes(`mod-block`),
-                        delete: classes.includes(`mod-delete`),
-                        disclosure: classes.includes(`mod-disclosure`),
-                        palette: classes.split(' ').find(c => /palette-(\w+)/.test(c))?.replace('palette-', ''),
-                        state: classes.split(' ').find(c => /is-(\w+)/.test(c))?.replace('is-', ''),
+                        size: classList.find(c => /^mod-(XS|S|M|L|XL|XXL)$/.test(c))?.replace('mod-', ''),
+                        block: classList.includes(`mod-block`),
+                        critical: classList.includes(`mod-delete`) || classList.includes(`mod-critical`),
+                        // The disabled input only works on a <button>, links keep the .is-disabled class
+                        disabled: node.name === 'button' && (classList.includes(`disabled`) || classList.includes(`is-disabled`)),
+                        disclosure: classList.includes(`mod-disclosure`),
+                        palette: classList.find(c => /palette-(\w+)/.test(c))?.replace('palette-', ''),
+                        state: classList.find(c => /^(is-)?(loading|error|success)$/.test(c))?.replace('is-', ''),
                     };
                     const button = {
                         node: node,
-                        type: getButtonType(classes),
+                        type: getButtonType(classList),
                         inputs,
                         nodeOffset: template.offsetStart,
                         filePath: template.filePath,
@@ -103,18 +128,19 @@ function findCssButtons(sourceFile, basePath, tree) {
     });
     return buttons;
 }
-function getButtonType(classes) {
-    if (classes.includes('mod-outlined')) {
+const INVERT_CLASSES = ['mod-invert', 'mod-inverted'];
+function getButtonType(classList) {
+    const inverted = INVERT_CLASSES.some(c => classList.includes(c));
+    // .mod-outline is a deprecated alias of .mod-outlined
+    if (classList.includes('mod-outlined') || classList.includes('mod-outline')) {
         return 'outlined';
     }
-    if (classes.includes('mod-ghost')) {
-        return 'ghost';
+    if (classList.includes('mod-AI')) {
+        return inverted ? 'AI-invert' : 'AI';
     }
-    if (classes.includes('mod-text')) {
-        if (classes.includes('mod-invert')) {
-            return 'ghost-invert';
-        }
-        return 'ghost';
+    // .mod-text and .mod-link are deprecated aliases of .mod-ghost
+    if (['mod-ghost', 'mod-text', 'mod-link'].some(c => classList.includes(c))) {
+        return inverted ? 'ghost-invert' : 'ghost';
     }
     return '';
 }

package/src/components/_sidepanel.scss

@@ -15,9 +15,9 @@
 		&.mod-sidepanel {
 			position: fixed !important;
 			inset-block: 0;
-			inset-inline-end: 0;
+			inset-inline-end: var(--commons-pushPanel-inlineSize);
 			inline-size: var(--components-sidepanel-M);
-			max-inline-size: 100%;
+			max-inline-size: calc(100% - var(--commons-pushPanel-inlineSize));
 			max-block-size: 100vb;
 			border-radius: 0;
 			animation-name: sidepanel;

package/src/components/cdk/_global.scss

@@ -26,6 +26,10 @@
 	position: absolute;
 	z-index: 1000;
 
+	&.cdk-overlay-popover {
+		inline-size: calc(100% - var(--commons-pushPanel-inlineSize)) !important;
+	}
+
 	&.mod-stacked {
 		@for $i from 1 through 3 {
 			@include stacked($i);

package/src/components/cdk/_overlay.scss

@@ -41,7 +41,7 @@
 		max-inline-size: 30rem;
 	}
 
-	// Caps the panel anchored to the field only: below the `S` breakpoint the panel is rendered by the
+	// Caps the panel anchored to the field only: below the `XS` breakpoint the panel is rendered by the
 	// dialog as a sheet, which spans the whole viewport and sizes itself.
 	&:not(.dialog):has(> lu-select-panel) {
 		max-inline-size: 35rem !important;

package/src/definitions/option/_option-item.scss

@@ -76,7 +76,8 @@
 					border-end-end-radius: var(--pr-t-border-radius-default);
 				}
 
-				:host-context(.optionItem.is-highlighted) & {
+				&:hover,
+				&.is-highlighted {
 					background-color: var(--palettes-100, var(--palettes-product-100));
 				}
 
@@ -85,7 +86,8 @@
 				}
 			}
 
-			:host-context(.optionItem.is-highlighted) & {
+			&:hover,
+			&.is-highlighted {
 				background-color: var(--palettes-neutral-50);
 			}
 
@@ -105,7 +107,7 @@
 
 			@layer mods {
 				&:hover,
-				:host-context(.optionItem.is-highlighted) & {
+				&.is-highlighted {
 					background-color: inherit;
 				}
 			}
@@ -180,7 +182,8 @@
 					--components-options-checkbox-border-color: var(--palettes-neutral-500); // disabled token candidate
 				}
 
-				:host-context(.optionItem.is-highlighted) &:not(.is-disabled) {
+				&:not(.is-disabled):hover,
+				&.is-highlighted:not(.is-disabled) {
 					&::before {
 						box-shadow: inset 0 0 0 2px var(--components-options-checkbox-color);
 					}

package/types/lucca-front-ng-a11y.d.ts

@@ -27,7 +27,7 @@ declare class SkipLinksService {
     register(link: LuSkipLink): void;
     unregister(link: LuSkipLink): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SkipLinksService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<SkipLinksService>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<any>;
 }
 
 declare class LuSkipLinksComponent {

package/types/lucca-front-ng-activity-feed.d.ts

@@ -14,21 +14,25 @@ type ActivityFeedStepStatus = (typeof ACTIVITY_FEED_STEP_STATUS)[number];
 declare class ActivityFeedStepComponent {
     #private;
     readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_activity_feed.ActivityFeedTranslate, Partial<_lucca_front_ng_activity_feed.ActivityFeedTranslate>>;
-    readonly label: _angular_core.InputSignal<PortalContent>;
-    readonly user: _angular_core.InputSignal<ILuUser>;
-    readonly status: _angular_core.InputSignal<"success" | "critical" | "pending">;
-    readonly icon: _angular_core.InputSignal<LuccaIcon>;
-    readonly date: _angular_core.InputSignal<string | Date>;
-    protected readonly preparedDate: _angular_core.Signal<Date>;
+    readonly label: _angular_core.InputSignal<PortalContent | null>;
+    readonly user: _angular_core.InputSignal<ILuUser | null>;
+    /**
+     * Displays a placeholder avatar instead of the `user` one
+     */
+    readonly avatarPlaceholder: _angular_core.InputSignalWithTransform<boolean, boolean | "" | "false" | "true">;
+    readonly status: _angular_core.InputSignal<"success" | "critical" | "pending" | null>;
+    readonly icon: _angular_core.InputSignal<LuccaIcon | null>;
+    readonly date: _angular_core.InputSignal<string | Date | null>;
+    protected readonly preparedDate: _angular_core.Signal<Date | null>;
     /**
      * format given to the date pipe for display.
      *
      * See https://angular.dev/api/common/DatePipe#custom-format-options
      */
-    readonly datePipeFormat: _angular_core.InputSignal<string>;
-    protected readonly dateDisplay: _angular_core.Signal<string>;
+    readonly datePipeFormat: _angular_core.InputSignal<string | undefined>;
+    protected readonly dateDisplay: _angular_core.Signal<string | null>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ActivityFeedStepComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ActivityFeedStepComponent, "lu-activity-feed-step", never, { "intl": { "alias": "intl"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "user": { "alias": "user"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "date": { "alias": "date"; "required": false; "isSignal": true; }; "datePipeFormat": { "alias": "datePipeFormat"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ActivityFeedStepComponent, "lu-activity-feed-step", never, { "intl": { "alias": "intl"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "user": { "alias": "user"; "required": false; "isSignal": true; }; "avatarPlaceholder": { "alias": "avatarPlaceholder"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "date": { "alias": "date"; "required": false; "isSignal": true; }; "datePipeFormat": { "alias": "datePipeFormat"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 declare class ActivityFeedUpdateItemComponent {

package/types/lucca-front-ng-api.d.ts

@@ -55,7 +55,7 @@ declare class LuApiV3Service<T extends ILuApiItem = ILuApiItem> extends ALuApiSe
     protected _get(url: string): Observable<T[]>;
     protected _clueFilter(clue: string): string;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiV3Service<any>, never>;
-    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LuApiV3Service<any>>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<any>;
 }
 
 declare class LuApiV4Service<T extends ILuApiItem = ILuApiItem> extends ALuApiService<T> {
@@ -74,7 +74,7 @@ declare class LuApiV4Service<T extends ILuApiItem = ILuApiItem> extends ALuApiSe
     searchPaged(clue?: string, page?: number, filters?: string[]): Observable<T[]>;
     count(): Observable<number>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiV4Service<any>, never>;
-    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LuApiV4Service<any>>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<any>;
 }
 
 declare class LuApiHybridService<T extends ILuApiItem = ILuApiItem> extends ALuApiService<T> {
@@ -95,7 +95,7 @@ declare class LuApiHybridService<T extends ILuApiItem = ILuApiItem> extends ALuA
     searchAll(clue: string, filters?: string[]): Observable<T[]>;
     searchPaged(clue: string, page: number, filters?: string[]): Observable<T[]>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiHybridService<any>, never>;
-    static ɵprov: _angular_core.ɵɵInjectableDeclaration<LuApiHybridService<any>>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<any>;
 }
 
 type ILuApiOptionFeeder<T extends ILuApiItem = ILuApiItem> = ILuOptionOperator<T>;
@@ -111,12 +111,12 @@ declare abstract class ALuApiOptionFeeder<T extends ILuApiItem = ILuApiItem, S e
 
 declare class LuApiFeederComponent<T extends ILuApiItem = ILuApiItem> extends ALuApiOptionFeeder<T, LuApiHybridService<T>> implements ILuOptionOperator<T>, ILuOnOpenSubscriber {
     readonly outOptions$: BehaviorSubject<T[]>;
-    readonly standard: _angular_core.InputSignal<"v3" | "v4">;
-    readonly api: _angular_core.InputSignal<string>;
-    readonly fields: _angular_core.InputSignal<string>;
-    readonly filters: _angular_core.InputSignal<string[]>;
-    readonly orderBy: _angular_core.InputSignal<string>;
-    readonly sort: _angular_core.InputSignal<string>;
+    readonly standard: _angular_core.InputSignal<"v3" | "v4" | undefined>;
+    readonly api: _angular_core.InputSignal<string | undefined>;
+    readonly fields: _angular_core.InputSignal<string | undefined>;
+    readonly filters: _angular_core.InputSignal<string[] | undefined>;
+    readonly orderBy: _angular_core.InputSignal<string | undefined>;
+    readonly sort: _angular_core.InputSignal<string | undefined>;
     constructor(hostService: LuApiHybridService<T>, selfService: LuApiHybridService<T>);
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiFeederComponent<any>, [{ optional: true; skipSelf: true; }, { self: true; }]>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<LuApiFeederComponent<any>, "lu-api-feeder", never, { "standard": { "alias": "standard"; "required": false; "isSignal": true; }; "api": { "alias": "api"; "required": false; "isSignal": true; }; "fields": { "alias": "fields"; "required": false; "isSignal": true; }; "filters": { "alias": "filters"; "required": false; "isSignal": true; }; "orderBy": { "alias": "orderBy"; "required": false; "isSignal": true; }; "sort": { "alias": "sort"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -155,12 +155,12 @@ declare abstract class ALuApiOptionPagedSearcher<T extends ILuApiItem = ILuApiIt
 
 declare class LuApiSearcherComponent<T extends ILuApiItem = ILuApiItem> extends ALuApiOptionSearcher<T, LuApiHybridService<T>> implements OnInit {
     readonly searchInput: _angular_core.Signal<ElementRef<HTMLElement>>;
-    readonly standard: _angular_core.InputSignal<"v3" | "v4">;
-    readonly api: _angular_core.InputSignal<string>;
-    readonly fields: _angular_core.InputSignal<string>;
-    readonly filters: _angular_core.InputSignal<string[]>;
-    readonly orderBy: _angular_core.InputSignal<string>;
-    readonly sort: _angular_core.InputSignal<string>;
+    readonly standard: _angular_core.InputSignal<"v3" | "v4" | undefined>;
+    readonly api: _angular_core.InputSignal<string | undefined>;
+    readonly fields: _angular_core.InputSignal<string | undefined>;
+    readonly filters: _angular_core.InputSignal<string[] | undefined>;
+    readonly orderBy: _angular_core.InputSignal<string | undefined>;
+    readonly sort: _angular_core.InputSignal<string | undefined>;
     readonly debounceTime: _angular_core.InputSignal<number>;
     clueControl: FormControl;
     constructor(hostService: LuApiHybridService<T>, selfService: LuApiHybridService<T>);
@@ -172,12 +172,12 @@ declare class LuApiSearcherComponent<T extends ILuApiItem = ILuApiItem> extends
 }
 declare class LuApiPagedSearcherComponent<T extends ILuApiItem = ILuApiItem> extends ALuApiOptionPagedSearcher<T, LuApiHybridService<T>> implements OnInit {
     readonly searchInput: _angular_core.Signal<ElementRef<HTMLElement>>;
-    readonly standard: _angular_core.InputSignal<"v3" | "v4">;
-    readonly api: _angular_core.InputSignal<string>;
-    readonly fields: _angular_core.InputSignal<string>;
-    readonly filters: _angular_core.InputSignal<string[]>;
-    readonly orderBy: _angular_core.InputSignal<string>;
-    readonly sort: _angular_core.InputSignal<string>;
+    readonly standard: _angular_core.InputSignal<"v3" | "v4" | undefined>;
+    readonly api: _angular_core.InputSignal<string | undefined>;
+    readonly fields: _angular_core.InputSignal<string | undefined>;
+    readonly filters: _angular_core.InputSignal<string[] | undefined>;
+    readonly orderBy: _angular_core.InputSignal<string | undefined>;
+    readonly sort: _angular_core.InputSignal<string | undefined>;
     readonly debounceTime: _angular_core.InputSignal<number>;
     clueControl: FormControl;
     constructor(hostService: LuApiHybridService<T>, selfService: LuApiHybridService<T>);
@@ -217,11 +217,11 @@ declare abstract class ALuApiOptionPager<T extends ILuApiItem = ILuApiItem, S ex
 }
 
 declare class LuApiPagerComponent<T extends ILuApiItem = ILuApiItem> extends ALuApiOptionPager<T, LuApiHybridService<T>> implements ILuOptionOperator<T>, OnInit, ILuOnScrollBottomSubscriber, ILuOnOpenSubscriber {
-    readonly standard: _angular_core.InputSignal<"v3" | "v4">;
-    readonly api: _angular_core.InputSignal<string>;
-    readonly fields: _angular_core.InputSignal<string>;
-    readonly filters: _angular_core.InputSignal<string[]>;
-    readonly orderBy: _angular_core.InputSignal<string>;
+    readonly standard: _angular_core.InputSignal<"v3" | "v4" | undefined>;
+    readonly api: _angular_core.InputSignal<string | undefined>;
+    readonly fields: _angular_core.InputSignal<string | undefined>;
+    readonly filters: _angular_core.InputSignal<string[] | undefined>;
+    readonly orderBy: _angular_core.InputSignal<string | undefined>;
     constructor(hostService: LuApiHybridService<T>, selfService: LuApiHybridService<T>);
     ngOnInit(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiPagerComponent<any>, [{ optional: true; skipSelf: true; }, { self: true; }]>;
@@ -235,20 +235,20 @@ declare class LuApiSelectInputComponent<T extends ILuApiItem = ILuApiItem> exten
     protected _viewContainerRef: ViewContainerRef;
     protected _renderer: Renderer2;
     readonly standard: _angular_core.InputSignal<"v3" | "v4">;
-    readonly api: _angular_core.InputSignal<string>;
+    readonly api: _angular_core.InputSignal<string | undefined>;
     /**
      * only works with standard="v3"
      */
-    readonly fields: _angular_core.InputSignal<string>;
-    readonly filters: _angular_core.InputSignal<string[]>;
+    readonly fields: _angular_core.InputSignal<string | undefined>;
+    readonly filters: _angular_core.InputSignal<string[] | undefined>;
     /**
      * only works with standard="v3", otherwise use sort
      */
-    readonly orderBy: _angular_core.InputSignal<string>;
+    readonly orderBy: _angular_core.InputSignal<string | undefined>;
     /**
      * only works with standard="v4", otherwise use orderBy
      */
-    readonly sort: _angular_core.InputSignal<string>;
+    readonly sort: _angular_core.InputSignal<string | undefined>;
     byId: LuOptionComparer<T>;
     constructor(_changeDetectorRef: ChangeDetectorRef, _overlay: Overlay, _elementRef: ElementRef<HTMLElement>, _viewContainerRef: ViewContainerRef, _renderer: Renderer2);
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<LuApiSelectInputComponent<any>, never>;

package/types/lucca-front-ng-approbation-inbox.d.ts

@@ -13,26 +13,34 @@ declare class ApprobationInboxDetailMainBlockComponent {
 
 interface LuApprobationInboxDetailHeaderTranslations {
     delegation: string;
+    overdue: string;
 }
 
 declare class ApprobationInboxHeaderComponent {
-    protected readonly dialogRef: LuDialogRef<any, any>;
-    protected readonly intl: LuApprobationInboxDetailHeaderTranslations;
+    protected readonly dialogRef: LuDialogRef<any, any> | null;
     readonly label: _angular_core.InputSignal<string>;
-    readonly delegatedBy: _angular_core.InputSignal<string>;
-    readonly actions: _angular_core.Signal<TemplateRef<unknown>>;
+    readonly delegatedBy: _angular_core.InputSignal<string | null>;
+    /**
+     * Displays an overdue status badge next to the title. Ignored when content is projected in [approbationInboxDetailTitleTrailing]
+     */
+    readonly overdue: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Overrides default translations
+     */
+    readonly intl: _angular_core.InputSignalWithTransform<LuApprobationInboxDetailHeaderTranslations, Partial<LuApprobationInboxDetailHeaderTranslations>>;
+    readonly actions: _angular_core.Signal<TemplateRef<unknown> | undefined>;
     readonly titleId: string;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ApprobationInboxHeaderComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ApprobationInboxHeaderComponent, "lu-approbation-inbox-detail-header", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "delegatedBy": { "alias": "delegatedBy"; "required": false; "isSignal": true; }; }, {}, never, ["[approbationInboxDetailIllustration]", "*", "[approbationInboxDetailActions]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ApprobationInboxHeaderComponent, "lu-approbation-inbox-detail-header", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "delegatedBy": { "alias": "delegatedBy"; "required": false; "isSignal": true; }; "overdue": { "alias": "overdue"; "required": false; "isSignal": true; }; "intl": { "alias": "intl"; "required": false; "isSignal": true; }; }, {}, never, ["[approbationInboxDetailIllustration]", "[approbationInboxDetailTitleTrailing]", "*", "[approbationInboxDetailActions]"], true, never>;
 }
 
 declare class ApprobationInboxDetailComponent {
-    protected readonly dialogRef: LuDialogRef<any, any>;
+    protected readonly dialogRef: LuDialogRef<any, any> | null;
     readonly insideDialog: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly headerRef: _angular_core.Signal<ApprobationInboxHeaderComponent>;
-    readonly content: _angular_core.Signal<TemplateRef<unknown>>;
-    readonly header: _angular_core.Signal<TemplateRef<unknown>>;
-    readonly titleId: _angular_core.Signal<string>;
+    readonly headerRef: _angular_core.Signal<ApprobationInboxHeaderComponent | undefined>;
+    readonly content: _angular_core.Signal<TemplateRef<unknown> | undefined>;
+    readonly header: _angular_core.Signal<TemplateRef<unknown> | undefined>;
+    readonly titleId: _angular_core.Signal<string | undefined>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ApprobationInboxDetailComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ApprobationInboxDetailComponent, "lu-approbation-inbox-detail", never, { "insideDialog": { "alias": "insideDialog"; "required": false; "isSignal": true; }; }, {}, ["headerRef"], ["[approbationInboxDetailHeader]", "*"], true, never>;
 }
@@ -41,14 +49,14 @@ declare class ApprobationInboxLinkComponent {
     private readonly listInstance;
     readonly current: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly dialogService: LuDialogService;
-    readonly mediaMinM: _angular_core.Signal<boolean>;
+    readonly mediaMinM: _angular_core.Signal<boolean | undefined>;
     openDialog($event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ApprobationInboxLinkComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ApprobationInboxLinkComponent, "a[lu-approbation-inbox-list-action]", never, { "current": { "alias": "current"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 declare class ApprobationInboxItemComponent implements OnInit {
-    protected readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListItemTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListItemTranslations>>;
+    readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListItemTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListItemTranslations>>;
     private readonly list;
     private readonly destroyRef;
     readonly selectable: _angular_core.Signal<boolean>;
@@ -63,7 +71,7 @@ declare class ApprobationInboxItemComponent implements OnInit {
 }
 
 declare class ApprobationInboxGroupComponent {
-    protected readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListGroupTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListGroupTranslations>>;
+    readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListGroupTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListGroupTranslations>>;
     private readonly list;
     readonly selectable: _angular_core.Signal<boolean>;
     readonly label: _angular_core.InputSignal<string>;
@@ -110,7 +118,7 @@ interface SelectableItem {
     checked: WritableSignal<boolean>;
 }
 declare class ApprobationInboxListComponent {
-    protected readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListTranslations>>;
+    readonly intl: _angular_core.InputSignalWithTransform<_lucca_front_ng_approbation_inbox.LuApprobationInboxListTranslations, Partial<_lucca_front_ng_approbation_inbox.LuApprobationInboxListTranslations>>;
     private readonly pluralRules;
     readonly titleId: string;
     readonly label: _angular_core.InputSignal<PortalContent>;

package/types/lucca-front-ng-bubble-icon.d.ts

@@ -1,4 +1,5 @@
 import * as _angular_core from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import { LuccaIcon } from '@lucca-front/icons';
 
 /**
@@ -9,9 +10,11 @@ type BubbleIconSize = (typeof BUBBLE_ICON_SIZE)[number];
 declare const BUBBLE_ICON_DIRECTION: readonly ["top", "bottom", "left", "right", "random"];
 type BubbleIconDirection = (typeof BUBBLE_ICON_DIRECTION)[number];
 
+declare const LU_BUBBLE_ICON_DEFAULT_DIRECTION: InjectionToken<"top" | "bottom" | "left" | "right" | "random">;
+
 declare class BubbleIconComponent {
     readonly icon: _angular_core.InputSignal<LuccaIcon>;
-    readonly alt: _angular_core.InputSignal<string>;
+    readonly alt: _angular_core.InputSignal<string | null>;
     readonly size: _angular_core.InputSignal<"XS" | "S" | "M" | "L">;
     readonly palette: _angular_core.InputSignal<"error" | "success" | "warning" | "product" | "neutral" | "none" | "brand" | "kiwi" | "lime" | "cucumber" | "mint" | "glacier" | "lagoon" | "blueberry" | "lavender" | "grape" | "watermelon" | "pumpkin" | "pineapple" | "pagga" | "poplee" | "coreHR" | "timmi" | "cleemy" | "cc">;
     readonly paletteClass: _angular_core.Signal<{
@@ -24,5 +27,5 @@ declare class BubbleIconComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<BubbleIconComponent, "lu-bubble-icon", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "palette": { "alias": "palette"; "required": false; "isSignal": true; }; "bubbleDirection": { "alias": "bubbleDirection"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-export { BUBBLE_ICON_DIRECTION, BUBBLE_ICON_SIZE, BubbleIconComponent };
+export { BUBBLE_ICON_DIRECTION, BUBBLE_ICON_SIZE, BubbleIconComponent, LU_BUBBLE_ICON_DEFAULT_DIRECTION };
 export type { BubbleIconDirection, BubbleIconSize };