@rathnasgala/theme 0.0.16 → 0.0.18
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/package.json +1 -1
- package/payload/.gala/managed-files.json +15 -8
- package/payload/lib/performance-budget.js +10 -1
- package/payload/lib/site-config.js +23 -3
- package/payload/src/_includes/components/ui.njk +5 -6
- package/payload/src/_includes/layouts/base.njk +8 -7
- package/payload/src/assets/engagement-comments.js +264 -0
- package/payload/src/assets/engagement-transport.js +73 -0
- package/payload/src/assets/interactions.js +12 -196
- package/payload/src/assets/theme-mode.js +14 -2
- package/payload/src/assets/theme.css +322 -47
- package/payload/src/assets/vendor/hooks.js +2 -0
- package/payload/src/assets/vendor/htm.js +2 -0
- package/payload/src/assets/vendor/preact.js +2 -0
- package/payload/src/assets/vendor/signals-core.js +2 -0
- package/payload/src/assets/vendor/signals.js +2 -0
|
@@ -1,57 +1,181 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* A publication should read like a well-set page, not like a product.
|
|
3
|
+
*
|
|
4
|
+
* The chrome is quiet, the type carries the hierarchy, and depth comes from surface and space
|
|
5
|
+
* rather than from an outline around everything. Every value here is a token so that the ten
|
|
6
|
+
* `design:` choices in site.config.yml can move the whole page by moving a handful of variables,
|
|
7
|
+
* instead of each component inventing its own spacing and its own grey.
|
|
8
|
+
*/
|
|
1
9
|
:root {
|
|
2
10
|
color-scheme: light dark;
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
--gala-
|
|
6
|
-
--gala-
|
|
7
|
-
--gala-color-
|
|
8
|
-
--gala-color-
|
|
9
|
-
--gala-color-
|
|
10
|
-
--gala-
|
|
11
|
-
--gala-
|
|
11
|
+
|
|
12
|
+
/* Neutrals carry a slight warmth. A pure grey reads as unconsidered; these were picked. */
|
|
13
|
+
--gala-color-background: light-dark(#fdfcfb, #131211);
|
|
14
|
+
--gala-color-surface: light-dark(#f6f4f1, #1c1a18);
|
|
15
|
+
--gala-color-raised: light-dark(#fffffe, #24211f);
|
|
16
|
+
--gala-color-text: light-dark(#1a1817, #f2efec);
|
|
17
|
+
--gala-color-muted: light-dark(#6b645e, #a8a099);
|
|
18
|
+
--gala-color-border: light-dark(#968e86, #6b645e);
|
|
19
|
+
--gala-color-hairline: light-dark(#e8e3dd, #2a2724);
|
|
20
|
+
--gala-color-border-strong: light-dark(#c9c2ba, #46413d);
|
|
21
|
+
--gala-color-accent: light-dark(#8a4b2a, #e8a87c);
|
|
22
|
+
|
|
23
|
+
/* Type. One scale, used everywhere, fluid between a phone and a desk. */
|
|
24
|
+
--gala-font-body: ui-sans-serif, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
25
|
+
--gala-font-display: var(--gala-font-body);
|
|
26
|
+
--gala-font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, monospace;
|
|
27
|
+
--gala-text-xs: 0.78rem;
|
|
28
|
+
--gala-text-sm: 0.875rem;
|
|
29
|
+
--gala-text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
|
|
30
|
+
--gala-text-lg: clamp(1.15rem, 1.09rem + 0.3vw, 1.3rem);
|
|
31
|
+
--gala-text-xl: clamp(1.4rem, 1.28rem + 0.6vw, 1.75rem);
|
|
32
|
+
--gala-text-2xl: clamp(1.75rem, 1.5rem + 1.2vw, 2.4rem);
|
|
33
|
+
--gala-text-3xl: clamp(2.2rem, 1.7rem + 2.4vw, 3.4rem);
|
|
34
|
+
--gala-leading-tight: 1.15;
|
|
35
|
+
--gala-leading-body: 1.65;
|
|
36
|
+
--gala-tracking-tight: -0.018em;
|
|
37
|
+
--gala-tracking-wide: 0.08em;
|
|
38
|
+
--gala-weight-display: 640;
|
|
39
|
+
|
|
40
|
+
/* Space, radius, depth, motion. */
|
|
41
|
+
--gala-step: 1rem;
|
|
42
|
+
--gala-space-2xs: calc(var(--gala-step) * 0.25);
|
|
43
|
+
--gala-space-xs: calc(var(--gala-step) * 0.5);
|
|
44
|
+
--gala-space-sm: calc(var(--gala-step) * 0.75);
|
|
45
|
+
--gala-space-md: var(--gala-step);
|
|
46
|
+
--gala-space-lg: calc(var(--gala-step) * 1.75);
|
|
47
|
+
--gala-space-xl: calc(var(--gala-step) * 3);
|
|
48
|
+
--gala-space-page: clamp(1.25rem, 5vw, 4.5rem);
|
|
49
|
+
--gala-radius-control: 0.625rem;
|
|
50
|
+
--gala-radius-surface: 1rem;
|
|
51
|
+
--gala-shadow-low: 0 1px 2px light-dark(rgb(26 24 23 / 6%), rgb(0 0 0 / 40%));
|
|
52
|
+
--gala-shadow-high:
|
|
53
|
+
0 1px 2px light-dark(rgb(26 24 23 / 5%), rgb(0 0 0 / 35%)),
|
|
54
|
+
0 12px 28px -12px light-dark(rgb(26 24 23 / 18%), rgb(0 0 0 / 60%));
|
|
55
|
+
--gala-motion-fast: 120ms;
|
|
56
|
+
--gala-motion-base: 220ms;
|
|
57
|
+
--gala-ease: cubic-bezier(0.2, 0, 0, 1);
|
|
58
|
+
|
|
59
|
+
--gala-content-width: 72rem;
|
|
60
|
+
--gala-measure: 68ch;
|
|
12
61
|
--gala-widget-min-block-size: 8rem;
|
|
13
62
|
}
|
|
14
63
|
|
|
64
|
+
/* An explicit choice must beat the operating system in both directions, so every colour is
|
|
65
|
+
restated rather than left to `light-dark()`. */
|
|
15
66
|
:root[data-mode='light'] {
|
|
16
67
|
color-scheme: light;
|
|
17
|
-
--gala-color-background: #
|
|
18
|
-
--gala-color-
|
|
19
|
-
--gala-color-
|
|
20
|
-
--gala-color-
|
|
21
|
-
--gala-color-
|
|
68
|
+
--gala-color-background: #fdfcfb;
|
|
69
|
+
--gala-color-surface: #f6f4f1;
|
|
70
|
+
--gala-color-raised: #fffffe;
|
|
71
|
+
--gala-color-text: #1a1817;
|
|
72
|
+
--gala-color-muted: #6b645e;
|
|
73
|
+
--gala-color-border: #968e86;
|
|
74
|
+
--gala-color-hairline: #e8e3dd;
|
|
75
|
+
--gala-color-border-strong: #c9c2ba;
|
|
76
|
+
--gala-color-accent: #8a4b2a;
|
|
22
77
|
}
|
|
23
|
-
|
|
24
78
|
:root[data-mode='dark'] {
|
|
25
79
|
color-scheme: dark;
|
|
26
|
-
--gala-color-background: #
|
|
27
|
-
--gala-color-
|
|
28
|
-
--gala-color-
|
|
29
|
-
--gala-color-
|
|
30
|
-
--gala-color-
|
|
80
|
+
--gala-color-background: #131211;
|
|
81
|
+
--gala-color-surface: #1c1a18;
|
|
82
|
+
--gala-color-raised: #24211f;
|
|
83
|
+
--gala-color-text: #f2efec;
|
|
84
|
+
--gala-color-muted: #a8a099;
|
|
85
|
+
--gala-color-border: #6b645e;
|
|
86
|
+
--gala-color-hairline: #2a2724;
|
|
87
|
+
--gala-color-border-strong: #46413d;
|
|
88
|
+
--gala-color-accent: #e8a87c;
|
|
31
89
|
}
|
|
32
90
|
|
|
91
|
+
/* ---------------------------------------------------------------- palettes */
|
|
33
92
|
:root[data-palette='ocean'] {
|
|
34
|
-
--gala-color-background: light-dark(#
|
|
35
|
-
--gala-color-
|
|
36
|
-
--gala-color-
|
|
37
|
-
--gala-color-
|
|
38
|
-
--gala-color-
|
|
93
|
+
--gala-color-background: light-dark(#f8fbfd, #0b1a24);
|
|
94
|
+
--gala-color-surface: light-dark(#eef4f9, #12252f);
|
|
95
|
+
--gala-color-raised: light-dark(#ffffff, #172d39);
|
|
96
|
+
--gala-color-text: light-dark(#12242f, #eaf3f8);
|
|
97
|
+
--gala-color-muted: light-dark(#5a6f7d, #98aebb);
|
|
98
|
+
--gala-color-border: light-dark(#7d8d99, #5f7d8c);
|
|
99
|
+
--gala-color-hairline: light-dark(#dde7ee, #1d3644);
|
|
100
|
+
--gala-color-border-strong: light-dark(#bdccd7, #33505f);
|
|
101
|
+
--gala-color-accent: light-dark(#0f5f7a, #7fd0e8);
|
|
39
102
|
}
|
|
40
|
-
|
|
41
103
|
:root[data-palette='ocean'][data-mode='light'] {
|
|
42
|
-
|
|
43
|
-
--gala-color-
|
|
44
|
-
--gala-color-surface: #
|
|
45
|
-
--gala-color-
|
|
46
|
-
--gala-color-
|
|
104
|
+
color-scheme: light;
|
|
105
|
+
--gala-color-background: #f8fbfd;
|
|
106
|
+
--gala-color-surface: #eef4f9;
|
|
107
|
+
--gala-color-raised: #ffffff;
|
|
108
|
+
--gala-color-text: #12242f;
|
|
109
|
+
--gala-color-muted: #5a6f7d;
|
|
110
|
+
--gala-color-border: #7d8d99;
|
|
111
|
+
--gala-color-hairline: #dde7ee;
|
|
112
|
+
--gala-color-border-strong: #bdccd7;
|
|
113
|
+
--gala-color-accent: #0f5f7a;
|
|
47
114
|
}
|
|
48
|
-
|
|
49
115
|
:root[data-palette='ocean'][data-mode='dark'] {
|
|
50
|
-
|
|
51
|
-
--gala-color-
|
|
52
|
-
--gala-color-surface: #
|
|
53
|
-
--gala-color-
|
|
54
|
-
--gala-color-
|
|
116
|
+
color-scheme: dark;
|
|
117
|
+
--gala-color-background: #0b1a24;
|
|
118
|
+
--gala-color-surface: #12252f;
|
|
119
|
+
--gala-color-raised: #172d39;
|
|
120
|
+
--gala-color-text: #eaf3f8;
|
|
121
|
+
--gala-color-muted: #98aebb;
|
|
122
|
+
--gala-color-border: #5f7d8c;
|
|
123
|
+
--gala-color-hairline: #1d3644;
|
|
124
|
+
--gala-color-border-strong: #33505f;
|
|
125
|
+
--gala-color-accent: #7fd0e8;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
/* ---------------------------------------------------------------- typography
|
|
129
|
+
System stacks rather than a downloaded face: a publication must build and render with no call
|
|
130
|
+
to anyone, and a webfont is bytes on every reader's first paint. These are the good faces the
|
|
131
|
+
reader's machine already has. */
|
|
132
|
+
:root[data-typography='editorial'] {
|
|
133
|
+
--gala-font-body: ui-serif, "Iowan Old Style", Charter, "Source Serif 4", Georgia, serif;
|
|
134
|
+
--gala-font-display: var(--gala-font-body);
|
|
135
|
+
--gala-weight-display: 600;
|
|
136
|
+
}
|
|
137
|
+
:root[data-typography='humanist'] {
|
|
138
|
+
--gala-font-body: Optima, Candara, "Gill Sans", "Trebuchet MS", sans-serif;
|
|
139
|
+
--gala-font-display: var(--gala-font-body);
|
|
140
|
+
}
|
|
141
|
+
:root[data-typography='mono'] {
|
|
142
|
+
--gala-font-display: var(--gala-font-mono);
|
|
143
|
+
--gala-weight-display: 560;
|
|
144
|
+
--gala-tracking-tight: -0.005em;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
/* ---------------------------------------------------------------- density */
|
|
148
|
+
:root[data-density='compact'], :root[data-spacing='compact'] {
|
|
149
|
+
--gala-step: 0.8rem;
|
|
150
|
+
--gala-leading-body: 1.5;
|
|
151
|
+
}
|
|
152
|
+
:root[data-density='spacious'], :root[data-spacing='spacious'] {
|
|
153
|
+
--gala-step: 1.25rem;
|
|
154
|
+
--gala-leading-body: 1.75;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
/* ---------------------------------------------------------------- radius */
|
|
158
|
+
:root[data-radius='sharp'] { --gala-radius-control: 0; --gala-radius-surface: 0; }
|
|
159
|
+
:root[data-radius='round'] { --gala-radius-control: 999px; --gala-radius-surface: 1.5rem; }
|
|
160
|
+
|
|
161
|
+
/* ---------------------------------------------------------------- motion
|
|
162
|
+
`none` is honoured for everyone; a reader who asks the operating system for less motion is
|
|
163
|
+
honoured regardless of what the publication chose. */
|
|
164
|
+
:root[data-motion='none'] { --gala-motion-fast: 0ms; --gala-motion-base: 0ms; }
|
|
165
|
+
:root[data-motion='expressive'] { --gala-motion-base: 340ms; }
|
|
166
|
+
@media (prefers-reduced-motion: reduce) {
|
|
167
|
+
:root { --gala-motion-fast: 0ms; --gala-motion-base: 0ms; }
|
|
168
|
+
*, *::before, *::after { animation-duration: 1ms !important; transition-duration: 1ms !important; }
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
/* ---------------------------------------------------------------- surfaces
|
|
172
|
+
`quiet` sits on the page, `outlined` draws its edge, `raised` lifts. One variable decides,
|
|
173
|
+
so every card, dialog and chip agrees. */
|
|
174
|
+
:root { --gala-surface-border: var(--gala-color-hairline); --gala-surface-shadow: var(--gala-shadow-low); }
|
|
175
|
+
:root[data-component-style='outlined'] { --gala-surface-border: var(--gala-color-border-strong); }
|
|
176
|
+
:root[data-component-style='raised'] {
|
|
177
|
+
--gala-surface-border: transparent;
|
|
178
|
+
--gala-surface-shadow: var(--gala-shadow-high);
|
|
55
179
|
}
|
|
56
180
|
|
|
57
181
|
:root[data-layout='portfolio'] { --gala-content-width: 82rem; }
|
|
@@ -62,6 +186,53 @@ body {
|
|
|
62
186
|
color: var(--gala-color-text);
|
|
63
187
|
background: var(--gala-color-background);
|
|
64
188
|
font-family: var(--gala-font-body);
|
|
189
|
+
font-size: var(--gala-text-base);
|
|
190
|
+
line-height: var(--gala-leading-body);
|
|
191
|
+
-webkit-font-smoothing: antialiased;
|
|
192
|
+
text-rendering: optimizeLegibility;
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
/* Headings carry the hierarchy, so they get the display face, a tighter measure and tighter
|
|
196
|
+
tracking — large type set at body tracking is the single clearest sign of an unconsidered page. */
|
|
197
|
+
:where(h1, h2, h3, h4) {
|
|
198
|
+
font-family: var(--gala-font-display);
|
|
199
|
+
font-weight: var(--gala-weight-display);
|
|
200
|
+
line-height: var(--gala-leading-tight);
|
|
201
|
+
letter-spacing: var(--gala-tracking-tight);
|
|
202
|
+
text-wrap: balance;
|
|
203
|
+
margin-block: 0 var(--gala-space-sm);
|
|
204
|
+
}
|
|
205
|
+
:where(h1) { font-size: var(--gala-text-3xl); }
|
|
206
|
+
:where(h2) { font-size: var(--gala-text-2xl); }
|
|
207
|
+
:where(h3) { font-size: var(--gala-text-xl); }
|
|
208
|
+
:where(h4) { font-size: var(--gala-text-lg); }
|
|
209
|
+
:where(p, ul, ol, blockquote) { margin-block: 0 var(--gala-space-md); }
|
|
210
|
+
:where(p) { text-wrap: pretty; }
|
|
211
|
+
|
|
212
|
+
blockquote {
|
|
213
|
+
margin-inline: 0;
|
|
214
|
+
padding-inline-start: var(--gala-space-md);
|
|
215
|
+
border-inline-start: 2px solid var(--gala-color-accent);
|
|
216
|
+
color: var(--gala-color-muted);
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
:where(code, kbd, samp) { font-family: var(--gala-font-mono); font-size: 0.9em; }
|
|
220
|
+
:where(pre) {
|
|
221
|
+
padding: var(--gala-space-md);
|
|
222
|
+
overflow-x: auto;
|
|
223
|
+
background: var(--gala-color-surface);
|
|
224
|
+
border-radius: var(--gala-radius-control);
|
|
225
|
+
}
|
|
226
|
+
:where(hr) { border: 0; border-block-start: 1px solid var(--gala-color-hairline); margin-block: var(--gala-space-xl); }
|
|
227
|
+
:where(table) { border-collapse: collapse; inline-size: 100%; }
|
|
228
|
+
:where(th, td) { padding: var(--gala-space-xs) var(--gala-space-sm); border-block-end: 1px solid var(--gala-color-hairline); text-align: start; }
|
|
229
|
+
|
|
230
|
+
/* An uppercase label needs air between the letters or it sets as a solid block. */
|
|
231
|
+
.gala-eyebrow, .gala-comment__meta time, .gala-comment__edited {
|
|
232
|
+
font-size: var(--gala-text-xs);
|
|
233
|
+
letter-spacing: var(--gala-tracking-wide);
|
|
234
|
+
text-transform: uppercase;
|
|
235
|
+
color: var(--gala-color-muted);
|
|
65
236
|
}
|
|
66
237
|
|
|
67
238
|
.gala-site-header {
|
|
@@ -85,9 +256,16 @@ body {
|
|
|
85
256
|
border: 0.125rem solid transparent;
|
|
86
257
|
border-radius: 50%;
|
|
87
258
|
}
|
|
88
|
-
.gala-icon-control
|
|
259
|
+
.gala-icon-control {
|
|
260
|
+
transition: background var(--gala-motion-fast) var(--gala-ease),
|
|
261
|
+
color var(--gala-motion-fast) var(--gala-ease);
|
|
262
|
+
color: var(--gala-color-muted);
|
|
263
|
+
}
|
|
264
|
+
.gala-icon-control:hover { background: var(--gala-color-surface); color: var(--gala-color-text); }
|
|
89
265
|
.gala-icon-control:focus-visible { outline: 0.1875rem solid currentcolor; outline-offset: 0.1875rem; }
|
|
90
|
-
|
|
266
|
+
/* Stroked, not filled: the icons are drawn on one 24px grid at a single weight, so they read as
|
|
267
|
+
a set rather than as six unrelated silhouettes. */
|
|
268
|
+
.gala-icon-control svg { inline-size: 100%; block-size: 100%; fill: none; stroke: currentcolor; }
|
|
91
269
|
|
|
92
270
|
.gala-dialog {
|
|
93
271
|
inline-size: min(42rem, calc(100% - 2rem));
|
|
@@ -96,8 +274,9 @@ body {
|
|
|
96
274
|
padding: 1.5rem;
|
|
97
275
|
color: var(--gala-color-text);
|
|
98
276
|
background: var(--gala-color-background);
|
|
99
|
-
border:
|
|
100
|
-
border-radius: var(--gala-radius-
|
|
277
|
+
border: 1px solid var(--gala-surface-border);
|
|
278
|
+
border-radius: var(--gala-radius-surface);
|
|
279
|
+
box-shadow: var(--gala-shadow-high);
|
|
101
280
|
}
|
|
102
281
|
.gala-dialog::backdrop { background: rgb(0 0 0 / 65%); }
|
|
103
282
|
.gala-dialog__close { float: inline-end; }
|
|
@@ -113,14 +292,19 @@ a { color: var(--gala-color-accent); }
|
|
|
113
292
|
|
|
114
293
|
button {
|
|
115
294
|
min-block-size: 2.75rem;
|
|
116
|
-
padding-inline:
|
|
295
|
+
padding-inline: var(--gala-space-md);
|
|
117
296
|
color: inherit;
|
|
118
|
-
background:
|
|
119
|
-
border:
|
|
297
|
+
background: var(--gala-color-surface);
|
|
298
|
+
border: 1px solid var(--gala-color-border);
|
|
120
299
|
border-radius: var(--gala-radius-control);
|
|
121
300
|
font: inherit;
|
|
301
|
+
font-size: var(--gala-text-sm);
|
|
122
302
|
cursor: pointer;
|
|
303
|
+
transition: background var(--gala-motion-fast) var(--gala-ease),
|
|
304
|
+
border-color var(--gala-motion-fast) var(--gala-ease);
|
|
123
305
|
}
|
|
306
|
+
button:hover { border-color: var(--gala-color-border-strong); background: var(--gala-color-raised); }
|
|
307
|
+
button[disabled] { opacity: 0.55; cursor: not-allowed; }
|
|
124
308
|
|
|
125
309
|
button:focus-visible {
|
|
126
310
|
outline: 0.1875rem solid currentcolor;
|
|
@@ -133,8 +317,9 @@ button:focus-visible {
|
|
|
133
317
|
display: inline-flex;
|
|
134
318
|
align-items: center;
|
|
135
319
|
min-block-size: 2.75rem;
|
|
136
|
-
border:
|
|
320
|
+
border: 1px solid var(--gala-color-border);
|
|
137
321
|
border-radius: var(--gala-radius-control);
|
|
322
|
+
font-size: var(--gala-text-sm);
|
|
138
323
|
}
|
|
139
324
|
|
|
140
325
|
.gala-badge,
|
|
@@ -144,7 +329,7 @@ button:focus-visible {
|
|
|
144
329
|
.gala-section-heading > :where(h2, p) { margin-block: 0 0.5rem; }
|
|
145
330
|
.gala-hero { display: grid; gap: 1.5rem; align-items: center; }
|
|
146
331
|
.gala-hero__image { inline-size: 100%; block-size: auto; border-radius: var(--gala-radius-control); }
|
|
147
|
-
.gala-page-content { max-inline-size:
|
|
332
|
+
.gala-page-content { max-inline-size: var(--gala-measure); }
|
|
148
333
|
.gala-page-content :where(img, video) { max-inline-size: 100%; block-size: auto; }
|
|
149
334
|
.gala-author-profile { display: flex; gap: 1rem; padding: 1rem; background: var(--gala-color-surface); border-radius: var(--gala-radius-control); }
|
|
150
335
|
.gala-author-profile img { border-radius: 50%; object-fit: cover; }
|
|
@@ -154,7 +339,25 @@ button:focus-visible {
|
|
|
154
339
|
.gala-card-index { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: 1rem; padding: 0; list-style: none; }
|
|
155
340
|
[data-layout='portfolio'] .gala-card-index { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.5rem; }
|
|
156
341
|
[data-layout='portfolio'] .gala-card { padding: clamp(1.25rem, 3vw, 2rem); }
|
|
157
|
-
|
|
342
|
+
/* The surfaces are where `componentStyle` becomes visible: quiet sits on the page, outlined draws
|
|
343
|
+
its edge, raised lifts. One variable decides, so cards and dialogs cannot drift apart. */
|
|
344
|
+
.gala-card {
|
|
345
|
+
block-size: 100%;
|
|
346
|
+
box-sizing: border-box;
|
|
347
|
+
padding: var(--gala-space-lg);
|
|
348
|
+
background: var(--gala-color-surface);
|
|
349
|
+
border: 1px solid var(--gala-surface-border);
|
|
350
|
+
border-radius: var(--gala-radius-surface);
|
|
351
|
+
box-shadow: var(--gala-surface-shadow);
|
|
352
|
+
}
|
|
353
|
+
[data-component-style='raised'] .gala-card { background: var(--gala-color-raised); }
|
|
354
|
+
/* The one place the page moves of its own accord, and so the one place `motion` is legible:
|
|
355
|
+
`subtle` is a short settle, `expressive` a longer one, `none` no movement at all. */
|
|
356
|
+
.gala-card { transition: transform var(--gala-motion-base) var(--gala-ease),
|
|
357
|
+
box-shadow var(--gala-motion-base) var(--gala-ease); }
|
|
358
|
+
.gala-card-index li:hover .gala-card { transform: translateY(-2px); box-shadow: var(--gala-shadow-high); }
|
|
359
|
+
[data-motion='none'] .gala-card { transition: none; }
|
|
360
|
+
[data-motion='none'] .gala-card-index li:hover .gala-card { transform: none; }
|
|
158
361
|
.gala-stats-graph { min-block-size: var(--gala-widget-min-block-size); margin-inline: 0; }
|
|
159
362
|
.gala-stats-graph svg { inline-size: 100%; block-size: 8rem; }
|
|
160
363
|
.gala-stats-graph polyline { fill: none; stroke: var(--gala-color-accent); stroke-width: 2; }
|
|
@@ -247,3 +450,75 @@ button:focus-visible {
|
|
|
247
450
|
@media (prefers-reduced-motion: no-preference) {
|
|
248
451
|
@view-transition { navigation: auto; }
|
|
249
452
|
}
|
|
453
|
+
|
|
454
|
+
/* ---------------------------------------------------------------- the conversation
|
|
455
|
+
A thread is a hierarchy, and the indent is the only thing that says so. It is drawn with a
|
|
456
|
+
rule rather than padding alone, so five levels deep still reads as five levels and not as an
|
|
457
|
+
accident of margin. */
|
|
458
|
+
.gala-comments-island { margin-block-start: var(--gala-space-xl); }
|
|
459
|
+
.gala-comments__heading {
|
|
460
|
+
font-size: var(--gala-text-lg);
|
|
461
|
+
margin-block-end: var(--gala-space-md);
|
|
462
|
+
}
|
|
463
|
+
.gala-comments, .gala-comment-replies { list-style: none; margin: 0; padding: 0; }
|
|
464
|
+
.gala-comment-replies {
|
|
465
|
+
margin-block-start: var(--gala-space-sm);
|
|
466
|
+
margin-inline-start: var(--gala-space-xs);
|
|
467
|
+
padding-inline-start: var(--gala-space-md);
|
|
468
|
+
border-inline-start: 1px solid var(--gala-color-hairline);
|
|
469
|
+
}
|
|
470
|
+
.gala-comment { padding-block: var(--gala-space-sm); }
|
|
471
|
+
.gala-comment + .gala-comment { border-block-start: 1px solid var(--gala-color-hairline); }
|
|
472
|
+
.gala-comment-replies .gala-comment + .gala-comment { border-block-start: 0; }
|
|
473
|
+
.gala-comment__meta {
|
|
474
|
+
display: flex;
|
|
475
|
+
align-items: baseline;
|
|
476
|
+
gap: var(--gala-space-xs);
|
|
477
|
+
margin-block-end: var(--gala-space-2xs);
|
|
478
|
+
font-size: var(--gala-text-sm);
|
|
479
|
+
}
|
|
480
|
+
.gala-comment__meta strong { font-weight: 600; }
|
|
481
|
+
.gala-comment__pending { font-size: var(--gala-text-xs); color: var(--gala-color-muted); }
|
|
482
|
+
.gala-comment__body { margin-block: 0; overflow-wrap: anywhere; }
|
|
483
|
+
|
|
484
|
+
/* The controls stay out of the way until the comment is worth acting on. */
|
|
485
|
+
.gala-comment-actions {
|
|
486
|
+
display: flex;
|
|
487
|
+
gap: var(--gala-space-2xs);
|
|
488
|
+
margin-block-start: var(--gala-space-2xs);
|
|
489
|
+
opacity: 0.72;
|
|
490
|
+
transition: opacity var(--gala-motion-fast) var(--gala-ease);
|
|
491
|
+
}
|
|
492
|
+
.gala-comment:hover > .gala-comment-actions,
|
|
493
|
+
.gala-comment:focus-within > .gala-comment-actions { opacity: 1; }
|
|
494
|
+
.gala-comment-actions button {
|
|
495
|
+
min-block-size: 2rem;
|
|
496
|
+
padding-inline: var(--gala-space-xs);
|
|
497
|
+
font-size: var(--gala-text-xs);
|
|
498
|
+
background: transparent;
|
|
499
|
+
border-color: transparent;
|
|
500
|
+
color: var(--gala-color-muted);
|
|
501
|
+
}
|
|
502
|
+
.gala-comment-actions button:hover { color: var(--gala-color-text); background: var(--gala-color-surface); }
|
|
503
|
+
|
|
504
|
+
.gala-comment__form { display: grid; gap: var(--gala-space-xs); margin-block: var(--gala-space-sm); }
|
|
505
|
+
.gala-comment__form textarea {
|
|
506
|
+
inline-size: 100%;
|
|
507
|
+
box-sizing: border-box;
|
|
508
|
+
padding: var(--gala-space-sm);
|
|
509
|
+
color: inherit;
|
|
510
|
+
background: var(--gala-color-raised);
|
|
511
|
+
border: 1px solid var(--gala-color-border);
|
|
512
|
+
border-radius: var(--gala-radius-control);
|
|
513
|
+
font: inherit;
|
|
514
|
+
font-size: var(--gala-text-sm);
|
|
515
|
+
line-height: var(--gala-leading-body);
|
|
516
|
+
resize: vertical;
|
|
517
|
+
}
|
|
518
|
+
.gala-comment__form textarea:focus-visible { outline: 2px solid var(--gala-color-accent); outline-offset: 1px; }
|
|
519
|
+
.gala-comment__controls { display: flex; gap: var(--gala-space-xs); }
|
|
520
|
+
.gala-comments__status, .gala-comments__empty, .gala-comments__prompt {
|
|
521
|
+
color: var(--gala-color-muted);
|
|
522
|
+
font-size: var(--gala-text-sm);
|
|
523
|
+
}
|
|
524
|
+
.gala-comments__more { margin-block-start: var(--gala-space-md); }
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{options as n}from"./preact.js";var t,r,u,i,o=0,f=[],c=n,e=c.__b,a=c.__r,v=c.diffed,l=c.__c,m=c.unmount,p=c.__;function s(n,t){c.__h&&c.__h(r,n,o||t),o=0;var u=r.__H||(r.__H={__:[],__h:[]});return n>=u.__.length&&u.__.push({}),u.__[n]}function d(n){return o=1,y(D,n)}function y(n,u,i){var o=s(t++,2);if(o.t=n,!o.__c&&(o.__=[i?i(u):D(void 0,u),function(n){var t=o.__N?o.__N[0]:o.__[0],r=o.t(t,n);t!==r&&(o.__N=[r,o.__[1]],o.__c.setState({}))}],o.__c=r,!r.__f)){var f=function(n,t,r){if(!o.__c.__H)return!0;var u=!1,i=o.__c.props!==n;if(o.__c.__H.__.some(function(n){if(n.__N){u=!0;var t=n.__[0];n.__=n.__N,n.__N=void 0,t!==n.__[0]&&(i=!0)}}),c){var f=c.call(this,n,t,r);return u?f||i:f}return!u||i};r.__f=!0;var c=r.shouldComponentUpdate,e=r.componentWillUpdate;r.componentWillUpdate=function(n,t,r){if(this.__e){var u=c;c=void 0,f(n,t,r),c=u}e&&e.call(this,n,t,r)},r.shouldComponentUpdate=f}return o.__N||o.__}function h(n,u){var i=s(t++,3);!c.__s&&C(i.__H,u)&&(i.__=n,i.u=u,r.__H.__h.push(i))}function _(n,u){var i=s(t++,4);!c.__s&&C(i.__H,u)&&(i.__=n,i.u=u,r.__h.push(i))}function A(n){return o=5,T(function(){return{current:n}},[])}function F(n,t,r){o=6,_(function(){if("function"==typeof n){var r=n(t());return function(){n(null),r&&"function"==typeof r&&r()}}if(n)return n.current=t(),function(){return n.current=null}},null==r?r:r.concat(n))}function T(n,r){var u=s(t++,7);return C(u.__H,r)&&(u.__=n(),u.__H=r,u.__h=n),u.__}function q(n,t){return o=8,T(function(){return n},t)}function x(n){var u=r.context[n.__c],i=s(t++,9);return i.c=n,u?(null==i.__&&(i.__=!0,u.sub(r)),u.props.value):n.__}function P(n,t){c.useDebugValue&&c.useDebugValue(t?t(n):n)}function b(n){var u=s(t++,10),i=d();return u.__=n,r.componentDidCatch||(r.componentDidCatch=function(n,t){u.__&&u.__(n,t),i[1](n)}),[i[0],function(){i[1](void 0)}]}function g(){var n=s(t++,11);if(!n.__){for(var u=r.__v;null!==u&&!u.__m&&null!==u.__;)u=u.__;var i=u.__m||(u.__m=[0,0]);n.__="P"+i[0]+"-"+i[1]++}return n.__}function j(){for(var n;n=f.shift();){var t=n.__H;if(n.__P&&t)try{t.__h.some(z),t.__h.some(B),t.__h=[]}catch(r){t.__h=[],c.__e(r,n.__v)}}}c.__b=function(n){r=null,e&&e(n)},c.__=function(n,t){n&&t.__k&&t.__k.__m&&(n.__m=t.__k.__m),p&&p(n,t)},c.__r=function(n){a&&a(n),t=0;var i=(r=n.__c).__H;i&&(u===r?(i.__h=[],r.__h=[],i.__.some(function(n){n.__N&&(n.__=n.__N),n.u=n.__N=void 0})):(i.__h.some(z),i.__h.some(B),i.__h=[],t=0)),u=r},c.diffed=function(n){v&&v(n);var t=n.__c;t&&t.__H&&(t.__H.__h.length&&(1!==f.push(t)&&i===c.requestAnimationFrame||((i=c.requestAnimationFrame)||w)(j)),t.__H.__.some(function(n){n.u&&(n.__H=n.u,n.u=void 0)})),u=r=null},c.__c=function(n,t){t.some(function(n){try{n.__h.some(z),n.__h=n.__h.filter(function(n){return!n.__||B(n)})}catch(r){t.some(function(n){n.__h&&(n.__h=[])}),t=[],c.__e(r,n.__v)}}),l&&l(n,t)},c.unmount=function(n){m&&m(n);var t,r=n.__c;r&&r.__H&&(r.__H.__.some(function(n){try{z(n)}catch(n){t=n}}),r.__H=void 0,t&&c.__e(t,r.__v))};var k="function"==typeof requestAnimationFrame;function w(n){var t,r=function(){clearTimeout(u),k&&cancelAnimationFrame(t),setTimeout(n)},u=setTimeout(r,35);k&&(t=requestAnimationFrame(r))}function z(n){var t=r,u=n.__c;"function"==typeof u&&(n.__c=void 0,u()),r=t}function B(n){var t=r;n.__c=n.__(),r=t}function C(n,t){return!n||n.length!==t.length||t.some(function(t,r){return t!==n[r]})}function D(n,t){return"function"==typeof t?t(n):t}export{q as useCallback,x as useContext,P as useDebugValue,h as useEffect,b as useErrorBoundary,g as useId,F as useImperativeHandle,_ as useLayoutEffect,T as useMemo,y as useReducer,A as useRef,d as useState};
|
|
2
|
+
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var n=function(t,s,r,e){var u;s[0]=0;for(var h=1;h<s.length;h++){var p=s[h++],a=s[h]?(s[0]|=p?1:2,r[s[h++]]):s[++h];3===p?e[0]=a:4===p?e[1]=Object.assign(e[1]||{},a):5===p?(e[1]=e[1]||{})[s[++h]]=a:6===p?e[1][s[++h]]+=a+"":p?(u=t.apply(a,n(t,a,r,["",null])),e.push(u),a[0]?s[0]|=2:(s[h-2]=0,s[h]=u)):e.push(a)}return e},t=new Map;export default function(s){var r=t.get(this);return r||(r=new Map,t.set(this,r)),(r=n(this,r.get(s)||(r.set(s,r=function(n){for(var t,s,r=1,e="",u="",h=[0],p=function(n){1===r&&(n||(e=e.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?h.push(0,n,e):3===r&&(n||e)?(h.push(3,n,e),r=2):2===r&&"..."===e&&n?h.push(4,n,0):2===r&&e&&!n?h.push(5,0,!0,e):r>=5&&((e||!n&&5===r)&&(h.push(r,0,e,s),r=6),n&&(h.push(r,n,0,s),r=6)),e=""},a=0;a<n.length;a++){a&&(1===r&&p(),p(a));for(var l=0;l<n[a].length;l++)t=n[a][l],1===r?"<"===t?(p(),h=[h],r=3):e+=t:4===r?"--"===e&&">"===t?(r=1,e=""):e=t+e[0]:u?t===u?u="":e+=t:'"'===t||"'"===t?u=t:">"===t?(p(),r=1):r&&("="===t?(r=5,s=e,e=""):"/"===t&&(r<5||">"===n[a][l+1])?(p(),3===r&&(h=h[0]),r=h,(h=h[0]).push(2,0,r),r=0):" "===t||"\t"===t||"\n"===t||"\r"===t?(p(),r=2):e+=t),3===r&&"!--"===e&&(r=4,h=h[0])}return p(),h}(s)),r),arguments,[])).length>1?r:r[0]}
|
|
2
|
+
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var n,l,u,t,i,r,o,e,f,c,a,s,h,p,v,y,d={},w=[],_=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,g=Array.isArray;function m(n,l){for(var u in l)n[u]=l[u];return n}function b(n){n&&n.parentNode&&n.parentNode.removeChild(n)}function k(l,u,t){var i,r,o,e={};for(o in u)"key"==o?i=u[o]:"ref"==o?r=u[o]:e[o]=u[o];if(arguments.length>2&&(e.children=arguments.length>3?n.call(arguments,2):t),"function"==typeof l&&null!=l.defaultProps)for(o in l.defaultProps)void 0===e[o]&&(e[o]=l.defaultProps[o]);return x(l,e,i,r,null)}function x(n,t,i,r,o){var e={type:n,props:t,key:i,ref:r,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==o?++u:o,__i:-1,__u:0};return null==o&&null!=l.vnode&&l.vnode(e),e}function M(){return{current:null}}function S(n){return n.children}function C(n,l){this.props=n,this.context=l}function $(n,l){if(null==l)return n.__?$(n.__,n.__i+1):null;for(var u;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e)return u.__e;return"function"==typeof n.type?$(n):null}function I(n){if(n.__P&&n.__d){var u=n.__v,t=u.__e,i=[],r=[],o=m({},u);o.__v=u.__v+1,l.vnode&&l.vnode(o),q(n.__P,o,u,n.__n,n.__P.namespaceURI,32&u.__u?[t]:null,i,null==t?$(u):t,!!(32&u.__u),r),o.__v=u.__v,o.__.__k[o.__i]=o,D(i,o,r),u.__e=u.__=null,o.__e!=t&&P(o)}}function P(n){if(null!=(n=n.__)&&null!=n.__c)return n.__e=n.__c.base=null,n.__k.some(function(l){if(null!=l&&null!=l.__e)return n.__e=n.__c.base=l.__e}),P(n)}function A(n){(!n.__d&&(n.__d=!0)&&i.push(n)&&!H.__r++||r!=l.debounceRendering)&&((r=l.debounceRendering)||o)(H)}function H(){try{for(var n,l=1;i.length;)i.length>l&&i.sort(e),n=i.shift(),l=i.length,I(n)}finally{i.length=H.__r=0}}function L(n,l,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,_,g=t&&t.__k||w,m=l.length;for(f=T(u,l,g,f,m),s=0;s<m;s++)null!=(p=u.__k[s])&&(h=-1!=p.__i&&g[p.__i]||d,p.__i=s,_=q(n,p,h,i,r,o,e,f,c,a),v=p.__e,p.ref&&h.ref!=p.ref&&(h.ref&&J(h.ref,null,p),a.push(p.ref,p.__c||v,p)),null==y&&null!=v&&(y=v),4&p.__u?(f=j(p,f,n),h.__e&&(h.__e=null)):"function"==typeof p.type&&void 0!==_?f=_:v&&(f=v.nextSibling),p.__u&=-7);return u.__e=y,f}function T(n,l,u,t,i){var r,o,e,f,c,a=u.length,s=a,h=0;for(n.__k=new Array(i),r=0;r<i;r++)null!=(o=l[r])&&"boolean"!=typeof o&&"function"!=typeof o?("string"==typeof o||"number"==typeof o||"bigint"==typeof o||o.constructor==String?o=n.__k[r]=x(null,o,null,null,null):g(o)?o=n.__k[r]=x(S,{children:o},null,null,null):void 0===o.constructor&&o.__b>0?o=n.__k[r]=x(o.type,o.props,o.key,o.ref?o.ref:null,o.__v):n.__k[r]=o,f=r+h,o.__=n,o.__b=n.__b+1,e=null,-1!=(c=o.__i=O(o,u,f,s))&&(s--,(e=u[c])&&(e.__u|=2)),null==e||null==e.__v?(-1==c&&(i>a?h--:i<a&&h++),"function"!=typeof o.type&&(o.__u|=4)):c!=f&&(c==f-1?h--:c==f+1?h++:(c>f?h--:h++,o.__u|=4))):n.__k[r]=null;if(s)for(r=0;r<a;r++)null!=(e=u[r])&&0==(2&e.__u)&&(e.__e==t&&(t=$(e)),K(e,e));return t}function j(n,l,u){var t,i;if("function"==typeof n.type){for(t=n.__k,i=0;t&&i<t.length;i++)t[i]&&(t[i].__=n,l=j(t[i],l,u));return l}n.__e!=l&&(l&&n.type&&!l.parentNode&&(l=$(n)),l=u.insertBefore(n.__e,l||null));do{l=l&&l.nextSibling}while(null!=l&&8==l.nodeType);return l}function F(n,l){return l=l||[],null==n||"boolean"==typeof n||(g(n)?n.some(function(n){F(n,l)}):l.push(n)),l}function O(n,l,u,t){var i,r,o,e=n.key,f=n.type,c=l[u],a=null!=c&&0==(2&c.__u);if(null===c&&null==e||a&&e==c.key&&f==c.type)return u;if(t>(a?1:0))for(i=u-1,r=u+1;i>=0||r<l.length;)if(null!=(c=l[o=i>=0?i--:r++])&&0==(2&c.__u)&&e==c.key&&f==c.type)return o;return-1}function z(n,l,u){"-"==l[0]?n.setProperty(l,null==u?"":u):n[l]=null==u?"":"number"!=typeof u||_.test(l)?u:u+"px"}function N(n,l,u,t,i){var r,o;n:if("style"==l)if("string"==typeof u)n.style.cssText=u;else{if("string"==typeof t&&(n.style.cssText=t=""),t)for(l in t)u&&l in u||z(n.style,l,"");if(u)for(l in u)t&&u[l]==t[l]||z(n.style,l,u[l])}else if("o"==l[0]&&"n"==l[1])r=l!=(l=l.replace(s,"$1")),o=l.toLowerCase(),l=o in n||"onFocusOut"==l||"onFocusIn"==l?o.slice(2):l.slice(2),n.l||(n.l={}),n.l[l+r]=u,u?t?u[a]=t[a]:(u[a]=h,n.addEventListener(l,r?v:p,r)):n.removeEventListener(l,r?v:p,r);else{if("http://www.w3.org/2000/svg"==i)l=l.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=l&&"height"!=l&&"href"!=l&&"list"!=l&&"form"!=l&&"tabIndex"!=l&&"download"!=l&&"rowSpan"!=l&&"colSpan"!=l&&"role"!=l&&"popover"!=l&&l in n)try{n[l]=null==u?"":u;break n}catch(n){}"function"==typeof u||(null==u||!1===u&&"-"!=l[4]?n.removeAttribute(l):n.setAttribute(l,"popover"==l&&1==u?"":u))}}function V(n){return function(u){if(this.l){var t=this.l[u.type+n];if(null==u[c])u[c]=h++;else if(u[c]<t[a])return;return t(l.event?l.event(u):u)}}}function q(n,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,d,_,k,x,M,I,P,A,H,T,j,F=u.type;if(void 0!==u.constructor)return null;128&t.__u&&(c=!!(32&t.__u),o=[f=u.__e=t.__e]),(s=l.__b)&&s(u);n:if("function"==typeof F){h=e.length;try{if(x=u.props,M=F.prototype&&F.prototype.render,I=(s=F.contextType)&&i[s.__c],P=s?I?I.props.value:s.__:i,t.__c?k=(p=u.__c=t.__c).__=p.__E:(M?u.__c=p=new F(x,P):(u.__c=p=new C(x,P),p.constructor=F,p.render=Q),I&&I.sub(p),p.state||(p.state={}),p.__n=i,v=p.__d=!0,p.__h=[],p._sb=[]),M&&null==p.__s&&(p.__s=p.state),M&&null!=F.getDerivedStateFromProps&&(p.__s==p.state&&(p.__s=m({},p.__s)),m(p.__s,F.getDerivedStateFromProps(x,p.__s))),y=p.props,d=p.state,p.__v=u,v)M&&null==F.getDerivedStateFromProps&&null!=p.componentWillMount&&p.componentWillMount(),M&&null!=p.componentDidMount&&p.__h.push(p.componentDidMount);else{if(M&&null==F.getDerivedStateFromProps&&x!==y&&null!=p.componentWillReceiveProps&&p.componentWillReceiveProps(x,P),u.__v==t.__v||!p.__e&&null!=p.shouldComponentUpdate&&!1===p.shouldComponentUpdate(x,p.__s,P)){u.__v!=t.__v&&(p.props=x,p.state=p.__s,p.__d=!1),u.__e=t.__e,u.__k=t.__k,u.__k.some(function(n){n&&(n.__=u)}),w.push.apply(p.__h,p._sb),p._sb=[],p.__h.length&&e.push(p),f=$(t);break n}null!=p.componentWillUpdate&&p.componentWillUpdate(x,p.__s,P),M&&null!=p.componentDidUpdate&&p.__h.push(function(){p.componentDidUpdate(y,d,_)})}if(p.context=P,p.props=x,p.__P=n,p.__e=!1,A=l.__r,H=0,M)p.state=p.__s,p.__d=!1,A&&A(u),s=p.render(p.props,p.state,p.context),w.push.apply(p.__h,p._sb),p._sb=[];else do{p.__d=!1,A&&A(u),s=p.render(p.props,p.state,p.context),p.state=p.__s}while(p.__d&&++H<25);p.state=p.__s,null!=p.getChildContext&&(i=m(m({},i),p.getChildContext())),M&&!v&&null!=p.getSnapshotBeforeUpdate&&(_=p.getSnapshotBeforeUpdate(y,d)),T=null!=s&&s.type===S&&null==s.key?E(s.props.children):s,f=L(n,g(T)?T:[T],u,t,i,r,o,e,f,c,a),p.base=u.__e,u.__u&=-161,p.__h.length&&e.push(p),k&&(p.__E=p.__=null)}catch(n){if(e.length=h,u.__v=null,c||null!=o){if(n.then){for(u.__u|=c?160:128;f&&8==f.nodeType&&f.nextSibling;)f=f.nextSibling;null!=o&&(o[o.indexOf(f)]=null),u.__e=f}else if(null!=o)for(j=o.length;j--;)b(o[j])}else u.__e=t.__e;null==u.__k&&(u.__k=t.__k||[]),n.then||B(u),l.__e(n,u,t)}}else null==o&&u.__v==t.__v?(u.__k=t.__k,u.__e=t.__e):f=u.__e=G(t.__e,u,t,i,r,o,e,c,a);return(s=l.diffed)&&s(u),128&u.__u?void 0:f}function B(n){n&&(n.__c&&(n.__c.__e=!0),n.__k&&n.__k.some(B))}function D(n,u,t){for(var i=0;i<t.length;i++)J(t[i],t[++i],t[++i]);l.__c&&l.__c(u,n),n.some(function(u){try{n=u.__h,u.__h=[],n.some(function(n){n.call(u)})}catch(n){l.__e(n,u.__v)}})}function E(n){return"object"!=typeof n||null==n||n.__b>0?n:g(n)?n.map(E):void 0!==n.constructor?null:m({},n)}function G(u,t,i,r,o,e,f,c,a){var s,h,p,v,y,w,_,m=i.props||d,k=t.props,x=t.type;if("svg"==x?o="http://www.w3.org/2000/svg":"math"==x?o="http://www.w3.org/1998/Math/MathML":o||(o="http://www.w3.org/1999/xhtml"),null!=e)for(s=0;s<e.length;s++)if((y=e[s])&&"setAttribute"in y==!!x&&(x?y.localName==x:3==y.nodeType)){u=y,e[s]=null;break}if(null==u){if(null==x)return document.createTextNode(k);u=document.createElementNS(o,x,k.is&&k),c&&(l.__m&&l.__m(t,e),c=!1),e=null}if(null==x)m===k||c&&u.data==k||(u.data=k);else{if(e="textarea"==x&&null!=k.defaultValue?null:e&&n.call(u.childNodes),!c&&null!=e)for(m={},s=0;s<u.attributes.length;s++)m[(y=u.attributes[s]).name]=y.value;for(s in m)y=m[s],"dangerouslySetInnerHTML"==s?p=y:"children"==s||s in k||"value"==s&&"defaultValue"in k||"checked"==s&&"defaultChecked"in k||N(u,s,null,y,o);for(s in k)y=k[s],"children"==s?v=y:"dangerouslySetInnerHTML"==s?h=y:"value"==s?w=y:"checked"==s?_=y:c&&"function"!=typeof y||m[s]===y||N(u,s,y,m[s],o);if(h)c||p&&(h.__html==p.__html||h.__html==u.innerHTML)||(u.innerHTML=h.__html),t.__k=[];else if(p&&(u.innerHTML=""),L("template"==t.type?u.content:u,g(v)?v:[v],t,i,r,"foreignObject"==x?"http://www.w3.org/1999/xhtml":o,e,f,e?e[0]:i.__k&&$(i,0),c,a),null!=e)for(s=e.length;s--;)b(e[s]);c&&"textarea"!=x||(s="value","progress"==x&&null==w?u.removeAttribute("value"):null!=w&&(w!==u[s]||"progress"==x&&!w||"option"==x&&w!=m[s])&&N(u,s,w,m[s],o),s="checked",null!=_&&_!=u[s]&&N(u,s,_,m[s],o))}return u}function J(n,u,t){try{if("function"==typeof n){var i="function"==typeof n.__u;i&&n.__u(),i&&null==u||(n.__u=n(u))}else n.current=u}catch(n){l.__e(n,t)}}function K(n,u,t){var i,r;if(l.unmount&&l.unmount(n),(i=n.ref)&&(i.current&&i.current!=n.__e||J(i,null,u)),null!=(i=n.__c)){if(i.componentWillUnmount)try{i.componentWillUnmount()}catch(n){l.__e(n,u)}i.base=i.__P=i.__n=null}if(i=n.__k)for(r=0;r<i.length;r++)i[r]&&K(i[r],u,t||"function"!=typeof n.type);t||b(n.__e),n.__c=n.__=n.__e=void 0}function Q(n,l,u){return this.constructor(n,u)}function R(u,t,i){var r,o,e,f;t==document&&(t=document.documentElement),l.__&&l.__(u,t),o=(r="function"==typeof i)?null:i&&i.__k||t.__k,e=[],f=[],q(t,u=(!r&&i||t).__k=k(S,null,[u]),o||d,d,t.namespaceURI,!r&&i?[i]:o?null:t.firstChild?n.call(t.childNodes):null,e,!r&&i?i:o?o.__e:t.firstChild,r,f),D(e,u,f),u.props.children=null}function U(n,l){R(n,l,U)}function W(l,u,t){var i,r,o,e,f=m({},l.props);for(o in l.type&&l.type.defaultProps&&(e=l.type.defaultProps),u)"key"==o?i=u[o]:"ref"==o?r=u[o]:f[o]=void 0===u[o]&&null!=e?e[o]:u[o];return arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):t),x(l.type,f,i||l.key,r||l.ref,null)}function X(n){function l(n){var u,t;return this.getChildContext||(u=new Set,(t={})[l.__c]=this,this.getChildContext=function(){return t},this.componentWillUnmount=function(){u=null},this.shouldComponentUpdate=function(n){this.props.value!=n.value&&u.forEach(function(n){n.__e=!0,A(n)})},this.sub=function(n){u.add(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u&&u.delete(n),l&&l.call(n)}}),n.children}return l.__c="__cC"+y++,l.__=n,l.Provider=l.__l=(l.Consumer=function(n,l){return n.children(l)}).contextType=l,l}n=w.slice,l={__e:function(n,l,u,t){for(var i,r,o;l=l.__;)if((i=l.__c)&&!i.__)try{if((r=i.constructor)&&null!=r.getDerivedStateFromError&&(i.setState(r.getDerivedStateFromError(n)),o=i.__d),null!=i.componentDidCatch&&(i.componentDidCatch(n,t||{}),o=i.__d),o)return i.__E=i}catch(l){n=l}throw n}},u=0,t=function(n){return null!=n&&void 0===n.constructor},C.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=m({},this.state),"function"==typeof n&&(n=n(m({},u),this.props)),n&&m(u,n),null!=n&&this.__v&&(l&&this._sb.push(l),A(this))},C.prototype.forceUpdate=function(n){this.__v&&(this.__e=!0,n&&this.__h.push(n),A(this))},C.prototype.render=S,i=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,e=function(n,l){return n.__v.__b-l.__v.__b},H.__r=0,f=Math.random().toString(8),c="__d"+f,a="__a"+f,s=/(PointerCapture)$|Capture$/i,h=0,p=V(!1),v=V(!0),y=0;export{C as Component,S as Fragment,W as cloneElement,X as createContext,k as createElement,M as createRef,k as h,U as hydrate,t as isValidElement,l as options,R as render,F as toChildArray};
|
|
2
|
+
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const i=Symbol.for("preact-signals");function t(){if(e>1){e--;return}let i,t=!1;!function(){let i=f;f=void 0;while(void 0!==i){const t=i.S;if(t.v===i.v)for(let n=t.t;void 0!==n;n=n.x)if(n.i===i.i)n.i=t.i;i=i.o}}();while(void 0!==h){let n=h;h=void 0;c++;while(void 0!==n){const o=n.u;n.u=void 0;n.f&=-3;if(!(8&n.f)&&w(n))try{n.c()}catch(n){if(!t){i=n;t=!0}}n=o}}c=0;e--;if(t)throw i}function n(i){if(e>0)return i();d=++u;e++;try{return i()}finally{t()}}let o,s,h;function r(i){const t=o,n=s;o=void 0;s=void 0;try{return i()}finally{o=t;s=n}}let f,e=0,c=0,u=0,d=0,v=0;function l(i){if(void 0===o)return;let t=i.n;if(void 0===t||t.t!==o){t={i:0,S:i,p:o.s,n:void 0,t:o,e:void 0,x:void 0,r:t};if(void 0!==o.s)o.s.n=t;o.s=t;i.n=t;if(32&o.f)i.S(t);return t}else if(-1===t.i){t.i=0;if(void 0!==t.n){t.n.p=t.p;if(void 0!==t.p)t.p.n=t.n;t.p=o.s;t.n=void 0;o.s.n=t;o.s=t}return t}}function a(i,t){this.v=i;this.i=0;this.n=void 0;this.t=void 0;this.l=0;this.W=null==t?void 0:t.watched;this.Z=null==t?void 0:t.unwatched;this.name=null==t?void 0:t.name}a.prototype.brand=i;a.prototype.h=function(){return!0};a.prototype.S=function(i){const t=this.t;if(t!==i&&void 0===i.e){i.x=t;this.t=i;if(void 0!==t)t.e=i;else r(()=>{var i;null==(i=this.W)||i.call(this)})}};a.prototype.U=function(i){if(void 0!==this.t){const t=i.e,n=i.x;if(void 0!==t){t.x=n;i.e=void 0}if(void 0!==n){n.e=t;i.x=void 0}if(i===this.t){this.t=n;if(void 0===n)r(()=>{var i;null==(i=this.Z)||i.call(this)})}}};a.prototype.subscribe=function(i){return j(()=>{const t=this.value;r(()=>i(t))},{name:"sub"})};a.prototype.valueOf=function(){return this.value};a.prototype.toString=function(){return this.value+""};a.prototype.toJSON=function(){return this.value};a.prototype.peek=function(){return r(()=>this.value)};Object.defineProperty(a.prototype,"value",{get(){const i=l(this);if(void 0!==i)i.i=this.i;return this.v},set(i){if(i!==this.v){if(c>100)throw new Error("Cycle detected");!function(i){if(0!==e&&0===c)if(i.l!==d){i.l=d;f={S:i,v:i.v,i:i.i,o:f}}}(this);this.v=i;this.i++;v++;e++;try{for(let i=this.t;void 0!==i;i=i.x)i.t.N()}finally{t()}}}});function y(i,t){return new a(i,t)}function w(i){for(let t=i.s;void 0!==t;t=t.n)if(t.S.i!==t.i||!t.S.h()||t.S.i!==t.i)return!0;return!1}function _(i){for(let t=i.s;void 0!==t;t=t.n){const n=t.S.n;if(void 0!==n)t.r=n;t.S.n=t;t.i=-1;if(void 0===t.n){i.s=t;break}}}function b(i){let t,n=i.s;while(void 0!==n){const i=n.p;if(-1===n.i){n.S.U(n);if(void 0!==i)i.n=n.n;if(void 0!==n.n)n.n.p=i}else t=n;n.S.n=n.r;if(void 0!==n.r)n.r=void 0;n=i}i.s=t}function p(i,t){a.call(this,void 0,t);this.x=i;this.s=void 0;this.g=v-1;this.f=4}p.prototype=new a;p.prototype.h=function(){this.f&=-3;if(1&this.f)return!1;if(32==(36&this.f))return!0;this.f&=-5;if(this.g===v)return!0;this.g=v;this.f|=1;if(this.i>0&&!w(this)){this.f&=-2;return!0}const i=o;try{_(this);o=this;const i=this.x();if(16&this.f||this.v!==i||0===this.i){this.v=i;this.f&=-17;this.i++}}catch(i){this.v=i;this.f|=16;this.i++}o=i;b(this);this.f&=-2;return!0};p.prototype.S=function(i){if(void 0===this.t){this.f|=36;for(let i=this.s;void 0!==i;i=i.n)i.S.S(i)}a.prototype.S.call(this,i)};p.prototype.U=function(i){if(void 0!==this.t){a.prototype.U.call(this,i);if(void 0===this.t){this.f&=-33;for(let i=this.s;void 0!==i;i=i.n)i.S.U(i)}}};p.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(let i=this.t;void 0!==i;i=i.x)i.t.N()}};Object.defineProperty(p.prototype,"value",{get(){if(1&this.f)throw new Error("Cycle detected");const i=l(this);this.h();if(void 0!==i)i.i=this.i;if(16&this.f)throw this.v;return this.v}});function g(i,t){return new p(i,t)}function S(i){const n=i.m;i.m=void 0;if("function"==typeof n){e++;const s=o;o=void 0;try{n()}catch(t){i.f&=-2;i.f|=8;m(i);throw t}finally{o=s;t()}}}function m(i){for(let t=i.s;void 0!==t;t=t.n)t.S.U(t);i.x=void 0;i.s=void 0;S(i)}function x(i){if(o!==this)throw new Error("Out-of-order effect");b(this);o=i;this.f&=-2;if(8&this.f)m(this);t()}function E(i,t){this.x=i;this.m=void 0;this.s=void 0;this.u=void 0;this.f=32;this.name=null==t?void 0:t.name;if(s)s.push(this)}E.prototype.c=function(){const i=this.S();try{if(8&this.f)return;if(void 0===this.x)return;const t=this.x();if("function"==typeof t)this.m=t}finally{i()}};E.prototype.S=function(){if(1&this.f)throw new Error("Cycle detected");this.f|=1;this.f&=-9;S(this);_(this);e++;const i=o;o=this;return x.bind(this,i)};E.prototype.N=function(){if(!(2&this.f)){this.f|=2;this.u=h;h=this}};E.prototype.d=function(){this.f|=8;if(!(1&this.f))m(this)};E.prototype.dispose=function(){this.d()};function j(i,t){const n=new E(i,t);try{n.c()}catch(i){n.d();throw i}const o=n.d.bind(n);o[Symbol.dispose]=o;return o}function C(i){return function(...t){return n(()=>r(()=>i.apply(this,t)))}}const O=i=>{for(const t in i){const n=i[t];if("function"==typeof n)i[t]=C(n);else if("object"==typeof n&&null!==n&&!("brand"in n))O(n)}};function k(i){return function(...t){let n,o;const h=function(){let i=s;s=[];return function(){let t=s;if(s&&i)i=i.concat(s);s=i;return t}}();try{o=i(...t)}catch(i){s=void 0;throw i}finally{n=h()}O(o);o[Symbol.dispose]=C(function(){if(n)for(let i=0;i<n.length;i++)n[i].dispose();n=void 0});return o}}export{p as Computed,E as Effect,a as Signal,C as action,n as batch,g as computed,k as createModel,j as effect,y as signal,r as untracked};
|
|
2
|
+
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{Component as t,options as i,isValidElement as n,Fragment as e}from"./preact.js";import{useMemo as o,useRef as f,useEffect as r}from"./hooks.js";import{effect as u,Signal as c,computed as s,signal as l,batch as a}from"./signals-core.js";export{Signal,action,batch,computed,createModel,effect,signal,untracked}from"./signals-core.js";const h="undefined"!=typeof window&&!!window.__PREACT_SIGNALS_DEVTOOLS__;let d,p,m,v=[],_=[];u(function(){d=this.N})();function g(t,n){i[t]=n.bind(null,i[t]||(()=>{}))}function b(t){if(m){const t=m;m=void 0;t()}m=t&&t.S()}function y({data:t}){const i=useSignal(t);i.name="ReactiveDom";i.value=t;const[e,f]=o(()=>{let t=this,e=this.__v;while(e=e.__)if(e.__c){e.__c.__$f|=4;break}const o=s(()=>{let t=i.value.value;return 0===t?0:!0===t?"":t||""}),f=s(()=>!Array.isArray(o.value)&&!n(o.value)),r=u(function(){this.N=F;if(f.value){const i=o.value;if(t.__v&&t.__v.__e&&3===t.__v.__e.nodeType)t.__v.__e.data=i}}),c=this.__$u.d;this.__$u.d=function(){r();c.call(this)};return[f,o]},[]);return e.value?f.peek():f.value}y.displayName="ReactiveTextNode";Object.defineProperties(c.prototype,{constructor:{configurable:!0,value:void 0},type:{configurable:!0,value:y},props:{configurable:!0,get(){const t=this;return{data:{get value(){return t.value}}}}},__b:{configurable:!0,value:1}});g("__b",(t,i)=>{if("string"==typeof i.type){let t,n=i.props;for(let e in n){if("children"===e)continue;let o=n[e];if(o instanceof c){if(!t)i.__np=t={};t[e]=o;n[e]=o.peek()}}}t(i)});g("__r",(t,i)=>{t(i);if(i.type!==e){b();let t,n=i.__c;if(n){n.__$f&=-2;t=n.__$u;if(void 0===t)n.__$u=t=function(t,i){let n;u(function(){n=this},{name:i});n.c=t;return n}(function(t){return function(){var i;if(h)null==(i=this.y)||i.call(this);t.__$f|=1;t.setState({})}}(n),"function"==typeof i.type?i.type.displayName||i.type.name:"")}p=n;b(t)}});g("__e",(t,i,n,e)=>{b();p=void 0;t(i,n,e)});g("diffed",(t,i)=>{b();p=void 0;let n;if("string"==typeof i.type&&(n=i.__e)){let t=i.__np,e=i.props,o=n.U;if(o)for(let i in o){let n=o[i];if(!(void 0===n||t&&i in t)){n.d();o[i]=void 0}}if(t){if(!o){o={};n.U=o}for(let i in t){let f=o[i],r=t[i];if(void 0===f){f=w(n,i,r,e);o[i]=f}else f.o(r,e)}}}t(i)});function w(t,i,n,e){const o=i in t&&void 0===t.ownerSVGElement,f=l(n);return{o:(t,i)=>{f.value=t;e=i},d:u(function(){this.N=F;const n=f.value.value;if(e[i]!==n){e[i]=n;if(o)t[i]=n;else if(null!=n&&(!1!==n||"-"===i[4]))t.setAttribute(i,n);else t.removeAttribute(i)}})}}g("unmount",(t,i)=>{if("string"==typeof i.type){let t=i.__e;if(t){const i=t.U;if(i){t.U=void 0;for(let t in i){let n=i[t];if(n)n.d()}}}let n=i.__np;if(n){let t=i.props;for(let i in n)t[i]=n[i]}i.__np=void 0}else{let t=i.__c;if(t){const i=t.__$u;if(i){t.__$u=void 0;i.d()}}}t(i)});g("__h",(t,i,n,e)=>{if(e<3)i.__$f|=2;t(i,n,e)});t.prototype.shouldComponentUpdate=function(t,i){if(this.__R)return!0;const n=this.__$u,e=n&&void 0!==n.s;for(let t in i)return!0;if(this.__f||"boolean"==typeof this.u&&!0===this.u){const t=2&this.__$f;if(!(e||t||4&this.__$f))return!0;if(1&this.__$f)return!0}else{if(!(e||4&this.__$f))return!0;if(3&this.__$f)return!0}for(let i in t)if("__source"!==i&&t[i]!==this.props[i])return!0;for(let i in this.props)if(!(i in t))return!0;return!1};function useSignal(t,i){return o(()=>l(t,i),[])}function useComputed(t,i){const n=f(t);n.current=t;p.__$f|=4;return o(()=>s(()=>n.current(),i),[])}const k="undefined"==typeof requestAnimationFrame?setTimeout:function(t){const i=()=>{clearTimeout(n);cancelAnimationFrame(e);t()},n=setTimeout(i,35),e=requestAnimationFrame(i)},q=t=>{queueMicrotask(()=>{queueMicrotask(t)})};function A(){a(()=>{let t;while(t=v.shift())d.call(t)})}function T(){if(1===v.push(this))(i.requestAnimationFrame||k)(A)}function x(){a(()=>{let t;while(t=_.shift())d.call(t)})}function F(){if(1===_.push(this))(i.requestAnimationFrame||q)(x)}function useSignalEffect(t,i){const n=f(t);n.current=t;r(()=>u(function(){this.N=T;return n.current()},i),[])}function M(t){const i=o(()=>t(),[]);r(()=>i[Symbol.dispose],[i]);return i}export{useComputed,M as useModel,useSignal,useSignalEffect};
|
|
2
|
+
|