@qw-ui/tokens 0.2.0 → 0.3.0-next.10

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 +79 -0
  2. package/dist/color-architecture.d.ts +139 -2
  3. package/dist/derive/index.d.ts +2 -2
  4. package/dist/derive/live-css.d.ts +1 -1
  5. package/dist/derive/reference.d.ts +62 -13
  6. package/dist/derive/semantic.d.ts +17 -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 +759 -240
  13. package/dist/index.js.map +1 -1
  14. package/dist/schema.d.ts +3 -3
  15. package/dist/tailwind.css +79 -0
  16. package/dist/tokens.css +113 -66
  17. package/dist/tokens.json +196 -66
  18. package/dist/tokens.live.css +127 -9
  19. package/dist/tokens.ts +198 -82
  20. package/package.json +2 -1
  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
@@ -275,6 +275,7 @@
275
275
  "--qw-ref-size-radius-sm": "4px",
276
276
  "--qw-ref-size-radius-md": "8px",
277
277
  "--qw-ref-size-radius-lg": "14px",
278
+ "--qw-ref-size-radius-xl": "16px",
278
279
  "--qw-ref-size-radius-full": "9999px",
279
280
  "--qw-ref-size-control-size-sm": "32px",
280
281
  "--qw-ref-size-control-size-md": "40px",
@@ -282,7 +283,20 @@
282
283
  "--qw-ref-size-icon-size-sm": "16px",
283
284
  "--qw-ref-size-icon-size-md": "20px",
284
285
  "--qw-ref-size-icon-size-lg": "24px",
285
- "--qw-ref-size-border-width-hairline": "1px",
286
+ "--qw-ref-size-stroke-width-half": "0.5px",
287
+ "--qw-ref-size-stroke-width-base": "1px",
288
+ "--qw-ref-size-stroke-width-double": "2px",
289
+ "--qw-ref-size-stroke-width-triple": "3px",
290
+ "--qw-ref-size-action-control-height-2xs": "24px",
291
+ "--qw-ref-size-action-control-height-xs": "28px",
292
+ "--qw-ref-size-action-control-height-sm": "32px",
293
+ "--qw-ref-size-action-control-height-md": "36px",
294
+ "--qw-ref-size-action-control-height-lg": "42px",
295
+ "--qw-ref-size-action-control-height-xl": "50px",
296
+ "--qw-ref-size-action-control-icon-2xs": "14px",
297
+ "--qw-ref-size-avatar-diameter-sm": "40px",
298
+ "--qw-ref-size-avatar-diameter-md": "50px",
299
+ "--qw-ref-size-avatar-diameter-lg": "58px",
286
300
  "--qw-ref-typography-line-height-tight": "1.25",
287
301
  "--qw-ref-typography-line-height-normal": "1.5",
288
302
  "--qw-ref-typography-line-height-relaxed": "1.75",
@@ -304,6 +318,7 @@
304
318
  "--qw-ref-typography-font-weight-medium": "500",
305
319
  "--qw-ref-typography-font-weight-semibold": "600",
306
320
  "--qw-ref-typography-font-size-base": "14px",
321
+ "--qw-ref-typography-font-size-xs": "11px",
307
322
  "--qw-ref-typography-font-size-sm": "12px",
308
323
  "--qw-ref-typography-font-size-lg": "16px",
309
324
  "--qw-ref-typography-font-size-xl": "20px",
@@ -316,8 +331,10 @@
316
331
  "--qw-ref-effect-shadow-sm": "0px 1px 2px 0px rgba(0, 0, 0, 0.08)",
317
332
  "--qw-ref-effect-shadow-md": "0px 4px 12px 0px rgba(0, 0, 0, 0.12)",
318
333
  "--qw-ref-effect-shadow-lg": "0px 8px 24px 0px rgba(0, 0, 0, 0.16)",
334
+ "--qw-sem-size-radius-sm": "4px",
319
335
  "--qw-sem-size-radius-control": "8px",
320
336
  "--qw-sem-size-radius-card": "14px",
337
+ "--qw-sem-size-radius-xl": "16px",
321
338
  "--qw-sem-size-radius-pill": "9999px",
