import * as _ibenvandeveire_ngx_layout from '@ibenvandeveire/ngx-layout'; import * as i0 from '@angular/core'; import { ElementRef, Signal, InputSignal, Type, TemplateRef, Injector, EnvironmentInjector, OnInit, AfterContentChecked, AfterViewInit, DestroyRef, WritableSignal, OnDestroy, ChangeDetectorRef, Renderer2, OnChanges, OutputEmitterRef, Provider, ViewContainerRef, ComponentRef, EmbeddedViewRef, PipeTransform } from '@angular/core'; import { CdkDragDrop, CdkDrag, CdkDropList } from '@angular/cdk/drag-drop'; import { FormControl, ControlValueAccessor, FormRecord } from '@angular/forms'; import { Observable, BehaviorSubject, Subject } from 'rxjs'; import { MarkerBase as MarkerBase$1 } from 'markerjs-live'; import * as markerjs2 from 'markerjs2'; import { MarkerAreaState, MarkerBase } from 'markerjs2'; import { LiveAnnouncer } from '@angular/cdk/a11y'; import { NgxWindowService } from '@ibenvandeveire/ngx-core'; import { MarkedOptions, Marked, MarkedExtension } from 'marked'; import { CanActivateFn, CanDeactivateFn } from '@angular/router'; type NgxConfigurableLayoutItemSizeOption = 'fit-content' | 'fill' | 'equal'; type NgxConfigurableLayoutType = 'static' | 'editable'; interface NgxConfigurableLayoutItemEntity { key: string; isActive: boolean; disabled?: boolean; } type NgxConfigurableLayoutGrid = NgxConfigurableLayoutItemEntity[][]; interface NgxConfigurableLayoutItemDropEvent { currentGrid: NgxConfigurableLayoutGrid; eventType: 'sorting' | 'moving'; element: NgxConfigurableLayoutItemEntity; showInactive: boolean; targetRowIndex: number; } /** * An abstract class to use when implementing custom fallbacks for the NgxDisplayContentDirective */ declare abstract class NgxDisplayContentComponent { elementRef: ElementRef; /** * An optional data input to provide data to the fallback components. This property is typed as any. */ readonly data: i0.InputSignal; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * An abstract directive used as a base to handle focussed base actions */ declare abstract class NgxHasFocusDragAndDropAbstractDirective { /** * Whether the current element is focussed */ protected hasFocus: boolean; /** * Set the hasFocus flag */ setFocus(): void; /** * Remove the hasFocus flag */ removeFocus(): void; readonly elementRef: ElementRef; focus(): void; onBlur?(): void; onFocus?(): void; /** * Execute an action when the element has focussed * * @param action - The provided action */ handleWhenFocussed(action: () => void): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * An abstract class to avoid circular dependency with the ItemDirective and the HostDirective */ declare abstract class NgxAccessibleAbstractDragAndDropItemDirective extends NgxHasFocusDragAndDropAbstractDirective { /** * An unique id of the draggable item */ abstract itemId: Signal; /** * Marks the item as focussed and selected */ abstract markAsActive(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * An abstract service that is used to make drag and drop components accessible for assistive technologies */ declare abstract class NgxAccessibleDragAndDropAbstractService { /** * The live region service */ protected readonly liveRegionService: LiveAnnouncer; /** * The window service */ protected readonly windowService: NgxWindowService; /** * A method that passes the current language, can either be a string or an Observable */ abstract get currentLanguage(): string | Observable; /** * A custom set of messages used for the drag and drop events. * * Please check the readme for more information on what is necessary to make these messages accessible. */ customMessages: Record; /** * Sets a message to the live region * * @param message - The provided message */ setMessage(message: NgxAccessibleDragAndDropMessage): Observable; /** * Adds a description to the drag and drop host explaining how the drag and drop functions * * @param parent - The drag and drop host * @param description - An optional description used to overwrite the default description */ setDragAndDropDescription(parent: HTMLElement, description?: string): Observable; /** * Returns the custom message record or the default when no custom record was provided */ private get messageRecord(); } /** * An abstract component provided for the NgxTableComponent, allowing to user to set a default open row state template for all tables * */ declare abstract class NgxTableOpenRowStateTemplateAbstractComponent { /** * The current open state the component has to visualize */ isOpen: InputSignal; /** * The row data */ row: InputSignal; /** * The index of the row */ index: InputSignal; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * An abstract component provided for the NgxTableComponent, allowing to user to set a default select template for all tables * */ declare abstract class NgxTableSelectTemplateAbstractComponent { /** * The control we wish to pass to the input */ control: InputSignal>; /** * The row that is visualized */ row: InputSignal; /** * The index of the row */ index: InputSignal; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } declare enum NgxTableSortDirection { ASCENDING = "ASCENDING", DESCENDING = "DESCENDING" } /** * An abstract component provided for the NgxTableComponent, allowing to user to set a default sort template for all tables * */ declare abstract class NgxTableSortTemplateAbstractComponent { /** * The current sort direction the component has to visualize */ direction: InputSignal; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } type NgxDisplayContentStatus = 'loading' | 'error' | 'offline'; type NgxDisplayContentAriaLive = 'polite' | 'assertive' | 'off'; type NgxDisplayContentRecord = Partial>; type NgxDisplayContentConditions = NgxDisplayContentRecord; type NgxDisplayContentComponentConfiguration = NgxDisplayContentRecord>; type NgxDisplayContentOverrideConfiguration = NgxDisplayContentRecord<{ template?: TemplateRef; data?: any; }>; interface NgxDisplayContentConfiguration { components: NgxDisplayContentComponentConfiguration; hideWhenNoTemplateProvided?: boolean; listenToOnlineStatus?: boolean; } type NgxAccordionOpenBehavior = 'first' | 'all' | number | number[]; type NgxAccordionOpenStateBehavior = 'all' | 'one'; type NgxAccessibleDragAndDropFromToMessage = `${string}{{#item}}${string}{{#to}}${string}{{#from}}${string}` | `${string}{{#item}}${string}{{#from}}${string}{{#to}}${string}` | `${string}{{#to}}${string}{{#item}}${string}{{#from}}${string}` | `${string}{{#to}}${string}{{#from}}${string}{{#item}}${string}` | `${string}{{#from}}${string}{{#item}}${string}{{#to}}${string}` | `${string}{{#from}}${string}{{#to}}${string}{{#item}}${string}`; interface NgxAccessibleDragAndDropMessageRecord { selected: `${string}{{#item}}${string}`; deselected: `${string}{{#item}}${string}`; reordered: NgxAccessibleDragAndDropFromToMessage; moved: NgxAccessibleDragAndDropFromToMessage; cancelled: `${string}{{#item}}${string}`; item: string; container: string; description: string; } type NgxAccessibleDragAndDropMoveType = 'reordered' | 'moved'; interface NgxAccessibleDragAndDropBaseMessage { type: KeyType; data: DataType; } type NgxAccessibleDragAndDropMessage = NgxAccessibleDragAndDropBaseMessage<'selected' | 'deselected' | 'cancelled', { item: string; itemLabel?: string; }> | NgxAccessibleDragAndDropBaseMessage<'reordered' | 'moved', { item: string; from: string; to: string; itemLabel?: string; toLabel?: string; fromLabel?: string; }>; interface NgxAccessibleDragAndDropMoveEvent { previousIndex: number; newIndex: number; previousContainer: number; newContainer: number; } /** * The state of the marker view */ type NgxImageMarkerState = MarkerAreaState; /** * A marker on the marker view */ type NgxImageMarkerItem = MarkerBase; /** * A record with the marker types we wish to show, both for the view and the edit mode */ interface NgxImageMarkerTypes { edit: (typeof MarkerBase)[]; view: (typeof MarkerBase$1)[]; } /** * Configuration for the marker view */ interface NgxImageMarkerConfiguration { /** * Whether the record is readonly or not */ mode: 'view' | 'edit'; /** * The state the view has to start from */ defaultState: NgxImageMarkerState; /** * Whether zooming in is allowed, by default false */ allowZoom?: boolean; /** * Whether clearing the marker view is allowed, by default false */ allowClear?: boolean; /** * An optional set of allowed marker types, by default all */ markerTypes?: NgxImageMarkerTypes; /** * An optional set of allowed marker types, by default the levels are [1,2,3,4] and the current zoom is 1 */ zoom?: { levels: number[]; current: number; }; } interface NgxImageMarkerBase { mode: 'view' | 'edit'; close: () => void; } interface NgxImageMarkerView extends NgxImageMarkerBase { mode: 'view'; valueChanges: Observable; } interface NgxImageMarkerEdit extends NgxImageMarkerBase { mode: 'edit'; valueChanges: Observable; } /** * An Angular wrapper for markerjs views */ type NgxImageMarker = NgxImageMarkerEdit | NgxImageMarkerView; interface NgxTableSortEvent { direction: NgxTableSortDirection; column: ColumnKey; } type RequireAtLeastOne = { [Key in keyof DataType]-?: Required> & Partial>>; }[keyof DataType]; interface NgxTableShowHeaderRequirements { isLoading: boolean; isEmpty: boolean; } interface NgxTableCypressDataTagsBase { header?: string; cell?: string; footer?: string; } type NgxTableCypressDataTags = RequireAtLeastOne; type NgxTreeGridRowTarget = 'current' | 'above' | 'below' | 'first' | 'last'; type NgxTreeGridCellTarget = number | 'first' | 'last'; type ComponentType = Type | null; type NgxMobileLayoutItem = ComponentType | Record; interface NgxMobileLayoutBase { /** * The header we wish to render */ header: { /** * The center part of the header we wish to render */ main?: DataType; /** * The left part of the header we wish to render */ left?: DataType; /** * The right part of the header we wish to render */ right?: DataType; }; /** * An optional flyout we wish to render */ flyout: DataType; /** * An optional aside we wish to render */ aside: DataType; /** * An optional navigation we wish to render */ navigation: DataType; /** * The footer we wish to render */ footer: DataType; } /** * Parameters configured when opening a component inside a mobile layout outlet (aside or flyout). */ interface NgxMobileLayoutOutletParams { /** * The accessible name (ARIA label) for the dialog or flyout container. */ label: string; /** * An optional parent injector to use for the instantiated component. */ injector?: Injector; /** * An optional set of input values to pass to the component. */ inputs?: Record; /** * Optional projectable nodes to project into the component. */ content?: Node[][]; /** * An optional environment injector to use for compiling components. */ environmentInjector?: EnvironmentInjector; } /** * A layout for the `NgxMobileLayoutService` */ type NgxMobileLayout = Partial>; /** * A layout configuration for the `NgxMobileLayoutService` */ type NgxMobileLayoutConfiguration = Partial>; type NgxMobileLayoutByQuery = NgxMobileLayoutBase>; /** * All possible elements of the mobile layout */ type NgxMobileLayoutElements = keyof Omit | `header.${keyof NgxMobileLayout['header']}`; /** * The priority of the button */ type NgxButtonPriority = 'primary' | 'secondary' | 'tertiary' | 'danger' | 'success'; /** * The type of the button */ type NgxButtonType = 'regular' | 'fab' | 'text' | 'outline'; /** * The position of the icon in the button */ type NgxButtonIconPosition = 'left' | 'right'; /** * The width of the button */ type NgxButtonWidth = 'full' | 'fit'; /** * Whether the text and icon or only the icon needs to be shown */ type NgxButtonDisplayType = 'icon' | 'text' | 'both'; /** * The default configuration of the button * * loading - An optional component used for the loading state * icon - An optional component used for the icon * iconPosition - The optional default position of the icon, by default `left` * labelWrapper - The optional default HTML element used to wrap the button label, by default `span` */ interface NgxButtonConfiguration { loading?: Type; icon?: Type; iconPosition?: NgxButtonIconPosition; labelWrapper?: string; } interface NgxMediaQuery { id: string; query: string; } type NgxMediaQueryMatchingPredicate = 'every' | 'some'; /** * The priority of the link */ type NgxLinkPriority = 'primary' | 'secondary' | 'tertiary' | 'danger' | 'success'; /** * The position of the icon in the button */ type NgxLinkIconPosition = 'left' | 'right'; /** * The type of the link */ type NgxLinkType = 'text' | 'icon' | 'button'; /** * The width of the link */ type NgxLinkWidth = 'full' | 'fit'; /** * The context of the link */ type NgxLinkContext = 'navigation' | 'breadcrumb' | 'anchor' | 'form' | 'footer'; /** * Whether the link is an internal link or external link */ type NgxLinkDestination = 'internal' | 'external'; /** * The default configuration of the link * * loading - An optional component used for the loading state * icon - An optional component used for the icon * iconPosition - The optional default position of the icon, by default `left` * labelWrapper - The optional default HTML element used to wrap the button link, by default `span` */ interface NgxLinkConfiguration { loading?: Type; icon?: Type; iconPosition?: NgxLinkIconPosition; labelWrapper?: string; } interface NgxTableAriaLabels { /** * The ARIA label we wish to set on the select-all checkbox in the table header */ selectAll?: string; /** * The ARIA label we wish to set on the checkbox/radio button in individual table rows */ selectRow?: string | ((index: number) => string); /** * The ARIA label we wish to set on the expand row button in individual table rows */ expandRow?: string | ((index: number) => string); /** * The ARIA label we wish to set on the collapse row button in individual table rows */ collapseRow?: string | ((index: number) => string); /** * The ARIA label we wish to set on the sort button in individual table headers */ sortColumn?: string | ((column: string, direction: NgxTableSortDirection | null) => string); /** * The ARIA label we wish to set on the selection column header */ selectionColumn?: string; /** * The ARIA label we wish to set on the expansion column header */ expansionColumn?: string; } /** * The layout item pairs with the `` container. * This component will in itself not be rendered. The key provided in this component * will need to be provided in the `[keys]` input or the `formControl` of the layout container * as well. The order in which they are provided there, will define the order in which * the items will be rendered. */ declare class NgxConfigurableLayoutItemComponent { /** * The unique key of the layout item. */ readonly key: i0.InputSignal; /** * An optional label for the layout item used for WCAG purposes. */ readonly label: i0.InputSignal; /** * The template reference of the; */ readonly template: i0.Signal>; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * This component acts essentially as a layout wrapper. In combination with the * `` provided with a key as input, this component allows * you to dynamically change the order in which the items get rendered. * * The order of the items in the template does not matter, it gets set by the `[keys]` input. * You may also bind a `FormControl` to this component, which will allow you to reactively * change the order in which the elements get rendered. The control will always override the`[keys]` input. */ declare class NgxConfigurableLayoutComponent implements ControlValueAccessor, OnInit, AfterContentChecked, AfterViewInit { /** * A subject to mark the isActiveFormRecord as initialized */ protected readonly isActiveFormRecordInitializedSubject: BehaviorSubject; /** * A subject to hold the destroy flow */ protected readonly destroyRef: DestroyRef; /** * A list of the configurable item templates. */ readonly configurableItemTemplates: i0.Signal; /** * An optional template to overwrite the default checkbox */ readonly checkboxTemplate: i0.Signal>; readonly form: FormControl; readonly isActiveFormRecord: FormRecord>; /** * A record of the templates with the unique item `key` and its `templateRef`. */ itemTemplateRecord: WritableSignal>>; /** * A record of the label with the unique item `key` and its `label`. */ itemLabelRecord: WritableSignal>; /** * Whether the layout is static or editable. * * If the layout is `static`, a two dimensional array of key strings needs to be provided to the layout through the `keys` input. * If the layout is `editable`, a form control needs to be provided to the layout requiring a two dimensional array with {key, isActive} pairs. */ readonly layoutType: InputSignal; /** * The keys will determine the order of the `ngx-configurable-layout-item` layout items. * * This property can only be used when the layoutType is set to `static`. */ keys: InputSignal; /** * Whether the inactive items should be visible in the layout. * * This property can only be used when the layoutType is set to `editable`. */ readonly showInactive: InputSignal; /** * Whether drag and drop is enabled for the layout. * * This property can only be used when the layoutType is set to `editable` */ readonly allowDragAndDrop: InputSignal; /** * Determines how much space each item takes in the row. By default, this is 'fill' * * fill - Will make the items take up the available space * fit-content - Will make the items take up the space of the provided template * equal - Will make the items take up equal amount of space throughout the grid */ readonly itemSize: InputSignal; /** * An optional row gap we can provide to create a gap between the rows of the layout. * * This input requires an amount in px, rem, %, etc. */ readonly rowGap: InputSignal; /** * An optional predicate we can use to allow or disallow items to be dropped * * @memberof NgxConfigurableLayoutComponent */ readonly dropPredicate: InputSignal<(event: NgxConfigurableLayoutItemDropEvent) => boolean>; /** * An optional label for the layout item used for WCAG purposes. */ readonly itemLabel: InputSignal; /** * An optional label for the layout item used for WCAG purposes. */ readonly rowLabel: InputSignal; /** * An optional description explaining how the drag and drop works used for WCAG purposes. */ readonly description: InputSignal; /** * An optional column gap we can provide to create a gap between the columns of the layout. * * This input requires an amount in px, rem, %, etc. */ readonly columnGap: InputSignal; constructor(); ngOnInit(): void; ngAfterContentChecked(): void; ngAfterViewInit(): void; /** * Callback function for ControlValueAccessor onChange */ protected onChanged: Function; /** * Callback function for ControlValueAccessor onTouched */ protected onTouched: Function; writeValue(value: NgxConfigurableLayoutGrid): void; registerOnChange(fn: any): void; registerOnTouched(fn: any): void; setDisabledState?(isDisabled: boolean): void; /** * Drag and drop an element in the grid * * @param {CdkDragDrop} event - The grid element * @memberof NgxConfigurableLayoutComponent */ drop(event: CdkDragDrop): void; /** * Moves an element based on its provided event * * @param event - The provided move event */ move(event: NgxAccessibleDragAndDropMoveEvent): void; /** * The predicate we run before sorting * * @param draggedElement - The dragged element * @param list - The list into which we're dragging the element */ beforeSort: (_: number, draggedElement: CdkDrag, list: CdkDropList) => boolean; /** * The predicate we run before moving * * @param draggedElement - The dragged element * @param list - The list into which we're dragging the element */ beforeDrop: (draggedElement: CdkDrag, list: CdkDropList) => boolean; /** * Handles the drop predicate * * @protected * @param eventType - Whether we're moving or sorting * @param draggedElement - The element that's being dragged * @param list - The list into which we're dragging the element */ protected dropPredicateHandler(eventType: 'sorting' | 'moving', draggedElement: CdkDrag, list: CdkDropList): boolean; /** * Update the item layout template order. */ protected handleItemTemplates(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * A WCAG/ARIA compliant implementation of an item in the accordion pattern. * * https://www.w3.org/WAI/ARIA/apg/patterns/accordion/ */ declare class NgxAccordionItemComponent implements OnInit, AfterViewInit, OnDestroy { /** * An instance of the parent NgxAccordionComponent */ protected readonly parent: NgxAccordionComponent; /** * An instance of the ChangeDetectorRef */ protected readonly cdRef: ChangeDetectorRef; /** * An instance of the Renderer2 */ protected readonly renderer: Renderer2; /** * The details element */ readonly detailsElement: i0.Signal>; /** * The summary element */ readonly summaryElement: i0.Signal>; /** * The template for the content */ readonly contentTemplate: i0.Signal>; /** * The template for the header */ readonly headerTemplate: i0.Signal>; /** * Moves the focus to the accordion item above the current one */ arrowUp(event: Event): void; /** * Moves the focus to the accordion item below the current one */ arrowDown(event: Event): void; /** * Moves the focus to the first accordion item */ home(): void; /** * Moves the focus to the last accordion item */ end(): void; /** * Whether the accordion item is disabled */ readonly disabled: i0.InputSignal; /** * The id of the accordion item */ readonly id: string; /** * Whether the accordion item is open */ isOpen: WritableSignal; /** * Whether the accordion item is focussed */ protected hasFocus: WritableSignal; /** * Updates the current open/closed state of the accordion item, regardless of the disabled state */ updateAccordionItemState(isOpen: boolean): void; /** * Set the focus on the summary item */ focus(): void; /** * Set the focus state of the accordion item * * @param hasFocus - Whether the item has focus */ setFocus(hasFocus: boolean): void; /** * Register the item to its parent */ ngOnInit(): void; /** * Listen to the default HTML events of the details object */ ngAfterViewInit(): void; /** * Remove the item from its parent when destroyed */ ngOnDestroy(): void; /** * Only perform an action when the item has focus * * @param action - The provided action */ protected handleWhenFocussed(action: () => void): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * A WCAG/ARIA compliant implementation of the accordion pattern. * * https://www.w3.org/WAI/ARIA/apg/patterns/accordion/ */ declare class NgxAccordionComponent { /** * An instance of the DestroyRef */ protected readonly destroyRef: DestroyRef; /** * A subject to hold a registered event */ protected readonly itemRegisteredSubject: Subject; /** * An observable based on the itemRegisteredSubject, sharing its replay */ protected readonly itemRegistered$: Observable; /** * A list of all accordion items */ items: NgxAccordionItemComponent[]; /** * Open the specific items in the accordion */ open: InputSignal; /** * Whether all or just one item can be opened at the same time; by default this is `all` */ openStateBehavior: InputSignal; constructor(); /** * Register an accordion item to the container * * @param item - An accordion item */ registerItem(item: NgxAccordionItemComponent): void; /** * Removes an accordion item from the container * * @param item - An accordion item */ removeItem(item: NgxAccordionItemComponent): void; /** * Moves the focus to an accordion * * @param id - The id of the current item * @param direction - The direction we move in */ moveFocus(id: string, direction: 'up' | 'down' | 'first' | 'last'): void; /** * Update the state of other accordion items based on the openStateBehavior * * @param id - The recently opened item */ handleOpenState(id: string): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare const NgxAccordion: readonly [typeof NgxAccordionComponent, typeof NgxAccordionItemComponent]; /** * A service that provides the currently online status of the application */ declare class NgxOnlineService { /** * An instance of the window service */ protected readonly windowService: NgxWindowService; /** * A subject that emits whenever the application is on or offline */ protected readonly onlineSubject: Subject; /** * An observable that emits whenever the application is on or offline */ readonly online$: Observable; constructor(); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * A service that serves as a wrapper for MarkerJs2 and MarkerJs-live * * https://markerjs.com/ */ declare class NgxImageMarkerService implements OnDestroy { private readonly windowService; /** * A record with all markers */ private readonly markers; /** * Create an image with markers * * @param image - The image element we wish to draw markers on * @param rootTarget - The element we render the image in * @param configuration - The configuration we wish to pass to the image markers */ createImageMarker(image: HTMLImageElement | HTMLElement, rootTarget: HTMLElement, configuration: NgxImageMarkerConfiguration): NgxImageMarker; /** * Creates a readonly marker view * * @param image - The image element we wish to draw markers on * @param rootTarget - The element we render the image in * @param configuration - The configuration we wish to pass to the image markers */ private createReadonlyImageMarker; /** * Creates an editable marker view * * @param image - The image element we wish to draw markers on * @param rootTarget - The element we render the image in * @param configuration - The configuration we wish to pass to the image markers */ private createImageMakerEdit; /** * Listen to the value changes in the editable view * * @param {MarkerArea} marker - The marker view */ private createMarkerValueChanges; /** * Listen to the marker clicks in the readonly view * * @param {MarkerArea} marker - The marker view */ private createMarkerClickedListener; ngOnDestroy(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * A service that can be used to track media queries and their changes. */ declare class NgxMediaQueryService implements OnDestroy { /** * An instance of the NgxWindowService */ private readonly windowService; /** * An optional list of default mediaQueries we want to register at start time */ private readonly mediaQueries; /** * A record of all the registered listeners */ private listeners; /** * The id of the current query match */ private readonly currentQueryMatch; readonly currentQueryMatch$: Observable; constructor(); ngOnDestroy(): void; /** * Registers one or multiple queries to listen to * * @param value - One or multiple queries to register */ registerQuery(value: NgxMediaQuery | NgxMediaQuery[]): void; /** * Check if the query matches with the current screen size * * @param id - The id of the query we wish to match * @param predicate - Whether every or some part(s) of the query have to be matched */ matchesQuery(id: string | string[], predicate?: NgxMediaQueryMatchingPredicate): Observable; get queries(): string[]; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * The `NgxMobileLayoutService` allows us to configure an entire layout based on routing rather than on HTML. This allows for an easier use for mobile-first applications. */ declare class NgxMobileLayoutService { /** * An instance of the NgxMediaQueryService */ protected readonly mediaService: NgxMediaQueryService; /** * A subject holding whether the initial layout has been set */ protected readonly initialLayoutSetSubject$: BehaviorSubject; /** * Whether the initial layout has been set */ protected readonly initialLayoutSet$: Observable; /** * An optional default layout that was provided */ protected readonly defaultLayout: NgxMobileLayoutConfiguration | undefined; /** * A subject holding the current layout of the application */ protected readonly layoutSubject$: BehaviorSubject; /** * Whether the flyout should be shown */ protected readonly showFlyout: WritableSignal; /** * Whether the currently opened flyout should be preserved when the route changes */ protected readonly preserveFlyout: WritableSignal; /** * Whether the aside should be shown */ protected readonly showAside: WritableSignal; /** * An array of queries */ protected queries: string[]; /** * The current layout of the application as an Observable */ readonly layout$: Observable; /** * Whether the flyout is visible */ flyoutShown: Signal; /** * The parameter context of the flyout */ flyoutParams: WritableSignal; /** * The parameter context of the aside */ asideParams: WritableSignal; /** * Whether the aside is visible */ asideShown: Signal; /** * Sets the provided layout for the * * @param layout - The layout we wish to set */ setLayout(layout: NgxMobileLayoutConfiguration): Observable; /** * Open a flyout * * @param flyout - The flyout component * @param params - The required parameters for the flyout * @param preserveFlyout - Whether the flyout needs to be preserved * */ openFlyout(flyout: ComponentType, params: NgxMobileLayoutOutletParams, preserveFlyout?: boolean): void; /** * Close the currently open flyout */ closeFlyout(): void; /** * Open an aside * * @param aside - The aside component * @param params - The required parameters for the aside */ openAside(aside: ComponentType, params: NgxMobileLayoutOutletParams): void; /** * Close the currently open aside */ closeAside(): void; /** * Provides an initial layout if one was provided */ setUpInitialLayout(markAsInitial?: boolean): void; /** * Returns whether an element is defined in the layout * * @param element - The element we wish to check */ hasElement(element: NgxMobileLayoutElements): Observable; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * A service that can be used to parse markdown strings to HTML using the Marked library */ declare class NgxMarkdownService { /** * An optional set of configuration for the Marked library */ private readonly configuration; /** * An instance of the Sanitizer */ private readonly sanitizer; /** * An instance of the Marked library * https://marked.js.org/ */ private markedInstance; /** * Parse markdown to HTML and sanitizes the HTML string * * @param markdown - The markdown string to parse */ parse(markdown: string, options?: Omit): Observable; /** * Get the instance of the Marked library */ getMarkedInstance(): Marked; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * A component wrapper for MarkerJs views * * https://markerjs.com/ */ declare class NgxImageMarkerComponent implements AfterViewInit, OnChanges, OnDestroy { /** * An instance of the NgxImageMarkerService */ protected readonly imageMarkerService: NgxImageMarkerService; /** * An instance of the NgxWindowService */ protected readonly windowService: NgxWindowService; /** * An instance of the ElementRef */ protected readonly elementRef: ElementRef; /** * The currently created marker */ protected currentMarker: NgxImageMarker; /** * A subject holding the destroy state of the marker */ protected readonly markerDestroyedSubject: Subject; /** * The rendered image element */ readonly imageElement: i0.Signal>; /** * The url to the image we wish to render */ readonly image: i0.InputSignal; /** * A WCAG/WAI-ARIA compliant description of the image */ readonly imageDescription: i0.InputSignal; /** * The start data we wish to render */ readonly startState: i0.InputSignal; /** * Whether we can edit the view, by default this is true */ readonly canEdit: i0.InputSignal; /** * An optional current zoom level */ readonly currentZoomLevel: i0.InputSignal; /** * An optional amount of times we can zoom in and out */ readonly zoomLevels: i0.InputSignal; /** * An optional record of types of Markerjs markers we wish to render */ readonly markerTypes: i0.InputSignal; /** * Emits when the state has been updated */ stateUpdated: OutputEmitterRef; /** * Emits when a marker is clicked when the view is in readonly mode */ markerClicked: OutputEmitterRef; ngAfterViewInit(): void; ngOnChanges(changes: any): void; ngOnDestroy(): void; /** * Creates a MarkerJs view based on the provided configuration */ protected createMarker(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * A component used to render a mobile-first layout */ declare class NgxMobileLayoutComponent implements OnInit { /** * The previous active element */ protected previousActiveElement: HTMLElement; /** * The instance of the NgxMobileLayoutService */ protected readonly layoutService: NgxMobileLayoutService; /** * The currently displayed layout */ protected layout: Signal; /** * Whether the flyout needs to be shown */ protected readonly flyoutShown: Signal; /** * Whether the aside needs to be shown */ protected readonly asideShown: Signal; /** * The params context for the aside */ protected readonly asideParams: Signal; /** * The params context for the flyout */ protected readonly flyoutParams: Signal; /** * An optional template we can pass to replace the default routerOutlet */ readonly contentTemplate: Signal>; constructor(); ngOnInit(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } type HideHeaderRowOptions = 'when-loading' | 'when-empty'; type HideHeaderRowOption = 'never' | [HideHeaderRowOptions] | [HideHeaderRowOptions, HideHeaderRowOptions]; type ShowDetailRowOption = 'always' | 'on-click' | 'on-single-item'; /** * A configuration we can provide to set properties of the table globally * * showDetailRow - Defines the default open behavior of detail rows. 'always' will open all rows by default, 'on-click' will only open them on click, 'on-single-item' will open the row on click and when there's only one item in the table. * ngxTableClass - A default class that will be set on the ngx-table component itself * showOpenRowState - Defines whether we always want to show the open-row state indicator for each table. * allowMultipleRowsOpen - Defines whether multiple rows can be open at once. * showOpenRowState - Defines whether we always want to show the open-row state indicator for each table. * showSelectedOpenRow - Defines whether we want a class to be added to the currently opened row * emitValueOnSingleItem - Defines whether we want to emit the rowClicked when there's only one item in the table and the showDetailRow is set to 'on-single-item' * hideHeaderWhen - Defines whether we want to show the header when the table is empty or loading * components - A set of components we can use as defaults for the loading, error and empty state of the * ariaLabels - Configurable fallback ARIA labels for accessibility purposes. */ interface NgxTableConfiguration { showDetailRow?: ShowDetailRowOption; ngxTableClass?: string; showOpenRowState?: boolean; allowMultipleRowsOpen?: boolean; highlightKey?: string; showSelectedOpenRow?: boolean; emitValueOnSingleItem?: boolean; hideHeaderWhen?: HideHeaderRowOption; components?: { loading?: Type; empty?: Type; radio?: Type; checkbox?: Type; openRowState?: Type; sort?: Type; }; ariaLabels?: NgxTableAriaLabels; } declare class NgxAbstractTableCellDirective { /** * The current sortDirection of the cell */ sortDirection: NgxTableSortDirection | null; /** * The templates used to set in the table */ footerTemplate: Signal>; headerTemplate: Signal>; cellTemplate: Signal>; /** * An optional class that can be set for the cell */ cellClass: string; /** * The name of the column we want this cell to represent */ readonly column: i0.InputSignal; /** * Whether or not the cell is sortable */ readonly sortable: i0.InputSignal; /** * A tag that can be added to a column in the table, set according to the cypress best practices * See https://docs.cypress.io/guides/references/best-practices#Selecting-Elements */ readonly cypressDataTags: i0.InputSignal; /** * Whether the content of a cell is editable. By default, this is set to false */ readonly editable: i0.InputSignal; /** * Emits the sortable event if a column is sortable */ sort: OutputEmitterRef; /** * Handles the sorting click events */ handleSort(): void; /** * Resets the sort direction back to null */ resetSortDirection(): void; /** * Sets the sorting direction based on the provided direction * * @param direction - The provided direction */ setSortDirection(direction: NgxTableSortDirection): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } declare class NgxTableCellDirective extends NgxAbstractTableCellDirective { /** * A template for the header of the cell */ readonly headerTemplate: i0.Signal>; /** * A template for the body of the cell */ readonly cellTemplate: i0.Signal>; /** * A template for the footer of the cell */ readonly footerTemplate: i0.Signal>; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } declare class NgxCurrencyTableCellComponent extends NgxAbstractTableCellDirective { /** * The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) format of the provided amount, by default `EUR` */ readonly currency: i0.InputSignal; /** * A template for the header of the cell */ readonly headerTemplate: i0.Signal>; /** * A template for the footer of the cell */ readonly footerTemplate: i0.Signal>; /** * ViewChild that represents the cell template */ readonly cellTemplate: i0.Signal>; /** * A generic class to indicate that this is a currency cell */ cellClass: string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class NgxDateTableCellComponent extends NgxAbstractTableCellDirective { /** * The format of the provided date, by default `dd/MM/yyyy` */ readonly format: i0.InputSignal; /** * The label to display when date is invalid or empty */ readonly emptyLabel: i0.InputSignal; /** * In case the date is nested in an object, we can provide a key to fetch it */ readonly itemKey: i0.InputSignal; /** * In case the date is nested in the row, we can provide a key to fetch it */ readonly rowKey: i0.InputSignal; /** * A template for the header of the cell */ readonly headerTemplate: i0.Signal>; /** * A template for the footer of the cell */ readonly footerTemplate: i0.Signal>; /** * ViewChild that represents the cell template */ readonly cellTemplate: i0.Signal>; /** * A generic class to indicate that this is a date cell */ cellClass: string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare const Cells: (typeof NgxTableCellDirective)[]; interface TableCellTemplate { headerTemplate?: Signal>; cellTemplate?: Signal>; footerTemplate?: Signal>; cellClass?: string; } /** * A customizable and accessible data table component. * * ## Accessibility Guidelines * - **Table Cell Templates**: When defining custom templates via `cellTemplate` or `headerTemplate`, ensure all interactive elements are nested inside a native `