verstak 0.92.25014 → 0.93.25025

package/build/dist/source/core/El.js

@@ -1,10 +1,10 @@
 export var ElKind;
 (function (ElKind) {
-    ElKind[ElKind["panel"] = 0] = "panel";
+    ElKind[ElKind["division"] = 0] = "division";
     ElKind[ElKind["table"] = 1] = "table";
-    ElKind[ElKind["note"] = 2] = "note";
+    ElKind[ElKind["text"] = 2] = "text";
     ElKind[ElKind["group"] = 3] = "group";
-    ElKind[ElKind["part"] = 4] = "part";
+    ElKind[ElKind["partition"] = 4] = "partition";
     ElKind[ElKind["splitter"] = 5] = "splitter";
     ElKind[ElKind["cursor"] = 6] = "cursor";
     ElKind[ElKind["native"] = 7] = "native";

package/build/dist/source/core/ElDriver.d.ts

@@ -29,7 +29,7 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     constructor(node: ReactiveNode<El<T, M>>);
     prepareForUpdate(): void;
     get index(): number;
-    get isPanel(): boolean;
+    get isDivision(): boolean;
     get isTable(): boolean;
     get isAuxiliary(): boolean;
     get kind(): ElKind;

package/build/dist/source/core/ElDriver.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { ReactiveNode, BaseDriver, Transaction, observable, ObservableObject } from "reactronic";
+import { ReactiveNode, BaseDriver, Transaction, trigger, TriggeringObject } from "reactronic";
 import { ElKind, Horizontal, Vertical, Direction } from "./El.js";
 import { equalElCoords, parseElCoords } from "./ElUtils.js";
 export class ElDriver extends BaseDriver {
@@ -23,7 +23,7 @@ export class ElImpl {
         this.layoutInfo = undefined;
         this.native = undefined;
         this.model = undefined;
-        this._kind = ElKind.part;
+        this._kind = ElKind.partition;
         this._place = undefined;
         this._coords = UndefinedElCoords;
         this._width = new Size();
@@ -45,9 +45,9 @@ export class ElImpl {
         this._hasStylingPresets = false;
     }
     get index() { return this.node.slot.index; }
-    get isPanel() { return this.kind === ElKind.panel; }
+    get isDivision() { return this.kind === ElKind.division; }
     get isTable() { return this.kind === ElKind.table; }
-    get isAuxiliary() { return this.kind > ElKind.note; }
+    get isAuxiliary() { return this.kind > ElKind.text; }
     get kind() { return this._kind; }
     set kind(value) {
         if (value !== this._kind || this.node.stamp >= Number.MAX_SAFE_INTEGER - 1) {
@@ -535,7 +535,7 @@ export class ElImpl {
             native.className = enabled ? styleName : "";
     }
 }
-class Size extends ObservableObject {
+class Size extends TriggeringObject {
     constructor() {
         super();
         this.raw = { min: "", max: "" };
@@ -561,27 +561,27 @@ export class ElLayoutInfo {
     }
 }
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Number)
 ], ElLayoutInfo.prototype, "effectiveSizePx", void 0);
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Number)
 ], ElLayoutInfo.prototype, "contentSizeXpx", void 0);
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Number)
 ], ElLayoutInfo.prototype, "contentSizeYpx", void 0);
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Number)
 ], ElLayoutInfo.prototype, "borderSizeYpx", void 0);
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Number)
 ], ElLayoutInfo.prototype, "borderSizeXpx", void 0);
 __decorate([
-    observable,
+    trigger,
     __metadata("design:type", Boolean)
 ], ElLayoutInfo.prototype, "isUpdateFinished", void 0);
 var ElLayoutInfoFlags;
@@ -708,7 +708,7 @@ export const Constants = {
     wrapper: "wrapper",
     splitter: "splitter",
     group: "group",
-    layouts: ["panel", "table", "note", "group", "", "", ""],
+    layouts: ["division", "table", "text", "group", "", "", ""],
     keyAttrName: "key",
     kindAttrName: "kind",
 };

package/build/dist/source/core/Elements.d.ts

