0.24.260

package.json

@@ -1,6 +1,6 @@
 {
   "name": "verstak",
-  "version": "0.24.250",
+  "version": "0.24.260",
   "description": "Verstak - Front-End Library",
   "publisher": "Nezaboodka Software",
   "license": "Apache-2.0",
@@ -31,7 +31,7 @@
   },
   "homepage": "https://github.com/nezaboodka/verstak/blob/master/README.md#readme",
   "dependencies": {
-    "reactronic": "^0.24.250"
+    "reactronic": "^0.24.260"
   },
   "devDependencies": {
     "@types/node": "20.11.17",

source/html/Elements.ts

@@ -57,7 +57,7 @@ export function startNewRow(shiftCursorDown?: number): void {
 
 export function cursor(areaParams: ElArea): void {
   RxNode.declare(Drivers.cursor, {
-    autorun: el => {
+    onChange: el => {
       el.area = areaParams
     },
   })
@@ -68,7 +68,7 @@ export function cursor(areaParams: ElArea): void {
 export function Note(content: string, formatted?: boolean,
   declaration?: RxNodeDecl<El<HTMLElement, void>>): RxNode<El<HTMLElement, void>> {
   return RxNode.declare(Drivers.note, declaration, {
-    autorun: el => {
+    onChange: el => {
       if (formatted)
         el.native.innerHTML = content
       else
@@ -88,8 +88,8 @@ export function Group<M = unknown, R = void>(
 // Fragment
 
 export function Handling<M = unknown>(
-  autorun: Delegate<El<void, M>>): RxNode<El<void, M>> {
-  return SyntheticElement({ mode: Mode.independentUpdate, autorun })
+  onChange: Delegate<El<void, M>>): RxNode<El<void, M>> {
+  return SyntheticElement({ mode: Mode.independentUpdate, onChange })
 }
 
 export function SyntheticElement<M = unknown>(

source/html/Handlers.ts

@@ -16,7 +16,7 @@ export function OnClick(target: HTMLElement, action: (() => void) | ToggleRef |
       key,
       mode: Mode.independentUpdate,
       triggers: { target/* , action */ },
-      autorun: el => {
+      onChange: el => {
         const pointer = target.sensors.pointer
         if (pointer.clicked) {
           if (action instanceof Function) {
@@ -37,7 +37,7 @@ export function OnResize(target: HTMLElement, action: ((element: ResizedElement)
       key,
       mode: Mode.independentUpdate,
       triggers: { target/* , action */ },
-      autorun: el => {
+      onChange: el => {
         const resize = target.sensors.resize
         resize.resizedElements.forEach(x => {
           action(x)
@@ -55,10 +55,10 @@ export function OnFocus(
     key,
     mode: Mode.independentUpdate,
     triggers: { target, model },
-    activation: el => {
+    onCreate: el => {
       el.node.configureReactronic({ throttling: 0 })
     },
-    autorun: el => {
+    onChange: el => {
       if (switchEditMode !== undefined) {
         switchEditMode(model)
       }

source/html/HtmlDriver.ts

@@ -16,25 +16,25 @@ export class WebDriver<T extends Element, M = unknown> extends ElDriver<T, M> {
     // it's up to descendant class to define logic
   }
 
-  activate(node: RxNode<El<T, M>>): void {
+  create(node: RxNode<El<T, M>>): void {
     this.setNativeElement(node)
     const e = node.element.native
     if (RxSystem.isLogging && e !== undefined && !node.driver.isPartitionSeparator)
       e.setAttribute(Constants.keyAttrName, node.key)
-    super.activate(node)
+    super.create(node)
     if (e == undefined && RxSystem.isLogging && !node.driver.isPartitionSeparator)
       node.element.native.setAttribute(Constants.keyAttrName, node.key)
   }
 
-  deactivate(node: RxNode<El<T, M>>, isLeader: boolean): boolean {
+  destroy(node: RxNode<El<T, M>>, isLeader: boolean): boolean {
     const element = node.element
     const native = element.native as T | undefined // hack
     if (native) {
       native.resizeObserver?.unobserve(native) // is it really needed or browser does this automatically?
       if (isLeader)
         native.remove()
     }
-    super.deactivate(node, isLeader)
+    super.destroy(node, isLeader)
     element.native = null as any
     return false // children elements having native HTML elements are not treated as leaders
   }