322
339
  "--qw-sem-size-radius-full": "9999px",
323
340
  "--qw-sem-size-control-height-sm": "32px",
@@ -326,6 +343,40 @@
326
343
  "--qw-sem-size-icon-size-sm": "16px",
327
344
  "--qw-sem-size-icon-size-md": "20px",
328
345
  "--qw-sem-size-icon-size-lg": "24px",
346
+ "--qw-sem-size-action-control-height-2xs": "24px",
347
+ "--qw-sem-size-action-control-height-xs": "28px",
348
+ "--qw-sem-size-action-control-height-sm": "32px",
349
+ "--qw-sem-size-action-control-height-md": "36px",
350
+ "--qw-sem-size-action-control-height-lg": "42px",
351
+ "--qw-sem-size-action-control-height-xl": "50px",
352
+ "--qw-sem-size-action-control-padding-inline-2xs": "8px",
353
+ "--qw-sem-size-action-control-padding-inline-xs": "8px",
354
+ "--qw-sem-size-action-control-padding-inline-sm": "16px",
355
+ "--qw-sem-size-action-control-padding-inline-md": "16px",
356
+ "--qw-sem-size-action-control-padding-inline-lg": "20px",
357
+ "--qw-sem-size-action-control-padding-inline-xl": "32px",
358
+ "--qw-sem-size-action-control-icon-2xs": "14px",
359
+ "--qw-sem-size-action-control-icon-xs": "16px",
360
+ "--qw-sem-size-action-control-icon-sm": "16px",
361
+ "--qw-sem-size-action-control-icon-md": "16px",
362
+ "--qw-sem-size-action-control-icon-lg": "16px",
363
+ "--qw-sem-size-action-control-icon-xl": "20px",
364
+ "--qw-sem-size-action-control-gap-2xs": "4px",
365
+ "--qw-sem-size-action-control-gap-xs": "4px",
366
+ "--qw-sem-size-action-control-gap-sm": "8px",
367
+ "--qw-sem-size-action-control-gap-md": "8px",
368
+ "--qw-sem-size-action-control-gap-lg": "8px",
369
+ "--qw-sem-size-action-control-gap-xl": "8px",
370
+ "--qw-sem-size-border-width-default": "1px",
371
+ "--qw-sem-size-border-width-strong": "2px",
372
+ "--qw-sem-size-divider-width-thin": "0.5px",
373
+ "--qw-sem-size-divider-width-default": "1px",
374
+ "--qw-sem-size-focus-ring-width": "2px",
375
+ "--qw-sem-size-focus-ring-offset": "2px",
376
+ "--qw-sem-size-indicator-loading": "2px",
377
+ "--qw-sem-size-avatar-diameter-sm": "40px",
378
+ "--qw-sem-size-avatar-diameter-md": "50px",
379
+ "--qw-sem-size-avatar-diameter-lg": "58px",
329
380
  "--qw-sem-size-inset-sm": "8px",
330
381
  "--qw-sem-size-stack-sm": "8px",
331
382
  "--qw-sem-size-inset-md": "16px",
@@ -370,6 +421,16 @@
370
421
  "--qw-sem-typography-caption-font-weight": "400",
371
422
  "--qw-sem-typography-caption-line-height": "1.5",
372
423
  "--qw-sem-typography-caption-letter-spacing": "0px",
424
+ "--qw-sem-typography-body-lg-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
425
+ "--qw-sem-typography-body-lg-font-size": "16px",
426
+ "--qw-sem-typography-body-lg-font-weight": "400",
427
+ "--qw-sem-typography-body-lg-line-height": "1.5",
428
+ "--qw-sem-typography-body-lg-letter-spacing": "0px",
429
+ "--qw-sem-typography-label-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
430
+ "--qw-sem-typography-label-sm-font-size": "11px",
431
+ "--qw-sem-typography-label-sm-font-weight": "500",
432
+ "--qw-sem-typography-label-sm-line-height": "1.5",
433
+ "--qw-sem-typography-label-sm-letter-spacing": "0px",
373
434
  "--qw-sem-typography-code-font-family": "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace",
374
435
  "--qw-sem-typography-code-font-size": "12px",
