@leanix/components 0.4.853 → 0.4.854

package/lib/core-ui/components/ellipsis/ellipsis.component.d.ts

@@ -1,64 +0,0 @@
-import { AfterViewChecked, ChangeDetectorRef, ElementRef, InjectionToken, OnDestroy, OnInit } from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
-import { BehaviorSubject, Observable } from 'rxjs';
-import { ResizeObserverService } from '../../services/resize-observer.service';
-import * as i0 from "@angular/core";
-export declare const LX_ELLIPSIS_DEBOUNCE_ON_RESIZE: InjectionToken<number>;
-/**
- * You can set `max-width` CSS property on your `lx-ellipsis` host element or the parent element if you want its content to never exceed a specific width.
- * The component automatically truncates overflowing text and provides a "Show more" / "Show less" toggle button.
- *
- * ### Example
- * @example
- * ```html
- * <lx-ellipsis [content]="longDescription" style="max-width: 300px;" />
- * <lx-ellipsis [content]="userInput" [escapeHtmlInContent]="true" />
- * ```
- */
-export declare class EllipsisComponent implements OnInit, OnDestroy, AfterViewChecked {
-    private debounceMsAfterResize;
-    private cdRef;
-    private hostEl;
-    private resizeObserverService;
-    private translateService;
-    /** @internal */
-    static DEFAULT_RESIZE_DEBOUNCE_MS: number;
-    /**
-     * The text content to display and potentially truncate.
-     * @default ''
-     */
-    content: string;
-    /**
-     * Only set this to false if the content is not a user provided string
-     * or if you sanitize the provided content yourself.
-     * @default true
-     */
-    escapeHtmlInContent: boolean;
-    private contentSpanEl$;
-    /** @internal */
-    contentSpanEl: ElementRef<HTMLSpanElement>;
-    private showMoreButtonEl$;
-    /** @internal */
-    showMoreButtonEl: ElementRef<HTMLButtonElement>;
-    /** @internal */
-    isShowingMore$: BehaviorSubject<boolean>;
-    /** @internal */
-    showButton$: Observable<boolean>;
-    /** @internal */
-    showMoreButtonLabel$: Observable<string>;
-    /** @internal */
-    sanitizedContent$: Observable<string>;
-    private content$;
-    private destroyed$;
-    private viewChecked$;
-    constructor(debounceMsAfterResize: number, cdRef: ChangeDetectorRef, hostEl: ElementRef, resizeObserverService: ResizeObserverService, translateService: TranslateService);
-    ngOnInit(): void;
-    ngAfterViewChecked(): void;
-    /** @internal */
-    onShowMoreToggle(): void;
-    ngOnDestroy(): void;
-    private detectChangesWhenObservableEmits;
-    private isContentOverflowing;
-    static ɵfac: i0.ɵɵFactoryDeclaration<EllipsisComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EllipsisComponent, "lx-ellipsis", never, { "content": { "alias": "content"; "required": false; }; "escapeHtmlInContent": { "alias": "escapeHtmlInContent"; "required": false; }; }, {}, never, never, true, never>;
-}

package/lib/core-ui/components/empty-state/empty-state.component.d.ts

