verstak 0.96.26028 → 0.96.26031

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.
@@ -1,10 +1,10 @@
1
1
  import { ReactiveTreeNode, setBasis } from "reactronic";
2
- import { Block, OnClick } from "verstak";
2
+ import { Element, OnClick } from "verstak";
3
3
  import { rxModel } from "./common/Utils.js";
4
4
  import { Theme } from "./Theme.js";
5
5
  import { Icon } from "./Icon.v.js";
6
6
  export function Button(declaration) {
7
- return (Block(setBasis(declaration, {
7
+ return (Element(setBasis(declaration, {
8
8
  preparation() {
9
9
  var _a;
10
10
  (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({
@@ -25,7 +25,7 @@ export function Button(declaration) {
25
25
  });
26
26
  }
27
27
  if (m.label) {
28
- Block({
28
+ Element({
29
29
  body(el, base) {
30
30
  base();
31
31
  this.textIsFormatted = false;
@@ -1,8 +1,8 @@
1
1
  import { setBasis } from "reactronic";
2
- import { Block } from "verstak";
2
+ import { Element } from "verstak";
3
3
  import { Theme } from "./Theme.js";
4
4
  export function Icon(name, declaration) {
5
- return (Block(setBasis(declaration, {
5
+ return (Element(setBasis(declaration, {
6
6
  signalArgs: { name },
7
7
  body() {
8
8
  const theme = Theme.current.icon;
@@ -1,8 +1,8 @@
1
1
  import { setBasis } from "reactronic";
2
- import { Block } from "verstak";
2
+ import { Element } from "verstak";
3
3
  import { rxModel } from "./common/Utils.js";
4
4
  export function Image(declaration) {
5
- return (Block(setBasis(declaration, {
5
+ return (Element(setBasis(declaration, {
6
6
  preparation() {
7
7
  var _a;
8
8
  (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({ source: undefined }));
@@ -1,10 +1,10 @@
1
1
  import { Mode, setBasis } from "reactronic";
2
- import { Block, OnFocus, rowBreak, Fragment, KeyboardModifiers, H, V } from "verstak";
2
+ import { Element, OnFocus, rowBreak, Fragment, KeyboardModifiers, H, V } from "verstak";
3
3
  import { rxModel } from "./common/Utils.js";
4
4
  import { Theme } from "./Theme.js";
5
5
  import { Icon } from "./Icon.v.js";
6
6
  export function Input(declaration) {
7
- return (Block(setBasis(declaration, {
7
+ return (Element(setBasis(declaration, {
8
8
  preparation() {
9
9
  var _a;
10
10
  (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = composeInputModel());
@@ -42,7 +42,7 @@ export function composeInputModel(props) {
42
42
  });
43
43
  }
44
44
  function InputField(model, styling) {
45
- return (Block({
45
+ return (Element({
46
46
  key: InputField.name,
47
47
  mode: Mode.primitive,
48
48
  preparation(el, base) {
@@ -79,7 +79,7 @@ function InputField(model, styling) {
79
79
  }));
80
80
  }
81
81
  function InputPopup(model, styling) {
82
- return (Block({
82
+ return (Element({
83
83
  key: InputPopup.name,
84
84
  mode: Mode.primitive,
85
85
  body() {
@@ -91,7 +91,7 @@ function InputPopup(model, styling) {
91
91
  if (options.length > 0) {
92
92
  for (const x of model.options) {
93
93
  rowBreak();
94
- Block({
94
+ Element({
95
95
  key: x,
96
96
  mode: Mode.primitive,
97
97
  preparation() {
@@ -102,7 +102,7 @@ function InputPopup(model, styling) {
102
102
  }
103
103
  }
104
104
  else
105
- Block({
105
+ Element({
106
106
  key: "(nothing)",
107
107
  mode: Mode.primitive,
108
108
  body() {
@@ -1,8 +1,8 @@
1
1
  import Md from "markdown-it";
2
2
  import * as prism from "prismjs";
3
- import { Block } from "verstak";
3
+ import { Element } from "verstak";
4
4
  export function Markdown(content) {
5
- return (Block({
5
+ return (Element({
6
6
  preparation(el, base) {
7
7
  this.contentWrapping = true;
8
8
  base();
@@ -1,8 +1,8 @@
1
1
  import { Mode, setBasis } from "reactronic";
2
- import { Block } from "verstak";
2
+ import { Element } from "verstak";
3
3
  import { rxModel } from "./common/Utils.js";
4
4
  export function Spinner(declaration) {
5
- return (Block(setBasis(declaration, {
5
+ return (Element(setBasis(declaration, {
6
6
  preparation() {
7
7
  var _a;
8
8
  (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = composeSpinnerModel());
@@ -10,7 +10,7 @@ export function Spinner(declaration) {
10
10
  body() {
11
11
  const m = this.model;
12
12
  if (m.active)
13
- Block({
13
+ Element({
14
14
  mode: Mode.primitive,
15
15
  body() {
16
16
  this.text = "loading...";
@@ -1,10 +1,10 @@
1
1
  import { ReactiveTreeNode, Mode, setBasis } from "reactronic";
2
- import { Block, OnClick } from "verstak";
2
+ import { Element, OnClick } from "verstak";
3
3
  import { rxModel } from "./common/Utils.js";
4
4
  import { Theme } from "./Theme.js";
5
5
  import { Icon } from "./Icon.v.js";
6
6
  export function Toggle(declaration) {
7
- return (Block(setBasis(declaration, {
7
+ return (Element(setBasis(declaration, {
8
8
  preparation() {
9
9
  var _a;
10
10
  (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({
@@ -27,7 +27,7 @@ export function Toggle(declaration) {
27
27
  },
28
28
  });
29
29
  if (m.label) {
30
- Block({
30
+ Element({
31
31
  mode: Mode.primitive,
32
32
  body(el, base) {
33
33
  base();
@@ -37,7 +37,7 @@ export type El<T = any, M = any> = {
37
37
  useStylingPreset(stylingPresetName: string, enabled?: boolean): void;
38
38
  };
39
39
  export declare enum ElKind {
40
- block = 0,
40
+ element = 0,
41
41
  table = 1,
42
42
  group = 2,
43
43
  partition = 3,
@@ -1,6 +1,6 @@
1
1
  export var ElKind;
2
2
  (function (ElKind) {
3
- ElKind[ElKind["block"] = 0] = "block";
3
+ ElKind[ElKind["element"] = 0] = "element";
4
4
  ElKind[ElKind["table"] = 1] = "table";
5
5
  ElKind[ElKind["group"] = 2] = "group";
6
6
  ElKind[ElKind["partition"] = 3] = "partition";
@@ -34,7 +34,7 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
34
34
  constructor(node: ReactiveTreeNode<El<T, M>>);
35
35
  prepareForUpdate(): void;
36
36
  get rank(): number;
37
- get isBlock(): boolean;
37
+ get isElement(): boolean;
38
38
  get isTable(): boolean;
39
39
  get isAuxiliary(): boolean;
40
40
  get kind(): ElKind;
@@ -50,7 +50,7 @@ export class ElImpl {
50
50
  this._hasStylingPresets = false;
51
51
  }
52
52
  get rank() { return this.node.rank; }
53
- get isBlock() { return this.kind === ElKind.block; }
53
+ get isElement() { return this.kind === ElKind.element; }
54
54
  get isTable() { return this.kind === ElKind.table; }
55
55
  get isAuxiliary() { return this.kind > ElKind.table; }
56
56
  get kind() { return this._kind; }
@@ -682,14 +682,14 @@ export const Constants = {
682
682
  wrapper: "wrapper",
683
683
  splitter: "splitter",
684
684
  group: "group",
685
- layouts: ["block", "table", "group", "", "", ""],
685
+ layouts: ["element", "table", "group", "", "", ""],
686
686
  keyAttrName: "key",
687
687
  kindAttrName: "kind",
688
688
  ownReactiveTreeNodeKey: Symbol("own-reactive-tree-node"),
689
689
  };
690
690
  const DriversByLayout = [
691
691
  el => {
692
- el.native.classList.add("v5k-block");
692
+ el.native.classList.add("v5k-element");
693
693
  },
694
694
  el => {
695
695
  el.native.classList.add("v5k-table");
@@ -4,8 +4,8 @@ import { CursorCommandDriver } from "./ElDriver.js";
4
4
  import { HtmlDriver } from "./WebDriver.js";
5
5
  export declare function ApplicationWindow(body?: Script<El<HTMLElement>>, bodyTask?: ScriptAsync<El<HTMLElement>>, key?: string, mode?: Mode, unmounted?: boolean, preparation?: Script<El<HTMLElement>>, preparationTask?: ScriptAsync<El<HTMLElement>>, mounting?: Script<El<HTMLElement>>, finalization?: Script<El<HTMLElement>>, signalArgs?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement>>): ReactiveTreeNode<El<HTMLElement>>;
6
6
  export declare function ApplicationWindow(declaration?: ReactiveTreeNodeDecl<El<HTMLElement>>): ReactiveTreeNode<El<HTMLElement>>;
7
- export declare function Block<M = unknown>(body?: Script<El<HTMLElement, M>>, bodyTask?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, unmounted?: boolean, preparation?: Script<El<HTMLElement, M>>, preparationTask?: ScriptAsync<El<HTMLElement, M>>, mounting?: Script<El<HTMLElement>>, finalization?: Script<El<HTMLElement, M>>, signalArgs?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
8
- export declare function Block<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
7
+ export declare function Element<M = unknown>(body?: Script<El<HTMLElement, M>>, bodyTask?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, unmounted?: boolean, preparation?: Script<El<HTMLElement, M>>, preparationTask?: ScriptAsync<El<HTMLElement, M>>, mounting?: Script<El<HTMLElement>>, finalization?: Script<El<HTMLElement, M>>, signalArgs?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
8
+ export declare function Element<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
9
9
  export declare function Table<M = unknown>(body?: Script<El<HTMLElement, M>>, bodyTask?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, unmounted?: boolean, preparation?: Script<El<HTMLElement, M>>, preparationTask?: ScriptAsync<El<HTMLElement, M>>, mounting?: Script<El<HTMLElement>>, finalization?: Script<El<HTMLElement, M>>, signalArgs?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
10
10
  export declare function Table<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
11
11
  export declare function row<T = void>(builder?: (element: void) => T, shiftCursorDown?: number): void;
@@ -18,12 +18,12 @@ export declare function Group<M = unknown>(body?: Script<El<HTMLElement, M>>, bo
18
18
  export declare function Group<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
19
19
  export declare function Fragment<M = unknown>(body?: Script<El<void, M>>, bodyTask?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, unmounted?: boolean, preparation?: Script<El<void, M>>, preparationTask?: ScriptAsync<El<void, M>>, mounting?: Script<El<void>>, finalization?: Script<El<void, M>>, signalArgs?: unknown, basis?: ReactiveTreeNodeDecl<El<void, M>>): ReactiveTreeNode<El<void, M>>;
20
20
  export declare function Fragment<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<void, M>>): ReactiveTreeNode<El<void, M>>;
21
- export declare class BlockDriver<T extends HTMLElement> extends HtmlDriver<T> {
21
+ export declare class ElementDriver<T extends HTMLElement> extends HtmlDriver<T> {
22
22
  rebuildBody(node: ReactiveTreeNode<El<T>>): void | Promise<void>;
23
23
  declareChild(ownerNode: ReactiveTreeNode<El<T, any>>, childDriver: ReactiveTreeNodeDriver<any>, childDeclaration?: ReactiveTreeNodeDecl<any> | undefined, childBasis?: ReactiveTreeNodeDecl<any> | undefined): LinkedItem<ReactiveTreeNode> | undefined;
24
24
  }
25
25
  export declare function isSplitViewPartition(childDriver: ReactiveTreeNodeDriver): boolean;
26
- export declare class StaticBlockDriver<T extends HTMLElement> extends BlockDriver<T> {
26
+ export declare class StaticElementDriver<T extends HTMLElement> extends ElementDriver<T> {
27
27
  readonly native: T;
28
28
  constructor(native: T, name: string, isPartition: boolean, initialize?: Handler<El<T>>);
29
29
  assignNativeElement(node: ReactiveTreeNode<El<T>>): void;
@@ -33,7 +33,7 @@ export declare class PartitionDriver<T extends HTMLElement> extends HtmlDriver<T
33
33
  provideHost(node: ReactiveTreeNode<El<T, any>>): ReactiveTreeNode<El<T, any>>;
34
34
  }
35
35
  export declare const Drivers: {
36
- block: BlockDriver<HTMLElement>;
36
+ element: ElementDriver<HTMLElement>;
37
37
  table: HtmlDriver<HTMLElement, any>;
38
38
  group: HtmlDriver<HTMLElement, any>;
39
39
  partition: PartitionDriver<HTMLElement>;
@@ -8,9 +8,9 @@ import { HtmlDriver } from "./WebDriver.js";
8
8
  export function ApplicationWindow(bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis) {
9
9
  acquireVerstakStyleSheet();
10
10
  const body = (document !== null && document !== void 0 ? document : global.document).body;
11
- const driver = new StaticBlockDriver(body, "Page", false, el => el.kind = ElKind.block);
11
+ const driver = new StaticElementDriver(body, "Page", false, el => el.kind = ElKind.element);
12
12
  body.classList.add("v5k-body");
13
- body.classList.add("v5k-block");
13
+ body.classList.add("v5k-element");
14
14
  return declare(driver, bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis);
15
15
  }
16
16
  function acquireVerstakStyleSheet() {
@@ -34,8 +34,8 @@ function findStyleByTitle(title) {
34
34
  }
35
35
  return undefined;
36
36
  }
37
- export function Block(bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis) {
38
- return declare(Drivers.block, bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis);
37
+ export function Element(bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis) {
38
+ return declare(Drivers.element, bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis);
39
39
  }
40
40
  export function Table(bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis) {
41
41
  return declare(Drivers.table, bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis);
@@ -117,7 +117,7 @@ export function Fragment(bodyOrDeclaration, bodyTask, key, mode, unmounted, prep
117
117
  mode = mode !== undefined ? mode | Mode.fragment : Mode.fragment;
118
118
  return declare(Drivers.fragment, bodyOrDeclaration, bodyTask, key, mode, unmounted, preparation, preparationTask, mounting, finalization, signalArgs, basis);
119
119
  }
120
- export class BlockDriver extends HtmlDriver {
120
+ export class ElementDriver extends HtmlDriver {
121
121
  rebuildBody(node) {
122
122
  const el = node.element;
123
123
  const result = super.rebuildBody(node);
@@ -238,7 +238,7 @@ function overrideMethod(declaration, method, func) {
238
238
  ? (el, base) => { baseScript.call(el, el, base); func.call(el, el); }
239
239
  : (el, base) => { base(); func.call(el, el); };
240
240
  }
241
- export class StaticBlockDriver extends BlockDriver {
241
+ export class StaticElementDriver extends ElementDriver {
242
242
  constructor(native, name, isPartition, initialize) {
243
243
  super(name, isPartition, initialize);
244
244
  this.native = native;
@@ -290,7 +290,7 @@ export class PartitionDriver extends HtmlDriver {
290
290
  }
291
291
  }
292
292
  export const Drivers = {
293
- block: new BlockDriver(Constants.element, false, el => el.kind = ElKind.block),
293
+ element: new ElementDriver(Constants.element, false, el => el.kind = ElKind.element),
294
294
  table: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.table),
295
295
  group: new HtmlDriver(Constants.group, false, el => el.kind = ElKind.group),
296
296
  partition: new PartitionDriver(Constants.partition, true, el => el.kind = ElKind.partition),
@@ -310,7 +310,7 @@ const VerstakStyleSheetCode = `
310
310
  box-sizing: border-box;
311
311
  }
312
312
 
313
- .v5k-block {
313
+ .v5k-element {
314
314
  display: flex;
315
315
  flex-direction: column;
316
316
  flex-shrink: 1;
@@ -318,7 +318,7 @@ const VerstakStyleSheetCode = `
318
318
  text-align: center;
319
319
  }
320
320
 
321
- .v5k-block > .v5k-part {
321
+ .v5k-element > .v5k-part {
322
322
  display: flex;
323
323
  flex-direction: row;
324
324
  justify-content: center;
@@ -327,72 +327,72 @@ const VerstakStyleSheetCode = `
327
327
 
328
328
  /* Children Alignment */
329
329
 
330
- .v5k-block.${StylingClassNameByAlignmentVertical[V.center]} {
330
+ .v5k-element.${StylingClassNameByAlignmentVertical[V.center]} {
331
331
  justify-content: center;
332
332
  }
333
333
 
334
- .v5k-block.${StylingClassNameByAlignmentVertical[V.top]} {
334
+ .v5k-element.${StylingClassNameByAlignmentVertical[V.top]} {
335
335
  justify-content: start;
336
336
  }
337
337
 
338
- .v5k-block.${StylingClassNameByAlignmentVertical[V.bottom]} {
338
+ .v5k-element.${StylingClassNameByAlignmentVertical[V.bottom]} {
339
339
  justify-content: end;
340
340
  }
341
341
 
342
- .v5k-block.${StylingClassNameByAlignmentVertical[V.stretch]} > .v5k-part,
343
- .v5k-block.${StylingClassNameByAlignmentVertical[V.stretchAndFix]} > .v5k-part {
342
+ .v5k-element.${StylingClassNameByAlignmentVertical[V.stretch]} > .v5k-part,
343
+ .v5k-element.${StylingClassNameByAlignmentVertical[V.stretchAndFix]} > .v5k-part {
344
344
  flex-grow: 1;
345
345
  align-items: stretch;
346
346
  }
347
347
 
348
- .v5k-block.${StylingClassNameByAlignmentVerticalRowWise[V.center]} > .v5k-part {
348
+ .v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.center]} > .v5k-part {
349
349
  align-items: center;
350
350
  }
351
351
 
352
- .v5k-block.${StylingClassNameByAlignmentVerticalRowWise[V.top]} > .v5k-part {
352
+ .v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.top]} > .v5k-part {
353
353
  align-items: start;
354
354
  }
355
355
 
356
- .v5k-block.${StylingClassNameByAlignmentVerticalRowWise[V.bottom]} > .v5k-part {
356
+ .v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.bottom]} > .v5k-part {
357
357
  align-items: end;
358
358
  }
359
359
 
360
- .v5k-block.${StylingClassNameByAlignmentVerticalRowWise[V.stretch]} > .v5k-part,
361
- .v5k-block.${StylingClassNameByAlignmentVerticalRowWise[V.stretchAndFix]} > .v5k-part {
360
+ .v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.stretch]} > .v5k-part,
361
+ .v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.stretchAndFix]} > .v5k-part {
362
362
  align-items: stretch;
363
363
  }
364
364
 
365
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.center]} {
365
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.center]} {
366
366
  text-align: center;
367
367
  }
368
368
 
369
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.center]} > .v5k-part {
369
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.center]} > .v5k-part {
370
370
  justify-content: center;
371
371
  }
372
372
 
373
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.left]} {
373
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.left]} {
374
374
  text-align: left;
375
375
  }
376
376
 
377
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.left]} > .v5k-part {
377
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.left]} > .v5k-part {
378
378
  justify-content: start;
379
379
  }
380
380
 
381
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.right]} {
381
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.right]} {
382
382
  text-align: right;
383
383
  }
384
384
 
385
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.right]} > .v5k-part {
385
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.right]} > .v5k-part {
386
386
  justify-content: end;
387
387
  }
388
388
 
389
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.stretch]},
390
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.stretchAndFix]} {
389
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretch]},
390
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretchAndFix]} {
391
391
  text-align: justify;
392
392
  }
393
393
 
394
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.stretch]} > .v5k-part > *,
395
- .v5k-block.${StylingClassNameByAlignmentHorizontal[H.stretchAndFix]} > .v5k-part > * {
394
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretch]} > .v5k-part > *,
395
+ .v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretchAndFix]} > .v5k-part > * {
396
396
  flex-grow: 1;
397
397
  }
398
398
 
@@ -418,37 +418,37 @@ const VerstakStyleSheetCode = `
418
418
 
419
419
  /* Self Alignment */
420
420
 
421
- .v5k-block.${StylingClassNameBySelfAlignmentVertical[V.center]} {
421
+ .v5k-element.${StylingClassNameBySelfAlignmentVertical[V.center]} {
422
422
  align-self: center;
423
423
  }
424
424
 
425
- .v5k-block.${StylingClassNameBySelfAlignmentVertical[V.top]} {
425
+ .v5k-element.${StylingClassNameBySelfAlignmentVertical[V.top]} {
426
426
  align-self: start;
427
427
  }
428
428
 
429
- .v5k-block.${StylingClassNameBySelfAlignmentVertical[V.bottom]} {
429
+ .v5k-element.${StylingClassNameBySelfAlignmentVertical[V.bottom]} {
430
430
  align-self: end;
431
431
  }
432
432
 
433
- .v5k-block.${StylingClassNameBySelfAlignmentVertical[V.stretch]},
434
- .v5k-block.${StylingClassNameBySelfAlignmentVertical[V.stretchAndFix]} {
433
+ .v5k-element.${StylingClassNameBySelfAlignmentVertical[V.stretch]},
434
+ .v5k-element.${StylingClassNameBySelfAlignmentVertical[V.stretchAndFix]} {
435
435
  align-self: stretch;
436
436
  }
437
437
 
438
- .v5k-block.${StylingClassNameBySelfAlignmentHorizontal[H.center]} {
438
+ .v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.center]} {
439
439
  justify-self: center;
440
440
  }
441
441
 
442
- .v5k-block.${StylingClassNameBySelfAlignmentHorizontal[H.left]} {
442
+ .v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.left]} {
443
443
  justify-self: start;
444
444
  }
445
445
 
446
- .v5k-block.${StylingClassNameBySelfAlignmentHorizontal[H.right]} {
446
+ .v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.right]} {
447
447
  justify-self: end;
448
448
  }
449
449
 
450
- .v5k-block.${StylingClassNameBySelfAlignmentHorizontal[H.stretch]},
451
- .v5k-block.${StylingClassNameBySelfAlignmentHorizontal[H.stretchAndFix]} {
450
+ .v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.stretch]},
451
+ .v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.stretchAndFix]} {
452
452
  flex-grow: 1;
453
453
  justify-self: stretch;
454
454
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "verstak",
3
- "version": "0.96.26028",
3
+ "version": "0.96.26031",
4
4
  "description": "Verstak - Front-End Library",
5
5
  "publisher": "Nezaboodka Software",
6
6
  "license": "Apache-2.0",
@@ -42,7 +42,7 @@
42
42
  "markdown-it": "^14.1.0",
43
43
  "markdown-it-prism": "^2.3.0",
44
44
  "prismjs": "^1.30.0",
45
- "reactronic": "^0.96.26028"
45
+ "reactronic": "^0.96.26031"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@types/markdown-it": "14.1.2",