@leanix/components 0.4.643 → 0.4.645

package/lib/core-ui/components/page-header/page-header.component.d.ts

@@ -6,9 +6,34 @@ import * as i0 from "@angular/core";
  * Additionally, it can include a breadcrumb.
  *
  * ### Projection slots
+ * - `ui5-breadcrumbs`: Defines the breadcrumbs shown above the page title
+ *   - **Important**: To set a URL for a breadcrumb item, you need to provide the `href`
+ * attribute to the `ui5-breadcrumbs-item` component. `RouterLink` does not work before updating to Angular 20.
  * - `header-title`: Defines the page title content
  * - `header-content`: Defines additional content below the page title
  * - `header-buttons`: Defines the header action buttons
+ *
+ * ### Using Breadcrumbs
+ * To use breadcrumbs, import the `BreadcrumbsComponent` and `BreadcrumbsItemComponent`:
+ *
+ * ```typescript
+ * import { BreadcrumbsComponent, BreadcrumbsItemComponent } from '@leanix/components/ui5';
+ * ```
+ *
+ * ### Example
+ * @example ```html
+ * <lx-page-header [pageTitle]="'Agile Tracking'">
+ *   <ui5-breadcrumbs>
+ *     <ui5-breadcrumbs-item href="/">Root Page</ui5-breadcrumbs-item>
+ *     <ui5-breadcrumbs-item href="/inventory">Inventory</ui5-breadcrumbs-item>
+ *     <ui5-breadcrumbs-item>Agile Tracking</ui5-breadcrumbs-item>
+ *   </ui5-breadcrumbs>
+ *   <ng-container header-buttons>
+ *      <button lx-button size="large" color="primary" icon="fa-plus">Add Entity</button>
+ *      <button lx-button size="large">Settings</button>
+ *   </ng-container>
+ * </lx-page-header>
+ * ```
  */
 export declare class PageHeaderComponent {
     /**
@@ -19,20 +44,28 @@ export declare class PageHeaderComponent {
     pageTitle: import("@angular/core").InputSignal<string | undefined>;
     /**
      * Relative URL to navigate back to
+     * @deprecated Project the `ui5-breadcrumbs` component for navigation purposes
+     * @internal
      */
     backUrl: import("@angular/core").InputSignal<string[]>;
     /**
      * Query parameters to append to the `backUrl`
+     * @deprecated Project the `ui5-breadcrumbs` component for navigation purposes
+     * @internal
      */
     queryParams: import("@angular/core").InputSignal<{
         [key: string]: string;
     }>;
     /**
      * Accessible name of the back link
+     * @deprecated Project the `ui5-breadcrumbs` component for navigation purposes
+     * @internal
      */
     backUrlLabel: import("@angular/core").InputSignal<string | null | undefined>;
     /**
      * Additional navigation state for the back link
+     * @deprecated Project the `ui5-breadcrumbs` component for navigation purposes
+     * @internal
      */
     navigationStateOptions: import("@angular/core").InputSignal<Pick<RouterLink, "state">>;
     /**
@@ -42,8 +75,10 @@ export declare class PageHeaderComponent {
     showDivider: import("@angular/core").InputSignal<boolean>;
     /**
      * Event emitted when the back icon is clicked.
+     * @deprecated Project the `ui5-breadcrumbs` component for navigation purposes
+     * @internal
      */
     backIconClick: import("@angular/core").OutputEmitterRef<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<PageHeaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PageHeaderComponent, "lx-page-header", never, { "pageTitle": { "alias": "pageTitle"; "required": false; "isSignal": true; }; "backUrl": { "alias": "backUrl"; "required": false; "isSignal": true; }; "queryParams": { "alias": "queryParams"; "required": false; "isSignal": true; }; "backUrlLabel": { "alias": "backUrlLabel"; "required": false; "isSignal": true; }; "navigationStateOptions": { "alias": "navigationStateOptions"; "required": false; "isSignal": true; }; "showDivider": { "alias": "showDivider"; "required": false; "isSignal": true; }; }, { "backIconClick": "backIconClick"; }, never, ["[header-title]", "[header-content]", "[header-buttons]"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PageHeaderComponent, "lx-page-header", never, { "pageTitle": { "alias": "pageTitle"; "required": false; "isSignal": true; }; "backUrl": { "alias": "backUrl"; "required": false; "isSignal": true; }; "queryParams": { "alias": "queryParams"; "required": false; "isSignal": true; }; "backUrlLabel": { "alias": "backUrlLabel"; "required": false; "isSignal": true; }; "navigationStateOptions": { "alias": "navigationStateOptions"; "required": false; "isSignal": true; }; "showDivider": { "alias": "showDivider"; "required": false; "isSignal": true; }; }, { "backIconClick": "backIconClick"; }, never, ["ui5-breadcrumbs", "[header-title]", "[header-buttons]", "[header-content]"], true, never>;
 }

package/lib/forms-ui/components/breadcrumb/breadcrumb.component.d.ts

@@ -10,6 +10,8 @@ interface EllipsedBreadcrumb {
 }
 type ViewBreadcrumb = Breadcrumb | EllipsedBreadcrumb;
 /**
+ * @deprecated Use the `ui5-breadcrumbs` instead.
+ *
  * Breadcrumb component is used to show a list of labels, usually to show the path of user's navigation.
  */
 export declare class BreadcrumbComponent implements OnChanges {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leanix/components",
-  "version": "0.4.643",
+  "version": "0.4.645",
   "license": "Apache-2.0",
   "author": "LeanIX GmbH",
   "repository": {

package/ui5/index.d.ts

@@ -2,4 +2,7 @@
  * All UI5-related components / directives supported by the SAP LeanIX Design System.
  */
 export * from './ui5.provider';
+export { BreadcrumbsComponent } from '@ui5/webcomponents-ngx/main/breadcrumbs';
+export { BreadcrumbsItemComponent } from '@ui5/webcomponents-ngx/main/breadcrumbs-item';
 export { IconComponent } from '@ui5/webcomponents-ngx/main/icon';
+export { BreadcrumbsItemClickEventDetail } from '@ui5/webcomponents/dist/Breadcrumbs';