@graview/primitives 0.1.18 → 0.1.20
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/dist/app-bar.d.ts +30 -6
- package/dist/app-bar.d.ts.map +1 -1
- package/dist/app-bar.js +55 -27
- package/dist/app-bar.js.map +1 -1
- package/dist/arrange-bar.d.ts +42 -25
- package/dist/arrange-bar.d.ts.map +1 -1
- package/dist/arrange-bar.js +129 -194
- package/dist/arrange-bar.js.map +1 -1
- package/dist/arrange-lists.d.ts +56 -0
- package/dist/arrange-lists.d.ts.map +1 -0
- package/dist/arrange-lists.js +196 -0
- package/dist/arrange-lists.js.map +1 -0
- package/dist/bar-panes.d.ts +3 -1
- package/dist/bar-panes.d.ts.map +1 -1
- package/dist/bar-panes.js +36 -21
- package/dist/bar-panes.js.map +1 -1
- package/dist/chat.d.ts +68 -30
- package/dist/chat.d.ts.map +1 -1
- package/dist/chat.js +205 -222
- package/dist/chat.js.map +1 -1
- package/dist/connections.d.ts.map +1 -1
- package/dist/connections.js +19 -3
- package/dist/connections.js.map +1 -1
- package/dist/declared-lens-doors.d.ts +18 -0
- package/dist/declared-lens-doors.d.ts.map +1 -1
- package/dist/declared-lens-doors.js +25 -3
- package/dist/declared-lens-doors.js.map +1 -1
- package/dist/declared-lenses.d.ts.map +1 -1
- package/dist/declared-lenses.js +4 -7
- package/dist/declared-lenses.js.map +1 -1
- package/dist/draft-door.d.ts +3 -0
- package/dist/draft-door.d.ts.map +1 -0
- package/dist/draft-door.js +22 -0
- package/dist/draft-door.js.map +1 -0
- package/dist/draft-frame.d.ts +25 -0
- package/dist/draft-frame.d.ts.map +1 -0
- package/dist/draft-frame.js +69 -0
- package/dist/draft-frame.js.map +1 -0
- package/dist/editable.d.ts +4 -1
- package/dist/editable.d.ts.map +1 -1
- package/dist/editable.js +9 -8
- package/dist/editable.js.map +1 -1
- package/dist/find.d.ts.map +1 -1
- package/dist/find.js +23 -5
- package/dist/find.js.map +1 -1
- package/dist/frame.d.ts +5 -4
- package/dist/frame.d.ts.map +1 -1
- package/dist/frame.js +5 -4
- package/dist/frame.js.map +1 -1
- package/dist/index.d.ts +14 -7
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +15 -6
- package/dist/index.js.map +1 -1
- package/dist/lens/board.d.ts.map +1 -1
- package/dist/lens/board.js +7 -3
- package/dist/lens/board.js.map +1 -1
- package/dist/lens/calendar-options.d.ts +8 -1
- package/dist/lens/calendar-options.d.ts.map +1 -1
- package/dist/lens/calendar-options.js +5 -0
- package/dist/lens/calendar-options.js.map +1 -1
- package/dist/lens/calendar-view.d.ts.map +1 -1
- package/dist/lens/calendar-view.js +2 -2
- package/dist/lens/calendar-view.js.map +1 -1
- package/dist/lens/columns.d.ts.map +1 -1
- package/dist/lens/columns.js +2 -2
- package/dist/lens/columns.js.map +1 -1
- package/dist/lens/coverage.d.ts.map +1 -1
- package/dist/lens/coverage.js +14 -10
- package/dist/lens/coverage.js.map +1 -1
- package/dist/lens/more.d.ts.map +1 -1
- package/dist/lens/more.js +2 -1
- package/dist/lens/more.js.map +1 -1
- package/dist/lens-keeping.d.ts +17 -0
- package/dist/lens-keeping.d.ts.map +1 -0
- package/dist/lens-keeping.js +127 -0
- package/dist/lens-keeping.js.map +1 -0
- package/dist/lines-key.d.ts +12 -0
- package/dist/lines-key.d.ts.map +1 -0
- package/dist/lines-key.js +74 -0
- package/dist/lines-key.js.map +1 -0
- package/dist/notice-place.d.ts +3 -3
- package/dist/notice-place.d.ts.map +1 -1
- package/dist/notice-place.js +4 -4
- package/dist/notice-place.js.map +1 -1
- package/dist/notices.d.ts +6 -0
- package/dist/notices.d.ts.map +1 -1
- package/dist/notices.js +7 -1
- package/dist/notices.js.map +1 -1
- package/dist/pages.d.ts +10 -5
- package/dist/pages.d.ts.map +1 -1
- package/dist/pages.js +10 -5
- package/dist/pages.js.map +1 -1
- package/dist/places.d.ts +0 -24
- package/dist/places.d.ts.map +1 -1
- package/dist/places.js +5 -1
- package/dist/places.js.map +1 -1
- package/dist/profile.d.ts +7 -1
- package/dist/profile.d.ts.map +1 -1
- package/dist/profile.js +2 -2
- package/dist/profile.js.map +1 -1
- package/dist/quick-relations.d.ts.map +1 -1
- package/dist/quick-relations.js +2 -2
- package/dist/quick-relations.js.map +1 -1
- package/dist/reader-lenses.d.ts +21 -0
- package/dist/reader-lenses.d.ts.map +1 -0
- package/dist/reader-lenses.js +27 -0
- package/dist/reader-lenses.js.map +1 -0
- package/dist/relation-key.d.ts +2 -0
- package/dist/relation-key.d.ts.map +1 -1
- package/dist/relation-key.js +13 -23
- package/dist/relation-key.js.map +1 -1
- package/dist/rule-line.d.ts +36 -0
- package/dist/rule-line.d.ts.map +1 -0
- package/dist/rule-line.js +91 -0
- package/dist/rule-line.js.map +1 -0
- package/dist/scene-bar.d.ts +29 -0
- package/dist/scene-bar.d.ts.map +1 -0
- package/dist/scene-bar.js +72 -0
- package/dist/scene-bar.js.map +1 -0
- package/dist/scene-css.d.ts.map +1 -1
- package/dist/scene-css.js +525 -0
- package/dist/scene-css.js.map +1 -1
- package/dist/scene.d.ts +5 -2
- package/dist/scene.d.ts.map +1 -1
- package/dist/scene.js +5 -1
- package/dist/scene.js.map +1 -1
- package/dist/seat-field.d.ts +58 -0
- package/dist/seat-field.d.ts.map +1 -0
- package/dist/seat-field.js +171 -0
- package/dist/seat-field.js.map +1 -0
- package/dist/seat-move.d.ts +32 -0
- package/dist/seat-move.d.ts.map +1 -0
- package/dist/seat-move.js +56 -0
- package/dist/seat-move.js.map +1 -0
- package/dist/seat-panel.d.ts +37 -0
- package/dist/seat-panel.d.ts.map +1 -0
- package/dist/seat-panel.js +134 -0
- package/dist/seat-panel.js.map +1 -0
- package/dist/seat.d.ts +20 -58
- package/dist/seat.d.ts.map +1 -1
- package/dist/seat.js +28 -45
- package/dist/seat.js.map +1 -1
- package/dist/seeding.d.ts.map +1 -1
- package/dist/seeding.js +4 -4
- package/dist/seeding.js.map +1 -1
- package/dist/shell.d.ts +25 -21
- package/dist/shell.d.ts.map +1 -1
- package/dist/shell.js +46 -116
- package/dist/shell.js.map +1 -1
- package/dist/spec-css.d.ts.map +1 -1
- package/dist/spec-css.js +2 -0
- package/dist/spec-css.js.map +1 -1
- package/dist/spec-views.d.ts.map +1 -1
- package/dist/spec-views.js +10 -2
- package/dist/spec-views.js.map +1 -1
- package/dist/subject.d.ts +4 -2
- package/dist/subject.d.ts.map +1 -1
- package/dist/subject.js +12 -8
- package/dist/subject.js.map +1 -1
- package/dist/theme.d.ts.map +1 -1
- package/dist/theme.js +6 -523
- package/dist/theme.js.map +1 -1
- package/dist/view-doors.d.ts.map +1 -1
- package/dist/view-doors.js +7 -0
- package/dist/view-doors.js.map +1 -1
- package/dist/workbench/activity.d.ts.map +1 -1
- package/dist/workbench/activity.js +9 -9
- package/dist/workbench/activity.js.map +1 -1
- package/dist/workbench/back-out.js +3 -3
- package/dist/workbench/back-out.js.map +1 -1
- package/dist/workbench/inspector.d.ts +11 -6
- package/dist/workbench/inspector.d.ts.map +1 -1
- package/dist/workbench/inspector.js +42 -56
- package/dist/workbench/inspector.js.map +1 -1
- package/dist/workbench/standing.d.ts +8 -2
- package/dist/workbench/standing.d.ts.map +1 -1
- package/dist/workbench/standing.js +9 -4
- package/dist/workbench/standing.js.map +1 -1
- package/dist/workbench/trail.d.ts +10 -17
- package/dist/workbench/trail.d.ts.map +1 -1
- package/dist/workbench/trail.js +29 -41
- package/dist/workbench/trail.js.map +1 -1
- package/package.json +7 -7
- package/dist/companion.d.ts +0 -58
- package/dist/companion.d.ts.map +0 -1
- package/dist/companion.js +0 -463
- package/dist/companion.js.map +0 -1
- package/dist/ladder.d.ts +0 -2
- package/dist/ladder.d.ts.map +0 -1
- package/dist/ladder.js +0 -48
- package/dist/ladder.js.map +0 -1
- package/dist/popover.d.ts +0 -21
- package/dist/popover.d.ts.map +0 -1
- package/dist/popover.js +0 -28
- package/dist/popover.js.map +0 -1
- package/dist/wordmark.d.ts +0 -15
- package/dist/wordmark.d.ts.map +0 -1
- package/dist/wordmark.js +0 -50
- package/dist/wordmark.js.map +0 -1
package/dist/scene-css.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { isoShade, layer, SCENE_LAYERS } from "@graview/core";
|
|
2
|
+
import { MARQUEE_GAP, MARQUEE_WIDTH } from "@graview/layout/view";
|
|
2
3
|
import { baseSheet, GRAVIEW_BRAND, withinTheBox } from "./theme.js";
|
|
3
4
|
import { SPEC_VIEW_CSS } from "./spec-css.js";
|
|
4
5
|
/*
|
|
@@ -20,6 +21,530 @@ const wash = (f) => `${face(f)} / ${f.alpha}`;
|
|
|
20
21
|
function sceneSheet(scheme) {
|
|
21
22
|
const iso = isoShade(scheme);
|
|
22
23
|
return `
|
|
24
|
+
${ /* What theme.ts drew for the scene alone, before FR-104's own rules and
|
|
25
|
+
in the order it drew them: the altitude control, the kind's card, its
|
|
26
|
+
drive-in, the others in the city, the district's block, and the seat's
|
|
27
|
+
marks. */""}
|
|
28
|
+
${ /*
|
|
29
|
+
* The altitude control rides the SAME number the scene rides — its own copy,
|
|
30
|
+
* because it sits beside the ground rather than inside it — on the same
|
|
31
|
+
* curve. So the mark morphs exactly as long as the scene does, and where an
|
|
32
|
+
* engine cannot register the property, both cut together: one mechanism,
|
|
33
|
+
* and no way for the control and the picture to disagree about the change.
|
|
34
|
+
*/""}
|
|
35
|
+
.graview-altitude-control {
|
|
36
|
+
--graview-altitude: 0;
|
|
37
|
+
transition:
|
|
38
|
+
--graview-altitude 640ms cubic-bezier(0.33, 0, 0.2, 1),
|
|
39
|
+
color 240ms ease,
|
|
40
|
+
border-color 240ms ease;
|
|
41
|
+
}
|
|
42
|
+
.graview-altitude-mark * {
|
|
43
|
+
transform-box: fill-box;
|
|
44
|
+
transform-origin: center;
|
|
45
|
+
}
|
|
46
|
+
${ /* The ring of three kinds tightens to one ring around one node. */""}
|
|
47
|
+
.graview-altitude-mark-ring {
|
|
48
|
+
transform: scaleX(calc(1 - 0.48 * var(--graview-altitude)));
|
|
49
|
+
opacity: calc(0.55 + 0.4 * var(--graview-altitude));
|
|
50
|
+
}
|
|
51
|
+
.graview-altitude-mark-apex {
|
|
52
|
+
transform: translateY(calc(2.6px * var(--graview-altitude)));
|
|
53
|
+
}
|
|
54
|
+
${ /* The two wings gather into the center and give their ink to the apex. */""}
|
|
55
|
+
.graview-altitude-mark-wing {
|
|
56
|
+
opacity: calc(0.75 * (1 - var(--graview-altitude)));
|
|
57
|
+
}
|
|
58
|
+
.graview-altitude-mark-wing[data-side="left"] {
|
|
59
|
+
transform: translate(calc(4.4px * var(--graview-altitude)), calc(-0.8px * var(--graview-altitude)));
|
|
60
|
+
}
|
|
61
|
+
.graview-altitude-mark-wing[data-side="right"] {
|
|
62
|
+
transform: translate(calc(-4.4px * var(--graview-altitude)), calc(-0.8px * var(--graview-altitude)));
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
${ /* A card on the kinds plane.
|
|
66
|
+
*
|
|
67
|
+
* Title and count only at rest — a strip of ten cards each showing three
|
|
68
|
+
* truncated member names is ten unreadable things, and the members are not
|
|
69
|
+
* what you are asking the strip. Hovering lifts one and reveals the kind's
|
|
70
|
+
* own description, which the declaration has always carried and nothing has
|
|
71
|
+
* ever shown. */""}
|
|
72
|
+
.graview-kind-card {
|
|
73
|
+
height: 100%;
|
|
74
|
+
transition: transform 170ms cubic-bezier(0.22, 1, 0.36, 1), height 170ms ease,
|
|
75
|
+
box-shadow 170ms ease;
|
|
76
|
+
${ /* IN THE STACK NOTHING HANGS BELOW A CARD. The iso block rests eighteen
|
|
77
|
+
pixels low there, invisible, ready to rise — and an invisible box that
|
|
78
|
+
pokes under the bottom row still made the stage scroll by nine pixels
|
|
79
|
+
with nowhere to scroll. Clipped (not hidden: no scroll container, no
|
|
80
|
+
scrollable overflow), and let out again from altitude, where the plate
|
|
81
|
+
floats above the card and the block stands up out of it. */""}
|
|
82
|
+
overflow: clip;
|
|
83
|
+
}
|
|
84
|
+
.graview-kind-card:hover,
|
|
85
|
+
.graview-kind-card:focus-within {
|
|
86
|
+
height: auto;
|
|
87
|
+
transform: translateY(-4px) scale(1.05);
|
|
88
|
+
box-shadow: var(--graview-lift-high);
|
|
89
|
+
position: relative;
|
|
90
|
+
z-index: ${SCENE_LAYERS.lines};
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
${ /* The district-open control and its roster: altitude-only chrome. Inside
|
|
94
|
+
the stack expanding dissolves a card, so the control does not exist
|
|
95
|
+
there. A full fingertip even though the glyph is small — the audit holds
|
|
96
|
+
every control to 24px. */""}
|
|
97
|
+
.graview-kind-open { display: none; }
|
|
98
|
+
${ /* The roster reads as a LIST, one member a row — chips wrapping at their
|
|
99
|
+
own widths read as spilled tiles, and a district's population is a roll
|
|
100
|
+
call, not a mosaic. */""}
|
|
101
|
+
|
|
102
|
+
${ /* A DRIVE-IN: a dark screen standing on the plot, and the showings under
|
|
103
|
+
it as a marquee of real buttons. Only from altitude; the same list the
|
|
104
|
+
places tabs carry, drawn where the pictures live. */""}
|
|
105
|
+
.graview-drive-in {
|
|
106
|
+
${ /* Its own block under the nameplate, never a row inside the pill: the
|
|
107
|
+
pill is one line of name and count, and a marquee flattened into it
|
|
108
|
+
read as "12 • shown above The month The week". On a box the pill sits
|
|
109
|
+
on the roof at the top of the card, so the marquee hangs under it; on
|
|
110
|
+
a landmark the pill floats above the card, so the marquee takes the
|
|
111
|
+
card's own top edge. */""}
|
|
112
|
+
position: absolute;
|
|
113
|
+
left: 50%;
|
|
114
|
+
top: 42px;
|
|
115
|
+
transform: translateX(-50%);
|
|
116
|
+
z-index: ${SCENE_LAYERS.lines};
|
|
117
|
+
display: grid;
|
|
118
|
+
justify-items: center;
|
|
119
|
+
gap: 4px;
|
|
120
|
+
animation: graview-settle 240ms ease backwards;
|
|
121
|
+
}
|
|
122
|
+
[data-graview-landmark] .graview-drive-in {
|
|
123
|
+
top: 4px;
|
|
124
|
+
}
|
|
125
|
+
${ /* THE SHOWINGS, BY NAME (FR-118): a column of names hanging off the
|
|
126
|
+
signpost's post, each whole and wrapped rather than cut, the one showing
|
|
127
|
+
now marked by the post's rule in the accent. Words on the ground, haloed
|
|
128
|
+
in the ground's color like the district's own name — no capsules, no
|
|
129
|
+
pictures drawn too small to read. */""}
|
|
130
|
+
.graview-drive-in-marquee {
|
|
131
|
+
display: grid;
|
|
132
|
+
gap: ${MARQUEE_GAP}px;
|
|
133
|
+
width: ${MARQUEE_WIDTH}px;
|
|
134
|
+
justify-items: stretch;
|
|
135
|
+
}
|
|
136
|
+
.graview-drive-in-thumb {
|
|
137
|
+
position: relative;
|
|
138
|
+
display: block;
|
|
139
|
+
box-sizing: border-box;
|
|
140
|
+
min-height: max(1.5rem, 24px);
|
|
141
|
+
padding: 3px 6px 3px 10px;
|
|
142
|
+
border-left: 2px solid var(--graview-edge-bright, var(--graview-edge));
|
|
143
|
+
color: var(--graview-ink);
|
|
144
|
+
font: inherit;
|
|
145
|
+
text-align: left;
|
|
146
|
+
}
|
|
147
|
+
.graview-drive-in-thumb[data-graview-pressed] {
|
|
148
|
+
border-left-color: var(--graview-accent);
|
|
149
|
+
color: var(--graview-accent);
|
|
150
|
+
}
|
|
151
|
+
${ /* The press: the whole name, laid over it. */""}
|
|
152
|
+
.graview-drive-in-thumb-press {
|
|
153
|
+
position: absolute;
|
|
154
|
+
inset: 0;
|
|
155
|
+
min-height: max(1.5rem, 24px);
|
|
156
|
+
margin: 0;
|
|
157
|
+
padding: 0;
|
|
158
|
+
border: none;
|
|
159
|
+
border-radius: 0 4px 4px 0;
|
|
160
|
+
background: transparent;
|
|
161
|
+
box-shadow: none;
|
|
162
|
+
cursor: pointer;
|
|
163
|
+
}
|
|
164
|
+
.graview-drive-in-thumb-press:hover {
|
|
165
|
+
background: color-mix(in srgb, var(--graview-accent) 8%, transparent);
|
|
166
|
+
}
|
|
167
|
+
.graview-drive-in-thumb-press:focus-visible {
|
|
168
|
+
outline: 2px solid var(--graview-accent);
|
|
169
|
+
outline-offset: 1px;
|
|
170
|
+
}
|
|
171
|
+
.graview-drive-in-thumb-title {
|
|
172
|
+
display: block;
|
|
173
|
+
font-size: 0.8125rem;
|
|
174
|
+
font-weight: 500;
|
|
175
|
+
line-height: 1.25;
|
|
176
|
+
overflow-wrap: anywhere;
|
|
177
|
+
text-shadow: 0 0 3px var(--graview-ground), 0 0 6px var(--graview-ground);
|
|
178
|
+
}
|
|
179
|
+
.graview-drive-in-thumb[data-graview-pressed] .graview-drive-in-thumb-title {
|
|
180
|
+
font-weight: 600;
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
${ /* THE OTHERS: people and their agents in the city, each a small figure in
|
|
184
|
+
the scene's own line vocabulary with a name under it. They move by a
|
|
185
|
+
transition on transform — one number, the layout tween's curve — so a
|
|
186
|
+
quiet city runs nothing. This tab's own seat is not drawn here: the
|
|
187
|
+
ask field is where it speaks. */""}
|
|
188
|
+
.graview-occupants {
|
|
189
|
+
position: absolute;
|
|
190
|
+
inset: 0;
|
|
191
|
+
pointer-events: none;
|
|
192
|
+
z-index: ${SCENE_LAYERS.occupants};
|
|
193
|
+
}
|
|
194
|
+
.graview-figure {
|
|
195
|
+
position: absolute;
|
|
196
|
+
left: 0;
|
|
197
|
+
top: 0;
|
|
198
|
+
width: 0;
|
|
199
|
+
height: 0;
|
|
200
|
+
pointer-events: none;
|
|
201
|
+
transition: transform 420ms cubic-bezier(0.33, 0, 0.2, 1);
|
|
202
|
+
will-change: transform;
|
|
203
|
+
}
|
|
204
|
+
.graview-figure-body {
|
|
205
|
+
position: absolute;
|
|
206
|
+
left: -16px;
|
|
207
|
+
top: -38px;
|
|
208
|
+
width: 32px;
|
|
209
|
+
height: 38px;
|
|
210
|
+
min-height: max(1.5rem, 24px);
|
|
211
|
+
padding: 0;
|
|
212
|
+
border: 0;
|
|
213
|
+
background: transparent;
|
|
214
|
+
color: hsl(var(--graview-hue, 200) 50% 48%);
|
|
215
|
+
cursor: pointer;
|
|
216
|
+
pointer-events: auto;
|
|
217
|
+
border-radius: 6px;
|
|
218
|
+
}
|
|
219
|
+
.graview-figure-body:focus-visible {
|
|
220
|
+
outline: 2px solid var(--graview-accent);
|
|
221
|
+
outline-offset: 2px;
|
|
222
|
+
}
|
|
223
|
+
.graview-figure-body svg {
|
|
224
|
+
display: block;
|
|
225
|
+
width: 32px;
|
|
226
|
+
height: 38px;
|
|
227
|
+
overflow: visible;
|
|
228
|
+
}
|
|
229
|
+
.graview-figure[data-graview-mode="following"] .graview-figure-body {
|
|
230
|
+
color: var(--graview-accent);
|
|
231
|
+
}
|
|
232
|
+
.graview-figure[data-graview-mode="refused"] .graview-figure-body {
|
|
233
|
+
color: var(--graview-warn);
|
|
234
|
+
}
|
|
235
|
+
.graview-figure-name {
|
|
236
|
+
position: absolute;
|
|
237
|
+
left: 50%;
|
|
238
|
+
top: 2px;
|
|
239
|
+
transform: translateX(-50%);
|
|
240
|
+
white-space: nowrap;
|
|
241
|
+
font-size: 0.75rem;
|
|
242
|
+
letter-spacing: 0.08em;
|
|
243
|
+
text-transform: uppercase;
|
|
244
|
+
color: var(--graview-ink-muted);
|
|
245
|
+
pointer-events: none;
|
|
246
|
+
}
|
|
247
|
+
${ /* ANOTHER PERSON, on your map: a head and shoulders in their own hue, at
|
|
248
|
+
the plot their stop names or in the audience row of the showing they are
|
|
249
|
+
watching. Press to follow them; their name is under them like a robot's. */""}
|
|
250
|
+
.graview-figure[data-graview-person] .graview-figure-body {
|
|
251
|
+
left: -11px;
|
|
252
|
+
top: -24px;
|
|
253
|
+
width: 22px;
|
|
254
|
+
height: 24px;
|
|
255
|
+
min-height: 0;
|
|
256
|
+
}
|
|
257
|
+
.graview-figure[data-graview-person] .graview-figure-body svg {
|
|
258
|
+
width: 22px;
|
|
259
|
+
height: 24px;
|
|
260
|
+
}
|
|
261
|
+
.graview-figure[data-graview-person][data-graview-followed] .graview-figure-body {
|
|
262
|
+
color: var(--graview-accent);
|
|
263
|
+
}
|
|
264
|
+
${ /* Their robot, beside them, captioned as theirs. */""}
|
|
265
|
+
.graview-figure[data-graview-theirs] .graview-figure-body {
|
|
266
|
+
opacity: 0.85;
|
|
267
|
+
}
|
|
268
|
+
${ /* More than a row can hold, and the anonymous: a number where they stand. */""}
|
|
269
|
+
.graview-figure-count {
|
|
270
|
+
position: absolute;
|
|
271
|
+
transform: translate(-50%, -100%);
|
|
272
|
+
padding: 1px 7px;
|
|
273
|
+
border-radius: 999px;
|
|
274
|
+
border: 1px solid var(--graview-edge);
|
|
275
|
+
background: var(--graview-float);
|
|
276
|
+
color: var(--graview-ink-muted);
|
|
277
|
+
font-size: 0.75rem;
|
|
278
|
+
white-space: nowrap;
|
|
279
|
+
pointer-events: auto;
|
|
280
|
+
}
|
|
281
|
+
${ /* What somebody else is pointing at, outlined in their color. */""}
|
|
282
|
+
.graview-presence-over {
|
|
283
|
+
position: absolute;
|
|
284
|
+
border: 2px solid hsl(var(--graview-hue, 200) 55% 52%);
|
|
285
|
+
border-radius: 8px;
|
|
286
|
+
pointer-events: none;
|
|
287
|
+
opacity: 0.75;
|
|
288
|
+
transition: left 200ms ease, top 200ms ease, width 200ms ease, height 200ms ease;
|
|
289
|
+
}
|
|
290
|
+
${ /* Off the visible ground: an indicator at the border, pointing at it. */""}
|
|
291
|
+
.graview-figure-edge {
|
|
292
|
+
position: absolute;
|
|
293
|
+
min-height: max(1.5rem, 24px);
|
|
294
|
+
padding: 3px 8px;
|
|
295
|
+
border-radius: 999px;
|
|
296
|
+
border: 1px solid var(--graview-edge);
|
|
297
|
+
background: var(--graview-float);
|
|
298
|
+
color: var(--graview-ink-muted);
|
|
299
|
+
font-size: 0.75rem;
|
|
300
|
+
white-space: nowrap;
|
|
301
|
+
pointer-events: auto;
|
|
302
|
+
cursor: pointer;
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
.graview-kind-members {
|
|
306
|
+
display: flex;
|
|
307
|
+
flex-direction: column;
|
|
308
|
+
align-items: stretch;
|
|
309
|
+
gap: 3px;
|
|
310
|
+
margin-top: 7px;
|
|
311
|
+
animation: graview-settle 240ms ease backwards;
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
${ /* The way into the archive, on the card that fed it: quiet, but a real
|
|
315
|
+
control at a real size. */""}
|
|
316
|
+
.graview-kind-past {
|
|
317
|
+
display: inline-flex;
|
|
318
|
+
align-items: center;
|
|
319
|
+
flex: 0 0 auto;
|
|
320
|
+
${ /* The same floor as the disclosure beside it — see .graview-kind-open. */""}
|
|
321
|
+
min-height: max(1.5rem, 24px);
|
|
322
|
+
padding: 1px 8px;
|
|
323
|
+
margin: -3px 0;
|
|
324
|
+
border-radius: 999px;
|
|
325
|
+
border: 1px dashed var(--graview-edge);
|
|
326
|
+
background: none;
|
|
327
|
+
box-shadow: none;
|
|
328
|
+
color: var(--graview-ink-faint);
|
|
329
|
+
cursor: pointer;
|
|
330
|
+
font-size: 0.75rem;
|
|
331
|
+
white-space: nowrap;
|
|
332
|
+
}
|
|
333
|
+
.graview-kind-past:hover {
|
|
334
|
+
color: var(--graview-accent);
|
|
335
|
+
border-color: var(--graview-accent-dim);
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
${ /* A SEARCH OVER THE CITY. The districts the words found are lit and say how
|
|
339
|
+
many; the rest recede — the same dimming a selection's reach has always
|
|
340
|
+
used, so a search reads as "where the thing is", not as a new mode. The
|
|
341
|
+
count is the way in: a real control, the words carried down. */""}
|
|
342
|
+
.graview-kind-card[data-graview-emphasis="dimmed"] {
|
|
343
|
+
opacity: 0.42;
|
|
344
|
+
transition: opacity 160ms ease;
|
|
345
|
+
}
|
|
346
|
+
.graview-kind-card[data-graview-emphasis="lit"] {
|
|
347
|
+
z-index: ${SCENE_LAYERS.stage};
|
|
348
|
+
}
|
|
349
|
+
.graview-kind-card[data-graview-emphasis="lit"] .graview-kind-face {
|
|
350
|
+
border-color: var(--graview-accent) !important;
|
|
351
|
+
box-shadow: 0 0 0 1px var(--graview-accent-dim);
|
|
352
|
+
}
|
|
353
|
+
.graview-kind-hits {
|
|
354
|
+
display: inline-flex;
|
|
355
|
+
align-items: center;
|
|
356
|
+
flex: 0 0 auto;
|
|
357
|
+
min-height: max(1.5rem, 24px);
|
|
358
|
+
padding: 1px 8px;
|
|
359
|
+
margin: -3px 0;
|
|
360
|
+
border-radius: 999px;
|
|
361
|
+
border: 1px solid var(--graview-accent);
|
|
362
|
+
background: none;
|
|
363
|
+
box-shadow: none;
|
|
364
|
+
color: var(--graview-accent);
|
|
365
|
+
cursor: pointer;
|
|
366
|
+
font-size: 0.75rem;
|
|
367
|
+
font-variant-numeric: tabular-nums;
|
|
368
|
+
white-space: nowrap;
|
|
369
|
+
}
|
|
370
|
+
@media (prefers-reduced-motion: reduce) {
|
|
371
|
+
.graview-kind-card[data-graview-emphasis="dimmed"] { transition: none; }
|
|
372
|
+
}
|
|
373
|
+
|
|
374
|
+
${ /* A district STANDS: an isometric block — roof, two shaded walls — whose
|
|
375
|
+
height is its population. Always in the tree, faded and settled by the
|
|
376
|
+
altitude number: rising, each block grows up out of its card while the
|
|
377
|
+
card flies to its ring stop — a morph, not a cut. At altitude zero it is
|
|
378
|
+
fully transparent and costs nothing. */""}
|
|
379
|
+
.graview-kind-block {
|
|
380
|
+
display: block;
|
|
381
|
+
${ /* Architecture, not a control: clicks fall through to the card, and an
|
|
382
|
+
invisible in-stack block must never sit over a neighbor's tuck. */""}
|
|
383
|
+
pointer-events: none;
|
|
384
|
+
position: absolute;
|
|
385
|
+
left: 8%;
|
|
386
|
+
bottom: 2px;
|
|
387
|
+
width: 84%;
|
|
388
|
+
height: auto;
|
|
389
|
+
${ /* Under a marquee the block keeps out of its band: the drawing scales down inside the box. */""}
|
|
390
|
+
max-height: calc(100% - var(--graview-marquee-room, 0px));
|
|
391
|
+
opacity: var(--graview-altitude);
|
|
392
|
+
transform: translateY(calc((1 - var(--graview-altitude)) * 18px));
|
|
393
|
+
filter: drop-shadow(${scheme === "light" ? "10px 7px 14px rgba(20,30,32,0.28)" : "12px 8px 18px rgba(0,0,0,0.6)"});
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
${ /* WHERE THE KIND HAS ITS OWN DRAWING, the drawing is the building.
|
|
397
|
+
Same footprint as the block, same ground line, same cast shadow — the
|
|
398
|
+
difference is that the district is now a person, a plot or a vehicle
|
|
399
|
+
rather than one more box. Size carries the population the box's height
|
|
400
|
+
used to: the rise the card computed, in a channel a drawing can use.
|
|
401
|
+
|
|
402
|
+
Stroke weight is set HERE rather than in the art, because the art is
|
|
403
|
+
drawn to read at twenty pixels and a 1.4-unit stroke on a 24-unit box
|
|
404
|
+
becomes a six-pixel marker line at a hundred. Thinned to a drafting
|
|
405
|
+
line, which is what a blueprint of a thing looks like. */""}
|
|
406
|
+
.graview-kind-landmark {
|
|
407
|
+
display: block;
|
|
408
|
+
left: 50%;
|
|
409
|
+
${ /* The block's own two pixels of ground clearance, kept: at altitude zero
|
|
410
|
+
every block is pushed eighteen pixels down as part of the morph, and
|
|
411
|
+
without them the drawing hangs two pixels past the bottom of the scene
|
|
412
|
+
and gives the whole page a scrollbar's worth of overflow. */""}
|
|
413
|
+
bottom: 2px;
|
|
414
|
+
aspect-ratio: 1;
|
|
415
|
+
${ /* Sized by the card's HEIGHT, not its width: a district card is wider
|
|
416
|
+
than it is tall, and a square drawing at 96% of the width stood a third
|
|
417
|
+
of itself above the card and back through the nameplate. Population is
|
|
418
|
+
in the drawing's size either way — the same rise the box's height
|
|
419
|
+
carried, 10 for a district of one and 46 for the largest. */""}
|
|
420
|
+
height: calc((100% - var(--graview-marquee-room, 0px)) * (0.72 + var(--graview-rise, 24) * 0.008));
|
|
421
|
+
width: auto;
|
|
422
|
+
${ /* AND IT KEEPS UP WITH THE WORDS. The card is laid out in pixels off the
|
|
423
|
+
stage and the nameplate is sized in rem, so a reader on Largest doubled
|
|
424
|
+
every name in the city while every drawing under one stayed exactly the
|
|
425
|
+
size it was — a postage stamp under a headline. A floor in em ties the
|
|
426
|
+
drawing to the same number the names follow; at the browser's own size
|
|
427
|
+
it is below what the card already gives and nothing moves.
|
|
428
|
+
|
|
429
|
+
Capped at the card, because a floor alone overflowed it: the drawings
|
|
430
|
+
grew past the box they stand in and were sliced off at the bottom
|
|
431
|
+
edge — a plot that reads as a V rather than a bed. The card's own
|
|
432
|
+
height is what the picture can actually show, and the CARD is the thing
|
|
433
|
+
that still does not follow the reader's size (see below).
|
|
434
|
+
|
|
435
|
+
(No back ticks in here: this whole stylesheet is a template literal,
|
|
436
|
+
and one of them ends it.) */""}
|
|
437
|
+
min-height: min(5em, calc(96% - var(--graview-marquee-room, 0px)));
|
|
438
|
+
${ /* The morph is a GROWTH from the ground line, not a drop: a block slides
|
|
439
|
+
eighteen pixels down at altitude zero and grows up out of the card, and
|
|
440
|
+
a drawing given the same treatment hangs below the card it belongs to —
|
|
441
|
+
two pixels past the bottom of the scene on the lowest row, which is a
|
|
442
|
+
scrollbar on every ground-level screen in the app. Scaling from the
|
|
443
|
+
drawing's own feet is the same reading and costs nothing below. */""}
|
|
444
|
+
transform-origin: bottom center;
|
|
445
|
+
transform: translateX(-50%) scale(calc(0.55 + var(--graview-altitude) * 0.45));
|
|
446
|
+
${ /* A cast shadow belongs to a solid; on a line drawing it is a blurred
|
|
447
|
+
second copy of every stroke. The drawing keeps a hint of one so it
|
|
448
|
+
still stands on the lattice rather than floating over it. */""}
|
|
449
|
+
filter: drop-shadow(${scheme === "light" ? "6px 5px 7px rgba(20,30,32,0.16)" : "7px 6px 9px rgba(0,0,0,0.45)"});
|
|
450
|
+
}
|
|
451
|
+
${ /* The nameplate floats ABOVE a drawing rather than standing on it. On a box
|
|
452
|
+
the pill sits on the roof, which is what a label does over a building; on
|
|
453
|
+
a figure the same 2% put it across the head. */""}
|
|
454
|
+
|
|
455
|
+
.graview-kind-landmark [data-graview-figure] {
|
|
456
|
+
width: 100% !important;
|
|
457
|
+
height: 100% !important;
|
|
458
|
+
color: hsl(var(--graview-hue, 200) ${scheme === "light" ? "42% 44%" : "45% 62%"}) !important;
|
|
459
|
+
}
|
|
460
|
+
.graview-kind-landmark svg {
|
|
461
|
+
width: 100%;
|
|
462
|
+
height: 100%;
|
|
463
|
+
stroke-width: 0.85;
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
${ /* From altitude the card's face becomes the district's NAMEPLATE: an
|
|
467
|
+
upright pill standing on the roof, the way a label floats over a building
|
|
468
|
+
in any city view — the block carries the architecture, the pill carries
|
|
469
|
+
the words. Inline styles drew the in-stack card, so the pill overrides
|
|
470
|
+
must outrank them. */""}
|
|
471
|
+
.graview-kind-face {
|
|
472
|
+
transition: border-radius 640ms cubic-bezier(0.33, 0, 0.2, 1),
|
|
473
|
+
padding 640ms cubic-bezier(0.33, 0, 0.2, 1),
|
|
474
|
+
box-shadow 640ms ease;
|
|
475
|
+
}
|
|
476
|
+
|
|
477
|
+
${ /* THE SEAT'S MARK on what it just wrote: its own glyph, in its own hue, at
|
|
478
|
+
the thing's top-right corner. It arrives with the change and fades with
|
|
479
|
+
it. */""}
|
|
480
|
+
.graview-seat-marks {
|
|
481
|
+
position: absolute;
|
|
482
|
+
inset: 0;
|
|
483
|
+
pointer-events: none;
|
|
484
|
+
z-index: ${SCENE_LAYERS.seatMarks};
|
|
485
|
+
}
|
|
486
|
+
.graview-seat-mark {
|
|
487
|
+
position: absolute;
|
|
488
|
+
display: grid;
|
|
489
|
+
place-items: center;
|
|
490
|
+
width: 16px;
|
|
491
|
+
height: 16px;
|
|
492
|
+
margin: -8px 0 0 -8px;
|
|
493
|
+
border-radius: 999px;
|
|
494
|
+
border: 1px solid var(--graview-edge);
|
|
495
|
+
background: var(--graview-float);
|
|
496
|
+
color: oklch(0.62 0.16 var(--graview-hue, 250));
|
|
497
|
+
font-size: 0.6875rem;
|
|
498
|
+
line-height: 1;
|
|
499
|
+
box-shadow: var(--graview-lift-low);
|
|
500
|
+
animation: graview-seat-mark 4000ms ease-out forwards;
|
|
501
|
+
}
|
|
502
|
+
${ /* A QUESTION THE SEAT ASKED, standing at the node it is about: it says
|
|
503
|
+
itself and waits, because a dot nobody can read is a question nobody
|
|
504
|
+
answers. It does not fade — an unanswered question is still open. */""}
|
|
505
|
+
.graview-seat-asking {
|
|
506
|
+
position: absolute;
|
|
507
|
+
transform: translate(-50%, -100%);
|
|
508
|
+
display: inline-flex;
|
|
509
|
+
align-items: center;
|
|
510
|
+
gap: 6px;
|
|
511
|
+
max-width: 260px;
|
|
512
|
+
padding: 3px 9px 3px 6px;
|
|
513
|
+
border-radius: 999px;
|
|
514
|
+
border: 1px solid var(--graview-accent);
|
|
515
|
+
background: var(--graview-float);
|
|
516
|
+
color: var(--graview-ink);
|
|
517
|
+
font-size: 0.75rem;
|
|
518
|
+
line-height: 1.3;
|
|
519
|
+
box-shadow: var(--graview-lift-low);
|
|
520
|
+
pointer-events: auto;
|
|
521
|
+
}
|
|
522
|
+
.graview-seat-asking > [aria-hidden] {
|
|
523
|
+
display: grid;
|
|
524
|
+
place-items: center;
|
|
525
|
+
width: 14px;
|
|
526
|
+
height: 14px;
|
|
527
|
+
border-radius: 999px;
|
|
528
|
+
background: var(--graview-accent);
|
|
529
|
+
color: var(--graview-panel);
|
|
530
|
+
font-size: 0.6875rem;
|
|
531
|
+
}
|
|
532
|
+
.graview-seat-asking-said {
|
|
533
|
+
overflow: hidden;
|
|
534
|
+
text-overflow: ellipsis;
|
|
535
|
+
white-space: nowrap;
|
|
536
|
+
}
|
|
537
|
+
|
|
538
|
+
@keyframes graview-seat-mark {
|
|
539
|
+
0% { opacity: 0; transform: translateY(3px) scale(0.8); }
|
|
540
|
+
8% { opacity: 1; transform: none; }
|
|
541
|
+
80% { opacity: 1; }
|
|
542
|
+
100% { opacity: 0; }
|
|
543
|
+
}
|
|
544
|
+
@media (prefers-reduced-motion: reduce) {
|
|
545
|
+
.graview-figure { transition: none; }
|
|
546
|
+
}
|
|
547
|
+
|
|
23
548
|
[data-graview-altitude] .graview-kind-card {
|
|
24
549
|
overflow: visible;
|
|
25
550
|
}
|
package/dist/scene-css.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scene-css.js","sourceRoot":"","sources":["../src/scene-css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAoC,MAAM,YAAY,CAAC;AACtG,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C;;;;;;;;;;;;;GAaG;AAEH,MAAM,IAAI,GAAG,CAAC,CAAU,EAAU,EAAE,CAAC,GAAG,CAAC,CAAC,UAAU,KAAK,CAAC,CAAC,SAAS,GAAG,CAAC;AACxE,MAAM,IAAI,GAAG,CAAC,CAAU,EAAU,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,CAAC;AAE/D,SAAS,UAAU,CAAC,MAAc;IAChC,MAAM,GAAG,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO;;;;
|
|
1
|
+
{"version":3,"file":"scene-css.js","sourceRoot":"","sources":["../src/scene-css.ts"],"names":[],"mappings":"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"}
|
package/dist/scene.d.ts
CHANGED
|
@@ -12,12 +12,15 @@
|
|
|
12
12
|
* drawn (`fetchDeclaredLenses`).
|
|
13
13
|
*/
|
|
14
14
|
export { sceneCss } from "./scene-css.js";
|
|
15
|
-
export {
|
|
16
|
-
export
|
|
15
|
+
export { SeatField } from "./seat-field.js";
|
|
16
|
+
export { DraftDoor } from "./draft-door.js";
|
|
17
|
+
export type { SeatFieldProps, SeatStart } from "./seat-field.js";
|
|
18
|
+
export { LinesKey } from "./lines-key.js";
|
|
17
19
|
export { Inspector } from "./workbench/inspector.js";
|
|
18
20
|
export { OverviewButton } from "./workbench/back-out.js";
|
|
19
21
|
export { Places } from "./places.js";
|
|
20
22
|
export { ShowInstallation } from "./installation.js";
|
|
21
23
|
export { FindBox } from "./find.js";
|
|
22
24
|
export { viewsCss } from "./views-css.js";
|
|
25
|
+
export { SceneBarTools, SceneTrail, useCallLog } from "./scene-bar.js";
|
|
23
26
|
//# sourceMappingURL=scene.d.ts.map
|
package/dist/scene.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scene.d.ts","sourceRoot":"","sources":["../src/scene.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"scene.d.ts","sourceRoot":"","sources":["../src/scene.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,YAAY,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}
|
package/dist/scene.js
CHANGED
|
@@ -13,11 +13,15 @@
|
|
|
13
13
|
*/
|
|
14
14
|
/* The scene's own rules, drawn by the scene face after the frame's sheet (FR-104). */
|
|
15
15
|
export { sceneCss } from "./scene-css.js";
|
|
16
|
-
export {
|
|
16
|
+
export { SeatField } from "./seat-field.js";
|
|
17
|
+
export { DraftDoor } from "./draft-door.js";
|
|
18
|
+
export { LinesKey } from "./lines-key.js";
|
|
17
19
|
export { Inspector } from "./workbench/inspector.js";
|
|
18
20
|
export { OverviewButton } from "./workbench/back-out.js";
|
|
19
21
|
export { Places } from "./places.js";
|
|
20
22
|
export { ShowInstallation } from "./installation.js";
|
|
21
23
|
export { FindBox } from "./find.js";
|
|
22
24
|
export { viewsCss } from "./views-css.js";
|
|
25
|
+
/* What the scene puts in the one bar — its Find and its Activity — and what it keeps on its picture: the same on the whole-page Shell and an embed. */
|
|
26
|
+
export { SceneBarTools, SceneTrail, useCallLog } from "./scene-bar.js";
|
|
23
27
|
//# sourceMappingURL=scene.js.map
|
package/dist/scene.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scene.js","sourceRoot":"","sources":["../src/scene.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,sFAAsF;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"scene.js","sourceRoot":"","sources":["../src/scene.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,sFAAsF;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,uJAAuJ;AACvJ,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { type AnySchema } from "@graview/core";
|
|
2
|
+
import type { Responder, ToolCall } from "@graview/tools";
|
|
3
|
+
import type { SeatPanelProps } from "./seat-panel.js";
|
|
4
|
+
/**
|
|
5
|
+
* THE SEAT FLOATS, AND IS QUIET.
|
|
6
|
+
*
|
|
7
|
+
* It was a rail down the scene's left edge — "SELECTED · Pay the deposit",
|
|
8
|
+
* nine acts with nine stars, a filter field, "Show 1 more", three canned
|
|
9
|
+
* questions, the relations, a log, the key to the lines — and on Pages a
|
|
10
|
+
* "◆ Ask" pill that opened the same rail as a drawer, beside the record
|
|
11
|
+
* page's own acts. A person read it as everything that could be done with
|
|
12
|
+
* the selected thing, in the mutations' own words.
|
|
13
|
+
*
|
|
14
|
+
* Now it is one quiet field at the foot of the picture, "Ask Things…",
|
|
15
|
+
* the Find box's geometry and nothing more. Asked, it grows up from the
|
|
16
|
+
* field into a panel over the picture — never pushing the page — that says
|
|
17
|
+
* where you are in a line, offers a few things to ask and at most three
|
|
18
|
+
* acts, and holds the conversation. A ⇄ snaps it to the other foot; on a
|
|
19
|
+
* phone it is a bottom sheet with a grab line to put it away. The same
|
|
20
|
+
* seat on the scene and on Pages, holding the app's one conversation.
|
|
21
|
+
*
|
|
22
|
+
* This file is what a page carries up front: the field. The panel —
|
|
23
|
+
* the conversation, the models behind it, what it offers — is fetched when
|
|
24
|
+
* the seat is first opened (or reached for), from `./seat-panel.js`.
|
|
25
|
+
*
|
|
26
|
+
* Accessible as a non-modal region named "Ask <the app>": opening it puts
|
|
27
|
+
* the keyboard in the field, Escape closes it and puts the keyboard back
|
|
28
|
+
* where it was, and everything in it is an ordinary button or link in the
|
|
29
|
+
* tab order. The person never reads the word "seat".
|
|
30
|
+
*/
|
|
31
|
+
/** The seat is drawn as an ask field, or not at all (the host's choice). */
|
|
32
|
+
export type SeatStart = "field" | "hidden";
|
|
33
|
+
export interface SeatFieldProps<S extends AnySchema> {
|
|
34
|
+
/** How the seat answers; when unsaid, the graph first and the host's model (`ai` on the provider) after it. */
|
|
35
|
+
readonly respond?: Responder<S>;
|
|
36
|
+
/** Feeds the app's activity rail, like any other seat. */
|
|
37
|
+
readonly onCall?: (call: ToolCall) => void;
|
|
38
|
+
/** Where a name in an answer goes: the scene's own travel when unsaid; a record's page on Pages. */
|
|
39
|
+
readonly onPick?: (id: string) => void;
|
|
40
|
+
/** `"field"` (the default) draws the ask field; `"hidden"` draws no seat at all. */
|
|
41
|
+
readonly start?: SeatStart;
|
|
42
|
+
/** Where an answer takes the app: the router on Pages; the scene's own stops when unsaid. */
|
|
43
|
+
readonly onMove?: SeatPanelProps["onMove"];
|
|
44
|
+
/** The place the reader stands in, by its slug, when the face knows it (Pages' route). */
|
|
45
|
+
readonly place?: string;
|
|
46
|
+
/** A view was drawn: the face shows it (Pages goes to `/~draft`). */
|
|
47
|
+
readonly onDraft?: () => void;
|
|
48
|
+
}
|
|
49
|
+
/** The field's width on a desk, and the gap between it and the picture's edges. */
|
|
50
|
+
export declare const SEAT_WIDTH = 336;
|
|
51
|
+
/** Narrower than this the seat is a field across the foot, and a bottom sheet when open. */
|
|
52
|
+
export declare const SEAT_PHONE_BELOW = 640;
|
|
53
|
+
/**
|
|
54
|
+
* The seat, at the foot of the box it is drawn in — the scene's picture, or
|
|
55
|
+
* on Pages a box the routed face lays over the window (or its embed).
|
|
56
|
+
*/
|
|
57
|
+
export declare function SeatField<S extends AnySchema>({ respond, onCall, onPick, start, onMove, place, onDraft }: SeatFieldProps<S>): import("react").JSX.Element | null;
|
|
58
|
+
//# sourceMappingURL=seat-field.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"seat-field.d.ts","sourceRoot":"","sources":["../src/seat-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,SAAS,EAAE,MAAM,eAAe,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAI1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,4EAA4E;AAC5E,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE3C,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,SAAS;IACjD,+GAA+G;IAC/G,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IAChC,0DAA0D;IAC1D,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC3C,oGAAoG;IACpG,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,oFAAoF;IACpF,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,6FAA6F;IAC7F,QAAQ,CAAC,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC3C,0FAA0F;IAC1F,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,qEAAqE;IACrE,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,mFAAmF;AACnF,eAAO,MAAM,UAAU,MAAM,CAAC;AAE9B,4FAA4F;AAC5F,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAWpC;;;GAGG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,SAAS,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,KAAe,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,cAAc,CAAC,CAAC,CAAC,sCA+LrI"}
|