foldkit 0.56.0 → 0.57.0

package/dist/ui/popover/index.js

@@ -1,4 +1,4 @@
-import { Array, Effect, Match as M, Option, Schema as S, pipe } from 'effect';
+import { Array, Effect, Equal, Match as M, Option, Schema as S } from 'effect';
 import * as Command from '../../command';
 import { OptionExt } from '../../effectExtensions';
 import { createLazy, html } from '../../html';
@@ -6,7 +6,11 @@ import { m } from '../../message';
 import { evo } from '../../struct';
 import * as Task from '../../task';
 import { anchorHooks } from '../anchor';
-import { TransitionState } from '../transition';
+// NOTE: Transition imports are split across schema + update to avoid a circular
+// dependency: transition → html → runtime → devtools → popover → transition.
+// The barrel (../transition) imports from html, which starts the cycle.
+import { EndedTransition as TransitionEndedTransition, Hidden as TransitionHidden, Message as TransitionMessage, Model as TransitionModel, Showed as TransitionShowed, init as transitionInit, } from '../transition/schema';
+import { update as transitionUpdate } from '../transition/update';
 // MODEL
 /** Schema for the popover component's state, tracking open/closed status and transition animation. */
 export const Model = S.Struct({
@@ -14,7 +18,7 @@ export const Model = S.Struct({
     isOpen: S.Boolean,
     isAnimated: S.Boolean,
     isModal: S.Boolean,
-    transitionState: TransitionState,
+    transition: TransitionModel,
     maybeLastButtonPointerType: S.OptionFromSelf(S.String),
 });
 // MESSAGE
@@ -45,14 +49,12 @@ export const CompletedTeardownInert = m('CompletedTeardownInert');
 export const IgnoredMouseClick = m('IgnoredMouseClick');
 /** Sent when a Space key-up is captured to prevent page scrolling. */
 export const SuppressedSpaceScroll = m('SuppressedSpaceScroll');
-/** Sent internally when a double-rAF completes, advancing the transition to its animating phase. */
-export const AdvancedTransitionFrame = m('AdvancedTransitionFrame');
-/** Sent internally when all CSS transitions on the popover panel have completed. */
-export const EndedTransition = m('EndedTransition');
-/** Sent internally when the popover button moves in the viewport during a leave transition, cancelling the animation. */
-export const DetectedButtonMovement = m('DetectedButtonMovement');
+/** Wraps a Transition submodel message for delegation. */
+export const GotTransitionMessage = m('GotTransitionMessage', {
+    message: TransitionMessage,
+});
 /** Union of all messages the popover component can produce. */
-export const Message = S.Union(Opened, Closed, ClosedByTab, PressedPointerOnButton, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, IgnoredMouseClick, SuppressedSpaceScroll, AdvancedTransitionFrame, EndedTransition, DetectedButtonMovement);
+export const Message = S.Union(Opened, Closed, ClosedByTab, PressedPointerOnButton, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, IgnoredMouseClick, SuppressedSpaceScroll, GotTransitionMessage);
 // INIT
 const LEFT_MOUSE_BUTTON = 0;
 /** Creates an initial popover model from a config. Defaults to closed. */
@@ -61,20 +63,17 @@ export const init = (config) => ({
     isOpen: false,
     isAnimated: config.isAnimated ?? false,
     isModal: config.isModal ?? false,
-    transitionState: 'Idle',
+    transition: transitionInit({ id: `${config.id}-panel` }),
     maybeLastButtonPointerType: Option.none(),
 });
 // UPDATE
 const closedModel = (model) => evo(model, {
     isOpen: () => false,
-    transitionState: () => (model.isAnimated ? 'LeaveStart' : 'Idle'),
     maybeLastButtonPointerType: () => Option.none(),
 });
 const buttonSelector = (id) => `#${id}-button`;
 const panelSelector = (id) => `#${id}-panel`;
 const withUpdateReturn = M.withReturnType();
-/** Advances the popover's enter/leave transition by waiting a double-rAF. */
-export const RequestFrame = Command.define('RequestFrame', AdvancedTransitionFrame);
 /** Prevents page scrolling while the popover is open in modal mode. */
 export const LockScroll = Command.define('LockScroll', CompletedLockScroll);
 /** Re-enables page scrolling after the popover closes. */
@@ -87,13 +86,31 @@ export const RestoreInert = Command.define('RestoreInert', CompletedTeardownIner
 export const FocusPanel = Command.define('FocusPanel', CompletedFocusPanel);
 /** Moves focus back to the popover button after closing. */
 export const FocusButton = Command.define('FocusButton', CompletedFocusButton);
-/** Waits for all CSS transitions on the popover panel to complete. */
-export const WaitForTransitions = Command.define('WaitForTransitions', EndedTransition);
-/** Detects whether the popover button moved or the leave transition ended — whichever comes first. */
-export const DetectMovementOrTransitionEnd = Command.define('DetectMovementOrTransitionEnd', DetectedButtonMovement, EndedTransition);
+/** Detects whether the popover button moved or the leave transition ended — whichever comes first. Both outcomes signal the Transition submodel that leave is complete. */
+export const DetectMovementOrTransitionEnd = Command.define('DetectMovementOrTransitionEnd', GotTransitionMessage);
+const delegateToTransition = (model, transitionMessage) => {
+    const [nextTransition, transitionCommands, maybeOutMessage] = transitionUpdate(model.transition, transitionMessage);
+    const mappedCommands = transitionCommands.map(Command.mapEffect(Effect.map(message => GotTransitionMessage({ message }))));
+    const additionalCommands = Option.match(maybeOutMessage, {
+        onNone: () => [],
+        onSome: M.type().pipe(M.tagsExhaustive({
+            StartedLeaveAnimating: () => [
+                DetectMovementOrTransitionEnd(Effect.raceFirst(Task.detectElementMovement(buttonSelector(model.id)).pipe(Effect.as(GotTransitionMessage({
+                    message: TransitionEndedTransition(),
+                }))), Task.waitForTransitions(panelSelector(model.id)).pipe(Effect.as(GotTransitionMessage({
+                    message: TransitionEndedTransition(),
+                }))))),
+            ],
+            TransitionedOut: () => [],
+        })),
+    });
+    return [
+        evo(model, { transition: () => nextTransition }),
+        [...mappedCommands, ...additionalCommands],
+    ];
+};
 /** Processes a popover message and returns the next model and commands. */
 export const update = (model, message) => {
-    const maybeNextFrame = OptionExt.when(model.isAnimated, RequestFrame(Task.nextFrame.pipe(Effect.as(AdvancedTransitionFrame()))));
     const maybeLockScroll = OptionExt.when(model.isModal, LockScroll(Task.lockScroll.pipe(Effect.as(CompletedLockScroll()))));
     const maybeUnlockScroll = OptionExt.when(model.isModal, UnlockScroll(Task.unlockScroll.pipe(Effect.as(CompletedUnlockScroll()))));
     const maybeInertOthers = OptionExt.when(model.isModal, InertOthers(Task.inertOthers(model.id, [
@@ -101,29 +118,47 @@ export const update = (model, message) => {
         panelSelector(model.id),
     ]).pipe(Effect.as(CompletedSetupInert()))));
     const maybeRestoreInert = OptionExt.when(model.isModal, RestoreInert(Task.restoreInert(model.id).pipe(Effect.as(CompletedTeardownInert()))));
-    return M.value(message).pipe(withUpdateReturn, M.tagsExhaustive({
-        Opened: () => {
-            const nextModel = evo(model, {
-                isOpen: () => true,
-                transitionState: () => (model.isAnimated ? 'EnterStart' : 'Idle'),
-            });
+    const focusPanel = FocusPanel(Task.focus(panelSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusPanel())));
+    const focusButton = FocusButton(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton())));
+    const openCommands = [
+        focusPanel,
+        ...Array.getSomes([maybeLockScroll, maybeInertOthers]),
+    ];
+    const closeWithFocusCommands = [
+        focusButton,
+        ...Array.getSomes([maybeUnlockScroll, maybeRestoreInert]),
+    ];
+    const closeWithoutFocusCommands = Array.getSomes([
+        maybeUnlockScroll,
+        maybeRestoreInert,
+    ]);
+    const openPopover = (baseModel) => {
+        if (model.isAnimated) {
+            const [nextModel, transitionCommands] = delegateToTransition(baseModel, TransitionShowed());
             return [
-                nextModel,
-                pipe(Array.getSomes([maybeNextFrame, maybeLockScroll, maybeInertOthers]), Array.prepend(FocusPanel(Task.focus(panelSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusPanel()))))),
+                evo(nextModel, { isOpen: () => true }),
+                [...openCommands, ...transitionCommands],
             ];
+        }
+        return [evo(baseModel, { isOpen: () => true }), openCommands];
+    };
+    const closePopover = (baseModel, commands) => {
+        const closed = closedModel(baseModel);
+        if (model.isAnimated) {
+            const [nextModel, transitionCommands] = delegateToTransition(closed, TransitionHidden());
+            return [nextModel, [...commands, ...transitionCommands]];
+        }
+        return [closed, commands];
+    };
+    return M.value(message).pipe(withUpdateReturn, M.tagsExhaustive({
+        Opened: () => openPopover(model),
+        Closed: () => closePopover(model, closeWithFocusCommands),
+        ClosedByTab: () => {
+            if (Option.exists(model.maybeLastButtonPointerType, Equal.equals('mouse'))) {
+                return [model, []];
+            }
+            return closePopover(model, closeWithoutFocusCommands);
         },
-        Closed: () => [
-            closedModel(model),
-            pipe(Array.getSomes([
-                maybeNextFrame,
-                maybeUnlockScroll,
-                maybeRestoreInert,
-            ]), Array.prepend(FocusButton(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton()))))),
-        ],
-        ClosedByTab: () => [
-            closedModel(model),
-            Array.getSomes([maybeNextFrame, maybeUnlockScroll, maybeRestoreInert]),
-        ],
         PressedPointerOnButton: ({ pointerType, button }) => {
             const withPointerType = evo(model, {
                 maybeLastButtonPointerType: () => Option.some(pointerType),
@@ -132,50 +167,27 @@ export const update = (model, message) => {
                 return [withPointerType, []];
             }
             if (model.isOpen) {
+                const [closed, commands] = closePopover(withPointerType, closeWithFocusCommands);
                 return [
-                    closedModel(withPointerType),
-                    pipe(Array.getSomes([
-                        maybeNextFrame,
-                        maybeUnlockScroll,
-                        maybeRestoreInert,
-                    ]), Array.prepend(FocusButton(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton()))))),
+                    evo(closed, {
+                        maybeLastButtonPointerType: () => Option.some(pointerType),
+                    }),
+                    commands,
                 ];
             }
-            const nextModel = evo(withPointerType, {
-                isOpen: () => true,
-                transitionState: () => (model.isAnimated ? 'EnterStart' : 'Idle'),
-            });
-            return [
-                nextModel,
-                pipe(Array.getSomes([maybeNextFrame, maybeLockScroll, maybeInertOthers]), Array.prepend(FocusPanel(Task.focus(panelSelector(model.id)).pipe(Effect.ignore, Effect.as(CompletedFocusPanel()))))),
-            ];
+            return openPopover(withPointerType);
         },
-        AdvancedTransitionFrame: () => M.value(model.transitionState).pipe(withUpdateReturn, M.when('EnterStart', () => [
-            evo(model, { transitionState: () => 'EnterAnimating' }),
-            [
-                WaitForTransitions(Task.waitForTransitions(panelSelector(model.id)).pipe(Effect.as(EndedTransition()))),
-            ],
-        ]), M.when('LeaveStart', () => [
-            evo(model, { transitionState: () => 'LeaveAnimating' }),
-            [
-                DetectMovementOrTransitionEnd(Effect.raceFirst(Task.detectElementMovement(buttonSelector(model.id)).pipe(Effect.as(DetectedButtonMovement())), Task.waitForTransitions(panelSelector(model.id)).pipe(Effect.as(EndedTransition())))),
-            ],
-        ]), M.orElse(() => [model, []])),
-        EndedTransition: () => M.value(model.transitionState).pipe(withUpdateReturn, M.whenOr('EnterAnimating', 'LeaveAnimating', () => [
-            evo(model, { transitionState: () => 'Idle' }),
-            [],
-        ]), M.orElse(() => [model, []])),
-        DetectedButtonMovement: () => M.value(model.transitionState).pipe(withUpdateReturn, M.when('LeaveAnimating', () => [
-            evo(model, { transitionState: () => 'Idle' }),
-            [],
-        ]), M.orElse(() => [model, []])),
+        GotTransitionMessage: ({ message: transitionMessage }) => delegateToTransition(model, transitionMessage),
         CompletedFocusPanel: () => [model, []],
         CompletedFocusButton: () => [model, []],
         CompletedLockScroll: () => [model, []],
         CompletedUnlockScroll: () => [model, []],
         CompletedSetupInert: () => [model, []],
         CompletedTeardownInert: () => [model, []],
-        IgnoredMouseClick: () => [model, []],
+        IgnoredMouseClick: () => [
+            evo(model, { maybeLastButtonPointerType: () => Option.none() }),
+            [],
+        ],
         SuppressedSpaceScroll: () => [model, []],
     }));
 };
@@ -188,7 +200,7 @@ export const close = (model) => update(model, Closed());
 /** Renders a headless popover with a trigger button and a floating panel. Uses the disclosure ARIA pattern (aria-expanded + aria-controls) with no role on the panel. */
 export const view = (config) => {
     const { div, AriaControls, AriaDisabled, AriaExpanded, Class, DataAttribute, Id, OnBlur, OnClick, OnDestroy, OnInsert, OnKeyDownPreventDefault, OnKeyUpPreventDefault, OnPointerDown, Style, Tabindex, Type, keyed, } = html();
-    const { model: { id, isOpen, transitionState, maybeLastButtonPointerType }, toParentMessage, onOpened, onClosed, anchor, buttonContent, buttonClassName, buttonAttributes = [], panelContent, panelClassName, panelAttributes = [], backdropClassName, backdropAttributes = [], isDisabled, className, attributes = [], } = config;
+    const { model: { id, isOpen, transition: { transitionState }, maybeLastButtonPointerType, }, toParentMessage, onOpened, onClosed, anchor, buttonContent, buttonClassName, buttonAttributes = [], panelContent, panelClassName, panelAttributes = [], backdropClassName, backdropAttributes = [], isDisabled, className, attributes = [], } = config;
     const dispatchOpened = () => onOpened ? onOpened() : toParentMessage(Opened());
     const dispatchClosed = () => onClosed ? onClosed() : toParentMessage(Closed());
     const isLeaving = transitionState === 'LeaveStart' || transitionState === 'LeaveAnimating';
@@ -240,7 +252,12 @@ export const view = (config) => {
                 OnKeyUpPreventDefault(handleSpaceKeyUp),
                 OnClick(handleButtonClick()),
             ]),
-        ...(isVisible ? [DataAttribute('open', '')] : []),
+        ...(isVisible
+            ? [
+                DataAttribute('open', ''),
+                Style({ position: 'relative', zIndex: '1' }),
+            ]
+            : []),
         ...(buttonClassName ? [Class(buttonClassName)] : []),
         ...buttonAttributes,
     ];

package/dist/ui/popover/public.d.ts

@@ -1,5 +1,4 @@
-export { init, update, open, close, view, lazy, Model, Message, Opened, Closed, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, AdvancedTransitionFrame, EndedTransition, DetectedButtonMovement, RequestFrame, LockScroll, UnlockScroll, InertOthers, RestoreInert, FocusPanel, FocusButton, WaitForTransitions, DetectMovementOrTransitionEnd, } from './index';
-export { TransitionState } from '../transition';
+export { init, update, open, close, view, lazy, Model, Message, Opened, Closed, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, GotTransitionMessage, LockScroll, UnlockScroll, InertOthers, RestoreInert, FocusPanel, FocusButton, DetectMovementOrTransitionEnd, } from './index';
 export type { ClosedByTab, PressedPointerOnButton, IgnoredMouseClick, SuppressedSpaceScroll, InitConfig, ViewConfig, } from './index';
 export type { AnchorConfig } from '../anchor';
 //# sourceMappingURL=public.d.ts.map

package/dist/ui/popover/public.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/ui/popover/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,OAAO,EACP,MAAM,EACN,MAAM,EACN,mBAAmB,EACnB,oBAAoB,EACpB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,sBAAsB,EACtB,uBAAuB,EACvB,eAAe,EACf,sBAAsB,EACtB,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,UAAU,EACV,WAAW,EACX,kBAAkB,EAClB,6BAA6B,GAC9B,MAAM,SAAS,CAAA;AAEhB,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAE/C,YAAY,EACV,WAAW,EACX,sBAAsB,EACtB,iBAAiB,EACjB,qBAAqB,EACrB,UAAU,EACV,UAAU,GACX,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA"}
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/ui/popover/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,OAAO,EACP,MAAM,EACN,MAAM,EACN,mBAAmB,EACnB,oBAAoB,EACpB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,sBAAsB,EACtB,oBAAoB,EACpB,UAAU,EACV,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,UAAU,EACV,WAAW,EACX,6BAA6B,GAC9B,MAAM,SAAS,CAAA;AAEhB,YAAY,EACV,WAAW,EACX,sBAAsB,EACtB,iBAAiB,EACjB,qBAAqB,EACrB,UAAU,EACV,UAAU,GACX,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA"}

package/dist/ui/popover/public.js

@@ -1,2 +1 @@
-export { init, update, open, close, view, lazy, Model, Message, Opened, Closed, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, AdvancedTransitionFrame, EndedTransition, DetectedButtonMovement, RequestFrame, LockScroll, UnlockScroll, InertOthers, RestoreInert, FocusPanel, FocusButton, WaitForTransitions, DetectMovementOrTransitionEnd, } from './index';
-export { TransitionState } from '../transition';
+export { init, update, open, close, view, lazy, Model, Message, Opened, Closed, CompletedFocusPanel, CompletedFocusButton, CompletedLockScroll, CompletedUnlockScroll, CompletedSetupInert, CompletedTeardownInert, GotTransitionMessage, LockScroll, UnlockScroll, InertOthers, RestoreInert, FocusPanel, FocusButton, DetectMovementOrTransitionEnd, } from './index';

package/dist/ui/transition/index.d.ts

@@ -1,61 +1,12 @@
-import { Option, Schema as S } from 'effect';
-import * as Command from '../../command';
 import { type Attribute, type Html, type TagName } from '../../html';
-/** Schema for the transition component's state, tracking its unique ID, visibility intent, and animation phase. */
-export declare const Model: S.Struct<{
-    id: typeof S.String;
-    isShowing: typeof S.Boolean;
-    transitionState: S.Literal<["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
-}>;
-export type Model = typeof Model.Type;
-/** Sent when the transition should enter (become visible). Starts the enter animation sequence. */
-export declare const Showed: import("../../schema").CallableTaggedStruct<"Showed", {}>;
-/** Sent when the transition should leave (become hidden). Starts the leave animation sequence. */
-export declare const Hidden: import("../../schema").CallableTaggedStruct<"Hidden", {}>;
-/** Sent internally when a double-rAF completes, advancing the transition to its animating phase. */
-export declare const AdvancedTransitionFrame: import("../../schema").CallableTaggedStruct<"AdvancedTransitionFrame", {}>;
-/** Sent internally when all CSS transitions on the transition element have completed. */
-export declare const EndedTransition: import("../../schema").CallableTaggedStruct<"EndedTransition", {}>;
-/** Union of all messages the transition component can produce. */
-export declare const Message: S.Union<[
-    typeof Showed,
-    typeof Hidden,
-    typeof AdvancedTransitionFrame,
-    typeof EndedTransition
-]>;
-export type Showed = typeof Showed.Type;
-export type Hidden = typeof Hidden.Type;
-export type Message = typeof Message.Type;
-/** Sent to the parent when the leave animation completes. The parent can use this to unmount content or update its own state. */
-export declare const TransitionedOut: import("../../schema").CallableTaggedStruct<"TransitionedOut", {}>;
-export declare const OutMessage: import("../../schema").CallableTaggedStruct<"TransitionedOut", {}>;
-export type OutMessage = typeof OutMessage.Type;
-/** Configuration for creating a transition model with `init`. */
-export type InitConfig = Readonly<{
-    id: string;
-    isShowing?: boolean;
-}>;
-/** Creates an initial transition model from a config. Defaults to hidden. */
-export declare const init: (config: InitConfig) => Model;
-type UpdateReturn = readonly [
-    Model,
-    ReadonlyArray<Command.Command<Message>>,
-    Option.Option<OutMessage>
-];
-/** Advances the transition's enter/leave animation by waiting a double-rAF. */
-export declare const RequestFrame: Command.CommandDefinition<"RequestFrame", {
-    readonly _tag: "AdvancedTransitionFrame";
-}>;
-/** Waits for all CSS transitions on the transition element to complete. */
-export declare const WaitForTransitions: Command.CommandDefinition<"WaitForTransitions", {
-    readonly _tag: "EndedTransition";
-}>;
-/** Processes a transition message and returns the next model, commands, and optional OutMessage. */
-export declare const update: (model: Model, message: Message) => UpdateReturn;
+import { AdvancedTransitionFrame, EndedTransition, Hidden, Message, Model, OutMessage, Showed, StartedLeaveAnimating, TransitionState, TransitionedOut, init } from './schema';
+import { RequestFrame, WaitForTransitions, defaultLeaveCommand, update } from './update';
+export type { InitConfig } from './schema';
+export { AdvancedTransitionFrame, EndedTransition, Hidden, init, Message, Model, OutMessage, Showed, StartedLeaveAnimating, TransitionState, TransitionedOut, };
+export { RequestFrame, WaitForTransitions, defaultLeaveCommand, update };
 /** Configuration for rendering a transition with `view`. */
 export type ViewConfig<Message> = Readonly<{
     model: Model;
-    toParentMessage: (message: Showed | Hidden) => Message;
     content: Html;
     className?: string;
     attributes?: ReadonlyArray<Attribute<Message>>;
@@ -75,8 +26,7 @@ export type ViewConfig<Message> = Readonly<{
  */
 export declare const view: <Message>(config: ViewConfig<Message>) => Html;
 /** Creates a memoized transition view. Static config (className, element, etc.)
- *  is captured in a closure. Dynamic fields — `model`, `toParentMessage`,
- *  and `content` — are compared by reference per render via `createLazy`. */
-export declare const lazy: <Message>(staticConfig: Omit<ViewConfig<Message>, "model" | "toParentMessage" | "content">) => ((model: Model, toParentMessage: ViewConfig<Message>["toParentMessage"], content: Html) => Html);
-export {};
+ *  is captured in a closure. Dynamic fields — `model` and `content` — are
+ *  compared by reference per render via `createLazy`. */
+export declare const lazy: <Message>(staticConfig: Omit<ViewConfig<Message>, "model" | "content">) => ((model: Model, content: Html) => Html);
 //# sourceMappingURL=index.d.ts.map

package/dist/ui/transition/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/transition/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/transition/index.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,IAAI,EACT,KAAK,OAAO,EAGb,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,uBAAuB,EACvB,eAAe,EACf,MAAM,EACN,OAAO,EACP,KAAK,EACL,UAAU,EACV,MAAM,EACN,qBAAqB,EACrB,eAAe,EACf,eAAe,EACf,IAAI,EACL,MAAM,UAAU,CAAA;AACjB,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,MAAM,EACP,MAAM,UAAU,CAAA;AAEjB,YAAY,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAC1C,OAAO,EACL,uBAAuB,EACvB,eAAe,EACf,MAAM,EACN,IAAI,EACJ,OAAO,EACP,KAAK,EACL,UAAU,EACV,MAAM,EACN,qBAAqB,EACrB,eAAe,EACf,eAAe,GAChB,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,EAAE,CAAA;AAIxE,4DAA4D;AAC5D,MAAM,MAAM,UAAU,CAAC,OAAO,IAAI,QAAQ,CAAC;IACzC,KAAK,EAAE,KAAK,CAAA;IACZ,OAAO,EAAE,IAAI,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAA;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;2EAEuE;IACvE,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAC,CAAA;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,IAAI,GAAI,OAAO,EAAE,QAAQ,UAAU,CAAC,OAAO,CAAC,KAAG,IA+F3D,CAAA;AAED;;yDAEyD;AACzD,eAAO,MAAM,IAAI,GAAI,OAAO,EAC1B,cAAc,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC,KAC3D,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,KAAK,IAAI,CAaxC,CAAA"}

package/dist/ui/transition/index.js

@@ -1,101 +1,9 @@
-import { Effect, Match as M, Option, Schema as S } from 'effect';
-import * as Command from '../../command';
+import { Match as M } from 'effect';
 import { createLazy, html, } from '../../html';
-import { m } from '../../message';
-import { evo } from '../../struct';
-import * as Task from '../../task';
-import { TransitionState } from '../transition';
-// MODEL
-/** Schema for the transition component's state, tracking its unique ID, visibility intent, and animation phase. */
-export const Model = S.Struct({
-    id: S.String,
-    isShowing: S.Boolean,
-    transitionState: TransitionState,
-});
-// MESSAGE
-/** Sent when the transition should enter (become visible). Starts the enter animation sequence. */
-export const Showed = m('Showed');
-/** Sent when the transition should leave (become hidden). Starts the leave animation sequence. */
-export const Hidden = m('Hidden');
-/** Sent internally when a double-rAF completes, advancing the transition to its animating phase. */
-export const AdvancedTransitionFrame = m('AdvancedTransitionFrame');
-/** Sent internally when all CSS transitions on the transition element have completed. */
-export const EndedTransition = m('EndedTransition');
-/** Union of all messages the transition component can produce. */
-export const Message = S.Union(Showed, Hidden, AdvancedTransitionFrame, EndedTransition);
-// OUT MESSAGE
-/** Sent to the parent when the leave animation completes. The parent can use this to unmount content or update its own state. */
-export const TransitionedOut = m('TransitionedOut');
-export const OutMessage = S.Union(TransitionedOut);
-/** Creates an initial transition model from a config. Defaults to hidden. */
-export const init = (config) => ({
-    id: config.id,
-    isShowing: config.isShowing ?? false,
-    transitionState: 'Idle',
-});
-// UPDATE
-const elementSelector = (id) => `#${id}`;
-const withUpdateReturn = M.withReturnType();
-/** Advances the transition's enter/leave animation by waiting a double-rAF. */
-export const RequestFrame = Command.define('RequestFrame', AdvancedTransitionFrame);
-/** Waits for all CSS transitions on the transition element to complete. */
-export const WaitForTransitions = Command.define('WaitForTransitions', EndedTransition);
-/** Processes a transition message and returns the next model, commands, and optional OutMessage. */
-export const update = (model, message) => {
-    const maybeNextFrame = RequestFrame(Task.nextFrame.pipe(Effect.as(AdvancedTransitionFrame())));
-    return M.value(message).pipe(withUpdateReturn, M.tagsExhaustive({
-        Showed: () => {
-            if (model.isShowing) {
-                return [model, [], Option.none()];
-            }
-            return [
-                evo(model, {
-                    isShowing: () => true,
-                    transitionState: () => 'EnterStart',
-                }),
-                [maybeNextFrame],
-                Option.none(),
-            ];
-        },
-        Hidden: () => {
-            const isLeaving = model.transitionState === 'LeaveStart' ||
-                model.transitionState === 'LeaveAnimating';
-            if (isLeaving || !model.isShowing) {
-                return [model, [], Option.none()];
-            }
-            return [
-                evo(model, {
-                    isShowing: () => false,
-                    transitionState: () => 'LeaveStart',
-                }),
-                [maybeNextFrame],
-                Option.none(),
-            ];
-        },
-        AdvancedTransitionFrame: () => M.value(model.transitionState).pipe(withUpdateReturn, M.when('EnterStart', () => [
-            evo(model, { transitionState: () => 'EnterAnimating' }),
-            [
-                WaitForTransitions(Task.waitForTransitions(elementSelector(model.id)).pipe(Effect.as(EndedTransition()))),
-            ],
-            Option.none(),
-        ]), M.when('LeaveStart', () => [
-            evo(model, { transitionState: () => 'LeaveAnimating' }),
-            [
-                WaitForTransitions(Task.waitForTransitions(elementSelector(model.id)).pipe(Effect.as(EndedTransition()))),
-            ],
-            Option.none(),
-        ]), M.orElse(() => [model, [], Option.none()])),
-        EndedTransition: () => M.value(model.transitionState).pipe(withUpdateReturn, M.when('EnterAnimating', () => [
-            evo(model, { transitionState: () => 'Idle' }),
-            [],
-            Option.none(),
-        ]), M.when('LeaveAnimating', () => [
-            evo(model, { transitionState: () => 'Idle' }),
-            [],
-            Option.some(TransitionedOut()),
-        ]), M.orElse(() => [model, [], Option.none()])),
-    }));
-};
+import { AdvancedTransitionFrame, EndedTransition, Hidden, Message, Model, OutMessage, Showed, StartedLeaveAnimating, TransitionState, TransitionedOut, init, } from './schema';
+import { RequestFrame, WaitForTransitions, defaultLeaveCommand, update, } from './update';
+export { AdvancedTransitionFrame, EndedTransition, Hidden, init, Message, Model, OutMessage, Showed, StartedLeaveAnimating, TransitionState, TransitionedOut, };
+export { RequestFrame, WaitForTransitions, defaultLeaveCommand, update };
 /** Renders a headless transition wrapper that coordinates CSS transitions via data attributes.
  *
  *  Data attributes reflect the current transition phase:
@@ -136,17 +44,20 @@ export const view = (config) => {
                 overflow: 'hidden',
             }),
         ], [
-            keyed(element)(id, [
-                Id(id),
+            div([
                 Style({ minHeight: '0px', overflow: 'hidden' }),
-                ...(isClosed && transitionState === 'Idle'
-                    ? [DataAttribute('closed', '')]
-                    : []),
-                ...transitionAttributes,
-                ...(className ? [Class(className)] : []),
                 ...(!isVisible ? [AriaHidden(true)] : []),
-                ...attributes,
-            ], [content]),
+            ], [
+                keyed(element)(id, [
+                    Id(id),
+                    ...(isClosed && transitionState === 'Idle'
+                        ? [DataAttribute('closed', '')]
+                        : []),
+                    ...transitionAttributes,
+                    ...(className ? [Class(className)] : []),
+                    ...attributes,
+                ], [content]),
+            ]),
         ]);
     }
     if (!isVisible) {
@@ -160,14 +71,13 @@ export const view = (config) => {
     ], [content]);
 };
 /** Creates a memoized transition view. Static config (className, element, etc.)
- *  is captured in a closure. Dynamic fields — `model`, `toParentMessage`,
- *  and `content` — are compared by reference per render via `createLazy`. */
+ *  is captured in a closure. Dynamic fields — `model` and `content` — are
+ *  compared by reference per render via `createLazy`. */
 export const lazy = (staticConfig) => {
     const lazyView = createLazy();
-    return (model, toParentMessage, content) => lazyView((currentModel, currentToMessage, currentContent) => view({
+    return (model, content) => lazyView((currentModel, currentContent) => view({
         ...staticConfig,
         model: currentModel,
-        toParentMessage: currentToMessage,
         content: currentContent,
-    }), [model, toParentMessage, content]);
+    }), [model, content]);
 };

package/dist/ui/transition/public.d.ts

@@ -1,3 +1,3 @@
-export { init, update, view, lazy, Model, Message, OutMessage, Showed, Hidden, AdvancedTransitionFrame, EndedTransition, TransitionedOut, RequestFrame, WaitForTransitions, } from './index';
+export { init, update, view, lazy, defaultLeaveCommand, Model, Message, OutMessage, Showed, Hidden, AdvancedTransitionFrame, EndedTransition, StartedLeaveAnimating, TransitionedOut, TransitionState, RequestFrame, WaitForTransitions, } from './index';
 export type { InitConfig, ViewConfig } from './index';
 //# sourceMappingURL=public.d.ts.map

package/dist/ui/transition/public.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/ui/transition/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,OAAO,EACP,UAAU,EACV,MAAM,EACN,MAAM,EACN,uBAAuB,EACvB,eAAe,EACf,eAAe,EACf,YAAY,EACZ,kBAAkB,GACnB,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/ui/transition/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,IAAI,EACJ,mBAAmB,EACnB,KAAK,EACL,OAAO,EACP,UAAU,EACV,MAAM,EACN,MAAM,EACN,uBAAuB,EACvB,eAAe,EACf,qBAAqB,EACrB,eAAe,EACf,eAAe,EACf,YAAY,EACZ,kBAAkB,GACnB,MAAM,SAAS,CAAA;AAEhB,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}

package/dist/ui/transition/public.js

@@ -1 +1 @@
-export { init, update, view, lazy, Model, Message, OutMessage, Showed, Hidden, AdvancedTransitionFrame, EndedTransition, TransitionedOut, RequestFrame, WaitForTransitions, } from './index';
+export { init, update, view, lazy, defaultLeaveCommand, Model, Message, OutMessage, Showed, Hidden, AdvancedTransitionFrame, EndedTransition, StartedLeaveAnimating, TransitionedOut, TransitionState, RequestFrame, WaitForTransitions, } from './index';

package/dist/ui/transition/schema.d.ts

@@ -0,0 +1,43 @@
+import { Schema as S } from 'effect';
+/** Schema for the transition animation state, tracking enter/leave phases for CSS transition coordination. */
+export declare const TransitionState: S.Literal<["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
+export type TransitionState = typeof TransitionState.Type;
+/** Schema for the transition component's state, tracking its unique ID, visibility intent, and animation phase. */
+export declare const Model: S.Struct<{
+    id: typeof S.String;
+    isShowing: typeof S.Boolean;
+    transitionState: S.Literal<["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
+}>;
+export type Model = typeof Model.Type;
+/** Sent when the transition should enter (become visible). Starts the enter animation sequence. */
+export declare const Showed: import("../../schema").CallableTaggedStruct<"Showed", {}>;
+/** Sent when the transition should leave (become hidden). Starts the leave animation sequence. */
+export declare const Hidden: import("../../schema").CallableTaggedStruct<"Hidden", {}>;
+/** Sent internally when a double-rAF completes, advancing the transition to its animating phase. */
+export declare const AdvancedTransitionFrame: import("../../schema").CallableTaggedStruct<"AdvancedTransitionFrame", {}>;
+/** Sent internally when all CSS transitions on the transition element have completed. */
+export declare const EndedTransition: import("../../schema").CallableTaggedStruct<"EndedTransition", {}>;
+/** Union of all messages the transition component can produce. */
+export declare const Message: S.Union<[
+    typeof Showed,
+    typeof Hidden,
+    typeof AdvancedTransitionFrame,
+    typeof EndedTransition
+]>;
+export type Message = typeof Message.Type;
+export type Showed = typeof Showed.Type;
+export type Hidden = typeof Hidden.Type;
+/** Sent to the parent when the leave transition advances to LeaveAnimating. The parent is responsible for providing the command that detects when the leave animation completes (e.g. WaitForTransitions or a racing command). Use `defaultLeaveCommand` for the standard behavior. */
+export declare const StartedLeaveAnimating: import("../../schema").CallableTaggedStruct<"StartedLeaveAnimating", {}>;
+/** Sent to the parent when the leave animation completes. The parent can use this to unmount content or update its own state. */
+export declare const TransitionedOut: import("../../schema").CallableTaggedStruct<"TransitionedOut", {}>;
+export declare const OutMessage: S.Union<[import("../../schema").CallableTaggedStruct<"StartedLeaveAnimating", {}>, import("../../schema").CallableTaggedStruct<"TransitionedOut", {}>]>;
+export type OutMessage = typeof OutMessage.Type;
+/** Configuration for creating a transition model with `init`. */
+export type InitConfig = Readonly<{
+    id: string;
+    isShowing?: boolean;
+}>;
+/** Creates an initial transition model from a config. Defaults to hidden. */
+export declare const init: (config: InitConfig) => Model;
+//# sourceMappingURL=schema.d.ts.map

package/dist/ui/transition/schema.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/ui/transition/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAA;AAMpC,8GAA8G;AAC9G,eAAO,MAAM,eAAe,qFAM3B,CAAA;AACD,MAAM,MAAM,eAAe,GAAG,OAAO,eAAe,CAAC,IAAI,CAAA;AAIzD,mHAAmH;AACnH,eAAO,MAAM,KAAK;;;;EAIhB,CAAA;AAEF,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,IAAI,CAAA;AAIrC,mGAAmG;AACnG,eAAO,MAAM,MAAM,2DAAc,CAAA;AACjC,kGAAkG;AAClG,eAAO,MAAM,MAAM,2DAAc,CAAA;AACjC,oGAAoG;AACpG,eAAO,MAAM,uBAAuB,4EAA+B,CAAA;AACnE,yFAAyF;AACzF,eAAO,MAAM,eAAe,oEAAuB,CAAA;AAEnD,kEAAkE;AAClE,eAAO,MAAM,OAAO,EAAE,CAAC,CAAC,KAAK,CAC3B;IACE,OAAO,MAAM;IACb,OAAO,MAAM;IACb,OAAO,uBAAuB;IAC9B,OAAO,eAAe;CACvB,CACkE,CAAA;AACrE,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAA;AAEzC,MAAM,MAAM,MAAM,GAAG,OAAO,MAAM,CAAC,IAAI,CAAA;AACvC,MAAM,MAAM,MAAM,GAAG,OAAO,MAAM,CAAC,IAAI,CAAA;AAIvC,uRAAuR;AACvR,eAAO,MAAM,qBAAqB,0EAA6B,CAAA;AAC/D,iIAAiI;AACjI,eAAO,MAAM,eAAe,oEAAuB,CAAA;AAEnD,eAAO,MAAM,UAAU,yJAAkD,CAAA;AACzE,MAAM,MAAM,UAAU,GAAG,OAAO,UAAU,CAAC,IAAI,CAAA;AAI/C,iEAAiE;AACjE,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAC,CAAA;AAEF,6EAA6E;AAC7E,eAAO,MAAM,IAAI,GAAI,QAAQ,UAAU,KAAG,KAIxC,CAAA"}

package/dist/ui/transition/schema.js

@@ -0,0 +1,35 @@
+import { Schema as S } from 'effect';
+import { m } from '../../message';
+// TRANSITION STATE
+/** Schema for the transition animation state, tracking enter/leave phases for CSS transition coordination. */
+export const TransitionState = S.Literal('Idle', 'EnterStart', 'EnterAnimating', 'LeaveStart', 'LeaveAnimating');
+// MODEL
+/** Schema for the transition component's state, tracking its unique ID, visibility intent, and animation phase. */
+export const Model = S.Struct({
+    id: S.String,
+    isShowing: S.Boolean,
+    transitionState: TransitionState,
+});
+// MESSAGE
+/** Sent when the transition should enter (become visible). Starts the enter animation sequence. */
+export const Showed = m('Showed');
+/** Sent when the transition should leave (become hidden). Starts the leave animation sequence. */
+export const Hidden = m('Hidden');
+/** Sent internally when a double-rAF completes, advancing the transition to its animating phase. */
+export const AdvancedTransitionFrame = m('AdvancedTransitionFrame');
+/** Sent internally when all CSS transitions on the transition element have completed. */
+export const EndedTransition = m('EndedTransition');
+/** Union of all messages the transition component can produce. */
+export const Message = S.Union(Showed, Hidden, AdvancedTransitionFrame, EndedTransition);
+// OUT MESSAGE
+/** Sent to the parent when the leave transition advances to LeaveAnimating. The parent is responsible for providing the command that detects when the leave animation completes (e.g. WaitForTransitions or a racing command). Use `defaultLeaveCommand` for the standard behavior. */
+export const StartedLeaveAnimating = m('StartedLeaveAnimating');
+/** Sent to the parent when the leave animation completes. The parent can use this to unmount content or update its own state. */
+export const TransitionedOut = m('TransitionedOut');
+export const OutMessage = S.Union(StartedLeaveAnimating, TransitionedOut);
+/** Creates an initial transition model from a config. Defaults to hidden. */
+export const init = (config) => ({
+    id: config.id,
+    isShowing: config.isShowing ?? false,
+    transitionState: 'Idle',
+});