@odx/angular 12.26.1 → 13.0.1

package/animations/lib/config.d.ts

@@ -1,7 +0,0 @@
-export declare const DEFAULT_ANIMATION_TIMING_FN = "ease";
-export declare const DEFAULT_ANIMATION_DURATION = "250ms";
-export declare const DEFAULT_ANIMATION_PARAMS: {
-    timingFn: string;
-    duration: string;
-    delay: string;
-};

package/animations/lib/expand.d.ts

@@ -1,46 +0,0 @@
-/**
- * Animation for smoothly expanding an element from height 0 to its natural height.
- * It transitions the element's height, padding, margin, and opacity from a collapsed state to an expanded state,
- * making the element smoothly grow into view.
- *
- * The `expand` animation uses `DEFAULT_ANIMATION_PARAMS` for its default parameters, which can be overridden
- * when using the animation.
- *
- * @example
- * ```ts
- * // Example usage in an Angular component
- * import { expand, collapse } from '@odx/angular/animations';
- *
- * @Component({
- *   selector: 'my-expandable-component',
- *   templateUrl: './expandable-component.html',
- *   animations: [
- *     trigger('expandCollapse', [
- *       transition('collapsed => expanded', useAnimation(expand)),
- *       transition('expanded => collapsed', useAnimation(collapse)),
- *     ])
- *   ]
- * })
- * export class ExpandableComponent {
- *   state = 'collapsed';
- *
- *   toggle(): void {
- *     this.state = this.state === 'collapsed' ? 'expanded' : 'collapsed';
- *   }
- * }
- * ```
- *
- * The animation smoothly transitions various properties (height, padding, margin, and opacity) and is controlled
- * through parameters defined in `DEFAULT_ANIMATION_PARAMS` or those provided during usage.
- */
-export declare const expand: import("@angular/animations").AnimationReferenceMetadata;
-/**
- * Animation for smoothly collapsing an element from its natural height to height 0.
- * It transitions the element's height, padding, margin, and opacity from an expanded state to a collapsed state,
- * making the element smoothly shrink out of view.
- *
- * The `collapse` animation also uses `DEFAULT_ANIMATION_PARAMS` for its default parameters, which can be overridden
- * when using the animation. It's designed to be used in conjunction with the `expand` animation for creating
- * expandable/collapsible elements.
- */
-export declare const collapse: import("@angular/animations").AnimationReferenceMetadata;

package/animations/lib/fade.d.ts

@@ -1,76 +0,0 @@
-/**
- * Generates a fadeIn animation with customizable opacity target.
- * This animation gradually changes the element's opacity from 0 to a specified value, creating a "fade in" visual effect.
- *
- * @param {number} to - The final opacity value of the element at the end of the animation. Defaults to 1 (fully opaque).
- * @returns {AnimationReferenceMetadata} An Angular animation object that can be used with Angular's animation system.
- *
- * @example
- * ```ts
- * // Example usage in an Angular component with a fadeIn animation
- * import { fadeIn } from '@odx/angular/animations';
- * import { trigger, transition, useAnimation } from '@angular/animations';
- *
- * @Component({
- *   selector: 'app-fade-in-example',
- *   template: `
- *      @if(isVisible) {
- *       <div @fadeInAnimation>Fade In Content</div>
- *      }
- *       <button (click)="showContent()">Show Content</button>`,
- *   animations: [
- *     trigger('fadeInAnimation', [
- *       transition(':enter', useAnimation(fadeIn(), { params: { duration: '500ms' } }))
- *     ])
- *   ]
- * })
- * export class FadeInExampleComponent {
- *   isVisible = false;
- *
- *   showContent(): void {
- *     this.isVisible = true;
- *   }
- * }
- * ```
- *
- * This example demonstrates how to apply the fadeIn animation to an element, making it smoothly appear on the screen.
- */
-export declare const fadeIn: (to?: number) => import("@angular/animations").AnimationReferenceMetadata;
-/**
- * Generates a fadeOut animation with customizable opacity target.
- * This animation gradually changes the element's opacity from its current value to a specified value, creating a "fade out" visual effect.
- *
- * @param {number} to - The target opacity value of the element at the end of the animation. Defaults to 0 (fully transparent).
- * @returns {AnimationReferenceMetadata} An Angular animation object that can be used with Angular's animation system.
- *
- * @example
- * ```ts
- * // Example usage in an Angular component with a fadeOut animation
- * import { fadeOut } from '@odx/angular/animations';
- * import { trigger, transition, useAnimation } from '@angular/animations';
- *
- * @Component({
- *   selector: 'app-fade-out-example',
- *   template: `
- *      @if(isVisible) {
- *      <div @fadeOutAnimation>Fade Out Content</div>
- *      }
- *      <button (click)="hideContent()">Hide Content</button>`,
- *   animations: [
- *     trigger('fadeOutAnimation', [
- *       transition(':leave', useAnimation(fadeOut(), { params: { duration: '500ms' } }))
- *     ])
- *   ]
- * })
- * export class FadeOutExampleComponent {
- *   isVisible = true;
- *
- *   hideContent(): void {
- *     this.isVisible = false;
- *   }
- * }
- * ```
- *
- * This example demonstrates how to apply the fadeOut animation to an element, making it smoothly disappear from the screen.
- */
-export declare const fadeOut: (to?: number) => import("@angular/animations").AnimationReferenceMetadata;

