@primer/primitives 7.11.14-rc.56ea5d4 → 7.11.14-rc.7fb8b8f

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 (167) hide show
  1. package/dist/js/colors/dark.d.ts +1 -0
  2. package/dist/js/colors/dark.js +2 -1
  3. package/dist/js/colors/dark_colorblind.d.ts +1 -0
  4. package/dist/js/colors/dark_colorblind.js +2 -1
  5. package/dist/js/colors/dark_dimmed.d.ts +1 -0
  6. package/dist/js/colors/dark_dimmed.js +2 -1
  7. package/dist/js/colors/dark_high_contrast.d.ts +1 -0
  8. package/dist/js/colors/dark_high_contrast.js +2 -1
  9. package/dist/js/colors/dark_tritanopia.d.ts +1 -0
  10. package/dist/js/colors/dark_tritanopia.js +2 -1
  11. package/dist/js/colors/index.d.ts +9 -0
  12. package/dist/js/colors/light.d.ts +1 -0
  13. package/dist/js/colors/light.js +2 -1
  14. package/dist/js/colors/light_colorblind.d.ts +1 -0
  15. package/dist/js/colors/light_colorblind.js +2 -1
  16. package/dist/js/colors/light_high_contrast.d.ts +1 -0
  17. package/dist/js/colors/light_high_contrast.js +2 -1
  18. package/dist/js/colors/light_tritanopia.d.ts +1 -0
  19. package/dist/js/colors/light_tritanopia.js +2 -1
  20. package/dist/js/index.d.ts +9 -0
  21. package/dist/json/colors/dark.json +2 -1
  22. package/dist/json/colors/dark_colorblind.json +2 -1
  23. package/dist/json/colors/dark_dimmed.json +2 -1
  24. package/dist/json/colors/dark_high_contrast.json +2 -1
  25. package/dist/json/colors/dark_tritanopia.json +2 -1
  26. package/dist/json/colors/light.json +2 -1
  27. package/dist/json/colors/light_colorblind.json +2 -1
  28. package/dist/json/colors/light_high_contrast.json +2 -1
  29. package/dist/json/colors/light_tritanopia.json +2 -1
  30. package/dist/scss/colors/_dark.scss +1 -0
  31. package/dist/scss/colors/_dark_colorblind.scss +1 -0
  32. package/dist/scss/colors/_dark_dimmed.scss +1 -0
  33. package/dist/scss/colors/_dark_high_contrast.scss +1 -0
  34. package/dist/scss/colors/_dark_tritanopia.scss +1 -0
  35. package/dist/scss/colors/_light.scss +1 -0
  36. package/dist/scss/colors/_light_colorblind.scss +1 -0
  37. package/dist/scss/colors/_light_high_contrast.scss +1 -0
  38. package/dist/scss/colors/_light_tritanopia.scss +1 -0
  39. package/dist/ts/colors/dark.ts +2 -1
  40. package/dist/ts/colors/dark_colorblind.ts +2 -1
  41. package/dist/ts/colors/dark_dimmed.ts +2 -1
  42. package/dist/ts/colors/dark_high_contrast.ts +2 -1
  43. package/dist/ts/colors/dark_tritanopia.ts +2 -1
  44. package/dist/ts/colors/light.ts +2 -1
  45. package/dist/ts/colors/light_colorblind.ts +2 -1
  46. package/dist/ts/colors/light_high_contrast.ts +2 -1
  47. package/dist/ts/colors/light_tritanopia.ts +2 -1
  48. package/package.json +4 -4
  49. package/tokens-next-private/css/functional/size/border.css +1 -1
  50. package/tokens-next-private/css/functional/themes/dark-colorblind.css +2 -2
  51. package/tokens-next-private/css/functional/themes/dark-dimmed.css +2 -2
  52. package/tokens-next-private/css/functional/themes/dark-high-contrast.css +2 -2
  53. package/tokens-next-private/css/functional/themes/dark-tritanopia.css +2 -2
  54. package/tokens-next-private/css/functional/themes/dark.css +2 -2
  55. package/tokens-next-private/css/functional/themes/light-colorblind.css +16 -16
  56. package/tokens-next-private/css/functional/themes/light-high-contrast.css +12 -12
  57. package/tokens-next-private/css/functional/themes/light-tritanopia.css +16 -16
  58. package/tokens-next-private/css/functional/themes/light.css +16 -16
  59. package/tokens-next-private/docs/functional/size/border.json +2 -2
  60. package/tokens-next-private/docs/functional/themes/dark-colorblind.json +10 -10
  61. package/tokens-next-private/docs/functional/themes/dark-dimmed.json +10 -10
  62. package/tokens-next-private/docs/functional/themes/dark-high-contrast.json +8 -8
  63. package/tokens-next-private/docs/functional/themes/dark-tritanopia.json +10 -10
  64. package/tokens-next-private/docs/functional/themes/dark.json +10 -10
  65. package/tokens-next-private/docs/functional/themes/light-colorblind.json +13 -13
  66. package/tokens-next-private/docs/functional/themes/light-high-contrast.json +10 -10
  67. package/tokens-next-private/docs/functional/themes/light-tritanopia.json +13 -13
  68. package/tokens-next-private/docs/functional/themes/light.json +13 -13
  69. package/tokens-next-private/fallbacks/color-fallbacks.json +9 -7
  70. package/tokens-next-private/fallbacks/functional/size/border.json +1 -1
  71. package/tokens-next-private/js/functional/size/border.js +1 -1
  72. package/tokens-next-private/js/functional/themes/dark-colorblind.js +1 -1
  73. package/tokens-next-private/js/functional/themes/dark-dimmed.js +1 -1
  74. package/tokens-next-private/js/functional/themes/dark-high-contrast.js +1 -1
  75. package/tokens-next-private/js/functional/themes/dark-tritanopia.js +1 -1
  76. package/tokens-next-private/js/functional/themes/dark.js +1 -1
  77. package/tokens-next-private/js/functional/themes/light-colorblind.js +8 -8
  78. package/tokens-next-private/js/functional/themes/light-high-contrast.js +6 -6
  79. package/tokens-next-private/js/functional/themes/light-tritanopia.js +8 -8
  80. package/tokens-next-private/js/functional/themes/light.js +8 -8
  81. package/tokens-next-private/json/functional/size/border.json +1 -1
  82. package/tokens-next-private/json/functional/themes/dark-colorblind.json +1 -1
  83. package/tokens-next-private/json/functional/themes/dark-dimmed.json +1 -1
  84. package/tokens-next-private/json/functional/themes/dark-high-contrast.json +1 -1
  85. package/tokens-next-private/json/functional/themes/dark-tritanopia.json +1 -1
  86. package/tokens-next-private/json/functional/themes/dark.json +1 -1
  87. package/tokens-next-private/json/functional/themes/light-colorblind.json +8 -8
  88. package/tokens-next-private/json/functional/themes/light-high-contrast.json +6 -6
  89. package/tokens-next-private/json/functional/themes/light-tritanopia.json +8 -8
  90. package/tokens-next-private/json/functional/themes/light.json +8 -8
  91. package/tokens-next-private/scss/functional/size/border.scss +1 -1
  92. package/tokens-next-private/scss/functional/themes/dark-colorblind.scss +1 -1
  93. package/tokens-next-private/scss/functional/themes/dark-dimmed.scss +1 -1
  94. package/tokens-next-private/scss/functional/themes/dark-high-contrast.scss +1 -1
  95. package/tokens-next-private/scss/functional/themes/dark-tritanopia.scss +1 -1
  96. package/tokens-next-private/scss/functional/themes/dark.scss +1 -1
  97. package/tokens-next-private/scss/functional/themes/light-colorblind.scss +8 -8
  98. package/tokens-next-private/scss/functional/themes/light-high-contrast.scss +6 -6
  99. package/tokens-next-private/scss/functional/themes/light-tritanopia.scss +8 -8
  100. package/tokens-next-private/scss/functional/themes/light.scss +8 -8
  101. package/tokens-next-private/ts/functional/size/border.ts +1 -1
  102. package/tokens-next-private/ts/functional/themes/dark-colorblind.ts +1 -1
  103. package/tokens-next-private/ts/functional/themes/dark-dimmed.ts +1 -1
  104. package/tokens-next-private/ts/functional/themes/dark-high-contrast.ts +1 -1
  105. package/tokens-next-private/ts/functional/themes/dark-tritanopia.ts +1 -1
  106. package/tokens-next-private/ts/functional/themes/dark.ts +1 -1
  107. package/tokens-next-private/ts/functional/themes/light-colorblind.ts +8 -8
  108. package/tokens-next-private/ts/functional/themes/light-high-contrast.ts +6 -6
  109. package/tokens-next-private/ts/functional/themes/light-tritanopia.ts +8 -8
  110. package/tokens-next-private/ts/functional/themes/light.ts +8 -8
  111. package/tokens-next-private/ts/types/BaseColorDesignTokens.d.ts +1 -1
  112. package/tokens-next-private/ts/types/SizeDesignTokens.d.ts +1 -1
  113. package/tokens-next-private/ts/types/ThemeDesignTokens.d.ts +1 -1
  114. package/tokens-next-private/ts/types/TypographyDesignTokens.d.ts +1 -1
  115. package/tokens-v2-private/css/tokens/base/size/size.css +1 -1
  116. package/tokens-v2-private/css/tokens/base/typography/typography.css +1 -1
  117. package/tokens-v2-private/css/tokens/functional/size/border.css +1 -1
  118. package/tokens-v2-private/css/tokens/functional/size/breakpoints.css +1 -1
  119. package/tokens-v2-private/css/tokens/functional/size/size-coarse.css +1 -1
  120. package/tokens-v2-private/css/tokens/functional/size/size-fine.css +1 -1
  121. package/tokens-v2-private/css/tokens/functional/size/size.css +1 -1
  122. package/tokens-v2-private/css/tokens/functional/typography/typography.css +1 -1
  123. package/tokens-v2-private/js/module/tokens/base/size/size.js +2 -2
  124. package/tokens-v2-private/js/module/tokens/base/typography/typography.js +2 -2
  125. package/tokens-v2-private/js/module/tokens/functional/size/border.js +2 -2
  126. package/tokens-v2-private/js/module/tokens/functional/size/breakpoints.js +2 -2
  127. package/tokens-v2-private/js/module/tokens/functional/size/size-coarse.js +2 -2
  128. package/tokens-v2-private/js/module/tokens/functional/size/size-fine.js +2 -2
  129. package/tokens-v2-private/js/module/tokens/functional/size/size.js +2 -2
  130. package/tokens-v2-private/js/module/tokens/functional/size/viewport.js +2 -2
  131. package/tokens-v2-private/js/module/tokens/functional/typography/typography.js +2 -2
  132. package/tokens-v2-private/js/tokens/base/size/size.js +2 -2
  133. package/tokens-v2-private/js/tokens/base/typography/typography.js +2 -2
  134. package/tokens-v2-private/js/tokens/functional/size/border.js +2 -2
  135. package/tokens-v2-private/js/tokens/functional/size/breakpoints.js +2 -2
  136. package/tokens-v2-private/js/tokens/functional/size/size-coarse.js +2 -2
  137. package/tokens-v2-private/js/tokens/functional/size/size-fine.js +2 -2
  138. package/tokens-v2-private/js/tokens/functional/size/size.js +2 -2
  139. package/tokens-v2-private/js/tokens/functional/size/viewport.js +2 -2
  140. package/tokens-v2-private/js/tokens/functional/typography/typography.js +2 -2
  141. package/tokens-v2-private/scss/tokens/base/size/size.scss +2 -2
  142. package/tokens-v2-private/scss/tokens/base/typography/typography.scss +2 -2
  143. package/tokens-v2-private/scss/tokens/functional/size/border.scss +2 -2
  144. package/tokens-v2-private/scss/tokens/functional/size/breakpoints.scss +2 -2
  145. package/tokens-v2-private/scss/tokens/functional/size/size-coarse.scss +2 -2
  146. package/tokens-v2-private/scss/tokens/functional/size/size-fine.scss +2 -2
  147. package/tokens-v2-private/scss/tokens/functional/size/size.scss +2 -2
  148. package/tokens-v2-private/scss/tokens/functional/size/viewport.scss +2 -2
  149. package/tokens-v2-private/scss/tokens/functional/typography/typography.scss +2 -2
  150. package/tokens-v2-private/ts/tokens/base/size/size.d.ts +1 -1
  151. package/tokens-v2-private/ts/tokens/base/size/size.js +1 -1
  152. package/tokens-v2-private/ts/tokens/base/typography/typography.d.ts +1 -1
  153. package/tokens-v2-private/ts/tokens/base/typography/typography.js +1 -1
  154. package/tokens-v2-private/ts/tokens/functional/size/border.d.ts +1 -1
  155. package/tokens-v2-private/ts/tokens/functional/size/border.js +1 -1
  156. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.d.ts +1 -1
  157. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.js +1 -1
  158. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.d.ts +1 -1
  159. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.js +1 -1
  160. package/tokens-v2-private/ts/tokens/functional/size/size-fine.d.ts +1 -1
  161. package/tokens-v2-private/ts/tokens/functional/size/size-fine.js +1 -1
  162. package/tokens-v2-private/ts/tokens/functional/size/size.d.ts +1 -1
  163. package/tokens-v2-private/ts/tokens/functional/size/size.js +1 -1
  164. package/tokens-v2-private/ts/tokens/functional/size/viewport.d.ts +1 -1
  165. package/tokens-v2-private/ts/tokens/functional/size/viewport.js +1 -1
  166. package/tokens-v2-private/ts/tokens/functional/typography/typography.d.ts +1 -1
  167. package/tokens-v2-private/ts/tokens/functional/typography/typography.js +1 -1
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#0c2d6b"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
216
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
217
+ "backdrop": "rgba(22,27,34,0.4)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#0c2d6b"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
216
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
217
+ "backdrop": "rgba(22,27,34,0.4)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#143d79"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)"
216
+ "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)",
217
+ "backdrop": "rgba(45,51,59,0.4)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(205,217,229,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#1e60d5"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)"
216
+ "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)",
217
+ "backdrop": "rgba(39,43,51,0.4)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#0c2d6b"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
216
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
217
+ "backdrop": "rgba(22,27,34,0.4)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -213,6 +213,7 @@ declare const _default: {
213
213
  };
