@primer/primitives 10.4.0-rc.2e7935f4 → 10.4.0-rc.58347043

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 (77) hide show
  1. package/dist/css/functional/themes/dark-colorblind.css +2 -2
  2. package/dist/css/functional/themes/dark-dimmed.css +2 -2
  3. package/dist/css/functional/themes/dark-high-contrast.css +2 -2
  4. package/dist/css/functional/themes/dark-tritanopia.css +2 -2
  5. package/dist/css/functional/themes/dark.css +2 -2
  6. package/dist/css/functional/themes/light-colorblind.css +2 -2
  7. package/dist/css/functional/themes/light-high-contrast.css +2 -2
  8. package/dist/css/functional/themes/light-tritanopia.css +2 -2
  9. package/dist/css/functional/themes/light.css +2 -2
  10. package/dist/docs/functional/themes/dark-colorblind.json +7423 -381
  11. package/dist/docs/functional/themes/dark-dimmed.json +7587 -459
  12. package/dist/docs/functional/themes/dark-high-contrast.json +8557 -535
  13. package/dist/docs/functional/themes/dark-tritanopia.json +7402 -374
  14. package/dist/docs/functional/themes/dark.json +7270 -340
  15. package/dist/docs/functional/themes/light-colorblind.json +7497 -379
  16. package/dist/docs/functional/themes/light-high-contrast.json +8541 -471
  17. package/dist/docs/functional/themes/light-tritanopia.json +7454 -364
  18. package/dist/docs/functional/themes/light.json +7380 -332
  19. package/dist/figma/shadows/dark-colorblind.json +35 -35
  20. package/dist/figma/shadows/dark-dimmed.json +35 -35
  21. package/dist/figma/shadows/dark-high-contrast.json +35 -35
  22. package/dist/figma/shadows/dark-tritanopia.json +35 -35
  23. package/dist/figma/shadows/dark.json +35 -35
  24. package/dist/figma/shadows/light-colorblind.json +45 -45
  25. package/dist/figma/shadows/light-high-contrast.json +48 -48
  26. package/dist/figma/shadows/light-tritanopia.json +45 -45
  27. package/dist/figma/shadows/light.json +47 -47
  28. package/dist/figma/themes/dark-colorblind.json +3931 -3824
  29. package/dist/figma/themes/dark-dimmed.json +3961 -3762
  30. package/dist/figma/themes/dark-high-contrast.json +4516 -3277
  31. package/dist/figma/themes/dark-tritanopia.json +3920 -3831
  32. package/dist/figma/themes/dark.json +3774 -3790
  33. package/dist/figma/themes/light-colorblind.json +3831 -3755
  34. package/dist/figma/themes/light-high-contrast.json +4364 -3200
  35. package/dist/figma/themes/light-tritanopia.json +3825 -3780
  36. package/dist/figma/themes/light.json +3649 -3649
  37. package/dist/internalCss/dark-colorblind.css +2 -2
  38. package/dist/internalCss/dark-dimmed.css +2 -2
  39. package/dist/internalCss/dark-high-contrast.css +2 -2
  40. package/dist/internalCss/dark-tritanopia.css +2 -2
  41. package/dist/internalCss/dark.css +2 -2
  42. package/dist/internalCss/light-colorblind.css +2 -2
  43. package/dist/internalCss/light-high-contrast.css +2 -2
  44. package/dist/internalCss/light-tritanopia.css +2 -2
  45. package/dist/internalCss/light.css +2 -2
  46. package/dist/styleLint/functional/themes/dark-colorblind.json +7423 -381
  47. package/dist/styleLint/functional/themes/dark-dimmed.json +7587 -459
  48. package/dist/styleLint/functional/themes/dark-high-contrast.json +8557 -535
  49. package/dist/styleLint/functional/themes/dark-tritanopia.json +7402 -374
  50. package/dist/styleLint/functional/themes/dark.json +7270 -340
  51. package/dist/styleLint/functional/themes/light-colorblind.json +7497 -379
  52. package/dist/styleLint/functional/themes/light-high-contrast.json +8541 -471
  53. package/dist/styleLint/functional/themes/light-tritanopia.json +7454 -364
  54. package/dist/styleLint/functional/themes/light.json +7380 -332
  55. package/package.json +1 -1
  56. package/src/tokens/component/button.json5 +1527 -0
  57. package/src/tokens/component/header.json5 +3 -0
  58. package/src/tokens/component/label.json5 +1942 -0
  59. package/src/tokens/component/menu.json5 +24 -0
  60. package/src/tokens/component/selectMenu.json5 +38 -0
  61. package/src/tokens/component/sideNav.json5 +22 -0
  62. package/src/tokens/component/treeView.json5 +24 -0
  63. package/src/tokens/component/underlineNav.json5 +56 -0
  64. package/src/tokens/functional/color/display.json5 +2170 -0
  65. package/src/tokens/functional/color/selection.json5 +22 -0
  66. package/src/tokens/functional/shadow/light.json5 +43 -0
  67. package/src/tokens/functional/color/dark/display-dark.json5 +0 -1258
  68. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +0 -93
  69. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +0 -494
  70. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +0 -55
  71. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +0 -47
  72. package/src/tokens/functional/color/dark/patterns-dark.json5 +0 -1969
  73. package/src/tokens/functional/color/light/display-light.json5 +0 -1163
  74. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +0 -467
  75. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +0 -69
  76. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +0 -41
  77. package/src/tokens/functional/color/light/patterns-light.json5 +0 -1963
