@qw-ui/tokens 0.3.0-next.4 → 0.3.0-next.42

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.
Files changed (24) hide show
  1. package/README.md +20 -53
  2. package/dist/color-architecture.d.ts +163 -2
  3. package/dist/derive/index.d.ts +3 -3
  4. package/dist/derive/live-css.d.ts +1 -1
  5. package/dist/derive/reference.d.ts +73 -13
  6. package/dist/derive/semantic.d.ts +24 -1
  7. package/dist/derive/tailwind.d.ts +31 -0
  8. package/dist/design-doc.d.ts +1 -1
  9. package/dist/figma/color-contract.d.ts +2 -0
  10. package/dist/figma/color-snapshot.d.ts +4 -0
  11. package/dist/index.d.ts +5 -4
  12. package/dist/index.js +1027 -366
  13. package/dist/index.js.map +1 -1
  14. package/dist/schema.d.ts +3 -3
  15. package/dist/tailwind.css +85 -0
  16. package/dist/tokens.css +308 -218
  17. package/dist/tokens.json +290 -93
  18. package/dist/tokens.live.css +178 -9
  19. package/dist/tokens.ts +293 -131
  20. package/package.json +12 -29
  21. package/dist/compat/build.d.ts +0 -14
  22. package/dist/compat/color.d.ts +0 -8
  23. package/dist/compat/index.d.ts +0 -5
  24. package/dist/compat/schema.d.ts +0 -114
package/dist/tokens.json CHANGED
@@ -264,6 +264,8 @@
264
264
  "--qw-ref-color-brown-800": "#542800",
265
265
  "--qw-ref-color-brown-900": "#200B00",
266
266
  "--qw-ref-color-brown-base": "#b45e06",
267
+ "--qw-ref-color-black-contrast-endpoint": "#000000",
268
+ "--qw-ref-size-spacing-0": "0px",
267
269
  "--qw-ref-size-spacing-1": "4px",
268
270
  "--qw-ref-size-spacing-2": "8px",
269
271
  "--qw-ref-size-spacing-3": "12px",
@@ -272,9 +274,19 @@
272
274
  "--qw-ref-size-spacing-6": "24px",
273
275
  "--qw-ref-size-spacing-7": "28px",
274
276
  "--qw-ref-size-spacing-8": "32px",
277
+ "--qw-ref-size-safe-area-inset-top": "env(safe-area-inset-top, 0px)",
278
+ "--qw-ref-size-safe-area-inset-right": "env(safe-area-inset-right, 0px)",
279
+ "--qw-ref-size-safe-area-inset-bottom": "env(safe-area-inset-bottom, 0px)",
280
+ "--qw-ref-size-safe-area-inset-left": "env(safe-area-inset-left, 0px)",
281
+ "--qw-ref-size-placeholder-text-height-base": "1em",
282
+ "--qw-ref-size-placeholder-media-height-base": "120px",
283
+ "--qw-ref-size-loading-logo-size-sm": "32px",
284
+ "--qw-ref-size-loading-logo-size-md": "48px",
285
+ "--qw-ref-size-loading-logo-size-lg": "60px",
275
286
  "--qw-ref-size-radius-sm": "4px",
276
287
  "--qw-ref-size-radius-md": "8px",
277
288
  "--qw-ref-size-radius-lg": "14px",
289
+ "--qw-ref-size-radius-xl": "16px",
278
290
  "--qw-ref-size-radius-full": "9999px",
279
291
  "--qw-ref-size-control-size-sm": "32px",
280
292
  "--qw-ref-size-control-size-md": "40px",
@@ -282,9 +294,23 @@
282
294
  "--qw-ref-size-icon-size-sm": "16px",
283
295
  "--qw-ref-size-icon-size-md": "20px",
284
296
  "--qw-ref-size-icon-size-lg": "24px",
285
- "--qw-ref-size-border-width-hairline": "1px",
297
+ "--qw-ref-size-stroke-width-half": "0.5px",
298
+ "--qw-ref-size-stroke-width-base": "1px",
299
+ "--qw-ref-size-stroke-width-double": "2px",
300
+ "--qw-ref-size-stroke-width-triple": "3px",
301
+ "--qw-ref-size-action-control-height-2xs": "24px",
302
+ "--qw-ref-size-action-control-height-xs": "28px",
303
+ "--qw-ref-size-action-control-height-sm": "32px",
304
+ "--qw-ref-size-action-control-height-md": "36px",
305
+ "--qw-ref-size-action-control-height-lg": "42px",
306
+ "--qw-ref-size-action-control-height-xl": "50px",
307
+ "--qw-ref-size-action-control-icon-2xs": "14px",
308
+ "--qw-ref-size-avatar-diameter-sm": "40px",
309
+ "--qw-ref-size-avatar-diameter-md": "50px",
310
+ "--qw-ref-size-avatar-diameter-lg": "58px",
286
311
  "--qw-ref-typography-line-height-tight": "1.25",
287
312
  "--qw-ref-typography-line-height-normal": "1.5",
313
+ "--qw-ref-typography-line-height-comfortable": "1.625",
288
314
  "--qw-ref-typography-line-height-relaxed": "1.75",
289
315
  "--qw-ref-size-opacity-disabled": "0.5",
290
316
  "--qw-ref-size-z-index-1": "10",
@@ -304,6 +330,7 @@
304
330
  "--qw-ref-typography-font-weight-medium": "500",
305
331
  "--qw-ref-typography-font-weight-semibold": "600",
306
332
  "--qw-ref-typography-font-size-base": "14px",
333
+ "--qw-ref-typography-font-size-xs": "11px",
307
334
  "--qw-ref-typography-font-size-sm": "12px",
308
335
  "--qw-ref-typography-font-size-lg": "16px",
309
336
  "--qw-ref-typography-font-size-xl": "20px",
