@pibbl/core 0.0.1 → 0.0.3-alpha.109.1

package/dist/lib/hooks/use-animated-value.js

@@ -1,8 +1,9 @@
+import { bindAnimationTarget } from "../animation/definition.js";
+import { drive } from "../animation/program.js";
+import { withSignalWriteForbidden } from "../signals/graph.js";
 import {
   createAnimationPlaybackController
 } from "../animation/playback.js";
-import { spring, tween } from "../animation/definition.js";
-import { drive } from "../animation/program.js";
 import { GLOBAL_STATE } from "../global-state.js";
 import {
   isSignal,
@@ -11,45 +12,16 @@ import {
   untracked
 } from "../signals/graph.js";
 import { resolveSignalValue } from "../signals/resolve-signal-value.js";
-import { requireHookContext, useHookSlot } from "./hook-slot.js";
-function hasOwn(value, key) {
-  return Object.prototype.hasOwnProperty.call(value, key);
-}
+import { requireHookContext, useHookSlot, withHooksForbidden } from "./hook-slot.js";
 function normalizeCandidate(target, options) {
   if (typeof options !== "object" || options === null) {
-    throw new TypeError("Pibbl transition options must be an object.");
-  }
-  if (options.type !== "tween" && options.type !== "spring") {
-    throw new TypeError('Pibbl transition type must be "tween" or "spring".');
+    throw new TypeError("useAnimatedValue options must be an object.");
   }
   if (options.equals !== void 0 && typeof options.equals !== "function") {
     throw new TypeError("Pibbl transition equals must be a function.");
   }
   const snapshot = Object.freeze({ ...options });
-  if (snapshot.type === "spring") {
-    spring({
-      from: target,
-      to: target,
-      mass: snapshot.mass,
-      stiffness: snapshot.stiffness,
-      damping: snapshot.damping,
-      initialVelocity: snapshot.initialVelocity,
-      restSpeed: snapshot.restSpeed,
-      restDelta: snapshot.restDelta,
-      maxDuration: snapshot.maxDuration,
-      debugName: snapshot.debugName
-    });
-  } else {
-    tween({
-      from: target,
-      to: target,
-      duration: snapshot.duration,
-      easing: snapshot.easing,
-      interpolate: snapshot.interpolate,
-      debugName: snapshot.debugName
-    });
-  }
-  const hasInitial = hasOwn(options, "initial");
+  const hasInitial = Object.prototype.hasOwnProperty.call(options, "initial");
   return Object.freeze({
     options: snapshot,
     equals: snapshot.equals ?? Object.is,
@@ -58,31 +30,6 @@ function normalizeCandidate(target, options) {
     target
   });
 }
-function programFor(output, from, candidate, springVelocity) {
-  const options = candidate.options;
-  if (options.type === "spring") {
-    return drive(output, spring({
-      from,
-      to: candidate.target,
-      mass: options.mass,
-      stiffness: options.stiffness,
-      damping: options.damping,
-      initialVelocity: springVelocity ?? options.initialVelocity,
-      restSpeed: options.restSpeed,
-      restDelta: options.restDelta,
-      maxDuration: options.maxDuration,
-      debugName: options.debugName
-    }));
-  }
-  return drive(output, tween({
-    from,
-    to: candidate.target,
-    duration: options.duration,
-    easing: options.easing,
-    interpolate: options.interpolate,
-    debugName: options.debugName
-  }));
-}
 function isCurrentSlot(slot) {
   return !slot.componentRefs.teardowns.closed && !slot.pibblInstance.mainTeardowns.closed && GLOBAL_STATE.pibblInstances.get(slot.pibblInstance.canvas) === slot.pibblInstance && slot.pibblInstance.refs.get(slot.componentRefs.id) === slot.componentRefs;
 }
@@ -91,13 +38,14 @@ function useAnimatedValue(targetInput, optionsInput) {
   const target = resolveSignalValue(targetInput);
   const options = resolveTransitionOptions(optionsInput);
   const candidate = normalizeCandidate(target, options);
-  const slot = useHookSlot("transition", (teardowns) => {
+  const slot = useHookSlot("animatedValue", (teardowns) => {
     const output = signal(candidate.initial);
-    const program = programFor(output, candidate.initial, candidate);
-    const controller = createAnimationPlaybackController(program, {
+    const program2 = programFor(output, candidate.initial, candidate);
+    const controller = createAnimationPlaybackController(program2, {
       conflict: "replace",
       debugName: candidate.options.debugName
     });
+    controller.setDeferredStatusCommandOwner(pibblInstance.mainTeardowns);
     const value = {
       componentRefs,
       controller,
@@ -111,6 +59,12 @@ function useAnimatedValue(targetInput, optionsInput) {
     teardowns.add(() => controller.dispose());
     return value;
   }).value;
+  const program = programFor(
+    slot.output,
+    slot.settled ? untracked(() => slot.output.get()) : candidate.initial,
+    candidate,
+    slot.settled ? slot.controller.committedSpringSnapshot()?.velocity : void 0
+  );
   const shouldEnter = !slot.settled && candidate.hasInitial && !candidate.equals(candidate.initial, candidate.target);
   const shouldRetarget = slot.settled && !candidate.equals(slot.target, candidate.target);
   const previousProvisionalValue = untracked(() => slot.output.get());
@@ -130,7 +84,7 @@ function useAnimatedValue(targetInput, optionsInput) {
     slot.target = candidate.target;
     if (!shouldEnter && !shouldRetarget) {
       slot.controller.adopt(
-        programFor(slot.output, slot.output.get(), candidate),
+        program,
         {
           conflict: "replace",
           debugName: candidate.options.debugName
@@ -138,13 +92,6 @@ function useAnimatedValue(targetInput, optionsInput) {
       );
       return;
     }
-    const springVelocity = candidate.options.type === "spring" ? slot.controller.committedSpringSnapshot()?.velocity : void 0;
-    const program = programFor(
-      slot.output,
-      slot.output.get(),
-      candidate,
-      springVelocity
-    );
     slot.controller.retarget(program, {
       conflict: "replace",
       debugName: candidate.options.debugName
@@ -163,6 +110,12 @@ function resolveTransitionOptions(input) {
   }
   return resolved ?? source;
 }
+function programFor(output, from, candidate, velocity) {
+  const context = Object.freeze({ from, to: candidate.target, velocity });
+  const animation = candidate.options.animation;
+  const definition = typeof animation === "function" ? withHooksForbidden("Animation factories cannot call hooks.", () => withSignalWriteForbidden("Animation factories cannot write to signals.", () => animation(context))) : animation;
+  return drive(output, bindAnimationTarget(definition, context));
+}
 export {
   useAnimatedValue
 };

package/dist/lib/hooks/use-animated-value.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/hooks/use-animated-value.ts"],
-  "sourcesContent": ["import {\n  createAnimationPlaybackController,\n  type AnimationPlaybackController,\n} from '../animation/playback.js';\nimport { spring, tween } from '../animation/definition.js';\nimport { drive } from '../animation/program.js';\nimport type {\n  PibblAnimationProgram,\n  PibblSpringAnimatedValueOptions,\n  PibblTweenAnimatedValueOptions,\n} from '../animation/types.js';\nimport { GLOBAL_STATE } from '../global-state.js';\nimport {\n  isSignal,\n  provisionSignalValueForRender,\n  signal,\n  untracked,\n} from '../signals/graph.js';\nimport { resolveSignalValue } from '../signals/resolve-signal-value.js';\nimport type {\n  Signal,\n  SignalEquals,\n  SignalValue,\n  WritableSignal,\n} from '../signals/types.js';\nimport type { PibblComponentRefs, PibblInstance } from '../types.js';\nimport { requireHookContext, useHookSlot } from './hook-slot.js';\n\ntype PibblTransitionOptions<T> =\n  | PibblTweenAnimatedValueOptions<T>\n  | PibblSpringAnimatedValueOptions;\n\ntype PibblTransitionOptionsInput<T> =\n  | {\n      readonly [K in keyof PibblTweenAnimatedValueOptions<T>]:\n        SignalValue<PibblTweenAnimatedValueOptions<T>[K]>;\n    }\n  | {\n      readonly [K in keyof PibblSpringAnimatedValueOptions]:\n        SignalValue<PibblSpringAnimatedValueOptions[K]>;\n    };\n\ninterface PibblTransitionCandidate<T> {\n  readonly options: PibblTransitionOptions<T>;\n  readonly equals: SignalEquals<T>;\n  readonly hasInitial: boolean;\n  readonly initial: T;\n  readonly target: T;\n}\n\ninterface PibblTransitionHookSlot<T> {\n  readonly componentRefs: PibblComponentRefs<any>;\n  readonly controller: AnimationPlaybackController;\n  readonly pibblInstance: PibblInstance;\n  readonly output: WritableSignal<T>;\n  readonly readonlyOutput: Signal<T>;\n  renderRevision: number;\n  settled: boolean;\n  target: T;\n}\n\nfunction hasOwn(value: object, key: PropertyKey): boolean {\n  return Object.prototype.hasOwnProperty.call(value, key);\n}\n\nfunction normalizeCandidate<T>(\n  target: T,\n  options: PibblTransitionOptions<T>,\n): PibblTransitionCandidate<T> {\n  if (typeof options !== 'object' || options === null) {\n    throw new TypeError('Pibbl transition options must be an object.');\n  }\n  if (options.type !== 'tween' && options.type !== 'spring') {\n    throw new TypeError('Pibbl transition type must be \"tween\" or \"spring\".');\n  }\n  if (options.equals !== undefined && typeof options.equals !== 'function') {\n    throw new TypeError('Pibbl transition equals must be a function.');\n  }\n  const snapshot = Object.freeze({ ...options }) as PibblTransitionOptions<T>;\n  if (snapshot.type === 'spring') {\n    spring({\n      from: target as number,\n      to: target as number,\n      mass: snapshot.mass,\n      stiffness: snapshot.stiffness,\n      damping: snapshot.damping,\n      initialVelocity: snapshot.initialVelocity,\n      restSpeed: snapshot.restSpeed,\n      restDelta: snapshot.restDelta,\n      maxDuration: snapshot.maxDuration,\n      debugName: snapshot.debugName,\n    });\n  } else {\n    tween({\n      from: target,\n      to: target,\n      duration: snapshot.duration,\n      easing: snapshot.easing,\n      interpolate: snapshot.interpolate,\n      debugName: snapshot.debugName,\n    });\n  }\n  const hasInitial = hasOwn(options, 'initial');\n  return Object.freeze({\n    options: snapshot,\n    equals: (snapshot.equals ?? Object.is) as SignalEquals<T>,\n    hasInitial,\n    initial: (hasInitial ? snapshot.initial : target) as T,\n    target,\n  });\n}\n\nfunction programFor<T>(\n  output: WritableSignal<T>,\n  from: T,\n  candidate: PibblTransitionCandidate<T>,\n  springVelocity?: number,\n): PibblAnimationProgram {\n  const options = candidate.options;\n  if (options.type === 'spring') {\n    return drive(output as unknown as WritableSignal<number>, spring({\n      from: from as number,\n      to: candidate.target as number,\n      mass: options.mass,\n      stiffness: options.stiffness,\n      damping: options.damping,\n      initialVelocity: springVelocity ?? options.initialVelocity,\n      restSpeed: options.restSpeed,\n      restDelta: options.restDelta,\n      maxDuration: options.maxDuration,\n      debugName: options.debugName,\n    }));\n  }\n  return drive(output, tween({\n    from,\n    to: candidate.target,\n    duration: options.duration,\n    easing: options.easing,\n    interpolate: options.interpolate,\n    debugName: options.debugName,\n  }));\n}\n\nfunction isCurrentSlot<T>(slot: PibblTransitionHookSlot<T>): boolean {\n  return !slot.componentRefs.teardowns.closed &&\n    !slot.pibblInstance.mainTeardowns.closed &&\n    GLOBAL_STATE.pibblInstances.get(slot.pibblInstance.canvas) === slot.pibblInstance &&\n    slot.pibblInstance.refs.get(slot.componentRefs.id) === slot.componentRefs;\n}\n\n/**\n * Animates a numeric target using an analytic spring. See {@link PibblSpringAnimatedValueOptions}\n * and {@link Signal}.\n * @param target - Target value or signal whose changes start transitions. See {@link SignalValue}.\n * @param options - Spring or tween configuration, including signal-backed fields. See\n * {@link SignalValue} , {@link PibblSpringAnimatedValueOptions} .\n * @returns A readonly signal containing the animated value. See {@link Signal}.\n */\nexport function useAnimatedValue(\n  target: SignalValue<number>,\n  options: SignalValue<{\n    readonly [K in keyof PibblSpringAnimatedValueOptions]:\n      SignalValue<PibblSpringAnimatedValueOptions[K]>;\n  }>,\n): Signal<number>;\n/**\n * Animates a target using a tween and optional custom interpolation. See\n * {@link PibblTweenAnimatedValueOptions} and {@link Signal}.\n * @param target - Target value or signal whose changes start transitions. See {@link SignalValue}.\n * @param options - Spring or tween configuration, including signal-backed fields. See\n * {@link SignalValue} , {@link PibblTweenAnimatedValueOptions} .\n * @returns A readonly signal containing the animated value. See {@link Signal}.\n */\nexport function useAnimatedValue<T>(\n  target: SignalValue<T>,\n  options: SignalValue<{\n    readonly [K in keyof PibblTweenAnimatedValueOptions<T>]:\n      SignalValue<PibblTweenAnimatedValueOptions<T>[K]>;\n  }>,\n): Signal<T>;\n/**\n * Returns a mount-owned signal that animates toward the current target using the supplied\n * transition options.\n *\n * @param targetInput - Target value or signal whose changes start transitions. See\n * {@link SignalValue} .\n * @param optionsInput - Spring or tween configuration, including signal-backed fields. See\n * {@link SignalValue} , {@link PibblTransitionOptionsInput} .\n * @returns A readonly signal containing the animated value. See {@link Signal}.\n *\n * @see {@link SignalValue}\n * @see {@link Signal}\n */\nexport function useAnimatedValue<T>(\n  targetInput: SignalValue<T>,\n  optionsInput: SignalValue<PibblTransitionOptionsInput<T>>,\n): Signal<T> {\n  const { componentRefs, pibblInstance } = requireHookContext();\n  const target = resolveSignalValue(targetInput);\n  const options = resolveTransitionOptions(optionsInput);\n  const candidate = normalizeCandidate(target, options);\n  const slot = useHookSlot<PibblTransitionHookSlot<T>>('transition', teardowns => {\n    const output = signal(candidate.initial);\n    const program = programFor(output, candidate.initial, candidate);\n    const controller = createAnimationPlaybackController(program, {\n      conflict: 'replace',\n      debugName: candidate.options.debugName,\n    });\n    const value: PibblTransitionHookSlot<T> = {\n      componentRefs,\n      controller,\n      pibblInstance,\n      output,\n      readonlyOutput: output.asReadonly(),\n      renderRevision: 0,\n      settled: false,\n      target: candidate.target,\n    };\n    teardowns.add(() => controller.dispose());\n    return value;\n  }).value;\n\n  const shouldEnter = !slot.settled && candidate.hasInitial &&\n    !candidate.equals(candidate.initial, candidate.target);\n  const shouldRetarget = slot.settled &&\n    !candidate.equals(slot.target, candidate.target);\n  const previousProvisionalValue = untracked(() => slot.output.get());\n  const hasProvisionalValue = !slot.settled &&\n    !Object.is(previousProvisionalValue, candidate.initial);\n  const transaction = GLOBAL_STATE.renderTransaction;\n  if (!transaction) {\n    throw new Error('useAnimatedValue requires an active Pibbl render transaction.');\n  }\n  if (hasProvisionalValue) {\n    provisionSignalValueForRender(slot.output, candidate.initial, transaction);\n  }\n  const revision = ++slot.renderRevision;\n  transaction.onFinish(success => {\n    if (!success) return;\n    if (revision !== slot.renderRevision || !isCurrentSlot(slot)) return;\n    slot.settled = true;\n    slot.target = candidate.target;\n    if (!shouldEnter && !shouldRetarget) {\n      slot.controller.adopt(\n        programFor(slot.output, slot.output.get(), candidate),\n        {\n          conflict: 'replace',\n          debugName: candidate.options.debugName,\n        },\n      );\n      return;\n    }\n    const springVelocity = candidate.options.type === 'spring' ?\n      slot.controller.committedSpringSnapshot()?.velocity : undefined;\n    const program = programFor(\n      slot.output,\n      slot.output.get(),\n      candidate,\n      springVelocity,\n    );\n    slot.controller.retarget(program, {\n      conflict: 'replace',\n      debugName: candidate.options.debugName,\n    });\n  });\n  return slot.readonlyOutput;\n}\n\nfunction resolveTransitionOptions<T>(\n  input: SignalValue<PibblTransitionOptionsInput<T>>,\n): PibblTransitionOptions<T> {\n  const source = resolveSignalValue(input);\n  let resolved: Record<PropertyKey, unknown> | undefined;\n  for (const key in source) {\n    const value = source[key as keyof typeof source];\n    if (!isSignal(value)) continue;\n    resolved ??= { ...source };\n    resolved[key] = resolveSignalValue(value as SignalValue<unknown>);\n  }\n  return (resolved ?? source) as PibblTransitionOptions<T>;\n}\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["import { bindAnimationTarget } from '../animation/definition.js';\nimport { drive } from '../animation/program.js';\nimport { withSignalWriteForbidden } from '../signals/graph.js';\nimport {\n  createAnimationPlaybackController,\n  type AnimationPlaybackController,\n} from '../animation/playback.js';\nimport type {\n  PibblAnimatedValueOptions,\n} from '../animation/types.js';\nimport { GLOBAL_STATE } from '../global-state.js';\nimport {\n  isSignal,\n  provisionSignalValueForRender,\n  signal,\n  untracked,\n} from '../signals/graph.js';\nimport { resolveSignalValue } from '../signals/resolve-signal-value.js';\nimport type {\n  Signal,\n  SignalEquals,\n  SignalValue,\n  WritableSignal,\n} from '../signals/types.js';\nimport type { PibblComponentRefs, PibblInstance } from '../types.js';\nimport { requireHookContext, useHookSlot, withHooksForbidden } from './hook-slot.js';\n\ntype AnimatedValueInputs<T> = {\n  readonly [K in keyof PibblAnimatedValueOptions<T>]: SignalValue<PibblAnimatedValueOptions<T>[K]>;\n};\n\ninterface PibblTransitionCandidate<T> {\n  readonly options: PibblAnimatedValueOptions<T>;\n  readonly equals: SignalEquals<T>;\n  readonly hasInitial: boolean;\n  readonly initial: T;\n  readonly target: T;\n}\n\ninterface PibblTransitionHookSlot<T> {\n  readonly componentRefs: PibblComponentRefs<any>;\n  readonly controller: AnimationPlaybackController;\n  readonly pibblInstance: PibblInstance;\n  readonly output: WritableSignal<T>;\n  readonly readonlyOutput: Signal<T>;\n  renderRevision: number;\n  settled: boolean;\n  target: T;\n}\n\nfunction normalizeCandidate<T>(\n  target: T,\n  options: PibblAnimatedValueOptions<T>,\n): PibblTransitionCandidate<T> {\n  if (typeof options !== 'object' || options === null) {\n    throw new TypeError('useAnimatedValue options must be an object.');\n  }\n  if (options.equals !== undefined && typeof options.equals !== 'function') {\n    throw new TypeError('Pibbl transition equals must be a function.');\n  }\n  const snapshot = Object.freeze({ ...options });\n  const hasInitial = Object.prototype.hasOwnProperty.call(options, 'initial');\n  return Object.freeze({\n    options: snapshot,\n    equals: snapshot.equals ?? Object.is,\n    hasInitial,\n    initial: (hasInitial ? snapshot.initial : target) as T,\n    target,\n  });\n}\n\nfunction isCurrentSlot<T>(slot: PibblTransitionHookSlot<T>): boolean {\n  return !slot.componentRefs.teardowns.closed &&\n    !slot.pibblInstance.mainTeardowns.closed &&\n    GLOBAL_STATE.pibblInstances.get(slot.pibblInstance.canvas) === slot.pibblInstance &&\n    slot.pibblInstance.refs.get(slot.componentRefs.id) === slot.componentRefs;\n}\n\n/**\n * Presents a target through an immutable animation definition or a pure animation factory.\n * @param targetInput - Target value or signal. See {@link SignalValue}.\n * @param optionsInput - Animation definition, initial value, equality, and diagnostic settings;\n * fields and the options object may be signals. See {@link PibblAnimatedValueOptions}.\n * @returns One stable readonly animated signal. See {@link Signal}.\n */\nexport function useAnimatedValue<T>(\n  targetInput: SignalValue<T>,\n  optionsInput: SignalValue<AnimatedValueInputs<NoInfer<T>>>,\n): Signal<T> {\n  const { componentRefs, pibblInstance } = requireHookContext();\n  const target = resolveSignalValue(targetInput);\n  const options = resolveTransitionOptions<T>(optionsInput);\n  const candidate = normalizeCandidate(target, options);\n  const slot = useHookSlot<PibblTransitionHookSlot<T>>('animatedValue', teardowns => {\n    const output = signal(candidate.initial);\n    const program = programFor(output, candidate.initial, candidate);\n    const controller = createAnimationPlaybackController(program, {\n      conflict: 'replace',\n      debugName: candidate.options.debugName,\n    });\n    controller.setDeferredStatusCommandOwner(pibblInstance.mainTeardowns);\n    const value: PibblTransitionHookSlot<T> = {\n      componentRefs,\n      controller,\n      pibblInstance,\n      output,\n      readonlyOutput: output.asReadonly(),\n      renderRevision: 0,\n      settled: false,\n      target: candidate.target,\n    };\n    teardowns.add(() => controller.dispose());\n    return value;\n  }).value;\n\n  // Prepare user-defined work while Render can still fail transactionally. No factory runs\n  // in onFinish, where a late exception could otherwise adopt only part of the update.\n  const program = programFor(slot.output,\n    slot.settled ? untracked(() => slot.output.get()) : candidate.initial,\n    candidate, slot.settled ? slot.controller.committedSpringSnapshot()?.velocity : undefined);\n\n  const shouldEnter = !slot.settled && candidate.hasInitial &&\n    !candidate.equals(candidate.initial, candidate.target);\n  const shouldRetarget = slot.settled &&\n    !candidate.equals(slot.target, candidate.target);\n  const previousProvisionalValue = untracked(() => slot.output.get());\n  const hasProvisionalValue = !slot.settled &&\n    !Object.is(previousProvisionalValue, candidate.initial);\n  const transaction = GLOBAL_STATE.renderTransaction;\n  if (!transaction) {\n    throw new Error('useAnimatedValue requires an active Pibbl render transaction.');\n  }\n  if (hasProvisionalValue) {\n    provisionSignalValueForRender(slot.output, candidate.initial, transaction);\n  }\n  const revision = ++slot.renderRevision;\n  transaction.onFinish(success => {\n    if (!success) return;\n    if (revision !== slot.renderRevision || !isCurrentSlot(slot)) return;\n    slot.settled = true;\n    slot.target = candidate.target;\n    if (!shouldEnter && !shouldRetarget) {\n      slot.controller.adopt(\n        program,\n        {\n          conflict: 'replace',\n          debugName: candidate.options.debugName,\n        },\n      );\n      return;\n    }\n    slot.controller.retarget(program, {\n      conflict: 'replace',\n      debugName: candidate.options.debugName,\n    });\n  });\n  return slot.readonlyOutput;\n}\n\nfunction resolveTransitionOptions<T>(\n  input: SignalValue<AnimatedValueInputs<T>>,\n): PibblAnimatedValueOptions<T> {\n  const source = resolveSignalValue(input);\n  let resolved: Record<PropertyKey, unknown> | undefined;\n  for (const key in source) {\n    const value = source[key as keyof typeof source];\n    if (!isSignal(value)) continue;\n    resolved ??= { ...source };\n    resolved[key] = resolveSignalValue(value as SignalValue<unknown>);\n  }\n  return (resolved ?? source) as PibblAnimatedValueOptions<T>;\n}\n\nfunction programFor<T>(\n  output: WritableSignal<T>, from: T, candidate: PibblTransitionCandidate<T>, velocity?: number,\n) {\n  const context = Object.freeze({ from, to: candidate.target, velocity });\n  const animation = candidate.options.animation;\n  const definition = typeof animation === 'function'\n    ? withHooksForbidden('Animation factories cannot call hooks.', () =>\n      withSignalWriteForbidden('Animation factories cannot write to signals.', () => animation(context)))\n    : animation;\n  return drive(output, bindAnimationTarget(definition, context));\n}\n"],
+  "mappings": "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",
+  "names": ["program"]
 }

package/dist/lib/hooks/use-playback.js

@@ -28,6 +28,7 @@ function usePlayback(programInput, optionsInput = {}) {
       candidate.program,
       candidateOptions
     );
+    controller.setDeferredStatusCommandOwner(pibblInstance.mainTeardowns);
     const onEvent = (event) => {
       if (isCurrentSlot(value)) value.latestOptions.onEvent?.(event);
     };

package/dist/lib/hooks/use-playback.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/hooks/use-playback.ts"],
-  "sourcesContent": ["import {\n  createAnimationPlaybackController,\n  normalizeAnimationPlaybackCandidate,\n  type AnimationPlaybackController,\n} from '../animation/playback.js';\nimport type {\n  PibblAnimationProgram,\n  PibblPlayback,\n  PibblPlaybackEvent,\n  PibblPlaybackOptions,\n} from '../animation/types.js';\nimport { GLOBAL_STATE } from '../global-state.js';\nimport { isSignal } from '../signals/graph.js';\nimport { resolveSignalValue } from '../signals/resolve-signal-value.js';\nimport type { SignalValue } from '../signals/types.js';\nimport type { PibblComponentRefs, PibblInstance } from '../types.js';\nimport { requireHookContext, useHookSlot } from './hook-slot.js';\n\ntype PibblPlaybackOptionsInput = {\n  readonly [K in keyof PibblPlaybackOptions]: SignalValue<PibblPlaybackOptions[K]>;\n};\n\ninterface PibblPlaybackHookSlot {\n  readonly controller: AnimationPlaybackController;\n  readonly componentRefs: PibblComponentRefs<any>;\n  readonly pibblInstance: PibblInstance;\n  latestOptions: PibblPlaybackOptions;\n  mountSettled: boolean;\n  readonly onError: (error: unknown) => void;\n  readonly onEvent: (event: PibblPlaybackEvent) => void;\n  renderRevision: number;\n}\n\nfunction isCurrentSlot(slot: PibblPlaybackHookSlot): boolean {\n  return !slot.componentRefs.teardowns.closed &&\n    !slot.pibblInstance.mainTeardowns.closed &&\n    GLOBAL_STATE.pibblInstances.get(slot.pibblInstance.canvas) === slot.pibblInstance &&\n    slot.pibblInstance.refs.get(slot.componentRefs.id) === slot.componentRefs;\n}\n\nfunction controllerOptions(\n  candidate: PibblPlaybackOptions,\n  onEvent: (event: PibblPlaybackEvent) => void,\n  onError: (error: unknown) => void,\n): PibblPlaybackOptions {\n  return {\n    ...candidate,\n    onEvent: typeof candidate.onEvent === 'function' ?\n      onEvent : candidate.onEvent,\n    onError: typeof candidate.onError === 'function' ?\n      onError : candidate.onError,\n  };\n}\n\n/**\n * Creates one component-owned animation playback handle for a hook slot.\n *\n * @param programInput - Animation program, optionally supplied by a signal. See\n * {@link SignalValue} , {@link PibblAnimationProgram} .\n * @param optionsInput - Playback configuration, optionally supplied by a signal. See\n * {@link SignalValue} , {@link PibblPlaybackOptionsInput} .\n * @returns Stable mount-owned playback controls and reactive status/time values. See\n * {@link PibblPlayback} .\n *\n * @see {@link SignalValue}\n * @see {@link PibblAnimationProgram}\n * @see {@link PibblPlayback}\n */\nexport function usePlayback(\n  programInput: SignalValue<PibblAnimationProgram>,\n  optionsInput: SignalValue<PibblPlaybackOptionsInput> = {},\n): PibblPlayback {\n  const { componentRefs, pibblInstance } = requireHookContext();\n  const program = resolveSignalValue(programInput);\n  const options = resolvePlaybackOptions(optionsInput);\n  const candidate = normalizeAnimationPlaybackCandidate(program, options);\n  const candidateOptions = candidate.options;\n  const slot = useHookSlot<PibblPlaybackHookSlot>('playback', teardowns => {\n    let value!: PibblPlaybackHookSlot;\n    const controller = createAnimationPlaybackController(\n      candidate.program,\n      candidateOptions,\n    );\n    const onEvent = (event: PibblPlaybackEvent): void => {\n      if (isCurrentSlot(value)) value.latestOptions.onEvent?.(event);\n    };\n    const onError = (error: unknown): void => {\n      if (isCurrentSlot(value)) value.latestOptions.onError?.(error);\n    };\n    value = {\n      controller,\n      componentRefs,\n      pibblInstance,\n      latestOptions: {},\n      mountSettled: false,\n      onError,\n      onEvent,\n      renderRevision: 0,\n    };\n    controller.adopt(\n      candidate.program,\n      controllerOptions(candidateOptions, onEvent, onError),\n    );\n    teardowns.add(() => controller.dispose());\n    return value;\n  }).value;\n  const revision = ++slot.renderRevision;\n  const transaction = GLOBAL_STATE.renderTransaction;\n  if (!transaction) {\n    throw new Error('usePlayback requires an active Pibbl render transaction.');\n  }\n  transaction.onFinish(success => {\n    if (!success || revision !== slot.renderRevision || !isCurrentSlot(slot)) return;\n    slot.controller.adopt(\n      candidate.program,\n      controllerOptions(candidateOptions, slot.onEvent, slot.onError),\n    );\n    slot.latestOptions = candidateOptions;\n    if (!slot.mountSettled) {\n      slot.mountSettled = true;\n      if (candidateOptions.autoplay === true) slot.controller.handle.play();\n    }\n  });\n  return slot.controller.handle;\n}\n\nfunction resolvePlaybackOptions(\n  input: SignalValue<PibblPlaybackOptionsInput>,\n): PibblPlaybackOptions {\n  const source = resolveSignalValue(input);\n  let resolved: Record<PropertyKey, unknown> | undefined;\n  for (const key in source) {\n    const value = source[key as keyof PibblPlaybackOptionsInput];\n    if (!isSignal(value)) continue;\n    resolved ??= { ...source };\n    resolved[key] = resolveSignalValue(value as SignalValue<unknown>);\n  }\n  return (resolved ?? source) as PibblPlaybackOptions;\n}\n"],
-  "mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AAOP,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;AAGnC,SAAS,oBAAoB,mBAAmB;AAiBhD,SAAS,cAAc,MAAsC;AAC3D,SAAO,CAAC,KAAK,cAAc,UAAU,UACnC,CAAC,KAAK,cAAc,cAAc,UAClC,aAAa,eAAe,IAAI,KAAK,cAAc,MAAM,MAAM,KAAK,iBACpE,KAAK,cAAc,KAAK,IAAI,KAAK,cAAc,EAAE,MAAM,KAAK;AAChE;AAEA,SAAS,kBACP,WACA,SACA,SACsB;AACtB,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS,OAAO,UAAU,YAAY,aACpC,UAAU,UAAU;AAAA,IACtB,SAAS,OAAO,UAAU,YAAY,aACpC,UAAU,UAAU;AAAA,EACxB;AACF;AAgBO,SAAS,YACd,cACA,eAAuD,CAAC,GACzC;AACf,QAAM,EAAE,eAAe,cAAc,IAAI,mBAAmB;AAC5D,QAAM,UAAU,mBAAmB,YAAY;AAC/C,QAAM,UAAU,uBAAuB,YAAY;AACnD,QAAM,YAAY,oCAAoC,SAAS,OAAO;AACtE,QAAM,mBAAmB,UAAU;AACnC,QAAM,OAAO,YAAmC,YAAY,eAAa;AACvE,QAAI;AACJ,UAAM,aAAa;AAAA,MACjB,UAAU;AAAA,MACV;AAAA,IACF;AACA,UAAM,UAAU,CAAC,UAAoC;AACnD,UAAI,cAAc,KAAK,EAAG,OAAM,cAAc,UAAU,KAAK;AAAA,IAC/D;AACA,UAAM,UAAU,CAAC,UAAyB;AACxC,UAAI,cAAc,KAAK,EAAG,OAAM,cAAc,UAAU,KAAK;AAAA,IAC/D;AACA,YAAQ;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe,CAAC;AAAA,MAChB,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,IAClB;AACA,eAAW;AAAA,MACT,UAAU;AAAA,MACV,kBAAkB,kBAAkB,SAAS,OAAO;AAAA,IACtD;AACA,cAAU,IAAI,MAAM,WAAW,QAAQ,CAAC;AACxC,WAAO;AAAA,EACT,CAAC,EAAE;AACH,QAAM,WAAW,EAAE,KAAK;AACxB,QAAM,cAAc,aAAa;AACjC,MAAI,CAAC,aAAa;AAChB,UAAM,IAAI,MAAM,0DAA0D;AAAA,EAC5E;AACA,cAAY,SAAS,aAAW;AAC9B,QAAI,CAAC,WAAW,aAAa,KAAK,kBAAkB,CAAC,cAAc,IAAI,EAAG;AAC1E,SAAK,WAAW;AAAA,MACd,UAAU;AAAA,MACV,kBAAkB,kBAAkB,KAAK,SAAS,KAAK,OAAO;AAAA,IAChE;AACA,SAAK,gBAAgB;AACrB,QAAI,CAAC,KAAK,cAAc;AACtB,WAAK,eAAe;AACpB,UAAI,iBAAiB,aAAa,KAAM,MAAK,WAAW,OAAO,KAAK;AAAA,IACtE;AAAA,EACF,CAAC;AACD,SAAO,KAAK,WAAW;AACzB;AAEA,SAAS,uBACP,OACsB;AACtB,QAAM,SAAS,mBAAmB,KAAK;AACvC,MAAI;AACJ,aAAW,OAAO,QAAQ;AACxB,UAAM,QAAQ,OAAO,GAAsC;AAC3D,QAAI,CAAC,SAAS,KAAK,EAAG;AACtB,iBAAa,EAAE,GAAG,OAAO;AACzB,aAAS,GAAG,IAAI,mBAAmB,KAA6B;AAAA,EAClE;AACA,SAAQ,YAAY;AACtB;",
+  "sourcesContent": ["import {\n  createAnimationPlaybackController,\n  normalizeAnimationPlaybackCandidate,\n  type AnimationPlaybackController,\n} from '../animation/playback.js';\nimport type {\n  PibblAnimationProgram,\n  PibblPlayback,\n  PibblPlaybackEvent,\n  PibblPlaybackOptions,\n} from '../animation/types.js';\nimport { GLOBAL_STATE } from '../global-state.js';\nimport { isSignal } from '../signals/graph.js';\nimport { resolveSignalValue } from '../signals/resolve-signal-value.js';\nimport type { SignalValue } from '../signals/types.js';\nimport type { PibblComponentRefs, PibblInstance } from '../types.js';\nimport { requireHookContext, useHookSlot } from './hook-slot.js';\n\ntype PibblPlaybackOptionsInput = {\n  readonly [K in keyof PibblPlaybackOptions]: SignalValue<PibblPlaybackOptions[K]>;\n};\n\ninterface PibblPlaybackHookSlot {\n  readonly controller: AnimationPlaybackController;\n  readonly componentRefs: PibblComponentRefs<any>;\n  readonly pibblInstance: PibblInstance;\n  latestOptions: PibblPlaybackOptions;\n  mountSettled: boolean;\n  readonly onError: (error: unknown) => void;\n  readonly onEvent: (event: PibblPlaybackEvent) => void;\n  renderRevision: number;\n}\n\nfunction isCurrentSlot(slot: PibblPlaybackHookSlot): boolean {\n  return !slot.componentRefs.teardowns.closed &&\n    !slot.pibblInstance.mainTeardowns.closed &&\n    GLOBAL_STATE.pibblInstances.get(slot.pibblInstance.canvas) === slot.pibblInstance &&\n    slot.pibblInstance.refs.get(slot.componentRefs.id) === slot.componentRefs;\n}\n\nfunction controllerOptions(\n  candidate: PibblPlaybackOptions,\n  onEvent: (event: PibblPlaybackEvent) => void,\n  onError: (error: unknown) => void,\n): PibblPlaybackOptions {\n  return {\n    ...candidate,\n    onEvent: typeof candidate.onEvent === 'function' ?\n      onEvent : candidate.onEvent,\n    onError: typeof candidate.onError === 'function' ?\n      onError : candidate.onError,\n  };\n}\n\n/**\n * Creates one component-owned animation playback handle for a hook slot.\n *\n * @param programInput - Animation program, optionally supplied by a signal. See\n * {@link SignalValue} , {@link PibblAnimationProgram} .\n * @param optionsInput - Playback configuration, optionally supplied by a signal. See\n * {@link SignalValue} , {@link PibblPlaybackOptionsInput} .\n * @returns Stable mount-owned playback controls and reactive status/time values. See\n * {@link PibblPlayback} .\n *\n * @see {@link SignalValue}\n * @see {@link PibblAnimationProgram}\n * @see {@link PibblPlayback}\n */\nexport function usePlayback(\n  programInput: SignalValue<PibblAnimationProgram>,\n  optionsInput: SignalValue<PibblPlaybackOptionsInput> = {},\n): PibblPlayback {\n  const { componentRefs, pibblInstance } = requireHookContext();\n  const program = resolveSignalValue(programInput);\n  const options = resolvePlaybackOptions(optionsInput);\n  const candidate = normalizeAnimationPlaybackCandidate(program, options);\n  const candidateOptions = candidate.options;\n  const slot = useHookSlot<PibblPlaybackHookSlot>('playback', teardowns => {\n    let value!: PibblPlaybackHookSlot;\n    const controller = createAnimationPlaybackController(\n      candidate.program,\n      candidateOptions,\n    );\n    controller.setDeferredStatusCommandOwner(pibblInstance.mainTeardowns);\n    const onEvent = (event: PibblPlaybackEvent): void => {\n      if (isCurrentSlot(value)) value.latestOptions.onEvent?.(event);\n    };\n    const onError = (error: unknown): void => {\n      if (isCurrentSlot(value)) value.latestOptions.onError?.(error);\n    };\n    value = {\n      controller,\n      componentRefs,\n      pibblInstance,\n      latestOptions: {},\n      mountSettled: false,\n      onError,\n      onEvent,\n      renderRevision: 0,\n    };\n    controller.adopt(\n      candidate.program,\n      controllerOptions(candidateOptions, onEvent, onError),\n    );\n    teardowns.add(() => controller.dispose());\n    return value;\n  }).value;\n  const revision = ++slot.renderRevision;\n  const transaction = GLOBAL_STATE.renderTransaction;\n  if (!transaction) {\n    throw new Error('usePlayback requires an active Pibbl render transaction.');\n  }\n  transaction.onFinish(success => {\n    if (!success || revision !== slot.renderRevision || !isCurrentSlot(slot)) return;\n    slot.controller.adopt(\n      candidate.program,\n      controllerOptions(candidateOptions, slot.onEvent, slot.onError),\n    );\n    slot.latestOptions = candidateOptions;\n    if (!slot.mountSettled) {\n      slot.mountSettled = true;\n      if (candidateOptions.autoplay === true) slot.controller.handle.play();\n    }\n  });\n  return slot.controller.handle;\n}\n\nfunction resolvePlaybackOptions(\n  input: SignalValue<PibblPlaybackOptionsInput>,\n): PibblPlaybackOptions {\n  const source = resolveSignalValue(input);\n  let resolved: Record<PropertyKey, unknown> | undefined;\n  for (const key in source) {\n    const value = source[key as keyof PibblPlaybackOptionsInput];\n    if (!isSignal(value)) continue;\n    resolved ??= { ...source };\n    resolved[key] = resolveSignalValue(value as SignalValue<unknown>);\n  }\n  return (resolved ?? source) as PibblPlaybackOptions;\n}\n"],
+  "mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AAOP,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;AAGnC,SAAS,oBAAoB,mBAAmB;AAiBhD,SAAS,cAAc,MAAsC;AAC3D,SAAO,CAAC,KAAK,cAAc,UAAU,UACnC,CAAC,KAAK,cAAc,cAAc,UAClC,aAAa,eAAe,IAAI,KAAK,cAAc,MAAM,MAAM,KAAK,iBACpE,KAAK,cAAc,KAAK,IAAI,KAAK,cAAc,EAAE,MAAM,KAAK;AAChE;AAEA,SAAS,kBACP,WACA,SACA,SACsB;AACtB,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS,OAAO,UAAU,YAAY,aACpC,UAAU,UAAU;AAAA,IACtB,SAAS,OAAO,UAAU,YAAY,aACpC,UAAU,UAAU;AAAA,EACxB;AACF;AAgBO,SAAS,YACd,cACA,eAAuD,CAAC,GACzC;AACf,QAAM,EAAE,eAAe,cAAc,IAAI,mBAAmB;AAC5D,QAAM,UAAU,mBAAmB,YAAY;AAC/C,QAAM,UAAU,uBAAuB,YAAY;AACnD,QAAM,YAAY,oCAAoC,SAAS,OAAO;AACtE,QAAM,mBAAmB,UAAU;AACnC,QAAM,OAAO,YAAmC,YAAY,eAAa;AACvE,QAAI;AACJ,UAAM,aAAa;AAAA,MACjB,UAAU;AAAA,MACV;AAAA,IACF;AACA,eAAW,8BAA8B,cAAc,aAAa;AACpE,UAAM,UAAU,CAAC,UAAoC;AACnD,UAAI,cAAc,KAAK,EAAG,OAAM,cAAc,UAAU,KAAK;AAAA,IAC/D;AACA,UAAM,UAAU,CAAC,UAAyB;AACxC,UAAI,cAAc,KAAK,EAAG,OAAM,cAAc,UAAU,KAAK;AAAA,IAC/D;AACA,YAAQ;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe,CAAC;AAAA,MAChB,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,gBAAgB;AAAA,IAClB;AACA,eAAW;AAAA,MACT,UAAU;AAAA,MACV,kBAAkB,kBAAkB,SAAS,OAAO;AAAA,IACtD;AACA,cAAU,IAAI,MAAM,WAAW,QAAQ,CAAC;AACxC,WAAO;AAAA,EACT,CAAC,EAAE;AACH,QAAM,WAAW,EAAE,KAAK;AACxB,QAAM,cAAc,aAAa;AACjC,MAAI,CAAC,aAAa;AAChB,UAAM,IAAI,MAAM,0DAA0D;AAAA,EAC5E;AACA,cAAY,SAAS,aAAW;AAC9B,QAAI,CAAC,WAAW,aAAa,KAAK,kBAAkB,CAAC,cAAc,IAAI,EAAG;AAC1E,SAAK,WAAW;AAAA,MACd,UAAU;AAAA,MACV,kBAAkB,kBAAkB,KAAK,SAAS,KAAK,OAAO;AAAA,IAChE;AACA,SAAK,gBAAgB;AACrB,QAAI,CAAC,KAAK,cAAc;AACtB,WAAK,eAAe;AACpB,UAAI,iBAAiB,aAAa,KAAM,MAAK,WAAW,OAAO,KAAK;AAAA,IACtE;AAAA,EACF,CAAC;AACD,SAAO,KAAK,WAAW;AACzB;AAEA,SAAS,uBACP,OACsB;AACtB,QAAM,SAAS,mBAAmB,KAAK;AACvC,MAAI;AACJ,aAAW,OAAO,QAAQ;AACxB,UAAM,QAAQ,OAAO,GAAsC;AAC3D,QAAI,CAAC,SAAS,KAAK,EAAG;AACtB,iBAAa,EAAE,GAAG,OAAO;AACzB,aAAS,GAAG,IAAI,mBAAmB,KAA6B;AAAA,EAClE;AACA,SAAQ,YAAY;AACtB;",
   "names": []
 }

package/dist/lib/html/html-events.d.ts

@@ -0,0 +1,32 @@
+import { type PibblEventListenerRegistration, type PibblEventNode, type PibblNormalizedHandlers } from '../events/registrations.js';
+import type { HtmlBoxEventHandlers, HtmlBoxSlot } from './types.js';
+/** Candidate event state remains invisible until the shared geometry adoption. */
+export interface HtmlNativeEventSnapshot {
+    readonly handlers: PibblNormalizedHandlers;
+    readonly path: readonly PibblEventNode[];
+    readonly inverseWorld: DOMMatrix;
+    readonly inverseProjection: DOMMatrix;
+    readonly active: boolean;
+}
+/** Observes the real DOM path; never enters Canvas targeting/default actions. */
+export declare class HtmlNativeEvents {
+    private readonly slot;
+    private readonly coordinateRoot;
+    private readonly relatedNode;
+    readonly node: PibblEventListenerRegistration;
+    private readonly listeners;
+    private readonly dispatches;
+    private readonly pendingDispatches;
+    private current;
+    constructor(slot: HtmlBoxSlot, coordinateRoot: () => SVGSVGElement, relatedNode: (target: EventTarget | null) => PibblEventNode | null);
+    prepare(handlers: HtmlBoxEventHandlers, world: DOMMatrix, projection: DOMMatrix, active: boolean): HtmlNativeEventSnapshot;
+    /** Add candidates without withdrawing any listeners needed by the old snapshot. */
+    prepareListeners(snapshot: HtmlNativeEventSnapshot): void;
+    adopt(snapshot: HtmlNativeEventSnapshot): void;
+    suspend(): void;
+    dispose(): void;
+    private listen;
+    private releaseDispatch;
+    private finish;
+    private coordinates;
+}

package/dist/lib/html/html-events.js

@@ -0,0 +1,179 @@
+import { batch } from "../signals/graph.js";
+import { PIBBL_EVENT_DEFINITIONS } from "../events/event-definitions.js";
+import { buildEventPath } from "../events/event-path.js";
+import { createPibblEvent, finishEventDispatch, isPibblImmediatePropagationStopped, isPibblPropagationStopped } from "../events/event-facade.js";
+import { invokePibblEventHandler } from "../events/propagation.js";
+import { normalizeHandlers } from "../events/registrations.js";
+class HtmlNativeEvents {
+  constructor(slot, coordinateRoot, relatedNode) {
+    this.slot = slot;
+    this.coordinateRoot = coordinateRoot;
+    this.relatedNode = relatedNode;
+    this.node = {
+      kind: "listener",
+      owner: slot.owner,
+      component: slot.component,
+      slot: -1,
+      suspendLayout: () => this.suspend(),
+      publicTarget: {
+        setPointerCapture: (id) => {
+          if (!slot.disposed) slot.content?.setPointerCapture(id);
+        },
+        hasPointerCapture: (id) => !slot.disposed && Boolean(slot.content?.hasPointerCapture(id)),
+        releasePointerCapture: (id) => {
+          if (!slot.disposed) slot.content?.releasePointerCapture(id);
+        }
+      },
+      handlers: {},
+      live: false,
+      handlerTypesLow: 0,
+      handlerTypesHigh: 0,
+      requiredNativeTypesLow: 0,
+      requiredNativeTypesHigh: 0,
+      ownedNativeTypesLow: 0,
+      ownedNativeTypesHigh: 0
+    };
+  }
+  slot;
+  coordinateRoot;
+  relatedNode;
+  node;
+  listeners = /* @__PURE__ */ new Map();
+  dispatches = /* @__PURE__ */ new WeakMap();
+  pendingDispatches = /* @__PURE__ */ new Set();
+  current;
+  prepare(handlers, world, projection, active) {
+    const normalized = normalizeHandlers(handlers);
+    const inverseWorld = world.inverse();
+    const inverseProjection = projection.inverse();
+    const path = buildEventPath(this.node).map((node) => ({
+      ...node,
+      handlers: node === this.node ? normalized : node.handlers,
+      live: node === this.node ? active : node.live
+    }));
+    return {
+      handlers: normalized,
+      path,
+      inverseWorld,
+      inverseProjection,
+      active: active && finite(inverseWorld) && finite(inverseProjection)
+    };
+  }
+  /** Add candidates without withdrawing any listeners needed by the old snapshot. */
+  prepareListeners(snapshot) {
+    if (!snapshot.active) return;
+    for (const definition of PIBBL_EVENT_DEFINITIONS) {
+      if (!this.listeners.has(definition.type) && needsEvent(snapshot, definition.type)) this.listen(definition);
+    }
+  }
+  adopt(snapshot) {
+    this.current = snapshot;
+    this.node.handlers = snapshot.handlers;
+    this.node.live = snapshot.active;
+  }
+  suspend() {
+    this.node.live = false;
+  }
+  dispose() {
+    this.node.live = false;
+    for (const release of this.listeners.values()) release();
+    this.listeners.clear();
+    for (const dispatch of this.pendingDispatches) this.releaseDispatch(dispatch);
+    this.node.handlers = {};
+    this.current = void 0;
+  }
+  listen(definition) {
+    const host = this.slot.shell;
+    const capture = (original) => batch(() => {
+      const snapshot = this.current;
+      if (!snapshot || !this.node.live || !this.slot.region.active || this.slot.disposed || !needsEvent(snapshot, definition.type)) return;
+      if ((definition.type === "mouseenter" || definition.type === "mouseleave" || definition.type === "pointerenter" || definition.type === "pointerleave") && original.target !== host) return;
+      const coordinates = definition.coordinate ? this.coordinates(original, snapshot) : void 0;
+      if (definition.coordinate && !coordinates) return;
+      const path = snapshot.path;
+      const event = createPibblEvent({
+        type: definition.type,
+        target: this.node,
+        path,
+        originalEvent: original,
+        relatedTarget: this.relatedNode(original.relatedTarget ?? null),
+        nativeBubbles: original.bubbles,
+        ...coordinates
+      });
+      const dispatch = { event, path, original };
+      const previous = this.dispatches.get(original);
+      if (previous) this.releaseDispatch(previous);
+      this.dispatches.set(original, dispatch);
+      this.pendingDispatches.add(dispatch);
+      if (original.bubbles) dispatch.cleanup = setTimeout(() => this.releaseDispatch(dispatch), 0);
+      for (let index = 0; index < path.length - 1; index++) {
+        if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) break;
+        invokePibblEventHandler(path[index], definition.type, true, 1, event);
+      }
+      if (this.node.live && !this.slot.disposed && !isPibblPropagationStopped(event)) invokePibblEventHandler(path[path.length - 1], definition.type, true, 2, event);
+      if (!original.bubbles) {
+        this.finish(definition.type, dispatch, false);
+      }
+    });
+    const bubble = (original) => batch(() => {
+      const dispatch = this.dispatches.get(original);
+      if (dispatch) this.finish(definition.type, dispatch, true);
+    });
+    host.addEventListener(definition.type, capture, { capture: true, passive: false });
+    try {
+      host.addEventListener(definition.type, bubble, { passive: false });
+    } catch (error) {
+      host.removeEventListener(definition.type, capture, true);
+      throw error;
+    }
+    this.listeners.set(definition.type, () => {
+      host.removeEventListener(definition.type, capture, true);
+      host.removeEventListener(definition.type, bubble);
+    });
+  }
+  releaseDispatch(dispatch) {
+    if (!this.pendingDispatches.delete(dispatch)) return;
+    if (dispatch.cleanup !== void 0) clearTimeout(dispatch.cleanup);
+    if (this.dispatches.get(dispatch.original) === dispatch) this.dispatches.delete(dispatch.original);
+    finishEventDispatch(dispatch.event);
+  }
+  finish(type, dispatch, bubbles) {
+    const { event, path } = dispatch;
+    try {
+      if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) return;
+      if (!isPibblImmediatePropagationStopped(event)) invokePibblEventHandler(path[path.length - 1], type, false, 2, event);
+      if (!bubbles) return;
+      for (let index = path.length - 2; index >= 0; index--) {
+        if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) break;
+        invokePibblEventHandler(path[index], type, false, 3, event);
+      }
+    } finally {
+      this.releaseDispatch(dispatch);
+    }
+  }
+  coordinates(event, snapshot) {
+    const source = "changedTouches" in event ? event.changedTouches[0] : event;
+    if (!source || !Number.isFinite(source.clientX) || !Number.isFinite(source.clientY)) return;
+    const screen = this.coordinateRoot().getScreenCTM();
+    if (!screen) return;
+    const clientToOverlay = new DOMMatrix([screen.a, screen.b, screen.c, screen.d, screen.e, screen.f]).inverse();
+    const overlay = clientToOverlay.transformPoint({ x: source.clientX, y: source.clientY });
+    const root = snapshot.inverseProjection.transformPoint(overlay);
+    const local = snapshot.inverseWorld.transformPoint(root);
+    if (!Number.isFinite(root.x) || !Number.isFinite(root.y) || !Number.isFinite(local.x) || !Number.isFinite(local.y)) return;
+    return { x: root.x, y: root.y, localX: local.x, localY: local.y };
+  }
+}
+function finite(matrix) {
+  return Number.isFinite(matrix.a) && Number.isFinite(matrix.b) && Number.isFinite(matrix.c) && Number.isFinite(matrix.d) && Number.isFinite(matrix.e) && Number.isFinite(matrix.f);
+}
+function needsEvent(snapshot, type) {
+  for (const node of snapshot.path) {
+    if (node.live && (node.handlers[type] || node.handlers[`${type}Capture`])) return true;
+  }
+  return false;
+}
+export {
+  HtmlNativeEvents
+};
+//# sourceMappingURL=html-events.js.map

package/dist/lib/html/html-events.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/html/html-events.ts"],
+  "sourcesContent": ["import { batch } from '../signals/graph.js';\nimport { PIBBL_EVENT_DEFINITIONS, type PibblEventDefinition } from '../events/event-definitions.js';\nimport { buildEventPath } from '../events/event-path.js';\nimport { createPibblEvent, finishEventDispatch, isPibblImmediatePropagationStopped, isPibblPropagationStopped } from '../events/event-facade.js';\nimport { invokePibblEventHandler } from '../events/propagation.js';\nimport { normalizeHandlers, type PibblEventListenerRegistration, type PibblEventNode, type PibblNormalizedHandlers } from '../events/registrations.js';\nimport type { PibblEvent, PibblEventHandlers, PibblEventType } from '../events/types.js';\nimport type { HtmlBoxEventHandlers, HtmlBoxSlot } from './types.js';\n\ninterface NativeDispatch {\n  readonly original: Event;\n  cleanup?: ReturnType<typeof setTimeout>;\n  readonly event: PibblEvent;\n  readonly path: readonly PibblEventNode[];\n}\n\n/** Candidate event state remains invisible until the shared geometry adoption. */\nexport interface HtmlNativeEventSnapshot {\n  readonly handlers: PibblNormalizedHandlers;\n  readonly path: readonly PibblEventNode[];\n  readonly inverseWorld: DOMMatrix;\n  readonly inverseProjection: DOMMatrix;\n  readonly active: boolean;\n}\n\n/** Observes the real DOM path; never enters Canvas targeting/default actions. */\nexport class HtmlNativeEvents {\n  readonly node: PibblEventListenerRegistration;\n  private readonly listeners = new Map<PibblEventType, () => void>();\n  private readonly dispatches = new WeakMap<Event, NativeDispatch>();\n  private readonly pendingDispatches = new Set<NativeDispatch>();\n  private current: HtmlNativeEventSnapshot | undefined;\n\n  constructor(\n    private readonly slot: HtmlBoxSlot,\n    private readonly coordinateRoot: () => SVGSVGElement,\n    private readonly relatedNode: (target: EventTarget | null) => PibblEventNode | null,\n  ) {\n    // Dedicated virtual listener: no Canvas hit geometry, subscriptions or capture.\n    this.node = {\n      kind: 'listener', owner: slot.owner, component: slot.component, slot: -1,\n      suspendLayout: () => this.suspend(),\n      publicTarget: {\n        setPointerCapture: id => { if (!slot.disposed) slot.content?.setPointerCapture(id); },\n        hasPointerCapture: id => !slot.disposed && Boolean(slot.content?.hasPointerCapture(id)),\n        releasePointerCapture: id => { if (!slot.disposed) slot.content?.releasePointerCapture(id); },\n      },\n      handlers: {}, live: false,\n      handlerTypesLow: 0, handlerTypesHigh: 0,\n      requiredNativeTypesLow: 0, requiredNativeTypesHigh: 0,\n      ownedNativeTypesLow: 0, ownedNativeTypesHigh: 0,\n    };\n  }\n\n  prepare(handlers: HtmlBoxEventHandlers, world: DOMMatrix, projection: DOMMatrix, active: boolean): HtmlNativeEventSnapshot {\n    const normalized = normalizeHandlers(handlers as PibblEventHandlers);\n    const inverseWorld = world.inverse();\n    const inverseProjection = projection.inverse();\n    // Preserve ancestor handlers as well as geometry during fallible HTML callbacks.\n    const path = buildEventPath(this.node).map(node => ({\n      ...node,\n      handlers: node === this.node ? normalized : node.handlers,\n      live: node === this.node ? active : node.live,\n    }));\n    return {\n      handlers: normalized, path, inverseWorld, inverseProjection,\n      active: active && finite(inverseWorld) && finite(inverseProjection),\n    };\n  }\n\n  /** Add candidates without withdrawing any listeners needed by the old snapshot. */\n  prepareListeners(snapshot: HtmlNativeEventSnapshot): void {\n    if (!snapshot.active) return;\n    for (const definition of PIBBL_EVENT_DEFINITIONS) {\n      if (!this.listeners.has(definition.type) && needsEvent(snapshot, definition.type)) this.listen(definition);\n    }\n  }\n\n  adopt(snapshot: HtmlNativeEventSnapshot): void {\n    this.current = snapshot;\n    this.node.handlers = snapshot.handlers;\n    this.node.live = snapshot.active;\n  }\n\n  suspend(): void { this.node.live = false; }\n\n  dispose(): void {\n    this.node.live = false;\n    for (const release of this.listeners.values()) release();\n    this.listeners.clear();\n    for (const dispatch of this.pendingDispatches) this.releaseDispatch(dispatch);\n    this.node.handlers = {};\n    this.current = undefined;\n  }\n\n  private listen(definition: PibblEventDefinition): void {\n    const host = this.slot.shell!;\n    const capture = (original: Event) => batch(() => {\n      const snapshot = this.current;\n      if (!snapshot || !this.node.live || !this.slot.region.active || this.slot.disposed || !needsEvent(snapshot, definition.type)) return;\n      // Native enter/leave traverse ancestors for each nested DOM target.\n      if ((definition.type === 'mouseenter' || definition.type === 'mouseleave' ||\n          definition.type === 'pointerenter' || definition.type === 'pointerleave') && original.target !== host) return;\n      const coordinates = definition.coordinate ? this.coordinates(original, snapshot) : undefined;\n      if (definition.coordinate && !coordinates) return;\n      const path = snapshot.path;\n      const event = createPibblEvent({\n        type: definition.type, target: this.node, path, originalEvent: original,\n        relatedTarget: this.relatedNode((original as FocusEvent).relatedTarget ?? null),\n        nativeBubbles: original.bubbles,\n        ...coordinates,\n      });\n      const dispatch: NativeDispatch = { event, path, original };\n      const previous = this.dispatches.get(original);\n      if (previous) this.releaseDispatch(previous);\n      this.dispatches.set(original, dispatch);\n      this.pendingDispatches.add(dispatch);\n      // Native descendants may stop propagation before our bubble listener runs.\n      // A microtask can run BETWEEN native listeners, so only a later task may\n      // expire an abandoned dispatch. Normal bubbling releases synchronously.\n      if (original.bubbles) dispatch.cleanup = setTimeout(() => this.releaseDispatch(dispatch), 0);\n      for (let index = 0; index < path.length - 1; index++) {\n        if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) break;\n        invokePibblEventHandler(path[index], definition.type, true, 1, event);\n      }\n      if (this.node.live && !this.slot.disposed && !isPibblPropagationStopped(event)) invokePibblEventHandler(path[path.length - 1], definition.type, true, 2, event);\n      // Focus/blur/enter/leave have no native bubble callback.\n      if (!original.bubbles) {\n        this.finish(definition.type, dispatch, false);\n      }\n    });\n    const bubble = (original: Event) => batch(() => {\n      const dispatch = this.dispatches.get(original);\n      if (dispatch) this.finish(definition.type, dispatch, true);\n    });\n    host.addEventListener(definition.type, capture, { capture: true, passive: false });\n    try {\n      host.addEventListener(definition.type, bubble, { passive: false });\n    } catch (error) {\n      host.removeEventListener(definition.type, capture, true);\n      throw error;\n    }\n    this.listeners.set(definition.type, () => {\n      host.removeEventListener(definition.type, capture, true);\n      host.removeEventListener(definition.type, bubble);\n    });\n  }\n\n  private releaseDispatch(dispatch: NativeDispatch): void {\n    if (!this.pendingDispatches.delete(dispatch)) return;\n    if (dispatch.cleanup !== undefined) clearTimeout(dispatch.cleanup);\n    if (this.dispatches.get(dispatch.original) === dispatch) this.dispatches.delete(dispatch.original);\n    finishEventDispatch(dispatch.event);\n  }\n\n  private finish(type: PibblEventType, dispatch: NativeDispatch, bubbles: boolean): void {\n    const { event, path } = dispatch;\n    try {\n      if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) return;\n      if (!isPibblImmediatePropagationStopped(event)) invokePibblEventHandler(path[path.length - 1], type, false, 2, event);\n      if (!bubbles) return;\n      for (let index = path.length - 2; index >= 0; index--) {\n        if (!this.node.live || this.slot.disposed || isPibblPropagationStopped(event)) break;\n        invokePibblEventHandler(path[index], type, false, 3, event);\n      }\n    } finally { this.releaseDispatch(dispatch); }\n  }\n\n  private coordinates(event: Event, snapshot: HtmlNativeEventSnapshot): { x: number; y: number; localX: number; localY: number } | undefined {\n    const source = 'changedTouches' in event ? (event as TouchEvent).changedTouches[0] : event as MouseEvent;\n    if (!source || !Number.isFinite(source.clientX) || !Number.isFinite(source.clientY)) return;\n    // This unpainted SVG at overlay (0,0) includes shared CSS affine transforms.\n    const screen = this.coordinateRoot().getScreenCTM();\n    if (!screen) return;\n    const clientToOverlay = new DOMMatrix([screen.a, screen.b, screen.c, screen.d, screen.e, screen.f]).inverse();\n    const overlay = clientToOverlay.transformPoint({ x: source.clientX, y: source.clientY });\n    const root = snapshot.inverseProjection.transformPoint(overlay);\n    const local = snapshot.inverseWorld.transformPoint(root);\n    if (!Number.isFinite(root.x) || !Number.isFinite(root.y) || !Number.isFinite(local.x) || !Number.isFinite(local.y)) return;\n    return { x: root.x, y: root.y, localX: local.x, localY: local.y };\n  }\n}\n\nfunction finite(matrix: DOMMatrixReadOnly): boolean {\n  return Number.isFinite(matrix.a) && Number.isFinite(matrix.b) && Number.isFinite(matrix.c) &&\n    Number.isFinite(matrix.d) && Number.isFinite(matrix.e) && Number.isFinite(matrix.f);\n}\n\nfunction needsEvent(snapshot: HtmlNativeEventSnapshot, type: PibblEventType): boolean {\n  for (const node of snapshot.path) {\n    if (node.live && (node.handlers[type] || node.handlers[`${type}Capture`])) return true;\n  }\n  return false;\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/lib/html/html-service.d.ts

@@ -10,6 +10,9 @@ export declare class HtmlService implements HtmlBridge {
     private svg;
     private viewport;
     private disposed;
+    private suspended;
+    private projections;
+    private nextSnapshots;
     private rendered;
     constructor(root: PibblEventRoot);
     private enterTransaction;
@@ -20,10 +23,13 @@ export declare class HtmlService implements HtmlBridge {
     private hasHosts;
     release(slot: HtmlBoxSlot): void;
     private retire;
+    private prepare;
     private publish;
+    private adopt;
     private ensureDOM;
-    private apply;
-    private applyClips;
+    private publishContent;
+    private applyGeometry;
+    private prepareClips;
     private reset;
     dispose(): void;
 }