@@ -621,7 +621,7 @@
621
621
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
622
622
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
623
623
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
624
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
624
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
627
627
  [data-color-mode="auto"][data-dark-theme="dark_colorblind"],
@@ -1245,6 +1245,6 @@
1245
1245
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
1246
1246
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1247
1247
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1248
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
1248
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1249
1249
  }
1250
1250
  }
@@ -621,7 +621,7 @@
621
621
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
622
622
  --focus-outline: 2px solid #316dca;
623
623
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
624
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
624
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
627
627
  [data-color-mode="auto"][data-dark-theme="dark_dimmed"],
@@ -1245,6 +1245,6 @@
1245
1245
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1246
1246
  --focus-outline: 2px solid #316dca;
1247
1247
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
1248
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
1248
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1249
1249
  }
1250
1250
  }
@@ -621,7 +621,7 @@
621
621
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
622
622
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
623
623
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
624
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
624
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
627
627
  [data-color-mode="auto"][data-dark-theme="dark_high_contrast"],
@@ -1245,6 +1245,6 @@
1245
1245
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1246
1246
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1247
1247
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1248
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
1248
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1249
1249
  }
1250
1250
  }
@@ -621,7 +621,7 @@
621
621
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
622
622
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
623
623
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
624
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
624
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
627
627
  [data-color-mode="auto"][data-dark-theme="dark_tritanopia"],
@@ -1245,6 +1245,6 @@
1245
1245
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
1246
1246
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1247
1247
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1248
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
1248
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1249
1249
  }
1250
1250
  }
@@ -621,7 +621,7 @@
621
621
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
622
622
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
623
623
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
624
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
624
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
627
627
  [data-color-mode="auto"][data-dark-theme="dark"],
@@ -1245,6 +1245,6 @@
1245
1245
  --shadow-floating-xlarge: 0px 0px 0px 1px #3d444d, 0px 32px 64px 0px #010409;
1246
1246
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1247
1247
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1248
- --button-outline-borderColor-selected: var(--button-outline-borderColor-hover);
1248
+ --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
1249
1249
  }
1250
1250
  }
@@ -574,7 +574,6 @@
574
574
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
575
575
  --button-default-borderColor-active: var(--control-borderColor-rest);
576
576
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
577
- --button-default-borderColor-hover: var(--control-borderColor-rest);
578
577
  --button-default-borderColor-rest: var(--control-borderColor-rest);
579
578
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
580
579
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -616,6 +615,7 @@
616
615
  --underlineNav-borderColor-hover: var(--borderColor-muted);
617
616
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
618
617
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
618
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
619
619
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
620
620
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
621
621
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;
@@ -1198,7 +1198,6 @@
1198
1198
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1199
1199
  --button-default-borderColor-active: var(--control-borderColor-rest);
1200
1200
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
1201
- --button-default-borderColor-hover: var(--control-borderColor-rest);
1202
1201
  --button-default-borderColor-rest: var(--control-borderColor-rest);
