@daikin-oss/dds-tokens 0.2.0 → 0.3.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.
Files changed (45) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/build/css/aaf/Dark/variables.css +29 -88
  3. package/build/css/aaf/Light/variables.css +29 -88
  4. package/build/css/daikin/Dark/variables.css +71 -103
  5. package/build/css/daikin/Light/variables.css +35 -108
  6. package/build/js/aaf/Dark/variables.cjs +28 -87
  7. package/build/js/aaf/Dark/variables.d.cts +28 -107
  8. package/build/js/aaf/Dark/variables.d.ts +28 -107
  9. package/build/js/aaf/Dark/variables.js +29 -88
  10. package/build/js/aaf/Light/variables.cjs +28 -87
  11. package/build/js/aaf/Light/variables.d.cts +28 -107
  12. package/build/js/aaf/Light/variables.d.ts +28 -107
  13. package/build/js/aaf/Light/variables.js +29 -88
  14. package/build/js/daikin/Dark/variables.cjs +70 -102
  15. package/build/js/daikin/Dark/variables.d.cts +70 -123
  16. package/build/js/daikin/Dark/variables.d.ts +70 -123
  17. package/build/js/daikin/Dark/variables.js +71 -103
  18. package/build/js/daikin/Light/variables.cjs +34 -107
  19. package/build/js/daikin/Light/variables.d.cts +33 -127
  20. package/build/js/daikin/Light/variables.d.ts +33 -127
  21. package/build/js/daikin/Light/variables.js +35 -108
  22. package/build/json/aaf/Dark/tokens.json +60 -296
  23. package/build/json/aaf/Light/tokens.json +60 -296
  24. package/build/json/daikin/Dark/tokens.json +220 -348
  25. package/build/json/daikin/Light/tokens.json +81 -373
  26. package/build/scss/aaf/Dark/_mixins.scss +29 -88
  27. package/build/scss/aaf/Light/_mixins.scss +29 -88
  28. package/build/scss/daikin/Dark/_mixins.scss +71 -103
  29. package/build/scss/daikin/Light/_mixins.scss +35 -108
  30. package/package.json +1 -1
  31. package/themes/aaf/dark/component.json +1 -113
  32. package/themes/aaf/dark/system.json +1 -49
  33. package/themes/aaf/light/component.json +1 -113
  34. package/themes/aaf/light/system.json +1 -49
  35. package/themes/component.json +1 -184
  36. package/themes/dkn/dark/component.json +17 -178
  37. package/themes/dkn/dark/system.json +142 -55
  38. package/themes/dkn/light/component.json +17 -228
  39. package/themes/dkn/light/system.json +0 -73
  40. package/themes/reference.json +181 -200
  41. package/themes/system.json +1 -31
  42. package/build/css/aaf/Dark/buttons.css +0 -22
  43. package/build/css/aaf/Light/buttons.css +0 -22
  44. package/build/css/daikin/Dark/buttons.css +0 -22
  45. package/build/css/daikin/Light/buttons.css +0 -22
@@ -239,30 +239,6 @@
239
239
  "#3e0307",
240
240
  "color"
241
241
  ],
242
- "color-red-aaf-100": [
243
- "#fcecea",
244
- "color"
245
- ],
246
- "color-red-aaf-200": [
247
- "#f5c0b8",
248
- "color"
249
- ],
250
- "color-red-aaf-300": [
251
- "#f8aeba",
252
- "color"
253
- ],
254
- "color-red-aaf-400": [
255
- "#db4f66",
256
- "color"
257
- ],
258
- "color-red-aaf-500": [
259
- "#d2324c",
260
- "color"
261
- ],
262
- "color-red-aaf-600": [
263
- "#c8102e",
264
- "color"
265
- ],
266
242
  "color-gray-10": [
267
243
  "#f2f2f2",
268
244
  "color"
@@ -319,14 +295,6 @@
319
295
  "#ffffff",
320
296
  "color"
321
297
  ],
322
- "color-black-shadow": [
323
- "rgba(0, 0, 0, 0.1)",
324
- "color"
325
- ],
326
- "color-white-shadow": [
327
- "rgba(255, 255, 255, 0.1)",
328
- "color"
329
- ],
330
298
  "color-blue-gray-10": [
331
299
  "#eef0f2",
332
300
  "color"
@@ -387,60 +355,220 @@
387
355
  "#1a1a1a",
388
356
  "color"
389
357
  ],