@@ -1,83 +0,0 @@
-import { EventEmitter, Signal } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Displays an empty state with an optional icon, title, description, action buttons, and a more link.
- * Useful for showing initial states before data is loaded or when no data is available.
- *
- * ### Projection slots
- * - Default slot: Description text or additional content to display below the title
- *
- * ### Example
- * @example
- * ```html
- * <lx-empty-state
- *   [title]="'No items found'"
- *   [icon]="'inbox'"
- *   [buttonLabel]="'Add Item'"
- *   [secondaryButtonLabel]="'Import'"
- *   [moreLinkLabel]="'Learn more'"
- *   [moreLink]="'https://docs.example.com'"
- *   (buttonClicked)="onAddItem()"
- *   (secondaryButtonClicked)="onImport()"
- * >
- *   <p>Start by adding your first item or importing existing data.</p>
- * </lx-empty-state>
- * ```
- */
-export declare class EmptyStateComponent {
-    /**
-     * The title to be displayed. Can contain HTML.
-     */
-    title: import("@angular/core").InputSignal<string>;
-    /**
-     * The SAP icon name to show in the empty state (e.g., 'inbox', 'add-document').
-     */
-    icon: import("@angular/core").InputSignal<string | undefined>;
-    /**
-     * The main call-to-action button label. If not provided, the button will not be shown.
-     */
-    buttonLabel: import("@angular/core").InputSignal<string | undefined>;
-    /**
-     * The secondary call-to-action button label. If not provided, the button will not be shown.
-     */
-    secondaryButtonLabel: import("@angular/core").InputSignal<string | undefined>;
-    /**
-     * Whether the empty state is in a loading state. If true, action buttons will show a spinner.
-     * @default false
-     */
-    loading: import("@angular/core").InputSignal<boolean>;
-    /**
-     * The text label for the more link.
-     */
-    moreLinkLabel: import("@angular/core").InputSignal<string | undefined>;
-    /**
-     * The URL of the more link. Can be a string for external links or an array for Angular router links.
-     */
-    moreLink: import("@angular/core").InputSignal<string | string[] | undefined>;
-    /**
-     * Whether the more link should be opened in a new tab.
-     * @default true
-     */
-    openMoreLinkInNewTab: import("@angular/core").InputSignal<boolean>;
-    /**
-     * The size of the empty state.
-     * @default 'medium'
-     */
-    size: import("@angular/core").InputSignal<"small" | "medium">;
-    protected useRouterLink: Signal<boolean>;
-    protected get _size(): "small" | "medium";
-    /**
-     * Emitted when the main call-to-action button is clicked.
-     */
-    buttonClicked: EventEmitter<MouseEvent>;
-    /**
-     * Emitted when the secondary call-to-action button is clicked.
-     */
-    secondaryButtonClicked: EventEmitter<MouseEvent>;
-    /**
-     * Emitted when the more link is clicked.
-     */
-    moreLinkClicked: EventEmitter<MouseEvent>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<EmptyStateComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EmptyStateComponent, "lx-empty-state", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; "isSignal": true; }; "secondaryButtonLabel": { "alias": "secondaryButtonLabel"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "moreLinkLabel": { "alias": "moreLinkLabel"; "required": false; "isSignal": true; }; "moreLink": { "alias": "moreLink"; "required": false; "isSignal": true; }; "openMoreLinkInNewTab": { "alias": "openMoreLinkInNewTab"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "buttonClicked": "buttonClicked"; "secondaryButtonClicked": "secondaryButtonClicked"; "moreLinkClicked": "moreLinkClicked"; }, never, ["*"], true, never>;
-}

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

@@ -1,85 +0,0 @@
-import { RouterLink } from '@angular/router';
-import * as i0 from "@angular/core";
-/**
- * The page header acts as a central navigation tool, guiding users through the application and helping them understand their current location.
- * It often includes a back arrow for easy navigation in child pages and may feature a toolbar on the right for quick access to actions or tools.
- * Additionally, it can include a breadcrumb.
- *
- * ### Projection slots
- * - `ui5-breadcrumbs`: Defines the breadcrumbs shown above the page title
- * - `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';
- * ```
- * [Link to UI5 Breadcrumbs documentation](https://ui5.github.io/webcomponents/components/Breadcrumbs)
- *
- *
- * ### Example
- * @example
- * ```html
- * <lx-page-header [pageTitle]="'Agile Tracking'">
- *   <ui5-breadcrumbs>
- *     <ui5-breadcrumbs-item routerLink="/">Root Page</ui5-breadcrumbs-item>
- *     <ui5-breadcrumbs-item routerLink="/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="add">Add Entity</button>
- *      <button lx-button size="large">Settings</button>
- *   </ng-container>
- * </lx-page-header>
- * ```
- */
-export declare class PageHeaderComponent {
-    /**
-     * Optional title to display in the header.
-     * If none is passed down, the component assumes
-     * you will pass down a title via the `header-title` projection slot.
-     */
-    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">>;
-    /**
-     * Whether a divider should be shown below the header.
-     * @default true
-     */
-    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, ["ui5-breadcrumbs", "[header-title]", "[header-buttons]", "[header-content]"], true, never>;
-}