1203
1202
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
1204
1203
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -1240,6 +1239,7 @@
1240
1239
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1241
1240
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
1242
1241
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
1242
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1243
1243
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
1244
1244
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
1245
1245
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;
@@ -574,7 +574,6 @@
574
574
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
575
575
  --button-default-borderColor-active: var(--control-borderColor-rest);
576
576
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
577
- --button-default-borderColor-hover: var(--control-borderColor-rest);
578
577
  --button-default-borderColor-rest: var(--control-borderColor-rest);
579
578
  --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
580
579
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
@@ -621,6 +620,7 @@
621
620
  --tooltip-fgColor: var(--fgColor-onEmphasis);
622
621
  --underlineNav-borderColor-hover: var(--borderColor-muted);
623
622
  --border-neutral-muted: 0.0625rem solid #454c54;
623
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
624
624
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
625
625
  }
626
626
  @media (prefers-color-scheme: dark) {
@@ -1198,7 +1198,6 @@
1198
1198
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1199
1199
  --button-default-borderColor-active: var(--control-borderColor-rest);
1200
1200
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
1201
- --button-default-borderColor-hover: var(--control-borderColor-rest);
1202
1201
  --button-default-borderColor-rest: var(--control-borderColor-rest);
1203
1202
  --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
1204
1203
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
@@ -1245,6 +1244,7 @@
1245
1244
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1246
1245
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1247
1246
  --border-neutral-muted: 0.0625rem solid #454c54;
1247
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1248
1248
  --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
1249
1249
  }
1250
1250
  }
@@ -574,7 +574,6 @@
574
574
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
575
575
  --button-default-borderColor-active: var(--control-borderColor-rest);
576
576
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
577
- --button-default-borderColor-hover: var(--control-borderColor-rest);
578
577
  --button-default-borderColor-rest: var(--control-borderColor-rest);
579
578
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
580
579
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -616,6 +615,7 @@
616
615
  --underlineNav-borderColor-hover: var(--borderColor-muted);
617
616
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
618
617
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
618
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
619
619
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
620
620
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
621
621
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;
@@ -1198,7 +1198,6 @@
1198
1198
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1199
1199
  --button-default-borderColor-active: var(--control-borderColor-rest);
1200
1200
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
1201
- --button-default-borderColor-hover: var(--control-borderColor-rest);
1202
1201
  --button-default-borderColor-rest: var(--control-borderColor-rest);
1203
1202
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
1204
1203
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -1240,6 +1239,7 @@
1240
1239
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1241
1240
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
1242
1241
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
1242
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1243
1243
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
1244
1244
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
1245
1245
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;
@@ -574,7 +574,6 @@
574
574
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
575
575
  --button-default-borderColor-active: var(--control-borderColor-rest);
576
576
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
577
- --button-default-borderColor-hover: var(--control-borderColor-rest);
578
577
  --button-default-borderColor-rest: var(--control-borderColor-rest);
579
578
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
580
579
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -616,6 +615,7 @@
616
615
  --underlineNav-borderColor-hover: var(--borderColor-muted);
617
616
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
618
617
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
618
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
619
619
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
620
620
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
621
621
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;
@@ -1198,7 +1198,6 @@
1198
1198
  --button-default-bgColor-disabled: var(--control-bgColor-disabled);
1199
1199
  --button-default-borderColor-active: var(--control-borderColor-rest);
1200
1200
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
1201
- --button-default-borderColor-hover: var(--control-borderColor-rest);
1202
1201
  --button-default-borderColor-rest: var(--control-borderColor-rest);
1203
1202
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
1204
1203
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
@@ -1240,6 +1239,7 @@
1240
1239
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1241
1240
  --border-neutral-muted: 0.0625rem solid #d1d9e0b3;
1242
1241
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
1242
+ --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1243
1243
  --button-outline-borderColor-hover: var(--button-primary-borderColor-hover);
1244
1244
  --shadow-floating-large: 0px 0px 0px 1px #d1d9e0, 0px 40px 80px 0px #25292e3d;
1245
1245
  --shadow-floating-medium: 0px 0px 0px 1px #d1d9e0, 0px 8px 16px -4px #25292e14, 0px 4px 32px -4px #25292e14, 0px 24px 48px -12px #25292e14, 0px 48px 96px -24px #25292e14;