package/animations/lib/slide.d.ts

@@ -1,34 +0,0 @@
-import { AnimationReferenceMetadata } from '@angular/animations';
-/**
- * Utility functions for creating slide-in and slide-out animations in specific directions.
- * These include slideInX, slideInY, slideInDown, slideInUp, slideInLeft, slideInRight,
- * slideOutX, slideOutY, slideOutDown, slideOutUp, slideOutLeft, and slideOutRight.
- * Each function is configured for a specific slide direction and distance, making it easy to apply
- * consistent slide animations across your application.
- *
- * @example
- * ```ts
- * // Using slideInLeft and slideOutRight in a component
- * animations: [
- *   trigger('slideInOut', [
- *     transition(':enter', [useAnimation(slideInLeft)]),
- *     transition(':leave', [useAnimation(slideOutRight)])
- *   ])
- * ]
- * ```
- *
- * Note: The 'from' and 'to' parameters for slideIn and slideOut functions respectively
- * can be customized for different slide distances.
- */
-export declare const slideInX: (from: string) => AnimationReferenceMetadata;
-export declare const slideInY: (from: string) => AnimationReferenceMetadata;
-export declare const slideInDown: AnimationReferenceMetadata;
-export declare const slideInUp: AnimationReferenceMetadata;
-export declare const slideInLeft: AnimationReferenceMetadata;
-export declare const slideInRight: AnimationReferenceMetadata;
-export declare const slideOutX: (to: string) => AnimationReferenceMetadata;
-export declare const slideOutY: (to: string) => AnimationReferenceMetadata;
-export declare const slideOutDown: AnimationReferenceMetadata;
-export declare const slideOutUp: AnimationReferenceMetadata;
-export declare const slideOutLeft: AnimationReferenceMetadata;
-export declare const slideOutRight: AnimationReferenceMetadata;

package/animations/lib/wait-for-child-animations.d.ts

@@ -1,39 +0,0 @@
-/**
- * Utility animation that waits for animations on child components to complete.
- * This animation should be used within parent components that have child components with their
- * own animations. It ensures that the parent's enter and leave animations are only triggered
- * after all child animations have completed, creating a seamless animation sequence.
- *
- * This utility uses Angular's animation functions `query` and `animateChild` to find and animate
- * child elements marked with Angular's animation triggers. The `{ optional: true }` parameter
- * ensures that the animation gracefully handles cases where no child animations are defined.
- *
- * @example
- * ```ts
- * // Using waitForChildAnimations in a parent component with children that have animations
- * import { trigger, transition, style, animate, query, animateChild } from '@angular/animations';
- * import { waitForChildAnimations } from '@odx/angular/animations';
- *
- * @Component({
- *   selector: 'app-parent',
- *   templateUrl: './parent.component.html',
- *   animations: [
- *     trigger('parentAnimation', [
- *       // Define parent animations here
- *       transition(':enter', [style({ opacity: 0 }), animate('0.5s ease-in', style({ opacity: 1 }))]),
- *       transition(':leave', [animate('0.5s ease-out', style({ opacity: 0 }))]),
- *       // Use waitForChildAnimations for coordinating with child animations
- *       waitForChildAnimations
- *     ])
- *   ]
- * })
- * export class ParentComponent {
- *   // Component logic here
- * }
- * ```
- *
- * Note: The `waitForChildAnimations` utility is added to the parent component's animation triggers,
- * ensuring that any child component animations are completed before continuing with the parent's
- * own animations.
- */
-export declare const waitForChildAnimations: import("@angular/animations").AnimationTransitionMetadata;