214
214
  overlay: {
215
215
  shadow: string;
216
+ backdrop: string;
216
217
  };
217
218
  header: {
218
219
  text: string;
@@ -723,6 +724,7 @@ declare const _default: {
723
724
  };
724
725
  overlay: {
725
726
  shadow: string;
727
+ backdrop: string;
726
728
  };
727
729
  header: {
728
730
  text: string;
@@ -1233,6 +1235,7 @@ declare const _default: {
1233
1235
  };
1234
1236
  overlay: {
1235
1237
  shadow: string;
1238
+ backdrop: string;
1236
1239
  };
1237
1240
  header: {
1238
1241
  text: string;
@@ -1743,6 +1746,7 @@ declare const _default: {
1743
1746
  };
1744
1747
  overlay: {
1745
1748
  shadow: string;
1749
+ backdrop: string;
1746
1750
  };
1747
1751
  header: {
1748
1752
  text: string;
@@ -2253,6 +2257,7 @@ declare const _default: {
2253
2257
  };
2254
2258
  overlay: {
2255
2259
  shadow: string;
2260
+ backdrop: string;
2256
2261
  };
2257
2262
  header: {
2258
2263
  text: string;
@@ -2763,6 +2768,7 @@ declare const _default: {
2763
2768
  };
2764
2769
  overlay: {
2765
2770
  shadow: string;
2771
+ backdrop: string;
2766
2772
  };
2767
2773
  header: {
2768
2774
  text: string;
@@ -3273,6 +3279,7 @@ declare const _default: {
3273
3279
  };
3274
3280
  overlay: {
3275
3281
  shadow: string;
3282
+ backdrop: string;
3276
3283
  };
3277
3284
  header: {
3278
3285
  text: string;
@@ -3783,6 +3790,7 @@ declare const _default: {
3783
3790
  };
3784
3791
  overlay: {
3785
3792
  shadow: string;
3793
+ backdrop: string;
3786
3794
  };
3787
3795
  header: {
3788
3796
  text: string;
@@ -4293,6 +4301,7 @@ declare const _default: {
4293
4301
  };
4294
4302
  overlay: {
4295
4303
  shadow: string;
4304
+ backdrop: string;
4296
4305
  };
4297
4306
  header: {
4298
4307
  text: string;
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#b6e3ff"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)"
216
+ "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)",
217
+ "backdrop": "rgba(140,149,159,0.2)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#b6e3ff"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
216
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
217
+ "backdrop": "rgba(140,149,159,0.2)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#9cd7ff"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)"
216
+ "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)",
217
+ "backdrop": "rgba(136,146,157,0.2)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -212,6 +212,7 @@ declare const _default: {
212
212
  };
213
213
  overlay: {
214
214
  shadow: string;
215
+ backdrop: string;
215
216
  };
216
217
  header: {
217
218
  text: string;
@@ -213,7 +213,8 @@ exports.default = {
213
213
  "tapFocusBg": "#b6e3ff"
214
214
  },
215
215
  "overlay": {
216
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
216
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
217
+ "backdrop": "rgba(140,149,159,0.2)"
217
218
  },
218
219
  "header": {
219
220
  "text": "rgba(255,255,255,0.7)",
@@ -214,6 +214,7 @@ declare const _default: {
214
214
  };
215
215
  overlay: {
216
216
  shadow: string;
217
+ backdrop: string;
217
218
  };
218
219
  header: {
219
220
  text: string;
@@ -724,6 +725,7 @@ declare const _default: {
724
725
  };
725
726
  overlay: {
726
727
  shadow: string;
728
+ backdrop: string;
727
729
  };
728
730
  header: {
729
731
  text: string;
@@ -1234,6 +1236,7 @@ declare const _default: {
1234
1236
  };
1235
1237
  overlay: {
1236
1238
  shadow: string;
1239
+ backdrop: string;
1237
1240
  };
1238
1241
  header: {
1239
1242
  text: string;
@@ -1744,6 +1747,7 @@ declare const _default: {
1744
1747
  };
1745
1748
  overlay: {
1746
1749
  shadow: string;
1750
+ backdrop: string;
1747
1751
  };
1748
1752
  header: {
1749
1753
  text: string;
@@ -2254,6 +2258,7 @@ declare const _default: {
2254
2258
  };
2255
2259
  overlay: {
2256
2260
  shadow: string;
2261
+ backdrop: string;
2257
2262
  };
2258
2263
  header: {
2259
2264
  text: string;
@@ -2764,6 +2769,7 @@ declare const _default: {
2764
2769
  };
2765
2770
  overlay: {
2766
2771
  shadow: string;
2772
+ backdrop: string;
2767
2773
  };
2768
2774
  header: {
2769
2775
  text: string;
@@ -3274,6 +3280,7 @@ declare const _default: {
3274
3280
  };
3275
3281
  overlay: {
3276
3282
  shadow: string;
3283
+ backdrop: string;
3277
3284
  };
3278
3285
  header: {
3279
3286
  text: string;
@@ -3784,6 +3791,7 @@ declare const _default: {
3784
3791
  };
3785
3792
  overlay: {
3786
3793
  shadow: string;
3794
+ backdrop: string;
3787
3795
  };
3788
3796
  header: {
3789
3797
  text: string;
@@ -4294,6 +4302,7 @@ declare const _default: {
4294
4302
  };
4295
4303
  overlay: {
4296
4304
  shadow: string;
4305
+ backdrop: string;
4297
4306
  };
4298
4307
  header: {
4299
4308
  text: string;
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#143d79"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)"
214
+ "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)",
215
+ "backdrop": "rgba(45,51,59,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(205,217,229,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#1e60d5"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(39,43,51,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#9cd7ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)"
214
+ "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)",
215
+ "backdrop": "rgba(136,146,157,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(48,54,61,0.5);
165
165
  --color-select-menu-tap-focus-bg: #0c2d6b;
166
166
  --color-overlay-shadow: 0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85);
167
+ --color-overlay-backdrop: rgba(22,27,34,0.4);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #161b22;
169
170
  --color-header-divider: #8b949e;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(48,54,61,0.5);
165
165
  --color-select-menu-tap-focus-bg: #0c2d6b;
166
166
  --color-overlay-shadow: 0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85);
167
+ --color-overlay-backdrop: rgba(22,27,34,0.4);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #161b22;
169
170
  --color-header-divider: #8b949e;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(68,76,86,0.5);
165
165
  --color-select-menu-tap-focus-bg: #143d79;
166
166
  --color-overlay-shadow: 0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85);
167
+ --color-overlay-backdrop: rgba(45,51,59,0.4);
167
168
  --color-header-text: rgba(205,217,229,0.7);
168
169
  --color-header-bg: #2d333b;
169
170
  --color-header-divider: #768390;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(82,89,100,0.5);
165
165
  --color-select-menu-tap-focus-bg: #1e60d5;
166
166
  --color-overlay-shadow: 0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85);
167
+ --color-overlay-backdrop: rgba(39,43,51,0.4);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #272b33;
169
170
  --color-header-divider: #bdc4cc;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(48,54,61,0.5);
165
165
  --color-select-menu-tap-focus-bg: #0c2d6b;
166
166
  --color-overlay-shadow: 0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85);
167
+ --color-overlay-backdrop: rgba(22,27,34,0.4);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #161b22;
169
170
  --color-header-divider: #8b949e;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(175,184,193,0.5);
165
165
  --color-select-menu-tap-focus-bg: #b6e3ff;
166
166
  --color-overlay-shadow: 0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12);
167
+ --color-overlay-backdrop: rgba(140,149,159,0.2);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #24292f;
169
170
  --color-header-divider: #57606a;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(175,184,193,0.5);
165
165
  --color-select-menu-tap-focus-bg: #b6e3ff;
166
166
  --color-overlay-shadow: 0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12);
167
+ --color-overlay-backdrop: rgba(140,149,159,0.2);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #24292f;
169
170
  --color-header-divider: #57606a;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(172,182,192,0.5);
165
165
  --color-select-menu-tap-focus-bg: #9cd7ff;
166
166
  --color-overlay-shadow: 0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12);
167
+ --color-overlay-backdrop: rgba(136,146,157,0.2);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #0e1116;
169
170
  --color-header-divider: #acb6c0;
@@ -164,6 +164,7 @@
164
164
  --color-select-menu-tap-highlight: rgba(175,184,193,0.5);
165
165
  --color-select-menu-tap-focus-bg: #b6e3ff;
166
166
  --color-overlay-shadow: 0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12);
167
+ --color-overlay-backdrop: rgba(140,149,159,0.2);
167
168
  --color-header-text: rgba(255,255,255,0.7);
168
169
  --color-header-bg: #24292f;
169
170
  --color-header-divider: #57606a;
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#143d79"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)"
214
+ "shadow": "0 0 0 1px #444c56, 0 16px 32px rgba(28,33,40,0.85)",
215
+ "backdrop": "rgba(45,51,59,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(205,217,229,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#1e60d5"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #525964, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(39,43,51,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#0c2d6b"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)"
214
+ "shadow": "0 0 0 1px #30363d, 0 16px 32px rgba(1,4,9,0.85)",
215
+ "backdrop": "rgba(22,27,34,0.4)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#9cd7ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)"
214
+ "shadow": "0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12)",
215
+ "backdrop": "rgba(136,146,157,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
@@ -211,7 +211,8 @@ export default {
211
211
  "tapFocusBg": "#b6e3ff"
212
212
  },
213
213
  "overlay": {
214
- "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)"
214
+ "shadow": "0 1px 3px rgba(27,31,36,0.12), 0 8px 24px rgba(66,74,83,0.12)",
215
+ "backdrop": "rgba(140,149,159,0.2)"
215
216
  },
216
217
  "header": {
217
218
  "text": "rgba(255,255,255,0.7)",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/primitives",
3
- "version": "7.11.14-rc.56ea5d4",
3
+ "version": "7.11.14-rc.7fb8b8f",
4
4
  "description": "Typography, spacing, and color primitives for Primer design system",
5
5
  "files": [
6
6
  "dist",
@@ -80,13 +80,13 @@
80
80
  "jest": "^29.4.3",
81
81
  "json5": "^2.2.1",
82
82
  "lodash": "^4.17.20",
83
+ "markdown-table-ts": "^1.0.3",
83
84
  "mkdirp": "^2.1.1",
84
85
  "prettier": "^2.7.1",
85
- "style-dictionary": "^3.7.2",
86
+ "style-dictionary": "^3.8.0",
86
87
  "ts-jest": "^29.0.3",
87
88
  "ts-node": "^10.9.1",
88
89
  "tsconfig-paths": "^4.1.0",
89
- "typescript": "^4.9.3",
90
- "markdown-table-ts": "^1.0.3"
90
+ "typescript": "^4.9.3"
91
91
  }
92
92
  }
@@ -8,7 +8,7 @@
8
8
  --borderRadius-small: 3px;
9
9
  --borderRadius-medium: 6px;
10
10
  --borderRadius-large: 12px;
11
- --borderRadius-full: 100vh;
11
+ --borderRadius-full: 9999px;
12
12
  --outline-focus-offset: -0.125rem;
13
13
  --outline-focus-width: 0.125rem;
14
14
  }