@@ -4,8 +4,8 @@ import { CursorCommandDriver } from "./ElDriver.js";
 import { HtmlDriver } from "./WebDriver.js";
 export declare function Window(script?: Script<El<HTMLBodyElement>>, scriptAsync?: ScriptAsync<El<HTMLBodyElement>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLBodyElement>>, preparationAsync?: ScriptAsync<El<HTMLBodyElement>>, finalization?: Script<El<HTMLBodyElement>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLBodyElement>>): ReactiveNode<El<HTMLBodyElement>>;
 export declare function Window(declaration?: ReactiveNodeDecl<El<HTMLBodyElement>>): ReactiveNode<El<HTMLBodyElement>>;
-export declare function Panel<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
-export declare function Panel<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
+export declare function Division<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
+export declare function Division<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
 export declare function Table<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
 export declare function Table<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
 export declare function row<T = void>(builder?: (element: void) => T, shiftCursorDown?: number): void;
@@ -13,14 +13,14 @@ export declare function Splitter<M = unknown>(script?: Script<El<HTMLElement, M>
 export declare function Splitter<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
 export declare function rowBreak(shiftCursorDown?: number): void;
 export declare function declareSplitter<T>(index: number, splitViewNode: ReactiveNode<El<T>>): ReactiveNode<El<HTMLElement>>;
-export declare function cursor(areaParams: ElPlace): void;
-export declare function Note(content: string, formatted?: boolean, declaration?: ReactiveNodeDecl<El<HTMLElement, void>>): ReactiveNode<El<HTMLElement, void>>;
+export declare function cursor(place: ElPlace): void;
+export declare function JustText(content: string, formatted?: boolean, declaration?: ReactiveNodeDecl<El<HTMLElement, void>>): ReactiveNode<El<HTMLElement, void>>;
 export declare function Group<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
 export declare function Group<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
-export declare function Handling<M = unknown>(script: Script<El<void, M>>): ReactiveNode<El<void, M>>;
-export declare function SyntheticElement<M = unknown>(script?: Script<El<void, M>>, scriptAsync?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, preparation?: Script<El<void, M>>, preparationAsync?: ScriptAsync<El<void, M>>, finalization?: Script<El<void, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
-export declare function SyntheticElement<M = unknown>(declaration?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
-export declare class PanelDriver<T extends HTMLElement> extends HtmlDriver<T> {
+export declare function Fragment<M = unknown>(script: Script<El<void, M>>): ReactiveNode<El<void, M>>;
+export declare function PseudoElement<M = unknown>(script?: Script<El<void, M>>, scriptAsync?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, preparation?: Script<El<void, M>>, preparationAsync?: ScriptAsync<El<void, M>>, finalization?: Script<El<void, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
+export declare function PseudoElement<M = unknown>(declaration?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
+export declare class DivisionDriver<T extends HTMLElement> extends HtmlDriver<T> {
     runScript(node: ReactiveNode<El<T>>): void | Promise<void>;
     declareChild(ownerNode: ReactiveNode<El<T, any>>, childDriver: ReactiveNodeDriver<any>, childDeclaration?: ReactiveNodeDecl<any> | undefined, childBasis?: ReactiveNodeDecl<any> | undefined): MergedItem<ReactiveNode> | undefined;
 }
@@ -30,13 +30,13 @@ export declare class PartitionDriver<T extends HTMLElement> extends HtmlDriver<T
     provideHost(node: ReactiveNode<El<T, any>>): ReactiveNode<El<T, any>>;
 }
 export declare const Drivers: {
-    panel: PanelDriver<HTMLElement>;
+    division: DivisionDriver<HTMLElement>;
     table: HtmlDriver<HTMLElement, any>;
-    note: HtmlDriver<HTMLElement, any>;
+    text: HtmlDriver<HTMLElement, any>;
     group: HtmlDriver<HTMLElement, any>;
     partition: PartitionDriver<HTMLElement>;
     wrapper: HtmlDriver<HTMLElement, any>;
     splitter: HtmlDriver<HTMLElement, any>;
     cursor: CursorCommandDriver;
-    synthetic: ReactiveNodeDriver<El<void, any>>;
+    pseudo: ReactiveNodeDriver<El<void, any>>;
 };

package/build/dist/source/core/Elements.js

@@ -6,11 +6,11 @@ import { getPrioritiesForEmptySpaceDistribution, getPrioritiesForSizeChanging, r
 import { Axis, BodyFontSize, Dimension, toPx } from "./Sizes.js";
 import { HtmlDriver, StaticDriver } from "./WebDriver.js";
 export function Window(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
-    const driver = new StaticDriver(global.document.body, "Page", false, el => el.kind = ElKind.panel);
+    const driver = new StaticDriver(global.document.body, "Page", false, el => el.kind = ElKind.division);
     return ReactiveNode.declare(driver, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
-export function Panel(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
-    return ReactiveNode.declare(Drivers.panel, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
+export function Division(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
+    return ReactiveNode.declare(Drivers.division, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
 export function Table(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
     return ReactiveNode.declare(Drivers.table, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
@@ -37,7 +37,7 @@ export function declareSplitter(index, splitViewNode) {
             const dataForSensor = e.dataForSensor;
             dataForSensor.draggable = key;
             dataForSensor.drag = key;
-            Handling(() => {
+            Fragment(() => {
                 var _a, _b, _c, _d;
                 const pointer = e.sensors.pointer;
                 if (pointer.dragSource === key) {
@@ -78,15 +78,15 @@ export function declareSplitter(index, splitViewNode) {
         },
     }));
 }
-export function cursor(areaParams) {
+export function cursor(place) {
     ReactiveNode.declare(Drivers.cursor, {
         script: el => {
-            el.place = areaParams;
+            el.place = place;
         },
     });
 }
-export function Note(content, formatted, declaration) {
-    return ReactiveNode.declare(Drivers.note, ReactiveNode.withBasis(declaration, {
+export function JustText(content, formatted, declaration) {
+    return ReactiveNode.declare(Drivers.text, ReactiveNode.withBasis(declaration, {
         script: el => {
             if (formatted)
                 el.native.innerHTML = content;
@@ -98,13 +98,13 @@ export function Note(content, formatted, declaration) {
 export function Group(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
     return ReactiveNode.declare(Drivers.group, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
-export function Handling(script) {
-    return SyntheticElement({ mode: Mode.autonomous, script });
+export function Fragment(script) {
+    return PseudoElement({ mode: Mode.autonomous, script });
 }
-export function SyntheticElement(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
-    return ReactiveNode.declare(Drivers.synthetic, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
+export function PseudoElement(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
+    return ReactiveNode.declare(Drivers.pseudo, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
-export class PanelDriver extends HtmlDriver {
+export class DivisionDriver extends HtmlDriver {
     runScript(node) {
         rowBreak();
         const el = node.element;
@@ -114,7 +114,7 @@ export class PanelDriver extends HtmlDriver {
                 el.layoutInfo = new ElLayoutInfo(InitialElLayoutInfo);
             const layoutInfo = el.layoutInfo;
             layoutInfo.isUpdateFinished = false;
-            Handling(h => {
+            Fragment(h => {
                 const native = el.native;
                 const resize = native.sensors.resize;
                 for (const x of resize.resizedElements) {
@@ -126,7 +126,7 @@ export class PanelDriver extends HtmlDriver {
                     layoutInfo.contentSizeYpx = contentBoxPx.blockSize;
                 }
             });
-            const relayoutEl = SyntheticElement({
+            const relayoutEl = PseudoElement({
                 mode: Mode.autonomous,
                 script: () => {
                     const native = el.native;
@@ -217,7 +217,7 @@ export class PanelDriver extends HtmlDriver {
     }
 }
 export function isSplitViewPartition(childDriver) {
-    return !childDriver.isPartition && childDriver !== Drivers.splitter && childDriver !== Drivers.synthetic;
+    return !childDriver.isPartition && childDriver !== Drivers.splitter && childDriver !== Drivers.pseudo;
 }
 function overrideMethod(declaration, method, func) {
     const baseScript = declaration[method];
@@ -268,13 +268,13 @@ export class PartitionDriver extends HtmlDriver {
     }
 }
 export const Drivers = {
-    panel: new PanelDriver(Constants.element, false, el => el.kind = ElKind.panel),
+    division: new DivisionDriver(Constants.element, false, el => el.kind = ElKind.division),
     table: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.table),
-    note: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.note),
+    text: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.text),
     group: new HtmlDriver(Constants.group, false, el => el.kind = ElKind.group),
-    partition: new PartitionDriver(Constants.partition, true, el => el.kind = ElKind.part),
+    partition: new PartitionDriver(Constants.partition, true, el => el.kind = ElKind.partition),
     wrapper: new HtmlDriver(Constants.wrapper, false, el => el.kind = ElKind.native),
     splitter: new HtmlDriver(Constants.splitter, false, el => el.kind = ElKind.splitter),
     cursor: new CursorCommandDriver(),
-    synthetic: new ElDriver("synthetic", false, el => el.kind = ElKind.group),
+    pseudo: new ElDriver("pseudo", false, el => el.kind = ElKind.group),
 };

package/build/dist/source/core/Restyler.d.ts

@@ -1,5 +1,5 @@
-export declare function restyler<T>(restyle: () => T): ObservablesStyles<T>;
-export declare class ObservablesStyles<T> {
+export declare function restyler<T>(restyle: () => T): TriggeringStyles<T>;
+export declare class TriggeringStyles<T> {
     private readonly restyle;
     constructor(restyle: () => T);
     protected cache(): T;

package/build/dist/source/core/Restyler.js

@@ -7,11 +7,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { cached, atomicRun } from "reactronic";
+import { cache, atomicRun } from "reactronic";
 export function restyler(restyle) {
-    return atomicRun(() => new ObservablesStyles(restyle));
+    return atomicRun(() => new TriggeringStyles(restyle));
 }
-export class ObservablesStyles {
+export class TriggeringStyles {
     constructor(restyle) {
         this.restyle = restyle;
     }
@@ -23,8 +23,8 @@ export class ObservablesStyles {
     }
 }
 __decorate([
-    cached,
+    cache,
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", Object)
-], ObservablesStyles.prototype, "cache", null);
+], TriggeringStyles.prototype, "cache", null);

package/build/dist/source/core/sensors/ButtonSensor.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { options, Reentrance, atomic, Transaction, LoggingLevel } from "reactronic";
+import { options, Reentrance, atomicBlock, Transaction, LoggingLevel } from "reactronic";
 import { extractPointerButton, isPointerButtonDown, PointerButton, BasePointerSensor } from "./BasePointerSensor.js";
 import { findTargetElementData, SymDataForSensor } from "./DataForSensor.js";
 import { extractModifierKeys, KeyboardModifiers } from "./KeyboardSensor.js";
@@ -164,42 +164,42 @@ export class ButtonSensor extends BasePointerSensor {
     }
 }
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], ButtonSensor.prototype, "press", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ reentrance: Reentrance.cancelPrevious, logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], ButtonSensor.prototype, "selecting", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], ButtonSensor.prototype, "select", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", void 0)
 ], ButtonSensor.prototype, "release", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", void 0)
 ], ButtonSensor.prototype, "cancel", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),

package/build/dist/source/core/sensors/FocusSensor.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { options, atomic, LoggingLevel, Transaction } from "reactronic";
+import { options, atomicBlock, LoggingLevel, Transaction } from "reactronic";
 import { objectHasMember } from "../ElUtils.js";
 import { grabElementDataList, SymDataForSensor } from "./DataForSensor.js";
 import { HtmlElementSensor } from "./HtmlElementSensor.js";
@@ -132,32 +132,32 @@ export class FocusSensor extends HtmlElementSensor {
     }
 }
 __decorate([
-    atomic,
+    atomicBlock,
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [Object, String]),
     __metadata("design:returntype", void 0)
 ], FocusSensor.prototype, "setActiveData", null);
 __decorate([
-    atomic,
+    atomicBlock,
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [Boolean]),
     __metadata("design:returntype", void 0)
 ], FocusSensor.prototype, "listen", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [FocusEvent]),
     __metadata("design:returntype", void 0)
 ], FocusSensor.prototype, "doFocusIn", null);
 __decorate([
-    atomic,
+    atomicBlock,
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [FocusEvent]),
     __metadata("design:returntype", void 0)
 ], FocusSensor.prototype, "doFocusOut", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [MouseEvent]),

package/build/dist/source/core/sensors/Handlers.js

@@ -8,10 +8,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { Mode, ToggleRef, nonReactiveRun } from "reactronic";
-import { SyntheticElement } from "../Elements.js";
+import { PseudoElement } from "../Elements.js";
 export function OnClick(target, action, key) {
     if (action !== undefined) {
-        SyntheticElement({
+        PseudoElement({
             key,
             mode: Mode.autonomous,
             triggers: { target },
@@ -31,7 +31,7 @@ export function OnClick(target, action, key) {
 }
 export function OnClickAsync(target, action, key) {
     if (action !== undefined) {
-        SyntheticElement({
+        PseudoElement({
             key,
             mode: Mode.autonomous,
             triggers: { target },
@@ -51,7 +51,7 @@ export function OnClickAsync(target, action, key) {
 }
 export function OnResize(target, action, key) {
     if (action) {
-        SyntheticElement({
+        PseudoElement({
             key,
             mode: Mode.autonomous,
             triggers: { target },
@@ -65,7 +65,7 @@ export function OnResize(target, action, key) {
     }
 }
 export function OnFocus(target, model, switchEditMode = undefined, key) {
-    SyntheticElement({
+    PseudoElement({
         key,
         mode: Mode.autonomous,
         triggers: { target, model },

package/build/dist/source/core/sensors/HoverSensor.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { options, atomic, LoggingLevel, Transaction } from "reactronic";
+import { options, atomicBlock, LoggingLevel, Transaction } from "reactronic";
 import { SymDataForSensor, findTargetElementData } from "./DataForSensor.js";
 import { BasePointerSensor } from "./BasePointerSensor.js";
 import { KeyboardModifiers, extractModifierKeys } from "./KeyboardSensor.js";
@@ -90,35 +90,35 @@ export class HoverSensor extends BasePointerSensor {
     }
 }
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], HoverSensor.prototype, "doPointerEnter", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], HoverSensor.prototype, "doPointerOver", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], HoverSensor.prototype, "doPointerMove", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [PointerEvent]),
     __metadata("design:returntype", void 0)
 ], HoverSensor.prototype, "doPointerLeave", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),

package/build/dist/source/core/sensors/HtmlDragSensor.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { options, reactive, atomic, unobservable, Transaction, LoggingLevel } from "reactronic";
+import { options, reaction, atomicBlock, trigger, Transaction, LoggingLevel } from "reactronic";
 import { findTargetElementData, SymDataForSensor } from "./DataForSensor.js";
 import { HtmlElementSensor } from "./HtmlElementSensor.js";
 import { extractModifierKeys, KeyboardModifiers } from "./KeyboardSensor.js";
@@ -262,109 +262,109 @@ export class HtmlDragSensor extends HtmlElementSensor {
     }
 }
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Map)
 ], HtmlDragSensor.prototype, "dataByFormat", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Object)
 ], HtmlDragSensor.prototype, "draggingImage", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Number)
 ], HtmlDragSensor.prototype, "draggingImageX", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Number)
 ], HtmlDragSensor.prototype, "draggingImageY", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", String)
 ], HtmlDragSensor.prototype, "dropEffect", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Array)
 ], HtmlDragSensor.prototype, "dataTypesAllowed", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", String)
 ], HtmlDragSensor.prototype, "effectAllowed", void 0);
 __decorate([
-    unobservable,
+    trigger(false),
     __metadata("design:type", Boolean)
 ], HtmlDragSensor.prototype, "dropAllowed", void 0);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "startDragging", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "dragging", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "finishDragging", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "enterTarget", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "leaveTarget", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "dragOver", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "drop", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "updateEventOnDragStart", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [DragEvent]),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "updateEventOnDropAllowed", null);
 __decorate([
-    atomic,
+    atomicBlock,
     options({ logging: LoggingLevel.Off }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", void 0)
 ], HtmlDragSensor.prototype, "reset", null);
 __decorate([
-    reactive,
+    reaction,
     options({ throttling: 0 }),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),