@odx/angular 12.26.1 → 13.0.0

package/components/toast/index.d.ts

@@ -1,5 +1,267 @@
-export * from './lib/components';
-export * from './lib/models';
-export * from './lib/toast.config';
-export * from './lib/toast.module';
-export * from './lib/toast.service';
+import * as i0 from '@angular/core';
+import { Type, AfterViewInit, OnDestroy, OnInit, EventEmitter } from '@angular/core';
+import * as rxjs from 'rxjs';
+import { Observable } from 'rxjs';
+import { DynamicTextContent, DynamicContent, GetDynamicViewContext } from '@odx/angular/cdk/dynamic-view';
+import * as _odx_angular_utils from '@odx/angular/utils';
+import * as i3 from '@odx/angular';
+
+/**
+ * An interface representing an action that can be performed from a toast notification.
+ * Each action includes a label, an optional left and right icon `iconSet::iconName`,
+ * and a function to execute when the action is triggered.
+ */
+interface ToastAction {
+    label: DynamicTextContent;
+    leftIcon?: string;
+    rightIcon?: string;
+    action: () => void;
+}
+
+type ToastVariant = (typeof ToastVariant)[keyof typeof ToastVariant];
+declare const ToastVariant: {
+    readonly DEFAULT: "default";
+    readonly WARNING: "warning";
+    readonly DANGER: "danger";
+    readonly SUCCESS: "success";
+    readonly WARNING_STRONG: "warning-strong";
+    readonly DANGER_STRONG: "danger-strong";
+};
+
+interface Toast {
+    id?: string;
+    title: DynamicTextContent;
+    description?: DynamicContent;
+    descriptionContext?: GetDynamicViewContext<Type<unknown>>;
+    actions?: ToastAction[];
+    variant?: ToastVariant;
+}
+
+interface ToastOptions {
+    dismissable: boolean;
+    duration: number;
+}
+
+interface ToastRef {
+    id: string;
+    item: Toast;
+    options: ToastOptions;
+}
+
+/**
+ * Represents a container component for displaying toast notifications. This component manages and arranges toast messages,
+ * handling animations for entering and leaving toasts. It ensures that only a limited number of toasts are shown at the same time,
+ * based on the `maxItems` input. The container listens for toast events from the `ToastService` to update its list of toasts dynamically.
+ *
+ * The component uses a group of animations to slide toasts in and out smoothly and also provides an output for when a toast is dismissed.
+ * It's designed to integrate with a single instance per application, ensuring no more than one toast container is initialized.
+ */
+declare class ToastContainerComponent implements AfterViewInit, OnDestroy {
+    private static INITIALIZED;
+    private readonly destroyRef;
+    private readonly windowRef;
+    private readonly renderer;
+    private readonly toastService;
+    readonly element: i0.ElementRef<HTMLElement>;
+    readonly items$: Observable<ToastRef[]>;
+    readonly hiddenToasts$: Observable<number>;
+    /**
+     * Maximum number of toasts that can be displayed at once.
+     *
+     * @type {number}
+     * @default 3
+     */
+    maxItems: number;
+    /**
+     * Emits an event when a toast is dismissed.
+     *
+     * @emits {ToastRef} - The toast reference that was dismissed.
+     */
+    readonly dismiss: Observable<ToastRef>;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    protected onDismiss(itemRef: ToastRef): void;
+    private updatePopverPosition;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastContainerComponent, "odx-toast-container", never, { "maxItems": { "alias": "maxItems"; "required": false; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+    static ngAcceptInputType_maxItems: unknown;
+}
+
+/**
+ * A component that represents a single toast notification. This component is responsible for displaying
+ * message content, handling toast actions, and managing the automatic dismissal of the toast based on a duration.
+ * It supports dynamic content for descriptions and can show an optional set of actions.
+ */
+declare class ToastItemComponent implements OnInit {
+    private readonly takeUntilDestroyed;
+    readonly element: i0.ElementRef<HTMLElement>;
+    /**
+     * Determines the icon to display based on the toast's variant.
+     * Returns a string representing the icon class.
+     *
+     * @returns {string} - The icon class name.
+     * @default 'info'
+     */
+    get icon(): string;
+    /**
+     * Unique identifier for the toast item, typically provided for accessibility purposes.
+     *
+     * @required
+     * @type {string}
+     */
+    id: string;
+    /**
+     * The main title of the toast, displayed prominently.
+     *
+     * @required
+     * @type {DynamicTextContent}
+     */
+    title: DynamicTextContent;
+    /**
+     * Optional detailed description for the toast. This can be plain text or a dynamic template.
+     *
+     * @type {DynamicContent | null}
+     */
+    description?: DynamicContent | null;
+    /**
+     * Context for rendering the dynamic component of the description.
+     *
+     * @type {GetDynamicViewContext<Type<unknown>> | undefined}
+     */
+    descriptionContext?: GetDynamicViewContext<Type<unknown>>;
+    /**
+     * The variant of the toast which influences the icon and styling.
+     *
+     * @type {ToastVariant | null}
+     * @default ToastVariant.DEFAULT
+     */
+    variant?: ToastVariant | null;
+    /**
+     * Optional actions related to the toast, such as 'retry' or 'dismiss'.
+     *
+     * @type {ToastAction[] | undefined}
+     */
+    actions?: ToastAction[];
+    /**
+     * Configuration options for the toast, including its duration and dismissal behavior.
+     *
+     * @required
+     * @type {ToastOptions}
+     */
+    options: ToastOptions;
+    /**
+     * Emits an event when the toast is dismissed, either through action or automatically.
+     *
+     * @emits {void}
+     */
+    readonly dismiss: EventEmitter<void>;
+    ngOnInit(): void;
+    protected onDismiss(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastItemComponent, "odx-toast", never, { "id": { "alias": "id"; "required": false; }; "title": { "alias": "title"; "required": false; }; "description": { "alias": "description"; "required": false; }; "descriptionContext": { "alias": "descriptionContext"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "options": { "alias": "options"; "required": false; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+}
+
+/**
+ * Utility functions generated by `createConfigTokens` to handle injection and provision of `ToastConfig`.
+ * These include tokens and functions to access and provide the default configuration for toasts.
+ *
+ * `ToastDefaultConfig` provides the default settings for toasts.
+ * `ToastConfig` is a token that can be used to inject toast configuration settings.
+ * `injectToastConfig` is a function that retrieves the current toast configuration.
+ * `provideToastConfig` is a function used to specify a custom configuration for toasts.
+ *
+ * @example
+ * ```ts
+ * // In module providers:
+ * providers: [
+ *  provideToastConfig({ // ... global module configuration }),
+ * ]
+ *
+ * // In a component or service:
+ * constructor(@Inject(ToastConfig) private readonly config: ToastConfig) {}
+ *
+ * // Or using the `injectToastConfig` function:
+ * @Component({ ... })
+ * export class MyComponent {
+ *  private readonly config = injectToastConfig();
+ * }
+ * ```
+ */
+declare const ToastDefaultConfig: ToastOptions;
+type ToastConfig = ToastOptions;
+declare const ToastConfig: i0.InjectionToken<Partial<ToastOptions>>;
+declare const injectToastConfig: () => ToastOptions;
+declare const provideToastConfig: <D extends _odx_angular_utils.ConfigDependencies = _odx_angular_utils.ConfigDependencies<Partial<ToastOptions>>>(config: _odx_angular_utils.ConfigProvider<Partial<ToastOptions>, D>) => i0.FactoryProvider | i0.ValueProvider;
+
+declare class ToastModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ToastModule, never, [typeof ToastContainerComponent, typeof ToastItemComponent], [typeof i3.CoreModule, typeof ToastContainerComponent, typeof ToastItemComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ToastModule>;
+}
+
+/**
+ * ToastService provides a centralized management system for toasts within an application.
+ * It handles the creation, updates, and dismissal of toasts based on a FIFO (first-in, first-out) queue.
+ * This service integrates custom toast options with default configurations and supports reactive updates through observables.
+ */
+declare class ToastService {
+    private readonly queue;
+    private readonly defaultOptions;
+    /**
+     * Observable stream of active toasts.
+     *
+     * @emits {ToastRef[]} The current list of active toasts.
+     */
+    readonly toasts$: rxjs.Observable<(ToastRef & {
+        id: string | number;
+    })[]>;
+    /**
+     * Observable that emits when any update occurs in the toast queue.
+     *
+     * @emits {ToastRef[]} The updated list of active toasts.
+     */
+    readonly onUpdate$: rxjs.Observable<ToastRef>;
+    /**
+     * Observable that emits when a toast is added.
+     *
+     * @emits {ToastRef} The newly added toast.
+     */
+    readonly onToastAdd$: rxjs.Observable<ToastRef>;
+    /**
+     * Observable that emits when a toast is updated.
+     *
+     * @emits {ToastRef} The updated toast.
+     */
+    readonly onToastUpdate$: rxjs.Observable<ToastRef>;
+    /**
+     * Observable that emits when a toast is removed.
+     *
+     * @emits {ToastRef} The removed toast.
+     */
+    readonly onToastRemove$: rxjs.Observable<ToastRef>;
+    /**
+     * Creates and queues a new toast based on the provided item and options.
+     * Merges given options with default configurations.
+     *
+     * @param {Toast} item The toast item to create.
+     * @param {Partial<ToastOptions>} options Optional additional options for the toast.
+     * @returns {ToastRef} The reference to the newly created toast.
+     */
+    create(item: Toast, options?: Partial<ToastOptions>): ToastRef;
+    /**
+     * Dismisses a specific toast identified by a reference or ID.
+     *
+     * @param {ToastRef | ToastRef['id']} refOrId The reference or ID of the toast to dismiss.
+     * @returns {ToastRef | null} The reference to the dismissed toast, or null if not found.
+     */
+    dismiss(refOrId: ToastRef | ToastRef['id']): ToastRef | null;
+    /**
+     * Dismisses all toasts currently being displayed.
+     */
+    dismissAll(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToastService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ToastService>;
+}
+
+export { ToastConfig, ToastContainerComponent, ToastDefaultConfig, ToastItemComponent, ToastModule, ToastService, ToastVariant, injectToastConfig, provideToastConfig };
+export type { Toast, ToastAction, ToastOptions, ToastRef };

package/components/toggle-button-group/index.d.ts

@@ -1,3 +1,61 @@
-export * from './lib/components';
-export * from './lib/toggle-button-group.component';
-export * from './lib/toggle-button-group.module';
+import * as i0 from '@angular/core';
+import { ElementRef, OnInit, QueryList } from '@angular/core';
+import { RadioControlDirective, RadioGroupControlDirective } from '@odx/angular/cdk/radio-group-control';
+import * as rxjs from 'rxjs';
+import * as i1 from '@odx/angular';
+
+/**
+ * ToggleButtonComponent represents an individual toggle button, akin to a radio button but styled distinctly.
+ * It integrates with Angular's forms as part of a radio group control, allowing for keyboard navigation and
+ * accessibility features. This component is designed to be used within a `ToggleButtonGroupComponent`.
+ *
+ * @template T - The type of the value handled by the toggle button.
+ *
+ * Extends RadioControlDirective to provide additional behavior.
+ *
+ * @see {RadioControlDirective}
+ */
+declare class ToggleButtonComponent<T = unknown> extends RadioControlDirective<T> {
+    protected inputElement: ElementRef<HTMLInputElement>;
+    readonly element: ElementRef<HTMLElement>;
+    /**
+     * Sets focus to the input element of the toggle button.
+     */
+    focus(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleButtonComponent<any>, "odx-toggle-button", never, {}, {}, never, ["*"], true, never>;
+}
+
+/**
+ * ToggleButtonGroupComponent acts as a container for a group of toggle buttons,
+ * managing their state and focus within a group context.
+ *
+ * @template T - The type of the value handled by the toggle buttons.
+ *
+ * It extends the RadioGroupControlDirective, allowing it to control the selection and state
+ * of contained toggle buttons similar to how radio buttons are managed.
+ *
+ * Has host directive DelegateFocusDirective.
+ *
+ * @see {RadioGroupControlDirective}
+ * @see {DelegateFocusDirective}
+ */
+declare class ToggleButtonGroupComponent<T = unknown> extends RadioGroupControlDirective<T> implements OnInit {
+    private readonly delegateFocusDirective;
+    private readonly takeUntilDestroyed;
+    protected activeElement$: rxjs.Observable<HTMLElement | null>;
+    protected toggleButtons: QueryList<ToggleButtonComponent>;
+    readonly element: i0.ElementRef<HTMLElement>;
+    ngOnInit(): void;
+    private getFirstToggleButton;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonGroupComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleButtonGroupComponent<any>, "odx-toggle-button-group", never, {}, {}, ["toggleButtons"], ["odx-toggle-button"], true, [{ directive: typeof i1.DelegateFocusDirective; inputs: {}; outputs: {}; }]>;
+}
+
+declare class ToggleButtonGroupModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonGroupModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleButtonGroupModule, never, [typeof ToggleButtonGroupComponent, typeof ToggleButtonComponent], [typeof i1.CoreModule, typeof ToggleButtonGroupComponent, typeof ToggleButtonComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ToggleButtonGroupModule>;
+}
+
+export { ToggleButtonComponent, ToggleButtonGroupComponent, ToggleButtonGroupModule };

package/components/tooltip/index.d.ts

@@ -1,7 +1,204 @@
-export * from './lib/directives';
-export * from './lib/directives/tooltip-disabled-focusable.directive';
-export * from './lib/helpers';
-export * from './lib/models';
-export * from './lib/tooltip.component';
-export * from './lib/tooltip.config';
-export * from './lib/tooltip.directive';
+import * as i0 from '@angular/core';
+import { AfterViewInit, OnDestroy, Injector, Type, OnInit, OnChanges } from '@angular/core';
+import { ConnectedOverlayOptions } from '@odx/angular/cdk/connected-overlay';
+import { DynamicContent } from '@odx/angular/cdk/dynamic-view';
+import * as _odx_angular_utils from '@odx/angular/utils';
+import { NgChanges } from '@odx/angular/utils';
+
+/**
+ * Enables tooltips on disabled elements by implementing a "soft disabled" state.
+ *
+ * Some projects require descriptive tooltips on disabled elements. Since the `disabled`
+ * attribute natively blocks all interaction, this directive implements a focusable
+ * disabled state that allows tooltips to function while preventing actual operation.
+ * Although the element regains focusable state, it remains non-operable.
+ */
+declare class TooltipDisabledFocusable implements AfterViewInit, OnDestroy {
+    static readonly attributeName = "data-disabled-focusable";
+    private readonly element;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    protected onClick(event: MouseEvent): void;
+    protected onKeydown(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipDisabledFocusable, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipDisabledFocusable, "[odxTooltip][disabled]", never, {}, {}, never, never, true, never>;
+}
+
+type TooltipSize = typeof TooltipSize[keyof typeof TooltipSize];
+declare const TooltipSize: {
+    readonly AUTO: "auto";
+    readonly SMALL: "small";
+    readonly MEDIUM: "medium";
+    readonly LARGE: "large";
+};
+
+type TooltipTrigger = 'hover' | 'click';
+
+interface TooltipOptions extends Pick<ConnectedOverlayOptions, 'position' | 'matchReferenceWidth'> {
+    trigger: TooltipTrigger;
+    delayIn: number;
+    delayOut: number;
+    size: TooltipSize;
+}
+declare const DefaultTooltipOptions: TooltipOptions;
+
+/**
+ * @internal
+ * Resolves the appropriate event names for the provided tooltip trigger.
+ *
+ * @param {TooltipTrigger} trigger - The trigger to resolve.
+ * @returns {[string, string | null]} - The event names for the trigger.
+ */
+declare function resolveTooltipTriggerEvents(trigger: TooltipTrigger): [string, string | null];
+
+/**
+ /**
+ * TooltipComponent displays contextual information related to an element when the user hovers over
+ * or focuses on the element. It supports dynamic content and can be styled with different sizes.
+ *
+ * The component uses dynamic content rendering to provide flexible display options including text,
+ * templates, or even other Angular components, making it highly customizable.
+ */
+declare class TooltipComponent {
+    private readonly config;
+    protected readonly injector: Injector;
+    readonly element: i0.ElementRef<HTMLElement>;
+    /**
+     * The ID attribute of the tooltip, used for accessibility purposes to link the tooltip with its owner element.
+     *
+     * @type {string | null}
+     * @default null
+     */
+    id: string | null;
+    /**
+     * The content to be displayed within the tooltip. This can be text, a template reference, or a dynamic component.
+     *
+     * @type {DynamicContent | null}
+     */
+    content?: Exclude<DynamicContent, Type<unknown>> | null;
+    /**
+     * Determines the size of the tooltip. It can adjust based on the content size or be set to specific dimensions.
+     * The size influences the CSS class applied to the tooltip, allowing for custom styles.
+     *
+     * @type {TooltipSize}
+     * @default TooltipSize.AUTO from the configuration
+     */
+    size: TooltipSize;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TooltipComponent, "odx-tooltip", never, { "id": { "alias": "id"; "required": false; }; "content": { "alias": "content"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Utility functions generated by `createConfigTokens` to handle injection and provision of `TooltipConfig`.
+ * These include tokens and functions to access and provide the default configuration for tooltips.
+ *
+ * `TooltipDefaultConfig` provides the default settings for tooltips.
+ * `TooltipConfig` is a token that can be used to inject tooltip configuration settings.
+ * `injectTooltipConfig` is a function that retrieves the current tooltip configuration.
+ * `provideTooltipConfig` is a function used to specify a custom configuration for tooltips.
+ *
+ * @example
+ * ```ts
+ * // In module providers:
+ * providers: [
+ *  provideTooltipConfig({ // ... global module configuration }),
+ * ]
+ *
+ * // In a component or service:
+ * constructor(@Inject(TooltipConfig) private readonly config: TooltipConfig) {}
+ *
+ * // Or using the `injectTooltipConfig` function:
+ * @Component({ ... })
+ * export class MyComponent {
+ *  private readonly config = injectTooltipConfig();
+ * }
+ * ```
+ */
+declare const TooltipDefaultConfig: TooltipOptions;
+type TooltipConfig = TooltipOptions;
+declare const TooltipConfig: i0.InjectionToken<Partial<TooltipOptions>>;
+declare const injectTooltipConfig: () => TooltipOptions;
+declare const provideTooltipConfig: <D extends _odx_angular_utils.ConfigDependencies = _odx_angular_utils.ConfigDependencies<Partial<TooltipOptions>>>(config: _odx_angular_utils.ConfigProvider<Partial<TooltipOptions>, D>) => i0.FactoryProvider | i0.ValueProvider;
+
+/**
+ * TooltipDirective manages tooltips for host elements by creating overlay components dynamically.
+ * It provides configuration options such as content, delay timings, visibility, and tooltip sizing.
+ * This directive uses Angular's connected overlay system to position and manage tooltip visibility.
+ */
+declare class TooltipDirective implements OnInit, OnChanges, OnDestroy {
+    private readonly eventManager;
+    private readonly connectedOverlayService;
+    private readonly showTrigger$$;
+    private readonly hideTrigger$$;
+    private readonly document;
+    private readonly injector;
+    private readonly ngZone;
+    private connectedOverlayRef;
+    private tooltipOptions;
+    private ignoreNextTooltipTrigger;
+    protected tooltipId: string | null;
+    readonly element: i0.ElementRef<HTMLElement>;
+    /**
+     * Input for dynamic content to display in the tooltip.
+     * This content is reactive and can change dynamically.
+     *
+     * @type {DynamicContent | null}
+     * @default null
+     */
+    content?: Exclude<DynamicContent, Type<unknown>> | null;
+    /**
+     * Controls whether the tooltip is disabled. A disabled tooltip will not be displayed.
+     *
+     * @type {boolean}
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Configuration options for the tooltip.
+     * It allows setting various behaviors like delay and positioning.
+     *
+     * @param {Partial<TooltipOptions> | null | undefined}
+     */
+    set options(value: Partial<TooltipOptions> | null | undefined);
+    /**
+     * Sets the size of the tooltip.
+     *
+     * @type {TooltipSize}
+     * @default null
+     */
+    size?: TooltipSize | null;
+    /**
+     * Controls the visibility of the tooltip.
+     * Useful for programmatically toggling the tooltip display.
+     *
+     * @type {boolean}
+     * @default false
+     */
+    visible: boolean;
+    /**
+     * Indicates whether the tooltip is currently open.
+     *
+     * @returns {boolean}
+     */
+    get isOpen(): boolean;
+    constructor();
+    ngOnInit(): void;
+    ngOnChanges(changes: NgChanges<TooltipDirective>): void;
+    ngOnDestroy(): void;
+    /**
+     * Shows the tooltip, creating and attaching the overlay to the host element.
+     */
+    show(): void;
+    /**
+     * Hides the tooltip, detaching the overlay from the host element.
+     */
+    hide(force?: boolean): void;
+    private registerEvents;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TooltipDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipDirective, "[odxTooltip]", ["odxTooltip"], { "content": { "alias": "odxTooltip"; "required": false; }; "disabled": { "alias": "odxTooltipDisabled"; "required": false; }; "options": { "alias": "odxTooltipOptions"; "required": false; }; "size": { "alias": "odxTooltipSize"; "required": false; }; "visible": { "alias": "odxTooltipVisible"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_visible: unknown;
+}
+
+export { DefaultTooltipOptions, TooltipComponent, TooltipConfig, TooltipDefaultConfig, TooltipDirective, TooltipDisabledFocusable, TooltipSize, injectTooltipConfig, provideTooltipConfig, resolveTooltipTriggerEvents };
+export type { TooltipOptions, TooltipTrigger };