375
436
  "--qw-sem-typography-code-font-weight": "400",
@@ -384,86 +445,64 @@
384
445
  "--qw-sem-color-surface-elevated": "#ffffff",
385
446
  "--qw-sem-color-surface-header": "#EEEEEE",
386
447
  "--qw-sem-color-surface-brand-subtle": "#EBF5FF",
448
+ "--qw-sem-color-surface-canvas": "#ffffff",
449
+ "--qw-sem-color-surface-sunken": "#EEEEEE",
450
+ "--qw-sem-color-surface-selected": "rgba(34, 34, 34, 0.05)",
451
+ "--qw-sem-color-surface-inverse": "#353535",
452
+ "--qw-sem-color-surface-canvas-subtle": "#F6F6F6",
387
453
  "--qw-sem-color-content-primary": "#222222",
388
454
  "--qw-sem-color-content-secondary": "#666666",
389
455
  "--qw-sem-color-content-tertiary": "#999999",
390
456
  "--qw-sem-color-content-placeholder": "#CCCCCC",
391
457
  "--qw-sem-color-content-intro": "#A2A9B6",
458
+ "--qw-sem-color-content-disabled": "rgba(34, 34, 34, 0.3)",
459
+ "--qw-sem-color-content-link": "#003DB8",
460
+ "--qw-sem-color-content-icon-subtle": "rgba(34, 34, 34, 0.05)",
461
+ "--qw-sem-color-content-inverse": "#ffffff",
462
+ "--qw-sem-color-content-on-solid": "#ffffff",
463
+ "--qw-sem-color-content-on-warning-subtle": "#453200",
392
464
  "--qw-sem-color-border-default": "#EEEEEE",
393
465
  "--qw-sem-color-border-strong": "#CCCCCC",
394
466
  "--qw-sem-color-border-focus": "#0011ff",
467
+ "--qw-sem-color-border-subtle": "rgba(34, 34, 34, 0.05)",
468
+ "--qw-sem-color-border-disabled": "rgba(34, 34, 34, 0.1)",
469
+ "--qw-sem-color-border-on-media": "#ffffff",
395
470
  "--qw-sem-color-fill-subtle": "#F6F6F6",
396
471
  "--qw-sem-color-fill-hover": "#EEEEEE",
397
472
  "--qw-sem-color-fill-active": "#EBF5FF",
398
473
  "--qw-sem-color-fill-disabled": "#F6F6F6",
474
+ "--qw-sem-color-fill-track": "rgba(34, 34, 34, 0.1)",
399
475
  "--qw-sem-color-action-brand": "#0011ff",
400
476
  "--qw-sem-color-action-product": "#0d53ff",
401
477
  "--qw-sem-color-action-selected": "rgba(13, 83, 255, 0.2)",
402
478
  "--qw-sem-color-action-inverse": "#ffffff",
479
+ "--qw-sem-color-control-action-brand-subtle": "rgba(0, 17, 255, 0.1)",
480
+ "--qw-sem-color-control-action-product-subtle": "rgba(13, 83, 255, 0.1)",
481
+ "--qw-sem-color-control-action-danger-default": "#FF5745",
482
+ "--qw-sem-color-control-action-danger-subtle": "rgba(255, 64, 64, 0.1)",
483
+ "--qw-sem-color-control-action-neutral-subtle": "rgba(34, 34, 34, 0.05)",
484
+ "--qw-sem-color-control-selection-brand": "rgba(0, 17, 255, 0.1)",
485
+ "--qw-sem-color-control-selection-product": "rgba(13, 83, 255, 0.1)",
486
+ "--qw-sem-color-selection-text-background": "rgba(13, 83, 255, 0.2)",
403
487
  "--qw-sem-color-status-success": "#1f993f",
404
488
  "--qw-sem-color-status-warning": "#ffd575",
405
489
  "--qw-sem-color-status-danger": "#FF5745",
406
490
  "--qw-sem-color-status-info": "#0d53ff",