package/lib/core-ui/components/skeleton/skeleton.component.d.ts

@@ -1,40 +0,0 @@
-import * as i0 from "@angular/core";
-/**
- * Skeleton is a component that can be used to show a loading state of a component.
- *
- * Use skeleton loaders for pages or sections that load content progressively, like text and images. The component can
- * be used to compose various scenarios like placeholders for thumbnails, lists, and avatars. See the example
- * [patterns](?path=/docs/skeleton-patterns--docs) for more details.
- *
- * ### Example
- * @example
- * ```html
- * <lx-skeleton width="100%" height="20px" />
- * <lx-skeleton width="200px" height="200px" borderRadius="50%" />
- * <lx-skeleton width="80%" height="16px" color="dark" />
- * ```
- */
-export declare class SkeletonComponent {
-    /**
-     * Width of the skeleton element. Valid CSS values are supported.
-     * @default '100%'
-     */
-    width?: string;
-    /**
-     * Height of the skeleton element. Valid CSS values are supported.
-     * @default '100%'
-     */
-    height?: string;
-    /**
-     * Border radius of the skeleton element. Valid CSS values are supported.
-     * @default '4px'
-     */
-    borderRadius?: string;
-    /**
-     * Color of the skeleton element. 'dark' or 'light' are supported.
-     * @default 'light'
-     */
-    color: 'dark' | 'light';
-    static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SkeletonComponent, "lx-skeleton", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, never, true, never>;
-}

package/lib/core-ui/components/spinner/spinner.component.d.ts

@@ -1,30 +0,0 @@
-import * as i0 from "@angular/core";
-/**
- * The following CSS classes should be used to style this component. The use of the inputs is deprecated.
- * - `fullSpace`: Sets position to absolute with full height and width => fills ancestor with position set.
- * - `fullSpaceFixed`: Sets position to fixed with full height and width => fills window
- *   (or ancestor with new rendering context, created, for example, with `transform: translate(0, 0)`
- * - `fadeBackground`: Sets background to 60% transparent white. TODO: Always use for fullSpace* classes and remove.
- *
- * ### Projection slots
- * - Default slot: Optional text or content to display below the spinner
- *
- * @deprecated Use the `ui5-busy-indicator` component instead.
- *
- * ### Example
- * @example
- * ```html
- * <lx-spinner class="fullSpace fadeBackground">Loading...</lx-spinner>
- * <lx-spinner [fadeBackground]="true" />
- * ```
- */
-export declare class SpinnerComponent {
-    /**
-     * Applies a semi-transparent white background.
-     * @default false
-     * @deprecated Use the `fadeBackground` CSS class instead.
-     */
-    fadeBackground: boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SpinnerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SpinnerComponent, "lx-spinner", never, { "fadeBackground": { "alias": "fadeBackground"; "required": false; }; }, {}, never, ["*"], true, never>;
-}

package/lib/core-ui/components/stepper/stepper.component.d.ts