package/breakpoints/lib/breakpoints.config.d.ts

@@ -1,59 +0,0 @@
-/**
- * Defines default responsive breakpoints for the application. These breakpoints are used to
- * apply responsive styles and behaviors across various device sizes. Each breakpoint is
- * configured with a name, a minimum width, and a maximum width, defining the range of device
- * sizes it targets.
- *
- * @constant
- * @type {Record<string, string>}
- *
- * @example
- * ```ts
- * // Accessing a breakpoint value
- * console.log(DEFAULT_BREAKPOINTS['=phone']); // Outputs: "(min-width: 480px) and (max-width: 767px)"
- * ```
- */
-export declare const DEFAULT_BREAKPOINTS: {
-    readonly "<desktop": string;
-    readonly "=desktop": string;
-    readonly ">desktop": string;
-    readonly "<desktop-s": string;
-    readonly "=desktop-s": string;
-    readonly ">desktop-s": string;
-    readonly "<tablet": string;
-    readonly "=tablet": string;
-    readonly ">tablet": string;
-    readonly "<phone": string;
-    readonly "=phone": string;
-    readonly ">phone": string;
-    readonly "<phone-s": string;
-    readonly "=phone-s": string;
-    readonly ">phone-s": string;
-};
-export interface BreakpointsConfig {
-    breakpoints: Partial<OdxAngular.Breakpoints>;
-}
-/**
- * Provides Angular dependency injection tokens for accessing and configuring breakpoints
- * within the application. This enables a type-safe and modular way to manage responsive
- * design breakpoints across the app.
- *
- * @example
- * ```ts
- * // Providing custom breakpoints in an Angular module
- * import { NgModule } from '@angular/core';
- * import { provideBreakpointsConfig } from '@odx/angular/breakpoints';
- *
- * @NgModule({
- *   providers: [
- *     provideBreakpointsConfig({
- *       breakpoints: {
- *         ...configureBreakpoint('custom-tablet', 640, 1024),
- *       },
- *     }),
- *   ],
- * })
- * export class CustomModule {}
- * ```
- */
-export declare const BreakpointsConfig: import("@angular/core").InjectionToken<Partial<BreakpointsConfig>>, BreakpointsDefaultConfig: BreakpointsConfig, injectBreakpointsConfig: () => BreakpointsConfig, provideBreakpointsConfig: <D extends import("@odx/angular/utils").ConfigDependencies = import("@odx/angular/utils").ConfigDependencies<Partial<BreakpointsConfig>>>(config: import("@odx/angular/utils").ConfigProvider<Partial<BreakpointsConfig>, D>) => import("@angular/core").FactoryProvider | import("@angular/core").ValueProvider;

package/breakpoints/lib/breakpoints.module.d.ts

@@ -1,7 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./directives/match-breakpoints.directive";
-export declare class BreakpointsModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<BreakpointsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<BreakpointsModule, never, [typeof i1.MatchBreakpointsDirective], [typeof i1.MatchBreakpointsDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<BreakpointsModule>;
-}

package/breakpoints/lib/breakpoints.service.d.ts

