verstak 0.96.26029 → 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.
- package/build/dist/source/components/Button.v.js +3 -3
- package/build/dist/source/components/Icon.v.js +2 -2
- package/build/dist/source/components/Image.v.js +2 -2
- package/build/dist/source/components/Input.v.js +6 -6
- package/build/dist/source/components/Markdown.v.js +2 -2
- package/build/dist/source/components/Spinner.v.js +3 -3
- package/build/dist/source/components/Toggle.v.js +3 -3
- package/build/dist/source/core/El.d.ts +1 -1
- package/build/dist/source/core/El.js +1 -1
- package/build/dist/source/core/ElDriver.d.ts +1 -1
- package/build/dist/source/core/ElDriver.js +3 -3
- package/build/dist/source/core/Elements.d.ts +5 -5
- package/build/dist/source/core/Elements.js +39 -39
- package/package.json +2 -2
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { ReactiveTreeNode, setBasis } from "reactronic";
|
|
2
|
-
import {
|
|
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 (
|
|
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
|
-
|
|
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 {
|
|
2
|
+
import { Element } from "verstak";
|
|
3
3
|
import { Theme } from "./Theme.js";
|
|
4
4
|
export function Icon(name, declaration) {
|
|
5
|
-
return (
|
|
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 {
|
|
2
|
+
import { Element } from "verstak";
|
|
3
3
|
import { rxModel } from "./common/Utils.js";
|
|
4
4
|
export function Image(declaration) {
|
|
5
|
-
return (
|
|
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 {
|
|
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 (
|
|
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 (
|
|
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 (
|
|
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
|
-
|
|
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
|
-
|
|
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 {
|
|
3
|
+
import { Element } from "verstak";
|
|
4
4
|
export function Markdown(content) {
|
|
5
|
-
return (
|
|
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 {
|
|
2
|
+
import { Element } from "verstak";
|
|
3
3
|
import { rxModel } from "./common/Utils.js";
|
|
4
4
|
export function Spinner(declaration) {
|
|
5
|
-
return (
|
|
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
|
-
|
|
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 {
|
|
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 (
|
|
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
|
-
|
|
30
|
+
Element({
|
|
31
31
|
mode: Mode.primitive,
|
|
32
32
|
body(el, base) {
|
|
33
33
|
base();
|
|
@@ -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
|
|
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
|
|
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: ["
|
|
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-
|
|
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
|
|
8
|
-
export declare function
|
|
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
|
|
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
|
|
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
|
-
|
|
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
|
|
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-
|
|
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
|
|
38
|
-
return declare(Drivers.
|
|
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
|
|
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
|
|
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
|
-
|
|
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-
|
|
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-
|
|
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-
|
|
330
|
+
.v5k-element.${StylingClassNameByAlignmentVertical[V.center]} {
|
|
331
331
|
justify-content: center;
|
|
332
332
|
}
|
|
333
333
|
|
|
334
|
-
.v5k-
|
|
334
|
+
.v5k-element.${StylingClassNameByAlignmentVertical[V.top]} {
|
|
335
335
|
justify-content: start;
|
|
336
336
|
}
|
|
337
337
|
|
|
338
|
-
.v5k-
|
|
338
|
+
.v5k-element.${StylingClassNameByAlignmentVertical[V.bottom]} {
|
|
339
339
|
justify-content: end;
|
|
340
340
|
}
|
|
341
341
|
|
|
342
|
-
.v5k-
|
|
343
|
-
.v5k-
|
|
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-
|
|
348
|
+
.v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.center]} > .v5k-part {
|
|
349
349
|
align-items: center;
|
|
350
350
|
}
|
|
351
351
|
|
|
352
|
-
.v5k-
|
|
352
|
+
.v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.top]} > .v5k-part {
|
|
353
353
|
align-items: start;
|
|
354
354
|
}
|
|
355
355
|
|
|
356
|
-
.v5k-
|
|
356
|
+
.v5k-element.${StylingClassNameByAlignmentVerticalRowWise[V.bottom]} > .v5k-part {
|
|
357
357
|
align-items: end;
|
|
358
358
|
}
|
|
359
359
|
|
|
360
|
-
.v5k-
|
|
361
|
-
.v5k-
|
|
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-
|
|
365
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.center]} {
|
|
366
366
|
text-align: center;
|
|
367
367
|
}
|
|
368
368
|
|
|
369
|
-
.v5k-
|
|
369
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.center]} > .v5k-part {
|
|
370
370
|
justify-content: center;
|
|
371
371
|
}
|
|
372
372
|
|
|
373
|
-
.v5k-
|
|
373
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.left]} {
|
|
374
374
|
text-align: left;
|
|
375
375
|
}
|
|
376
376
|
|
|
377
|
-
.v5k-
|
|
377
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.left]} > .v5k-part {
|
|
378
378
|
justify-content: start;
|
|
379
379
|
}
|
|
380
380
|
|
|
381
|
-
.v5k-
|
|
381
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.right]} {
|
|
382
382
|
text-align: right;
|
|
383
383
|
}
|
|
384
384
|
|
|
385
|
-
.v5k-
|
|
385
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.right]} > .v5k-part {
|
|
386
386
|
justify-content: end;
|
|
387
387
|
}
|
|
388
388
|
|
|
389
|
-
.v5k-
|
|
390
|
-
.v5k-
|
|
389
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretch]},
|
|
390
|
+
.v5k-element.${StylingClassNameByAlignmentHorizontal[H.stretchAndFix]} {
|
|
391
391
|
text-align: justify;
|
|
392
392
|
}
|
|
393
393
|
|
|
394
|
-
.v5k-
|
|
395
|
-
.v5k-
|
|
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-
|
|
421
|
+
.v5k-element.${StylingClassNameBySelfAlignmentVertical[V.center]} {
|
|
422
422
|
align-self: center;
|
|
423
423
|
}
|
|
424
424
|
|
|
425
|
-
.v5k-
|
|
425
|
+
.v5k-element.${StylingClassNameBySelfAlignmentVertical[V.top]} {
|
|
426
426
|
align-self: start;
|
|
427
427
|
}
|
|
428
428
|
|
|
429
|
-
.v5k-
|
|
429
|
+
.v5k-element.${StylingClassNameBySelfAlignmentVertical[V.bottom]} {
|
|
430
430
|
align-self: end;
|
|
431
431
|
}
|
|
432
432
|
|
|
433
|
-
.v5k-
|
|
434
|
-
.v5k-
|
|
433
|
+
.v5k-element.${StylingClassNameBySelfAlignmentVertical[V.stretch]},
|
|
434
|
+
.v5k-element.${StylingClassNameBySelfAlignmentVertical[V.stretchAndFix]} {
|
|
435
435
|
align-self: stretch;
|
|
436
436
|
}
|
|
437
437
|
|
|
438
|
-
.v5k-
|
|
438
|
+
.v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.center]} {
|
|
439
439
|
justify-self: center;
|
|
440
440
|
}
|
|
441
441
|
|
|
442
|
-
.v5k-
|
|
442
|
+
.v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.left]} {
|
|
443
443
|
justify-self: start;
|
|
444
444
|
}
|
|
445
445
|
|
|
446
|
-
.v5k-
|
|
446
|
+
.v5k-element.${StylingClassNameBySelfAlignmentHorizontal[H.right]} {
|
|
447
447
|
justify-self: end;
|
|
448
448
|
}
|
|
449
449
|
|
|
450
|
-
.v5k-
|
|
451
|
-
.v5k-
|
|
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.
|
|
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.
|
|
45
|
+
"reactronic": "^0.96.26031"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@types/markdown-it": "14.1.2",
|