@ethlete/core 2.9.0 → 3.0.0

package/lib/directives/animated-overlay/animated-overlay.directive.d.ts

@@ -1,14 +1,13 @@
 import { OverlayRef } from '@angular/cdk/overlay';
 import { ComponentPortal, ComponentType } from '@angular/cdk/portal';
-import { ComponentRef, StaticProvider } from '@angular/core';
-import { Instance as PopperInstance, Placement as PopperPlacement } from '@popperjs/core';
-import { Options as ArrowOptions } from '@popperjs/core/lib/modifiers/arrow';
-import { Options as OffsetOptions } from '@popperjs/core/lib/modifiers/offset';
+import { ComponentRef, ElementRef, StaticProvider } from '@angular/core';
+import { OffsetOptions, Padding, Placement } from '@floating-ui/dom';
 import { Subject } from 'rxjs';
 import { AnimatedLifecycleDirective } from '../animated-lifecycle';
 import * as i0 from "@angular/core";
 import * as i1 from "../observe-resize/observe-resize.directive";
 export interface AnimatedOverlayComponentBase {
+    _elementRef?: ElementRef<HTMLElement>;
     _animatedLifecycle?: AnimatedLifecycleDirective;
     _markForCheck?: () => void;
 }
@@ -23,7 +22,7 @@ export declare class AnimatedOverlayDirective<T extends AnimatedOverlayComponent
     private _portal;
     private _overlayRef;
     private _componentRef;
-    private _popper;
+    private _floatingElCleanupFn;
     private _beforeOpened;
     private _afterOpened;
     private _beforeClosed;
@@ -33,25 +32,41 @@ export declare class AnimatedOverlayDirective<T extends AnimatedOverlayComponent
     private readonly _isUnmounting$;
     /**
      * The placement of the animated overlay.
-     * @default 'auto'
+     * @default undefined
      */
-    placement: PopperPlacement;
+    placement?: Placement;
     /**
      * The allowed auto placements of the animated overlay.
-     * @see https://popper.js.org/docs/v2/modifiers/flip/#allowedautoplacements
+     * @see https://floating-ui.com/docs/flip#fallbackplacements
      */
-    allowedAutoPlacements?: PopperPlacement[];
+    fallbackPlacements?: Placement[];
     /**
      * The offset of the animated overlay.
-     * @see https://popper.js.org/docs/v2/modifiers/offset/#offset-1
+     * @see https://floating-ui.com/docs/offset
      */
-    offset: OffsetOptions['offset'] | Readonly<OffsetOptions['offset']> | null;
+    offset: OffsetOptions | null;
     /**
      * The arrow padding.
-     * @see https://popper.js.org/docs/v2/modifiers/arrow/#padding
+     * @see https://floating-ui.com/docs/arrow#padding
      * @default 4
      */
-    arrowPadding: ArrowOptions['padding'] | null;
+    arrowPadding: Padding | null;
+    /**
+     * The viewport padding.
+     * @default 8
+     */
+    viewportPadding: Padding | null;
+    /**
+     * Whether the animated overlay should auto resize to fit the available space.
+     * Useful for things like selects where the list of options might be longer than the available space.
+     * @default false
+     */
+    autoResize: boolean;
+    /**
+     * Whether the animated overlay should auto hide when the reference element is hidden.
+     * @default false
+     */
+    autoHide: boolean;
     get isMounted(): boolean;
     get isMounted$(): import("rxjs").Observable<boolean>;
     get isMounting(): boolean;
@@ -60,7 +75,6 @@ export declare class AnimatedOverlayDirective<T extends AnimatedOverlayComponent
     get portal(): ComponentPortal<T> | null;
     get overlayRef(): OverlayRef | null;
     get componentRef(): ComponentRef<T> | null;
-    get popper(): PopperInstance | null;
     mount(config: {
         component: ComponentType<T>;
         providers?: StaticProvider[];
@@ -73,7 +87,6 @@ export declare class AnimatedOverlayDirective<T extends AnimatedOverlayComponent
     beforeClosed(): Subject<void>;
     afterClosed(): Subject<void>;
     _destroy(): void;
-    _reposition(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AnimatedOverlayDirective<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<AnimatedOverlayDirective<any>, never, never, { "placement": { "alias": "placement"; "required": false; }; "allowedAutoPlacements": { "alias": "allowedAutoPlacements"; "required": false; }; "offset": { "alias": "offset"; "required": false; }; "arrowPadding": { "alias": "arrowPadding"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.ObserveResizeDirective; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AnimatedOverlayDirective<any>, never, never, { "placement": { "alias": "placement"; "required": false; }; "fallbackPlacements": { "alias": "fallbackPlacements"; "required": false; }; "offset": { "alias": "offset"; "required": false; }; "arrowPadding": { "alias": "arrowPadding"; "required": false; }; "viewportPadding": { "alias": "viewportPadding"; "required": false; }; "autoResize": { "alias": "autoResize"; "required": false; }; "autoHide": { "alias": "autoHide"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.ObserveResizeDirective; inputs: {}; outputs: {}; }]>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ethlete/core",
-  "version": "2.9.0",
+  "version": "3.0.0",
   "dependencies": {
     "tslib": "^2.5.0"
   },
@@ -11,7 +11,7 @@
     "@ethlete/types": "1.3.0",
     "rxjs": "7.8.1",
     "@angular/cdk": "16.1.5",
-    "@popperjs/core": "2.11.8",
+    "@floating-ui/dom": "1.4.5",
     "@angular/router": "16.1.6",
     "@angular/forms": "16.1.6"
   },