@motionscript/grids 0.1.0-alpha.5 → 0.1.0-alpha.6
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/CHANGELOG.md +22 -0
- package/README.md +47 -15
- package/dist/browser/chunks/chunk-J62D7EFZ.js +2 -0
- package/dist/browser/chunks/chunk-J62D7EFZ.js.map +7 -0
- package/dist/browser/index.js +1 -1
- package/dist/browser/index.js.map +3 -3
- package/dist/browser/kit.js +1 -1
- package/dist/browser/manifest.json +1 -1
- package/dist/engine.d.ts +4 -4
- package/dist/engine.js +4 -4
- package/dist/engine.js.map +1 -1
- package/dist/kit/index.d.ts +3 -1
- package/dist/kit/index.d.ts.map +1 -1
- package/dist/kit/index.js +4 -1
- package/dist/kit/index.js.map +1 -1
- package/dist/kit/item-grid.d.ts +203 -198
- package/dist/kit/item-grid.d.ts.map +1 -1
- package/dist/kit/item-grid.js +413 -440
- package/dist/kit/item-grid.js.map +1 -1
- package/dist/nodes.d.ts +8 -3
- package/dist/nodes.d.ts.map +1 -1
- package/dist/nodes.js +6 -10
- package/dist/nodes.js.map +1 -1
- package/dist/path-grid/path-grid.d.ts +108 -73
- package/dist/path-grid/path-grid.d.ts.map +1 -1
- package/dist/path-grid/path-grid.js +129 -172
- package/dist/path-grid/path-grid.js.map +1 -1
- package/dist/radial-grid/radial-grid.d.ts +97 -45
- package/dist/radial-grid/radial-grid.d.ts.map +1 -1
- package/dist/radial-grid/radial-grid.js +55 -87
- package/dist/radial-grid/radial-grid.js.map +1 -1
- package/dist/rectangular-grid/rectangular-grid.d.ts +114 -70
- package/dist/rectangular-grid/rectangular-grid.d.ts.map +1 -1
- package/dist/rectangular-grid/rectangular-grid.js +107 -145
- package/dist/rectangular-grid/rectangular-grid.js.map +1 -1
- package/dist/sphere-grid/sphere-grid.d.ts +109 -60
- package/dist/sphere-grid/sphere-grid.d.ts.map +1 -1
- package/dist/sphere-grid/sphere-grid.js +90 -137
- package/dist/sphere-grid/sphere-grid.js.map +1 -1
- package/package.json +4 -4
- package/src/engine.ts +4 -4
- package/src/kit/index.ts +13 -1
- package/src/kit/item-grid.ts +505 -442
- package/src/nodes.ts +18 -3
- package/src/path-grid/path-grid.ts +137 -164
- package/src/radial-grid/radial-grid.ts +69 -78
- package/src/rectangular-grid/rectangular-grid.ts +118 -133
- package/src/sphere-grid/sphere-grid.ts +103 -117
- package/dist/browser/chunks/chunk-XDUDKWM7.js +0 -2
- package/dist/browser/chunks/chunk-XDUDKWM7.js.map +0 -7
|
@@ -1,95 +1,63 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import { component2d, Types, } from "@motionscript/sdk";
|
|
2
|
+
import { ItemGrid, normalizeOrder, RADIAL_DIRECTIONS, radialTurnToTop } from "../kit/index.js";
|
|
3
|
+
const own = {
|
|
4
|
+
radius: Types.number(200, { min: 0, step: 1 }),
|
|
5
|
+
startAngle: Types.number(0, { step: 1, unit: "°" }),
|
|
6
|
+
sweep: Types.number(360, { min: -360, max: 360, step: 1, unit: "°" }),
|
|
7
|
+
direction: Types.oneOf(RADIAL_DIRECTIONS, { default: "clockwise" }),
|
|
8
|
+
rotateItems: false,
|
|
9
|
+
spinSpeed: Types.number(0, { step: 1, unit: "°/s" }),
|
|
6
10
|
};
|
|
7
|
-
|
|
8
|
-
|
|
11
|
+
function arrangement(s) {
|
|
12
|
+
return {
|
|
13
|
+
kind: "radial",
|
|
14
|
+
radius: s.radius,
|
|
15
|
+
startAngle: s.startAngle,
|
|
16
|
+
sweep: s.sweep,
|
|
17
|
+
direction: s.direction,
|
|
18
|
+
rotateItems: s.rotateItems,
|
|
19
|
+
spinSpeed: s.spinSpeed,
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
const arranger = { arrangement };
|
|
9
23
|
/**
|
|
10
24
|
* Children round a circle, or along an arc of one.
|
|
11
25
|
*
|
|
12
26
|
* A full circle spaces the items evenly with none on top of another; an arc
|
|
13
|
-
* puts one at each end. Angles run clockwise from twelve o'clock, so
|
|
14
|
-
*
|
|
27
|
+
* puts one at each end. Angles run clockwise from twelve o'clock, so `turnTo`
|
|
28
|
+
* can bring any item to the top like a dial.
|
|
15
29
|
*/
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
sweep:
|
|
45
|
-
direction: this.direction,
|
|
46
|
-
rotateItems: this.rotateItems,
|
|
47
|
-
spinSpeed: this.spinSpeed,
|
|
48
|
-
};
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
__decorate([
|
|
52
|
-
property({ default: 200, min: 0, step: 1 })
|
|
53
|
-
], RadialGrid.prototype, "radius", void 0);
|
|
54
|
-
__decorate([
|
|
55
|
-
property({ default: 0, step: 1, unit: "°" })
|
|
56
|
-
], RadialGrid.prototype, "startAngle", void 0);
|
|
57
|
-
__decorate([
|
|
58
|
-
property({ default: 360, min: -360, max: 360, step: 1, unit: "°" })
|
|
59
|
-
], RadialGrid.prototype, "sweep", void 0);
|
|
60
|
-
__decorate([
|
|
61
|
-
property({ default: "clockwise", kind: "enum", options: RADIAL_DIRECTIONS })
|
|
62
|
-
], RadialGrid.prototype, "direction", void 0);
|
|
63
|
-
__decorate([
|
|
64
|
-
property({ default: false })
|
|
65
|
-
], RadialGrid.prototype, "rotateItems", void 0);
|
|
66
|
-
__decorate([
|
|
67
|
-
property({ default: 0, step: 1, unit: "°/s" })
|
|
68
|
-
], RadialGrid.prototype, "spinSpeed", void 0);
|
|
69
|
-
__decorate([
|
|
70
|
-
command({ args: [{ key: "degrees", step: 15, unit: "°", default: 360 }] })
|
|
71
|
-
], RadialGrid.prototype, "spin", null);
|
|
72
|
-
__decorate([
|
|
73
|
-
command({ args: [{ key: "item", min: 0, step: 1, default: 0 }] })
|
|
74
|
-
], RadialGrid.prototype, "turnTo", null);
|
|
75
|
-
__decorate([
|
|
76
|
-
command({ args: [{ key: "radius", min: 0, default: 280 }] })
|
|
77
|
-
], RadialGrid.prototype, "radiusTo", null);
|
|
78
|
-
__decorate([
|
|
79
|
-
command({ args: [{ key: "sweep", min: -360, max: 360, unit: "°", default: 360 }] })
|
|
80
|
-
], RadialGrid.prototype, "sweepTo", null);
|
|
81
|
-
RadialGrid = __decorate([
|
|
82
|
-
node({
|
|
83
|
-
key: "radialGrid",
|
|
84
|
-
parentKey: "node",
|
|
85
|
-
forkable: true,
|
|
86
|
-
layout: {
|
|
87
|
-
children: "freeform",
|
|
88
|
-
acceptsChildren: true,
|
|
89
|
-
defaultWidthMode: "hug",
|
|
90
|
-
defaultHeightMode: "hug",
|
|
30
|
+
export const RadialGrid = ItemGrid.define(component2d({
|
|
31
|
+
key: "radialGrid",
|
|
32
|
+
state: { ...ItemGrid.state, ...own },
|
|
33
|
+
defaults: ItemGrid.defaults,
|
|
34
|
+
commands: {
|
|
35
|
+
...ItemGrid.commands,
|
|
36
|
+
/** Orbit the items round the centre by `degrees` — `360` is one full turn. */
|
|
37
|
+
spin: {
|
|
38
|
+
args: { degrees: Types.number(360, { step: 15, unit: "°" }) },
|
|
39
|
+
run: (timeline, s) => timeline.tween({ startAngle: s.startAngle + (timeline.args.degrees ?? 360) }),
|
|
40
|
+
},
|
|
41
|
+
/** Turn the ring the shorter way round until an item (by its place in the layers) sits at the top. */
|
|
42
|
+
turnTo: {
|
|
43
|
+
args: { item: Types.number(0, { min: 0, step: 1 }) },
|
|
44
|
+
run: (timeline, s, children) => {
|
|
45
|
+
const count = children.length;
|
|
46
|
+
const slot = normalizeOrder(s.order, count).indexOf(Math.round(timeline.args.item ?? 0));
|
|
47
|
+
const turn = slot < 0 ? 0 : radialTurnToTop(arrangement(s), count, slot);
|
|
48
|
+
return timeline.tween({ startAngle: s.startAngle + turn });
|
|
49
|
+
},
|
|
50
|
+
},
|
|
51
|
+
radiusTo: {
|
|
52
|
+
args: { radius: ItemGrid.hinted(280, { min: 0 }) },
|
|
53
|
+
run: (timeline, s) => timeline.tween({ radius: timeline.args.radius ?? s.radius }),
|
|
54
|
+
},
|
|
55
|
+
/** Open or close the arc like a fan — from `0` to `360` is a reveal of its own. */
|
|
56
|
+
sweepTo: {
|
|
57
|
+
args: { sweep: ItemGrid.hinted(360, { min: -360, max: 360, unit: "°" }) },
|
|
58
|
+
run: (timeline, s) => timeline.tween({ sweep: timeline.args.sweep ?? s.sweep }),
|
|
91
59
|
},
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
|
|
60
|
+
},
|
|
61
|
+
...ItemGrid.fields(arranger),
|
|
62
|
+
}), arranger);
|
|
95
63
|
//# sourceMappingURL=radial-grid.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radial-grid.js","sourceRoot":"","sources":["../../src/radial-grid/radial-grid.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"radial-grid.js","sourceRoot":"","sources":["../../src/radial-grid/radial-grid.ts"],"names":[],"mappings":"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","sourcesContent":["import {\r\n component2d,\r\n Types,\r\n type NodeOf,\r\n type Values,\r\n // Named so the emitted declaration reaches these through the sdk, not core.\r\n type Node2D as _Node2D,\r\n type Node2DProps as _Node2DProps,\r\n} from \"@motionscript/sdk\"\r\n\r\nimport { ItemGrid, normalizeOrder, RADIAL_DIRECTIONS, radialTurnToTop, type RadialArrangement } from \"../kit\"\r\n\r\nconst own = {\r\n radius: Types.number(200, { min: 0, step: 1 }),\r\n startAngle: Types.number(0, { step: 1, unit: \"°\" }),\r\n sweep: Types.number(360, { min: -360, max: 360, step: 1, unit: \"°\" }),\r\n direction: Types.oneOf(RADIAL_DIRECTIONS, { default: \"clockwise\" }),\r\n rotateItems: false,\r\n spinSpeed: Types.number(0, { step: 1, unit: \"°/s\" }),\r\n}\r\n\r\ntype Own = Values<typeof own>\r\n\r\nfunction arrangement(s: Own): RadialArrangement {\r\n return {\r\n kind: \"radial\",\r\n radius: s.radius,\r\n startAngle: s.startAngle,\r\n sweep: s.sweep,\r\n direction: s.direction,\r\n rotateItems: s.rotateItems,\r\n spinSpeed: s.spinSpeed,\r\n }\r\n}\r\n\r\nconst arranger: ItemGrid.Arranger<Own> = { arrangement }\r\n\r\n/**\r\n * Children round a circle, or along an arc of one.\r\n *\r\n * A full circle spaces the items evenly with none on top of another; an arc\r\n * puts one at each end. Angles run clockwise from twelve o'clock, so `turnTo`\r\n * can bring any item to the top like a dial.\r\n */\r\nexport const RadialGrid = ItemGrid.define(component2d({\r\n key: \"radialGrid\",\r\n state: { ...ItemGrid.state, ...own },\r\n defaults: ItemGrid.defaults,\r\n commands: {\r\n ...ItemGrid.commands,\r\n /** Orbit the items round the centre by `degrees` — `360` is one full turn. */\r\n spin: {\r\n args: { degrees: Types.number(360, { step: 15, unit: \"°\" }) },\r\n run: (timeline, s) => timeline.tween({ startAngle: s.startAngle + (timeline.args.degrees ?? 360) }),\r\n },\r\n /** Turn the ring the shorter way round until an item (by its place in the layers) sits at the top. */\r\n turnTo: {\r\n args: { item: Types.number(0, { min: 0, step: 1 }) },\r\n run: (timeline, s, children) => {\r\n const count = children.length\r\n const slot = normalizeOrder(s.order, count).indexOf(Math.round(timeline.args.item ?? 0))\r\n const turn = slot < 0 ? 0 : radialTurnToTop(arrangement(s), count, slot)\r\n return timeline.tween({ startAngle: s.startAngle + turn })\r\n },\r\n },\r\n radiusTo: {\r\n args: { radius: ItemGrid.hinted(280, { min: 0 }) },\r\n run: (timeline, s) => timeline.tween({ radius: timeline.args.radius ?? s.radius }),\r\n },\r\n /** Open or close the arc like a fan — from `0` to `360` is a reveal of its own. */\r\n sweepTo: {\r\n args: { sweep: ItemGrid.hinted(360, { min: -360, max: 360, unit: \"°\" }) },\r\n run: (timeline, s) => timeline.tween({ sweep: timeline.args.sweep ?? s.sweep }),\r\n },\r\n },\r\n ...ItemGrid.fields(arranger),\r\n}), arranger)\r\n\r\nexport type RadialGrid = NodeOf<typeof RadialGrid>\r\n/** What a call or a document row may set. */\r\nexport type RadialGridProps = NonNullable<Parameters<typeof RadialGrid>[0]>\r\n"]}
|
|
@@ -1,17 +1,5 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
import { ItemGrid
|
|
3
|
-
export interface RectangularGridProps extends ItemGridProps {
|
|
4
|
-
columns: number;
|
|
5
|
-
fillDirection: FillDirection;
|
|
6
|
-
cellMode: CellMode;
|
|
7
|
-
cellWidth: number;
|
|
8
|
-
cellHeight: number;
|
|
9
|
-
columnGap: number;
|
|
10
|
-
rowGap: number;
|
|
11
|
-
lastLineAlign: LineAlign;
|
|
12
|
-
rowOffset: number;
|
|
13
|
-
columnOffset: number;
|
|
14
|
-
}
|
|
1
|
+
import { type NodeOf, type Node2D as _Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
|
|
2
|
+
import { ItemGrid } from "../kit/index.js";
|
|
15
3
|
/**
|
|
16
4
|
* Children in rows and columns — the grid the other three are variations on.
|
|
17
5
|
*
|
|
@@ -20,60 +8,116 @@ export interface RectangularGridProps extends ItemGridProps {
|
|
|
20
8
|
* room a child set to fill grows into. Shift every other row by half a cell
|
|
21
9
|
* for a brick bond or a hex pack.
|
|
22
10
|
*/
|
|
23
|
-
export declare
|
|
24
|
-
columns: number
|
|
25
|
-
fillDirection:
|
|
26
|
-
cellMode:
|
|
27
|
-
cellWidth: number
|
|
28
|
-
cellHeight: number
|
|
29
|
-
columnGap: number
|
|
30
|
-
rowGap: number
|
|
31
|
-
lastLineAlign:
|
|
32
|
-
rowOffset: number
|
|
33
|
-
columnOffset: number
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
dim
|
|
63
|
-
grow
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
11
|
+
export declare const RectangularGrid: import("@motionscript/sdk").Component<"rectangularGrid", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
|
|
12
|
+
readonly columns: import("@motionscript/sdk").Type<number, number, false>;
|
|
13
|
+
readonly fillDirection: import("@motionscript/sdk").Type<"row" | "column", "row" | "column", false>;
|
|
14
|
+
readonly cellMode: import("@motionscript/sdk").Type<"fixed" | "fit" | "fill", "fixed" | "fit" | "fill", false>;
|
|
15
|
+
readonly cellWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
16
|
+
readonly cellHeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
17
|
+
readonly columnGap: import("@motionscript/sdk").Type<number, number, false>;
|
|
18
|
+
readonly rowGap: import("@motionscript/sdk").Type<number, number, false>;
|
|
19
|
+
readonly lastLineAlign: import("@motionscript/sdk").Type<"start" | "center" | "end", "start" | "center" | "end", false>;
|
|
20
|
+
readonly rowOffset: import("@motionscript/sdk").Type<number, number, false>;
|
|
21
|
+
readonly columnOffset: import("@motionscript/sdk").Type<number, number, false>;
|
|
22
|
+
readonly order: import("@motionscript/sdk").Type<number[], number[], false>;
|
|
23
|
+
readonly spread: import("@motionscript/sdk").Type<number, number, false>;
|
|
24
|
+
readonly arrangeLike: import("@motionscript/sdk").Type<string, import("@motionscript/sdk").NodeView<import("@motionscript/sdk").Element<string, unknown, unknown>> | null, false>;
|
|
25
|
+
readonly revealState: import("@motionscript/sdk").Type<import("../index.js").RevealState | null | undefined, import("../index.js").RevealState | null | undefined, false>;
|
|
26
|
+
readonly waveState: import("@motionscript/sdk").Type<import("../index.js").WaveState | null | undefined, import("../index.js").WaveState | null | undefined, false>;
|
|
27
|
+
readonly focusState: import("@motionscript/sdk").Type<import("../index.js").FocusState | null | undefined, import("../index.js").FocusState | null | undefined, false>;
|
|
28
|
+
readonly transition: import("@motionscript/sdk").Type<ItemGrid.GridTransition | null | undefined, ItemGrid.GridTransition | null | undefined, false>;
|
|
29
|
+
readonly transitionSource: import("@motionscript/sdk").Type<string, import("@motionscript/sdk").NodeView<import("@motionscript/sdk").Element<string, unknown, unknown>> | null, true>;
|
|
30
|
+
}>, {
|
|
31
|
+
readonly columnsTo: {
|
|
32
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
33
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
34
|
+
readonly columns: import("@motionscript/sdk").Type<4 | undefined, 4 | undefined, false>;
|
|
35
|
+
};
|
|
36
|
+
readonly gapTo: {
|
|
37
|
+
readonly columnGap: import("@motionscript/sdk").Type<48 | undefined, 48 | undefined, false>;
|
|
38
|
+
readonly rowGap: import("@motionscript/sdk").Type<48 | undefined, 48 | undefined, false>;
|
|
39
|
+
};
|
|
40
|
+
readonly cellSizeTo: {
|
|
41
|
+
readonly cellWidth: import("@motionscript/sdk").Type<160 | undefined, 160 | undefined, false>;
|
|
42
|
+
readonly cellHeight: import("@motionscript/sdk").Type<160 | undefined, 160 | undefined, false>;
|
|
43
|
+
};
|
|
44
|
+
readonly focusRow: {
|
|
45
|
+
readonly dim: import("@motionscript/sdk").Type<number, number, false>;
|
|
46
|
+
readonly grow: import("@motionscript/sdk").Type<0.1 | undefined, 0.1 | undefined, false>;
|
|
47
|
+
readonly row: import("@motionscript/sdk").Type<number, number, false>;
|
|
48
|
+
};
|
|
49
|
+
readonly focusColumn: {
|
|
50
|
+
readonly dim: import("@motionscript/sdk").Type<number, number, false>;
|
|
51
|
+
readonly grow: import("@motionscript/sdk").Type<0.1 | undefined, 0.1 | undefined, false>;
|
|
52
|
+
readonly column: import("@motionscript/sdk").Type<number, number, false>;
|
|
53
|
+
};
|
|
54
|
+
readonly reveal: {
|
|
55
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
56
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
57
|
+
readonly style: import("@motionscript/sdk").Type<"center" | "scale" | "fade" | "rise" | "flip" | "spin", "center" | "scale" | "fade" | "rise" | "flip" | "spin", false>;
|
|
58
|
+
};
|
|
59
|
+
readonly conceal: {
|
|
60
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
61
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
62
|
+
readonly style: import("@motionscript/sdk").Type<"center" | "scale" | "fade" | "rise" | "flip" | "spin", "center" | "scale" | "fade" | "rise" | "flip" | "spin", false>;
|
|
63
|
+
};
|
|
64
|
+
readonly wave: {
|
|
65
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
66
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
67
|
+
readonly style: import("@motionscript/sdk").Type<"scale" | "fade" | "spin" | "lift", "scale" | "fade" | "spin" | "lift", false>;
|
|
68
|
+
readonly amount: import("@motionscript/sdk").Type<number, number, false>;
|
|
69
|
+
};
|
|
70
|
+
readonly focus: {
|
|
71
|
+
readonly item: import("@motionscript/sdk").Type<number, number, false>;
|
|
72
|
+
readonly dim: import("@motionscript/sdk").Type<number, number, false>;
|
|
73
|
+
readonly grow: import("@motionscript/sdk").Type<number, number, false>;
|
|
74
|
+
};
|
|
75
|
+
readonly unfocus: unknown;
|
|
76
|
+
readonly spreadTo: {
|
|
77
|
+
readonly spread: import("@motionscript/sdk").Type<number, number, false>;
|
|
78
|
+
};
|
|
79
|
+
readonly shuffle: {
|
|
80
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
81
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
82
|
+
readonly seed: import("@motionscript/sdk").Type<number, number, false>;
|
|
83
|
+
};
|
|
84
|
+
readonly swap: {
|
|
85
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
86
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
87
|
+
readonly first: import("@motionscript/sdk").Type<number, number, false>;
|
|
88
|
+
readonly second: import("@motionscript/sdk").Type<number, number, false>;
|
|
89
|
+
};
|
|
90
|
+
readonly reorder: {
|
|
91
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
92
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
93
|
+
readonly order: import("@motionscript/sdk").Type<string, string, false>;
|
|
94
|
+
};
|
|
95
|
+
readonly morphInto: {
|
|
96
|
+
readonly staggerOrder: import("@motionscript/sdk").Type<"path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", "path" | "row" | "column" | "angle" | "depth" | "index" | "reverse" | "random" | "centerOut" | "edgesIn", false>;
|
|
97
|
+
readonly stagger: import("@motionscript/sdk").Type<number, number, false>;
|
|
98
|
+
readonly target: import("@motionscript/sdk").Type<string | undefined, string | undefined, false>;
|
|
99
|
+
};
|
|
100
|
+
}, null, _Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
|
|
101
|
+
readonly columns: import("@motionscript/sdk").Type<number, number, false>;
|
|
102
|
+
readonly fillDirection: import("@motionscript/sdk").Type<"row" | "column", "row" | "column", false>;
|
|
103
|
+
readonly cellMode: import("@motionscript/sdk").Type<"fixed" | "fit" | "fill", "fixed" | "fit" | "fill", false>;
|
|
104
|
+
readonly cellWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
105
|
+
readonly cellHeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
106
|
+
readonly columnGap: import("@motionscript/sdk").Type<number, number, false>;
|
|
107
|
+
readonly rowGap: import("@motionscript/sdk").Type<number, number, false>;
|
|
108
|
+
readonly lastLineAlign: import("@motionscript/sdk").Type<"start" | "center" | "end", "start" | "center" | "end", false>;
|
|
109
|
+
readonly rowOffset: import("@motionscript/sdk").Type<number, number, false>;
|
|
110
|
+
readonly columnOffset: import("@motionscript/sdk").Type<number, number, false>;
|
|
111
|
+
readonly order: import("@motionscript/sdk").Type<number[], number[], false>;
|
|
112
|
+
readonly spread: import("@motionscript/sdk").Type<number, number, false>;
|
|
113
|
+
readonly arrangeLike: import("@motionscript/sdk").Type<string, import("@motionscript/sdk").NodeView<import("@motionscript/sdk").Element<string, unknown, unknown>> | null, false>;
|
|
114
|
+
readonly revealState: import("@motionscript/sdk").Type<import("../index.js").RevealState | null | undefined, import("../index.js").RevealState | null | undefined, false>;
|
|
115
|
+
readonly waveState: import("@motionscript/sdk").Type<import("../index.js").WaveState | null | undefined, import("../index.js").WaveState | null | undefined, false>;
|
|
116
|
+
readonly focusState: import("@motionscript/sdk").Type<import("../index.js").FocusState | null | undefined, import("../index.js").FocusState | null | undefined, false>;
|
|
117
|
+
readonly transition: import("@motionscript/sdk").Type<ItemGrid.GridTransition | null | undefined, ItemGrid.GridTransition | null | undefined, false>;
|
|
118
|
+
readonly transitionSource: import("@motionscript/sdk").Type<string, import("@motionscript/sdk").NodeView<import("@motionscript/sdk").Element<string, unknown, unknown>> | null, true>;
|
|
119
|
+
}>, null>>;
|
|
120
|
+
export type RectangularGrid = NodeOf<typeof RectangularGrid>;
|
|
121
|
+
/** What a call or a document row may set. */
|
|
122
|
+
export type RectangularGridProps = NonNullable<Parameters<typeof RectangularGrid>[0]>;
|
|
79
123
|
//# sourceMappingURL=rectangular-grid.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rectangular-grid.d.ts","sourceRoot":"","sources":["../../src/rectangular-grid/rectangular-grid.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"rectangular-grid.d.ts","sourceRoot":"","sources":["../../src/rectangular-grid/rectangular-grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,MAAM,EAGX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,mBAAmB,CAAA;AAE1B,OAAO,EAGL,QAAQ,EAMT,MAAM,QAAQ,CAAA;AA6Cf;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAmEf,CAAA;AAEb,MAAM,MAAM,eAAe,GAAG,MAAM,CAAC,OAAO,eAAe,CAAC,CAAA;AAC5D,6CAA6C;AAC7C,MAAM,MAAM,oBAAoB,GAAG,WAAW,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA"}
|