verstak 0.24.309 → 0.24.310

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/build/dist/source/archive/RxDomV1.js +5 -5
  2. package/build/dist/source/html/DraggableArea.view.d.ts +2 -2
  3. package/build/dist/source/html/DraggableArea.view.js +2 -2
  4. package/build/dist/source/html/El.d.ts +20 -20
  5. package/build/dist/source/html/El.js +54 -54
  6. package/build/dist/source/html/Elements.d.ts +20 -20
  7. package/build/dist/source/html/Elements.js +12 -12
  8. package/build/dist/source/html/Handlers.d.ts +7 -0
  9. package/build/dist/source/html/Handlers.js +15 -0
  10. package/build/dist/source/html/HtmlDriver.d.ts +11 -11
  11. package/build/dist/source/html/HtmlDriver.js +8 -8
  12. package/build/dist/source/html/HtmlElements.d.ts +176 -176
  13. package/build/dist/source/html/HtmlElements.js +175 -175
  14. package/build/dist/source/html/Sizes.d.ts +3 -3
  15. package/build/dist/source/html/Sizes.js +3 -3
  16. package/build/dist/source/html/SplitViewMath.d.ts +10 -10
  17. package/package.json +2 -2
package/build/dist/source/archive/RxDomV1.js CHANGED
@@ -16,7 +16,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
16
16
  step((generator = generator.apply(thisArg, _arguments || [])).next());
17
17
  });
18
18
  };
19
- import { reactive, unobs, Transaction, RxSystem, options, Reentrance } from "reactronic";
19
+ import { reactive, unobs, Transaction, ReactiveSystem, options, Reentrance } from "reactronic";
20
20
  import { RxNode } from "./RxDomV1.Types.js";