491
+ "--qw-sem-color-status-success-subtle": "rgba(31, 153, 63, 0.1)",
492
+ "--qw-sem-color-status-warning-subtle": "rgba(255, 213, 117, 0.2)",
493
+ "--qw-sem-color-status-danger-subtle": "rgba(255, 64, 64, 0.1)",
494
+ "--qw-sem-color-status-info-subtle": "rgba(13, 83, 255, 0.1)",
407
495
  "--qw-sem-color-overlay-scrim": "rgba(34, 34, 34, 0.5)",
408
- "--qw-sem-color-overlay-guide": "rgba(34, 34, 34, 0.7)",
496
+ "--qw-sem-color-overlay-guide": "rgba(13, 83, 255, 0.1)",
497
+ "--qw-sem-color-overlay-media-subtle": "rgba(34, 34, 34, 0.4)",
498
+ "--qw-sem-color-overlay-media-strong": "rgba(34, 34, 34, 0.5)",
409
499
  "--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-avatar-dimension-diameter-s": "40px",
451
- "--qw-compat-avatar-dimension-diameter-m": "50px",
452
- "--qw-compat-avatar-dimension-diameter-l": "58px",
453
- "--qw-compat-avatar-dimension-font-size-s": "12px",
454
- "--qw-compat-avatar-dimension-font-size-m": "16px",
455
- "--qw-compat-avatar-dimension-font-size-l": "18px",
456
- "--qw-compat-avatar-dimension-badge-size-s": "10px",
457
- "--qw-compat-avatar-dimension-badge-size-m": "12px",
458
- "--qw-compat-avatar-dimension-badge-size-l": "12px",
459
- "--qw-compat-avatar-dimension-badge-offset-s": "-2px",
460
- "--qw-compat-avatar-dimension-badge-offset-m": "-4px",
461
- "--qw-compat-avatar-dimension-badge-offset-l": "-4px",
462
- "--qw-compat-avatar-dimension-border-width": "1px",
463
- "--qw-compat-avatar-dimension-badge-font-size": "10px",
464
- "--qw-compat-avatar-dimension-badge-line-height": "16px",
465
- "--qw-compat-avatar-dimension-badge-padding": "5px",
466
- "--qw-compat-avatar-color-badge-border": "#FFFFFF"
500
+ "--qw-sem-effect-shadow-card-color": "rgba(34, 34, 34, 0.1)",
501
+ "--qw-sem-effect-shadow-floating-color": "rgba(34, 34, 34, 0.1)",
502
+ "--qw-sem-effect-shadow-dialog-color": "rgba(34, 34, 34, 0.1)",
503
+ "--qw-sem-effect-shadow-card": "0px 1px 2px 0px rgba(34, 34, 34, 0.1)",
504
+ "--qw-sem-effect-shadow-floating": "0px 4px 12px 0px rgba(34, 34, 34, 0.1)",
505
+ "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.1)"
467
506
  },
