mn-angular-lib 1.0.139 → 1.0.141
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/mn-angular-lib.mjs +568 -184
- package/fesm2022/mn-angular-lib.mjs.map +1 -1
- package/package.json +1 -1
- package/src/lib/features/mn-bottom-sheet/mn-bottom-sheet.component.css +76 -0
- package/src/lib/features/mn-modal/components/mn-modal-shell/mn-modal-shell.component.css +13 -113
- package/src/lib/features/mn-multi-select/mn-multi-select.css +6 -0
- package/types/mn-angular-lib.d.ts +281 -61
|
@@ -2561,10 +2561,28 @@ type MnMultiSelectProps<TValue = unknown> = {
|
|
|
2561
2561
|
placeholder?: string;
|
|
2562
2562
|
/** Available options to select from */
|
|
2563
2563
|
options: MnMultiSelectOption<TValue>[];
|
|
2564
|
-
/**
|
|
2564
|
+
/**
|
|
2565
|
+
* Whether to show a search/filter input. When omitted, search auto-enables once the
|
|
2566
|
+
* number of options reaches `searchThreshold`, so long lists stay filterable without
|
|
2567
|
+
* every call site having to opt in. Set explicitly to force it on or off.
|
|
2568
|
+
*/
|
|
2565
2569
|
searchable?: boolean;
|
|
2570
|
+
/**
|
|
2571
|
+
* Number of options at which the search input auto-enables (default: 8).
|
|
2572
|
+
* Ignored when `searchable` is set explicitly.
|
|
2573
|
+
*/
|
|
2574
|
+
searchThreshold?: number;
|
|
2566
2575
|
/** Placeholder text for the search input */
|
|
2567
2576
|
searchPlaceholder?: string;
|
|
2577
|
+
/**
|
|
2578
|
+
* Whether the dropdown renders as a bottom sheet on small screens (< 640px).
|
|
2579
|
+
* Defaults to true. Set to false to keep the trigger-anchored panel on mobile.
|
|
2580
|
+
*
|
|
2581
|
+
* The anchored panel sits at the trigger's bottom edge, which puts it directly in
|
|
2582
|
+
* the path of the soft keyboard as soon as the search input takes focus. The sheet
|
|
2583
|
+
* is anchored to the viewport instead, so the list stays reachable.
|
|
2584
|
+
*/
|
|
2585
|
+
mobileSheet?: boolean;
|
|
2568
2586
|
/** Maximum number of items that can be selected (undefined = unlimited) */
|
|
2569
2587
|
maxSelections?: number;
|
|
2570
2588
|
/**
|
|
@@ -2614,6 +2632,8 @@ type MnMultiSelectUIConfig = {
|
|
|
2614
2632
|
errorMessages?: Record<string, string>;
|
|
2615
2633
|
/** Text shown when no options match the search filter */
|
|
2616
2634
|
noOptionsFound?: string;
|
|
2635
|
+
/** Accessible label for the mobile sheet's close button (falls back to 'Close') */
|
|
2636
|
+
closeLabel?: string;
|
|
2617
2637
|
};
|
|
2618
2638
|
|
|
2619
2639
|
declare const MN_MULTI_SELECT_CONFIG: InjectionToken<MnMultiSelectUIConfig>;
|
|
@@ -2631,8 +2651,30 @@ declare class MnMultiSelect implements OnInit {
|
|
|
2631
2651
|
private readonly cdr;
|
|
2632
2652
|
/** Reference to the trigger element for positioning the dropdown */
|
|
2633
2653
|
triggerRef: ElementRef<HTMLElement>;
|
|
2634
|
-
/**
|
|
2654
|
+
/** Layout classes for the anchored popover panel. The mobile sheet is rendered by
|
|
2655
|
+
* mn-bottom-sheet instead, so it no longer needs a branch here. */
|
|
2656
|
+
readonly panelClasses = "fixed z-9999 bg-base-100 border border-base-300 rounded-md shadow-lg max-h-60 overflow-auto";
|
|
2657
|
+
/** The anchored popover panel currently moved into `document.body`, if any. */
|
|
2635
2658
|
private movedPanel;
|
|
2659
|
+
/** Option count at which the search input auto-enables when `searchable` is unset. */
|
|
2660
|
+
private static readonly DEFAULT_SEARCH_THRESHOLD;
|
|
2661
|
+
/** Tailwind's `sm` breakpoint — below this the panel renders as a bottom sheet.
|
|
2662
|
+
* Kept in step with the same constant in `MnModalShellComponent`. */
|
|
2663
|
+
private static readonly SHEET_MAX_WIDTH;
|
|
2664
|
+
/** Whether the viewport is currently narrow enough for the sheet layout. */
|
|
2665
|
+
private isNarrowViewport;
|
|
2666
|
+
/** Live breakpoint match, so rotating the device re-evaluates the layout. */
|
|
2667
|
+
private sheetMedia;
|
|
2668
|
+
/** The listener registered on `sheetMedia`, retained for teardown. */
|
|
2669
|
+
private sheetMediaListener;
|
|
2670
|
+
/** `document.body`'s inline `overflow` before the sheet locked it, restored on close. */
|
|
2671
|
+
private previousBodyOverflow;
|
|
2672
|
+
/**
|
|
2673
|
+
* The sheet's height (px) captured the moment it opened, before any search. Re-applied
|
|
2674
|
+
* as a `min-height` floor so filtering the option list shorter cannot shrink the sheet
|
|
2675
|
+
* mid-type. Null while anchored or closed, so the popover and desktop path are untouched.
|
|
2676
|
+
*/
|
|
2677
|
+
sheetFloorPx: number | null;
|
|
2636
2678
|
/**
|
|
2637
2679
|
* Watches the trigger while the panel is open. The panel lives in `document.body`,
|
|
2638
2680
|
* so it survives its own trigger being hidden by an ancestor — e.g. a wizard step
|
|
@@ -2646,6 +2688,8 @@ declare class MnMultiSelect implements OnInit {
|
|
|
2646
2688
|
* card) used to leave the portalled panel floating at its stale coordinates.
|
|
2647
2689
|
*/
|
|
2648
2690
|
private scrollCapture;
|
|
2691
|
+
/** The bottom-sheet host currently moved into `document.body`, if any. */
|
|
2692
|
+
private movedSheet;
|
|
2649
2693
|
/**
|
|
2650
2694
|
* The dropdown panel element, queried while it is rendered by the `@if` block.
|
|
2651
2695
|
* The setter relocates the panel to `document.body` so that its `position: fixed`
|
|
@@ -2670,24 +2714,72 @@ declare class MnMultiSelect implements OnInit {
|
|
|
2670
2714
|
private onTouched;
|
|
2671
2715
|
private readonly builtInErrorMessages;
|
|
2672
2716
|
constructor();
|
|
2717
|
+
/**
|
|
2718
|
+
* The bottom-sheet host, read as an `ElementRef` so it can be relocated to
|
|
2719
|
+
* `document.body` — its `position: fixed` children (backdrop + container) must anchor
|
|
2720
|
+
* to the viewport, not to any transformed/filtered ancestor of this component. On open
|
|
2721
|
+
* its container height is captured as the sheet's `min-height` floor.
|
|
2722
|
+
*/
|
|
2723
|
+
set sheetRef(ref: ElementRef<HTMLElement> | undefined);
|
|
2724
|
+
/**
|
|
2725
|
+
* Tracks the sheet breakpoint through `matchMedia` rather than reading `innerWidth`
|
|
2726
|
+
* once, so rotating the device switches layout instead of leaving a panel positioned
|
|
2727
|
+
* for the previous orientation. An open panel is closed on the switch — its anchored
|
|
2728
|
+
* coordinates and its sheet layout are not interchangeable.
|
|
2729
|
+
*/
|
|
2730
|
+
private startWatchingViewport;
|
|
2731
|
+
/** Tears down the breakpoint listener. Idempotent. */
|
|
2732
|
+
private stopWatchingViewport;
|
|
2673
2733
|
ngOnInit(): void;
|
|
2674
|
-
onDocumentClick(event: Event): void;
|
|
2675
2734
|
private resolveConfig;
|
|
2676
2735
|
writeValue(val: unknown): void;
|
|
2677
2736
|
registerOnChange(fn: (val: unknown) => void): void;
|
|
2678
2737
|
registerOnTouched(fn: () => void): void;
|
|
2679
2738
|
setDisabledState(isDisabled: boolean): void;
|
|
2680
2739
|
toggle(): void;
|
|
2740
|
+
/** Whether the panel should currently render as a bottom sheet. */
|
|
2741
|
+
get isSheet(): boolean;
|
|
2742
|
+
/**
|
|
2743
|
+
* Whether the search input is shown: the explicit `searchable` prop when set,
|
|
2744
|
+
* otherwise auto-enabled once the option count reaches the threshold.
|
|
2745
|
+
*/
|
|
2746
|
+
get isSearchable(): boolean;
|
|
2747
|
+
onDocumentClick(event: Event): void;
|
|
2748
|
+
/**
|
|
2749
|
+
* Records the sheet's opened height as its `min-height` floor. Measured on the next
|
|
2750
|
+
* frame so the read reflects the fully-rendered, unfiltered list (the search box is
|
|
2751
|
+
* empty on open) and never forces a reflow mid change-detection. The floor equals the
|
|
2752
|
+
* content height at that instant, so applying it triggers no resize — it only stops a
|
|
2753
|
+
* later, shorter filtered list from pulling the sheet down.
|
|
2754
|
+
*
|
|
2755
|
+
* `hostEl` is the portalled mn-bottom-sheet host (`display: contents`), so the height
|
|
2756
|
+
* is read from its `.mn-sheet-container` child rather than the host itself.
|
|
2757
|
+
*/
|
|
2758
|
+
private captureSheetFloor;
|
|
2681
2759
|
/** Closes the dropdown on Escape for keyboard accessibility. */
|
|
2682
2760
|
onEscape(): void;
|
|
2683
|
-
/**
|
|
2761
|
+
/**
|
|
2762
|
+
* Closes the dropdown when the page or a scrollable parent is scrolled.
|
|
2763
|
+
*
|
|
2764
|
+
* Skipped for a sheet: it is anchored to the viewport, not to the trigger, so it has
|
|
2765
|
+
* no stale position to escape. Crucially, opening the soft keyboard fires a `resize`
|
|
2766
|
+
* on Android — closing on that would dismiss the sheet the instant search is focused.
|
|
2767
|
+
* A genuine layout switch is handled by the `matchMedia` listener instead.
|
|
2768
|
+
*/
|
|
2684
2769
|
onWindowScrollOrResize(): void;
|
|
2685
2770
|
/**
|
|
2686
2771
|
* The single close path. Every trigger (outside click, Escape, scroll, resize, the
|
|
2687
2772
|
* trigger being hidden) funnels through here so the open-only listeners are always
|
|
2688
2773
|
* torn down with the panel and never leak.
|
|
2689
2774
|
*/
|
|
2690
|
-
|
|
2775
|
+
close(): void;
|
|
2776
|
+
/**
|
|
2777
|
+
* Freezes the page behind an open sheet. The previous inline value is captured and
|
|
2778
|
+
* restored verbatim so a surrounding modal that set its own lock is left intact.
|
|
2779
|
+
*/
|
|
2780
|
+
private lockBodyScroll;
|
|
2781
|
+
/** Restores the pre-lock `overflow`. Idempotent. */
|
|
2782
|
+
private unlockBodyScroll;
|
|
2691
2783
|
/** Calculates the fixed position for the dropdown based on the trigger element */
|
|
2692
2784
|
private updateDropdownPosition;
|
|
2693
2785
|
/**
|
|
@@ -2698,12 +2790,15 @@ declare class MnMultiSelect implements OnInit {
|
|
|
2698
2790
|
*/
|
|
2699
2791
|
private startWatchingTrigger;
|
|
2700
2792
|
/**
|
|
2701
|
-
* Move
|
|
2702
|
-
*
|
|
2703
|
-
* `transform`/`filter`/`will-change`, so `position: fixed` anchors to the viewport
|
|
2704
|
-
*
|
|
2793
|
+
* Move an overlay element to `document.body` when it appears, and detach it when the
|
|
2794
|
+
* query clears. Appending to the body root makes the element immune to ancestor
|
|
2795
|
+
* `transform`/`filter`/`will-change`, so `position: fixed` anchors to the viewport —
|
|
2796
|
+
* without this the panel lands mid-screen (and breaks outright on iOS).
|
|
2797
|
+
*
|
|
2798
|
+
* Returns the element now portalled, so the caller can store it. Idempotent and safe
|
|
2799
|
+
* to call with `null`.
|
|
2705
2800
|
*/
|
|
2706
|
-
private
|
|
2801
|
+
private portal;
|
|
2707
2802
|
/** Tears down the watchers installed by `startWatchingTrigger`. Idempotent. */
|
|
2708
2803
|
private stopWatchingTrigger;
|
|
2709
2804
|
toggleOption(option: MnMultiSelectOption): void;
|
|
@@ -2751,6 +2846,135 @@ declare class MnMultiSelect implements OnInit {
|
|
|
2751
2846
|
static ɵcmp: i0.ɵɵComponentDeclaration<MnMultiSelect, "mn-lib-multi-select", never, { "props": { "alias": "props"; "required": true; }; }, {}, never, never, true, never>;
|
|
2752
2847
|
}
|
|
2753
2848
|
|
|
2849
|
+
/**
|
|
2850
|
+
* A viewport-anchored bottom sheet — the mobile presentation shared by the modal
|
|
2851
|
+
* shell and the multi-select dropdown.
|
|
2852
|
+
*
|
|
2853
|
+
* It owns only the sheet *chrome and gestures*: a bottom-anchored, full-width,
|
|
2854
|
+
* rounded-top surface with an optional dimming backdrop and drag grabber, a
|
|
2855
|
+
* slide-up entrance, swipe/flick-to-dismiss, and a promise-based slide-down exit.
|
|
2856
|
+
* It is deliberately presentational: the body is projected via `<ng-content>`, and
|
|
2857
|
+
* dismissal is reported through {@link dismiss} for the host to act on (run a close
|
|
2858
|
+
* guard, tear down its overlay, …) rather than being handled here.
|
|
2859
|
+
*
|
|
2860
|
+
* Positioning is `position: fixed` against the viewport, so a consumer whose sheet
|
|
2861
|
+
* lives inside a `transform`/`filter` ancestor (which would otherwise become the
|
|
2862
|
+
* containing block) must relocate this host to `document.body` — as the
|
|
2863
|
+
* multi-select does with its portal helper.
|
|
2864
|
+
*/
|
|
2865
|
+
declare class MnBottomSheet {
|
|
2866
|
+
/** Tailwind's `sm` breakpoint — at or below this the swipe gesture is armed.
|
|
2867
|
+
* Kept in step with the same constant in the modal shell and multi-select. */
|
|
2868
|
+
private static readonly SHEET_MAX_WIDTH;
|
|
2869
|
+
/** Drag distance (px) past which a release dismisses regardless of speed. */
|
|
2870
|
+
private static readonly SWIPE_DISMISS_THRESHOLD;
|
|
2871
|
+
/** Downward release speed (px/ms) above which a short drag still dismisses — a "flick". */
|
|
2872
|
+
private static readonly FLICK_VELOCITY;
|
|
2873
|
+
/** Minimum drag distance (px) a flick must cover, so an incidental fast tap never dismisses. */
|
|
2874
|
+
private static readonly FLICK_MIN_DISTANCE;
|
|
2875
|
+
/** Upper bound for the exit wait if no `transitionend` fires (e.g. animation suppressed). */
|
|
2876
|
+
private static readonly CLOSE_FALLBACK_MS;
|
|
2877
|
+
/** Whether to render the dimming backdrop behind the sheet (default: true).
|
|
2878
|
+
* A host that already paints its own backdrop (the modal shell) sets this false. */
|
|
2879
|
+
showBackdrop: boolean;
|
|
2880
|
+
/** Whether to render the drag grabber handle that arms swipe-to-dismiss (default: true). */
|
|
2881
|
+
showGrabber: boolean;
|
|
2882
|
+
/** Whether the sheet can be dismissed by the user via swipe/flick or backdrop tap
|
|
2883
|
+
* (default: true). When false the gestures are inert and the backdrop is non-closing. */
|
|
2884
|
+
dismissible: boolean;
|
|
2885
|
+
/** Optional `min-height` floor (px) for the container, so filtering its content
|
|
2886
|
+
* shorter cannot shrink the sheet mid-interaction. Null leaves it content-sized. */
|
|
2887
|
+
minHeightPx: number | null;
|
|
2888
|
+
/** Cap on the sheet height as a fraction of the viewport, in vh (default: 80). */
|
|
2889
|
+
maxHeightVh: number;
|
|
2890
|
+
/** Extra class(es) applied to the sheet container, so a host can attach the hooks
|
|
2891
|
+
* its own CSS depends on (e.g. the modal shell's `modal-container`). */
|
|
2892
|
+
containerClass: string;
|
|
2893
|
+
/** Accessible name for the sheet dialog. */
|
|
2894
|
+
ariaLabel?: string;
|
|
2895
|
+
/** Id of the element that labels this dialog (takes precedence over `ariaLabel`). */
|
|
2896
|
+
ariaLabelledby?: string;
|
|
2897
|
+
/**
|
|
2898
|
+
* When true, the sheet grows to its `maxHeightVh` while the host app marks the soft
|
|
2899
|
+
* keyboard open (a `.mn-keyboard-open` class on a document ancestor), guaranteeing
|
|
2900
|
+
* scroll room to lift a focused field above an overlaying keyboard. Off by default so
|
|
2901
|
+
* a keyboard opened over an unrelated sheet (a multi-select search) does not resize it.
|
|
2902
|
+
*/
|
|
2903
|
+
growWithKeyboard: boolean;
|
|
2904
|
+
/**
|
|
2905
|
+
* Optional async gate consulted before a user-initiated dismissal (swipe/flick/backdrop
|
|
2906
|
+
* tap) is committed. Resolving false aborts the dismissal and springs the sheet back —
|
|
2907
|
+
* used by the modal to run its close guard (e.g. an unsaved-changes prompt). A
|
|
2908
|
+
* programmatic {@link startClosing} bypasses it.
|
|
2909
|
+
*/
|
|
2910
|
+
dismissGuard?: () => boolean | Promise<boolean>;
|
|
2911
|
+
/**
|
|
2912
|
+
* Emitted once the user has dismissed the sheet — after the slide-down exit has
|
|
2913
|
+
* finished, so the host can remove the sheet from the DOM without cutting the
|
|
2914
|
+
* animation short. The host decides what dismissal means (close, run a guard, …).
|
|
2915
|
+
*/
|
|
2916
|
+
dismiss: EventEmitter<void>;
|
|
2917
|
+
/** Current downward drag offset (px) applied to the sheet while swiping. */
|
|
2918
|
+
sheetDragY: number;
|
|
2919
|
+
/** True while the user is actively dragging the grabber (disables the snap transition). */
|
|
2920
|
+
isDraggingSheet: boolean;
|
|
2921
|
+
/** True once a dismissal has committed — the sheet glides off-screen via its transition. */
|
|
2922
|
+
isDismissing: boolean;
|
|
2923
|
+
private readonly cdr;
|
|
2924
|
+
private readonly el;
|
|
2925
|
+
/** The sheet container element, used to measure its height and drive the exit. */
|
|
2926
|
+
private readonly containerRef;
|
|
2927
|
+
private dragStartY;
|
|
2928
|
+
/** The two most recent (y, timestamp) pointer samples, for estimating flick velocity.
|
|
2929
|
+
* `t` uses the event timestamp (monotonic), so no wall-clock is read. */
|
|
2930
|
+
private lastSample;
|
|
2931
|
+
private prevSample;
|
|
2932
|
+
/** In-flight exit animation, so a swipe-dismiss and a follow-up programmatic
|
|
2933
|
+
* {@link startClosing} share one glide instead of re-triggering it. */
|
|
2934
|
+
private exitPromise;
|
|
2935
|
+
get hostClasses(): string;
|
|
2936
|
+
/** Whether the viewport is currently narrow enough for the sheet to accept a swipe. */
|
|
2937
|
+
private get isNarrow();
|
|
2938
|
+
onSheetPointerDown(event: PointerEvent): void;
|
|
2939
|
+
onSheetPointerMove(event: PointerEvent): void;
|
|
2940
|
+
onSheetPointerUp(): void;
|
|
2941
|
+
onBackdropClick(): void;
|
|
2942
|
+
/**
|
|
2943
|
+
* Plays the slide-down exit and resolves once it has finished. Exposed so a host that
|
|
2944
|
+
* dismisses the sheet programmatically (not via a gesture) can await the same exit
|
|
2945
|
+
* before tearing the sheet down. Idempotent: a swipe-dismiss already in flight and a
|
|
2946
|
+
* subsequent programmatic close share the one glide rather than restarting it.
|
|
2947
|
+
*/
|
|
2948
|
+
startClosing(): Promise<void>;
|
|
2949
|
+
/**
|
|
2950
|
+
* Runs the optional {@link dismissGuard}, then either commits the dismissal (glide out
|
|
2951
|
+
* + emit) or springs the sheet back if the guard rejects. A non-dismissible sheet never
|
|
2952
|
+
* gets here from a gesture, but the guard is still short-circuited defensively.
|
|
2953
|
+
*/
|
|
2954
|
+
private attemptDismiss;
|
|
2955
|
+
/** Whether the release should dismiss: a long-enough drag OR a fast downward flick. */
|
|
2956
|
+
private shouldDismiss;
|
|
2957
|
+
/** Downward release speed (px/ms) from the last two pointer samples; 0 when unusable. */
|
|
2958
|
+
private releaseVelocity;
|
|
2959
|
+
/** Springs the sheet back to its resting position after a drag that didn't dismiss. */
|
|
2960
|
+
private snapBack;
|
|
2961
|
+
/**
|
|
2962
|
+
* Commits a dismissal: glides the sheet the rest of the way off-screen, then emits
|
|
2963
|
+
* {@link dismiss} once the exit animation settles. Continuing the gesture (rather than
|
|
2964
|
+
* snapping back to 0 first) keeps a swipe feeling like one unbroken motion.
|
|
2965
|
+
*/
|
|
2966
|
+
private commitDismiss;
|
|
2967
|
+
/** Commits the exit animation exactly once and returns the shared in-flight promise.
|
|
2968
|
+
* Short-circuits under reduced motion and falls back to a timeout if no event fires. */
|
|
2969
|
+
private playExit;
|
|
2970
|
+
/** Waits for the container's exit transition to end, with a reduced-motion short-circuit
|
|
2971
|
+
* and a fallback timeout so it always resolves. */
|
|
2972
|
+
private awaitExit;
|
|
2973
|
+
private prefersReducedMotion;
|
|
2974
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MnBottomSheet, never>;
|
|
2975
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<MnBottomSheet, "mn-bottom-sheet", never, { "showBackdrop": { "alias": "showBackdrop"; "required": false; }; "showGrabber": { "alias": "showGrabber"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "minHeightPx": { "alias": "minHeightPx"; "required": false; }; "maxHeightVh": { "alias": "maxHeightVh"; "required": false; }; "containerClass": { "alias": "containerClass"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; }; "growWithKeyboard": { "alias": "growWithKeyboard"; "required": false; }; "dismissGuard": { "alias": "dismissGuard"; "required": false; }; }, { "dismiss": "dismiss"; }, never, ["*"], true, never>;
|
|
2976
|
+
}
|
|
2977
|
+
|
|
2754
2978
|
declare const mnSelectVariants: tailwind_variants.TVReturnType<{
|
|
2755
2979
|
shadow: {
|
|
2756
2980
|
true: string;
|
|
@@ -5404,9 +5628,6 @@ declare class MnModalShellComponent<TResult = unknown> implements OnInit, AfterV
|
|
|
5404
5628
|
get closeModalLabel(): string;
|
|
5405
5629
|
private el;
|
|
5406
5630
|
private cdr;
|
|
5407
|
-
/** Downward release speed (px/ms) above which a short drag still dismisses — a "flick".
|
|
5408
|
-
* Native sheets dismiss on a quick flick regardless of distance, not just a long drag. */
|
|
5409
|
-
private static readonly FLICK_VELOCITY;
|
|
5410
5631
|
config: ModalConfig<TResult>;
|
|
5411
5632
|
modalRef: MnModalRef<TResult>;
|
|
5412
5633
|
isClosing: boolean;
|
|
@@ -5421,6 +5642,8 @@ declare class MnModalShellComponent<TResult = unknown> implements OnInit, AfterV
|
|
|
5421
5642
|
readonly ModalKind: typeof ModalKind;
|
|
5422
5643
|
/** The rendered wizard body, when this modal is a wizard — used to read the active step title. */
|
|
5423
5644
|
private readonly wizardBody;
|
|
5645
|
+
/** Tailwind's `sm` breakpoint — below this the modal presents as a bottom sheet. */
|
|
5646
|
+
private static readonly SHEET_MAX_WIDTH;
|
|
5424
5647
|
/**
|
|
5425
5648
|
* Title of the wizard's current step, or undefined for non-wizard modals.
|
|
5426
5649
|
* The template appends it to the modal title on small screens, where the
|
|
@@ -5431,69 +5654,66 @@ declare class MnModalShellComponent<TResult = unknown> implements OnInit, AfterV
|
|
|
5431
5654
|
private focusTrapListener;
|
|
5432
5655
|
private pollingTimer;
|
|
5433
5656
|
private pollAttempts;
|
|
5434
|
-
|
|
5435
|
-
|
|
5436
|
-
*
|
|
5437
|
-
private static readonly
|
|
5438
|
-
|
|
5657
|
+
/** Upper bound for the close wait if no animation/transition end event fires
|
|
5658
|
+
* (e.g. an animation was suppressed). Must stay longer than the slowest close
|
|
5659
|
+
* path so it never preempts. */
|
|
5660
|
+
private static readonly CLOSE_FALLBACK_MS;
|
|
5661
|
+
/** Live match of the sheet breakpoint, so the modal switches between the centered dialog
|
|
5662
|
+
* and the bottom sheet when the viewport crosses it (e.g. an orientation change). */
|
|
5663
|
+
readonly isNarrow: i0.WritableSignal<boolean>;
|
|
5664
|
+
/** The bottom sheet presenting this modal on mobile, absent on the desktop dialog path. */
|
|
5665
|
+
private readonly bottomSheet;
|
|
5666
|
+
/** Optional native haptic engine. Absent on the web — every call is null-guarded. */
|
|
5667
|
+
private haptics;
|
|
5668
|
+
private sheetMedia;
|
|
5669
|
+
private sheetMediaListener;
|
|
5670
|
+
/** Whether this modal is allowed to present as a bottom sheet on small screens (default: true). */
|
|
5671
|
+
get isMobileSheet(): boolean;
|
|
5672
|
+
/** Whether the modal should currently render as a bottom sheet (mobile) rather than the
|
|
5673
|
+
* centered dialog (desktop). */
|
|
5674
|
+
get showMobileSheet(): boolean;
|
|
5675
|
+
get hostClasses(): string;
|
|
5439
5676
|
private setupFocusTrap;
|
|
5440
5677
|
private removeFocusTrap;
|
|
5441
5678
|
asWizard(config: ModalConfig<TResult>): WizardModalConfig;
|
|
5442
5679
|
asForm(config: ModalConfig<TResult>): FormModalConfig;
|
|
5443
5680
|
asConfirmation(config: ModalConfig<TResult>): ConfirmationModalConfig;
|
|
5444
5681
|
asCustom(config: ModalConfig<TResult>): CustomModalConfig;
|
|
5445
|
-
|
|
5446
|
-
|
|
5447
|
-
|
|
5448
|
-
|
|
5449
|
-
* velocity for flick-to-dismiss. `t` uses the event timestamp (monotonic, no Date). */
|
|
5450
|
-
private lastSample;
|
|
5451
|
-
/** Upper bound for the close wait if no animation/transition end event fires
|
|
5452
|
-
* (e.g. an animation was suppressed). Must stay longer than the slowest close
|
|
5453
|
-
* path (mobile sheet slide-down 0.45s, swipe glide 0.3s) so it never preempts. */
|
|
5454
|
-
private static readonly CLOSE_FALLBACK_MS;
|
|
5455
|
-
/** Whether this modal renders as a bottom sheet on small screens (default: true). */
|
|
5456
|
-
get isMobileSheet(): boolean;
|
|
5682
|
+
/** Whether the modal can be dismissed at all (drives the sheet's swipe/backdrop arming). */
|
|
5683
|
+
get canClose(): boolean;
|
|
5684
|
+
ngOnInit(): void;
|
|
5685
|
+
ngOnDestroy(): void;
|
|
5457
5686
|
/**
|
|
5458
5687
|
* Triggers the closing animation and resolves once it has actually finished.
|
|
5459
5688
|
*
|
|
5460
|
-
* Deferred via setTimeout to avoid NG0100 when called during a CD cycle.
|
|
5461
|
-
*
|
|
5462
|
-
*
|
|
5463
|
-
*
|
|
5464
|
-
*
|
|
5465
|
-
* short-circuit entirely under reduced motion (the CSS collapses to instant).
|
|
5689
|
+
* Deferred via setTimeout to avoid NG0100 when called during a CD cycle. On mobile the
|
|
5690
|
+
* exit is owned by the bottom sheet, so we delegate to its `startClosing()` (idempotent
|
|
5691
|
+
* with a swipe-dismiss already in flight); on desktop we wait for the dialog container's
|
|
5692
|
+
* `animationend`/`transitionend`. A fallback timeout guarantees resolution if no event
|
|
5693
|
+
* fires, and we short-circuit under reduced motion (the CSS collapses to instant).
|
|
5466
5694
|
*/
|
|
5467
5695
|
startClosing(): Promise<void>;
|
|
5468
5696
|
private prefersReducedMotion;
|
|
5469
5697
|
onEscapeKey(event: Event): void;
|
|
5470
5698
|
onBackdropClick(): void;
|
|
5471
5699
|
onCloseButtonClick(): void;
|
|
5472
|
-
/**
|
|
5473
|
-
*
|
|
5474
|
-
|
|
5475
|
-
|
|
5476
|
-
|
|
5477
|
-
|
|
5478
|
-
|
|
5479
|
-
|
|
5480
|
-
|
|
5481
|
-
|
|
5482
|
-
|
|
5483
|
-
private get canClose();
|
|
5484
|
-
/** Tailwind's `sm` breakpoint — below this the modal renders as a bottom sheet. */
|
|
5485
|
-
private static readonly SHEET_MAX_WIDTH;
|
|
5700
|
+
/**
|
|
5701
|
+
* Guard consulted by the bottom sheet before it commits a swipe/flick/backdrop dismissal.
|
|
5702
|
+
* Mirrors the DISABLED/GUARDED rules of {@link handleClose} so a swipe cannot escape a
|
|
5703
|
+
* modal that a button close could not. Bound as a field so the template passes it directly.
|
|
5704
|
+
*/
|
|
5705
|
+
readonly sheetDismissGuard: () => Promise<boolean>;
|
|
5706
|
+
/**
|
|
5707
|
+
* Handles the sheet's `(dismiss)` — emitted only after its guard passed and its exit
|
|
5708
|
+
* animation finished. Dismisses the modal (no re-guard) with a confirming haptic.
|
|
5709
|
+
*/
|
|
5710
|
+
onSheetDismiss(): void;
|
|
5486
5711
|
ngAfterViewInit(): void;
|
|
5487
|
-
|
|
5488
|
-
|
|
5489
|
-
|
|
5490
|
-
/**
|
|
5491
|
-
private
|
|
5492
|
-
/** Downward release speed (px/ms) from the last two pointer samples. Positive means
|
|
5493
|
-
* moving down. Returns 0 when there is no usable sample window. */
|
|
5494
|
-
private releaseVelocity;
|
|
5495
|
-
/** Springs the sheet back to its resting position after a drag that didn't dismiss. */
|
|
5496
|
-
private snapBack;
|
|
5712
|
+
/** Tracks the sheet breakpoint through `matchMedia` so the dialog/sheet fork re-renders
|
|
5713
|
+
* when the viewport crosses it. */
|
|
5714
|
+
private startWatchingViewport;
|
|
5715
|
+
/** Tears down the breakpoint listener. Idempotent. */
|
|
5716
|
+
private stopWatchingViewport;
|
|
5497
5717
|
/** Attempts to dismiss the modal. Resolves true if it was actually dismissed,
|
|
5498
5718
|
* false if blocked by a DISABLED close mode or a rejected close guard. */
|
|
5499
5719
|
private handleClose;
|
|
@@ -7682,5 +7902,5 @@ type MnPreviewMessage = {
|
|
|
7682
7902
|
*/
|
|
7683
7903
|
declare function enableMnPreviewMode(configService: MnConfigService, langService: MnLanguageService, allowedOrigins?: string[]): void;
|
|
7684
7904
|
|
|
7685
|
-
export { API_BASE_URL, ActionStyle, BackdropMode, BaseModalBuilder, CALENDAR_CONFIG, CALENDAR_DATE_FORMATTER, CalendarDayComponent, CalendarEventComponent, CalendarEventDefaultComponent, CalendarEventLayoutService, CalendarMonthComponent, CalendarUtility, CalendarView, CalendarViewComponent, CalendarWeekComponent, CloseMode, ColumnSortType, ConfirmationModalBuilder, ConfirmationTone, CrudService, CustomModalBuilder, DEFAULT_CALENDAR_CONFIG, DEFAULT_MN_ALERT_CONFIG, DefaultCalendarDateFormatter, FieldAppearance, FieldKind, FormLayoutMode, FormModalBuilder, KeyboardMode, MN_ALERT_CONFIG, MN_CALENDAR_COMPONENT_NAME, MN_CALENDAR_CONFIG, MN_CHECKBOX_CONFIG, MN_DATETIME_CONFIG, MN_HAPTICS, MN_ICON_MAP, MN_INPUT_FIELD_CONFIG, MN_INSTANCE_ID, MN_LIB_DUAL_HORIZONTAL_IMAGE, MN_MODAL_ACTION_ICONS, MN_MULTI_SELECT_CONFIG, MN_SECTION_PATH, MN_SELECT_CONFIG, MN_TEXTAREA_CONFIG, MODAL_ACTION_ICON_SIZE, MODAL_ACTION_ICON_SIZE_SM, MnAlertOutletComponent, MnAlertService, MnAlertStore, MnBadge, MnButton, MnCheckbox, MnCollectionBase, MnCollectionPagination, MnCollectionState, MnConfigService, MnConfirmationBodyComponent, MnCustomBodyHostComponent, MnDateSelectorBar, MnDatetime, MnDualHorizontalImage, MnFileInput, MnFormBodyComponent, MnGrid, MnHiddenBelowDirective, MnHttpService, MnIcon, MnIconAttributes, MnInformationCard, MnInputField, MnInstanceDirective, MnLanguageService, MnList, MnModalRef, MnModalService, MnModalShellComponent, MnMultiSelect, MnRichTextEditor, MnSectionDirective, MnSelect, MnSelectableCollectionBase, MnShowAboveDirective, MnShowBelowDirective, MnSkeleton, MnTabComponent, MnTable, MnTextarea, MnTranslatePipe, MnWizardBodyComponent, ModalBuilder, ModalCloseReason, ModalIntent, ModalKind, ModalSize, NavigationDirection, OptionState, SelectionMode, StepBuilder, StepState, SubmitMode, UpcomingEventRowComponent, UpcomingEventsComponent, ValidationCode, ValidationStatus, WizardFlowMode, WizardModalBuilder, dateTimeAdapter, defaultFilterPredicate, defaultIconForStyle, defaultTextAdapter, emptyFilterValue, enableMnPreviewMode, isFilterValueActive, isTranslatable, matchesColumnFilter, mnAlertVariants, mnBadgeVariants, mnButtonVariants, mnCheckboxVariants, mnCheckboxWrapperVariants, mnDatetimeVariants, mnFileInputVariants, mnIconVariants, mnInformationCardVariants, mnInputFieldVariants, mnMultiSelectVariants, mnSelectVariants, mnSkeletonVariants, mnTextareaVariants, numberAdapter, pickAdapter, provideMnAlerts, provideMnCalendarConfig, provideMnComponentConfig, provideMnConfig, provideMnLanguage, resolveCalendarConfig, resolveFilterableValue };
|
|
7905
|
+
export { API_BASE_URL, ActionStyle, BackdropMode, BaseModalBuilder, CALENDAR_CONFIG, CALENDAR_DATE_FORMATTER, CalendarDayComponent, CalendarEventComponent, CalendarEventDefaultComponent, CalendarEventLayoutService, CalendarMonthComponent, CalendarUtility, CalendarView, CalendarViewComponent, CalendarWeekComponent, CloseMode, ColumnSortType, ConfirmationModalBuilder, ConfirmationTone, CrudService, CustomModalBuilder, DEFAULT_CALENDAR_CONFIG, DEFAULT_MN_ALERT_CONFIG, DefaultCalendarDateFormatter, FieldAppearance, FieldKind, FormLayoutMode, FormModalBuilder, KeyboardMode, MN_ALERT_CONFIG, MN_CALENDAR_COMPONENT_NAME, MN_CALENDAR_CONFIG, MN_CHECKBOX_CONFIG, MN_DATETIME_CONFIG, MN_HAPTICS, MN_ICON_MAP, MN_INPUT_FIELD_CONFIG, MN_INSTANCE_ID, MN_LIB_DUAL_HORIZONTAL_IMAGE, MN_MODAL_ACTION_ICONS, MN_MULTI_SELECT_CONFIG, MN_SECTION_PATH, MN_SELECT_CONFIG, MN_TEXTAREA_CONFIG, MODAL_ACTION_ICON_SIZE, MODAL_ACTION_ICON_SIZE_SM, MnAlertOutletComponent, MnAlertService, MnAlertStore, MnBadge, MnBottomSheet, MnButton, MnCheckbox, MnCollectionBase, MnCollectionPagination, MnCollectionState, MnConfigService, MnConfirmationBodyComponent, MnCustomBodyHostComponent, MnDateSelectorBar, MnDatetime, MnDualHorizontalImage, MnFileInput, MnFormBodyComponent, MnGrid, MnHiddenBelowDirective, MnHttpService, MnIcon, MnIconAttributes, MnInformationCard, MnInputField, MnInstanceDirective, MnLanguageService, MnList, MnModalRef, MnModalService, MnModalShellComponent, MnMultiSelect, MnRichTextEditor, MnSectionDirective, MnSelect, MnSelectableCollectionBase, MnShowAboveDirective, MnShowBelowDirective, MnSkeleton, MnTabComponent, MnTable, MnTextarea, MnTranslatePipe, MnWizardBodyComponent, ModalBuilder, ModalCloseReason, ModalIntent, ModalKind, ModalSize, NavigationDirection, OptionState, SelectionMode, StepBuilder, StepState, SubmitMode, UpcomingEventRowComponent, UpcomingEventsComponent, ValidationCode, ValidationStatus, WizardFlowMode, WizardModalBuilder, dateTimeAdapter, defaultFilterPredicate, defaultIconForStyle, defaultTextAdapter, emptyFilterValue, enableMnPreviewMode, isFilterValueActive, isTranslatable, matchesColumnFilter, mnAlertVariants, mnBadgeVariants, mnButtonVariants, mnCheckboxVariants, mnCheckboxWrapperVariants, mnDatetimeVariants, mnFileInputVariants, mnIconVariants, mnInformationCardVariants, mnInputFieldVariants, mnMultiSelectVariants, mnSelectVariants, mnSkeletonVariants, mnTextareaVariants, numberAdapter, pickAdapter, provideMnAlerts, provideMnCalendarConfig, provideMnComponentConfig, provideMnConfig, provideMnLanguage, resolveCalendarConfig, resolveFilterableValue };
|
|
7686
7906
|
export type { AnimationOptions, ApiError, BaseModalConfig, CalendarButton, CalendarConfig, CalendarDateFormatter, CalendarEvent, CalendarEventData, CancellationActionConfig, CheckboxFieldConfig, ColorFieldConfig, ColorPreset, ColumnBase, ColumnDay, ColumnDefinition, ColumnFilterOption, ColumnFilterState, ColumnFilterType, ColumnFilterValue, ColumnSkeleton, ConfirmationActionConfig, ConfirmationModalConfig, CrudConfig, CurrentTimeCalendarEvent, CursorPaginationStrategy, CustomFieldConfig, CustomModalConfig, DateFieldConfig, DateSelectorBarLayout, DatetimeFieldConfig, DayTile, FailureResult, FieldDataSource, FieldRequiredCondition, FieldValidator, FieldVisibilityCondition, FileFieldConfig, FormFieldConfig, FormFieldGroup, FormModalConfig, FormRow, FormRowField, FormValidator, GridDataSource, GridLayout, GridSkeleton, HourRow, ListAppearance, ListDataSource, ListLabels, ListSkeleton, MnAlert, MnAlertConfig, MnAlertId, MnAlertKind, MnAlertTemplateContext, MnAlertVariants, MnBadgeTypes, MnBadgeVariants, MnButtonTypes, MnButtonVariants, MnCheckboxErrorMessageData, MnCheckboxErrorMessagesData, MnCheckboxProps, MnCheckboxUIConfig, MnCheckboxVariants, MnCheckboxWrapperVariants, MnCollectionDataSource, MnCollectionLabels, MnColumnFilter, MnConfigFile, MnConfigSettings, MnConfigValue, MnDatetimeErrorMessageData, MnDatetimeErrorMessagesData, MnDatetimeMode, MnDatetimeProps, MnDatetimeUIConfig, MnDatetimeVariants, MnDomAttrs, MnDualHorizontalImageConfig, MnDualHorizontalImageTypes, MnErrorMessageData, MnErrorMessageFn, MnErrorMessagesData, MnFileDisplayItem, MnFileInputDisplayMode, MnFileInputErrorMessageData, MnFileInputErrorMessagesData, MnFileInputProps, MnFileInputUIConfig, MnFileInputVariants, MnHapticStyle, MnHapticsHandler, MnIconTypes, MnIconVariants, MnImageType, MnInformationCardBaseData, MnInformationCardData, MnInformationCardVariants, MnInputAdapter, MnInputBaseProps, MnInputDateTimeProps, MnInputFieldProps, MnInputFieldUIConfig, MnInputProps, MnInputType, MnInputVariants, MnLanguageConfig, MnMultiSelectErrorMessageData, MnMultiSelectErrorMessagesData, MnMultiSelectOption, MnMultiSelectProps, MnMultiSelectUIConfig, MnMultiSelectVariants, MnPageSlot, MnPreviewMessage, MnQueryParams, MnRichTextEditorControl, MnRichTextEditorLabels, MnRichTextEditorToolbar, MnSelectErrorMessageData, MnSelectErrorMessagesData, MnSelectOption, MnSelectProps, MnSelectUIConfig, MnSelectVariants, MnSelectableCollectionDataSource, MnShowInput, MnSkeletonProps, MnSkeletonShape, MnSkeletonVariantProps, MnTabDataSource, MnTabItem, MnTableFilterLabels, MnTextareaErrorMessageData, MnTextareaErrorMessagesData, MnTextareaProps, MnTextareaUIConfig, MnTextareaVariants, MnTranslatable, MnTranslationMap, MnTranslations, MnValidationErrorArgs, ModalCancelHandler, ModalCloseEvent, ModalConfig, ModalFooterAction, ModalI18nLabels, ModalInputMap, ModalPollingConfig, ModalRef, ModalResultHandler, ModalStepId, MonthItem, MultiSelectFieldConfig, MultiSelectTableFieldConfig, NumberFieldConfig, OffsetPaginationStrategy, PaginationMode, PaginationStrategy, PasswordFieldConfig, Primitive, QueryParams, QueryValue, RatingFieldConfig, Result, ResultMeta, SelectFieldConfig, SelectOption, SingleSelectTableFieldConfig, SliderFieldConfig, SortState, StepBodyConfig, StepGuard, StepValidator, SuccessResult, TableAppearance, TableDataSource, TableLabels, TextFieldConfig, TextareaFieldConfig, ValidationResult, WizardBeforeCompleteValidator, WizardModalConfig, WizardResult, WizardStepChangeEvent, WizardStepChangeHandler, WizardStepConfig };
|