@foldkit/ui 0.160.0 → 0.161.0

package/dist/dialog/index.d.ts

@@ -1,6 +1,7 @@
 import { Effect, Option, Schema } from 'effect';
 import * as Command from 'foldkit/command';
 import { type ChildAttribute, type Html } from 'foldkit/html';
+import * as Mount from 'foldkit/mount';
 import * as Update from 'foldkit/update';
 /** Schema for the dialog component's state, tracking its unique ID, open/closed status, animation support, and animation lifecycle phase. */
 export declare const Model: Schema.Struct<{
@@ -21,6 +22,8 @@ export declare const Message: import("foldkit/message").MessageUnion<{
     readonly RequestedClose: {};
     readonly SucceededShowDialog: {};
     readonly FailedShowDialog: {};
+    readonly SucceededAcquireResources: {};
+    readonly FailedAcquireResources: {};
     readonly CompletedCloseDialog: {};
     readonly Unmounted: {};
     readonly CompletedReleaseDialogResources: {};
@@ -37,6 +40,8 @@ export type RequestedOpen = typeof Message.RequestedOpen.Type;
 export type RequestedClose = typeof Message.RequestedClose.Type;
 export type SucceededShowDialog = typeof Message.SucceededShowDialog.Type;
 export type FailedShowDialog = typeof Message.FailedShowDialog.Type;
+export type SucceededAcquireResources = typeof Message.SucceededAcquireResources.Type;
+export type FailedAcquireResources = typeof Message.FailedAcquireResources.Type;
 export type CompletedCloseDialog = typeof Message.CompletedCloseDialog.Type;
 export type Unmounted = typeof Message.Unmounted.Type;
 export type CompletedReleaseDialogResources = typeof Message.CompletedReleaseDialogResources.Type;
@@ -60,7 +65,6 @@ export type OutMessage = typeof OutMessage.Type;
  *  elements rather than constructing those ids yourself. */
 export type InitConfig = Readonly<{
     id: string;
-    isOpen?: boolean;
     isAnimated?: boolean;
     /** CSS selector for the element that receives focus when the dialog opens.
      *  A selector-based override of the `initialFocus` RenderInfo marker, for the
@@ -69,7 +73,8 @@ export type InitConfig = Readonly<{
      *  neither set, focus falls to the first focusable element. */
     focusSelector?: string;
 }>;
-/** Creates an initial dialog model from a config. Defaults to closed and non-animated. */
+/** Creates a closed dialog model from a config. Use `boot` when the Dialog
+ *  should open as the application starts. */
 export declare const init: (config: InitConfig) => Model;
 /** Data attribute the dialog places on the `initialFocus` RenderInfo group and
  *  focuses on open. */
@@ -78,18 +83,20 @@ export declare const initialFocusMarkerAttribute = "foldkit-dialog-initial-focus
  *  dialog when no `focusSelector` is configured. */
 export declare const initialFocusMarkerSelector = "[data-foldkit-dialog-initial-focus]";
 type UpdateReturn = Update.ReturnWithOutMessage<Model, Message, OutMessage>;
-/** Locks page scroll and opens the native dialog element through
- *  `Dom.showDialog`, which calls `show()` (not native `showModal()`) so other
- *  high-z-index overlays stay interactive. It layers the dialog with a high
- *  z-index and traps focus. For an unhandled Escape on the topmost Dialog, the
+/** Opens the native dialog element through `Dom.showDialog`, then locks page
+ *  scroll when that call acquired the dialog resources. `Dom.showDialog`
+ *  makes the background inert while leaving DevTools available as a separate
+ *  developer overlay. It calls `show()` rather than `showModal()` so DevTools
+ *  can stay interactive, layers the dialog with a high z-index, and traps
+ *  focus. For an unhandled Escape on the topmost Dialog, the
  *  helper dispatches a `CustomEvent` named `cancel`; the Dialog view maps that
  *  signal to `RequestedClose` while suppressing native `cancel` events. The
  *  Dialog component supplies its own backdrop. If the dialog element is gone
- *  by the time the show runs, the lock is released and the Command reports
- *  `FailedShowDialog`. A closed dialog has no `OnUnmount`, so nothing else
- *  would release the lock. The update function then closes the Model. Without
- *  this close, the dialog would render open with no lock and no focus trap.
- *  The lock is also released if the Command is interrupted while it waits. */
+ *  by the time the show runs, the Command reports `FailedShowDialog` without
+ *  taking the scroll lock. The update function then closes the Model. The
+ *  acquisition becomes uninterruptible after the committed element is found,
+ *  so modal resources and the scroll lock cannot split. A concurrent
+ *  lifecycle acquisition reuses the resources already held by the id. */
 export declare const ShowDialog: Command.CommandDefinitionWithArgs<"ShowDialog", {
     id: Schema.String;
     focusSelector: Schema.String;
@@ -98,6 +105,19 @@ export declare const ShowDialog: Command.CommandDefinitionWithArgs<"ShowDialog",
 } | {
     readonly _tag: "FailedShowDialog";
 }, never, never>>;
+/** Reacquires an initially visible Dialog's framework resources when its
+ *  element mounts, including after development Model preservation restores an
+ *  open Dialog without replaying initialization Commands. A successful
+ *  acquisition also resumes a preserved animation transition from its current
+ *  phase. */
+export declare const AcquireResources: Mount.MountDefinitionWithArgs<"AcquireResources", {
+    id: Schema.String;
+    focusSelector: Schema.String;
+}, {
+    readonly _tag: "SucceededAcquireResources";
+} | {
+    readonly _tag: "FailedAcquireResources";
+}>;
 /** Calls `close()` on the native dialog element and unlocks page scroll when
  *  the close released the resources `ShowDialog` installed. A close that runs
  *  before the show has installed them leaves the lock alone. When the show
@@ -105,16 +125,16 @@ export declare const ShowDialog: Command.CommandDefinitionWithArgs<"ShowDialog",
  *  closes the dialog again. If the dialog element is gone by the time the
  *  close runs, the Command calls `Dom.releaseDialogResources` instead. That
  *  releases the scroll lock, focus trap, return focus, and stack entry if the
- *  dialog still holds them. */
+ *  dialog still holds them. The background is restored before return focus. */
 export declare const CloseDialog: Command.CommandDefinitionWithArgs<"CloseDialog", {
     id: Schema.String;
 }, Effect.Effect<{
     readonly _tag: "CompletedCloseDialog";
 }, never, never>>;
 /** Releases the framework hygiene the dialog holds while open (scroll lock,
- *  focus trap, return focus, stack entry) when the element unmounts without a
- *  purposeful close. Idempotent: a no-op if the dialog already released its
- *  resources through `CloseDialog`. */
+ *  focus trap, return focus, stack entry, background isolation) when the
+ *  element unmounts without a purposeful close. Calling it after
+ *  `CloseDialog` released those resources is a no-op. */
 export declare const ReleaseDialogResources: Command.CommandDefinitionWithArgs<"ReleaseDialogResources", {
     id: Schema.String;
 }, Effect.Effect<{
@@ -141,6 +161,10 @@ export declare const update: (model: Model, message: Message) => Readonly<{
         readonly _tag: "SucceededShowDialog";
     } | {
         readonly _tag: "FailedShowDialog";
+    } | {
+        readonly _tag: "SucceededAcquireResources";
+    } | {
+        readonly _tag: "FailedAcquireResources";
     } | {
         readonly _tag: "CompletedCloseDialog";
     } | {
@@ -165,6 +189,11 @@ export declare const update: (model: Model, message: Message) => Readonly<{
         readonly _tag: "Closed";
     };
 }>;
+/** Creates a Dialog and opens it through the normal update path. Use the
+ *  returned Model and Commands during application initialization so the
+ *  initially visible Dialog acquires modal isolation, scroll locking, focus
+ *  management, stack registration, and runtime-owned cleanup. */
+export declare const boot: (config: InitConfig) => UpdateReturn;
 /** Programmatically opens the dialog. */
 export declare const open: (model: Model) => UpdateReturn;
 /** Programmatically closes the dialog. */
@@ -192,11 +221,13 @@ export declare const descriptionId: (model: Model) => string;
 /** Render-time payload published to the consumer's `toView`.
  *
  *  - `dialog`: attributes for the native `<dialog>` element. Carries
- *    the id, ARIA labelling, `open` prop, positioning style, a `cancel` handler
+ *    the id, ARIA labelling and modal state, `open` prop, positioning style, a `cancel` handler
  *    that prevents a file picker's native cancellation from closing the dialog
  *    while mapping `Dom.showDialog`'s Escape signal to `RequestedClose`,
- *    and an `OnUnmount` backstop that releases framework hygiene (scroll lock,
- *    focus trap, return focus) if the element is removed from the DOM while
+ *    an `OnMount` acquisition that restores modal resources for an initially
+ *    visible or development-preserved Dialog, and an `OnUnmount` backstop that
+ *    releases framework hygiene (scroll lock, focus trap, background
+ *    isolation, return focus) if the element is removed from the DOM while
  *    still open, such as navigating away from a route-keyed subtree.
  *    The consumer MUST render an `h.dialog(...)` element so the framework
  *    can open and close it, and so the unmount backstop can fire.
@@ -243,10 +274,10 @@ export type ViewInputs = Readonly<{
     toView: (render: RenderInfo) => Html;
     hasDescription?: boolean;
 }>;
-/** Renders a headless dialog component backed by the native `<dialog>`
- *  element. `ShowDialog` opens it through `Dom.showDialog`, which uses `show()`
- *  (not native `showModal()`) with a high z-index, a focus trap, a
- *  component-supplied backdrop, and topmost-only Escape handling. */
+/** Renders a headless modal dialog backed by the native `<dialog>` element.
+ *  `ShowDialog` and the dialog's Mount open it through `Dom.showDialog`,
+ *  isolate the background, trap focus, and handle Escape on the topmost
+ *  dialog. The component supplies its own backdrop. */
 export declare const view: import("foldkit/submodel").View<{
     readonly id: string;
     readonly isOpen: boolean;
@@ -265,6 +296,10 @@ export declare const view: import("foldkit/submodel").View<{
     readonly _tag: "SucceededShowDialog";
 } | {
     readonly _tag: "FailedShowDialog";
+} | {
+    readonly _tag: "SucceededAcquireResources";
+} | {
+    readonly _tag: "FailedAcquireResources";
 } | {
     readonly _tag: "CompletedCloseDialog";
 } | {

package/dist/dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dialog/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAS,MAAM,EAAE,MAAM,EAAQ,MAAM,QAAQ,CAAA;AAC5D,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAG1C,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,IAAI,EAAmB,MAAM,cAAc,CAAA;AAE9E,OAAO,KAAK,KAAK,MAAM,eAAe,CAAA;AAGtC,OAAO,KAAK,MAAM,MAAM,gBAAgB,CAAA;AAWxC,6IAA6I;AAC7I,eAAO,MAAM,KAAK;;;;;;;;;;EAMhB,CAAA;AAEF,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,IAAI,CAAA;AAIrC,8DAA8D;AAC9D,eAAO,MAAM,OAAO;;;;;;;;;;;QAUK,OAAO;;;;;;;EAC9B,CAAA;AAEF,MAAM,MAAM,aAAa,GAAG,OAAO,OAAO,CAAC,aAAa,CAAC,IAAI,CAAA;AAC7D,MAAM,MAAM,cAAc,GAAG,OAAO,OAAO,CAAC,cAAc,CAAC,IAAI,CAAA;AAC/D,MAAM,MAAM,mBAAmB,GAAG,OAAO,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAAA;AACzE,MAAM,MAAM,gBAAgB,GAAG,OAAO,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAA;AACnE,MAAM,MAAM,yBAAyB,GACnC,OAAO,OAAO,CAAC,yBAAyB,CAAC,IAAI,CAAA;AAC/C,MAAM,MAAM,sBAAsB,GAAG,OAAO,OAAO,CAAC,sBAAsB,CAAC,IAAI,CAAA;AAC/E,MAAM,MAAM,oBAAoB,GAAG,OAAO,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAA;AAC3E,MAAM,MAAM,SAAS,GAAG,OAAO,OAAO,CAAC,SAAS,CAAC,IAAI,CAAA;AACrD,MAAM,MAAM,+BAA+B,GACzC,OAAO,OAAO,CAAC,+BAA+B,CAAC,IAAI,CAAA;AAErD,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAA;AAIzC,8DAA8D;AAC9D,eAAO,MAAM,UAAU;;;EAGrB,CAAA;AAEF,MAAM,MAAM,MAAM,GAAG,OAAO,UAAU,CAAC,MAAM,CAAC,IAAI,CAAA;AAClD,MAAM,MAAM,MAAM,GAAG,OAAO,UAAU,CAAC,MAAM,CAAC,IAAI,CAAA;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,UAAU,CAAC,IAAI,CAAA;AAI/C;;;;;;;;4DAQ4D;AAC5D,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;;;mEAI+D;IAC/D,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAC,CAAA;AAEF;6CAC6C;AAC7C,eAAO,MAAM,IAAI,WAAY,UAAU,KAAG,KAQxC,CAAA;AAMF;uBACuB;AACvB,eAAO,MAAM,2BAA2B,iCAAiC,CAAA;AAEzE;oDACoD;AACpD,eAAO,MAAM,0BAA0B,wCAA0C,CAAA;AAEjF,KAAK,YAAY,GAAG,MAAM,CAAC,oBAAoB,CAAC,KAAK,EAAE,OAAO,EAAE,UAAU,CAAC,CAAA;AA2B3E;;;;;;;;;;;;;yEAayE;AACzE,eAAO,MAAM,UAAU;;;;;;;iBAKrB,CAAA;AAEF;;;;aAIa;AACb,eAAO,MAAM,gBAAgB;;;;;;;EA2B3B,CAAA;AAEF;;;;;;;+EAO+E;AAC/E,eAAO,MAAM,WAAW;;;;iBAWtB,CAAA;AAEF;;;yDAGyD;AACzD,eAAO,MAAM,sBAAsB;;;;iBAQjC,CAAA;AAyGF,mFAAmF;AACnF,eAAO,MAAM,MAAM,UAAW,KAAK,WAAW,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgHjD,CAAA;AAEJ;;;iEAGiE;AACjE,eAAO,MAAM,IAAI,WAAY,UAAU,KAAG,YACK,CAAA;AAE/C,yCAAyC;AACzC,eAAO,MAAM,IAAI,UAAW,KAAK,KAAG,YACI,CAAA;AAExC,0CAA0C;AAC1C,eAAO,MAAM,KAAK,UAAW,KAAK,KAAG,YACI,CAAA;AAIzC;;;;;;;+BAO+B;AAC/B,eAAO,MAAM,OAAO,UAAW,KAAK,KAAG,MAAoC,CAAA;AAE3E;;;;;;;;;+BAS+B;AAC/B,eAAO,MAAM,aAAa,UAAW,KAAK,KAAG,MACX,CAAA;AAElC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAwC4B;AAC5B,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,MAAM,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IACrC,QAAQ,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IACvC,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IACpC,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IACpC,WAAW,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IAC1C,YAAY,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IAC3C,WAAW,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IAC1C,SAAS,EAAE,OAAO,CAAA;CACnB,CAAC,CAAA;AAEF,qFAAqF;AACrF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,MAAM,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAA;IACpC,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAC,CAAA;AAEF;;;uDAGuD;AACvD,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YARP,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI;qBACnB,OAAO;GAiHzB,CAAA"}

package/dist/dialog/index.js

@@ -1,9 +1,11 @@
 import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
 import { Effect, Match, Option, Schema, pipe } from 'effect';
 import * as Command from 'foldkit/command';
+import { DEVTOOLS_HOST_ID } from 'foldkit/devtools-host';
 import * as Dom from 'foldkit/dom';
 import { childAttributes } from 'foldkit/html';
 import { defineMessageUnion } from 'foldkit/message';
+import * as Mount from 'foldkit/mount';
 import { evo } from 'foldkit/struct';
 import { defineView } from 'foldkit/submodel';
 import * as Update from 'foldkit/update';
@@ -11,7 +13,7 @@ import * as Update from 'foldkit/update';
 // dependency: animation → html → runtime → devtools → dialog → animation.
 // The barrel (../animation) imports from html, which starts the cycle.
 import * as Animation from '../animation/schema.js';
-import { defaultLeaveCommand as animationDefaultLeaveCommand, hide as animationHide, show as animationShow, update as animationUpdate, } from '../animation/update.js';
+import * as AnimationUpdate from '../animation/update.js';
 import { idSelector } from '../internal/selectors.js';
 // MODEL
 /** Schema for the dialog component's state, tracking its unique ID, open/closed status, animation support, and animation lifecycle phase. */
@@ -29,6 +31,8 @@ export const Message = defineMessageUnion({
     RequestedClose: {},
     SucceededShowDialog: {},
     FailedShowDialog: {},
+    SucceededAcquireResources: {},
+    FailedAcquireResources: {},
     CompletedCloseDialog: {},
     Unmounted: {},
     CompletedReleaseDialogResources: {},
@@ -40,14 +44,14 @@ export const OutMessage = defineMessageUnion({
     Opened: {},
     Closed: {},
 });
-/** Creates an initial dialog model from a config. Defaults to closed and non-animated. */
+/** Creates a closed dialog model from a config. Use `boot` when the Dialog
+ *  should open as the application starts. */
 export const init = (config) => (__foldkitBrandViewResult(({
     id: config.id,
-    isOpen: config.isOpen ?? false,
+    isOpen: false,
     isAnimated: config.isAnimated ?? false,
     animation: Animation.init({
         id: `${config.id}-panel`,
-        ...(config.isOpen !== undefined ? { isShowing: config.isOpen } : {}),
     }),
     maybeFocusSelector: Option.fromNullishOr(config.focusSelector),
 }), "@foldkit/ui/dialog/index.js#init"));
@@ -59,22 +63,54 @@ export const initialFocusMarkerAttribute = 'foldkit-dialog-initial-focus';
 /** Selector for {@link initialFocusMarkerAttribute}, focused against the open
  *  dialog when no `focusSelector` is configured. */
 export const initialFocusMarkerSelector = `[data-${initialFocusMarkerAttribute}]`;
-/** Locks page scroll and opens the native dialog element through
- *  `Dom.showDialog`, which calls `show()` (not native `showModal()`) so other
- *  high-z-index overlays stay interactive. It layers the dialog with a high
- *  z-index and traps focus. For an unhandled Escape on the topmost Dialog, the
+const acquireDialogResources = (id, focusSelector) => __foldkitBrandViewResult((Effect.uninterruptibleMask(restore => __foldkitBrandViewResult((restore(Dom.showDialog(dialogSelector(id), {
+    focusSelector,
+    isModal: true,
+    allowedOutsideSelectors: [`#${DEVTOOLS_HOST_ID}`],
+})).pipe(Effect.tap(isAcquired => (__foldkitBrandViewResult((isAcquired ? Dom.lockScroll : Effect.void), "@foldkit/ui/dialog/index.js#anonymous~2"))))), "@foldkit/ui/dialog/index.js#anonymous"))), "@foldkit/ui/dialog/index.js#acquireDialogResources");
+const acquireDialogResourcesResult = (id, focusSelector) => __foldkitBrandViewResult((acquireDialogResources(id, focusSelector).pipe(Effect.as(Message.SucceededShowDialog()), Effect.catch(() => __foldkitBrandViewResult((Effect.succeed(Message.FailedShowDialog())), "@foldkit/ui/dialog/index.js#anonymous~3")))), "@foldkit/ui/dialog/index.js#acquireDialogResourcesResult");
+/** Opens the native dialog element through `Dom.showDialog`, then locks page
+ *  scroll when that call acquired the dialog resources. `Dom.showDialog`
+ *  makes the background inert while leaving DevTools available as a separate
+ *  developer overlay. It calls `show()` rather than `showModal()` so DevTools
+ *  can stay interactive, layers the dialog with a high z-index, and traps
+ *  focus. For an unhandled Escape on the topmost Dialog, the
  *  helper dispatches a `CustomEvent` named `cancel`; the Dialog view maps that
  *  signal to `RequestedClose` while suppressing native `cancel` events. The
  *  Dialog component supplies its own backdrop. If the dialog element is gone
- *  by the time the show runs, the lock is released and the Command reports
- *  `FailedShowDialog`. A closed dialog has no `OnUnmount`, so nothing else
- *  would release the lock. The update function then closes the Model. Without
- *  this close, the dialog would render open with no lock and no focus trap.
- *  The lock is also released if the Command is interrupted while it waits. */
+ *  by the time the show runs, the Command reports `FailedShowDialog` without
+ *  taking the scroll lock. The update function then closes the Model. The
+ *  acquisition becomes uninterruptible after the committed element is found,
+ *  so modal resources and the scroll lock cannot split. A concurrent
+ *  lifecycle acquisition reuses the resources already held by the id. */
 export const ShowDialog = Command.define('ShowDialog', {
     args: { id: Schema.String, focusSelector: Schema.String },
     messages: [Message.SucceededShowDialog, Message.FailedShowDialog],
-    execute: ({ id, focusSelector }) => __foldkitBrandViewResult((Dom.lockScroll.pipe(Effect.andThen(() => __foldkitBrandViewResult((Dom.showDialog(dialogSelector(id), { focusSelector }).pipe(Effect.onError(() => __foldkitBrandViewResult((Dom.unlockScroll), "@foldkit/ui/dialog/index.js#anonymous~2")), Effect.as(Message.SucceededShowDialog()), Effect.catch(() => __foldkitBrandViewResult((Effect.succeed(Message.FailedShowDialog())), "@foldkit/ui/dialog/index.js#anonymous~3")))), "@foldkit/ui/dialog/index.js#anonymous")))), "@foldkit/ui/dialog/index.js#execute"),
+    execute: ({ id, focusSelector }) => __foldkitBrandViewResult((acquireDialogResourcesResult(id, focusSelector)), "@foldkit/ui/dialog/index.js#execute"),
+});
+/** Reacquires an initially visible Dialog's framework resources when its
+ *  element mounts, including after development Model preservation restores an
+ *  open Dialog without replaying initialization Commands. A successful
+ *  acquisition also resumes a preserved animation transition from its current
+ *  phase. */
+export const AcquireResources = Mount.define('AcquireResources', {
+    args: { id: Schema.String, focusSelector: Schema.String },
+    messages: [Message.SucceededAcquireResources, Message.FailedAcquireResources],
+    execute: ({ element, id, focusSelector }) => {
+        if (!(element instanceof HTMLDialogElement) || element.id !== id) {
+            return __foldkitBrandViewResult((Effect.succeed(Message.FailedAcquireResources())), "@foldkit/ui/dialog/index.js#execute~2");
+        }
+        const acquisition = acquireDialogResources(id, focusSelector).pipe(Effect.map(isAcquired => (__foldkitBrandViewResult(({
+            isAcquired,
+            message: Message.SucceededAcquireResources(),
+        }), "@foldkit/ui/dialog/index.js#anonymous~4"))), Effect.catch(() => __foldkitBrandViewResult((Effect.succeed({
+            isAcquired: false,
+            message: Message.FailedAcquireResources(),
+        })), "@foldkit/ui/dialog/index.js#anonymous~5")));
+        return __foldkitBrandViewResult((Effect.acquireRelease(acquisition, ({ isAcquired }) => __foldkitBrandViewResult((isAcquired
+            ? Dom.releaseDialogResources(id).pipe(Effect.ignore)
+            : Effect.void), "@foldkit/ui/dialog/index.js#anonymous~6")).pipe(Effect.map(({ message }) => __foldkitBrandViewResult((message), "@foldkit/ui/dialog/index.js#anonymous~7")))), "@foldkit/ui/dialog/index.js#execute~2");
+    },
 });
 /** Calls `close()` on the native dialog element and unlocks page scroll when
  *  the close released the resources `ShowDialog` installed. A close that runs
@@ -83,20 +119,20 @@ export const ShowDialog = Command.define('ShowDialog', {
  *  closes the dialog again. If the dialog element is gone by the time the
  *  close runs, the Command calls `Dom.releaseDialogResources` instead. That
  *  releases the scroll lock, focus trap, return focus, and stack entry if the
- *  dialog still holds them. */
+ *  dialog still holds them. The background is restored before return focus. */
 export const CloseDialog = Command.define('CloseDialog', {
     args: { id: Schema.String },
     messages: [Message.CompletedCloseDialog],
-    execute: ({ id }) => __foldkitBrandViewResult((Dom.closeDialog(dialogSelector(id)).pipe(Effect.andThen(isReleased => __foldkitBrandViewResult((isReleased ? Dom.unlockScroll : Effect.void), "@foldkit/ui/dialog/index.js#anonymous~4")), Effect.catch(() => __foldkitBrandViewResult((Dom.releaseDialogResources(id)), "@foldkit/ui/dialog/index.js#anonymous~5")), Effect.as(Message.CompletedCloseDialog()))), "@foldkit/ui/dialog/index.js#execute~2"),
+    execute: ({ id }) => __foldkitBrandViewResult((Dom.closeDialog(dialogSelector(id)).pipe(Effect.andThen(isReleased => __foldkitBrandViewResult((isReleased ? Dom.unlockScroll : Effect.void), "@foldkit/ui/dialog/index.js#anonymous~8")), Effect.catch(() => __foldkitBrandViewResult((Dom.releaseDialogResources(id)), "@foldkit/ui/dialog/index.js#anonymous~9")), Effect.as(Message.CompletedCloseDialog()))), "@foldkit/ui/dialog/index.js#execute~3"),
 });
 /** Releases the framework hygiene the dialog holds while open (scroll lock,
- *  focus trap, return focus, stack entry) when the element unmounts without a
- *  purposeful close. Idempotent: a no-op if the dialog already released its
- *  resources through `CloseDialog`. */
+ *  focus trap, return focus, stack entry, background isolation) when the
+ *  element unmounts without a purposeful close. Calling it after
+ *  `CloseDialog` released those resources is a no-op. */
 export const ReleaseDialogResources = Command.define('ReleaseDialogResources', {
     args: { id: Schema.String },
     messages: [Message.CompletedReleaseDialogResources],
-    execute: ({ id }) => __foldkitBrandViewResult((Dom.releaseDialogResources(id).pipe(Effect.ignore, Effect.as(Message.CompletedReleaseDialogResources()))), "@foldkit/ui/dialog/index.js#execute~3"),
+    execute: ({ id }) => __foldkitBrandViewResult((Dom.releaseDialogResources(id).pipe(Effect.ignore, Effect.as(Message.CompletedReleaseDialogResources()))), "@foldkit/ui/dialog/index.js#execute~4"),
 });
 const isLeaving = (model) => __foldkitBrandViewResult((model.animation.transitionState === 'LeaveStart' ||
     model.animation.transitionState === 'LeaveAnimating'), "@foldkit/ui/dialog/index.js#isLeaving");
@@ -106,31 +142,54 @@ const resetToClosed = (model) => __foldkitBrandViewResult((evo(model, {
     animation: () => __foldkitBrandViewResult((Animation.init({ id: `${model.id}-panel` })), "@foldkit/ui/dialog/index.js#animation"),
 })), "@foldkit/ui/dialog/index.js#resetToClosed");
 const wrapAnimationMessage = (message) => __foldkitBrandViewResult((Message.GotAnimationMessage({ message })), "@foldkit/ui/dialog/index.js#wrapAnimationMessage");
+const resumeAnimationAfterAcquisition = (model) => __foldkitBrandViewResult((Match.value(model.animation.transitionState).pipe(Match.withReturnType(), Match.when('Idle', () => (__foldkitBrandViewResult(({ model }), "@foldkit/ui/dialog/index.js#anonymous~10"))), Match.when('EnterStart', () => (__foldkitBrandViewResult(({
+    model,
+    commands: [
+        Command.mapMessage(AnimationUpdate.WaitForPaint(), wrapAnimationMessage),
+    ],
+}), "@foldkit/ui/dialog/index.js#anonymous~11"))), Match.when('EnterAnimating', () => (__foldkitBrandViewResult(({
+    model,
+    commands: [
+        Command.mapMessage(AnimationUpdate.WaitForAnimationSettled({ id: model.animation.id }), wrapAnimationMessage),
+    ],
+}), "@foldkit/ui/dialog/index.js#anonymous~12"))), Match.when('LeaveStart', () => (__foldkitBrandViewResult(({
+    model,
+    commands: [
+        Command.mapMessage(AnimationUpdate.WaitForPaint(), wrapAnimationMessage),
+    ],
+}), "@foldkit/ui/dialog/index.js#anonymous~13"))), Match.when('LeaveAnimating', () => (__foldkitBrandViewResult(({
+    model,
+    commands: [
+        Command.mapMessage(AnimationUpdate.WaitForAnimationSettled({ id: model.animation.id }), wrapAnimationMessage),
+    ],
+}), "@foldkit/ui/dialog/index.js#anonymous~14"))), Match.exhaustive)), "@foldkit/ui/dialog/index.js#resumeAnimationAfterAcquisition");
 const foldAnimationOutMessage = (outMessage, { liftCommand }) => __foldkitBrandViewResult((Animation.OutMessage.match(outMessage, {
     StartedLeaveAnimating: () => __foldkitBrandViewResult((model => (__foldkitBrandViewResult(({
         model,
-        commands: [liftCommand(animationDefaultLeaveCommand(model.animation))],
-    }), "@foldkit/ui/dialog/index.js#anonymous~6"))), "@foldkit/ui/dialog/index.js#StartedLeaveAnimating"),
+        commands: [
+            liftCommand(AnimationUpdate.defaultLeaveCommand(model.animation)),
+        ],
+    }), "@foldkit/ui/dialog/index.js#anonymous~15"))), "@foldkit/ui/dialog/index.js#StartedLeaveAnimating"),
     TransitionedOut: () => __foldkitBrandViewResult((model => (__foldkitBrandViewResult(({
         model,
         commands: [CloseDialog({ id: model.id })],
-    }), "@foldkit/ui/dialog/index.js#anonymous~7"))), "@foldkit/ui/dialog/index.js#TransitionedOut"),
+    }), "@foldkit/ui/dialog/index.js#anonymous~16"))), "@foldkit/ui/dialog/index.js#TransitionedOut"),
 })), "@foldkit/ui/dialog/index.js#foldAnimationOutMessage");
 const foldAnimation = Update.foldChild({
-    update: animationUpdate,
+    update: AnimationUpdate.update,
     read: (model) => __foldkitBrandViewResult((Option.some(model.animation)), "@foldkit/ui/dialog/index.js#read"),
     write: (model, nextAnimation) => __foldkitBrandViewResult((evo(model, { animation: () => __foldkitBrandViewResult((nextAnimation), "@foldkit/ui/dialog/index.js#animation~2") })), "@foldkit/ui/dialog/index.js#write"),
     toParentMessage: wrapAnimationMessage,
     foldOutMessage: foldAnimationOutMessage,
 });
 const foldAnimationShow = Update.foldChildStep({
-    update: animationShow,
+    update: AnimationUpdate.show,
     read: (model) => __foldkitBrandViewResult((Option.some(model.animation)), "@foldkit/ui/dialog/index.js#read~2"),
     write: (model, nextAnimation) => __foldkitBrandViewResult((evo(model, { animation: () => __foldkitBrandViewResult((nextAnimation), "@foldkit/ui/dialog/index.js#animation~3") })), "@foldkit/ui/dialog/index.js#write~2"),
     toParentMessage: wrapAnimationMessage,
 });
 const foldAnimationHide = Update.foldChildStep({
-    update: animationHide,
+    update: AnimationUpdate.hide,
     read: (model) => __foldkitBrandViewResult((Option.some(model.animation)), "@foldkit/ui/dialog/index.js#read~3"),
     write: (model, nextAnimation) => __foldkitBrandViewResult((evo(model, { animation: () => __foldkitBrandViewResult((nextAnimation), "@foldkit/ui/dialog/index.js#animation~4") })), "@foldkit/ui/dialog/index.js#write~3"),
     toParentMessage: wrapAnimationMessage,
@@ -141,16 +200,16 @@ export const update = (model, message) => __foldkitBrandViewResult((Message.matc
         const wasClosed = !model.isOpen;
         const maybeShow = Option.liftPredicate(ShowDialog({
             id: model.id,
-            focusSelector: Option.getOrElse(model.maybeFocusSelector, () => __foldkitBrandViewResult((initialFocusMarkerSelector), "@foldkit/ui/dialog/index.js#anonymous~8")),
-        }), () => __foldkitBrandViewResult((wasClosed), "@foldkit/ui/dialog/index.js#anonymous~9"));
+            focusSelector: Option.getOrElse(model.maybeFocusSelector, () => __foldkitBrandViewResult((initialFocusMarkerSelector), "@foldkit/ui/dialog/index.js#anonymous~17")),
+        }), () => __foldkitBrandViewResult((wasClosed), "@foldkit/ui/dialog/index.js#anonymous~18"));
         const commands = Option.toArray(maybeShow);
         const dialogOpen = model.isAnimated
             ? Update.combine(model, [
-                stepModel => (__foldkitBrandViewResult(({ model: stepModel, commands }), "@foldkit/ui/dialog/index.js#anonymous~10")),
+                stepModel => (__foldkitBrandViewResult(({ model: stepModel, commands }), "@foldkit/ui/dialog/index.js#anonymous~19")),
                 foldAnimationShow,
                 stepModel => (__foldkitBrandViewResult(({
                     model: evo(stepModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/dialog/index.js#isOpen~2") }),
-                }), "@foldkit/ui/dialog/index.js#anonymous~11")),
+                }), "@foldkit/ui/dialog/index.js#anonymous~20")),
             ])
             : { model: evo(model, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/dialog/index.js#isOpen~3") }), commands };
         return __foldkitBrandViewResult((wasClosed
@@ -166,14 +225,14 @@ export const update = (model, message) => __foldkitBrandViewResult((Message.matc
             const dialogClose = Update.combine(model, [
                 stepModel => (__foldkitBrandViewResult(({
                     model: evo(stepModel, { isOpen: () => __foldkitBrandViewResult((false), "@foldkit/ui/dialog/index.js#isOpen~4") }),
-                }), "@foldkit/ui/dialog/index.js#anonymous~12")),
+                }), "@foldkit/ui/dialog/index.js#anonymous~21")),
                 foldAnimationHide,
             ]);
             return __foldkitBrandViewResult((wasOpen
                 ? pipe(dialogClose, Update.withOutMessage(OutMessage.Closed()))
                 : dialogClose), "@foldkit/ui/dialog/index.js#RequestedClose");
         }
-        const maybeClose = Option.liftPredicate(CloseDialog({ id: model.id }), () => __foldkitBrandViewResult((wasOpen), "@foldkit/ui/dialog/index.js#anonymous~13"));
+        const maybeClose = Option.liftPredicate(CloseDialog({ id: model.id }), () => __foldkitBrandViewResult((wasOpen), "@foldkit/ui/dialog/index.js#anonymous~22"));
         const commands = Option.toArray(maybeClose);
         const dialogClose = {
             model: evo(model, { isOpen: () => __foldkitBrandViewResult((false), "@foldkit/ui/dialog/index.js#isOpen~5") }),
@@ -211,9 +270,30 @@ export const update = (model, message) => __foldkitBrandViewResult((Message.matc
             return __foldkitBrandViewResult(({ model }), "@foldkit/ui/dialog/index.js#FailedShowDialog");
         }
     },
+    SucceededAcquireResources: () => {
+        if (model.isOpen || isLeaving(model)) {
+            return __foldkitBrandViewResult((resumeAnimationAfterAcquisition(model)), "@foldkit/ui/dialog/index.js#SucceededAcquireResources");
+        }
+        else {
+            return __foldkitBrandViewResult(({ model, commands: [CloseDialog({ id: model.id })] }), "@foldkit/ui/dialog/index.js#SucceededAcquireResources");
+        }
+    },
+    FailedAcquireResources: () => {
+        if (isOpenOrAnimating(model)) {
+            return __foldkitBrandViewResult(({ model: resetToClosed(model) }), "@foldkit/ui/dialog/index.js#FailedAcquireResources");
+        }
+        else {
+            return __foldkitBrandViewResult(({ model }), "@foldkit/ui/dialog/index.js#FailedAcquireResources");
+        }
+    },
     CompletedCloseDialog: () => (__foldkitBrandViewResult(({ model }), "@foldkit/ui/dialog/index.js#CompletedCloseDialog")),
     CompletedReleaseDialogResources: () => (__foldkitBrandViewResult(({ model }), "@foldkit/ui/dialog/index.js#CompletedReleaseDialogResources")),
 })), "@foldkit/ui/dialog/index.js#update");