21
21
  export class BasicNodeType {
22
22
  constructor(name, sequential) {
@@ -25,7 +25,7 @@ export class BasicNodeType {
25
25
  }
26
26
  initialize(node) {
27
27
  if (!node.inline)
28
- RxSystem.setLoggingHint(node, node.id);
28
+ ReactiveSystem.setLoggingHint(node, node.id);
29
29
  }
30
30
  render(node, args) {
31
31
  const inst = node.instance;
@@ -56,7 +56,7 @@ export class BasicNodeType {
56
56
  if (inst) {
57
57
  inst.native = undefined;
58
58
  if (!node.inline && node.instance)
59
- Transaction.isolate(() => RxSystem.dispose(node.instance));
59
+ Transaction.isolate(() => ReactiveSystem.dispose(node.instance));
60
60
  for (const x of inst.children)
61
61
  tryToFinalize(x, initiator);
62
62
  for (const x of inst.guests)
@@ -78,7 +78,7 @@ export class RxNodeInstanceImpl {
78
78
  }
79
79
  rerender(node) {
80
80
  invokeRender(node, node.args);
81
- RxSystem.configureCurrentOperation({ order: this.level });
81
+ ReactiveSystem.configureCurrentOperation({ order: this.level });
82
82
  }
83
83
  }
84
84
  RxNodeInstanceImpl.gUuid = 0;
@@ -432,7 +432,7 @@ function tryToInitialize(node) {
432
432
  (_a = type.initialize) === null || _a === void 0 ? void 0 : _a.call(type, node);
433
433
  (_b = type.mount) === null || _b === void 0 ? void 0 : _b.call(type, node);
434
434
  if (!node.inline)
435
- RxSystem.setLoggingHint(inst, node.id);
435
+ ReactiveSystem.setLoggingHint(inst, node.id);
436
436
  return inst;
437
437
  }
438
438
  function tryToFinalize(node, initiator) {
package/build/dist/source/html/DraggableArea.view.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { RxNodeDecl, RxNode } from "reactronic";
1
+ import { ReactiveNodeDecl, ReactiveNode } from "reactronic";
2
2
  import { El } from "./El.js";
3
3
  import { PointerSensor } from "./sensors/PointerSensor.js";
4
4
  export type DragAndDropHandler = (pointer: PointerSensor) => void;
@@ -8,4 +8,4 @@ export interface DraggableAreaModel {
8
8
  droppedAction?: DragAndDropHandler;
9
9
  dragFinishedAction?: DragAndDropHandler;
10
10
  }
11
- export declare function DraggableArea(draggingId: string, builder: RxNodeDecl<El<HTMLDivElement, DraggableAreaModel>>): RxNode<El<HTMLDivElement>>;
11
+ export declare function DraggableArea(draggingId: string, builder: ReactiveNodeDecl<El<HTMLDivElement, DraggableAreaModel>>): ReactiveNode<El<HTMLDivElement>>;
package/build/dist/source/html/DraggableArea.view.js CHANGED
@@ -1,8 +1,8 @@
1
- import { Mode, RxNode } from "reactronic";
1
+ import { Mode, ReactiveNode } from "reactronic";
2
2
  import { Div } from "./HtmlElements.js";
3
3
  import { Handling } from "./Elements.js";
4
4
  export function DraggableArea(draggingId, builder) {
5
- return (Div(RxNode.rebased(builder, {
5
+ return (Div(ReactiveNode.withBasis(builder, {
6
6
  mode: Mode.independentUpdate,
7
7
  script: b => {
8
8
  const e = b.native;
package/build/dist/source/html/El.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { RxNode, BaseDriver } from "reactronic";
1
+ import { ReactiveNode, BaseDriver } from "reactronic";
2
2
  export type El<T = any, M = any> = {
3
- readonly node: RxNode<El<T, M>>;
3
+ readonly node: ReactiveNode<El<T, M>>;
4
4
  readonly index: number;
5
5
  native: T;
6
6
  model: M;
@@ -8,10 +8,10 @@ export type El<T = any, M = any> = {
8
8
  place: ElPlace;
9
9
  width: Range;
10
10
  height: Range;
11
- horizontal: PosH | undefined;
12
- contentHorizontal: PosH | undefined;
13
- vertical: PosV | undefined;
14
- contentVertical: PosV | undefined;
11
+ horizontal: Horizontal | undefined;
12
+ contentHorizontal: Horizontal | undefined;
13
+ vertical: Vertical | undefined;
14
+ contentVertical: Vertical | undefined;
15
15
  stretchingStrengthH: number | undefined;
16
16
  stretchingStrengthV: number | undefined;
17
17
  contentWrapping: boolean;
@@ -46,14 +46,14 @@ export type ElCoords = {
46
46
  x2: number;
47
47
  y2: number;
48
48
  };
49
- export declare enum PosH {
49
+ export declare enum Horizontal {
50
50
  left = 0,
51
51
  center = 1,
52
52
  right = 2,
53
53
  stretch = 3,
54
54
  stretchAndFix = 4
55
55
  }
56
- export declare enum PosV {
56
+ export declare enum Vertical {
57
57
  top = 0,
58
58
  center = 1,
59
59
  bottom = 2,
@@ -77,10 +77,10 @@ export declare enum Direction {
77
77
  vertical = 1
78
78
  }
79
79
  export declare class ElDriver<T extends Element, M = unknown> extends BaseDriver<El<T, M>> {
80
- allocate(node: RxNode<El<T, M>>): El<T, M>;
80
+ allocate(node: ReactiveNode<El<T, M>>): El<T, M>;
81
81
  }
82
82
  export declare class ElImpl<T extends Element = any, M = any> implements El<T, M> {
83
- readonly node: RxNode<El<T, M>>;
83
+ readonly node: ReactiveNode<El<T, M>>;
84
84
  maxColumnCount: number;
85
85
  maxRowCount: number;
86
86
  layoutInfo?: ElLayoutInfo;
@@ -102,7 +102,7 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
102
102
  private _sealed;
103
103
  private _splitView;
104
104
  private _hasStylingPresets;
105
- constructor(node: RxNode<El<T, M>>);
105
+ constructor(node: ReactiveNode<El<T, M>>);
106
106
  prepareForUpdate(): void;
107
107
  get index(): number;
108
108
  get isPanel(): boolean;
@@ -132,14 +132,14 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
132
132
  minPx: number;
133
133
  maxPx: number;
134
134
  });
135
- get horizontal(): PosH | undefined;
136
- set horizontal(value: PosH | undefined);
137
- get vertical(): PosV | undefined;
138
- set vertical(value: PosV | undefined);
139
- get contentHorizontal(): PosH | undefined;
140
- set contentHorizontal(value: PosH | undefined);
141
- get contentVertical(): PosV | undefined;
142
- set contentVertical(value: PosV | undefined);
135
+ get horizontal(): Horizontal | undefined;
136
+ set horizontal(value: Horizontal | undefined);
137
+ get vertical(): Vertical | undefined;
138
+ set vertical(value: Vertical | undefined);
139
+ get contentHorizontal(): Horizontal | undefined;
140
+ set contentHorizontal(value: Horizontal | undefined);
141
+ get contentVertical(): Vertical | undefined;
142
+ set contentVertical(value: Vertical | undefined);
143
143
  get stretchingStrengthH(): number | undefined;
144
144
  set stretchingStrengthH(value: number | undefined);
145
145
  get stretchingStrengthV(): number | undefined;
@@ -156,7 +156,7 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
156
156
  get style(): CSSStyleDeclaration;
157
157
  useStylingPreset(stylingPresetName: string, enabled?: boolean): void;
158
158
  protected children(onlyAfter?: ElImpl): Generator<ElImpl>;
159
- static childrenOf(node: RxNode<El>, onlyAfter?: El): Generator<ElImpl>;
159
+ static childrenOf(node: ReactiveNode<El>, onlyAfter?: El): Generator<ElImpl>;
160
160
  private rowBreak;
161
161
  private static applyKind;
162
162
  private static applyCoords;
package/build/dist/source/html/El.js CHANGED
@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  var __metadata = (this && this.__metadata) || function (k, v) {
8
8
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
9
9
  };
10
- import { RxNode, BaseDriver, Transaction, obs, ObservableObject } from "reactronic";
10
+ import { ReactiveNode, BaseDriver, Transaction, obs, ObservableObject } from "reactronic";
11
11
  import { equalElCoords, parseElCoords } from "./ElUtils.js";
12
12
  export var ElKind;
13
13
  (function (ElKind) {
@@ -20,22 +20,22 @@ export var ElKind;
20
20
  ElKind[ElKind["cursor"] = 6] = "cursor";
21
21
  ElKind[ElKind["native"] = 7] = "native";
22
22
  })(ElKind || (ElKind = {}));
23
- export var PosH;
24
- (function (PosH) {
25
- PosH[PosH["left"] = 0] = "left";
26
- PosH[PosH["center"] = 1] = "center";
27
- PosH[PosH["right"] = 2] = "right";
28
- PosH[PosH["stretch"] = 3] = "stretch";
29
- PosH[PosH["stretchAndFix"] = 4] = "stretchAndFix";
30
- })(PosH || (PosH = {}));
31
- export var PosV;
32
- (function (PosV) {
33
- PosV[PosV["top"] = 0] = "top";
34
- PosV[PosV["center"] = 1] = "center";
35
- PosV[PosV["bottom"] = 2] = "bottom";
36
- PosV[PosV["stretch"] = 3] = "stretch";
37
- PosV[PosV["stretchAndFix"] = 4] = "stretchAndFix";
38
- })(PosV || (PosV = {}));
23
+ export var Horizontal;
24
+ (function (Horizontal) {
25
+ Horizontal[Horizontal["left"] = 0] = "left";
26
+ Horizontal[Horizontal["center"] = 1] = "center";
27
+ Horizontal[Horizontal["right"] = 2] = "right";
28
+ Horizontal[Horizontal["stretch"] = 3] = "stretch";
29
+ Horizontal[Horizontal["stretchAndFix"] = 4] = "stretchAndFix";
30
+ })(Horizontal || (Horizontal = {}));
31
+ export var Vertical;
32
+ (function (Vertical) {
33
+ Vertical[Vertical["top"] = 0] = "top";
34
+ Vertical[Vertical["center"] = 1] = "center";
35
+ Vertical[Vertical["bottom"] = 2] = "bottom";
36
+ Vertical[Vertical["stretch"] = 3] = "stretch";
37
+ Vertical[Vertical["stretchAndFix"] = 4] = "stretchAndFix";
38
+ })(Vertical || (Vertical = {}));
39
39
  export var Direction;
40
40
  (function (Direction) {
41
41
  Direction[Direction["horizontal"] = 0] = "horizontal";
@@ -299,8 +299,8 @@ export class ElImpl {
299
299
  }
300
300
  static applyHorizontal(element, oldPrimary, newPrimary, oldInside, newInside, strength) {
301
301
  var _a, _b;
302
- oldPrimary !== null && oldPrimary !== void 0 ? oldPrimary : (oldPrimary = PosH.left);
303
- newPrimary !== null && newPrimary !== void 0 ? newPrimary : (newPrimary = PosH.left);
302
+ oldPrimary !== null && oldPrimary !== void 0 ? oldPrimary : (oldPrimary = Horizontal.left);
303
+ newPrimary !== null && newPrimary !== void 0 ? newPrimary : (newPrimary = Horizontal.left);
304
304
  oldInside !== null && oldInside !== void 0 ? oldInside : (oldInside = oldPrimary);
305
305
  newInside !== null && newInside !== void 0 ? newInside : (newInside = newPrimary);
306
306
  const css = element.style;
@@ -313,8 +313,8 @@ export class ElImpl {
313
313
  }
314
314
  let isEffectiveAlignerX = false;
315
315
  if (hostLayout) {
316
- const isAligner = newPrimary === PosH.center ||
317
- newPrimary === PosH.right;
316
+ const isAligner = newPrimary === Horizontal.center ||
317
+ newPrimary === Horizontal.right;
318
318
  isEffectiveAlignerX = isAligner && (hostLayout.alignerX === undefined ||
319
319
  element.index <= hostLayout.alignerX.index);
320
320
  if (hostLayout.alignerX === element) {
@@ -334,65 +334,65 @@ export class ElImpl {
334
334
  }
335
335
  switch (newPrimary) {
336
336
  default:
337
- case PosH.left:
337
+ case Horizontal.left:
338
338
  css.justifySelf = "start";
339
- if (oldPrimary === PosH.center) {
339
+ if (oldPrimary === Horizontal.center) {
340
340
  css.marginLeft = "";
341
341
  css.marginRight = "";
342
342
  }
343
- else if (oldPrimary === PosH.right)
343
+ else if (oldPrimary === Horizontal.right)
344
344
  css.marginLeft = "";
345
345
  break;
346
- case PosH.center:
346
+ case Horizontal.center:
347
347
  css.justifySelf = "center";
348
348
  if (hostLayout)
349
349
  css.marginLeft = isEffectiveAlignerX ? "auto" : "";
350
350
  css.marginRight = "auto";
351
351
  break;
352
- case PosH.right:
352
+ case Horizontal.right:
353
353
  css.justifySelf = "end";
354
354
  if (hostLayout)
355
355
  css.marginLeft = isEffectiveAlignerX ? "auto" : "";
356
- if (oldPrimary === PosH.center)
356
+ if (oldPrimary === Horizontal.center)
357
357
  css.marginRight = "";
358
358
  break;
359
- case PosH.stretch:
360
- case PosH.stretchAndFix:
359
+ case Horizontal.stretch:
360
+ case Horizontal.stretchAndFix:
361
361
  css.justifySelf = "stretch";
362
- if (oldPrimary === PosH.center) {
362
+ if (oldPrimary === Horizontal.center) {
363
363
  css.marginLeft = "";
364
364
  css.marginRight = "";
365
365
  }
366
- else if (oldPrimary === PosH.right)
366
+ else if (oldPrimary === Horizontal.right)
367
367
  css.marginLeft = "";
368
368
  break;
369
369
  }
370
370
  switch (newInside) {
371
371
  default:
372
- case PosH.left:
372
+ case Horizontal.left:
373
373
  css.alignItems = "start";
374
374
  css.textAlign = "left";
375
375
  break;
376
- case PosH.center:
376
+ case Horizontal.center:
377
377
  css.alignItems = "center";
378
378
  css.textAlign = "center";
379
379
  break;
380
- case PosH.right:
380
+ case Horizontal.right:
381
381
  css.alignItems = "end";
382
382
  css.textAlign = "right";
383
383
  break;
384
- case PosH.stretch:
385
- case PosH.stretchAndFix:
384
+ case Horizontal.stretch:
385
+ case Horizontal.stretchAndFix:
386
386
  css.alignItems = "stretch";
387
387
  css.textAlign = "justify";
388
388
  break;
389
389
  }
390
- if (newPrimary >= PosH.stretch && strength === undefined)
390
+ if (newPrimary >= Horizontal.stretch && strength === undefined)
391
391
  ElImpl.applyStretchingStrengthH(element, 0, 1);
392
392
  }
393
393
  static applyVertical(element, oldPrimary, newPrimary, oldInside, newInside, strength) {
394
- oldPrimary !== null && oldPrimary !== void 0 ? oldPrimary : (oldPrimary = PosV.top);
395
- newPrimary !== null && newPrimary !== void 0 ? newPrimary : (newPrimary = PosV.top);
394
+ oldPrimary !== null && oldPrimary !== void 0 ? oldPrimary : (oldPrimary = Vertical.top);
395
+ newPrimary !== null && newPrimary !== void 0 ? newPrimary : (newPrimary = Vertical.top);
396
396
  oldInside !== null && oldInside !== void 0 ? oldInside : (oldInside = oldPrimary);
397
397
  newInside !== null && newInside !== void 0 ? newInside : (newInside = newPrimary);
398
398
  const css = element.style;
@@ -407,10 +407,10 @@ export class ElImpl {
407
407
  }
408
408
  let isEffectiveAlignerY = false;
409
409
  if (hostLayout) {
410
- const isAligner = newPrimary === PosV.center ||
411
- newPrimary === PosV.bottom;
410
+ const isAligner = newPrimary === Vertical.center ||
411
+ newPrimary === Vertical.bottom;
412
412
  isEffectiveAlignerY = isAligner && (hostLayout.alignerY === undefined ||
413
- hostLayout.alignerY.vertical !== PosV.center);
413
+ hostLayout.alignerY.vertical !== Vertical.center);
414
414
  if (hostLayout.alignerY === element) {
415
415
  if (!isEffectiveAlignerY) {
416
416
  hostCss.marginTop = "";
@@ -425,37 +425,37 @@ export class ElImpl {
425
425
  }
426
426
  switch (newPrimary) {
427
427
  default:
428
- case PosV.top:
428
+ case Vertical.top:
429
429
  css.alignSelf = "start";
430
430
  break;
431
- case PosV.center:
431
+ case Vertical.center:
432
432
  css.alignSelf = "center";
433
433
  break;
434
- case PosV.bottom:
434
+ case Vertical.bottom:
435
435
  css.alignSelf = "end";
436
436
  break;
437
- case PosV.stretch:
438
- case PosV.stretchAndFix:
437
+ case Vertical.stretch:
438
+ case Vertical.stretchAndFix:
439
439
  css.alignSelf = "stretch";
440
440
  break;
441
441
  }
442
442
  switch (newInside) {
443
443
  default:
444
- case PosV.top:
444
+ case Vertical.top:
445
445
  css.justifyContent = "start";
446
446
  break;
447
- case PosV.center:
447
+ case Vertical.center:
448
448
  css.justifyContent = "center";
449
449
  break;
450
- case PosV.bottom:
450
+ case Vertical.bottom:
451
451
  css.justifyContent = "end";
452
452
  break;
453
- case PosV.stretch:
454
- case PosV.stretchAndFix:
453
+ case Vertical.stretch:
454
+ case Vertical.stretchAndFix:
455
455
  css.justifyContent = "stretch";
456
456
  break;
457
457
  }
458
- if (newPrimary >= PosV.stretch && strength === undefined)
458
+ if (newPrimary >= Vertical.stretch && strength === undefined)
459
459
  ElImpl.applyStretchingStrengthV(element, 0, 1);
460
460
  }
461
461
  static applyStretchingStrengthH(element, existing, value) {
@@ -521,7 +521,7 @@ export class ElImpl {
521
521
  }
522
522
  static applyOverlayVisible(element, value) {
523
523
  const s = element.style;
524
- const host = RxNode.findMatchingHost(element.node, n => n.element.native instanceof HTMLElement || n.element.native instanceof SVGElement);
524
+ const host = ReactiveNode.findMatchingHost(element.node, n => n.element.native instanceof HTMLElement || n.element.native instanceof SVGElement);
525
525
  const nativeHost = host === null || host === void 0 ? void 0 : host.element.native;
526
526
  if (value === true) {
527
527
  const doc = document.body;
package/build/dist/source/html/Elements.d.ts CHANGED
@@ -1,30 +1,30 @@
1
- import { RxNodeDecl, RxNodeDriver, RxNode, Script, Mode, MergedItem, ScriptAsync } from "reactronic";
1
+ import { ReactiveNodeDecl, ReactiveNodeDriver, ReactiveNode, Script, Mode, MergedItem, ScriptAsync } from "reactronic";
2
2
  import { CursorCommandDriver, El, ElPlace } from "./El.js";
3
3
  import { HtmlDriver } from "./HtmlDriver.js";
4
- export declare function Panel<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
5
- export declare function Panel<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
6
- export declare function Table<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
7
- export declare function Table<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
4
+ export declare function Panel<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
5
+ export declare function Panel<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
6
+ export declare function Table<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
7
+ export declare function Table<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
8
8
  export declare function row<T = void>(builder?: (element: void) => T, shiftCursorDown?: number): void;
9
- export declare function Splitter<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
10
- export declare function Splitter<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
9
+ export declare function Splitter<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
10
+ export declare function Splitter<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
11
11
  export declare function rowBreak(shiftCursorDown?: number): void;
12
- export declare function declareSplitter<T>(index: number, splitViewNode: RxNode<El<T>>): RxNode<El<HTMLElement>>;
12
+ export declare function declareSplitter<T>(index: number, splitViewNode: ReactiveNode<El<T>>): ReactiveNode<El<HTMLElement>>;
13
13
  export declare function cursor(areaParams: ElPlace): void;
14
- export declare function Note(content: string, formatted?: boolean, declaration?: RxNodeDecl<El<HTMLElement, void>>): RxNode<El<HTMLElement, void>>;
15
- export declare function Group<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
16
- export declare function Group<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
17
- export declare function Handling<M = unknown>(script: Script<El<void, M>>): RxNode<El<void, M>>;
18
- export declare function SyntheticElement<M = unknown>(script?: Script<El<void, M>>, scriptAsync?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, creation?: Script<El<void, M>>, creationAsync?: ScriptAsync<El<void, M>>, destruction?: Script<El<void, M>>, triggers?: unknown, basis?: RxNodeDecl<El<void, M>>): RxNode<El<void, M>>;
19
- export declare function SyntheticElement<M = unknown>(declaration?: RxNodeDecl<El<void, M>>): RxNode<El<void, M>>;
14
+ export declare function Note(content: string, formatted?: boolean, declaration?: ReactiveNodeDecl<El<HTMLElement, void>>): ReactiveNode<El<HTMLElement, void>>;
15
+ export declare function Group<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, creation?: Script<El<HTMLElement, M>>, creationAsync?: ScriptAsync<El<HTMLElement, M>>, destruction?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
16
+ export declare function Group<M = unknown>(declaration?: ReactiveNodeDecl<El<HTMLElement, M>>): ReactiveNode<El<HTMLElement, M>>;
17
+ export declare function Handling<M = unknown>(script: Script<El<void, M>>): ReactiveNode<El<void, M>>;
18
+ export declare function SyntheticElement<M = unknown>(script?: Script<El<void, M>>, scriptAsync?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, creation?: Script<El<void, M>>, creationAsync?: ScriptAsync<El<void, M>>, destruction?: Script<El<void, M>>, triggers?: unknown, basis?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
19
+ export declare function SyntheticElement<M = unknown>(declaration?: ReactiveNodeDecl<El<void, M>>): ReactiveNode<El<void, M>>;
20
20
  export declare class PanelDriver<T extends HTMLElement> extends HtmlDriver<T> {
21
- update(node: RxNode<El<T>>): void | Promise<void>;
22
- child(ownerNode: RxNode<El<T, any>>, childDriver: RxNodeDriver<any>, childDeclaration?: RxNodeDecl<any> | undefined, childBasis?: RxNodeDecl<any> | undefined): MergedItem<RxNode> | undefined;
21
+ update(node: ReactiveNode<El<T>>): void | Promise<void>;
22
+ child(ownerNode: ReactiveNode<El<T, any>>, childDriver: ReactiveNodeDriver<any>, childDeclaration?: ReactiveNodeDecl<any> | undefined, childBasis?: ReactiveNodeDecl<any> | undefined): MergedItem<ReactiveNode> | undefined;
23
23
  }
24
- export declare function isSplitViewPartition(childDriver: RxNodeDriver): boolean;
24
+ export declare function isSplitViewPartition(childDriver: ReactiveNodeDriver): boolean;
25
25
  export declare class PartitionDriver<T extends HTMLElement> extends HtmlDriver<T> {
26
- update(node: RxNode<El<T>>): void | Promise<void>;
27
- getHost(node: RxNode<El<T, any>>): RxNode<El<T, any>>;
26
+ update(node: ReactiveNode<El<T>>): void | Promise<void>;
27
+ getHost(node: ReactiveNode<El<T, any>>): ReactiveNode<El<T, any>>;
28
28
  }
29
29
  export declare const Drivers: {
30
30
  panel: PanelDriver<HTMLElement>;
@@ -35,5 +35,5 @@ export declare const Drivers: {
35
35
  wrapper: HtmlDriver<HTMLElement, any>;
36
36
  splitter: HtmlDriver<HTMLElement, any>;
37
37
  cursor: CursorCommandDriver;
38
- synthetic: RxNodeDriver<El<void, any>>;
38
+ synthetic: ReactiveNodeDriver<El<void, any>>;
39
39
  };
package/build/dist/source/html/Elements.js CHANGED
@@ -1,24 +1,24 @@
1
- import { RxNode, Mode, unobs } from "reactronic";
1
+ import { ReactiveNode, Mode, unobs } from "reactronic";
2
2
  import { Constants, CursorCommandDriver, ElKind, ElDriver, Direction, ElLayoutInfo, InitialElLayoutInfo } from "./El.js";
3
3
  import { getPrioritiesForEmptySpaceDistribution, getPrioritiesForSizeChanging, relayout, relayoutUsingSplitter } from "./SplitViewMath.js";
4
4
  import { Axis, BodyFontSize, Dimension, toPx } from "./Sizes.js";
5
5
  import { HtmlDriver } from "./HtmlDriver.js";
6
6
  import { clamp } from "./ElUtils.js";
7
7
  export function Panel(scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis) {
8
- return RxNode.declare(Drivers.panel, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
8
+ return ReactiveNode.declare(Drivers.panel, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
9
9
  }
10
10
  export function Table(scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis) {
11
- return RxNode.declare(Drivers.table, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
11
+ return ReactiveNode.declare(Drivers.table, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
12
12
  }
13
13
  export function row(builder, shiftCursorDown) {
14
14
  rowBreak(shiftCursorDown);
15
15
  builder === null || builder === void 0 ? void 0 : builder();
16
16
  }
17
17
  export function Splitter(scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis) {
18
- return RxNode.declare(Drivers.splitter, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
18
+ return ReactiveNode.declare(Drivers.splitter, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
19
19
  }
20
20
  export function rowBreak(shiftCursorDown) {
21
- RxNode.declare(Drivers.partition);
21
+ ReactiveNode.declare(Drivers.partition);
22
22
  }
23
23
  export function declareSplitter(index, splitViewNode) {
24
24
  const key = `splitter-${index}`;
@@ -74,14 +74,14 @@ export function declareSplitter(index, splitViewNode) {
74
74
  }));
75
75
  }
76
76
  export function cursor(areaParams) {
77
- RxNode.declare(Drivers.cursor, {
77
+ ReactiveNode.declare(Drivers.cursor, {
78
78
  script: el => {
79
79
  el.place = areaParams;
80
80
  },
81
81
  });
82
82
  }
83
83
  export function Note(content, formatted, declaration) {
84
- return RxNode.declare(Drivers.note, RxNode.rebased(declaration, {
84
+ return ReactiveNode.declare(Drivers.note, ReactiveNode.withBasis(declaration, {
85
85
  script: el => {
86
86
  if (formatted)
87
87
  el.native.innerHTML = content;
@@ -91,13 +91,13 @@ export function Note(content, formatted, declaration) {
91
91
  }));
92
92
  }
93
93
  export function Group(scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis) {
94
- return RxNode.declare(Drivers.group, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
94
+ return ReactiveNode.declare(Drivers.group, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
95
95
  }
96
96
  export function Handling(script) {
97
97
  return SyntheticElement({ mode: Mode.independentUpdate, script });
98
98
  }
99
99
  export function SyntheticElement(scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis) {
100
- return RxNode.declare(Drivers.synthetic, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
100
+ return ReactiveNode.declare(Drivers.synthetic, scriptOrDeclaration, scriptAsync, key, mode, creation, creationAsync, destruction, triggers, basis);
101
101
  }
102
102
  export class PanelDriver extends HtmlDriver {
103
103
  update(node) {
@@ -167,9 +167,9 @@ export class PanelDriver extends HtmlDriver {
167
167
  }
168
168
  },
169
169
  });
170
- RxNode.updateNestedNodesThenDo(() => {
170
+ ReactiveNode.updateNestedNodesThenDo(() => {
171
171
  layoutInfo.isUpdateFinished = true;
172
- RxNode.triggerUpdate(relayoutEl, { stamp: node.stamp });
172
+ ReactiveNode.triggerUpdate(relayoutEl, { stamp: node.stamp });
173
173
  });
174
174
  }
175
175
  return result;
@@ -226,7 +226,7 @@ export class PartitionDriver extends HtmlDriver {
226
226
  const ownerEl = node.owner.element;
227
227
  if (ownerEl.sealed !== undefined) {
228
228
  node.element.style.flexGrow = "1";
229
- RxNode.declare(Drivers.wrapper, {
229
+ ReactiveNode.declare(Drivers.wrapper, {
230
230
  script: el => {
231
231
  const ownerEl = el.node.owner.owner.element;
232
232
  if (ownerEl.splitView !== undefined) {
package/build/dist/source/html/Handlers.d.ts CHANGED
@@ -6,3 +6,10 @@ export declare function OnClick(target: HTMLElement, action: ((pointer: PointerS
6
6
  export declare function OnClickAsync(target: HTMLElement, action: ((pointer: PointerSensor) => Promise<void>) | ToggleRef | undefined, key?: string): void;
7
7
  export declare function OnResize(target: HTMLElement, action: ((element: ResizedElement) => void) | undefined, key?: string): void;
8
8
  export declare function OnFocus(target: HTMLElement, model: FocusModel, switchEditMode?: ((model: FocusModel) => void) | undefined, key?: string): void;
9
+ export type ResizeCallback = (width: number, height: number) => void;
10
+ export declare class ResizeData {
11
+ id: string;
12
+ handler?: ResizeCallback | undefined;
13
+ constructor(id: string, handler?: ResizeCallback | undefined);
14
+ }
15
+ export declare function prepareResizeHandler(action: ((width: number, height: number) => void) | ResizeData): (element: ResizedElement) => void;
package/build/dist/source/html/Handlers.js CHANGED
@@ -84,3 +84,18 @@ export function OnFocus(target, model, switchEditMode = undefined, key) {
84
84
  },
85
85
  });
86
86
  }
87
+ export class ResizeData {
88
+ constructor(id, handler) {
89
+ this.id = id;
90
+ this.handler = handler;
91
+ }
92
+ }
93
+ export function prepareResizeHandler(action) {
94
+ return (element) => {
95
+ const size = element.borderBoxSize[0];
96
+ if (action instanceof Function)
97
+ unobs(() => action(size.inlineSize, size.blockSize));
98
+ else if (action instanceof ResizeData && action.handler !== undefined)
99
+ unobs(() => action.handler(size.inlineSize, size.blockSize));
100
+ };
101
+ }
package/build/dist/source/html/HtmlDriver.d.ts CHANGED
@@ -1,24 +1,24 @@
1
- import { RxNode, Handler } from "reactronic";
1
+ import { ReactiveNode, Handler } from "reactronic";
2
2
  import { El, ElDriver } from "./El.js";
3
3
  export declare class WebDriver<T extends Element, M = unknown> extends ElDriver<T, M> {
4
- setNativeElement(node: RxNode<El<T, M>>): void;
5
- create(node: RxNode<El<T, M>>): void | Promise<void>;
6
- destroy(node: RxNode<El<T, M>>, isLeader: boolean): boolean;
7
- mount(node: RxNode<El<T, M>>): void;
8
- update(node: RxNode<El<T, M>>): void | Promise<void>;
9
- static findBrotherlyHost<T, R>(node: RxNode<El<T>>): RxNode<El<R>> | undefined;
10
- static findBrotherlyPrevSibling<T, R>(node: RxNode<El<T>>): RxNode<El<R>> | undefined;
4
+ setNativeElement(node: ReactiveNode<El<T, M>>): void;
5
+ create(node: ReactiveNode<El<T, M>>): void | Promise<void>;
6
+ destroy(node: ReactiveNode<El<T, M>>, isLeader: boolean): boolean;
7
+ mount(node: ReactiveNode<El<T, M>>): void;
8
+ update(node: ReactiveNode<El<T, M>>): void | Promise<void>;
9
+ static findBrotherlyHost<T, R>(node: ReactiveNode<El<T>>): ReactiveNode<El<R>> | undefined;
10
+ static findBrotherlyPrevSibling<T, R>(node: ReactiveNode<El<T>>): ReactiveNode<El<R>> | undefined;
11
11
  static get blinkingEffectMarker(): string | undefined;
12
12
  static set blinkingEffectMarker(value: string | undefined);
13
13
  }
14
14
  export declare class StaticDriver<T extends HTMLElement> extends WebDriver<T> {
15
15
  readonly native: T;
16
16
  constructor(native: T, name: string, isRow: boolean, initialize?: Handler<El<T>>);
17
- setNativeElement(node: RxNode<El<T>>): void;
17
+ setNativeElement(node: ReactiveNode<El<T>>): void;
18
18
  }
19
19
  export declare class HtmlDriver<T extends HTMLElement, M = any> extends WebDriver<T, M> {
20
- setNativeElement(node: RxNode<El<T, M>>): void;
20
+ setNativeElement(node: ReactiveNode<El<T, M>>): void;
21
21
  }
22
22
  export declare class SvgDriver<T extends SVGElement, M = any> extends WebDriver<T, M> {
23
- setNativeElement(node: RxNode<El<T, M>>): void;
23
+ setNativeElement(node: ReactiveNode<El<T, M>>): void;
24
24
  }