@@ -312,12 +339,18 @@
312
339
  "--qw-ref-motion-duration-fast": "100ms",
313
340
  "--qw-ref-motion-duration-base": "200ms",
314
341
  "--qw-ref-motion-duration-slow": "320ms",
342
+ "--qw-ref-motion-duration-shimmer": "2000ms",
343
+ "--qw-ref-motion-easing-linear": "linear",
344
+ "--qw-ref-motion-easing-symmetric": "ease-in-out",
315
345
  "--qw-ref-motion-easing-standard": "cubic-bezier(0.16, 1, 0.3, 1)",
346
+ "--qw-ref-effect-blur-sm": "2px",
316
347
  "--qw-ref-effect-shadow-sm": "0px 1px 2px 0px rgba(0, 0, 0, 0.08)",
317
348
  "--qw-ref-effect-shadow-md": "0px 4px 12px 0px rgba(0, 0, 0, 0.12)",
318
349
  "--qw-ref-effect-shadow-lg": "0px 8px 24px 0px rgba(0, 0, 0, 0.16)",
350
+ "--qw-sem-size-radius-sm": "4px",
319
351
  "--qw-sem-size-radius-control": "8px",
320
352
  "--qw-sem-size-radius-card": "14px",
353
+ "--qw-sem-size-radius-xl": "16px",
321
354
  "--qw-sem-size-radius-pill": "9999px",
322
355
  "--qw-sem-size-radius-full": "9999px",
323
356
  "--qw-sem-size-control-height-sm": "32px",
@@ -326,6 +359,57 @@
326
359
  "--qw-sem-size-icon-size-sm": "16px",
327
360
  "--qw-sem-size-icon-size-md": "20px",
328
361
  "--qw-sem-size-icon-size-lg": "24px",
362
+ "--qw-sem-size-action-control-height-2xs": "24px",
363
+ "--qw-sem-size-action-control-height-xs": "28px",
364
+ "--qw-sem-size-action-control-height-sm": "32px",
365
+ "--qw-sem-size-action-control-height-md": "36px",
366
+ "--qw-sem-size-action-control-height-lg": "42px",
367
+ "--qw-sem-size-action-control-height-xl": "50px",
368
+ "--qw-sem-size-action-control-padding-inline-2xs": "8px",
369
+ "--qw-sem-size-action-control-padding-inline-xs": "8px",
370
+ "--qw-sem-size-action-control-padding-inline-sm": "16px",
371
+ "--qw-sem-size-action-control-padding-inline-md": "16px",
372
+ "--qw-sem-size-action-control-padding-inline-lg": "20px",
373
+ "--qw-sem-size-action-control-padding-inline-xl": "32px",
374
+ "--qw-sem-size-action-control-icon-2xs": "14px",
375
+ "--qw-sem-size-action-control-icon-xs": "16px",
376
+ "--qw-sem-size-action-control-icon-sm": "16px",
377
+ "--qw-sem-size-action-control-icon-md": "16px",
378
+ "--qw-sem-size-action-control-icon-lg": "16px",
379
+ "--qw-sem-size-action-control-icon-xl": "20px",
380
+ "--qw-sem-size-action-control-gap-2xs": "4px",
381
+ "--qw-sem-size-action-control-gap-xs": "4px",
382
+ "--qw-sem-size-action-control-gap-sm": "8px",
383
+ "--qw-sem-size-action-control-gap-md": "8px",
384
+ "--qw-sem-size-action-control-gap-lg": "8px",
385
+ "--qw-sem-size-action-control-gap-xl": "8px",
386
+ "--qw-sem-size-border-width-default": "1px",
387
+ "--qw-sem-size-border-width-strong": "2px",
388
+ "--qw-sem-size-divider-width-thin": "0.5px",
389
+ "--qw-sem-size-divider-width-default": "1px",
390
+ "--qw-sem-size-focus-ring-width": "2px",
391
+ "--qw-sem-size-focus-ring-offset": "2px",
392
+ "--qw-sem-size-indicator-loading": "2px",
393
+ "--qw-sem-size-avatar-diameter-sm": "40px",
394
+ "--qw-sem-size-avatar-diameter-md": "50px",
395
+ "--qw-sem-size-avatar-diameter-lg": "58px",
396
+ "--qw-sem-size-layout-gap-sm": "8px",
397
+ "--qw-sem-size-layout-gap-md": "16px",
398
+ "--qw-sem-size-layout-gap-lg": "24px",
399
+ "--qw-sem-size-safe-area-inset-top": "env(safe-area-inset-top, 0px)",
400
+ "--qw-sem-size-safe-area-inset-right": "env(safe-area-inset-right, 0px)",
401
+ "--qw-sem-size-safe-area-inset-bottom": "env(safe-area-inset-bottom, 0px)",
402
+ "--qw-sem-size-safe-area-inset-left": "env(safe-area-inset-left, 0px)",
403
+ "--qw-sem-size-safe-area-minimum-none": "0px",
404
+ "--qw-sem-size-safe-area-minimum-sm": "8px",
405
+ "--qw-sem-size-safe-area-minimum-md": "16px",
406
+ "--qw-sem-size-safe-area-minimum-lg": "24px",
407
+ "--qw-sem-size-loading-sm": "32px",
408
+ "--qw-sem-size-loading-md": "48px",
409
+ "--qw-sem-size-loading-lg": "60px",
410
+ "--qw-sem-size-skeleton-text-height": "1em",
411
+ "--qw-sem-size-skeleton-rect-height": "120px",
412
+ "--qw-sem-size-skeleton-circle-diameter": "40px",
329
413
  "--qw-sem-size-inset-sm": "8px",
330
414
  "--qw-sem-size-stack-sm": "8px",
331
415
  "--qw-sem-size-inset-md": "16px",
