@sigx/zero-daisyui 0.9.0 → 0.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -1
- package/dist/audit.json +458 -3
- package/dist/css/components/drawer.css +61 -8
- package/dist/css/components/select.css +1 -1
- package/dist/css/components/toast.css +9 -3
- package/dist/css/index.css +71 -12
- package/dist/lynx/components/button.css +2 -2
- package/dist/lynx/components/carousel.css +10 -10
- package/dist/lynx/components/checkbox.css +7 -7
- package/dist/lynx/components/combobox.css +2 -2
- package/dist/lynx/components/dialog.css +2 -2
- package/dist/lynx/components/diff.css +10 -10
- package/dist/lynx/components/drawer.css +26 -4
- package/dist/lynx/components/grid.css +1 -1
- package/dist/lynx/components/hover-card.css +1 -1
- package/dist/lynx/components/menu.css +2 -2
- package/dist/lynx/components/navbar.css +5 -5
- package/dist/lynx/components/number-input.css +1 -1
- package/dist/lynx/components/popover.css +1 -1
- package/dist/lynx/components/radio-group.css +6 -6
- package/dist/lynx/components/select.css +51 -10
- package/dist/lynx/components/slider.css +2 -2
- package/dist/lynx/components/tabs.css +1 -1
- package/dist/lynx/components/toast.css +2 -2
- package/dist/lynx/components/tooltip.css +1 -1
- package/dist/lynx/index.css +247 -184
- package/dist/lynx/manifest.json +3 -3
- package/dist/lynx/tokens.css +114 -114
- package/dist/manifest.json +1 -1
- package/dist/recipes.d.ts.map +1 -1
- package/dist/recipes.js +166 -20
- package/dist/recipes.js.map +1 -1
- package/dist/report.json +213 -25
- package/package.json +4 -4
- package/src/recipes.ts +168 -21
package/dist/lynx/manifest.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://signalxjs.github.io/zero/schemas/lynx-manifest.schema.json",
|
|
3
3
|
"manifestVersion": 1,
|
|
4
|
-
"zeroVersion": "0.
|
|
4
|
+
"zeroVersion": "0.11.0",
|
|
5
5
|
"name": "daisyui",
|
|
6
6
|
"themes": [
|
|
7
7
|
{
|
|
@@ -2289,7 +2289,7 @@
|
|
|
2289
2289
|
"target": "lynx",
|
|
2290
2290
|
"classGrammarVersion": 2,
|
|
2291
2291
|
"capabilities": {
|
|
2292
|
-
"translated":
|
|
2293
|
-
"dropped":
|
|
2292
|
+
"translated": 95,
|
|
2293
|
+
"dropped": 464
|
|
2294
2294
|
}
|
|
2295
2295
|
}
|
package/dist/lynx/tokens.css
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
.zx-root {
|
|
2
|
-
--radius-selector:
|
|
3
|
-
--radius-field:
|
|
4
|
-
--radius-box:
|
|
5
|
-
--size-selector:
|
|
6
|
-
--size-field:
|
|
7
|
-
--text-xs:
|
|
8
|
-
--text-sm:
|
|
9
|
-
--text-md:
|
|
10
|
-
--text-lg:
|
|
11
|
-
--text-xl:
|
|
12
|
-
--text-2xl:
|
|
13
|
-
--text-3xl:
|
|
2
|
+
--radius-selector: 4px;
|
|
3
|
+
--radius-field: 4px;
|
|
4
|
+
--radius-box: 8px;
|
|
5
|
+
--size-selector: 4px;
|
|
6
|
+
--size-field: 4px;
|
|
7
|
+
--text-xs: 12px;
|
|
8
|
+
--text-sm: 14px;
|
|
9
|
+
--text-md: 16px;
|
|
10
|
+
--text-lg: 18px;
|
|
11
|
+
--text-xl: 20px;
|
|
12
|
+
--text-2xl: 24px;
|
|
13
|
+
--text-3xl: 30px;
|
|
14
14
|
--border: 1px;
|
|
15
15
|
--disabled-opacity: 0.4;
|
|
16
16
|
--color-primary: #422ad5;
|
|
@@ -41,11 +41,11 @@
|
|
|
41
41
|
--color-success-soft: #ebfaf1;
|
|
42
42
|
--color-warning-soft: #fff7e9;
|
|
43
43
|
--color-error-soft: #ffedef;
|
|
44
|
-
--radius-selector:
|
|
45
|
-
--radius-field:
|
|
46
|
-
--radius-box:
|
|
47
|
-
--size-selector:
|
|
48
|
-
--size-field:
|
|
44
|
+
--radius-selector: 8px;
|
|
45
|
+
--radius-field: 4px;
|
|
46
|
+
--radius-box: 8px;
|
|
47
|
+
--size-selector: 4px;
|
|
48
|
+
--size-field: 4px;
|
|
49
49
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
50
50
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
51
51
|
--weight-normal: 400;
|
|
@@ -57,18 +57,18 @@
|
|
|
57
57
|
--leading-normal: 1.5;
|
|
58
58
|
--tracking-normal: 0em;
|
|
59
59
|
--tracking-wide: 0.05em;
|
|
60
|
-
--space-2xs:
|
|
61
|
-
--space-xs:
|
|
62
|
-
--space-sm:
|
|
63
|
-
--space-md:
|
|
64
|
-
--space-lg:
|
|
65
|
-
--space-xl:
|
|
66
|
-
--space-2xl:
|
|
67
|
-
--measure-xs:
|
|
68
|
-
--measure-sm:
|
|
69
|
-
--measure-md:
|
|
70
|
-
--measure-lg:
|
|
71
|
-
--measure-xl:
|
|
60
|
+
--space-2xs: 2px;
|
|
61
|
+
--space-xs: 4px;
|
|
62
|
+
--space-sm: 6px;
|
|
63
|
+
--space-md: 8px;
|
|
64
|
+
--space-lg: 12px;
|
|
65
|
+
--space-xl: 16px;
|
|
66
|
+
--space-2xl: 20px;
|
|
67
|
+
--measure-xs: 320px;
|
|
68
|
+
--measure-sm: 384px;
|
|
69
|
+
--measure-md: 448px;
|
|
70
|
+
--measure-lg: 512px;
|
|
71
|
+
--measure-xl: 576px;
|
|
72
72
|
--measure-prose: 65ch;
|
|
73
73
|
--shadow-xs: 0 1px 2px #00000014;
|
|
74
74
|
--shadow-sm: 0 1px 2px #00000026;
|
|
@@ -118,11 +118,11 @@
|
|
|
118
118
|
--color-success-soft: #ebfaf1;
|
|
119
119
|
--color-warning-soft: #fff7e9;
|
|
120
120
|
--color-error-soft: #ffedef;
|
|
121
|
-
--radius-selector:
|
|
122
|
-
--radius-field:
|
|
123
|
-
--radius-box:
|
|
124
|
-
--size-selector:
|
|
125
|
-
--size-field:
|
|
121
|
+
--radius-selector: 8px;
|
|
122
|
+
--radius-field: 4px;
|
|
123
|
+
--radius-box: 8px;
|
|
124
|
+
--size-selector: 4px;
|
|
125
|
+
--size-field: 4px;
|
|
126
126
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
127
127
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
128
128
|
--weight-normal: 400;
|
|
@@ -134,18 +134,18 @@
|
|
|
134
134
|
--leading-normal: 1.5;
|
|
135
135
|
--tracking-normal: 0em;
|
|
136
136
|
--tracking-wide: 0.05em;
|
|
137
|
-
--space-2xs:
|
|
138
|
-
--space-xs:
|
|
139
|
-
--space-sm:
|
|
140
|
-
--space-md:
|
|
141
|
-
--space-lg:
|
|
142
|
-
--space-xl:
|
|
143
|
-
--space-2xl:
|
|
144
|
-
--measure-xs:
|
|
145
|
-
--measure-sm:
|
|
146
|
-
--measure-md:
|
|
147
|
-
--measure-lg:
|
|
148
|
-
--measure-xl:
|
|
137
|
+
--space-2xs: 2px;
|
|
138
|
+
--space-xs: 4px;
|
|
139
|
+
--space-sm: 6px;
|
|
140
|
+
--space-md: 8px;
|
|
141
|
+
--space-lg: 12px;
|
|
142
|
+
--space-xl: 16px;
|
|
143
|
+
--space-2xl: 20px;
|
|
144
|
+
--measure-xs: 320px;
|
|
145
|
+
--measure-sm: 384px;
|
|
146
|
+
--measure-md: 448px;
|
|
147
|
+
--measure-lg: 512px;
|
|
148
|
+
--measure-xl: 576px;
|
|
149
149
|
--measure-prose: 65ch;
|
|
150
150
|
--shadow-xs: 0 1px 2px #00000014;
|
|
151
151
|
--shadow-sm: 0 1px 2px #00000026;
|
|
@@ -195,11 +195,11 @@
|
|
|
195
195
|
--color-success-soft: #243c3a;
|
|
196
196
|
--color-warning-soft: #3c3931;
|
|
197
197
|
--color-error-soft: #3f2f37;
|
|
198
|
-
--radius-selector:
|
|
199
|
-
--radius-field:
|
|
200
|
-
--radius-box:
|
|
201
|
-
--size-selector:
|
|
202
|
-
--size-field:
|
|
198
|
+
--radius-selector: 8px;
|
|
199
|
+
--radius-field: 4px;
|
|
200
|
+
--radius-box: 8px;
|
|
201
|
+
--size-selector: 4px;
|
|
202
|
+
--size-field: 4px;
|
|
203
203
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
204
204
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
205
205
|
--weight-normal: 400;
|
|
@@ -211,18 +211,18 @@
|
|
|
211
211
|
--leading-normal: 1.5;
|
|
212
212
|
--tracking-normal: 0em;
|
|
213
213
|
--tracking-wide: 0.05em;
|
|
214
|
-
--space-2xs:
|
|
215
|
-
--space-xs:
|
|
216
|
-
--space-sm:
|
|
217
|
-
--space-md:
|
|
218
|
-
--space-lg:
|
|
219
|
-
--space-xl:
|
|
220
|
-
--space-2xl:
|
|
221
|
-
--measure-xs:
|
|
222
|
-
--measure-sm:
|
|
223
|
-
--measure-md:
|
|
224
|
-
--measure-lg:
|
|
225
|
-
--measure-xl:
|
|
214
|
+
--space-2xs: 2px;
|
|
215
|
+
--space-xs: 4px;
|
|
216
|
+
--space-sm: 6px;
|
|
217
|
+
--space-md: 8px;
|
|
218
|
+
--space-lg: 12px;
|
|
219
|
+
--space-xl: 16px;
|
|
220
|
+
--space-2xl: 20px;
|
|
221
|
+
--measure-xs: 320px;
|
|
222
|
+
--measure-sm: 384px;
|
|
223
|
+
--measure-md: 448px;
|
|
224
|
+
--measure-lg: 512px;
|
|
225
|
+
--measure-xl: 576px;
|
|
226
226
|
--measure-prose: 65ch;
|
|
227
227
|
--shadow-xs: 0 1px 2px #00000014;
|
|
228
228
|
--shadow-sm: 0 1px 2px #00000026;
|
|
@@ -272,11 +272,11 @@
|
|
|
272
272
|
--color-success-soft: #354b4f;
|
|
273
273
|
--color-warning-soft: #454845;
|
|
274
274
|
--color-error-soft: #49434b;
|
|
275
|
-
--radius-selector:
|
|
276
|
-
--radius-field:
|
|
277
|
-
--radius-box:
|
|
278
|
-
--size-selector:
|
|
279
|
-
--size-field:
|
|
275
|
+
--radius-selector: 16px;
|
|
276
|
+
--radius-field: 8px;
|
|
277
|
+
--radius-box: 16px;
|
|
278
|
+
--size-selector: 4px;
|
|
279
|
+
--size-field: 4px;
|
|
280
280
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
281
281
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
282
282
|
--weight-normal: 400;
|
|
@@ -288,18 +288,18 @@
|
|
|
288
288
|
--leading-normal: 1.5;
|
|
289
289
|
--tracking-normal: 0em;
|
|
290
290
|
--tracking-wide: 0.05em;
|
|
291
|
-
--space-2xs:
|
|
292
|
-
--space-xs:
|
|
293
|
-
--space-sm:
|
|
294
|
-
--space-md:
|
|
295
|
-
--space-lg:
|
|
296
|
-
--space-xl:
|
|
297
|
-
--space-2xl:
|
|
298
|
-
--measure-xs:
|
|
299
|
-
--measure-sm:
|
|
300
|
-
--measure-md:
|
|
301
|
-
--measure-lg:
|
|
302
|
-
--measure-xl:
|
|
291
|
+
--space-2xs: 2px;
|
|
292
|
+
--space-xs: 4px;
|
|
293
|
+
--space-sm: 6px;
|
|
294
|
+
--space-md: 8px;
|
|
295
|
+
--space-lg: 12px;
|
|
296
|
+
--space-xl: 16px;
|
|
297
|
+
--space-2xl: 20px;
|
|
298
|
+
--measure-xs: 320px;
|
|
299
|
+
--measure-sm: 384px;
|
|
300
|
+
--measure-md: 448px;
|
|
301
|
+
--measure-lg: 512px;
|
|
302
|
+
--measure-xl: 576px;
|
|
303
303
|
--measure-prose: 65ch;
|
|
304
304
|
--shadow-xs: 0 1px 2px #00000014;
|
|
305
305
|
--shadow-sm: 0 1px 2px #00000026;
|
|
@@ -349,11 +349,11 @@
|
|
|
349
349
|
--color-success-soft: #e3e9e8;
|
|
350
350
|
--color-warning-soft: #ecebe8;
|
|
351
351
|
--color-error-soft: #e8dee3;
|
|
352
|
-
--radius-selector:
|
|
353
|
-
--radius-field:
|
|
354
|
-
--radius-box:
|
|
355
|
-
--size-selector:
|
|
356
|
-
--size-field:
|
|
352
|
+
--radius-selector: 16px;
|
|
353
|
+
--radius-field: 4px;
|
|
354
|
+
--radius-box: 8px;
|
|
355
|
+
--size-selector: 4px;
|
|
356
|
+
--size-field: 4px;
|
|
357
357
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
358
358
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
359
359
|
--weight-normal: 400;
|
|
@@ -365,18 +365,18 @@
|
|
|
365
365
|
--leading-normal: 1.5;
|
|
366
366
|
--tracking-normal: 0em;
|
|
367
367
|
--tracking-wide: 0.05em;
|
|
368
|
-
--space-2xs:
|
|
369
|
-
--space-xs:
|
|
370
|
-
--space-sm:
|
|
371
|
-
--space-md:
|
|
372
|
-
--space-lg:
|
|
373
|
-
--space-xl:
|
|
374
|
-
--space-2xl:
|
|
375
|
-
--measure-xs:
|
|
376
|
-
--measure-sm:
|
|
377
|
-
--measure-md:
|
|
378
|
-
--measure-lg:
|
|
379
|
-
--measure-xl:
|
|
368
|
+
--space-2xs: 2px;
|
|
369
|
+
--space-xs: 4px;
|
|
370
|
+
--space-sm: 6px;
|
|
371
|
+
--space-md: 8px;
|
|
372
|
+
--space-lg: 12px;
|
|
373
|
+
--space-xl: 16px;
|
|
374
|
+
--space-2xl: 20px;
|
|
375
|
+
--measure-xs: 320px;
|
|
376
|
+
--measure-sm: 384px;
|
|
377
|
+
--measure-md: 448px;
|
|
378
|
+
--measure-lg: 512px;
|
|
379
|
+
--measure-xl: 576px;
|
|
380
380
|
--measure-prose: 65ch;
|
|
381
381
|
--shadow-xs: 0 1px 2px #00000014;
|
|
382
382
|
--shadow-sm: 0 1px 2px #00000026;
|
|
@@ -426,11 +426,11 @@
|
|
|
426
426
|
--color-success-soft: #273736;
|
|
427
427
|
--color-warning-soft: #303433;
|
|
428
428
|
--color-error-soft: #333238;
|
|
429
|
-
--radius-selector:
|
|
430
|
-
--radius-field:
|
|
431
|
-
--radius-box:
|
|
432
|
-
--size-selector:
|
|
433
|
-
--size-field:
|
|
429
|
+
--radius-selector: 16px;
|
|
430
|
+
--radius-field: 8px;
|
|
431
|
+
--radius-box: 16px;
|
|
432
|
+
--size-selector: 4px;
|
|
433
|
+
--size-field: 4px;
|
|
434
434
|
--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
435
435
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
436
436
|
--weight-normal: 400;
|
|
@@ -442,18 +442,18 @@
|
|
|
442
442
|
--leading-normal: 1.5;
|
|
443
443
|
--tracking-normal: 0em;
|
|
444
444
|
--tracking-wide: 0.05em;
|
|
445
|
-
--space-2xs:
|
|
446
|
-
--space-xs:
|
|
447
|
-
--space-sm:
|
|
448
|
-
--space-md:
|
|
449
|
-
--space-lg:
|
|
450
|
-
--space-xl:
|
|
451
|
-
--space-2xl:
|
|
452
|
-
--measure-xs:
|
|
453
|
-
--measure-sm:
|
|
454
|
-
--measure-md:
|
|
455
|
-
--measure-lg:
|
|
456
|
-
--measure-xl:
|
|
445
|
+
--space-2xs: 2px;
|
|
446
|
+
--space-xs: 4px;
|
|
447
|
+
--space-sm: 6px;
|
|
448
|
+
--space-md: 8px;
|
|
449
|
+
--space-lg: 12px;
|
|
450
|
+
--space-xl: 16px;
|
|
451
|
+
--space-2xl: 20px;
|
|
452
|
+
--measure-xs: 320px;
|
|
453
|
+
--measure-sm: 384px;
|
|
454
|
+
--measure-md: 448px;
|
|
455
|
+
--measure-lg: 512px;
|
|
456
|
+
--measure-xl: 576px;
|
|
457
457
|
--measure-prose: 65ch;
|
|
458
458
|
--shadow-xs: 0 1px 2px #00000014;
|
|
459
459
|
--shadow-sm: 0 1px 2px #00000026;
|
package/dist/manifest.json
CHANGED
package/dist/recipes.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"recipes.d.ts","sourceRoot":"","sources":["../src/recipes.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAwB,WAAW,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"recipes.d.ts","sourceRoot":"","sources":["../src/recipes.ts"],"names":[],"mappings":"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"}
|
package/dist/recipes.js
CHANGED
|
@@ -129,6 +129,13 @@ const ROLE_INK_KEEP = {
|
|
|
129
129
|
const roleInk = (role) => `color-mix(in oklab, var(--color-${role}) `
|
|
130
130
|
+ `${ROLE_INK_KEEP[role] ?? 55}%, var(--color-base-content))`;
|
|
131
131
|
// daisy "tabs-box" flavor: a rounded container, lifted active tab.
|
|
132
|
+
/**
|
|
133
|
+
* The swipe-to-dismiss offset (#293): `createSwipe` publishes the drag as
|
|
134
|
+
* `--swipe-x` / `--swipe-y` on a toast root or a drawer sheet, and this is
|
|
135
|
+
* the one place it is read — composed first into the part's `transform`, so
|
|
136
|
+
* an enter/exit offset or a slide rides on top of it. Unset, it is nothing.
|
|
137
|
+
*/
|
|
138
|
+
const SWIPE = 'translate(var(--swipe-x, 0px), var(--swipe-y, 0px))';
|
|
132
139
|
/**
|
|
133
140
|
* Enter/exit presence for a top-layer popup.
|
|
134
141
|
*
|
|
@@ -2847,10 +2854,35 @@ const fieldControl = {
|
|
|
2847
2854
|
boxShadow: 'var(--shadow-xs)',
|
|
2848
2855
|
};
|
|
2849
2856
|
/**
|
|
2850
|
-
*
|
|
2851
|
-
*
|
|
2857
|
+
* The select trigger's lynx steps — `[inline padding in --size-field units,
|
|
2858
|
+
* font-size step]` — as the size variants set them (`lynxBtnPad` and the
|
|
2859
|
+
* web ramp's `fontSize`). One table, so the clear-trigger's offset below
|
|
2860
|
+
* cannot drift from the trigger it sits in.
|
|
2861
|
+
*/
|
|
2862
|
+
const SELECT_LYNX_STEPS = {
|
|
2863
|
+
xs: [2, 'xs'],
|
|
2864
|
+
sm: [3, 'sm'],
|
|
2865
|
+
md: [4, 'sm'],
|
|
2866
|
+
lg: [5, 'md'],
|
|
2867
|
+
xl: [6, 'lg'],
|
|
2868
|
+
};
|
|
2869
|
+
/**
|
|
2870
|
+
* Where the lynx clear-trigger's 1.5rem chip sits at one size step
|
|
2871
|
+
* (signalxjs/lynx#1184): centred in the field — the root is exactly the
|
|
2872
|
+
* trigger's height, so half the field less half the chip, from the top —
|
|
2873
|
+
* and one `--space-xs` short of the chevron's 1em box, which sits inside the
|
|
2874
|
+
* trigger's border and end padding at that step's font size. Physical
|
|
2875
|
+
* `top`/`right` and direct `calc(var())` only: lynx resolves no logical
|
|
2876
|
+
* insets on Android and no `min()`, and drops a `var()` that holds a
|
|
2877
|
+
* `calc()`.
|
|
2852
2878
|
*/
|
|
2853
|
-
const
|
|
2879
|
+
const lynxSelectClear = (step) => {
|
|
2880
|
+
const [pad, text] = SELECT_LYNX_STEPS[step];
|
|
2881
|
+
return {
|
|
2882
|
+
top: `calc(var(--size-field) * ${FIELD_STEPS[step] / 2} - 0.75rem)`,
|
|
2883
|
+
right: `calc(var(--border) + var(--size-field) * ${pad} + var(--text-${text}) + var(--space-xs))`,
|
|
2884
|
+
};
|
|
2885
|
+
};
|
|
2854
2886
|
export const select = {
|
|
2855
2887
|
component: 'select',
|
|
2856
2888
|
// Accent as text/border ink only — daisy's highlighted item is a neutral
|
|
@@ -2909,9 +2941,13 @@ export const select = {
|
|
|
2909
2941
|
},
|
|
2910
2942
|
indicator: {
|
|
2911
2943
|
base: { opacity: '0.6', transition: 'transform var(--duration-normal) var(--ease-standard)' },
|
|
2912
|
-
states: {
|
|
2913
|
-
|
|
2914
|
-
|
|
2944
|
+
states: {
|
|
2945
|
+
open: { transform: 'rotate(180deg)' },
|
|
2946
|
+
closed: {},
|
|
2947
|
+
// Room for the clear-trigger laid over the field (#280) — the
|
|
2948
|
+
// `clearable` flag the runtime stamps while it renders (#387).
|
|
2949
|
+
clearable: { marginInlineStart: 'calc(var(--space-2xl) + var(--space-sm))' },
|
|
2950
|
+
},
|
|
2915
2951
|
},
|
|
2916
2952
|
// Clears the selection (#280): daisy's ghost-btn over the field's
|
|
2917
2953
|
// inline end, just before the chevron — muted like it, the base-200
|
|
@@ -3056,9 +3092,41 @@ export const select = {
|
|
|
3056
3092
|
// A touch list has no highlight: the pressed item takes the
|
|
3057
3093
|
// highlighted item's wash.
|
|
3058
3094
|
item: { states: { pressed: { background: 'var(--color-base-200)' } } },
|
|
3095
|
+
// The × and the ▾ get a spacing contract (signalxjs/lynx#1184).
|
|
3096
|
+
// The web offsets the clear-trigger by "the md padding + 1em",
|
|
3097
|
+
// and the 1em is the clear-trigger's own text-sm: at lg/xl the
|
|
3098
|
+
// trigger's padding and chevron both grow, so the × slid onto
|
|
3099
|
+
// the ▾. Here the chevron is a 1em box (right-aligned, so an
|
|
3100
|
+
// unclearable select looks as before) and the clear-trigger a
|
|
3101
|
+
// 1.5rem square (WCAG 2.5.8's target) placed per size beside
|
|
3102
|
+
// it — see `lynxSelectClear`. The web's `min()` height and
|
|
3103
|
+
// `margin-block: auto` centring are dropped on lynx, which
|
|
3104
|
+
// left the box stretched to the field's full height: its
|
|
3105
|
+
// focus ring was a tall pill. The ring is inset, so it hugs
|
|
3106
|
+
// the chip and can never reach the chevron, and no gap shadow
|
|
3107
|
+
// paints past the chip's rounded corners.
|
|
3108
|
+
indicator: {
|
|
3109
|
+
base: { width: '1em', textAlign: 'right' },
|
|
3110
|
+
// The web's room for the chip (`margin-inline-start`) is a
|
|
3111
|
+
// logical spelling Android never resolves, and it is
|
|
3112
|
+
// sized off the web's own offset. Here the chip is a
|
|
3113
|
+
// 1.5rem square one `--space-xs` short of the chevron
|
|
3114
|
+
// at every size, so the room is exactly that — and the
|
|
3115
|
+
// trigger's `gap` stays between the value and the chip.
|
|
3116
|
+
// Before the `clearable` flag the web reached this with
|
|
3117
|
+
// `:has()`, which lynx cannot express: at lg/xl the value
|
|
3118
|
+
// ran under the chip and its focus ring
|
|
3119
|
+
// (signalxjs/lynx#1191).
|
|
3120
|
+
states: { clearable: { marginLeft: 'calc(1.5rem + var(--space-xs))' } },
|
|
3121
|
+
},
|
|
3122
|
+
// The value gives way to the chip instead of running under
|
|
3123
|
+
// it: one line, clipped with an ellipsis — the web's
|
|
3124
|
+
// `nowrap` button text, with a flex item's `min-width: auto`
|
|
3125
|
+
// lifted so it can shrink below its content at all.
|
|
3126
|
+
value: { base: { flexShrink: '1', minWidth: '0', overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' } },
|
|
3059
3127
|
'clear-trigger': {
|
|
3060
|
-
base: {
|
|
3061
|
-
states: lynxFocus(),
|
|
3128
|
+
base: { ...lynxSelectClear('md'), width: '1.5rem', height: '1.5rem', minWidth: '1.5rem', boxSizing: 'border-box' },
|
|
3129
|
+
states: lynxFocus({ inset: true }),
|
|
3062
3130
|
},
|
|
3063
3131
|
},
|
|
3064
3132
|
variants: {
|
|
@@ -3067,7 +3135,10 @@ export const select = {
|
|
|
3067
3135
|
color: Object.fromEntries(ROLES.map((c) => [c, { popup: { base: {
|
|
3068
3136
|
'--select-accent': `var(--color-${c})`,
|
|
3069
3137
|
} } }])),
|
|
3070
|
-
size:
|
|
3138
|
+
size: Object.fromEntries(Object.keys(SELECT_LYNX_STEPS).map((step) => [step, {
|
|
3139
|
+
trigger: { base: lynxBtnPad(SELECT_LYNX_STEPS[step][0]) },
|
|
3140
|
+
'clear-trigger': { base: lynxSelectClear(step) },
|
|
3141
|
+
}])),
|
|
3071
3142
|
},
|
|
3072
3143
|
},
|
|
3073
3144
|
},
|
|
@@ -3678,6 +3749,8 @@ export const toast = {
|
|
|
3678
3749
|
states: {
|
|
3679
3750
|
open: { opacity: '1', transform: 'none' },
|
|
3680
3751
|
closed: {},
|
|
3752
|
+
// Styled in `targets.web` — the swipe is web-only (#293).
|
|
3753
|
+
swiping: {},
|
|
3681
3754
|
},
|
|
3682
3755
|
at: {
|
|
3683
3756
|
'reduced-motion': { base: { transition: 'none' }, states: { open: { transform: 'none' } } },
|
|
@@ -3803,6 +3876,22 @@ export const toast = {
|
|
|
3803
3876
|
defaultVariants: { size: 'md' },
|
|
3804
3877
|
keyframes: { 'zero-daisyui-toast-spin': 'to { transform: rotate(360deg); }' },
|
|
3805
3878
|
targets: {
|
|
3879
|
+
// The swipe (#293) — web only, since the runtime's `--swipe-*` offset
|
|
3880
|
+
// is: composed ahead of the enter/exit offset, and no pan or pinch
|
|
3881
|
+
// starts on a toast, so a touch drag is the swipe's.
|
|
3882
|
+
web: {
|
|
3883
|
+
parts: {
|
|
3884
|
+
root: {
|
|
3885
|
+
base: { transform: `${SWIPE} translateY(var(--toast-from))`, touchAction: 'none' },
|
|
3886
|
+
states: { open: { transform: SWIPE } },
|
|
3887
|
+
selectors: {
|
|
3888
|
+
// Mid-swipe the toast tracks the pointer, not a transition.
|
|
3889
|
+
'&[data-swiping]': { transition: 'none', userSelect: 'none' },
|
|
3890
|
+
},
|
|
3891
|
+
at: { 'reduced-motion': { states: { open: { transform: SWIPE } } } },
|
|
3892
|
+
},
|
|
3893
|
+
},
|
|
3894
|
+
},
|
|
3806
3895
|
lynx: {
|
|
3807
3896
|
parts: {
|
|
3808
3897
|
// The viewport is a full-width strip on lynx (the runtime pins
|
|
@@ -7187,9 +7276,11 @@ export const steps = {
|
|
|
7187
7276
|
/**
|
|
7188
7277
|
* The modal sheet's slide (#83): in from its edge, back out to it.
|
|
7189
7278
|
*
|
|
7190
|
-
* `translate` is physical, so the travel is a custom property
|
|
7191
|
-
*
|
|
7192
|
-
* and rightward in RTL (the `rtl` hedge, as
|
|
7279
|
+
* `translate` is physical, so the travel is a custom property — the whole
|
|
7280
|
+
* `x y` pair — that flips with the placement AND the direction: off the
|
|
7281
|
+
* reading start is leftward in LTR and rightward in RTL (the `rtl` hedge, as
|
|
7282
|
+
* everywhere here), while a `top` / `bottom` sheet travels on Y and mirrors
|
|
7283
|
+
* in neither (#291). Keyed on
|
|
7193
7284
|
* `data-l-dock="sheet"`, the regime, which holds through the exit where
|
|
7194
7285
|
* `:modal` does not, so the slide-out leaves from the sheet's own box.
|
|
7195
7286
|
* Opacity stays at 1: the travel is the transition. Each direction rides the
|
|
@@ -7200,19 +7291,23 @@ const sheetSlide = (enter, exit) => {
|
|
|
7200
7291
|
const open = `${sheet}[data-state="open"]`;
|
|
7201
7292
|
const travel = (tempo) => {
|
|
7202
7293
|
const duration = tempo.split(' ')[0];
|
|
7203
|
-
|
|
7294
|
+
// `transform` rides along for the swipe's spring back (#293).
|
|
7295
|
+
return `translate ${tempo}, transform ${tempo}, display ${duration} allow-discrete, overlay ${duration} allow-discrete`;
|
|
7204
7296
|
};
|
|
7205
7297
|
return {
|
|
7206
|
-
base: { '--drawer-travel': '-100%' },
|
|
7298
|
+
base: { '--drawer-travel': '-100% 0' },
|
|
7207
7299
|
selectors: {
|
|
7208
|
-
'&[data-placement="end"]': { '--drawer-travel': '100%' },
|
|
7209
|
-
[`&[data-placement="start"]${rtl}`]: { '--drawer-travel': '100%' },
|
|
7210
|
-
[`&[data-placement="end"]${rtl}`]: { '--drawer-travel': '-100%' },
|
|
7211
|
-
|
|
7300
|
+
'&[data-placement="end"]': { '--drawer-travel': '100% 0' },
|
|
7301
|
+
[`&[data-placement="start"]${rtl}`]: { '--drawer-travel': '100% 0' },
|
|
7302
|
+
[`&[data-placement="end"]${rtl}`]: { '--drawer-travel': '-100% 0' },
|
|
7303
|
+
// The block edges travel on Y, and no direction mirrors them (#291).
|
|
7304
|
+
'&[data-placement="top"]': { '--drawer-travel': '0 -100%' },
|
|
7305
|
+
'&[data-placement="bottom"]': { '--drawer-travel': '0 100%' },
|
|
7306
|
+
[sheet]: { opacity: '1', translate: 'var(--drawer-travel)', transition: travel(exit) },
|
|
7212
7307
|
[open]: { translate: 'none', transition: travel(enter) },
|
|
7213
7308
|
},
|
|
7214
7309
|
at: {
|
|
7215
|
-
'starting-style': { selectors: { [open]: { opacity: '1', translate: 'var(--drawer-travel)
|
|
7310
|
+
'starting-style': { selectors: { [open]: { opacity: '1', translate: 'var(--drawer-travel)' } } },
|
|
7216
7311
|
'reduced-motion': { selectors: { [sheet]: { transition: 'none' }, [open]: { transition: 'none' } } },
|
|
7217
7312
|
},
|
|
7218
7313
|
};
|
|
@@ -7278,6 +7373,38 @@ export const drawer = {
|
|
|
7278
7373
|
},
|
|
7279
7374
|
'&[data-placement="start"][data-l-dock="sheet"]': { insetInlineStart: '0', insetInlineEnd: 'auto' },
|
|
7280
7375
|
'&[data-placement="end"][data-l-dock="sheet"]': { insetInlineStart: 'auto', insetInlineEnd: '0' },
|
|
7376
|
+
/**
|
|
7377
|
+
* The block edges (#291): a sheet across the viewport's width,
|
|
7378
|
+
* pinned with `inset-block-*` — nothing here mirrors in RTL. Its
|
|
7379
|
+
* height is this recipe's: content-sized up to most of the
|
|
7380
|
+
* viewport, so the scrim stays in reach. Full width by default —
|
|
7381
|
+
* `measure` still caps the INLINE size (centred by the auto
|
|
7382
|
+
* margins), which the `:where()` keeps below the layout step
|
|
7383
|
+
* table's specificity whatever order the files load in.
|
|
7384
|
+
*/
|
|
7385
|
+
'&:where([data-placement="top"], [data-placement="bottom"])': { '--l-measure': 'none' },
|
|
7386
|
+
'&[data-placement="top"][data-l-dock="sheet"]': {
|
|
7387
|
+
insetBlockStart: '0',
|
|
7388
|
+
insetBlockEnd: 'auto',
|
|
7389
|
+
insetInlineStart: '0',
|
|
7390
|
+
insetInlineEnd: '0',
|
|
7391
|
+
marginInline: 'auto',
|
|
7392
|
+
blockSize: 'auto',
|
|
7393
|
+
maxBlockSize: '85dvh',
|
|
7394
|
+
borderEndStartRadius: 'var(--radius-box)',
|
|
7395
|
+
borderEndEndRadius: 'var(--radius-box)',
|
|
7396
|
+
},
|
|
7397
|
+
'&[data-placement="bottom"][data-l-dock="sheet"]': {
|
|
7398
|
+
insetBlockStart: 'auto',
|
|
7399
|
+
insetBlockEnd: '0',
|
|
7400
|
+
insetInlineStart: '0',
|
|
7401
|
+
insetInlineEnd: '0',
|
|
7402
|
+
marginInline: 'auto',
|
|
7403
|
+
blockSize: 'auto',
|
|
7404
|
+
maxBlockSize: '85dvh',
|
|
7405
|
+
borderStartStartRadius: 'var(--radius-box)',
|
|
7406
|
+
borderStartEndRadius: 'var(--radius-box)',
|
|
7407
|
+
},
|
|
7281
7408
|
},
|
|
7282
7409
|
}),
|
|
7283
7410
|
backdrop: {
|
|
@@ -7299,8 +7426,27 @@ export const drawer = {
|
|
|
7299
7426
|
// Trigger-carried axes — see `btnColors` for why the panel is out of
|
|
7300
7427
|
// reach and the trigger is the whole story here.
|
|
7301
7428
|
variants: { color: btnColors(), size: btnSizes },
|
|
7302
|
-
// The btn paddings, restated physically — see `lynxBtnPad` (#1084).
|
|
7303
7429
|
targets: {
|
|
7430
|
+
// Swipe to dismiss (#293) — web only, since the runtime's `--swipe-*`
|
|
7431
|
+
// offset is: the sheet wears the drag offset (`SWIPE`) in every
|
|
7432
|
+
// state — so a swiped sheet leaves from where it was let go — at a
|
|
7433
|
+
// weight above the presence's own open `transform`. Mid-swipe no
|
|
7434
|
+
// transition runs. A touch pan across the dismiss axis stays the
|
|
7435
|
+
// page's; along it is the gesture's, so content taller than a
|
|
7436
|
+
// block-edge sheet scrolls in a box of its own inside the panel.
|
|
7437
|
+
web: {
|
|
7438
|
+
parts: {
|
|
7439
|
+
panel: {
|
|
7440
|
+
selectors: {
|
|
7441
|
+
'&[data-l-dock="sheet"][data-state]': { transform: SWIPE },
|
|
7442
|
+
'&[data-l-dock="sheet"][data-state="open"][data-swiping]': { transition: 'none', userSelect: 'none' },
|
|
7443
|
+
'&[data-l-dock="sheet"]:where([data-placement="start"], [data-placement="end"])': { touchAction: 'pan-y' },
|
|
7444
|
+
'&[data-l-dock="sheet"]:where([data-placement="top"], [data-placement="bottom"])': { touchAction: 'pan-x' },
|
|
7445
|
+
},
|
|
7446
|
+
},
|
|
7447
|
+
},
|
|
7448
|
+
},
|
|
7449
|
+
// The btn paddings, restated physically — see `lynxBtnPad` (#1084).
|
|
7304
7450
|
lynx: {
|
|
7305
7451
|
parts: {
|
|
7306
7452
|
trigger: { base: lynxBtnPad(4) },
|