@rivinia/modal 0.5.3 → 0.6.1

package/types/rivinia-modal-ui.d.ts

@@ -1,12 +1,6 @@
+import { ModalDismissOrigin, ModalInstance, ModalTemplateContext, RiviniaModalSize } from "@rivinia/modal";
 import * as i0 from "@angular/core";
 import { Injector, Signal } from "@angular/core";
-import { ModalDismissOrigin, ModalInstance, ModalTemplateContext } from "@rivinia/modal";
-/**
- * Responsive size presets. Dimensions are ceilings, not mandates: every
- * preset is a CSS custom property (`--rv-modal-width-*`) the consumer can
- * override without touching library source. `auto` sizes to content.
- */
-type RiviniaModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full' | 'auto';
 /**
  * Placement in the viewport. `start`/`end` are logical (RTL-aware).
  * `fullscreen` covers the viewport (safe-area aware). `side-start` /
@@ -94,6 +88,27 @@ export declare class RiviniaModalDialog {
   readonly animation: import("@angular/core").InputSignal<RiviniaModalAnimation>;
   readonly closeOnEscape: import("@angular/core").InputSignal<boolean>;
   readonly backdrop: import("@angular/core").InputSignal<RiviniaModalBackdrop>;
+  /**
+   * True while the viewport is being resized.
+   *
+   * The dialog's size is derived from the viewport, so during a resize every
+   * frame is a new target; animating towards a moving target lags behind the
+   * pointer. The transition is switched off for the duration, and the dialog
+   * snaps — which is what the eye expects from a resize.
+   */
+  protected readonly resizing: import("@angular/core").WritableSignal<boolean>;
+  /**
+   * Track the viewport resize.
+   *
+   * matchMedia('(resolution: …)') is the reliable signal: a plain
+   * resize listener fires for every scroll-driven layout change too, and
+   * the resolution query only changes when the device pixel ratio or the
+   * viewport size really changed.
+   */
+  private readonly viewportQuery;
+  private readonly stopResizeWatch;
+  private settleTimer;
+  ngOnDestroy(): void;
   readonly showCloseButton: import("@angular/core").InputSignal<boolean>;
   /**
    * Managed mode (for {@link RiviniaModalHost}): UI intents (X button,
@@ -279,7 +294,86 @@ export declare class RiviniaModalHost {
   readonly showCloseButton: import("@angular/core").InputSignal<boolean>;
   /** Resolve a title per instance. Default: `metadata.title` → `ref` → `''`. */
   readonly titleOf: import("@angular/core").InputSignal<((instance: ModalInstance<unknown>) => string | undefined) | undefined>;
-  protected readonly visible: Signal<readonly ModalInstance<unknown>[]>;
+  /**
+   * Whether an instance is still loading.
+   *
+   * A dialog that opens before its data arrives has nothing to show yet, and
+   * an empty box reads as a broken dialog. While this returns true for an
+   * instance, the host renders a loader INSTEAD of the instance's content.
+   *
+   * It is per instance, because a host can have several dialogs open and
+   * they load independently.
+   *
+   * ```html
+   * <rv-modal-host
+   *   [modal]="modal"
+   *   [loadingOf]="(instance) => instance.data?.loading === true"
+   * />
+   * ```
+   */
+  readonly loadingOf: import("@angular/core").InputSignal<((instance: ModalInstance<unknown>) => boolean) | undefined>;
+  /** Text of the loader. @default 'Loading…' */
+  readonly loadingLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * The rendered stack.
+   *
+   * It is a signal the host owns rather than a computed over the manager, so
+   * the update can be wrapped in a view transition: the browser then paints
+   * the old stack and the new one as one continuous move instead of
+   * flickering between them.
+   */
+  protected readonly visible: import("@angular/core").WritableSignal<readonly ModalInstance<unknown>[]>;
+  /** Push the manager's current stack into the rendered one. */
+  private readonly syncStack;
+  /**
+   * Smooth the stack change with a view transition.
+   *
+   * Opening a dialog on top of another one used to FLICKER: the top layer
+   * re-promotes the lower dialog, and the browser paints the change in
+   * separate frames. A view transition makes it one continuous move.
+   *
+   * It is optional by design: where the API is missing, the change simply
+   * happens without it — a missing nicety must not break the dialog.
+   */
+  private readonly transition;
+  /** The last stack signature, so a change can be detected. */
+  private lastStackKey;
+  /**
+   * Run a view transition when the visible stack changed.
+   */
+  protected withTransition(change: () => void): void;
+  /** Whether an instance hides the ones below it. */
+  protected readonly covering: Signal<string | null>;
+  /**
+   * Whether this instance is loading.
+   *
+   * A throwing resolver must not break the dialog, so it falls back to "not
+   * loading" — the content renders, which is the safe default.
+   */
+  protected isLoading(instance: ModalInstance<unknown>): boolean;
+  /**
+   * The name of the component that opened this dialog.
+   *
+   * Rendered as `data-caller` on the dialog, so the DevTools inspector shows
+   * WHICH component opened it — the thing you want when a dialog appears and
+   * you need to find its source.
+   */
+  protected callerName(instance: ModalInstance<unknown>): string | null;
+  /**
+   * The size of an instance.
+   *
+   * The host's `size` is the default; an instance may override it, so a small
+   * confirm can sit on top of a wide form without a second host.
+   */
+  protected sizeOf(instance: ModalInstance<unknown>): RiviniaModalSize;
+  /**
+   * Whether an instance hides the ones below it.
+   *
+   * A stack renders every dialog, so the ones below stay visible behind the
+   * top one. When the top one covers the others, the ones below are not
+   * rendered at all — and they come back when it closes.
+   */
+  protected isCovered(instance: ModalInstance<unknown>): boolean;
   protected titleOfInstance(instance: ModalInstance<unknown>): string;
   protected templateContext(instance: ModalInstance<unknown>): ModalTemplateContext<unknown>;
   protected contextInjector(instance: ModalInstance<unknown>): Injector;