@@ -350,6 +434,11 @@
350
434
  "--qw-sem-typography-body-strong-font-weight": "500",
351
435
  "--qw-sem-typography-body-strong-line-height": "1.5",
352
436
  "--qw-sem-typography-body-strong-letter-spacing": "0px",
437
+ "--qw-sem-typography-product-title-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
438
+ "--qw-sem-typography-product-title-font-size": "16px",
439
+ "--qw-sem-typography-product-title-font-weight": "600",
440
+ "--qw-sem-typography-product-title-line-height": "1.625",
441
+ "--qw-sem-typography-product-title-letter-spacing": "0px",
353
442
  "--qw-sem-typography-heading-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
354
443
  "--qw-sem-typography-heading-sm-font-size": "16px",
355
444
  "--qw-sem-typography-heading-sm-font-weight": "600",
@@ -370,6 +459,16 @@
370
459
  "--qw-sem-typography-caption-font-weight": "400",
371
460
  "--qw-sem-typography-caption-line-height": "1.5",
372
461
  "--qw-sem-typography-caption-letter-spacing": "0px",
462
+ "--qw-sem-typography-body-lg-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
463
+ "--qw-sem-typography-body-lg-font-size": "16px",
464
+ "--qw-sem-typography-body-lg-font-weight": "400",
465
+ "--qw-sem-typography-body-lg-line-height": "1.5",
466
+ "--qw-sem-typography-body-lg-letter-spacing": "0px",
467
+ "--qw-sem-typography-label-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
468
+ "--qw-sem-typography-label-sm-font-size": "11px",
469
+ "--qw-sem-typography-label-sm-font-weight": "500",
470
+ "--qw-sem-typography-label-sm-line-height": "1.5",
471
+ "--qw-sem-typography-label-sm-letter-spacing": "0px",
373
472
  "--qw-sem-typography-code-font-family": "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace",
374
473
  "--qw-sem-typography-code-font-size": "12px",
375
474
  "--qw-sem-typography-code-font-weight": "400",
@@ -378,114 +477,79 @@
378
477
  "--qw-sem-motion-duration-fast": "100ms",
379
478
  "--qw-sem-motion-duration-base": "200ms",
380
479
  "--qw-sem-motion-duration-slow": "320ms",
480
+ "--qw-sem-motion-duration-shimmer": "2000ms",
481
+ "--qw-sem-motion-duration-spin": "2000ms",
381
482
  "--qw-sem-motion-easing-standard": "cubic-bezier(0.16, 1, 0.3, 1)",
483
+ "--qw-sem-motion-easing-symmetric": "ease-in-out",
484
+ "--qw-sem-motion-easing-linear": "linear",
485
+ "--qw-sem-effect-blur-media-control": "2px",
382
486
  "--qw-sem-color-surface-base": "#ffffff",
383
487
  "--qw-sem-color-surface-subtle": "#F6F6F6",
384
488
  "--qw-sem-color-surface-elevated": "#ffffff",
385
489
  "--qw-sem-color-surface-header": "#EEEEEE",
386
490
  "--qw-sem-color-surface-brand-subtle": "#EBF5FF",
491
+ "--qw-sem-color-surface-canvas": "#ffffff",
492
+ "--qw-sem-color-surface-sunken": "#EEEEEE",
493
+ "--qw-sem-color-surface-selected": "rgba(34, 34, 34, 0.05)",
494
+ "--qw-sem-color-surface-inverse": "#353535",
495
+ "--qw-sem-color-surface-canvas-subtle": "#F6F6F6",
496
+ "--qw-sem-color-content-danger": "#CF081E",
387
497
  "--qw-sem-color-content-primary": "#222222",
388
498
  "--qw-sem-color-content-secondary": "#666666",
389
499
  "--qw-sem-color-content-tertiary": "#999999",
390
500
  "--qw-sem-color-content-placeholder": "#CCCCCC",
391
501
  "--qw-sem-color-content-intro": "#A2A9B6",
502
+ "--qw-sem-color-content-disabled": "rgba(34, 34, 34, 0.3)",
503
+ "--qw-sem-color-content-link": "#003DB8",
504
+ "--qw-sem-color-content-icon-subtle": "rgba(34, 34, 34, 0.05)",
505
+ "--qw-sem-color-content-inverse": "#ffffff",
506
+ "--qw-sem-color-content-on-solid": "#ffffff",
507
+ "--qw-sem-color-content-on-brand": "#ffffff",
508
+ "--qw-sem-color-content-on-warning-subtle": "#453200",
392
509
  "--qw-sem-color-border-default": "#EEEEEE",
393
510
  "--qw-sem-color-border-strong": "#CCCCCC",
511
+ "--qw-sem-color-border-control": "#666666",
394
512
  "--qw-sem-color-border-focus": "#0011ff",
513
+ "--qw-sem-color-border-subtle": "rgba(34, 34, 34, 0.05)",
514
+ "--qw-sem-color-border-disabled": "rgba(34, 34, 34, 0.1)",
515
+ "--qw-sem-color-border-on-media": "#ffffff",
395
516
  "--qw-sem-color-fill-subtle": "#F6F6F6",
396
517
  "--qw-sem-color-fill-hover": "#EEEEEE",
397
518
  "--qw-sem-color-fill-active": "#EBF5FF",
398
519
  "--qw-sem-color-fill-disabled": "#F6F6F6",
520
+ "--qw-sem-color-fill-track": "rgba(34, 34, 34, 0.1)",
399
521
  "--qw-sem-color-action-brand": "#0011ff",
400
522
  "--qw-sem-color-action-product": "#0d53ff",
401
523
  "--qw-sem-color-action-selected": "rgba(13, 83, 255, 0.2)",
402
524
  "--qw-sem-color-action-inverse": "#ffffff",