390
- "color-feedback-positive": [
391
- "#00c3ac",
358
+ "color-purple-10": [
359
+ "#f0ddf3",
392
360
  "color"
393
361
  ],
394
- "color-feedback-warning": [
395
- "#ffbf0e",
362
+ "color-purple-20": [
363
+ "#e1bbe8",
396
364
  "color"
397
365
  ],
398
- "color-feedback-negative": [
399
- "#f21a27",
366
+ "color-purple-30": [
367
+ "#d399dc",
400
368
  "color"
401
369
  ],
402
- "color-feedback-alarm": [
403
- "#fa7a12",
370
+ "color-purple-40": [
371
+ "#c477d0",
372
+ "color"
373
+ ],
374
+ "color-purple-50": [
375
+ "#b556c5",
404
376
  "color"
405
377
  ],
406
- "color-feedback-information": [
378
+ "color-purple-60": [
379
+ "#a03db0",
380
+ "color"
381
+ ],
382
+ "color-purple-70": [
383
+ "#81318e",
384
+ "color"
385
+ ],
386
+ "color-purple-80": [
387
+ "#6f2a7a",
388
+ "color"
389
+ ],
390
+ "color-purple-90": [
391
+ "#5c2365",
392
+ "color"
393
+ ],
394
+ "color-purple-100": [
395
+ "#4a1c51",
396
+ "color"
397
+ ],
398
+ "color-purple-110": [
399
+ "#37153d",
400
+ "color"
401
+ ],
402
+ "color-purple-120": [
403
+ "#250e29",
404
+ "color"
405
+ ],
406
+ "color-common-brand-default": [
407
407
  "#30ade9",
408
408
  "color"
409
409
  ],
410
- "color-brand-primary": [
410
+ "color-common-brand-hover": [
411
+ "#54c3f1",
412
+ "color"
413
+ ],
414
+ "color-common-brand-press": [
411
415
  "#76cff4",
412
416
  "color"
413
417
  ],
414
- "color-brand-secondary": [
418
+ "color-common-surface-brand-hover": [
419
+ "#002b40",
420
+ "color"
421
+ ],
422
+ "color-common-surface-brand-press": [
423
+ "#004160",
424
+ "color"
425
+ ],
426
+ "color-common-surface-neutral-hover": [
427
+ "#282828",
428
+ "color"
429
+ ],
430
+ "color-common-surface-neutral-press": [
431
+ "#313131",
432
+ "color"
433
+ ],
434
+ "color-common-surface-danger-hover": [
435
+ "#3e0307",
436
+ "color"
437
+ ],
438
+ "color-common-surface-danger-press": [
439
+ "#5d050a",
440
+ "color"
441
+ ],
442
+ "color-common-surface-default": [
443
+ "#212121",
444
+ "color"
445
+ ],
446
+ "color-common-surface-hover": [
447
+ "#282828",
448
+ "color"
449
+ ],
450
+ "color-common-surface-press": [
451
+ "#313131",
452
+ "color"
453
+ ],
454
+ "color-common-surface-selected-default": [
455
+ "#002b40",
456
+ "color"
457
+ ],
458
+ "color-common-surface-selected-hover": [
459
+ "#004160",
460
+ "color"
461
+ ],
462
+ "color-common-surface-selected-press": [
463
+ "#005077",
464
+ "color"
465
+ ],
466
+ "color-common-neutral-default": [
467
+ "#bfbfbf",
468
+ "color"
469
+ ],
470
+ "color-common-neutral-hover": [
471
+ "#cecece",
472
+ "color"
473
+ ],
474
+ "color-common-neutral-press": [
475
+ "#dcdcdc",
476
+ "color"
477
+ ],
478
+ "color-common-danger-default": [
479
+ "#f21a27",
480
+ "color"
481
+ ],
482
+ "color-common-danger-hover": [
483
+ "#f4404b",
484
+ "color"
485
+ ],
486
+ "color-common-danger-press": [
487
+ "#f7666f",
488
+ "color"
489
+ ],
490
+ "color-common-success": [
491
+ "#00c3ac",
492
+ "color"
493
+ ],
494
+ "color-common-warning": [
495
+ "#efb000",
496
+ "color"
497
+ ],
498
+ "color-common-alarm": [
499
+ "#fa7a12",
500
+ "color"
501
+ ],
502
+ "color-common-information": [
415
503
  "#30ade9",
416
504
  "color"
417
505
  ],
418
- "color-text-brand-primary": [
419
- "#76cff4",
506
+ "color-common-disabled": [
507
+ "#616161",
420
508
  "color"
421
509
  ],
422
- "color-text-theme": [
423
- "#414141",
510
+ "color-common-text-primary": [
511
+ "#dcdcdc",
424
512
  "color"
425
513
  ],
426
- "color-text-default": [
427
- "#f2f2f2",
514
+ "color-common-text-secondary": [
515
+ "#bfbfbf",
428
516
  "color"
429
517
  ],
430
- "color-text-default-sub": [
431
- "#ebebeb",
518
+ "color-common-text-inverse": [
519
+ "#212121",
520
+ "color"
521
+ ],
522
+ "color-common-border-focus": [
523
+ "#54c3f1",
524
+ "color"
525
+ ],
526
+ "color-common-border-empty": [
527
+ "#515151",
528
+ "color"
529
+ ],
530
+ "color-common-background-default": [
531
+ "#212121",
432
532
  "color"
433
533
  ],
434
- "color-background-theme": [
534
+ "color-common-background-overlay": [
435
535
  "#000000",
436
536
  "color"
437
537
  ],
438
- "color-background-component": [
439
- "#414141",
538
+ "color-divider": [
539
+ "#515151",
440
540
  "color"
441
541
  ],
442
- "color-background-object": [
443
- "#f2f2f2",
542
+ "color-link-text-default": [
543
+ "#76cff4",
544
+ "color"
545
+ ],
546
+ "color-link-text-hover": [
547
+ "#98dbf7",
548
+ "color"
549
+ ],
550
+ "color-link-text-press": [
551
+ "#bbe7f9",
552
+ "color"
553
+ ],
554
+ "color-link-text-visited-default": [
555
+ "#c477d0",
556
+ "color"
557
+ ],
558
+ "color-link-text-visited-hover": [
559
+ "#d399dc",
560
+ "color"
561
+ ],
562
+ "color-link-text-visited-press": [
563
+ "#e1bbe8",
564
+ "color"
565
+ ],
566
+ "color-link-surface-visited-hover": [
567
+ "#250e29",
568
+ "color"
569
+ ],
570
+ "color-link-surface-visited-press": [
571
+ "#37153d",
444
572
  "color"
445
573
  ],
446
574
  "border-radius-100": [
@@ -507,340 +635,84 @@
507
635
  "2px",
508
636
  "dimension"
509
637
  ],
510
- "shadow-black": [
511
- "0 -2px 19px 0 rgba(0, 0, 0, 0.1)",
512
- "shadow"
513
- ],
514
- "shadow-white": [
515
- "0 -2px 19px 0 rgba(255, 255, 255, 0.1)",
516
- "shadow"
517
- ],
518
- "font-size-300": [
519
- "12px",
520
- "typography"
521
- ],
522
- "font-size-350": [
523
- "14px",
524
- "typography"
525
- ],
526
- "font-size-400": [
527
- "16px",
528
- "typography"
529
- ],
530
- "line-height-tight": [
531
- "130%",
532
- "typography"
533
- ],
534
- "line-height-normal": [
535
- "150%",
536
- "typography"
537
- ],
538
- "font-weight-bold": [
539
- "Bold",
540
- "typography"
541
- ],
542
- "font-weight-regular": [
543
- "Regular",
544
- "typography"
545
- ],
546
- "font-family-base": [
547
- "Roboto",
548
- "typography"
549
- ],
550
- "regular-normal-300": [
638
+ "font-regular-normal-300": [
551
639
  "400 12px/1.5 Roboto",
552
640
  "typography"
553
641
  ],
554
- "regular-normal-350": [
642
+ "font-regular-normal-350": [
555
643
  "400 14px/1.5 Roboto",
556
644
  "typography"
557
645
  ],
558
- "regular-normal-400": [
646
+ "font-regular-normal-400": [
559
647
  "400 16px/1.5 Roboto",
560
648
  "typography"
561
649
  ],
562
- "regular-tight-300": [
650
+ "font-regular-tight-300": [
563
651
  "400 12px/1.3 Roboto",
564
652
  "typography"
565
653
  ],
566
- "regular-tight-350": [
654
+ "font-regular-tight-350": [
567
655
  "400 14px/1.3 Roboto",
568
656
  "typography"
569
657
  ],
570
- "regular-tight-400": [
658
+ "font-regular-tight-400": [
571
659
  "400 16px/1.3 Roboto",
572
660
  "typography"
573
661
  ],
574
- "regular-bold-normal-300": [
662
+ "font-regular-bold-normal-300": [
575
663
  "700 12px/1.5 Roboto",
576
664
  "typography"
577
665
  ],
578
- "regular-bold-normal-350": [
666
+ "font-regular-bold-normal-350": [
579
667
  "700 14px/1.5 Roboto",
580
668
  "typography"
581
669
  ],
582
- "regular-bold-normal-400": [
670
+ "font-regular-bold-normal-400": [
583
671
  "700 16px/1.5 Roboto",
584
672
  "typography"
585
673
  ],
586
- "regular-bold-tight-300": [
674
+ "font-regular-bold-tight-300": [
587
675
  "700 12px/1.3 Roboto",
588
676
  "typography"
589
677
  ],
590
- "regular-bold-tight-350": [
678
+ "font-regular-bold-tight-350": [
591
679
  "700 14px/1.3 Roboto",
592
680
  "typography"
593
681
  ],
594
- "regular-bold-tight-400": [
682
+ "font-regular-bold-tight-400": [
595
683
  "700 16px/1.3 Roboto",
596
684
  "typography"
597
685
  ],
598
- "checkbox-border-unselected": [
599
- "2px solid #bfbfbf",
600
- "border"
601
- ],
602
- "checkbox-color-background": [
603
- "#30ade9",
604
- "color"
605
- ],
606
- "checkbox-color-icon": [
607
- "#ffffff",
608
- "color"
609
- ],
610
- "dropdown-color-background": [
611
- "#ffffff",
612
- "color"
613
- ],
614
- "dropdown-color-text": [
615
- "#515151",
616
- "color"
617
- ],
618
- "dropdown-tray-color-background-selected": [
619
- "#ebebeb",
620
- "color"
621
- ],
622
- "table-color-background": [
623
- "#ffffff",
624
- "color"
625
- ],
626
- "table-color-text": [
627
- "#515151",
628
- "color"
629
- ],
630
- "table-header-border": [
631
- "1px none #000000",
632
- "border"
633
- ],
634
- "table-cell-border": [
635
- "1px none #ebebeb",
636
- "border"
637
- ],
638
- "table-page-number-color-background-selected": [
639
- "#828282",
640
- "color"
641
- ],
642
- "table-page-number-color-text-default": [
643
- "#515151",
644
- "color"
645
- ],
646
- "table-page-number-color-text-selected": [
647
- "#ffffff",
648
- "color"
649
- ],
650
- "table-page-number-border-hover": [
651
- "1px none #828282",
652
- "border"
653
- ],
654
- "login-sso-button-border": [
655
- "1px none #616161",
656
- "border"
657
- ],
658
- "login-sso-button-color-text": [
659
- "#616161",
660
- "color"
661
- ],
662
- "form-color-background": [
663
- "#ffffff",
664
- "color"
665
- ],
666
- "form-color-text-default": [
667
- "#414141",
668
- "color"
669
- ],
670
- "form-color-text-placeholder": [
671
- "#828282",
672
- "color"
673
- ],
674
- "form-color-text-positive": [
675
- "#00c3ac",
676
- "color"
677
- ],
678
- "form-color-text-negative": [
679
- "#f21a27",
680
- "color"
681
- ],
682
- "notification-color-background-success": [
683
- "#00c3ac",
684
- "color"
685
- ],
686
- "notification-color-background-error": [
687
- "#f21a27",
688
- "color"
689
- ],
690
- "notification-color-background-warning": [
691
- "#ffbf0e",
692
- "color"
693
- ],
694
- "notification-color-background-alarm": [
695
- "#fa7a12",
696
- "color"
697
- ],
698
- "notification-color-background-information": [
699
- "#30ade9",
700
- "color"
701
- ],
702
- "notification-color-background-theme": [
703
- "#414141",
704
- "color"
705
- ],
706
- "notification-color-text": [
707
- "#f2f2f2",
708
- "color"
709
- ],
710
- "notification-shadow": [
711
- "0 -2px 19px 0 rgba(0, 0, 0, 0.1)",
712
- "shadow"
713
- ],
714
- "icon-color-background-neutral": [
715
- "#a0a0a0",
716
- "color"
717
- ],
718
- "icon-color-background-default": [
719
- "#f2f2f2",
720
- "color"
721
- ],
722
- "icon-color-background-theme": [
723
- "#000000",
724
- "color"
725
- ],
726
- "container-color-background": [
727
- "#414141",
728
- "color"
729
- ],
730
- "container-color-text-header": [
731
- "#f2f2f2",
732
- "color"
733
- ],
734
- "container-color-text-body": [
735
- "#ebebeb",
736
- "color"
737
- ],
738
- "card-shadow": [
739
- "0 -2px 19px 0 rgba(255, 255, 255, 0.1)",
740
- "shadow"
741
- ],
742
- "button-color-background-primary-active": [
743
- "#76cff4",
744
- "color"
745
- ],
746
- "button-color-background-primary-hover": [
747
- "#30ade9",
748
- "color"
749
- ],
750
- "button-color-background-primary-press": [
751
- "#98dbf7",
752
- "color"
753
- ],
754
- "button-color-background-primary-focus": [
755
- "#bbe7f9",
756
- "color"
757
- ],
758
- "button-color-background-primary-disabled": [
759
- "#616161",
760
- "color"
761
- ],
762
- "button-color-border-secondary-active": [
763
- "#76cff4",
764
- "color"
765
- ],
766
- "button-color-border-secondary-hover": [
767
- "#30ade9",
768
- "color"
769
- ],
770
- "button-color-border-secondary-press": [
771
- "#98dbf7",
772
- "color"
773
- ],
774
- "button-color-border-secondary-focus": [
775
- "#bbe7f9",
776
- "color"
777
- ],
778
- "button-color-border-secondary-disabled": [
779
- "#616161",
780
- "color"
781
- ],
782
- "button-color-text-secondary-active": [
783
- "#76cff4",
784
- "color"
785
- ],
786
- "button-color-text-secondary-hover": [
787
- "#30ade9",
788
- "color"
789
- ],
790
- "button-color-text-secondary-press": [
791
- "#98dbf7",
792
- "color"
793
- ],
794
- "button-color-text-secondary-focus": [
795
- "#bbe7f9",
796
- "color"
797
- ],
798
- "button-color-text-secondary-disabled": [
799
- "#616161",
800
- "color"
801
- ],
802
- "button-color-text-primary": [
803
- "#414141",
804
- "color"
805
- ],
806
- "tab-color-line-active": [
807
- "#76cff4",
808
- "color"
809
- ],
810
- "tab-color-line-hover": [
811
- "#30ade9",
812
- "color"
813
- ],
814
- "tab-color-line-press": [
815
- "#98dbf7",
816
- "color"
686
+ "font-size-300": [
687
+ "12px",
688
+ "fontSize"
817
689
  ],
818
- "tab-color-line-focus": [
819
- "#bbe7f9",
820
- "color"
690
+ "font-size-350": [
691
+ "14px",
692
+ "fontSize"
821
693
  ],
822
- "tab-color-line-disabled": [
823
- "#616161",
824
- "color"
694
+ "font-size-400": [
695
+ "16px",
696
+ "fontSize"
825
697
  ],
826
- "tab-color-text-active": [
827
- "#76cff4",
828
- "color"
698
+ "font-line-height-tight": [
699
+ "1.3",
700
+ "lineHeight"
829
701
  ],
830
- "tab-color-text-hover": [
831
- "#30ade9",
832
- "color"
702
+ "font-line-height-normal": [
703
+ "1.5",
704
+ "lineHeight"
833
705
  ],
834
- "tab-color-text-press": [
835
- "#98dbf7",
836
- "color"
706
+ "font-weight-bold": [
707
+ "700",
708
+ "fontWeight"
837
709
  ],
838
- "tab-color-text-focus": [
839
- "#bbe7f9",
840
- "color"
710
+ "font-weight-regular": [
711
+ "400",
712
+ "fontWeight"
841
713
  ],
842
- "tab-color-text-disabled": [
843
- "#616161",
844
- "color"
714
+ "font-family-base": [
715
+ "Roboto",
716
+ "fontFamily"
845
717
  ]
846
718
  }