468
507
  "dark": {
469
508
  "--qw-ref-color-brand-a5": "rgba(0, 17, 255, 0.05)",
@@ -741,6 +780,7 @@
741
780
  "--qw-ref-size-radius-sm": "4px",
742
781
  "--qw-ref-size-radius-md": "8px",
743
782
  "--qw-ref-size-radius-lg": "14px",
783
+ "--qw-ref-size-radius-xl": "16px",
744
784
  "--qw-ref-size-radius-full": "9999px",
745
785
  "--qw-ref-size-control-size-sm": "32px",
746
786
  "--qw-ref-size-control-size-md": "40px",
@@ -748,7 +788,20 @@
748
788
  "--qw-ref-size-icon-size-sm": "16px",
749
789
  "--qw-ref-size-icon-size-md": "20px",
750
790
  "--qw-ref-size-icon-size-lg": "24px",
751
- "--qw-ref-size-border-width-hairline": "1px",
791
+ "--qw-ref-size-stroke-width-half": "0.5px",
792
+ "--qw-ref-size-stroke-width-base": "1px",
793
+ "--qw-ref-size-stroke-width-double": "2px",
794
+ "--qw-ref-size-stroke-width-triple": "3px",
795
+ "--qw-ref-size-action-control-height-2xs": "24px",
796
+ "--qw-ref-size-action-control-height-xs": "28px",
797
+ "--qw-ref-size-action-control-height-sm": "32px",
798
+ "--qw-ref-size-action-control-height-md": "36px",
799
+ "--qw-ref-size-action-control-height-lg": "42px",
800
+ "--qw-ref-size-action-control-height-xl": "50px",
801
+ "--qw-ref-size-action-control-icon-2xs": "14px",
802
+ "--qw-ref-size-avatar-diameter-sm": "40px",
803
+ "--qw-ref-size-avatar-diameter-md": "50px",
804
+ "--qw-ref-size-avatar-diameter-lg": "58px",
752
805
  "--qw-ref-typography-line-height-tight": "1.25",
753
806
  "--qw-ref-typography-line-height-normal": "1.5",
754
807
  "--qw-ref-typography-line-height-relaxed": "1.75",
@@ -770,6 +823,7 @@
770
823
  "--qw-ref-typography-font-weight-medium": "500",
771
824
  "--qw-ref-typography-font-weight-semibold": "600",
772
825
  "--qw-ref-typography-font-size-base": "14px",
826
+ "--qw-ref-typography-font-size-xs": "11px",
773
827
  "--qw-ref-typography-font-size-sm": "12px",
774
828
  "--qw-ref-typography-font-size-lg": "16px",
775
829
  "--qw-ref-typography-font-size-xl": "20px",
@@ -782,8 +836,10 @@
782
836
  "--qw-ref-effect-shadow-sm": "0px 1px 2px 0px rgba(0, 0, 0, 0.08)",
783
837
  "--qw-ref-effect-shadow-md": "0px 4px 12px 0px rgba(0, 0, 0, 0.12)",
784
838
  "--qw-ref-effect-shadow-lg": "0px 8px 24px 0px rgba(0, 0, 0, 0.16)",
839
+ "--qw-sem-size-radius-sm": "4px",
785
840
  "--qw-sem-size-radius-control": "8px",
786
841
  "--qw-sem-size-radius-card": "14px",
842
+ "--qw-sem-size-radius-xl": "16px",
787
843
  "--qw-sem-size-radius-pill": "9999px",
788
844
  "--qw-sem-size-radius-full": "9999px",
789
845
  "--qw-sem-size-control-height-sm": "32px",
@@ -792,6 +848,40 @@
792
848
  "--qw-sem-size-icon-size-sm": "16px",
793
849
  "--qw-sem-size-icon-size-md": "20px",
794
850
  "--qw-sem-size-icon-size-lg": "24px",
851
+ "--qw-sem-size-action-control-height-2xs": "24px",
852
+ "--qw-sem-size-action-control-height-xs": "28px",
853
+ "--qw-sem-size-action-control-height-sm": "32px",
854
+ "--qw-sem-size-action-control-height-md": "36px",
855
+ "--qw-sem-size-action-control-height-lg": "42px",
856
+ "--qw-sem-size-action-control-height-xl": "50px",
857
+ "--qw-sem-size-action-control-padding-inline-2xs": "8px",
858
+ "--qw-sem-size-action-control-padding-inline-xs": "8px",
859
+ "--qw-sem-size-action-control-padding-inline-sm": "16px",
860
+ "--qw-sem-size-action-control-padding-inline-md": "16px",
861
+ "--qw-sem-size-action-control-padding-inline-lg": "20px",
862
+ "--qw-sem-size-action-control-padding-inline-xl": "32px",
863
+ "--qw-sem-size-action-control-icon-2xs": "14px",
864
+ "--qw-sem-size-action-control-icon-xs": "16px",
865
+ "--qw-sem-size-action-control-icon-sm": "16px",
866
+ "--qw-sem-size-action-control-icon-md": "16px",
867
+ "--qw-sem-size-action-control-icon-lg": "16px",
868
+ "--qw-sem-size-action-control-icon-xl": "20px",
869
+ "--qw-sem-size-action-control-gap-2xs": "4px",
870
+ "--qw-sem-size-action-control-gap-xs": "4px",
871
+ "--qw-sem-size-action-control-gap-sm": "8px",
872
+ "--qw-sem-size-action-control-gap-md": "8px",
873
+ "--qw-sem-size-action-control-gap-lg": "8px",
874
+ "--qw-sem-size-action-control-gap-xl": "8px",
875
+ "--qw-sem-size-border-width-default": "1px",
876
+ "--qw-sem-size-border-width-strong": "2px",
877
+ "--qw-sem-size-divider-width-thin": "0.5px",
878
+ "--qw-sem-size-divider-width-default": "1px",
879
+ "--qw-sem-size-focus-ring-width": "2px",
880
+ "--qw-sem-size-focus-ring-offset": "2px",
881
+ "--qw-sem-size-indicator-loading": "2px",
882
+ "--qw-sem-size-avatar-diameter-sm": "40px",
883
+ "--qw-sem-size-avatar-diameter-md": "50px",
884
+ "--qw-sem-size-avatar-diameter-lg": "58px",
795
885
  "--qw-sem-size-inset-sm": "8px",
796
886
  "--qw-sem-size-stack-sm": "8px",
797
887
  "--qw-sem-size-inset-md": "16px",
@@ -836,6 +926,16 @@
836
926
  "--qw-sem-typography-caption-font-weight": "400",
837
927
  "--qw-sem-typography-caption-line-height": "1.5",
838
928
  "--qw-sem-typography-caption-letter-spacing": "0px",
929
+ "--qw-sem-typography-body-lg-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
930
+ "--qw-sem-typography-body-lg-font-size": "16px",
931
+ "--qw-sem-typography-body-lg-font-weight": "400",
932
+ "--qw-sem-typography-body-lg-line-height": "1.5",
933
+ "--qw-sem-typography-body-lg-letter-spacing": "0px",
934
+ "--qw-sem-typography-label-sm-font-family": "system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
935
+ "--qw-sem-typography-label-sm-font-size": "11px",
936
+ "--qw-sem-typography-label-sm-font-weight": "500",
937
+ "--qw-sem-typography-label-sm-line-height": "1.5",
938
+ "--qw-sem-typography-label-sm-letter-spacing": "0px",
839
939
  "--qw-sem-typography-code-font-family": "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace",
840
940
  "--qw-sem-typography-code-font-size": "12px",
841
941
  "--qw-sem-typography-code-font-weight": "400",
@@ -850,33 +950,63 @@
850
950
  "--qw-sem-color-surface-elevated": "#2D2D2D",
851
951
  "--qw-sem-color-surface-header": "#3A3A3A",
852
952
  "--qw-sem-color-surface-brand-subtle": "#001D66",
953
+ "--qw-sem-color-surface-canvas": "#121212",
954
+ "--qw-sem-color-surface-sunken": "#2D2D2D",
955
+ "--qw-sem-color-surface-selected": "rgba(255, 255, 255, 0.1)",
956
+ "--qw-sem-color-surface-inverse": "#353535",
957
+ "--qw-sem-color-surface-canvas-subtle": "#121212",
853
958
  "--qw-sem-color-content-primary": "#ffffff",
854
959
  "--qw-sem-color-content-secondary": "#999999",
855
960
  "--qw-sem-color-content-tertiary": "#666666",
856
961
  "--qw-sem-color-content-placeholder": "rgba(255, 255, 255, 0.3)",
857
962
  "--qw-sem-color-content-intro": "#888E99",
963
+ "--qw-sem-color-content-disabled": "rgba(255, 255, 255, 0.3)",
964
+ "--qw-sem-color-content-link": "#3086FF",
965
+ "--qw-sem-color-content-icon-subtle": "rgba(255, 255, 255, 0.1)",
966
+ "--qw-sem-color-content-inverse": "#222222",
967
+ "--qw-sem-color-content-on-solid": "#ffffff",
968
+ "--qw-sem-color-content-on-warning-subtle": "#F4D38B",
858
969
  "--qw-sem-color-border-default": "#3A3A3A",
859
970
  "--qw-sem-color-border-strong": "#666666",
860
971
  "--qw-sem-color-border-focus": "#426EFF",
972
+ "--qw-sem-color-border-subtle": "rgba(255, 255, 255, 0.05)",
973
+ "--qw-sem-color-border-disabled": "rgba(255, 255, 255, 0.1)",
974
+ "--qw-sem-color-border-on-media": "#ffffff",
861
975
  "--qw-sem-color-fill-subtle": "rgba(255, 255, 255, 0.2)",
862
976
  "--qw-sem-color-fill-hover": "#2D2D2D",
863
977
  "--qw-sem-color-fill-active": "#001D66",
864
978
  "--qw-sem-color-fill-disabled": "#202020",
979
+ "--qw-sem-color-fill-track": "rgba(255, 255, 255, 0.2)",
865
980
  "--qw-sem-color-action-brand": "#426EFF",
866
981
  "--qw-sem-color-action-product": "#266FFF",
867
982
  "--qw-sem-color-action-selected": "rgba(13, 83, 255, 0.4)",
868
983
  "--qw-sem-color-action-inverse": "#222222",
984
+ "--qw-sem-color-control-action-brand-subtle": "rgba(0, 17, 255, 0.2)",
985
+ "--qw-sem-color-control-action-product-subtle": "rgba(13, 83, 255, 0.2)",
986
+ "--qw-sem-color-control-action-danger-default": "#FF5745",
987
+ "--qw-sem-color-control-action-danger-subtle": "rgba(255, 64, 64, 0.2)",
988
+ "--qw-sem-color-control-action-neutral-subtle": "rgba(255, 255, 255, 0.1)",
989
+ "--qw-sem-color-control-selection-brand": "rgba(0, 17, 255, 0.2)",
990
+ "--qw-sem-color-control-selection-product": "rgba(13, 83, 255, 0.2)",
991
+ "--qw-sem-color-selection-text-background": "rgba(13, 83, 255, 0.4)",
869
992
  "--qw-sem-color-status-success": "#1f993f",
870
993
  "--qw-sem-color-status-warning": "#ffd575",
871
994
  "--qw-sem-color-status-danger": "#FF5745",
872
995
  "--qw-sem-color-status-info": "#266FFF",
996
+ "--qw-sem-color-status-success-subtle": "rgba(31, 153, 63, 0.2)",
997
+ "--qw-sem-color-status-warning-subtle": "rgba(255, 213, 117, 0.2)",
998
+ "--qw-sem-color-status-danger-subtle": "rgba(255, 64, 64, 0.2)",
999
+ "--qw-sem-color-status-info-subtle": "rgba(13, 83, 255, 0.2)",
873
1000
  "--qw-sem-color-overlay-scrim": "rgba(34, 34, 34, 0.7)",
874
- "--qw-sem-color-overlay-guide": "rgba(34, 34, 34, 0.7)",
1001
+ "--qw-sem-color-overlay-guide": "rgba(13, 83, 255, 0.2)",
1002
+ "--qw-sem-color-overlay-media-subtle": "rgba(34, 34, 34, 0.4)",
1003
+ "--qw-sem-color-overlay-media-strong": "rgba(34, 34, 34, 0.5)",
875
1004
  "--qw-sem-color-shadow": "rgba(34, 34, 34, 0.5)",
876
- "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.5)",
877
- "--qw-compat-button-color-bg-soft-brand": "rgba(66, 110, 255, 0.24)",
878
- "--qw-compat-button-color-bg-soft-danger": "rgba(254, 135, 122, 0.2)",
879
- "--qw-compat-button-color-bg-neutral-gray": "rgba(255, 255, 255, 0.1)",
880
- "--qw-compat-loading-color-logo": "rgba(255, 255, 255, 0.1)"
1005
+ "--qw-sem-effect-shadow-card-color": "rgba(34, 34, 34, 0.5)",
1006
+ "--qw-sem-effect-shadow-floating-color": "rgba(34, 34, 34, 0.5)",
1007
+ "--qw-sem-effect-shadow-dialog-color": "rgba(34, 34, 34, 0.5)",
1008
+ "--qw-sem-effect-shadow-card": "0px 1px 2px 0px rgba(34, 34, 34, 0.5)",
1009
+ "--qw-sem-effect-shadow-floating": "0px 4px 12px 0px rgba(34, 34, 34, 0.5)",
1010
+ "--qw-sem-effect-shadow-dialog": "0px 8px 24px 0px rgba(34, 34, 34, 0.5)"
881
1011
  }
882
1012
  }