525
+ "--qw-sem-color-control-action-brand-subtle": "rgba(0, 17, 255, 0.1)",
526
+ "--qw-sem-color-control-action-product-subtle": "rgba(13, 83, 255, 0.1)",
527
+ "--qw-sem-color-control-action-danger-default": "#CF081E",
528
+ "--qw-sem-color-control-action-danger-subtle": "rgba(255, 64, 64, 0.1)",
529
+ "--qw-sem-color-control-action-neutral-subtle": "rgba(34, 34, 34, 0.05)",
530
+ "--qw-sem-color-control-selection-brand": "rgba(0, 17, 255, 0.1)",
531
+ "--qw-sem-color-control-selection-product": "rgba(13, 83, 255, 0.1)",
532
+ "--qw-sem-color-selection-text-background": "rgba(13, 83, 255, 0.2)",
403
533
  "--qw-sem-color-status-success": "#1f993f",
404
534
  "--qw-sem-color-status-warning": "#ffd575",
405
535
  "--qw-sem-color-status-danger": "#FF5745",
406
536
  "--qw-sem-color-status-info": "#0d53ff",
537
+ "--qw-sem-color-status-success-subtle": "rgba(31, 153, 63, 0.1)",
538
+ "--qw-sem-color-status-warning-subtle": "rgba(255, 213, 117, 0.2)",
539
+ "--qw-sem-color-status-danger-subtle": "rgba(255, 64, 64, 0.1)",
540
+ "--qw-sem-color-status-info-subtle": "rgba(13, 83, 255, 0.1)",
407
541
  "--qw-sem-color-overlay-scrim": "rgba(34, 34, 34, 0.5)",
408
- "--qw-sem-color-overlay-guide": "rgba(34, 34, 34, 0.7)",
542
+ "--qw-sem-color-overlay-guide": "rgba(13, 83, 255, 0.1)",
543
+ "--qw-sem-color-overlay-media-subtle": "rgba(34, 34, 34, 0.4)",
544
+ "--qw-sem-color-overlay-media-strong": "rgba(34, 34, 34, 0.5)",
545
+ "--qw-sem-color-overlay-control-on-media": "rgba(34, 34, 34, 0.5)",
409
546
  "--qw-sem-color-shadow": "rgba(34, 34, 34, 0.1)",
410
- "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.1)",
411
- "--qw-compat-button-dimension-height-mini": "24px",
412
- "--qw-compat-button-dimension-height-xs": "28px",
413
- "--qw-compat-button-dimension-height-s": "32px",
414
- "--qw-compat-button-dimension-height-normal": "36px",
415
- "--qw-compat-button-dimension-height-m": "42px",
416
- "--qw-compat-button-dimension-height-l": "50px",
417
- "--qw-compat-button-dimension-square-mini": "24px",
418
- "--qw-compat-button-dimension-square-xs": "28px",
419
- "--qw-compat-button-dimension-square-s": "32px",
420
- "--qw-compat-button-dimension-square-normal": "36px",
421
- "--qw-compat-button-dimension-square-m": "42px",
422
- "--qw-compat-button-dimension-square-l": "50px",
423
- "--qw-compat-button-dimension-padding-inline-mini": "8px",
424
- "--qw-compat-button-dimension-padding-inline-xs": "8px",
425
- "--qw-compat-button-dimension-padding-inline-s": "16px",
426
- "--qw-compat-button-dimension-padding-inline-normal": "16px",
427
- "--qw-compat-button-dimension-padding-inline-m": "20px",
428
- "--qw-compat-button-dimension-padding-inline-l": "32px",
429
- "--qw-compat-button-dimension-icon-mini": "14px",
430
- "--qw-compat-button-dimension-icon-xs": "16px",
431
- "--qw-compat-button-dimension-icon-s": "16px",
432
- "--qw-compat-button-dimension-icon-normal": "16px",
433
- "--qw-compat-button-dimension-icon-m": "16px",
434
- "--qw-compat-button-dimension-icon-l": "20px",
435
- "--qw-compat-button-dimension-gap-mini": "4px",
436
- "--qw-compat-button-dimension-gap-xs": "4px",
437
- "--qw-compat-button-dimension-gap-s": "8px",
438
- "--qw-compat-button-dimension-gap-normal": "8px",
439
- "--qw-compat-button-dimension-gap-m": "8px",
440
- "--qw-compat-button-dimension-gap-l": "8px",
441
- "--qw-compat-button-dimension-border-width": "1px",
442
- "--qw-compat-button-dimension-focus-ring-width": "2px",
443
- "--qw-compat-button-dimension-focus-ring-offset": "2px",
444
- "--qw-compat-button-dimension-spinner-stroke": "2px",
445
- "--qw-compat-button-color-bg-soft-brand": "rgba(0, 68, 255, 0.1)",
446
- "--qw-compat-button-color-bg-soft-danger": "rgba(255, 87, 69, 0.1)",
447
- "--qw-compat-button-color-bg-neutral-gray": "rgba(34, 34, 34, 0.06)",
448
- "--qw-compat-loading-color-logo": "rgba(34, 34, 34, 0.06)",
449
- "--qw-compat-loading-dimension-radius-surface": "16px",
450
- "--qw-compat-tag-dimension-radius-small": "2px",
451
- "--qw-compat-tag-dimension-radius-medium": "4px",
452
- "--qw-compat-tag-dimension-radius-large": "4px",
453
- "--qw-compat-tag-dimension-border-width": "1px",
454
- "--qw-compat-tag-dimension-height-small": "12px",
455
- "--qw-compat-tag-dimension-height-medium": "16px",
456
- "--qw-compat-tag-dimension-height-large": "20px",
457
- "--qw-compat-tag-dimension-padding-inline-small": "3px",
458
- "--qw-compat-tag-dimension-padding-inline-medium": "4px",
459
- "--qw-compat-tag-dimension-padding-inline-large": "5px",
460
- "--qw-compat-tag-typography-line-height-small": "16px",
461
- "--qw-compat-tag-typography-line-height-medium": "22px",
462
- "--qw-compat-tag-typography-line-height-large": "22px",
463
- "--qw-compat-tag-typography-font-size-small": "8px",
464
- "--qw-compat-tag-typography-font-size-medium": "11px",
465
- "--qw-compat-tag-typography-font-size-large": "11px",
466
- "--qw-compat-avatar-dimension-diameter-s": "40px",
467
- "--qw-compat-avatar-dimension-diameter-m": "50px",
468
- "--qw-compat-avatar-dimension-diameter-l": "58px",
469
- "--qw-compat-avatar-color-border": "rgba(34, 34, 34, 0.06)",
470
- "--qw-compat-avatar-dimension-border-width": "1px",
471
- "--qw-compat-avatar-dimension-badge-font-size": "11px",
472
- "--qw-compat-avatar-dimension-badge-line-height": "16px",
473
- "--qw-compat-avatar-dimension-badge-padding": "5px",
474
- "--qw-compat-avatar-color-badge-border": "#FFFFFF",
475
- "--qw-compat-avatar-color-badge-text": "#FFFFFF",
476
- "--qw-compat-textarea-color-paste-text": "#FFFFFF",
477
- "--qw-compat-tabs-color-button-bg-selected": "rgba(34, 34, 34, 0.06)",
478
- "--qw-compat-tabs-color-button-border": "rgba(34, 34, 34, 0.03)",
479
- "--qw-compat-tabs-dimension-border-width": "1px",
480
- "--qw-compat-image-dimension-border-width": "1px",
481
- "--qw-compat-divider-color-border": "rgba(34, 34, 34, 0.03)",
482
- "--qw-compat-divider-dimension-weight-thin": "0.5px",
483
- "--qw-compat-divider-dimension-weight-thick": "1px",
484
- "--qw-compat-empty-dimension-description-font-size": "16px",
485
- "--qw-compat-empty-dimension-description-line-height": "26px",
486
- "--qw-compat-empty-dimension-title-gap": "10px",
487
- "--qw-compat-image-color-background": "#F8F8F8",
488
- "--qw-compat-skeleton-color-background": "rgba(185, 185, 185, 0.1)"
547
+ "--qw-sem-effect-shadow-card-color": "rgba(34, 34, 34, 0.1)",
548
+ "--qw-sem-effect-shadow-floating-color": "rgba(34, 34, 34, 0.1)",
549
+ "--qw-sem-effect-shadow-dialog-color": "rgba(34, 34, 34, 0.1)",
550
+ "--qw-sem-effect-shadow-card": "0px 1px 2px 0px rgba(34, 34, 34, 0.1)",
551
+ "--qw-sem-effect-shadow-floating": "0px 4px 12px 0px rgba(34, 34, 34, 0.1)",
552
+ "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.1)"
489
553
  },