@@ -1,56 +0,0 @@
-import { Observable } from 'rxjs';
-import { BreakpointName } from './models';
-import * as i0 from "@angular/core";
-/**
- * Service to observe and react to changes in viewport size based on predefined breakpoints.
- * Utilizes Angular CDK's BreakpointObserver for listening to media query changes and integrates
- * it with the application's custom breakpoints configuration.
- *
- * @Injectable({ providedIn: 'root' })
- */
-export declare class BreakpointsService {
-    private readonly breakpointObserver;
-    private readonly config;
-    /**
-     * Observes the specified breakpoints and returns an Observable that emits true if any
-     * of the specified breakpoints match the current viewport size, and false otherwise.
-     *
-     * @param {BreakpointName[]} breakpoints - An array of breakpoints to observe.
-     * @returns {Observable<boolean>} - An Observable that emits true if the viewport matches the specified breakpoints.
-     *
-     * @example
-     * ```ts
-     * // Component that uses BreakpointsService to apply dynamic styles based on breakpoints
-     * @Component({
-     *   selector: 'app-responsive-component',
-     *   templateUrl: './responsive-component.component.html',
-     * })
-     * export class ResponsiveComponent {
-     *   isMobile$: Observable<boolean>;
-     *
-     *   constructor(private breakpointsService: BreakpointsService) {
-     *     this.isMobile$ = this.breakpointsService.observe(['phone', 'tablet']);
-     *   }
-     * }
-     * ```
-     */
-    observe(breakpoints: BreakpointName[]): Observable<boolean>;
-    /**
-     * Checks if any of the specified breakpoints match the current viewport size.
-     *
-     * @param {BreakpointName[]} breakpoints - An array of breakpoints to check.
-     * @returns {boolean} - Returns true if the viewport matches the specified breakpoints, false otherwise.
-     *
-     * @example
-     * ```ts
-     * // Checking if the current viewport matches the 'desktop' breakpoint
-     * const isDesktop = this.breakpointsService.matches(['desktop']);
-     * console.log(`Is desktop view? ${isDesktop}`);
-     * ```
-     */
-    matches(breakpoints: BreakpointName[]): boolean;
-    private getMediaQueries;
-    private createBreakpointObserver;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BreakpointsService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<BreakpointsService>;
-}

package/breakpoints/lib/breakpoints.typings.d.ts

@@ -1,8 +0,0 @@
-import { DEFAULT_BREAKPOINTS } from './breakpoints.config';
-declare global {
-    namespace OdxAngular {
-        interface Breakpoints extends Record<keyof typeof DEFAULT_BREAKPOINTS, string> {
-        }
-    }
-}
-export {};

package/breakpoints/lib/directives/index.d.ts

@@ -1 +0,0 @@
-export * from './match-breakpoints.directive';

package/breakpoints/lib/directives/match-breakpoints.directive.d.ts

@@ -1,52 +0,0 @@
-import { OnInit, TemplateRef } from '@angular/core';
-import { BreakpointName } from '../models';
-import * as i0 from "@angular/core";
-/**
- * A structural directive that conditionally includes an Angular template based on whether the viewport matches
- * specified breakpoints. It leverages the BreakpointsService to observe changes in viewport size and apply
- * the appropriate template.
- *
- * @Directive
- * @param {BreakpointsService} breakpointsService - Injects BreakpointsService to observe breakpoint changes.
- * @param {TemplateRef} template - Injects the Angular template to render when breakpoints match.
- * @param {ViewContainerRef} viewContainer - Injects the container where the template will be rendered.
- *
- * @example
- * ```html
- * // Usage in a component template to conditionally display content based on breakpoints
- * // Assume 'mobile' and 'tablet' are defined breakpoints
- * <ng-template [odxMatchBreakpoints]="['mobile', 'tablet']">
- *   Content to display on mobile and tablet sizes.
- * </ng-template>
- * <ng-template [odxMatchBreakpoints]="['desktop']" [odxMatchBreakpointsElse]="elseTemplate">
- *   Content to display on desktop size.
- * </ng-template>
- * <ng-template #elseTemplate>
- *   Content to display when not on desktop size.
- * </ng-template>
- * ```
- */
-export declare class MatchBreakpointsDirective implements OnInit {
-    private readonly breakpoints$$;
-    private readonly breakpointsService;
-    private readonly takeUntilDestroyed;
-    private readonly template;
-    private readonly viewContainer;
-    /**
-     * Sets the breakpoints to observe. The directive's content is displayed if the current viewport matches
-     * any of the specified breakpoints.
-     *
-     * @param {BreakpointName | BreakpointName[]} value - The breakpoint(s) to match against the current viewport size.
-     */
-    set breakpoints(value: BreakpointName | BreakpointName[] | null | undefined);
-    /**
-     * Optionally specifies a template to render when the viewport does not match the specified breakpoints.
-     *
-     * @param {TemplateRef<unknown>} elseTemplate - The template to render when the viewport does not match the breakpoints.
-     */
-    elseTemplate?: TemplateRef<unknown> | null;
-    ngOnInit(): void;
-    private render;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MatchBreakpointsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MatchBreakpointsDirective, "ng-template[odxMatchBreakpoints]", never, { "breakpoints": { "alias": "odxMatchBreakpoints"; "required": false; }; "elseTemplate": { "alias": "odxMatchBreakpointsElse"; "required": false; }; }, {}, never, never, true, never>;
-}