@@ -1,76 +0,0 @@
-import { CdkStepper } from '@angular/cdk/stepper';
-import * as i0 from "@angular/core";
-/**
- * Stepper component is a wrapper around the Angular CDK Stepper component. It provides a way to create a linear
- * sequence of steps that guide users through a process.
- *
- * ### Projection slots
- * Each `cdk-step` element projects its content into the stepper's content area when that step is active.
- *
- * ### Example
- * @example
- * ```html
- * <lx-stepper [selectedIndex]="currentStep">
- *   <cdk-step label="Personal Info">
- *     <form>
- *       <input type="text" placeholder="Name" />
- *     </form>
- *   </cdk-step>
- *   <cdk-step label="Contact Details">
- *     <form>
- *       <input type="email" placeholder="Email" />
- *     </form>
- *   </cdk-step>
- *   <cdk-step label="Review">
- *     <p>Review your information</p>
- *   </cdk-step>
- * </lx-stepper>
- * ```
- *
- * ## Usage
- *
- * 1. Import `LxCoreUiModule` module from `@leanix/components` and `CdkStepperModule` module from `@angular/cdk/stepper` in your module where you want to use the component, or in case of a standalone parent component, import the
- *    `StepperComponent` and `CdkStepperModule` directly into your standalone component.
- *
- * - Module import:
- *
- * ```ts
- * import { LxCoreUiModule } from '@leanix/components';
- * import { CdkStepperModule } from '@angular/cdk/stepper';
- * ```
- *
- * - Standalone component import:
- *
- * ```ts
- * import { StepperComponent } from '@leanix/components';
- * import { CdkStepperModule } from '@angular/cdk/stepper';
- *
- * @Component({
- *   selector: 'lx-my-component',
- *   imports: [CdkStepperModule, StepperComponent],
- *   templateUrl: './my-component.component.html'
- * })
- * export class MyComponent {}
- * ```
- *
- * 2. Use the component in your template. All steps added to the stepper should be wrapped in a `cdk-step` element.
- *
- * Since this component extends the Angular CDK `CdkStepper` component, all the inputs, outputs, and methods available in the
- * `CdkStepper` component are also available in the `StepperComponent` and are documented in the
- * [Angular CDK documentation](https://material.angular.io/cdk/stepper/api).
- */
-export declare class StepperComponent extends CdkStepper {
-    /**
-     * @internal
-     *
-     * TODO: remove this dead code
-     */
-    size: 'small' | 'normal';
-    get isSmallVariant(): boolean;
-    /** @internal */
-    isCompleted(index: number): boolean;
-    /** @internal */
-    isActiveStep(index: number): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StepperComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<StepperComponent, "lx-stepper", never, {}, {}, never, never, true, never>;
-}

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