+/** Creates a Dialog and opens it through the normal update path. Use the
+ *  returned Model and Commands during application initialization so the
+ *  initially visible Dialog acquires modal isolation, scroll locking, focus
+ *  management, stack registration, and runtime-owned cleanup. */
+export const boot = (config) => __foldkitBrandViewResult((update(init(config), Message.RequestedOpen())), "@foldkit/ui/dialog/index.js#boot");
 /** Programmatically opens the dialog. */
 export const open = (model) => __foldkitBrandViewResult((update(model, Message.RequestedOpen())), "@foldkit/ui/dialog/index.js#open");
 /** Programmatically closes the dialog. */
@@ -239,10 +319,10 @@ export const titleId = (model) => __foldkitBrandViewResult((`${model.id}-dialog-
  *  `ViewInputs.hasDescription` so the dialog points at this id. Do not
  *  hand-roll the id string. */
 export const descriptionId = (model) => __foldkitBrandViewResult((`${model.id}-dialog-description`), "@foldkit/ui/dialog/index.js#descriptionId");
-/** Renders a headless dialog component backed by the native `<dialog>`
- *  element. `ShowDialog` opens it through `Dom.showDialog`, which uses `show()`
- *  (not native `showModal()`) with a high z-index, a focus trap, a
- *  component-supplied backdrop, and topmost-only Escape handling. */
+/** Renders a headless modal dialog backed by the native `<dialog>` element.
+ *  `ShowDialog` and the dialog's Mount open it through `Dom.showDialog`,
+ *  isolate the background, trap focus, and handle Escape on the topmost
+ *  dialog. The component supplies its own backdrop. */
 export const view = defineView((model, viewInputs, h) => {
     const { id, isOpen, animation: { transitionState }, } = model;
     const { toView, hasDescription = false } = viewInputs;
@@ -251,17 +331,17 @@ export const view = defineView((model, viewInputs, h) => {
         h.DataAttribute('closed', ''),
         h.DataAttribute('enter', ''),
         h.DataAttribute('transition', ''),
-    ]), "@foldkit/ui/dialog/index.js#anonymous~15")), Match.when('EnterAnimating', () => __foldkitBrandViewResult(([
+    ]), "@foldkit/ui/dialog/index.js#anonymous~24")), Match.when('EnterAnimating', () => __foldkitBrandViewResult(([
         h.DataAttribute('enter', ''),
         h.DataAttribute('transition', ''),
-    ]), "@foldkit/ui/dialog/index.js#anonymous~16")), Match.when('LeaveStart', () => __foldkitBrandViewResult(([
+    ]), "@foldkit/ui/dialog/index.js#anonymous~25")), Match.when('LeaveStart', () => __foldkitBrandViewResult(([
         h.DataAttribute('leave', ''),
         h.DataAttribute('transition', ''),
-    ]), "@foldkit/ui/dialog/index.js#anonymous~17")), Match.when('LeaveAnimating', () => __foldkitBrandViewResult(([
+    ]), "@foldkit/ui/dialog/index.js#anonymous~26")), Match.when('LeaveAnimating', () => __foldkitBrandViewResult(([
         h.DataAttribute('closed', ''),
         h.DataAttribute('leave', ''),
         h.DataAttribute('transition', ''),
-    ]), "@foldkit/ui/dialog/index.js#anonymous~18")), Match.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/dialog/index.js#anonymous~19")));
+    ]), "@foldkit/ui/dialog/index.js#anonymous~27")), Match.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/dialog/index.js#anonymous~28")));
     const describedByAttributes = hasDescription
         ? [h.AriaDescribedBy(descriptionId(model))]
         : [];
@@ -269,6 +349,7 @@ export const view = defineView((model, viewInputs, h) => {
         h.Id(id),
         h.AriaLabelledBy(titleId(model)),
         ...describedByAttributes,
+        ...(isVisible ? [h.AriaModal(true)] : []),
         // NOTE: Chromium reports canceling a file picker as a native `cancel`
         // event observed by the containing dialog. Dom.showDialog uses a
         // CustomEvent for its unhandled-Escape signal, so the two are separable.
@@ -287,7 +368,14 @@ export const view = defineView((model, viewInputs, h) => {
                 : {}),
         }),
         ...(isVisible
-            ? [h.DataAttribute('open', ''), h.OnUnmount(Message.Unmounted())]
+            ? [
+                h.DataAttribute('open', ''),
+                h.OnMount(AcquireResources({
+                    id,
+                    focusSelector: Option.getOrElse(model.maybeFocusSelector, () => __foldkitBrandViewResult((initialFocusMarkerSelector), "@foldkit/ui/dialog/index.js#anonymous~29")),
+                })),
+                h.OnUnmount(Message.Unmounted()),
+            ]
             : []),
     ];
     const backdropAttributes = [
@@ -314,5 +402,5 @@ export const view = defineView((model, viewInputs, h) => {
         initialFocus: childAttributes(initialFocusAttributes),
         closeButton: childAttributes(closeButtonAttributes),
         isVisible,
-    })), "@foldkit/ui/dialog/index.js#anonymous~14");
+    })), "@foldkit/ui/dialog/index.js#anonymous~23");
 });

package/dist/dialog/public.d.ts

@@ -1,3 +1,3 @@
-export { init, update, open, close, view, titleId, descriptionId, Model, Message, OutMessage, type Opened, type Closed, type RequestedOpen, type RequestedClose, type SucceededShowDialog, type FailedShowDialog, type CompletedCloseDialog, type Unmounted, type CompletedReleaseDialogResources, ShowDialog, CloseDialog, ReleaseDialogResources, } from './index.js';
+export { init, boot, update, open, close, view, titleId, descriptionId, Model, Message, OutMessage, type Opened, type Closed, type RequestedOpen, type RequestedClose, type SucceededShowDialog, type FailedShowDialog, type SucceededAcquireResources, type FailedAcquireResources, type CompletedCloseDialog, type Unmounted, type CompletedReleaseDialogResources, ShowDialog, AcquireResources, CloseDialog, ReleaseDialogResources, } from './index.js';
 export type { InitConfig, ViewInputs, RenderInfo } from './index.js';
 //# sourceMappingURL=public.d.ts.map

package/dist/dialog/public.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/dialog/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,OAAO,EACP,aAAa,EACb,KAAK,EACL,OAAO,EACP,UAAU,EACV,KAAK,MAAM,EACX,KAAK,MAAM,EACX,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,oBAAoB,EACzB,KAAK,SAAS,EACd,KAAK,+BAA+B,EACpC,UAAU,EACV,WAAW,EACX,sBAAsB,GACvB,MAAM,YAAY,CAAA;AAEnB,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA"}
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/dialog/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,OAAO,EACP,aAAa,EACb,KAAK,EACL,OAAO,EACP,UAAU,EACV,KAAK,MAAM,EACX,KAAK,MAAM,EACX,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,yBAAyB,EAC9B,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EACzB,KAAK,SAAS,EACd,KAAK,+BAA+B,EACpC,UAAU,EACV,gBAAgB,EAChB,WAAW,EACX,sBAAsB,GACvB,MAAM,YAAY,CAAA;AAEnB,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA"}

package/dist/dialog/public.js

@@ -1 +1 @@
-export { init, update, open, close, view, titleId, descriptionId, Model, Message, OutMessage, ShowDialog, CloseDialog, ReleaseDialogResources, } from './index.js';
+export { init, boot, update, open, close, view, titleId, descriptionId, Model, Message, OutMessage, ShowDialog, AcquireResources, CloseDialog, ReleaseDialogResources, } from './index.js';

package/dist/disclosure/index.d.ts

@@ -22,8 +22,21 @@ export type DisclosureAttributes<Message> = Readonly<{
      *  disclosure opens and closes. The panel stays mounted while collapsed, so
      *  the transition has something to animate from and to. Spread the `panel`
      *  bundle onto the element you pass in, and render it unconditionally rather
-     *  than gating on `isOpen`. The collapsed content is marked `aria-hidden`. */
-    animatePanel: (content: Html) => Html;
+     *  than gating on `isOpen`.
+     *
+     *  Without options the collapsed panel is fully hidden. With `peek`, it keeps
+     *  that height as a visual preview of its content. In either case, the
+     *  collapsed content is inert and hidden from assistive technology until the
+     *  disclosure opens. */
+    animatePanel: (content: Html, options?: AnimatePanelOptions) => Html;
+}>;
+/** Options for {@link DisclosureAttributes.animatePanel}.
+ *
+ *  - `peek`: a CSS height the collapsed panel keeps, such as `'7.5em'` for
+ *    five lines at a 1.5 leading. The visible content is an inert preview;
+ *    content becomes accessible and interactive when the disclosure opens. */
+export type AnimatePanelOptions = Readonly<{
+    peek?: string;
 }>;
 /** Per-render view configuration for the stateless controlled {@link view}.
  *  Generic over `Message` (the message `onToggle` dispatches).

package/dist/disclosure/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/disclosure/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAIhE;;;mCAGmC;AACnC,eAAO,MAAM,QAAQ,OAAQ,MAAM,KAAG,MAAwB,CAAA;AAM9D;;;;;;;;;sEASsE;AACtE,MAAM,MAAM,oBAAoB,CAAC,OAAO,IAAI,QAAQ,CAAC;IACnD,MAAM,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IACzC,KAAK,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IACxC;;;;;kFAK8E;IAC9E,YAAY,EAAE,CAAC,OAAO,EAAE,IAAI,KAAK,IAAI,CAAA;CACtC,CAAC,CAAA;AAEF;;;;;;;;;;oBAUoB;AACpB,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,OAAO,CAAA;IACf,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAA;IACtC,MAAM,EAAE,CAAC,UAAU,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAC,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;UAsBU;AACV,eAAO,MAAM,IAAI,GAAI,OAAO,UAClB,UAAU,CAAC,OAAO,CAAC,KACxB,WAAW,CAAC,OAAO,CAAC,KACtB,IAiFF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/disclosure/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAIhE;;;mCAGmC;AACnC,eAAO,MAAM,QAAQ,OAAQ,MAAM,KAAG,MAAwB,CAAA;AAM9D;;;;;;;;;sEASsE;AACtE,MAAM,MAAM,oBAAoB,CAAC,OAAO,IAAI,QAAQ,CAAC;IACnD,MAAM,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IACzC,KAAK,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IACxC;;;;;;;;;;4BAUwB;IACxB,YAAY,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,OAAO,CAAC,EAAE,mBAAmB,KAAK,IAAI,CAAA;CACrE,CAAC,CAAA;AAEF;;;;8EAI8E;AAC9E,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAC,CAAA;AAEF;;;;;;;;;;oBAUoB;AACpB,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,OAAO,CAAA;IACf,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAA;IACtC,MAAM,EAAE,CAAC,UAAU,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAC,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;UAsBU;AACV,eAAO,MAAM,IAAI,GAAI,OAAO,UAClB,UAAU,CAAC,OAAO,CAAC,KACxB,WAAW,CAAC,OAAO,CAAC,KACtB,IA0FF,CAAA"}