package/breakpoints/lib/helpers/configure-breakpoint.d.ts

@@ -1,23 +0,0 @@
-type BreakpointOperators = '<' | '=' | '>';
-type BreakpointConfig<T extends string> = Record<`${BreakpointOperators}${T}`, string>;
-/**
- * Generates a configuration object containing CSS media query strings for a named breakpoint.
- * The function creates media queries for three scenarios: below (`<`), exactly (`=`), and above (`>`) the specified breakpoint.
- *
- * @template T - The string literal type representing the name of the breakpoint.
- * @param {T} name - The name of the breakpoint (e.g., 'md' for medium).
- * @param {number} min - The minimum width (inclusive) where the breakpoint starts.
- * @param {number} max - The maximum width (exclusive) where the breakpoint ends.
- * @returns {BreakpointConfig<T>} An object containing media query strings for targeting screen sizes relative to the breakpoint.
- *
- * @example
- * ```ts
- * // Define a medium (md) breakpoint
- * const mdBreakpoint = configureBreakpoint('md', 768, 1024);
- * console.log(mdBreakpoint['<md']); // Outputs: "(max-width: 767px)"
- * console.log(mdBreakpoint['=md']); // Outputs: "(min-width: 768px) and (max-width: 1023px)"
- * console.log(mdBreakpoint['>md']); // Outputs: "(min-width: 768px)"
- * ```
- */
-export declare function configureBreakpoint<T extends string>(name: T, min: number, max: number): BreakpointConfig<T>;
-export {};

package/breakpoints/lib/helpers/index.d.ts

@@ -1 +0,0 @@
-export * from './configure-breakpoint';

package/breakpoints/lib/models/breakpoint.d.ts

@@ -1,5 +0,0 @@
-export type BreakpointName = keyof OdxAngular.Breakpoints;
-export interface Breakpoint {
-    min: number;
-    max: number;
-}

package/breakpoints/lib/models/index.d.ts

@@ -1 +0,0 @@
-export * from './breakpoint';

package/cdk/a11y/lib/a11y.module.d.ts

@@ -1,11 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/cdk/a11y";
-import * as i2 from "./directives/list-focus-manager.directive";
-import * as i3 from "./directives/list-focus-manager-option.directive";
-import * as i4 from "./directives/interactive.directive";
-import * as i5 from "@odx/angular";
-export declare class A11yModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<A11yModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<A11yModule, never, [typeof i1.A11yModule, typeof i2.ListFocusManagerDirective, typeof i3.ListFocusManagerOptionDirective, typeof i4.InteractiveDirective], [typeof i5.CoreModule, typeof i1.A11yModule, typeof i2.ListFocusManagerDirective, typeof i3.ListFocusManagerOptionDirective, typeof i4.InteractiveDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<A11yModule>;
-}

package/cdk/a11y/lib/directives/index.d.ts

@@ -1,3 +0,0 @@
-export * from './interactive.directive';
-export * from './list-focus-manager-option.directive';
-export * from './list-focus-manager.directive';

package/cdk/a11y/lib/directives/interactive.directive.d.ts