@@ -1,55 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import { OrderOption, SortingOptions } from '../../../pipes/sort.pipe';
-import { TableComponent } from '../table.component';
-import * as i0 from "@angular/core";
-/**
- * The `lx-th` can be used in combination with `lx-table` to implement sortable `<table>` elements.
- * Renders a table header cell with optional sorting functionality.
- *
- * ### Projection slots
- * - Default slot: The header text content
- *
- * ### Example
- * @example
- * ```html
- * <table lx-table [isSortable]="true" [(sort)]="sort">
- *   <thead>
- *     <tr>
- *       <lx-th column="name">Name</lx-th>
- *       <lx-th column="date" [disableSortClear]="true">Date</lx-th>
- *       <lx-th column="actions" [disableSort]="true">Actions</lx-th>
- *     </tr>
- *   </thead>
- * </table>
- * ```
- */
-export declare class TableHeaderComponent {
-    #private;
-    private parentTable?;
-    /**
-     * The technical column name used as the key in sort operations. Required for sortable columns.
-     */
-    column?: string;
-    /**
-     * Disables sorting for this column even when the table has sorting enabled.
-     * @default false
-     */
-    disableSort: boolean;
-    /**
-     * Prevents the user from clearing the sort state.
-     * When true, only allows toggling between ascending and descending order.
-     * @default false
-     */
-    disableSortClear: boolean;
-    /**
-     * Emitted whenever the user changes the sort order by clicking the header.
-     * Provides the new sort state with column key and order.
-     */
-    sortChange: EventEmitter<SortingOptions>;
-    readonly sortable: import("@angular/core").Signal<boolean>;
-    readonly order: import("@angular/core").Signal<OrderOption>;
-    constructor(parentTable?: TableComponent | undefined);
-    onSort(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TableHeaderComponent, [{ optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TableHeaderComponent, "lx-th", never, { "column": { "alias": "column"; "required": false; }; "disableSort": { "alias": "disableSort"; "required": false; }; "disableSortClear": { "alias": "disableSortClear"; "required": false; }; }, { "sortChange": "sortChange"; }, never, ["*"], true, never>;
-}

package/lib/core-ui/components/table/table.component.d.ts

@@ -1,83 +0,0 @@
-import { SortingOptions } from '../../pipes/sort.pipe';
-import * as i0 from "@angular/core";
-/**
- * The `lx-table` directive can be applied to `<table>` elements to provide a common styling.
- * Furthermore it supports column sorting in combination with `<lx-th>` for table headers.
- *
- * ### Example
- * @example
- * ```html
- * <table lx-table [isSortable]="true" [(sort)]="sort">
- *   <thead>
- *     <tr>
- *       <lx-th column="name">Name</lx-th>
- *       <lx-th column="status" [disableSortClear]="true">Status</lx-th>
- *       <lx-th column="actions" [disableSort]="true">Actions</lx-th>
- *     </tr>
- *   </thead>
- *   <tbody>
- *     <tr>
- *       <td>Item 1</td>
- *       <td>Active</td>
- *       <td><button>Edit</button></td>
- *     </tr>
- *   </tbody>
- * </table>
- * ```
- *
- * ## Usage
- *
- * 1. Import the `TableComponent` from `@leanix/components` where you want to use it.
- *
- * ```ts
- * import { TableComponent } from '@leanix/components';
- * ```
- *
- * 2. Add the `lx-table` directive to your `<table>` element.
- *
- * ```html
- * <table lx-table></table>
- * ```
- *
- * ## Sortability
- *
- * To provide sortability within a table, the `isSortable` input has to be set to `true`
- * and the columns that support sorting should be `<lx-th>` elements with a column name applied via the `column` input.
- *
- * Sorting can be disabled for individual columns via the `disableSort` input.
- *
- * By default the sort order of columns can be changed between unsorted, ascending, and descending (after descending back to unsorted).
- * To prevent the user from clearing the sort order and just allow toggling between ascending and descending the `disableSortClear` input can be set to `true`.
- *
- * To handle sort changes, the `(sortChange)` output can be used to receive the new sort (`key` of the column and `order` - either `ASC`, `DESC`, or `undefined`).
- *
- * ### Example code
- * ```html
- * <table lx-table [isSortable]="true" [(sort)]="sort" (sortChange)="...">
- *   <thead>
- *     <lx-th column="column1" [disableSortClear]="false">Allows asc, desc & unsorted</lx-th>
- *     <lx-th column="column2" [disableSortClear]="true">Allows only asc & desc</lx-th>
- *     <lx-th column="column3" [disableSort]="true">Is not sortable</lx-th>
- *   </thead>
- * </table>
- * ```
- */
-export declare class TableComponent {
-    /**
-     * Enables or disables the sortability of the table. When enabled, `<lx-th>` elements with a `column` attribute become sortable.
-     * @default false
-     */
-    readonly isSortable: import("@angular/core").InputSignal<boolean>;
-    /**
-     * The sort state of the table containing the column key and sort order (ASC, DESC, or undefined).
-     * Can be used with two-way binding to control and react to sort changes.
-     * @default {}
-     */
-    readonly sort: import("@angular/core").ModelSignal<SortingOptions>;
-    /**
-     * @internal To be called from `lx-th` elements to set the sort state.
-     */
-    onTableHeaderSortChange(sort: SortingOptions): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TableComponent, "table[lx-table]", never, { "isSortable": { "alias": "isSortable"; "required": false; "isSignal": true; }; "sort": { "alias": "sort"; "required": false; "isSignal": true; }; }, { "sort": "sortChange"; }, never, never, true, never>;
-}

package/lib/core-ui/components/tokenizer/token/token.component.d.ts

@@ -1,26 +0,0 @@
-import { ElementRef } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * A token wrapper component used within `lx-tokenizer` to represent individual items.
- * The tokenizer manages visibility of tokens based on available space.
- *
- * ### Projection slots
- * - Default slot: The content to display inside the token (text, icons, badges, etc.)
- *
- * ### Example
- * @example
- * ```html
- * <lx-tokenizer>
- *   <lx-token>Token One</lx-token>
- *   <lx-token>Token Two</lx-token>
- * </lx-tokenizer>
- * ```
- */
-export declare class TokenComponent {
-    private elementRef;
-    constructor(elementRef: ElementRef<HTMLElement>);
-    show(): void;
-    hide(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TokenComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TokenComponent, "lx-token", never, {}, {}, never, ["*"], true, never>;
-}

package/lib/core-ui/components/tokenizer/tokenizer-overflow-popover/tokenizer-overflow-popover.component.d.ts

@@ -1,57 +0,0 @@
-import { TemplateRef } from '@angular/core';
-import { SatPopoverComponent, SatPopoverHorizontalAlign, SatPopoverVerticalAlign } from '@ncstate/sat-popover';
-import { TokenizerComponent } from '../tokenizer.component';
-import * as i0 from "@angular/core";
-/**
- * A companion component for `lx-tokenizer` that displays overflowing tokens in a popover.
- * Automatically listens to the tokenizer's overflow events and shows a popover anchored to the counter button.
- *
- * ### Projection slots
- * - `popoverTemplate`: Template to render inside the popover. Receives the `startIndex` of overflowing tokens as context.
- *
- * ### Example
- * @example
- * ```html
- * <lx-tokenizer #tokenizer [active]="true">
- *   <lx-token>Item 1</lx-token>
- *   <lx-token>Item 2</lx-token>
- *   <lx-token>Item 3</lx-token>
- * </lx-tokenizer>
- *
- * <lx-tokenizer-overflow-popover [tokenizer]="tokenizer">
- *   <ng-template #popoverTemplate let-startIndex>
- *     <div class="overflow-items">
- *       @for (item of getOverflowItems(startIndex); track item) {
- *         <div>{{ item }}</div>
- *       }
- *     </div>
- *   </ng-template>
- * </lx-tokenizer-overflow-popover>
- * ```
- */
-export declare class TokenizerOverflowPopoverComponent {
-    private destroyRef;
-    private overflowClickSubscription?;
-    protected startIndex: import("@angular/core").WritableSignal<number>;
-    private changeDetectorRef;
-    protected readonly popoverTemplate?: TemplateRef<unknown>;
-    protected readonly popover: SatPopoverComponent;
-    /**
-     * Reference to the tokenizer component to listen for overflow events.
-     */
-    tokenizer: import("@angular/core").InputSignal<TokenizerComponent>;
-    /**
-     * Horizontal alignment of the popover relative to the counter button.
-     * @default 'after'
-     */
-    horizontalAlign: import("@angular/core").InputSignal<SatPopoverHorizontalAlign>;
-    /**
-     * Vertical alignment of the popover relative to the counter button.
-     * @default 'start'
-     */
-    verticalAlign: import("@angular/core").InputSignal<SatPopoverVerticalAlign>;
-    constructor();
-    protected closePopover(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TokenizerOverflowPopoverComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TokenizerOverflowPopoverComponent, "lx-tokenizer-overflow-popover", never, { "tokenizer": { "alias": "tokenizer"; "required": true; "isSignal": true; }; "horizontalAlign": { "alias": "horizontalAlign"; "required": false; "isSignal": true; }; "verticalAlign": { "alias": "verticalAlign"; "required": false; "isSignal": true; }; }, {}, ["popoverTemplate"], never, true, never>;
-}