@gjermundgaraba-designs/pixel-paper 0.21.0 → 0.22.0
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/DESIGN.md +18 -12
- package/dist/src/bench/bench.d.ts +14 -0
- package/dist/src/bench/bench.d.ts.map +1 -0
- package/dist/src/bench/bench.js +9 -0
- package/dist/src/bench/index.d.ts +3 -0
- package/dist/src/bench/index.d.ts.map +1 -0
- package/dist/src/bench/index.js +1 -0
- package/dist/src/chip/chip.d.ts +10 -0
- package/dist/src/chip/chip.d.ts.map +1 -1
- package/dist/src/chip/chip.js +19 -0
- package/dist/src/chip/index.d.ts +2 -2
- package/dist/src/chip/index.d.ts.map +1 -1
- package/dist/src/chip/index.js +1 -1
- package/dist/src/drag/drag.d.ts +18 -0
- package/dist/src/drag/drag.d.ts.map +1 -1
- package/dist/src/drag/drag.js +35 -7
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/index.js +1 -0
- package/dist/src/rail/index.d.ts +1 -1
- package/dist/src/rail/index.d.ts.map +1 -1
- package/dist/src/rail/index.js +1 -1
- package/dist/src/rail/rail.d.ts +217 -17
- package/dist/src/rail/rail.d.ts.map +1 -1
- package/dist/src/rail/rail.js +133 -15
- package/dist/src/reel/index.d.ts +1 -1
- package/dist/src/reel/index.d.ts.map +1 -1
- package/dist/src/reel/index.js +1 -1
- package/dist/src/reel/layout.d.ts +21 -26
- package/dist/src/reel/layout.d.ts.map +1 -1
- package/dist/src/reel/layout.js +84 -106
- package/dist/src/reel/reel.d.ts +30 -172
- package/dist/src/reel/reel.d.ts.map +1 -1
- package/dist/src/reel/reel.js +144 -195
- package/dist/src/rows/rows.d.ts +9 -1
- package/dist/src/rows/rows.d.ts.map +1 -1
- package/dist/src/rows/rows.js +1 -1
- package/package.json +1 -1
- package/src/bench/bench.ts +24 -0
- package/src/bench/index.ts +2 -0
- package/src/chip/chip.ts +31 -0
- package/src/chip/index.ts +2 -2
- package/src/drag/drag.ts +60 -1
- package/src/index.ts +1 -0
- package/src/pixel-paper.css +196 -32
- package/src/rail/index.ts +2 -0
- package/src/rail/rail.ts +181 -16
- package/src/reel/index.ts +0 -1
- package/src/reel/layout.ts +78 -118
- package/src/reel/reel.ts +108 -216
- package/src/rows/rows.ts +14 -2
- package/src/tokens.css +2 -1
|
@@ -33,7 +33,7 @@ export declare const Layout: Schema.$Array<Schema.Struct<{
|
|
|
33
33
|
}>>;
|
|
34
34
|
}>>;
|
|
35
35
|
export type Layout = typeof Layout.Type;
|
|
36
|
-
/** What is
|
|
36
|
+
/** What a move is said of: a pane, or a column (a key moves one), by its id. */
|
|
37
37
|
export declare const Subject: import("foldkit/schema").TaggedUnion<{
|
|
38
38
|
readonly Pane: {
|
|
39
39
|
paneId: Schema.String;
|
|
@@ -43,8 +43,8 @@ export declare const Subject: import("foldkit/schema").TaggedUnion<{
|
|
|
43
43
|
};
|
|
44
44
|
}>;
|
|
45
45
|
export type Subject = typeof Subject.Type;
|
|
46
|
-
/** Where a held pane
|
|
47
|
-
*
|
|
46
|
+
/** Where a held pane would land: into a column, at a place among its other panes, or in the
|
|
47
|
+
* gap before a column (none: after the last), as a column of its own. */
|
|
48
48
|
export declare const Target: import("foldkit/schema").TaggedUnion<{
|
|
49
49
|
readonly Into: {
|
|
50
50
|
columnId: Schema.String;
|
|
@@ -115,8 +115,6 @@ export type Place = Readonly<{
|
|
|
115
115
|
export declare const placeOf: (layout: Layout, paneId: string) => Option.Option<Place>;
|
|
116
116
|
export declare const placeAt: (layout: Layout, columnIndex: number, row: number) => Option.Option<Place>;
|
|
117
117
|
export declare const firstPlace: (layout: Layout) => Option.Option<Place>;
|
|
118
|
-
export declare const columnIndexOf: (layout: Layout, columnId: string) => Option.Option<number>;
|
|
119
|
-
export declare const columnOf: (layout: Layout, columnId: string) => Option.Option<Column>;
|
|
120
118
|
/**
|
|
121
119
|
* The layout once `request` is applied: what the reel asked, done the way every client does
|
|
122
120
|
* it. A pane that leaves its column takes the mean weight of the column it joins; a column
|
|
@@ -125,25 +123,22 @@ export declare const columnOf: (layout: Layout, columnId: string) => Option.Opti
|
|
|
125
123
|
*/
|
|
126
124
|
export declare const apply: (layout: Layout, request: OutMessage) => Layout;
|
|
127
125
|
export declare const widthWords: (width: number) => string;
|
|
128
|
-
export declare const widthMark: (width: number) => string;
|
|
129
126
|
/** The next preset wider than `width`, or the narrowest past the widest. */
|
|
130
127
|
export declare const nextPreset: (width: number) => number;
|
|
131
|
-
/** What a place is called when a drop would leave the pane or column where it is. */
|
|
128
|
+
/** What a place is called when a drop or a move would leave the pane or column where it is. */
|
|
132
129
|
export declare const WHERE_IT_WAS = "where it was";
|
|
133
130
|
export declare const fill: (template: string, fields: Readonly<Record<string, string | number>>) => string;
|
|
134
131
|
export declare const subjectWords: (layout: Layout, subject: Subject) => Option.Option<string>;
|
|
135
132
|
export declare const placeWords: (layout: Layout, place: Place) => string;
|
|
136
133
|
/** Where `subject` sits in `layout`, in words. */
|
|
137
134
|
export declare const whereWords: (layout: Layout, subject: Subject) => Option.Option<string>;
|
|
138
|
-
/** Where `
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
export declare const
|
|
145
|
-
/** Where `subject` would be once dropped at `target`, in words. */
|
|
146
|
-
export declare const landingWords: (layout: Layout, subject: Subject, target: Target) => string;
|
|
135
|
+
/** Where the pane `paneId` is now, as a target. */
|
|
136
|
+
export declare const originOf: (layout: Layout, paneId: string) => Option.Option<Target>;
|
|
137
|
+
/** What dropping the pane `paneId` at `target` asks of the layout: none where it would
|
|
138
|
+
* change nothing (where it is, or a target whose column is gone). */
|
|
139
|
+
export declare const requestOf: (layout: Layout, paneId: string, target: Target) => Option.Option<OutMessage>;
|
|
140
|
+
/** Where the pane `paneId` would be once dropped at `target`, in words. */
|
|
141
|
+
export declare const landingWords: (layout: Layout, paneId: string, target: Target) => string;
|
|
147
142
|
/** The column a target sits in or before (the last, for the gap after it), which a keyboard
|
|
148
143
|
* step scrolls to. */
|
|
149
144
|
export declare const columnOfTarget: (layout: Layout, target: Target) => Option.Option<string>;
|
|
@@ -151,11 +146,12 @@ export declare const Step: Schema.Literals<readonly ["Up", "Down", "Left", "Righ
|
|
|
151
146
|
export type Step = typeof Step.Type;
|
|
152
147
|
/** Whether the column `target` names (into it, or the gap before it) is still in `layout`. */
|
|
153
148
|
export declare const isTargetPresent: (layout: Layout, target: Target) => boolean;
|
|
154
|
-
/** A keyboard step from `target`: left and right cross from a column to
|
|
155
|
-
* on to the next column, up and down move among a column's panes. A
|
|
156
|
-
* change nothing is passed over, but for where
|
|
157
|
-
* way, it stays (where
|
|
158
|
-
|
|
149
|
+
/** A keyboard step of the pane `paneId` from `target`: left and right cross from a column to
|
|
150
|
+
* the gap beside it and on to the next column, up and down move among a column's panes. A
|
|
151
|
+
* stop where the drop would change nothing is passed over, but for where the pane started;
|
|
152
|
+
* with nothing further that way, it stays (where the pane started, if the target's column has
|
|
153
|
+
* gone). */
|
|
154
|
+
export declare const steppedTarget: (layout: Layout, paneId: string, target: Target, step: Step) => Target;
|
|
159
155
|
/** A column as a pointer reads it: its id, its left and right edges, and the vertical middles
|
|
160
156
|
* of its slots, the held pane's left out. */
|
|
161
157
|
export type ColumnBox = Readonly<{
|
|
@@ -165,11 +161,10 @@ export type ColumnBox = Readonly<{
|
|
|
165
161
|
slotMiddles: ReadonlyArray<number>;
|
|
166
162
|
}>;
|
|
167
163
|
/** Where a pointer at (`clientX`, `clientY`) over a reel whose columns sit at `columns`, left
|
|
168
|
-
* to right, would drop
|
|
169
|
-
*
|
|
170
|
-
*
|
|
171
|
-
|
|
172
|
-
export declare const targetAtPoint: (subject: Subject, columns: ReadonlyArray<ColumnBox>, clientX: number, clientY: number) => Target;
|
|
164
|
+
* to right, would drop a pane. Over a column's edge band (or over a gap, or past the last
|
|
165
|
+
* column) it lands in that gap, as a column of its own; over the rest of a column it lands
|
|
166
|
+
* among that column's other panes, after each whose middle is above the pointer. */
|
|
167
|
+
export declare const targetAtPoint: (columns: ReadonlyArray<ColumnBox>, clientX: number, clientY: number) => Target;
|
|
173
168
|
/** What moving `splitter` by `share` asks of the layout, from the sizes the layout holds (not
|
|
174
169
|
* the sizes printed, which the stylesheet may hold at a minimum): a width splitter adds
|
|
175
170
|
* `share` to its column's width; a pane splitter moves `share` of its column's height from
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/reel/layout.ts"],"names":[],"mappings":"AAGA,OAAO,EAA+B,MAAM,EAAqB,MAAM,EAAQ,MAAM,QAAQ,CAAC;AAQ9F;;sEAEsE;AACtE,eAAO,MAAM,IAAI;;;;EAIf,CAAC;AACH,MAAM,MAAM,IAAI,GAAG,OAAO,IAAI,CAAC,IAAI,CAAC;AAEpC;;;oFAGoF;AACpF,eAAO,MAAM,MAAM;;;;;;;;EAIjB,CAAC;AACH,MAAM,MAAM,MAAM,GAAG,OAAO,MAAM,CAAC,IAAI,CAAC;AAExC,yFAAyF;AACzF,eAAO,MAAM,MAAM;;;;;;;;GAAuB,CAAC;AAC3C,MAAM,MAAM,MAAM,GAAG,OAAO,MAAM,CAAC,IAAI,CAAC;AAExC,
|
|
1
|
+
{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/reel/layout.ts"],"names":[],"mappings":"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"}
|
package/dist/src/reel/layout.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
2
|
// The reel's layout, apart from its Model: the panes, columns and requests the application
|
|
3
|
-
// holds and applies, where a held pane
|
|
3
|
+
// holds and applies, where a held pane may land, and how places are said.
|
|
4
4
|
import { Array, Equal, Match, Number, Option, Predicate, Record, Schema, pipe } from "effect";
|
|
5
5
|
import { defineMessageUnion } from "foldkit/message";
|
|
6
6
|
import { defineTaggedUnion } from "foldkit/schema";
|
|
@@ -25,13 +25,13 @@ export const Column = Schema.Struct({
|
|
|
25
25
|
});
|
|
26
26
|
/** Schema for a reel's layout: its columns, left to right. The application's to keep. */
|
|
27
27
|
export const Layout = Schema.Array(Column);
|
|
28
|
-
/** What is
|
|
28
|
+
/** What a move is said of: a pane, or a column (a key moves one), by its id. */
|
|
29
29
|
export const Subject = defineTaggedUnion({
|
|
30
30
|
Pane: { paneId: Schema.String },
|
|
31
31
|
Column: { columnId: Schema.String },
|
|
32
32
|
});
|
|
33
|
-
/** Where a held pane
|
|
34
|
-
*
|
|
33
|
+
/** Where a held pane would land: into a column, at a place among its other panes, or in the
|
|
34
|
+
* gap before a column (none: after the last), as a column of its own. */
|
|
35
35
|
export const Target = defineTaggedUnion({
|
|
36
36
|
Into: { columnId: Schema.String, index: Schema.Number },
|
|
37
37
|
Gap: { maybeBeforeColumnId: Schema.Option(Schema.String) },
|
|
@@ -65,8 +65,8 @@ const placesOf = (layout) => __foldkitBrandViewResult((Array.flatMap(layout, (co
|
|
|
65
65
|
export const placeOf = (layout, paneId) => __foldkitBrandViewResult((Array.findFirst(placesOf(layout), (place) => __foldkitBrandViewResult((place.pane.id === paneId), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~3"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#placeOf");
|
|
66
66
|
export const placeAt = (layout, columnIndex, row) => __foldkitBrandViewResult((Option.flatMap(Array.get(layout, columnIndex), (column) => __foldkitBrandViewResult((Option.map(Array.get(column.panes, row), (pane) => (__foldkitBrandViewResult(({ column, columnIndex, row, pane }), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~5")))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~4"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#placeAt");
|
|
67
67
|
export const firstPlace = (layout) => __foldkitBrandViewResult((placeAt(layout, 0, 0)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#firstPlace");
|
|
68
|
-
|
|
69
|
-
|
|
68
|
+
const columnIndexOf = (layout, columnId) => __foldkitBrandViewResult((Array.findFirstIndex(layout, (column) => __foldkitBrandViewResult((column.id === columnId), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~6"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#columnIndexOf");
|
|
69
|
+
const columnOf = (layout, columnId) => __foldkitBrandViewResult((Array.findFirst(layout, (column) => __foldkitBrandViewResult((column.id === columnId), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~7"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#columnOf");
|
|
70
70
|
/** The id of the column after the one at `columnIndex`: none after the last. */
|
|
71
71
|
const nextColumnId = (layout, columnIndex) => __foldkitBrandViewResult((Option.map(Array.get(layout, columnIndex + 1), (column) => __foldkitBrandViewResult((column.id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~8"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#nextColumnId");
|
|
72
72
|
// a running mean, which never passes the largest weight, where the weights' sum may overflow
|
|
@@ -162,13 +162,13 @@ export const apply = (layout, request) => __foldkitBrandViewResult((OutMessage.m
|
|
|
162
162
|
/** How close a width is to a preset to count as it. */
|
|
163
163
|
const PRESET_TOLERANCE = 0.01;
|
|
164
164
|
/** The widths a column cycles through, as fractions of the reel's visible width, with the
|
|
165
|
-
* words they are said in
|
|
166
|
-
*
|
|
165
|
+
* words they are said in. They live here, not in the tokens, because they are words as much
|
|
166
|
+
* as sizes. */
|
|
167
167
|
const PRESETS = [
|
|
168
|
-
{ width: 1 / 3, words: "a third of the width"
|
|
169
|
-
{ width: 1 / 2, words: "half the width"
|
|
170
|
-
{ width: 2 / 3, words: "two thirds of the width"
|
|
171
|
-
{ width: 1, words: "the full width"
|
|
168
|
+
{ width: 1 / 3, words: "a third of the width" },
|
|
169
|
+
{ width: 1 / 2, words: "half the width" },
|
|
170
|
+
{ width: 2 / 3, words: "two thirds of the width" },
|
|
171
|
+
{ width: 1, words: "the full width" },
|
|
172
172
|
];
|
|
173
173
|
const presetOf = (width) => __foldkitBrandViewResult((Array.findFirst(PRESETS, (preset) => __foldkitBrandViewResult((Math.abs(preset.width - width) < PRESET_TOLERANCE), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~20"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#presetOf");
|
|
174
174
|
const percent = (width) => __foldkitBrandViewResult((Math.round(width * 100).toLocaleString(LOCALE)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#percent");
|
|
@@ -176,10 +176,6 @@ export const widthWords = (width) => __foldkitBrandViewResult((Option.match(pres
|
|
|
176
176
|
onNone: () => __foldkitBrandViewResult((`${percent(width)}% of the width`), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~6"),
|
|
177
177
|
onSome: ({ words }) => __foldkitBrandViewResult((words), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~6"),
|
|
178
178
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#widthWords");
|
|
179
|
-
export const widthMark = (width) => __foldkitBrandViewResult((Option.match(presetOf(width), {
|
|
180
|
-
onNone: () => __foldkitBrandViewResult((`${percent(width)}%`), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~7"),
|
|
181
|
-
onSome: ({ mark }) => __foldkitBrandViewResult((mark), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~7"),
|
|
182
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#widthMark");
|
|
183
179
|
/** The next preset wider than `width`, or the narrowest past the widest. */
|
|
184
180
|
export const nextPreset = (width) => __foldkitBrandViewResult((Option.getOrElse(Array.findFirst(PRESETS, (preset) => __foldkitBrandViewResult((preset.width > width + PRESET_TOLERANCE), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~21")), () => __foldkitBrandViewResult((Array.headNonEmpty(PRESETS)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~22")).width), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#nextPreset");
|
|
185
181
|
// WORDS
|
|
@@ -190,7 +186,7 @@ const WORDS = {
|
|
|
190
186
|
place: "column {column} of {columns}",
|
|
191
187
|
stackedPlace: "{row} of {rows} in column {column} of {columns}",
|
|
192
188
|
};
|
|
193
|
-
/** What a place is called when a drop would leave the pane or column where it is. */
|
|
189
|
+
/** What a place is called when a drop or a move would leave the pane or column where it is. */
|
|
194
190
|
export const WHERE_IT_WAS = "where it was";
|
|
195
191
|
export const fill = (template, fields) => __foldkitBrandViewResult((Array.reduce(Object.entries(fields), template, (text, [key, value]) => __foldkitBrandViewResult((text.replaceAll(`{${key}}`, Predicate.isNumber(value) ? value.toLocaleString(LOCALE) : value)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~23"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#fill");
|
|
196
192
|
export const subjectWords = (layout, subject) => __foldkitBrandViewResult((Subject.match(subject, {
|
|
@@ -213,90 +209,76 @@ export const whereWords = (layout, subject) => __foldkitBrandViewResult((Subject
|
|
|
213
209
|
Column: ({ columnId }) => __foldkitBrandViewResult((Option.map(columnIndexOf(layout, columnId), (column) => __foldkitBrandViewResult((fill(WORDS.place, { column: column + 1, columns: layout.length })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~27"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Column~2"),
|
|
214
210
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#whereWords");
|
|
215
211
|
// TARGETS
|
|
216
|
-
/** Where `
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
export const
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((OutMessage.PulledOutPane({ paneId, maybeBeforeColumnId })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap"),
|
|
229
|
-
}))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Pane~4"),
|
|
230
|
-
Column: ({ columnId }) => __foldkitBrandViewResult((Target.match(target, {
|
|
231
|
-
Into: () => __foldkitBrandViewResult((Option.none()), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~2"),
|
|
232
|
-
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((Option.some(OutMessage.MovedColumn({ columnId, maybeBeforeColumnId }))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~2"),
|
|
233
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Column~4"),
|
|
234
|
-
}), (request) => __foldkitBrandViewResult((!Equal.equals(apply(layout, request), layout)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~30"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#requestOf");
|
|
235
|
-
/** Where `subject` would be once dropped at `target`, in words. */
|
|
236
|
-
export const landingWords = (layout, subject, target) => __foldkitBrandViewResult((Option.match(requestOf(layout, subject, target), {
|
|
237
|
-
onNone: () => __foldkitBrandViewResult((WHERE_IT_WAS), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~8"),
|
|
238
|
-
onSome: (request) => __foldkitBrandViewResult((Option.getOrElse(whereWords(apply(layout, request), subject), () => __foldkitBrandViewResult((WHERE_IT_WAS), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~31"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~8"),
|
|
212
|
+
/** Where the pane `paneId` is now, as a target. */
|
|
213
|
+
export const originOf = (layout, paneId) => __foldkitBrandViewResult((Option.map(placeOf(layout, paneId), ({ column, row }) => __foldkitBrandViewResult((Target.Into({ columnId: column.id, index: row })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~28"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#originOf");
|
|
214
|
+
/** What dropping the pane `paneId` at `target` asks of the layout: none where it would
|
|
215
|
+
* change nothing (where it is, or a target whose column is gone). */
|
|
216
|
+
export const requestOf = (layout, paneId, target) => __foldkitBrandViewResult((Option.filter(Option.some(Target.match(target, {
|
|
217
|
+
Into: ({ columnId, index }) => __foldkitBrandViewResult((OutMessage.MovedPane({ paneId, toColumnId: columnId, toIndex: index })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into"),
|
|
218
|
+
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((OutMessage.PulledOutPane({ paneId, maybeBeforeColumnId })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap"),
|
|
219
|
+
})), (request) => __foldkitBrandViewResult((!Equal.equals(apply(layout, request), layout)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~29"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#requestOf");
|
|
220
|
+
/** Where the pane `paneId` would be once dropped at `target`, in words. */
|
|
221
|
+
export const landingWords = (layout, paneId, target) => __foldkitBrandViewResult((Option.match(requestOf(layout, paneId, target), {
|
|
222
|
+
onNone: () => __foldkitBrandViewResult((WHERE_IT_WAS), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~7"),
|
|
223
|
+
onSome: (request) => __foldkitBrandViewResult((Option.getOrElse(whereWords(apply(layout, request), Subject.Pane({ paneId })), () => __foldkitBrandViewResult((WHERE_IT_WAS), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~30"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~7"),
|
|
239
224
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#landingWords");
|
|
240
225
|
/** The column a target sits in or before (the last, for the gap after it), which a keyboard
|
|
241
226
|
* step scrolls to. */
|
|
242
227
|
export const columnOfTarget = (layout, target) => __foldkitBrandViewResult((Target.match(target, {
|
|
243
|
-
Into: ({ columnId }) => __foldkitBrandViewResult((Option.some(columnId)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~
|
|
244
|
-
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((Option.orElse(maybeBeforeColumnId, () => __foldkitBrandViewResult((Option.map(Array.last(layout), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
228
|
+
Into: ({ columnId }) => __foldkitBrandViewResult((Option.some(columnId)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~2"),
|
|
229
|
+
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((Option.orElse(maybeBeforeColumnId, () => __foldkitBrandViewResult((Option.map(Array.last(layout), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~32"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~31"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~2"),
|
|
245
230
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#columnOfTarget");
|
|
246
231
|
export const Step = Schema.Literals(["Up", "Down", "Left", "Right"]);
|
|
247
232
|
// A keyboard step reads the layout as a row of stops: the gap before each column (even), then
|
|
248
|
-
// the column itself (odd), and the gap after the last.
|
|
233
|
+
// the column itself (odd), and the gap after the last.
|
|
249
234
|
const stopOf = (layout, target) => __foldkitBrandViewResult((Target.match(target, {
|
|
250
|
-
Into: ({ columnId }) => __foldkitBrandViewResult((Option.map(columnIndexOf(layout, columnId), (column) => __foldkitBrandViewResult((column * 2 + 1), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
251
|
-
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((Option.map(gapIndex(layout, maybeBeforeColumnId), (gap) => __foldkitBrandViewResult((gap * 2), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
235
|
+
Into: ({ columnId }) => __foldkitBrandViewResult((Option.map(columnIndexOf(layout, columnId), (column) => __foldkitBrandViewResult((column * 2 + 1), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~33"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~3"),
|
|
236
|
+
Gap: ({ maybeBeforeColumnId }) => __foldkitBrandViewResult((Option.map(gapIndex(layout, maybeBeforeColumnId), (gap) => __foldkitBrandViewResult((gap * 2), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~34"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~3"),
|
|
252
237
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#stopOf");
|
|
253
238
|
/** Whether the column `target` names (into it, or the gap before it) is still in `layout`. */
|
|
254
239
|
export const isTargetPresent = (layout, target) => __foldkitBrandViewResult((Option.isSome(stopOf(layout, target))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#isTargetPresent");
|
|
255
|
-
const targetAtStop = (layout,
|
|
240
|
+
const targetAtStop = (layout, paneId, stop, row) => __foldkitBrandViewResult((stop % 2 === 0
|
|
256
241
|
? Target.Gap({
|
|
257
|
-
maybeBeforeColumnId: Option.map(Array.get(layout, stop / 2), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
242
|
+
maybeBeforeColumnId: Option.map(Array.get(layout, stop / 2), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~35")),
|
|
258
243
|
})
|
|
259
244
|
: Option.match(Array.get(layout, (stop - 1) / 2), {
|
|
260
|
-
onNone: () => __foldkitBrandViewResult((Target.Gap({ maybeBeforeColumnId: Option.none() })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~
|
|
261
|
-
onSome: (column) => __foldkitBrandViewResult((Target.Into({ columnId: column.id, index: Math.min(row, roomIn(column,
|
|
245
|
+
onNone: () => __foldkitBrandViewResult((Target.Gap({ maybeBeforeColumnId: Option.none() })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~8"),
|
|
246
|
+
onSome: (column) => __foldkitBrandViewResult((Target.Into({ columnId: column.id, index: Math.min(row, roomIn(column, paneId)) })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~8"),
|
|
262
247
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#targetAtStop");
|
|
263
|
-
/** The last index `
|
|
264
|
-
const roomIn = (column,
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#roomIn");
|
|
268
|
-
const stepOnce = (layout, subject, target, step) => {
|
|
269
|
-
const row = Target.match(target, { Into: ({ index }) => __foldkitBrandViewResult((index), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~5"), Gap: () => __foldkitBrandViewResult((0), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~5") });
|
|
270
|
-
const stride = subject._tag === "Column" ? 2 : 1;
|
|
248
|
+
/** The last index the pane `paneId` may take among a column's panes. */
|
|
249
|
+
const roomIn = (column, paneId) => __foldkitBrandViewResult((othersIn(column, paneId).length), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#roomIn");
|
|
250
|
+
const stepOnce = (layout, paneId, target, step) => {
|
|
251
|
+
const row = Target.match(target, { Into: ({ index }) => __foldkitBrandViewResult((index), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~4"), Gap: () => __foldkitBrandViewResult((0), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~4") });
|
|
271
252
|
return __foldkitBrandViewResult((Option.match(stopOf(layout, target), {
|
|
272
|
-
onNone: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~
|
|
273
|
-
onSome: (stop) => __foldkitBrandViewResult((Match.value(step).pipe(Match.withReturnType(), Match.when("Left", () => __foldkitBrandViewResult((targetAtStop(layout,
|
|
274
|
-
Gap: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~
|
|
253
|
+
onNone: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~9"),
|
|
254
|
+
onSome: (stop) => __foldkitBrandViewResult((Match.value(step).pipe(Match.withReturnType(), Match.when("Left", () => __foldkitBrandViewResult((targetAtStop(layout, paneId, Math.max(stop - 1, 0), row)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~36")), Match.when("Right", () => __foldkitBrandViewResult((targetAtStop(layout, paneId, Math.min(stop + 1, layout.length * 2), row)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~37")), Match.whenOr("Up", "Down", () => __foldkitBrandViewResult((Target.match(target, {
|
|
255
|
+
Gap: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Gap~5"),
|
|
275
256
|
Into: ({ columnId }) => __foldkitBrandViewResult((Option.match(columnOf(layout, columnId), {
|
|
276
|
-
onNone: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~
|
|
257
|
+
onNone: () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~10"),
|
|
277
258
|
onSome: (column) => __foldkitBrandViewResult((Target.Into({
|
|
278
259
|
columnId,
|
|
279
260
|
index: Number.clamp(step === "Up" ? row - 1 : row + 1, {
|
|
280
261
|
minimum: 0,
|
|
281
|
-
maximum: roomIn(column,
|
|
262
|
+
maximum: roomIn(column, paneId),
|
|
282
263
|
}),
|
|
283
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~
|
|
284
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~
|
|
285
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
264
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~10"),
|
|
265
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Into~5"),
|
|
266
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~38")), Match.exhaustive)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~9"),
|
|
286
267
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#stepOnce");
|
|
287
268
|
};
|
|
288
|
-
/** A keyboard step from `target`: left and right cross from a column to
|
|
289
|
-
* on to the next column, up and down move among a column's panes. A
|
|
290
|
-
* change nothing is passed over, but for where
|
|
291
|
-
* way, it stays (where
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
const
|
|
297
|
-
|
|
269
|
+
/** A keyboard step of the pane `paneId` from `target`: left and right cross from a column to
|
|
270
|
+
* the gap beside it and on to the next column, up and down move among a column's panes. A
|
|
271
|
+
* stop where the drop would change nothing is passed over, but for where the pane started;
|
|
272
|
+
* with nothing further that way, it stays (where the pane started, if the target's column has
|
|
273
|
+
* gone). */
|
|
274
|
+
export const steppedTarget = (layout, paneId, target, step) => {
|
|
275
|
+
const origin = originOf(layout, paneId);
|
|
276
|
+
// a target whose column has gone steps from where the pane started instead
|
|
277
|
+
const start = isTargetPresent(layout, target) ? target : Option.getOrElse(origin, () => __foldkitBrandViewResult((target), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~39"));
|
|
278
|
+
const isStop = (candidate) => __foldkitBrandViewResult((Option.isSome(requestOf(layout, paneId, candidate)) ||
|
|
279
|
+
Option.exists(origin, (place) => __foldkitBrandViewResult((Equal.equals(place, candidate)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~40"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#isStop");
|
|
298
280
|
const walk = (from, left) => {
|
|
299
|
-
const next = stepOnce(layout,
|
|
281
|
+
const next = stepOnce(layout, paneId, from, step);
|
|
300
282
|
if (Equal.equals(next, from) || left === 0) {
|
|
301
283
|
return __foldkitBrandViewResult((start), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#walk");
|
|
302
284
|
}
|
|
@@ -309,33 +291,29 @@ export const steppedTarget = (layout, subject, target, step) => {
|
|
|
309
291
|
* pixels. */
|
|
310
292
|
const EDGE_SHARE = 0.2;
|
|
311
293
|
const EDGE_MAX = 48;
|
|
312
|
-
const gapBefore = (columns, gap) => __foldkitBrandViewResult((Target.Gap({ maybeBeforeColumnId: Option.map(Array.get(columns, gap), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
294
|
+
const gapBefore = (columns, gap) => __foldkitBrandViewResult((Target.Gap({ maybeBeforeColumnId: Option.map(Array.get(columns, gap), ({ id }) => __foldkitBrandViewResult((id), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~41")) })), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#gapBefore");
|
|
313
295
|
/** Where a pointer at (`clientX`, `clientY`) over a reel whose columns sit at `columns`, left
|
|
314
|
-
* to right, would drop
|
|
315
|
-
*
|
|
316
|
-
*
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
}
|
|
336
|
-
},
|
|
337
|
-
}))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Pane~6"),
|
|
338
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#targetAtPoint");
|
|
296
|
+
* to right, would drop a pane. Over a column's edge band (or over a gap, or past the last
|
|
297
|
+
* column) it lands in that gap, as a column of its own; over the rest of a column it lands
|
|
298
|
+
* among that column's other panes, after each whose middle is above the pointer. */
|
|
299
|
+
export const targetAtPoint = (columns, clientX, clientY) => __foldkitBrandViewResult((pipe(Array.findFirstIndex(columns, ({ right }) => __foldkitBrandViewResult((clientX <= right), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~42")), Option.flatMap((index) => __foldkitBrandViewResult((Option.map(Array.get(columns, index), (box) => (__foldkitBrandViewResult(({ index, box }), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~44")))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~43")), Option.match({
|
|
300
|
+
onNone: () => __foldkitBrandViewResult((gapBefore(columns, columns.length)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onNone~11"),
|
|
301
|
+
onSome: ({ index, box: { id, left, right, slotMiddles } }) => {
|
|
302
|
+
const band = Math.min((right - left) * EDGE_SHARE, EDGE_MAX);
|
|
303
|
+
if (clientX < left + band) {
|
|
304
|
+
return __foldkitBrandViewResult((gapBefore(columns, index)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~11");
|
|
305
|
+
}
|
|
306
|
+
else if (clientX > right - band) {
|
|
307
|
+
return __foldkitBrandViewResult((gapBefore(columns, index + 1)), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~11");
|
|
308
|
+
}
|
|
309
|
+
else {
|
|
310
|
+
return __foldkitBrandViewResult((Target.Into({
|
|
311
|
+
columnId: id,
|
|
312
|
+
index: Array.filter(slotMiddles, (middle) => __foldkitBrandViewResult((middle < clientY), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~45")).length,
|
|
313
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#onSome~11");
|
|
314
|
+
}
|
|
315
|
+
},
|
|
316
|
+
}))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#targetAtPoint");
|
|
339
317
|
// RESIZE
|
|
340
318
|
/** The narrowest a column's width goes by a splitter, and the least share of its column a pane
|
|
341
319
|
* keeps: the stylesheet keeps both on screen at their minimums, so these only keep a stored
|
|
@@ -362,9 +340,9 @@ export const resizeOf = (layout, splitter, share) => __foldkitBrandViewResult((S
|
|
|
362
340
|
Width: ({ columnId }) => __foldkitBrandViewResult((Option.map(columnOf(layout, columnId), (column) => __foldkitBrandViewResult((OutMessage.ResizedColumn({
|
|
363
341
|
columnId,
|
|
364
342
|
width: rounded(Number.clamp(column.width + share, { minimum: WIDTH_FLOOR, maximum: 1 })),
|
|
365
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
343
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~46"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Width"),
|
|
366
344
|
Split: ({ abovePaneId }) => __foldkitBrandViewResult((Option.flatMap(placeOf(layout, abovePaneId), ({ column, row, pane: above }) => __foldkitBrandViewResult((Option.map(Array.get(column.panes, row + 1), (below) => {
|
|
367
|
-
const total = Number.sumAll(Array.map(column.panes, ({ weight }) => __foldkitBrandViewResult((weight), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
345
|
+
const total = Number.sumAll(Array.map(column.panes, ({ weight }) => __foldkitBrandViewResult((weight), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~49")));
|
|
368
346
|
const pair = above.weight + below.weight;
|
|
369
347
|
// a column so small that a twentieth of it is no number keeps the least there is
|
|
370
348
|
const floor = Math.max(Math.min(total * SHARE_FLOOR, pair / 2), globalThis.Number.MIN_VALUE);
|
|
@@ -381,8 +359,8 @@ export const resizeOf = (layout, splitter, share) => __foldkitBrandViewResult((S
|
|
|
381
359
|
}
|
|
382
360
|
: // weights that total past the largest number have no share to move: they stay
|
|
383
361
|
{ [above.id]: above.weight, [below.id]: below.weight },
|
|
384
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
385
|
-
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~
|
|
362
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~48");
|
|
363
|
+
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#anonymous~47"))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#Split"),
|
|
386
364
|
})), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#resizeOf");
|
|
387
365
|
/** Whether what `splitter` sizes is still in `layout`. */
|
|
388
366
|
export const isSplitterPresent = (layout, splitter) => __foldkitBrandViewResult((Option.isSome(resizeOf(layout, splitter, 0))), "@gjermundgaraba-designs/pixel-paper/src/reel/layout.js#isSplitterPresent");
|