@@ -1,43 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@odx/angular";
-/**
- * Directive that makes an element interactive, responding to click, Enter key, and Space key events.
- * It automatically handles the disabled state through `DisabledController`, inhibiting interactions when disabled.
- * This directive can be useful for creating custom buttons or interactive elements that are not natively interactive,
- * such as divs or custom components.
- *
- * @Directive
- * @CSSComponent cdk-interactive - A CSS Component class that can be targeted for styling interactive elements.
- * @selector '[odxCdkInteractive]' - Applies this directive to any element with the 'odxCdkInteractive' attribute.
- * @hostDirectives {WithDisabledState, WithTabIndex} - Applies disabled state and tab index handling.
- * @host role='button' - Assigns a role of 'button' to the host element for accessibility.
- *
- * @example
- * Applying the directive to a div element to make it interactive:
- * ```html
- * <div odxCdkInteractive (odxCdkInteractive)="onInteract($event)">
- *   Click or press Enter/Space to interact
- * </div>
- * ```
- *
- * @example
- * Using the directive on a custom Angular component
- * ```html
- * <app-custom-button odxCdkInteractive (odxCdkInteractive)="onCustomButtonInteract($event)">
- * </app-custom-button>
- * ```
- */
-export declare class InteractiveDirective {
-    private readonly disabledController;
-    readonly element: import("@angular/core").ElementRef<HTMLElement>;
-    /**
-     * Emits an event when the element is interacted with via click, Enter key, or Space key.
-     *
-     * @emits {MouseEvent | KeyboardEvent} - The event that triggered the interaction.
-     */
-    interact: EventEmitter<MouseEvent | KeyboardEvent>;
-    protected handleEvents(event: MouseEvent | KeyboardEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InteractiveDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<InteractiveDirective, "[odxCdkInteractive]", never, {}, { "interact": "odxCdkInteractive"; }, never, never, true, [{ directive: typeof i1.WithDisabledState; inputs: {}; outputs: {}; }, { directive: typeof i1.WithTabIndex; inputs: {}; outputs: {}; }]>;
-}

package/cdk/a11y/lib/directives/list-focus-manager-option.directive.d.ts

@@ -1,34 +0,0 @@
-import { FocusableOption } from '@angular/cdk/a11y';
-import * as i0 from "@angular/core";
-/**
- * Directive to make an element focusable as part of a list, integrating with Angular CDK's FocusKeyManager.
- * It listens to the disabled state controlled by `DisabledController` to manage focus correctly based on
- * the enabled state of the element.
- *
- * @example
- * In a component template, apply this directive to list items that should be focusable and managed by a FocusKeyManager:
- * ```html
- * @for(item of items; track item) {
- * <li odxListFocusManagerOption>
- *   {{ item }}
- * </li>
- * }
- * ```
- */
-export declare class ListFocusManagerOptionDirective implements FocusableOption {
-    private readonly disabledController;
-    private readonly element;
-    /**
-     * Reflects the disabled state of the element, managed by `DisabledController`.
-     * If disabled, the element is not focusable.
-     *
-     * @returns {boolean} True if the directive's host element is disabled.
-     */
-    get disabled(): boolean;
-    /**
-     * Focuses the host element. If the element is disabled, it will not be focused.
-     */
-    focus(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ListFocusManagerOptionDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ListFocusManagerOptionDirective, "[odxListFocusManagerOption]", never, {}, {}, never, never, true, never>;
-}

package/cdk/a11y/lib/directives/list-focus-manager.directive.d.ts

@@ -1,31 +0,0 @@
-import { AfterContentInit, OnDestroy, QueryList } from '@angular/core';
-import { ListFocusManagerOptionDirective } from './list-focus-manager-option.directive';
-import * as i0 from "@angular/core";
-/**
- * Directive that sets up keyboard navigation for a list or a group of focusable elements.
- * Utilizes `FocusKeyManager` from Angular CDK to manage focus among items.
- * It automatically skips disabled items and wraps around when navigating past the first or last item.
- * Handles keydown events to navigate through the focusable options.
- *
- * @example
- * In a component template, use this directive on a container element and `odxListFocusManagerOption`
- * on each focusable list item:
- * ```html
- * <ul odxListFocusManager>
- *   @for(item of items; track item) {
- *   <li odxListFocusManagerOption>
- *     {{ item }}
- *   </li>
- *   }
- * </ul>
- * ```
- */
-export declare class ListFocusManagerDirective implements AfterContentInit, OnDestroy {
-    private keyManager;
-    protected options: QueryList<ListFocusManagerOptionDirective>;
-    ngAfterContentInit(): void;
-    ngOnDestroy(): void;
-    protected onKeyDown(event: KeyboardEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ListFocusManagerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ListFocusManagerDirective, "[odxListFocusManager]", never, {}, {}, ["options"], never, true, never>;
-}

package/cdk/active-indicator/lib/active-indicator.directive.d.ts

@@ -1,90 +0,0 @@
-import { AfterViewInit, OnChanges } from '@angular/core';
-import { NgChanges } from '@odx/angular/utils';
-import { ActiveIndicatorPosition } from './models';
-import { ActiveIndicatorDirection } from './models/active-indicator-direction';
-import * as i0 from "@angular/core";
-/**
- * `ActiveIndicatorDirective` is designed to adjust an indicator's position and size dynamically to highlight
- * the active element within a container. It's useful for tabs, menus, or any list where an active state is visually represented.
- * The directive can be customized to align the indicator based on the active element's position and supports
- * both horizontal and vertical orientations.
- *
- * To use this directive, apply it to the element you want to use as an active indicator.
- * Then, bind the active element using the `odxActiveIndicator` input. Optionally, specify
- * the container element with `odxActiveIndicatorParent` if the container is not the immediate parent of the indicator.
- *
- * @example
- * ```html
- * <div class="tabs-container" #tabsContainer>
- *   @for(tab of tabs; track tab.id) {
- *   <div class="tab" [class.active]="tab.isActive" #tabElement>{{ tab.label }}</div>
- *   }
- *   <div class="indicator" [odxActiveIndicator]="activeTabElement" [odxActiveIndicatorParent]="tabsContainer"></div>
- * </div>
- * ```
- *
- * ```ts
- * @Component({
- *   selector: 'app-tabs',
- *   templateUrl: './tabs.component.html',
- *   imports: [ActiveIndicatorDirective, NgForOf],
- * })
- * export class TabsComponent {
- *   tabs = [{ label: 'Tab 1', isActive: true }, { label: 'Tab 2', isActive: false }];
- *   @ViewChildren('tabElement') tabElements?: QueryList<ElementRef>;
- *   @ViewChild('tabsContainer') tabsContainer!: ElementRef;
- *
- *   get activeTabElement(): HTMLElement {
- *     const activeTab = this.tabElements?.find((tab) => tab.nativeElement.classList.contains('active'));
- *     return activeTab ? activeTab.nativeElement : null;
- *   }
- * }
- * ```
- */
-export declare class ActiveIndicatorDirective implements OnChanges, AfterViewInit {
-    private readonly takeUntilDestroyed;
-    private readonly parentElement$$;
-    private readonly onResize$;
-    readonly element: import("@angular/core").ElementRef<HTMLElement>;
-    /**
-     * Indicates whether the element is active or not.
-     *
-     * @type {boolean}
-     */
-    isActive: boolean;
-    /**
-     * The currently active element to which the indicator should align.
-     * It dynamically updates the indicator's position and size based on this element.
-     *
-     * @type {HTMLElement | null}
-     */
-    activeElement?: HTMLElement | null;
-    /**
-     * The parent container element of the active elements.
-     * If not set, the indicator's immediate parent element is used.
-     *
-     * @type {HTMLElement | null}
-     */
-    set parent(value: HTMLElement | null);
-    get parent(): HTMLElement | null;
-    /**
-     * The direction in which the indicator should move.
-     *
-     * @type {ActiveIndicatorDirection}
-     */
-    direction: ActiveIndicatorDirection;
-    /**
-     * The position of the indicator relative to the active element.
-     *
-     * @type {ActiveIndicatorPosition}
-     */
-    position: ActiveIndicatorPosition;
-    ngAfterViewInit(): void;
-    ngOnChanges(changes: NgChanges<ActiveIndicatorDirective>): void;
-    private updateStyles;
-    private getIndicatorPositionX;
-    private getIndicatorPositionY;
-    private getIndicatorRelativeOffset;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ActiveIndicatorDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ActiveIndicatorDirective, "[odxActiveIndicator]", never, { "activeElement": { "alias": "odxActiveIndicator"; "required": false; }; "parent": { "alias": "odxActiveIndicatorParent"; "required": false; }; "direction": { "alias": "odxActiveIndicatorDirection"; "required": false; }; "position": { "alias": "odxActiveIndicatorPosition"; "required": false; }; }, {}, never, never, true, never>;
-}