@plitzi/sdk-shared 0.37.1 → 0.37.3

package/dist/store/renderSettings.d.ts

@@ -9,9 +9,12 @@ export declare const DEFAULT_RENDER_SETTINGS: Required<RenderSettings>;
  *  A nested scope that seeds `render` SHADOWS the whole slice — reads do not fall through key by key, whichever way
  *  they are written — so a subtree that overrides one flag must restate the rest ({@link useRenderOverride}). */
 declare const useRenderSettings: () => Required<RenderSettings>;
-/** Builds the value for a `<StoreProvider>` that renders a subtree under different settings — the builder's preview
- *  pane being preview whatever the editor's own toggle says. Carries the surrounding settings over explicitly,
- *  because the scope shadows the slice: what an override leaves out is NOT inherited, it is lost.
+/** Builds the value for a `<StoreProvider inherit="live">` that renders a subtree under different settings — the
+ *  builder's preview pane being preview whatever the editor's own toggle says. Carries the surrounding settings over
+ *  explicitly, because the scope shadows the slice: what an override leaves out is NOT inherited, it is lost.
+ *
+ *  `inherit="live"` is not optional. A nexus scope inherits nothing by default, so without it the subtree sees a store
+ *  holding `render` and nothing else — no `schema`, no `style` — and every element in it fails to find itself.
  *
  *  `overrides` has to be referentially stable (a module-level constant), like any memo input. */
 export declare const useRenderOverride: (overrides: RenderSettings) => {

package/dist/store/tracing/index.d.ts

@@ -5,4 +5,5 @@ export { MAX_COMMITS, createTracingState } from './tracingStore';
 export { previewValue, diffProps } from './preview';
 export { tracingMiddleware } from './tracingMiddleware';
 export type { UseTracingReturn } from './useTracing';
+export type { TracingReader } from './tracingCollector';
 export { tracingStore, tracingCollector, useTracing };

package/dist/store/tracing/tracingCollector.d.ts

@@ -1,7 +1,23 @@
-import { PropChange } from '../../types';
+import { CommitEntry, PropChange } from '../../types';
 import { ProfilerOnRenderCallback } from 'react';
+/**
+ * What the SDK publishes as `window.plitziTracing` while its render tracing is on (`debugMode`): the commits since a
+ * mark, for a test to ask which elements an interaction rendered — `inspectRenders` in `@plitzi/sdk-authoring/testing`.
+ */
+export type TracingReader = {
+    lastCommitId: () => number;
+    commitsSince: (commitId: number) => CommitEntry[];
+};
+declare global {
+    interface Window {
+        /** Present while render tracing is on (`debugMode`) — see {@link TracingReader}. */
+        plitziTracing?: TracingReader;
+    }
+}
 declare const tracingCollector: {
     onRender: ProfilerOnRenderCallback;
+    lastCommitId: () => number;
+    commitsSince: (commitId: number) => CommitEntry[];
     linkParent: (id: string, parentId: string | undefined, elementId: string) => void;
     markMounted: (id: string) => void;
     markUnmounted: (id: string) => void;

package/dist/store/tracing/tracingCollector.mjs

@@ -73,6 +73,11 @@ var r = n({ max: 30 }), i = [], a = /* @__PURE__ */ new Map(), o = /* @__PURE__
 			causes: D()
 		})), h && (u.set(e, a.get(f)?.commitId ?? g), l = !0), _ || (_ = !0, y(T));
 	},
+	lastCommitId: () => g,
+	commitsSince: (e) => {
+		let t = [...a.values()].sort((e, t) => e.timestamp - t.timestamp);
+		return [...i, ...t].filter((t) => t.commitId > e);
+	},
 	linkParent: E,
 	markMounted: (e) => {
 		d.delete(e) && (l = !0);

package/dist/style/index.d.ts

@@ -3,6 +3,7 @@ export * from './fontAssets';
 export * from './fontValidation';
 export * from './fonts';
 export * from './fontsFromCss';
+export * from './runtimeStyle';
 export * from './styleConstants';
 export * from './styleStates';
 export { styleConstants };

package/dist/style/index.mjs

@@ -3,5 +3,6 @@ import { fontLinkAssets as a } from "./fontAssets.mjs";
 import { SYSTEM_FONTS as o, availableFonts as s, familiesInCss as c, fontFamilyStack as l, fontUrlResolver as u, fontsToHead as d, googleCss2Url as f, googleTextSubsetUrl as p, isSafeFontUrl as m, primaryFamily as h } from "./fonts.mjs";
 import { FontValidationError as g, parseSpaceFont as _ } from "./fontValidation.mjs";
 import { fallbackForFamily as v, fontsFromCss as y } from "./fontsFromCss.mjs";
-import { STYLE_STATES as b, STYLE_STATE_LABELS as x, inCascadeOrder as S, isKnownState as C } from "./styleStates.mjs";
-export { t as EMPTY_STYLE_SCHEMA, g as FontValidationError, b as STYLE_STATES, x as STYLE_STATE_LABELS, o as SYSTEM_FONTS, n as StyleBindingsAllowed, s as availableFonts, r as baseDefaultValue, v as fallbackForFamily, c as familiesInCss, l as fontFamilyStack, a as fontLinkAssets, u as fontUrlResolver, y as fontsFromCss, d as fontsToHead, f as googleCss2Url, p as googleTextSubsetUrl, S as inCascadeOrder, i as inheritableAttributesBase, C as isKnownState, m as isSafeFontUrl, _ as parseSpaceFont, h as primaryFamily, e as styleConstants };
+import { RUNTIME_STYLE_ID as b, markStyleCache as x, styleCacheFromDocument as S, styleCacheTravelsInDocument as C } from "./runtimeStyle.mjs";
+import { HIDDEN_CLASS as w, STYLE_STATES as T, STYLE_STATE_LABELS as E, inCascadeOrder as D, isKnownState as O, isStartingState as k, stateSuffix as A } from "./styleStates.mjs";
+export { t as EMPTY_STYLE_SCHEMA, g as FontValidationError, w as HIDDEN_CLASS, b as RUNTIME_STYLE_ID, T as STYLE_STATES, E as STYLE_STATE_LABELS, o as SYSTEM_FONTS, n as StyleBindingsAllowed, s as availableFonts, r as baseDefaultValue, v as fallbackForFamily, c as familiesInCss, l as fontFamilyStack, a as fontLinkAssets, u as fontUrlResolver, y as fontsFromCss, d as fontsToHead, f as googleCss2Url, p as googleTextSubsetUrl, D as inCascadeOrder, i as inheritableAttributesBase, O as isKnownState, m as isSafeFontUrl, k as isStartingState, x as markStyleCache, _ as parseSpaceFont, h as primaryFamily, A as stateSuffix, S as styleCacheFromDocument, C as styleCacheTravelsInDocument, e as styleConstants };

package/dist/style/runtimeStyle.d.ts

@@ -0,0 +1,29 @@
+/**
+ * The space's compiled stylesheet (`style.cache`) on a server-rendered page, which carries it once.
+ *
+ * The runtime `<style>` the page renders already holds the cache, verbatim, so sending it again in the hydration payload
+ * made every page ship its stylesheet twice. Instead the server leaves it out of the payload, and the browser reads it
+ * back from that `<style>` before hydrating — the same string, so the client renders the same markup and the store
+ * holds the same cache it always did.
+ *
+ * The cache sits between two comment markers inside the runtime stylesheet: a comment changes nothing about the
+ * cascade, and the element and its place in the tree stay exactly what they were.
+ */
+/** The `data-id` of the stylesheet the SDK renders into the page. */
+export declare const RUNTIME_STYLE_ID = "plitzi-runtime-style";
+/** The cache as the runtime stylesheet embeds it, between the markers `styleCacheFromDocument` reads it by. */
+export declare const markStyleCache: (cache: string) => string;
+/**
+ * Whether the cache reads back from the document byte for byte, so it can be left out of the payload.
+ *
+ * - `{{ token }}`: the stylesheet holds the cache with its tokens already replaced, and the browser needs the tokens to
+ *   replace them again when a variable changes.
+ * - `<`: React escapes a `<style` inside a stylesheet as it renders it, so the text would not come back as it went.
+ * - `\r` and `\0`: the HTML parser normalises both.
+ * - The end marker: the cache would end early.
+ *
+ * An empty cache has nothing to save.
+ */
+export declare const styleCacheTravelsInDocument: (cache: string) => boolean;
+/** The cache the server left in the runtime stylesheet under `root`, or `undefined` when there is none to read. */
+export declare const styleCacheFromDocument: (root: ParentNode) => string | undefined;

package/dist/style/runtimeStyle.mjs

@@ -0,0 +1,7 @@
+//#region src/style/runtimeStyle.ts
+var e = "plitzi-runtime-style", t = "/*plitzi:style-cache*/", n = "/*plitzi:style-cache-end*/", r = (e) => `${t}${e}${n}`, i = (e) => e !== "" && !/\{\{|<|\r|\0/.test(e) && !e.includes(n), a = (e) => {
+	let r = e.querySelector("style[data-id=\"plitzi-runtime-style\"]")?.textContent ?? "", i = r.indexOf(t), a = r.indexOf(n, i);
+	if (!(i < 0 || a < 0)) return r.slice(i + 22, a);
+};
+//#endregion
+export { e as RUNTIME_STYLE_ID, r as markStyleCache, a as styleCacheFromDocument, i as styleCacheTravelsInDocument };

package/dist/style/styleConstants.d.ts

@@ -69,6 +69,7 @@ declare const styleConstants: {
     readonly TRANSITION_DURATION: "transition-duration";
     readonly TRANSITION_TIMING_FUNCTION: "transition-timing-function";
     readonly TRANSITION_DELAY: "transition-delay";
+    readonly TRANSITION_BEHAVIOR: "transition-behavior";
     readonly ANIMATION: "animation";
     readonly ANIMATION_NAME: "animation-name";
     readonly ANIMATION_DURATION: "animation-duration";
@@ -176,8 +177,8 @@ declare const styleConstants: {
 };
 export declare const inheritableAttributesBase: StyleCategory[];
 export declare const StyleBindingsAllowed: {
-    path: "filter" | "fill" | "color" | "cursor" | "display" | "flex-wrap" | "flex-direction" | "align-items" | "justify-items" | "justify-content" | "align-content" | "row-gap" | "column-gap" | "grid-row-gap" | "grid-column-gap" | "grid-template-areas" | "grid-template-columns" | "grid-template-rows" | "grid-auto-flow" | "grid-auto-rows" | "grid-auto-columns" | "grid-row-start" | "grid-column-start" | "grid-row-end" | "grid-column-end" | "align-self" | "justify-self" | "order" | "flex-grow" | "flex-shrink" | "flex-basis" | "list-style" | "list-style-type" | "list-style-position" | "list-style-image" | "background-color" | "background-image" | "background-position" | "background-size" | "background-repeat" | "background-origin" | "background-clip" | "background-attachment" | "background-blend-mode" | "mask-image" | "border-top-style" | "border-top-width" | "border-top-color" | "border-bottom-style" | "border-bottom-width" | "border-bottom-color" | "border-left-style" | "border-left-width" | "border-left-color" | "border-right-style" | "border-right-width" | "border-right-color" | "border-top-left-radius" | "border-top-right-radius" | "border-bottom-left-radius" | "border-bottom-right-radius" | "border-collapse" | "border-spacing" | "table-layout" | "opacity" | "visibility" | "transition" | "transition-property" | "transition-duration" | "transition-timing-function" | "transition-delay" | "animation" | "animation-name" | "animation-duration" | "animation-timing-function" | "animation-delay" | "animation-iteration-count" | "animation-direction" | "animation-fill-mode" | "animation-play-state" | "animation-timeline" | "animation-range" | "box-shadow" | "backdrop-filter" | "mix-blend-mode" | "isolation" | "clip-path" | "transform" | "transform-origin" | "perspective" | "will-change" | "outline-width" | "outline-style" | "outline-color" | "outline-offset" | "pointer-events" | "user-select" | "touch-action" | "resize" | "appearance" | "scroll-behavior" | "overscroll-behavior" | "accent-color" | "caret-color" | "color-scheme" | "position" | "float" | "clear" | "z-index" | "top" | "bottom" | "left" | "right" | "box-sizing" | "aspect-ratio" | "width" | "height" | "min-width" | "min-height" | "max-width" | "max-height" | "overflow" | "overflow-x" | "overflow-y" | "scrollbar-width" | "scrollbar-color" | "object-fit" | "object-position" | "column-width" | "column-count" | "margin-top" | "margin-bottom" | "margin-left" | "margin-right" | "padding-top" | "padding-bottom" | "padding-left" | "padding-right" | "font-family" | "font-weight" | "font-size" | "line-height" | "text-align" | "font-style" | "font-variant" | "font-variant-numeric" | "font-feature-settings" | "text-decoration" | "text-decoration-line" | "text-decoration-color" | "text-decoration-style" | "text-decoration-thickness" | "text-underline-offset" | "letter-spacing" | "word-spacing" | "text-indent" | "text-transform" | "direction" | "white-space" | "text-wrap" | "word-break" | "overflow-wrap" | "hyphens" | "vertical-align" | "text-overflow" | "text-shadow" | "line-clamp" | "-webkit-line-clamp" | "-webkit-box-orient" | "-webkit-text-fill-color" | "stroke" | "stroke-width";
-    label: "filter" | "fill" | "color" | "cursor" | "display" | "flex-wrap" | "flex-direction" | "align-items" | "justify-items" | "justify-content" | "align-content" | "row-gap" | "column-gap" | "grid-row-gap" | "grid-column-gap" | "grid-template-areas" | "grid-template-columns" | "grid-template-rows" | "grid-auto-flow" | "grid-auto-rows" | "grid-auto-columns" | "grid-row-start" | "grid-column-start" | "grid-row-end" | "grid-column-end" | "align-self" | "justify-self" | "order" | "flex-grow" | "flex-shrink" | "flex-basis" | "list-style" | "list-style-type" | "list-style-position" | "list-style-image" | "background-color" | "background-image" | "background-position" | "background-size" | "background-repeat" | "background-origin" | "background-clip" | "background-attachment" | "background-blend-mode" | "mask-image" | "border-top-style" | "border-top-width" | "border-top-color" | "border-bottom-style" | "border-bottom-width" | "border-bottom-color" | "border-left-style" | "border-left-width" | "border-left-color" | "border-right-style" | "border-right-width" | "border-right-color" | "border-top-left-radius" | "border-top-right-radius" | "border-bottom-left-radius" | "border-bottom-right-radius" | "border-collapse" | "border-spacing" | "table-layout" | "opacity" | "visibility" | "transition" | "transition-property" | "transition-duration" | "transition-timing-function" | "transition-delay" | "animation" | "animation-name" | "animation-duration" | "animation-timing-function" | "animation-delay" | "animation-iteration-count" | "animation-direction" | "animation-fill-mode" | "animation-play-state" | "animation-timeline" | "animation-range" | "box-shadow" | "backdrop-filter" | "mix-blend-mode" | "isolation" | "clip-path" | "transform" | "transform-origin" | "perspective" | "will-change" | "outline-width" | "outline-style" | "outline-color" | "outline-offset" | "pointer-events" | "user-select" | "touch-action" | "resize" | "appearance" | "scroll-behavior" | "overscroll-behavior" | "accent-color" | "caret-color" | "color-scheme" | "position" | "float" | "clear" | "z-index" | "top" | "bottom" | "left" | "right" | "box-sizing" | "aspect-ratio" | "width" | "height" | "min-width" | "min-height" | "max-width" | "max-height" | "overflow" | "overflow-x" | "overflow-y" | "scrollbar-width" | "scrollbar-color" | "object-fit" | "object-position" | "column-width" | "column-count" | "margin-top" | "margin-bottom" | "margin-left" | "margin-right" | "padding-top" | "padding-bottom" | "padding-left" | "padding-right" | "font-family" | "font-weight" | "font-size" | "line-height" | "text-align" | "font-style" | "font-variant" | "font-variant-numeric" | "font-feature-settings" | "text-decoration" | "text-decoration-line" | "text-decoration-color" | "text-decoration-style" | "text-decoration-thickness" | "text-underline-offset" | "letter-spacing" | "word-spacing" | "text-indent" | "text-transform" | "direction" | "white-space" | "text-wrap" | "word-break" | "overflow-wrap" | "hyphens" | "vertical-align" | "text-overflow" | "text-shadow" | "line-clamp" | "-webkit-line-clamp" | "-webkit-box-orient" | "-webkit-text-fill-color" | "stroke" | "stroke-width";
+    path: "color" | "cursor" | "display" | "flex-wrap" | "flex-direction" | "align-items" | "justify-items" | "justify-content" | "align-content" | "row-gap" | "column-gap" | "grid-row-gap" | "grid-column-gap" | "grid-template-areas" | "grid-template-columns" | "grid-template-rows" | "grid-auto-flow" | "grid-auto-rows" | "grid-auto-columns" | "grid-row-start" | "grid-column-start" | "grid-row-end" | "grid-column-end" | "align-self" | "justify-self" | "order" | "flex-grow" | "flex-shrink" | "flex-basis" | "list-style" | "list-style-type" | "list-style-position" | "list-style-image" | "background-color" | "background-image" | "background-position" | "background-size" | "background-repeat" | "background-origin" | "background-clip" | "background-attachment" | "background-blend-mode" | "mask-image" | "border-top-style" | "border-top-width" | "border-top-color" | "border-bottom-style" | "border-bottom-width" | "border-bottom-color" | "border-left-style" | "border-left-width" | "border-left-color" | "border-right-style" | "border-right-width" | "border-right-color" | "border-top-left-radius" | "border-top-right-radius" | "border-bottom-left-radius" | "border-bottom-right-radius" | "border-collapse" | "border-spacing" | "table-layout" | "opacity" | "visibility" | "transition" | "transition-property" | "transition-duration" | "transition-timing-function" | "transition-delay" | "transition-behavior" | "animation" | "animation-name" | "animation-duration" | "animation-timing-function" | "animation-delay" | "animation-iteration-count" | "animation-direction" | "animation-fill-mode" | "animation-play-state" | "animation-timeline" | "animation-range" | "box-shadow" | "filter" | "backdrop-filter" | "mix-blend-mode" | "isolation" | "clip-path" | "transform" | "transform-origin" | "perspective" | "will-change" | "outline-width" | "outline-style" | "outline-color" | "outline-offset" | "pointer-events" | "user-select" | "touch-action" | "resize" | "appearance" | "scroll-behavior" | "overscroll-behavior" | "accent-color" | "caret-color" | "color-scheme" | "position" | "float" | "clear" | "z-index" | "top" | "bottom" | "left" | "right" | "box-sizing" | "aspect-ratio" | "width" | "height" | "min-width" | "min-height" | "max-width" | "max-height" | "overflow" | "overflow-x" | "overflow-y" | "scrollbar-width" | "scrollbar-color" | "object-fit" | "object-position" | "column-width" | "column-count" | "margin-top" | "margin-bottom" | "margin-left" | "margin-right" | "padding-top" | "padding-bottom" | "padding-left" | "padding-right" | "font-family" | "font-weight" | "font-size" | "line-height" | "text-align" | "font-style" | "font-variant" | "font-variant-numeric" | "font-feature-settings" | "text-decoration" | "text-decoration-line" | "text-decoration-color" | "text-decoration-style" | "text-decoration-thickness" | "text-underline-offset" | "letter-spacing" | "word-spacing" | "text-indent" | "text-transform" | "direction" | "white-space" | "text-wrap" | "word-break" | "overflow-wrap" | "hyphens" | "vertical-align" | "text-overflow" | "text-shadow" | "line-clamp" | "-webkit-line-clamp" | "-webkit-box-orient" | "-webkit-text-fill-color" | "fill" | "stroke" | "stroke-width";
+    label: "color" | "cursor" | "display" | "flex-wrap" | "flex-direction" | "align-items" | "justify-items" | "justify-content" | "align-content" | "row-gap" | "column-gap" | "grid-row-gap" | "grid-column-gap" | "grid-template-areas" | "grid-template-columns" | "grid-template-rows" | "grid-auto-flow" | "grid-auto-rows" | "grid-auto-columns" | "grid-row-start" | "grid-column-start" | "grid-row-end" | "grid-column-end" | "align-self" | "justify-self" | "order" | "flex-grow" | "flex-shrink" | "flex-basis" | "list-style" | "list-style-type" | "list-style-position" | "list-style-image" | "background-color" | "background-image" | "background-position" | "background-size" | "background-repeat" | "background-origin" | "background-clip" | "background-attachment" | "background-blend-mode" | "mask-image" | "border-top-style" | "border-top-width" | "border-top-color" | "border-bottom-style" | "border-bottom-width" | "border-bottom-color" | "border-left-style" | "border-left-width" | "border-left-color" | "border-right-style" | "border-right-width" | "border-right-color" | "border-top-left-radius" | "border-top-right-radius" | "border-bottom-left-radius" | "border-bottom-right-radius" | "border-collapse" | "border-spacing" | "table-layout" | "opacity" | "visibility" | "transition" | "transition-property" | "transition-duration" | "transition-timing-function" | "transition-delay" | "transition-behavior" | "animation" | "animation-name" | "animation-duration" | "animation-timing-function" | "animation-delay" | "animation-iteration-count" | "animation-direction" | "animation-fill-mode" | "animation-play-state" | "animation-timeline" | "animation-range" | "box-shadow" | "filter" | "backdrop-filter" | "mix-blend-mode" | "isolation" | "clip-path" | "transform" | "transform-origin" | "perspective" | "will-change" | "outline-width" | "outline-style" | "outline-color" | "outline-offset" | "pointer-events" | "user-select" | "touch-action" | "resize" | "appearance" | "scroll-behavior" | "overscroll-behavior" | "accent-color" | "caret-color" | "color-scheme" | "position" | "float" | "clear" | "z-index" | "top" | "bottom" | "left" | "right" | "box-sizing" | "aspect-ratio" | "width" | "height" | "min-width" | "min-height" | "max-width" | "max-height" | "overflow" | "overflow-x" | "overflow-y" | "scrollbar-width" | "scrollbar-color" | "object-fit" | "object-position" | "column-width" | "column-count" | "margin-top" | "margin-bottom" | "margin-left" | "margin-right" | "padding-top" | "padding-bottom" | "padding-left" | "padding-right" | "font-family" | "font-weight" | "font-size" | "line-height" | "text-align" | "font-style" | "font-variant" | "font-variant-numeric" | "font-feature-settings" | "text-decoration" | "text-decoration-line" | "text-decoration-color" | "text-decoration-style" | "text-decoration-thickness" | "text-underline-offset" | "letter-spacing" | "word-spacing" | "text-indent" | "text-transform" | "direction" | "white-space" | "text-wrap" | "word-break" | "overflow-wrap" | "hyphens" | "vertical-align" | "text-overflow" | "text-shadow" | "line-clamp" | "-webkit-line-clamp" | "-webkit-box-orient" | "-webkit-text-fill-color" | "fill" | "stroke" | "stroke-width";
 }[];
 export declare const baseDefaultValue: Record<StyleCategory, StyleValue>;
 export default styleConstants;

package/dist/style/styleConstants.mjs

@@ -82,6 +82,7 @@ var e = {
 	TRANSITION_DURATION: "transition-duration",
 	TRANSITION_TIMING_FUNCTION: "transition-timing-function",
 	TRANSITION_DELAY: "transition-delay",
+	TRANSITION_BEHAVIOR: "transition-behavior",
 	ANIMATION: "animation",
 	ANIMATION_NAME: "animation-name",
 	ANIMATION_DURATION: "animation-duration",
@@ -281,6 +282,7 @@ var e = {
 	[t.TRANSITION_DURATION]: "0s",
 	[t.TRANSITION_TIMING_FUNCTION]: "ease",
 	[t.TRANSITION_DELAY]: "0s",
+	[t.TRANSITION_BEHAVIOR]: "normal",
 	[t.ANIMATION]: "none",
 	[t.ANIMATION_NAME]: "none",
 	[t.ANIMATION_DURATION]: "0s",

package/dist/style/styleStates.d.ts

@@ -6,8 +6,14 @@
  *
  * `focus-visible` is the focus ring a keyboard user needs and a mouse user does not; `focus-within` dresses a
  * container while anything inside it has focus — a field wrapper around its input.
+ *
+ * `hidden` is not a pseudo-class: it is how an element looks while its `visible` says no — where it goes as it hides,
+ * and where it comes from as it shows. With a transition on the class (`display` among what it transitions, and
+ * `transition-behavior: allow-discrete`), a panel fades or slides in and out instead of blinking.
  */
-export declare const STYLE_STATES: readonly ["hover", "focus", "focus-visible", "focus-within", "active", "disabled", "checked", "visited"];
+export declare const STYLE_STATES: readonly ["hover", "focus", "focus-visible", "focus-within", "active", "disabled", "checked", "visited", "hidden"];
+/** What the SDK puts on an element whose `visible` says no: `display: none`, and what the `hidden` state selects. */
+export declare const HIDDEN_CLASS = "plitzi-component--hidden";
 export declare const STYLE_STATE_LABELS: Record<(typeof STYLE_STATES)[number], string>;
 export declare const isKnownState: (state: string) => state is (typeof STYLE_STATES)[number];
 /**
@@ -15,3 +21,10 @@ export declare const isKnownState: (state: string) => state is (typeof STYLE_STA
  * A state outside the list keeps its place after the known ones.
  */
 export declare const inCascadeOrder: <T>(states: Record<string, T>) => [string, T][];
+/** How a state is written after the selector it modifies: its pseudo-class, or for `hidden` the class that hides. */
+export declare const stateSuffix: (state: string) => string;
+/**
+ * Whether a state is also where an element starts from as it appears (`@starting-style`): `hidden` is — a panel that
+ * fades out to nothing fades in from it — and every pseudo-class is not.
+ */
+export declare const isStartingState: (state: string) => boolean;

package/dist/style/styleStates.mjs

@@ -7,8 +7,9 @@ var e = [
 	"active",
 	"disabled",
 	"checked",
-	"visited"
-], t = {
+	"visited",
+	"hidden"
+], t = "plitzi-component--hidden", n = {
 	hover: "Hover",
 	focus: "Focus",
 	"focus-visible": "Focus visible",
@@ -16,8 +17,9 @@ var e = [
 	active: "Active",
 	disabled: "Disabled",
 	checked: "Checked",
-	visited: "Visited"
-}, n = {
+	visited: "Visited",
+	hidden: "Hidden"
+}, r = {
 	visited: 0,
 	checked: 1,
 	"focus-within": 2,
@@ -25,7 +27,8 @@ var e = [
 	focus: 4,
 	"focus-visible": 5,
 	active: 6,
-	disabled: 7
-}, r = (e) => Object.hasOwn(n, e), i = (t) => r(t) ? n[t] : e.length, a = (e) => Object.entries(e).sort(([e], [t]) => i(e) - i(t));
+	disabled: 7,
+	hidden: 8
+}, i = (e) => Object.hasOwn(r, e), a = (t) => i(t) ? r[t] : e.length, o = (e) => Object.entries(e).sort(([e], [t]) => a(e) - a(t)), s = (e) => e === "hidden" ? `.${t}` : `:${e}`, c = (e) => e === "hidden";
 //#endregion
-export { e as STYLE_STATES, t as STYLE_STATE_LABELS, a as inCascadeOrder, r as isKnownState };
+export { t as HIDDEN_CLASS, e as STYLE_STATES, n as STYLE_STATE_LABELS, o as inCascadeOrder, i as isKnownState, c as isStartingState, s as stateSuffix };

package/dist/theme/ThemeProvider.d.ts

@@ -38,5 +38,5 @@ export type ThemeProviderProps = {
  * updating the moment the visitor changes their system setting, which is how a panel ends up dark inside a page
  * that is still light.
  */
-declare const ThemeProvider: ({ defaultTheme, theme, scope, cookieName, children }: ThemeProviderProps) => import("react").JSX.Element;
+declare const ThemeProvider: ({ defaultTheme, theme, scope, cookieName, children }: ThemeProviderProps) => import('react').JSX.Element;
 export default ThemeProvider;

package/dist/theme/ThemeProvider.mjs

@@ -2,11 +2,11 @@ import { THEME_COOKIE_NAME as e, applyThemeClass as t, readThemeCookie as n, wri
 import i, { createThemeStore as a, resolveScheme as o, setMachineScheme as s, setThemeMode as c } from "./themeStore.mjs";
 import l from "./ThemeScope.mjs";
 import { useCommonStoreSync as u } from "../store/index.mjs";
-import { use as d, useEffect as f, useId as p, useState as m, useSyncExternalStore as h } from "react";
-import { StoreContext as g, useIsomorphicLayoutEffect as _ } from "@plitzi/nexus/react";
-import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
+import { use as d, useEffect as f, useId as p, useRef as m, useState as h, useSyncExternalStore as g } from "react";
+import { StoreContext as _, useIsomorphicLayoutEffect as v } from "@plitzi/nexus/react";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
 //#region src/theme/ThemeProvider.tsx
-var x = "(prefers-color-scheme: dark)", S = () => window.matchMedia(x).matches ? "dark" : "light", C = ({ state: e }) => (u([
+var S = "(prefers-color-scheme: dark)", C = () => window.matchMedia(S).matches ? "dark" : "light", w = ({ state: e }) => (u([
 	"theme.mode",
 	"theme.resolved",
 	"theme.areas"
@@ -14,41 +14,47 @@ var x = "(prefers-color-scheme: dark)", S = () => window.matchMedia(x).matches ?
 	e.mode,
 	o(e.mode, e.scheme),
 	e.areas
-]), null), w = ({ defaultTheme: o = "system", theme: u, scope: w = "document", cookieName: T = e, children: E }) => {
-	let D = w === "container", O = p(), [k] = m(() => D ? a(`theme${O}`) : void 0), A = k ?? i;
-	_(() => {
-		let e = D ? void 0 : n(T);
-		A.batch(() => {
-			s(S(), A), c(u ?? e ?? o, A);
+]), null), T = ({ defaultTheme: o = "system", theme: u, scope: T = "document", cookieName: E = e, children: D }) => {
+	let O = T === "container", k = p(), [A] = h(() => O ? a(`theme${k}`) : void 0), j = A ?? i, M = m({
+		mode: o,
+		remembered: !1
+	});
+	v(() => {
+		let e = O ? void 0 : n(E), t = u ?? e ?? o;
+		M.current = {
+			mode: t,
+			remembered: e !== void 0
+		}, j.batch(() => {
+			s(C(), j), c(t, j);
 		});
 	}, [
 		o,
 		u,
-		T,
-		D,
-		A
+		E,
+		O,
+		j
 	]);
-	let j = h(A.subscribe, A.getState, A.getState), M = d(g) !== void 0;
+	let N = g(j.subscribe, j.getState, j.getState), P = d(_) !== void 0;
 	f(() => {
-		let e = window.matchMedia(x), t = () => s(e.matches ? "dark" : "light", A);
+		let e = window.matchMedia(S), t = () => s(e.matches ? "dark" : "light", j);
 		return e.addEventListener("change", t), t(), () => e.removeEventListener("change", t);
-	}, [A]), f(() => {
-		if (D) return;
+	}, [j]), f(() => {
+		if (O) return;
 		let e = () => {
-			let { mode: e } = A.getState();
-			r(e, T), t(e, document.documentElement);
+			let { mode: e } = j.getState();
+			(M.current.remembered || e !== M.current.mode) && (r(e, E), M.current.remembered = !0), t(e, document.documentElement);
 		};
-		return e(), A.subscribe(e);
+		return e(), j.subscribe(e);
 	}, [
-		T,
-		D,
-		A
+		E,
+		O,
+		j
 	]);
-	let N = M ? /* @__PURE__ */ y(C, { state: j }) : null;
-	return D ? /* @__PURE__ */ b(l, {
-		value: k,
-		children: [N, E]
-	}) : /* @__PURE__ */ b(v, { children: [N, E] });
+	let F = P ? /* @__PURE__ */ b(w, { state: N }) : null;
+	return O ? /* @__PURE__ */ x(l, {
+		value: A,
+		children: [F, D]
+	}) : /* @__PURE__ */ x(y, { children: [F, D] });
 };
 //#endregion
-export { w as default };
+export { T as default };

package/dist/theme/themeCookie.mjs

@@ -1,24 +1,20 @@
+import { cookieFromHeader as e } from "../helpers/cookies.mjs";
 //#region src/theme/themeCookie.ts
-var e = "theme", t = ["dark", "light"], n = [...t, "system"], r = 31536e3, i = (e) => n.includes(e), a = (e, n) => {
-	for (let r of t) n.classList.toggle(r, e === r);
-}, o = (t, n = e) => {
-	if (t) for (let e of t.split(";")) {
-		let t = e.indexOf("=");
-		if (t > -1 && e.slice(0, t).trim() === n) {
-			let n = decodeURIComponent(e.slice(t + 1).trim());
-			return i(n) ? n : void 0;
-		}
-	}
-}, s = (t = e) => {
+var t = "theme", n = ["dark", "light"], r = [...n, "system"], i = 31536e3, a = (e) => r.includes(e), o = (e, t) => {
+	for (let r of n) t.classList.toggle(r, e === r);
+}, s = (n, r = t) => {
+	let i = e(n, r);
+	return a(i) ? i : void 0;
+}, c = (e = t) => {
 	try {
-		return o(document.cookie, t);
+		return s(document.cookie, e);
 	} catch {
 		return;
 	}
-}, c = (t, n = e) => {
+}, l = (e, n = t) => {
 	try {
-		document.cookie = `${n}=${encodeURIComponent(t)};path=/;max-age=${r};SameSite=Lax`;
+		document.cookie = `${n}=${encodeURIComponent(e)};path=/;max-age=${i};SameSite=Lax`;
 	} catch {}
 };
 //#endregion
-export { t as THEME_CLASSES, e as THEME_COOKIE_NAME, a as applyThemeClass, i as isTheme, s as readThemeCookie, o as themeFromCookies, c as writeThemeCookie };
+export { n as THEME_CLASSES, t as THEME_COOKIE_NAME, o as applyThemeClass, a as isTheme, c as readThemeCookie, s as themeFromCookies, l as writeThemeCookie };

package/dist/types/ActionTypes.d.ts

@@ -221,6 +221,8 @@ export type ActionRunReport = {
     status: ActionRunStatus;
     output: Record<string, unknown>;
     trace: Record<string, unknown>[];
+    /** Each step as it ran — status, timing, error, and what it logged. */
+    steps: ActionRunStep[];
 };
 /**
  * Whether the CLIENT flow waits. The server side is synchronous in every mode: `detached` means the step does not
@@ -343,6 +345,8 @@ export type ActionRunStep = {
     endTime: number;
     /** Why it failed, redacted of every credential value the run resolved. */
     error?: string;
+    /** What the step logged (`ctx.log`), redacted the same way; at most a hundred lines of a thousand characters. */
+    logs?: string[];
 };
 /**
  * A run a page RENDER started, reported to a page whose debugging is authorized.
@@ -495,3 +499,192 @@ export type ActionStreamFrame = {
     event: 'error';
     data: ActionCallError;
 };
+/**
+ * Where a job is, as the only durable answer to "did it happen".
+ *
+ * `pending` is waiting to be taken, `running` is held by a worker under a lease, and the other four are terminal —
+ * except that an operator may put a `failed`, `dead` or `cancelled` one back to `pending`. `dead` is a job that
+ * used up every attempt it was given: it stays, visibly, because the alternative is work that quietly evaporated.
+ */
+export type ActionJobStatus = 'pending' | 'running' | 'succeeded' | 'failed' | 'dead' | 'cancelled';
+/**
+ * One go at a job, kept forever on the job itself.
+ *
+ * `lost` is the attempt nobody reported: a worker took the job, its lease ran out, and another worker found it
+ * abandoned. It is the record of a replica that died mid-run, which is otherwise the one failure that leaves no
+ * trace anywhere — and the reason this list exists rather than a single `error` field.
+ */
+export type ActionJobAttempt = {
+    attempt: number;
+    status: 'succeeded' | 'failed' | 'cancelled' | 'lost';
+    /** Epoch ms, from the QUEUE's clock — never a worker's own. */
+    startedAt: number;
+    endedAt: number;
+    /** Which worker held it, so a bad replica is identifiable from the history alone. */
+    workerId: string;
+    /** The run this attempt became, when it got far enough to be one. Joins to the run history. */
+    runId?: string;
+    error?: string;
+};
+/** What starting a job needs. Everything else is the queue's to fill in. */
+export type ActionJobInput = {
+    /**
+     * The job's identity, and the whole of its exactly-once guarantee.
+     *
+     * A schedule derives it from the fire it belongs to — `schedule:<space>:<action>:<instant>` — so two replicas
+     * reaching the same fire write the same id and the second one is a no-op. Enqueue is idempotent by this, which
+     * is what lets a producer crash between enqueuing and recording that it did.
+     */
+    id: string;
+    spaceId: number;
+    actionId: string;
+    environment: Environment;
+    trigger: ActionTriggerType;
+    input: Record<string, unknown>;
+    /** The instant this job was due, as the schedule stored it. Epoch ms. */
+    dueAt: number;
+    maxAttempts: number;
+    /** Fires that went by unclaimed before this one. Shown to an operator; never acted on. */
+    missed?: number;
+};
+/** One unit of work the queue is holding, as an operator sees it. */
+export type ActionJob = ActionJobInput & {
+    status: ActionJobStatus;
+    /** Epoch ms before which no worker may take it — a retry's backoff, or the moment it was enqueued. */
+    runAt: number;
+    attempts: number;
+    /** While `running`: the instant the holder's claim lapses and another worker may take it over. */
+    leaseUntil?: number;
+    workerId?: string;
+    runId?: string;
+    /** Set by an operator who wants it stopped; the worker holding it reads this and aborts. */
+    cancelRequested?: boolean;
+    createdAt: number;
+    updatedAt: number;
+    /** Why the last attempt ended badly. */
+    error?: string;
+    history: ActionJobAttempt[];
+};
+/**
+ * How a worker reports what became of a claim.
+ *
+ * `delayMs` rather than an instant, and no timestamps: every moment the queue records is read from the QUEUE's
+ * clock, because a cluster whose nodes sit in different countries agrees about durations and not about now.
+ */
+export type ActionJobSettlement = {
+    jobId: string;
+    workerId: string;
+    status: Extract<ActionJobStatus, 'succeeded' | 'failed' | 'dead' | 'cancelled' | 'pending'>;
+    /** For a retry: how long from now before it may be claimed again. */
+    delayMs?: number;
+    runId?: string;
+    error?: string;
+    /** The attempt to append to the history. Omitted only when the claim is being handed back untouched. */
+    attempt?: Omit<ActionJobAttempt, 'attempt' | 'startedAt' | 'endedAt'>;
+};
+export type ActionJobQuery = {
+    spaceIds: number[];
+    actionId?: string;
+    status?: ActionJobStatus;
+    limit: number;
+    offset: number;
+};
+/**
+ * A recurring intent, as a row rather than as a timer.
+ *
+ * `nextRunAt` is the point of the whole design: the instant of the next fire is DECIDED ONCE and written down, so
+ * every replica afterwards reads the same number instead of asking its own clock whether the moment has come. Two
+ * nodes whose clocks differ by a minute then produce the same fires, in the same order, exactly once each — the
+ * disagreement moves the WHEN by their skew and can never move the WHETHER.
+ */
+export type ActionSchedule = {
+    spaceId: number;
+    actionId: string;
+    cron: string;
+    timezone?: string;
+    environment: Environment;
+    enabled: boolean;
+    /** Epoch ms of the next fire this schedule owes. The queue's clock decides when that has arrived. */
+    nextRunAt: number;
+    /** The last fire actually enqueued. */
+    lastFireAt?: number;
+    /** Fires that went by while nothing was running to take them. Cumulative, and shown to an operator. */
+    missed: number;
+    maxAttempts: number;
+    updatedAt: number;
+};
+/** A schedule as it is derived from an action document — everything the queue does not own itself. */
+export type ActionScheduleInput = Omit<ActionSchedule, 'missed' | 'updatedAt' | 'lastFireAt'>;
+/**
+ * Where a deployment keeps its jobs and schedules.
+ *
+ * The same kind of seam as {@link ActionKvAdapter} and for the same reason — the server never learns where a
+ * deployment stores anything — but with one rule this one cannot be written without, and it is written here so no
+ * deployment has to rediscover it:
+ *
+ * **Every instant comes from the store.** `now` is the cluster's clock, and every comparison the queue makes
+ * internally — is this schedule due, has this lease lapsed, may this retry be claimed — is made against it, never
+ * against the caller's. That is why `settle` takes a `delayMs` and not a deadline, and why `claim` takes a
+ * `leaseMs` and not a `leaseUntil`: durations survive a cluster spread across time zones and machines whose clocks
+ * drift, and absolute instants minted by a caller do not.
+ *
+ * **`enqueue` is idempotent by `id`,** and answers whether it was the one that created the job. That, and nothing
+ * else, is what makes a fire happen exactly once when several replicas are racing to produce it.
+ *
+ * **`claim` is atomic, and it also reaps.** A job whose lease has lapsed is a job whose worker died, and it is
+ * taken by whoever claims next — the same operation, because a separate reaper is a second thing to deploy, to
+ * schedule and to forget.
+ */
+export type ActionJobQueue = {
+    /** The cluster's clock. The only clock anything in the scheduling path is allowed to read. */
+    now: () => Promise<Date>;
+    /** True when this call created the job; false when that id was already there. Never throws on a duplicate. */
+    enqueue: (job: ActionJobInput) => Promise<boolean>;
+    /**
+     * Takes up to `limit` jobs that are due, and any whose lease has lapsed — atomically, one worker per job.
+     *
+     * A reclaimed job arrives with its previous holder's attempt already written to the history as `lost`.
+     */
+    claim: (params: {
+        workerId: string;
+        leaseMs: number;
+        limit: number;
+    }) => Promise<ActionJob[]>;
+    /** Extends the lease on jobs this worker still holds, and answers which of them an operator asked to cancel. */
+    heartbeat: (params: {
+        jobIds: string[];
+        workerId: string;
+        leaseMs: number;
+    }) => Promise<string[]>;
+    settle: (settlement: ActionJobSettlement) => Promise<void>;
+    /** Due schedules, oldest fire first. */
+    dueSchedules: (limit: number) => Promise<ActionSchedule[]>;
+    /**
+     * Moves a schedule forward, but only if it is still where the caller last saw it.
+     *
+     * The compare-and-set is what stops two replicas from advancing the same schedule twice. Answers false when
+     * somebody else got there first, which is not an error — it is the other replica having done the work.
+     */
+    advanceSchedule: (params: {
+        spaceId: number;
+        actionId: string;
+        from: number;
+        to: number;
+        missed: number;
+    }) => Promise<boolean>;
+    /** Replaces what this space has scheduled. An action no longer listed stops having a schedule at all. */
+    putSchedules: (params: {
+        spaceId: number;
+        schedules: ActionScheduleInput[];
+    }) => Promise<void>;
+    listJobs: (query: ActionJobQuery) => Promise<{
+        jobs: ActionJob[];
+        total: number;
+    }>;
+    getJob: (spaceIds: number[], jobId: string) => Promise<ActionJob | undefined>;
+    listSchedules: (spaceIds: number[]) => Promise<ActionSchedule[]>;
+    /** An operator putting a finished job back in the queue. Answers false when it is not in a state to go back. */
+    requeue: (spaceIds: number[], jobId: string) => Promise<boolean>;
+    /** An operator stopping a job: dropped if it is waiting, aborted at its next step if it is running. */
+    cancel: (spaceIds: number[], jobId: string) => Promise<boolean>;
+};

package/dist/types/AuthTypes.d.ts

@@ -33,6 +33,16 @@ export type AuthGrant<U = Record<string, unknown>> = {
     user?: U;
     token?: TokenResult;
 };
+/**
+ * A right password that bought a CHALLENGE and not a session: the account has a second factor, and `mfaToken` is what
+ * the code is completed against (`auth.login` with `mode: 'mfa'`). Not a failure of the session — nothing was lost —
+ * which is why it is not one of the {@link AuthFailureReason}s.
+ */
+export type MfaChallenge = {
+    ok: false;
+    reason: 'mfa';
+    mfaToken: string;
+};
 export type AuthResult<U = Record<string, unknown>> = ({
     ok: true;
 } & AuthGrant<U>) | {
@@ -54,7 +64,7 @@ export type LoginResult = ({
 } & TokenResult) | {
     ok: false;
     reason: AuthFailureReason;
-};
+} | MfaChallenge;
 export type AuthContextValue = {
     /** The credentials your login endpoint expects. Values arrive from interaction parameters, hence `unknown`. */
     login: (params: Record<string, unknown>) => Promise<LoginResult>;