@@ -308,6 +402,16 @@ export declare class RiviniaModalHost {
       "required": false;
       "isSignal": true;
     };
+    "loadingOf": {
+      "alias": "loadingOf";
+      "required": false;
+      "isSignal": true;
+    };
+    "loadingLabel": {
+      "alias": "loadingLabel";
+      "required": false;
+      "isSignal": true;
+    };
   }, {}, never, never, true, never>;
 }
 /**

package/types/rivinia-modal.d.ts

@@ -60,6 +60,14 @@ type ModalResult<T> = {
 };
 /** Lifecycle state of one modal instance. Single source of truth: the manager. */
 type ModalStatus = 'queued' | 'active' | 'closing' | 'closed';
+/**
+ * The size of a dialog.
+ *
+ * It lives in the CORE, not only in the UI, because the size is decided when
+ * the dialog is OPENED — `openModal({ size })` — and the core owns that call.
+ * The UI entry re-exports the same union, so there is one vocabulary.
+ */
+type RiviniaModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full' | 'auto';
 /** Origin of a dismissal intent. Guards see it; forced paths bypass guards. */
 type ModalDismissOrigin = 'escape' | 'backdrop' | 'button' | 'program' | 'system';
 /** Content a modal renders. Core stores the descriptor; UI interprets it. */
@@ -128,6 +136,7 @@ interface ModalInstance<TData = unknown> {
   /** Stable key for a modal definition (e.g. `'confirm-delete'`). */
   readonly ref: string | null;
   /** Request origin label for diagnostics (e.g. component/feature name). */
+  /** The name of the component that opened this dialog, when known. */
   readonly caller: string | null;
   readonly parentId: string | null;
   readonly data: TData;
@@ -151,7 +160,6 @@ interface ModalHandle<TResult = unknown> {
 interface ModalOpenOptions<TData = unknown> {
   readonly data?: TData;
   readonly ref?: string;
-  readonly caller?: string;
   readonly parentId?: string;
   /**
    * Lifecycle owner. Destruction settles active modals as `owner-destroyed`
@@ -160,6 +168,26 @@ interface ModalOpenOptions<TData = unknown> {
   readonly owner?: DestroyRef;
   /** Named preset from global config (explicit options always win). */
   readonly preset?: string;
+  /**
+   * Size for THIS dialog.
+   *
+   * The host's `size` is the default for every instance; this overrides it for
+   * one. Without it, a host can only ever show one size — so a small confirm
+   * over a wide form has to be opened by a different host.
+   */
+  readonly size?: RiviniaModalSize;
+  /**
+   * Hide the dialogs underneath this one.
+   *
+   * A stack shows every dialog, so the ones below stay visible behind the
+   * top one. That is right for a wizard, and wrong for a flow where the
+   * detail view REPLACES the list view: the list behind keeps peeking out and
+   * the two fight for attention.
+   *
+   * With this set, the instances below are not rendered while this one is up,
+   * and they come back when it closes.
+   */
+  readonly coversOthers?: boolean;
   readonly dismiss?: Partial<ModalDismissPolicy>;
   readonly guards?: readonly ModalGuard[];
   readonly metadata?: Record<string, unknown>;
@@ -169,6 +197,24 @@ interface ModalOpenOptions<TData = unknown> {
    * fail silently at render. See `ModalContent` inputs.
    */
   readonly inputs?: Record<string, unknown>;
+  /**
+   * The component that opened the dialog.
+   *
+   * `openModal` is usually called from an event handler, which is NOT an
+   * injection context, so the manager cannot discover the caller on its own.
+   * Naming it makes the opener attributable: the dialog carries a
+   * `data-caller` attribute, which shows up in the DevTools inspector and
+   * points at the component that opened it.
+   *
+   * ```ts
+   * export class UsersScreen {
+   *   open() { this.modal.openModal(this.tpl, { caller: UsersScreen }); }
+   * }
+   * ```
+   *
+   * A plain string works too, when the name is all that is known.
+   */
+  readonly caller?: string | Type<unknown>;
 }
 /** Partial changes for `update()` (content shape itself is immutable). */
 interface ModalUpdate<TData = unknown> {
@@ -368,4 +414,4 @@ export declare class RiviniaModal {
 export declare function provideRiviniaModal(config?: RiviniaModalConfig): EnvironmentProviders;
 /** Shorthand for `inject(RiviniaModal)`. */
 export declare function injectRiviniaModal(): RiviniaModal;
-export type { DescendantPolicy, ModalContent, ModalContext, ModalDiagnostic, ModalDismissOrigin, ModalDismissPolicy, ModalGuard, ModalHandle, ModalInstance, ModalOpenOptions, ModalOverflowPolicy, ModalPreset, ModalResult, ModalStatus, ModalStrategy, ModalTemplateContext, ModalUpdate, RiviniaModalConfig };
+export type { DescendantPolicy, ModalContent, ModalContext, ModalDiagnostic, ModalDismissOrigin, ModalDismissPolicy, ModalGuard, ModalHandle, ModalInstance, ModalOpenOptions, ModalOverflowPolicy, ModalPreset, ModalResult, ModalStatus, ModalStrategy, ModalTemplateContext, ModalUpdate, RiviniaModalConfig, RiviniaModalSize };