490
554
  "dark": {
491
555
  "--qw-ref-color-brand-a5": "rgba(0, 17, 255, 0.05)",
@@ -752,6 +816,8 @@
752
816
  "--qw-ref-color-brown-800": "#542800",
753
817
  "--qw-ref-color-brown-900": "#200B00",
754
818
  "--qw-ref-color-brown-base": "#b45e06",
819
+ "--qw-ref-color-black-contrast-endpoint": "#000000",
820
+ "--qw-ref-size-spacing-0": "0px",
755
821
  "--qw-ref-size-spacing-1": "4px",
756
822
  "--qw-ref-size-spacing-2": "8px",
757
823
  "--qw-ref-size-spacing-3": "12px",
@@ -760,9 +826,19 @@
760
826
  "--qw-ref-size-spacing-6": "24px",
761
827
  "--qw-ref-size-spacing-7": "28px",
762
828
  "--qw-ref-size-spacing-8": "32px",
829
+ "--qw-ref-size-safe-area-inset-top": "env(safe-area-inset-top, 0px)",
830
+ "--qw-ref-size-safe-area-inset-right": "env(safe-area-inset-right, 0px)",
831
+ "--qw-ref-size-safe-area-inset-bottom": "env(safe-area-inset-bottom, 0px)",
832
+ "--qw-ref-size-safe-area-inset-left": "env(safe-area-inset-left, 0px)",
833
+ "--qw-ref-size-placeholder-text-height-base": "1em",
834
+ "--qw-ref-size-placeholder-media-height-base": "120px",
835
+ "--qw-ref-size-loading-logo-size-sm": "32px",
836
+ "--qw-ref-size-loading-logo-size-md": "48px",
837
+ "--qw-ref-size-loading-logo-size-lg": "60px",
763
838
  "--qw-ref-size-radius-sm": "4px",
764
839
  "--qw-ref-size-radius-md": "8px",
765
840
  "--qw-ref-size-radius-lg": "14px",
841
+ "--qw-ref-size-radius-xl": "16px",
766
842
  "--qw-ref-size-radius-full": "9999px",
767
843
  "--qw-ref-size-control-size-sm": "32px",
768
844
  "--qw-ref-size-control-size-md": "40px",
@@ -770,9 +846,23 @@
770
846
  "--qw-ref-size-icon-size-sm": "16px",
771
847
  "--qw-ref-size-icon-size-md": "20px",
772
848
  "--qw-ref-size-icon-size-lg": "24px",
773
- "--qw-ref-size-border-width-hairline": "1px",
849
+ "--qw-ref-size-stroke-width-half": "0.5px",
850
+ "--qw-ref-size-stroke-width-base": "1px",
851
+ "--qw-ref-size-stroke-width-double": "2px",
852
+ "--qw-ref-size-stroke-width-triple": "3px",
853
+ "--qw-ref-size-action-control-height-2xs": "24px",
854
+ "--qw-ref-size-action-control-height-xs": "28px",
855
+ "--qw-ref-size-action-control-height-sm": "32px",
856
+ "--qw-ref-size-action-control-height-md": "36px",
857
+ "--qw-ref-size-action-control-height-lg": "42px",
858
+ "--qw-ref-size-action-control-height-xl": "50px",
859
+ "--qw-ref-size-action-control-icon-2xs": "14px",
860
+ "--qw-ref-size-avatar-diameter-sm": "40px",
861
+ "--qw-ref-size-avatar-diameter-md": "50px",
862
+ "--qw-ref-size-avatar-diameter-lg": "58px",
774
863
  "--qw-ref-typography-line-height-tight": "1.25",
775
864
  "--qw-ref-typography-line-height-normal": "1.5",
865
+ "--qw-ref-typography-line-height-comfortable": "1.625",
776
866
  "--qw-ref-typography-line-height-relaxed": "1.75",
777
867
  "--qw-ref-size-opacity-disabled": "0.5",
778
868
  "--qw-ref-size-z-index-1": "10",
@@ -792,6 +882,7 @@
792
882
  "--qw-ref-typography-font-weight-medium": "500",
793
883
  "--qw-ref-typography-font-weight-semibold": "600",
794
884
  "--qw-ref-typography-font-size-base": "14px",
885
+ "--qw-ref-typography-font-size-xs": "11px",
795
886
  "--qw-ref-typography-font-size-sm": "12px",
796
887
  "--qw-ref-typography-font-size-lg": "16px",
797
888
  "--qw-ref-typography-font-size-xl": "20px",
@@ -800,12 +891,18 @@
800
891
  "--qw-ref-motion-duration-fast": "100ms",
801
892
  "--qw-ref-motion-duration-base": "200ms",
802
893
  "--qw-ref-motion-duration-slow": "320ms",
894
+ "--qw-ref-motion-duration-shimmer": "2000ms",
895
+ "--qw-ref-motion-easing-linear": "linear",
896
+ "--qw-ref-motion-easing-symmetric": "ease-in-out",
803
897
  "--qw-ref-motion-easing-standard": "cubic-bezier(0.16, 1, 0.3, 1)",
898
+ "--qw-ref-effect-blur-sm": "2px",
804
899
  "--qw-ref-effect-shadow-sm": "0px 1px 2px 0px rgba(0, 0, 0, 0.08)",
805
900
  "--qw-ref-effect-shadow-md": "0px 4px 12px 0px rgba(0, 0, 0, 0.12)",
806
901
  "--qw-ref-effect-shadow-lg": "0px 8px 24px 0px rgba(0, 0, 0, 0.16)",
902
+ "--qw-sem-size-radius-sm": "4px",
807
903
  "--qw-sem-size-radius-control": "8px",
808
904
  "--qw-sem-size-radius-card": "14px",
905
+ "--qw-sem-size-radius-xl": "16px",
809
906
  "--qw-sem-size-radius-pill": "9999px",
810
907
  "--qw-sem-size-radius-full": "9999px",
811
908
  "--qw-sem-size-control-height-sm": "32px",
@@ -814,6 +911,57 @@
814
911
  "--qw-sem-size-icon-size-sm": "16px",
815
912
  "--qw-sem-size-icon-size-md": "20px",
816
913
  "--qw-sem-size-icon-size-lg": "24px",
914
+ "--qw-sem-size-action-control-height-2xs": "24px",
915
+ "--qw-sem-size-action-control-height-xs": "28px",
916
+ "--qw-sem-size-action-control-height-sm": "32px",
917
+ "--qw-sem-size-action-control-height-md": "36px",
918
+ "--qw-sem-size-action-control-height-lg": "42px",
919
+ "--qw-sem-size-action-control-height-xl": "50px",
920
+ "--qw-sem-size-action-control-padding-inline-2xs": "8px",
921
+ "--qw-sem-size-action-control-padding-inline-xs": "8px",
922
+ "--qw-sem-size-action-control-padding-inline-sm": "16px",
923
+ "--qw-sem-size-action-control-padding-inline-md": "16px",
924
+ "--qw-sem-size-action-control-padding-inline-lg": "20px",
925
+ "--qw-sem-size-action-control-padding-inline-xl": "32px",
926
+ "--qw-sem-size-action-control-icon-2xs": "14px",
927
+ "--qw-sem-size-action-control-icon-xs": "16px",
928
+ "--qw-sem-size-action-control-icon-sm": "16px",
929
+ "--qw-sem-size-action-control-icon-md": "16px",
930
+ "--qw-sem-size-action-control-icon-lg": "16px",
931
+ "--qw-sem-size-action-control-icon-xl": "20px",
932
+ "--qw-sem-size-action-control-gap-2xs": "4px",
933
+ "--qw-sem-size-action-control-gap-xs": "4px",
934
+ "--qw-sem-size-action-control-gap-sm": "8px",
935
+ "--qw-sem-size-action-control-gap-md": "8px",
936
+ "--qw-sem-size-action-control-gap-lg": "8px",
937
+ "--qw-sem-size-action-control-gap-xl": "8px",
938
+ "--qw-sem-size-border-width-default": "1px",
939
+ "--qw-sem-size-border-width-strong": "2px",
940
+ "--qw-sem-size-divider-width-thin": "0.5px",
941
+ "--qw-sem-size-divider-width-default": "1px",
942
+ "--qw-sem-size-focus-ring-width": "2px",
943
+ "--qw-sem-size-focus-ring-offset": "2px",
944
+ "--qw-sem-size-indicator-loading": "2px",
945
+ "--qw-sem-size-avatar-diameter-sm": "40px",
946
+ "--qw-sem-size-avatar-diameter-md": "50px",
947
+ "--qw-sem-size-avatar-diameter-lg": "58px",
948
+ "--qw-sem-size-layout-gap-sm": "8px",
949
+ "--qw-sem-size-layout-gap-md": "16px",
950
+ "--qw-sem-size-layout-gap-lg": "24px",
951
+ "--qw-sem-size-safe-area-inset-top": "env(safe-area-inset-top, 0px)",
952
+ "--qw-sem-size-safe-area-inset-right": "env(safe-area-inset-right, 0px)",
953
+ "--qw-sem-size-safe-area-inset-bottom": "env(safe-area-inset-bottom, 0px)",
954
+ "--qw-sem-size-safe-area-inset-left": "env(safe-area-inset-left, 0px)",
955
+ "--qw-sem-size-safe-area-minimum-none": "0px",
956
+ "--qw-sem-size-safe-area-minimum-sm": "8px",
957
+ "--qw-sem-size-safe-area-minimum-md": "16px",
958
+ "--qw-sem-size-safe-area-minimum-lg": "24px",
959
+ "--qw-sem-size-loading-sm": "32px",
960
+ "--qw-sem-size-loading-md": "48px",
961
+ "--qw-sem-size-loading-lg": "60px",
962
+ "--qw-sem-size-skeleton-text-height": "1em",
963
+ "--qw-sem-size-skeleton-rect-height": "120px",
964
+ "--qw-sem-size-skeleton-circle-diameter": "40px",
817
965
  "--qw-sem-size-inset-sm": "8px",
818
966
  "--qw-sem-size-stack-sm": "8px",
819
967
  "--qw-sem-size-inset-md": "16px",
@@ -838,6 +986,11 @@
838
986
  "--qw-sem-typography-body-strong-font-weight": "500",
839
987
  "--qw-sem-typography-body-strong-line-height": "1.5",
840
988
  "--qw-sem-typography-body-strong-letter-spacing": "0px",
989
+ "--qw-sem-typography-product-title-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
990
+ "--qw-sem-typography-product-title-font-size": "16px",
991
+ "--qw-sem-typography-product-title-font-weight": "600",
992
+ "--qw-sem-typography-product-title-line-height": "1.625",
993
+ "--qw-sem-typography-product-title-letter-spacing": "0px",
841
994
  "--qw-sem-typography-heading-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
842
995
  "--qw-sem-typography-heading-sm-font-size": "16px",
843
996
  "--qw-sem-typography-heading-sm-font-weight": "600",
@@ -858,6 +1011,16 @@
858
1011
  "--qw-sem-typography-caption-font-weight": "400",
859
1012
  "--qw-sem-typography-caption-line-height": "1.5",
860
1013
  "--qw-sem-typography-caption-letter-spacing": "0px",
1014
+ "--qw-sem-typography-body-lg-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
1015
+ "--qw-sem-typography-body-lg-font-size": "16px",
1016
+ "--qw-sem-typography-body-lg-font-weight": "400",
1017
+ "--qw-sem-typography-body-lg-line-height": "1.5",
1018
+ "--qw-sem-typography-body-lg-letter-spacing": "0px",
1019
+ "--qw-sem-typography-label-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
1020
+ "--qw-sem-typography-label-sm-font-size": "11px",
1021
+ "--qw-sem-typography-label-sm-font-weight": "500",
1022
+ "--qw-sem-typography-label-sm-line-height": "1.5",
1023
+ "--qw-sem-typography-label-sm-letter-spacing": "0px",
861
1024
  "--qw-sem-typography-code-font-family": "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace",
862
1025
  "--qw-sem-typography-code-font-size": "12px",
863
1026
  "--qw-sem-typography-code-font-weight": "400",
@@ -866,44 +1029,78 @@
866
1029
  "--qw-sem-motion-duration-fast": "100ms",
867
1030
  "--qw-sem-motion-duration-base": "200ms",
868
1031
  "--qw-sem-motion-duration-slow": "320ms",
1032
+ "--qw-sem-motion-duration-shimmer": "2000ms",
1033
+ "--qw-sem-motion-duration-spin": "2000ms",
869
1034
  "--qw-sem-motion-easing-standard": "cubic-bezier(0.16, 1, 0.3, 1)",
1035
+ "--qw-sem-motion-easing-symmetric": "ease-in-out",
1036
+ "--qw-sem-motion-easing-linear": "linear",
1037
+ "--qw-sem-effect-blur-media-control": "2px",
870
1038
  "--qw-sem-color-surface-base": "#222222",
871
1039
  "--qw-sem-color-surface-subtle": "#202020",
872
1040
  "--qw-sem-color-surface-elevated": "#2D2D2D",
873
1041
  "--qw-sem-color-surface-header": "#3A3A3A",
874
1042
  "--qw-sem-color-surface-brand-subtle": "#001D66",
1043
+ "--qw-sem-color-surface-canvas": "#121212",
1044
+ "--qw-sem-color-surface-sunken": "#2D2D2D",
1045
+ "--qw-sem-color-surface-selected": "rgba(255, 255, 255, 0.1)",
1046
+ "--qw-sem-color-surface-inverse": "#353535",
1047
+ "--qw-sem-color-surface-canvas-subtle": "#121212",
1048
+ "--qw-sem-color-content-danger": "#FFA097",
875
1049
  "--qw-sem-color-content-primary": "#ffffff",
876
1050
  "--qw-sem-color-content-secondary": "#999999",
877
1051
  "--qw-sem-color-content-tertiary": "#666666",
878
1052
  "--qw-sem-color-content-placeholder": "rgba(255, 255, 255, 0.3)",
879
1053
  "--qw-sem-color-content-intro": "#888E99",
1054
+ "--qw-sem-color-content-disabled": "rgba(255, 255, 255, 0.3)",
1055
+ "--qw-sem-color-content-link": "#3086FF",
1056
+ "--qw-sem-color-content-icon-subtle": "rgba(255, 255, 255, 0.1)",
1057
+ "--qw-sem-color-content-inverse": "#222222",
1058
+ "--qw-sem-color-content-on-solid": "#ffffff",
1059
+ "--qw-sem-color-content-on-brand": "#000000",
1060
+ "--qw-sem-color-content-on-warning-subtle": "#F4D38B",
880
1061
  "--qw-sem-color-border-default": "#3A3A3A",
881
1062
  "--qw-sem-color-border-strong": "#666666",
1063
+ "--qw-sem-color-border-control": "#999999",
882
1064
  "--qw-sem-color-border-focus": "#426EFF",
1065
+ "--qw-sem-color-border-subtle": "rgba(255, 255, 255, 0.05)",
1066
+ "--qw-sem-color-border-disabled": "rgba(255, 255, 255, 0.1)",
1067
+ "--qw-sem-color-border-on-media": "#ffffff",
883
1068
  "--qw-sem-color-fill-subtle": "rgba(255, 255, 255, 0.2)",
884
1069
  "--qw-sem-color-fill-hover": "#2D2D2D",
885
1070
  "--qw-sem-color-fill-active": "#001D66",
886
1071
  "--qw-sem-color-fill-disabled": "#202020",
1072
+ "--qw-sem-color-fill-track": "rgba(255, 255, 255, 0.2)",
887
1073
  "--qw-sem-color-action-brand": "#426EFF",
888
1074
  "--qw-sem-color-action-product": "#266FFF",
889
1075
  "--qw-sem-color-action-selected": "rgba(13, 83, 255, 0.4)",
890
1076
  "--qw-sem-color-action-inverse": "#222222",
1077
+ "--qw-sem-color-control-action-brand-subtle": "rgba(0, 17, 255, 0.2)",
1078
+ "--qw-sem-color-control-action-product-subtle": "rgba(13, 83, 255, 0.2)",
1079
+ "--qw-sem-color-control-action-danger-default": "#CF081E",
1080
+ "--qw-sem-color-control-action-danger-subtle": "rgba(255, 64, 64, 0.2)",
1081
+ "--qw-sem-color-control-action-neutral-subtle": "rgba(255, 255, 255, 0.1)",
1082
+ "--qw-sem-color-control-selection-brand": "rgba(0, 17, 255, 0.2)",
1083
+ "--qw-sem-color-control-selection-product": "rgba(13, 83, 255, 0.2)",
1084
+ "--qw-sem-color-selection-text-background": "rgba(13, 83, 255, 0.4)",
891
1085
  "--qw-sem-color-status-success": "#1f993f",
892
1086
  "--qw-sem-color-status-warning": "#ffd575",
893
1087
  "--qw-sem-color-status-danger": "#FF5745",
894
1088
  "--qw-sem-color-status-info": "#266FFF",
1089
+ "--qw-sem-color-status-success-subtle": "rgba(31, 153, 63, 0.2)",
1090
+ "--qw-sem-color-status-warning-subtle": "rgba(255, 213, 117, 0.2)",
1091
+ "--qw-sem-color-status-danger-subtle": "rgba(255, 64, 64, 0.2)",
1092
+ "--qw-sem-color-status-info-subtle": "rgba(13, 83, 255, 0.2)",
895
1093
  "--qw-sem-color-overlay-scrim": "rgba(34, 34, 34, 0.7)",
896
- "--qw-sem-color-overlay-guide": "rgba(34, 34, 34, 0.7)",
1094
+ "--qw-sem-color-overlay-guide": "rgba(13, 83, 255, 0.2)",
1095
+ "--qw-sem-color-overlay-media-subtle": "rgba(34, 34, 34, 0.4)",
1096
+ "--qw-sem-color-overlay-media-strong": "rgba(34, 34, 34, 0.5)",
1097
+ "--qw-sem-color-overlay-control-on-media": "rgba(255, 255, 255, 0.4)",
897
1098
  "--qw-sem-color-shadow": "rgba(34, 34, 34, 0.5)",
898
- "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.5)",
899
- "--qw-compat-button-color-bg-soft-brand": "rgba(66, 110, 255, 0.24)",
900
- "--qw-compat-button-color-bg-soft-danger": "rgba(254, 135, 122, 0.2)",
901
- "--qw-compat-button-color-bg-neutral-gray": "rgba(255, 255, 255, 0.1)",
902
- "--qw-compat-loading-color-logo": "rgba(255, 255, 255, 0.1)",
903
- "--qw-compat-avatar-color-border": "rgba(255, 255, 255, 0.1)",
904
- "--qw-compat-tabs-color-button-bg-selected": "rgba(255, 255, 255, 0.1)",
905
- "--qw-compat-tabs-color-button-border": "rgba(255, 255, 255, 0.05)",
906
- "--qw-compat-divider-color-border": "rgba(255, 255, 255, 0.05)",
907
- "--qw-compat-image-color-background": "#333333"
1099
+ "--qw-sem-effect-shadow-card-color": "rgba(34, 34, 34, 0.5)",
1100
+ "--qw-sem-effect-shadow-floating-color": "rgba(34, 34, 34, 0.5)",
1101
+ "--qw-sem-effect-shadow-dialog-color": "rgba(34, 34, 34, 0.5)",
1102
+ "--qw-sem-effect-shadow-card": "0px 1px 2px 0px rgba(34, 34, 34, 0.5)",
1103
+ "--qw-sem-effect-shadow-floating": "0px 4px 12px 0px rgba(34, 34, 34, 0.5)",
1104
+ "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.5)"
908
1105
  }
909
1106
  }