@primer/primitives 7.12.0 → 7.13.0-rc.80d1e20

package/tokens-next-private/scss/functional/size/size.scss

@@ -53,5 +53,19 @@
     --stack-gap-condensed: 0.5rem;
     --stack-gap-normal: 1rem;
     --stack-gap-spacious: 1.5rem;
+    --overlay-width-xsmall: 12rem;
+    --overlay-width-small: 20rem;
+    --overlay-width-medium: 30rem;
+    --overlay-width-large: 40rem;
+    --overlay-width-xlarge: 60rem;
+    --overlay-height-small: 16rem;
+    --overlay-height-medium: 20rem;
+    --overlay-height-large: 27rem;
+    --overlay-height-xlarge: 37.5rem;
+    --overlay-padding-normal: 1rem;
+    --overlay-padding-condensed: 0.5rem;
+    --overlay-paddingBlock-condensed: 0.25rem;
+    --overlay-paddingBlock-normal: 0.75rem;
+    --overlay-borderRadius: 0.375rem;
   }
 }

package/tokens-next-private/scss/functional/themes/dark-colorblind.scss

@@ -187,21 +187,35 @@
     --fgColor-default: #e6edf3;
     --fgColor-muted: #7d8590;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #0d1117;
     --fgColor-disabled: #8b949e;
     --fgColor-link: #2f81f7;
+    --fgColor-link-onInverse: #1f6feb;
+    --fgColor-neutral: #6e7681;
+    --fgColor-neutral-onInverse: #484f58;
     --fgColor-accent: #2f81f7;
+    --fgColor-accent-onInverse: #1f6feb;
     --fgColor-success: #58a6ff;
+    --fgColor-success-onInverse: #1f6feb;
     --fgColor-attention: #d29922;
+    --fgColor-attention-onInverse: #9e6a03;
     --fgColor-severe: #db6d28;
+    --fgColor-severe-onInverse: #bd561d;
     --fgColor-danger: #db6d28;
+    --fgColor-danger-onInverse: #db3734;
     --fgColor-open: #f0883e;
+    --fgColor-open-onInverse: #bd561d;
     --fgColor-closed: #8b949e;
+    --fgColor-closed-onInverse: #484f58;
     --fgColor-done: #a371f7;
+    --fgColor-done-onInverse: #8957e5;
     --fgColor-sponsors: #db61a2;
+    --fgColor-sponsors-onInverse: #bf4b8a;
     --bgColor-default: #0d1117;
     --bgColor-muted: #161b22;
     --bgColor-inset: #010409;
     --bgColor-emphasis: #6e7681;
+    --bgColor-inverse: #ffffff;
     --bgColor-disabled: #161b22;
     --bgColor-transparent: #00000000;
     --bgColor-neutral-muted: #6e768126;
@@ -389,15 +403,15 @@
     --color-scale-coral-7: #872012; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #640d04; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #460701; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: 0px 0px 0px 0px #000000;
-    --shadow-highlight: 0px 0px 0px 0px #000000;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #010409a3;
-    --shadow-resting-small: 0px 0px 0px 0px #000000;
-    --shadow-resting-medium: 0px 3px 6px 0px #010409;
-    --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 16px 32px 0px #010409d9;
-    --shadow-floating-medium: 0px 4px 32px -4px #6e768117, 0px 8px 16px -4px #6e768117, 0px 24px 48px -12px #6e768129, 0px 48px 96px -24px #6e76813d;
-    --shadow-floating-large: 0px 8px 24px 0px #010409;
-    --shadow-floating-xlarge: 0px 12px 48px 0px #010409;
+    --shadow-inset: inset 0px 1px 0px 0px #0104093d;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff1f;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+    --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
+    --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
+    --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
+    --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
+    --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
+    --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
     --outline-focus: #1f6feb solid 2px;
   }
 }

package/tokens-next-private/scss/functional/themes/dark-dimmed.scss

@@ -187,21 +187,35 @@
     --fgColor-default: #c5d1de;
     --fgColor-muted: #6d7986;
     --fgColor-onEmphasis: #cdd9e5;
+    --fgColor-onInverse: #22272e;
     --fgColor-disabled: #768390;
     --fgColor-link: #3b7cdb;
+    --fgColor-link-onInverse: #316dca;
+    --fgColor-neutral: #636e7b;
+    --fgColor-neutral-onInverse: #545d68;
     --fgColor-accent: #3b7cdb;
+    --fgColor-accent-onInverse: #316dca;
     --fgColor-success: #57ab5a;
+    --fgColor-success-onInverse: #347d39;
     --fgColor-attention: #c69026;
+    --fgColor-attention-onInverse: #966600;
     --fgColor-severe: #cc6b2c;
+    --fgColor-severe-onInverse: #ae5622;
     --fgColor-danger: #e5534b;
+    --fgColor-danger-onInverse: #ca3d38;
     --fgColor-open: #57ab5a;
+    --fgColor-open-onInverse: #347d39;
     --fgColor-closed: #e5534b;
+    --fgColor-closed-onInverse: #ca3d38;
     --fgColor-done: #986ee2;
+    --fgColor-done-onInverse: #8256d0;
     --fgColor-sponsors: #c96198;
+    --fgColor-sponsors-onInverse: #ae4c82;
     --bgColor-default: #22272e;
     --bgColor-muted: #2d333b;
     --bgColor-inset: #1c2128;
     --bgColor-emphasis: #636e7b;
+    --bgColor-inverse: #cdd9e5;
     --bgColor-disabled: #2d333b;
     --bgColor-transparent: #00000000;
     --bgColor-neutral-muted: #636e7b26;
@@ -389,15 +403,15 @@
     --color-scale-coral-7: #8d291b; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #771d13; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #5d1008; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: 0px 0px 0px 0px #000000;
-    --shadow-highlight: 0px 0px 0px 0px #000000;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #1c2128a3;
-    --shadow-resting-small: 0px 0px 0px 0px #000000;
-    --shadow-resting-medium: 0px 3px 6px 0px #1c2128;
-    --shadow-floating-small: 0px 0px 0px 1px #444c56, 0px 16px 32px 0px #1c2128d9;
-    --shadow-floating-medium: 0px 4px 32px -4px #636e7b17, 0px 8px 16px -4px #636e7b17, 0px 24px 48px -12px #636e7b29, 0px 48px 96px -24px #636e7b3d;
-    --shadow-floating-large: 0px 8px 24px 0px #1c2128;
-    --shadow-floating-xlarge: 0px 12px 48px 0px #1c2128;
+    --shadow-inset: inset 0px 1px 0px 0px #1c21283d;
+    --shadow-highlight: inset 0px 1px 0px 0px #cdd9e51f;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #1c2128cc;
+    --shadow-resting-small: 0px 1px 0px 0px #1c212866, 0px 1px 3px 0px #1c212866;
+    --shadow-resting-medium: 0px 3px 6px 0px #1c2128cc;
+    --shadow-floating-small: 0px 0px 0px 1px #2d333b, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
+    --shadow-floating-medium: 0px 0px 0px 1px #2d333b, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
+    --shadow-floating-large: 0px 0px 0px 1px #2d333b, 0px 24px 48px 0px #1c2128;
+    --shadow-floating-xlarge: 0px 0px 0px 1px #2d333b, 0px 32px 64px 0px #1c2128;
     --outline-focus: #316dca solid 2px;
   }
 }

package/tokens-next-private/scss/functional/themes/dark-high-contrast.scss

@@ -126,8 +126,8 @@
     --button-invisible-fgColor-hover: #71b7ff;
     --button-invisible-fgColor-disabled: #bdc4cc;
     --button-invisible-bgColor-rest: #00000000;
-    --button-invisible-bgColor-hover: #272b33;
-    --button-invisible-bgColor-active: #525964;
+    --button-invisible-bgColor-hover: #f0f3f6;
+    --button-invisible-bgColor-active: #d9dee3;
     --button-invisible-bgColor-disabled: #272b33;
     --button-invisible-borderColor-rest: #00000000;
     --button-invisible-borderColor-hover: #7a828e;
@@ -187,21 +187,35 @@
     --fgColor-default: #fbfcfd;
     --fgColor-muted: #f0f3f6;
     --fgColor-onEmphasis: #0a0c10;
+    --fgColor-onInverse: #0a0c10;
     --fgColor-disabled: #bdc4cc;
     --fgColor-link: #409eff;
+    --fgColor-link-onInverse: #1e60d5;
+    --fgColor-neutral: #9ea7b3;
+    --fgColor-neutral-onInverse: #272b33;
     --fgColor-accent: #409eff;
+    --fgColor-accent-onInverse: #1e60d5;
     --fgColor-success: #26cd4d;
+    --fgColor-success-onInverse: #007728;
     --fgColor-attention: #f0b72f;
+    --fgColor-attention-onInverse: #945d02;
     --fgColor-severe: #e7811d;
+    --fgColor-severe-onInverse: #a74c00;
     --fgColor-danger: #ff6a69;
+    --fgColor-danger-onInverse: #b1061a;
     --fgColor-open: #26cd4d;
+    --fgColor-open-onInverse: #007728;
     --fgColor-closed: #ff6a69;
+    --fgColor-closed-onInverse: #b1061a;
     --fgColor-done: #b780ff;
+    --fgColor-done-onInverse: #6921d7;
     --fgColor-sponsors: #ef6eb1;
+    --fgColor-sponsors-onInverse: #9c1d6a;
     --bgColor-default: #0a0c10;
     --bgColor-muted: #272b33;
     --bgColor-inset: #010409;
     --bgColor-emphasis: #ffffff;
+    --bgColor-inverse: #ffffff;
     --bgColor-disabled: #272b33;
     --bgColor-transparent: #00000000;
     --bgColor-neutral-muted: #9ea7b326;
@@ -389,15 +403,15 @@
     --color-scale-coral-7: #e03b21; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #c62612; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #a91500; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: 0px 0px 0px 0px #000000;
-    --shadow-highlight: 0px 0px 0px 0px #000000;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #010409a3;
-    --shadow-resting-small: 0px 0px 0px 0px #000000;
-    --shadow-resting-medium: 0px 3px 6px 0px #010409;
-    --shadow-floating-small: 0px 0px 0px 1px #525964, 0px 16px 32px 0px #010409d9;
-    --shadow-floating-medium: 0px 4px 32px -4px #9ea7b317, 0px 8px 16px -4px #9ea7b317, 0px 24px 48px -12px #9ea7b329, 0px 48px 96px -24px #9ea7b33d;
-    --shadow-floating-large: 0px 8px 24px 0px #010409;
-    --shadow-floating-xlarge: 0px 12px 48px 0px #010409;
+    --shadow-inset: inset 0px 1px 0px 0px #0104093d;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff1f;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+    --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
+    --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
+    --shadow-floating-small: 0px 0px 0px 1px #272b33, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
+    --shadow-floating-medium: 0px 0px 0px 1px #272b33, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
+    --shadow-floating-large: 0px 0px 0px 1px #272b33, 0px 24px 48px 0px #010409;
+    --shadow-floating-xlarge: 0px 0px 0px 1px #272b33, 0px 32px 64px 0px #010409;
     --outline-focus: #409eff solid 2px;
   }
 }

package/tokens-next-private/scss/functional/themes/dark-tritanopia.scss

@@ -187,21 +187,35 @@
     --fgColor-default: #e6edf3;
     --fgColor-muted: #7d8590;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #0d1117;
     --fgColor-disabled: #8b949e;
     --fgColor-link: #2f81f7;
+    --fgColor-link-onInverse: #1f6feb;
+    --fgColor-neutral: #6e7681;
+    --fgColor-neutral-onInverse: #484f58;
     --fgColor-accent: #2f81f7;
+    --fgColor-accent-onInverse: #1f6feb;
     --fgColor-success: #58a6ff;
+    --fgColor-success-onInverse: #1f6feb;
     --fgColor-attention: #d29922;
+    --fgColor-attention-onInverse: #9e6a03;
     --fgColor-severe: #f85149;
+    --fgColor-severe-onInverse: #da3633;
     --fgColor-danger: #f85149;
+    --fgColor-danger-onInverse: #db3734;
     --fgColor-open: #f85149;
+    --fgColor-open-onInverse: #b62324;
     --fgColor-closed: #6e7681;
+    --fgColor-closed-onInverse: #484f58;
     --fgColor-done: #a371f7;
+    --fgColor-done-onInverse: #8957e5;
     --fgColor-sponsors: #db61a2;
+    --fgColor-sponsors-onInverse: #bf4b8a;
     --bgColor-default: #0d1117;
     --bgColor-muted: #161b22;
     --bgColor-inset: #010409;
     --bgColor-emphasis: #6e7681;
+    --bgColor-inverse: #ffffff;
     --bgColor-disabled: #161b22;
     --bgColor-transparent: #00000000;
     --bgColor-neutral-muted: #6e768126;
@@ -389,15 +403,15 @@
     --color-scale-coral-7: #872012; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #640d04; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #460701; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: 0px 0px 0px 0px #000000;
-    --shadow-highlight: 0px 0px 0px 0px #000000;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #010409a3;
-    --shadow-resting-small: 0px 0px 0px 0px #000000;
-    --shadow-resting-medium: 0px 3px 6px 0px #010409;
-    --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 16px 32px 0px #010409d9;
-    --shadow-floating-medium: 0px 4px 32px -4px #6e768117, 0px 8px 16px -4px #6e768117, 0px 24px 48px -12px #6e768129, 0px 48px 96px -24px #6e76813d;
-    --shadow-floating-large: 0px 8px 24px 0px #010409;
-    --shadow-floating-xlarge: 0px 12px 48px 0px #010409;
+    --shadow-inset: inset 0px 1px 0px 0px #0104093d;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff1f;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+    --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
+    --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
+    --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
+    --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
+    --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
+    --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
     --outline-focus: #1f6feb solid 2px;
   }
 }

package/tokens-next-private/scss/functional/themes/dark.scss

@@ -187,21 +187,35 @@
     --fgColor-default: #e6edf3;
     --fgColor-muted: #7d8590;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #0d1117;
     --fgColor-disabled: #8b949e;
     --fgColor-link: #2f81f7;
+    --fgColor-link-onInverse: #1f6feb;
+    --fgColor-neutral: #6e7681;
+    --fgColor-neutral-onInverse: #484f58;
     --fgColor-accent: #2f81f7;
+    --fgColor-accent-onInverse: #1f6feb;
     --fgColor-success: #3fb950;
+    --fgColor-success-onInverse: #238636;
     --fgColor-attention: #d29922;
+    --fgColor-attention-onInverse: #9e6a03;
     --fgColor-severe: #db6d28;
+    --fgColor-severe-onInverse: #bd561d;
     --fgColor-danger: #f85149;
+    --fgColor-danger-onInverse: #db3734;
     --fgColor-open: #3fb950;
+    --fgColor-open-onInverse: #238636;
     --fgColor-closed: #f85149;
+    --fgColor-closed-onInverse: #db3734;
     --fgColor-done: #a371f7;
+    --fgColor-done-onInverse: #8957e5;
     --fgColor-sponsors: #db61a2;
+    --fgColor-sponsors-onInverse: #bf4b8a;
     --bgColor-default: #0d1117;
     --bgColor-muted: #161b22;
     --bgColor-inset: #010409;
     --bgColor-emphasis: #6e7681;
+    --bgColor-inverse: #ffffff;
     --bgColor-disabled: #161b22;
     --bgColor-transparent: #00000000;
     --bgColor-neutral-muted: #6e768126;
@@ -389,15 +403,15 @@
     --color-scale-coral-7: #872012; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #640d04; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #460701; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: 0px 0px 0px 0px #000000;
-    --shadow-highlight: 0px 0px 0px 0px #000000;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #010409a3;
-    --shadow-resting-small: 0px 0px 0px 0px #000000;
-    --shadow-resting-medium: 0px 3px 6px 0px #010409;
-    --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 16px 32px 0px #010409d9;
-    --shadow-floating-medium: 0px 4px 32px -4px #6e768117, 0px 8px 16px -4px #6e768117, 0px 24px 48px -12px #6e768129, 0px 48px 96px -24px #6e76813d;
-    --shadow-floating-large: 0px 8px 24px 0px #010409;
-    --shadow-floating-xlarge: 0px 12px 48px 0px #010409;
+    --shadow-inset: inset 0px 1px 0px 0px #0104093d;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff1f;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+    --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
+    --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
+    --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
+    --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
+    --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
+    --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
     --outline-focus: #1f6feb solid 2px;
   }
 }

package/tokens-next-private/scss/functional/themes/light-colorblind.scss

@@ -188,21 +188,35 @@
     --fgColor-default: #1f2328;
     --fgColor-muted: #636c76;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #f6f8fa;
     --fgColor-disabled: #8c959f;
     --fgColor-link: #0969da;
+    --fgColor-link-onInverse: #54aeff;
+    --fgColor-neutral: #6e7781;
+    --fgColor-neutral-onInverse: #8c959f;
     --fgColor-accent: #0969da;
+    --fgColor-accent-onInverse: #54aeff;
     --fgColor-success: #0969da;
+    --fgColor-success-onInverse: #54aeff;
     --fgColor-attention: #9a6700;
+    --fgColor-attention-onInverse: #d4a72c;
     --fgColor-severe: #bc4c00;
+    --fgColor-severe-onInverse: #fb8f44;
     --fgColor-danger: #be4e02;
+    --fgColor-danger-onInverse: #fa4549;
     --fgColor-open: #bc4c00;
+    --fgColor-open-onInverse: #fb8f44;
     --fgColor-closed: #6e7781;
+    --fgColor-closed-onInverse: #afb8c1;
     --fgColor-done: #8250df;
+    --fgColor-done-onInverse: #a475f9;
     --fgColor-sponsors: #bf3989;
+    --fgColor-sponsors-onInverse: #e85aad;
     --bgColor-default: #ffffff;
     --bgColor-muted: #f6f8fa;
     --bgColor-inset: #f6f8fa;
     --bgColor-emphasis: #24292f;
+    --bgColor-inverse: #24292f;
     --bgColor-disabled: #f6f8fa;
     --bgColor-transparent: #ffffff00;
     --bgColor-neutral-muted: #eaeef280;
@@ -390,14 +404,14 @@
     --color-scale-coral-7: #801f0f; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #691105; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #510901; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: inset 0px 1px 0px 0px #1f23280d;
-    --shadow-highlight: inset 0px 1px 0px 0px #ffffff40;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23280f;
-    --shadow-resting-small: 0px 1px 0px 0px #1f23280a;
-    --shadow-resting-medium: 0px 3px 6px 0px #8c959f26;
-    --shadow-floating-small: 0px 1px 3px 0px #1f23281f, 0px 8px 24px 0px #424a531f;
-    --shadow-floating-medium: 0px 4px 32px -4px #8c959f17, 0px 8px 16px -4px #8c959f17, 0px 24px 48px -12px #8c959f29, 0px 48px 96px -24px #8c959f3d;
-    --shadow-floating-large: 0px 8px 24px 0px #8c959f33;
-    --shadow-floating-xlarge: 0px 12px 28px 0px #8c959f4d;
+    --shadow-inset: inset 0px 1px 0px 0px #1f232814;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff3d;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
+    --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
+    --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
+    --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
+    --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
+    --shadow-floating-large: 0px 40px 80px 0px #424a533d;
+    --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
   }
 }

package/tokens-next-private/scss/functional/themes/light-high-contrast.scss

@@ -126,8 +126,8 @@
     --button-invisible-fgColor-hover: #023b95;
     --button-invisible-fgColor-disabled: #4b535d;
     --button-invisible-bgColor-rest: #ffffff00;
-    --button-invisible-bgColor-hover: #e7ecf0;
-    --button-invisible-bgColor-active: #ced5dc;
+    --button-invisible-bgColor-hover: #20252c;
+    --button-invisible-bgColor-active: #4b535d;
     --button-invisible-bgColor-disabled: #e7ecf0;
     --button-invisible-borderColor-rest: #ffffff00;
     --button-invisible-borderColor-hover: #20252c;
@@ -188,21 +188,35 @@
     --fgColor-default: #010409;
     --fgColor-muted: #0e1116;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #ffffff;
     --fgColor-disabled: #4b535d;
     --fgColor-link: #023b95;
+    --fgColor-link-onInverse: #67b3fd;
+    --fgColor-neutral: #66707b;
+    --fgColor-neutral-onInverse: #ced5dc;
     --fgColor-accent: #023b95;
+    --fgColor-accent-onInverse: #67b3fd;
     --fgColor-success: #055d20;
+    --fgColor-success-onInverse: #43c663;
     --fgColor-attention: #744500;
+    --fgColor-attention-onInverse: #d5a824;
     --fgColor-severe: #873800;
+    --fgColor-severe-onInverse: #f99636;
     --fgColor-danger: #8a071e;
+    --fgColor-danger-onInverse: #ff8e8a;
     --fgColor-open: #055d20;
+    --fgColor-open-onInverse: #43c663;
     --fgColor-closed: #8a071e;
+    --fgColor-closed-onInverse: #ff8e8a;
     --fgColor-done: #622cbc;
+    --fgColor-done-onInverse: #c49bff;
     --fgColor-sponsors: #971368;
+    --fgColor-sponsors-onInverse: #fc87ca;
     --bgColor-default: #ffffff;
     --bgColor-muted: #e7ecf0;
     --bgColor-inset: #ffffff;
     --bgColor-emphasis: #0e1116;
+    --bgColor-inverse: #0e1116;
     --bgColor-disabled: #e7ecf0;
     --bgColor-transparent: #ffffff00;
     --bgColor-neutral-muted: #e7ecf0;
@@ -390,14 +404,14 @@
     --color-scale-coral-7: #6f0107; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #5b0002; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #430200; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: inset 0px 1px 0px 0px #0104090d;
-    --shadow-highlight: inset 0px 1px 0px 0px #ffffff40;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #0104090f;
-    --shadow-resting-small: 0px 1px 0px 0px #0104090a;
-    --shadow-resting-medium: 0px 3px 6px 0px #88929d26;
-    --shadow-floating-small: 0px 1px 3px 0px #0104091f, 0px 8px 24px 0px #343b431f;
-    --shadow-floating-medium: 0px 4px 32px -4px #88929d17, 0px 8px 16px -4px #88929d17, 0px 24px 48px -12px #88929d29, 0px 48px 96px -24px #88929d3d;
-    --shadow-floating-large: 0px 8px 24px 0px #88929d33;
-    --shadow-floating-xlarge: 0px 12px 28px 0px #88929d4d;
+    --shadow-inset: inset 0px 1px 0px 0px #01040914;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff3d;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #0104091a;
+    --shadow-resting-small: 0px 1px 0px 0px #0104090f, 0px 1px 3px 0px #01040914;
+    --shadow-resting-medium: 0px 3px 6px 0px #343b431f;
+    --shadow-floating-small: 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
+    --shadow-floating-medium: 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
+    --shadow-floating-large: 0px 40px 80px 0px #343b433d;
+    --shadow-floating-xlarge: 0px 56px 112px 0px #343b4352;
   }
 }

package/tokens-next-private/scss/functional/themes/light-tritanopia.scss

@@ -188,21 +188,35 @@
     --fgColor-default: #1f2328;
     --fgColor-muted: #636c76;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #f6f8fa;
     --fgColor-disabled: #8c959f;
     --fgColor-link: #0969da;
+    --fgColor-link-onInverse: #54aeff;
+    --fgColor-neutral: #6e7781;
+    --fgColor-neutral-onInverse: #8c959f;
     --fgColor-accent: #0969da;
+    --fgColor-accent-onInverse: #54aeff;
     --fgColor-success: #0969da;
+    --fgColor-success-onInverse: #54aeff;
     --fgColor-attention: #9a6700;
+    --fgColor-attention-onInverse: #d4a72c;
     --fgColor-severe: #cf222e;
+    --fgColor-severe-onInverse: #ff8182;
     --fgColor-danger: #d1242f;
+    --fgColor-danger-onInverse: #fa4549;
     --fgColor-open: #cf222e;
+    --fgColor-open-onInverse: #fa4549;
     --fgColor-closed: #6e7781;
+    --fgColor-closed-onInverse: #afb8c1;
     --fgColor-done: #8250df;
+    --fgColor-done-onInverse: #a475f9;
     --fgColor-sponsors: #bf3989;
+    --fgColor-sponsors-onInverse: #e85aad;
     --bgColor-default: #ffffff;
     --bgColor-muted: #f6f8fa;
     --bgColor-inset: #f6f8fa;
     --bgColor-emphasis: #24292f;
+    --bgColor-inverse: #24292f;
     --bgColor-disabled: #f6f8fa;
     --bgColor-transparent: #ffffff00;
     --bgColor-neutral-muted: #eaeef280;
@@ -390,14 +404,14 @@
     --color-scale-coral-7: #801f0f; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #691105; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #510901; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: inset 0px 1px 0px 0px #1f23280d;
-    --shadow-highlight: inset 0px 1px 0px 0px #ffffff40;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23280f;
-    --shadow-resting-small: 0px 1px 0px 0px #1f23280a;
-    --shadow-resting-medium: 0px 3px 6px 0px #8c959f26;
-    --shadow-floating-small: 0px 1px 3px 0px #1f23281f, 0px 8px 24px 0px #424a531f;
-    --shadow-floating-medium: 0px 4px 32px -4px #8c959f17, 0px 8px 16px -4px #8c959f17, 0px 24px 48px -12px #8c959f29, 0px 48px 96px -24px #8c959f3d;
-    --shadow-floating-large: 0px 8px 24px 0px #8c959f33;
-    --shadow-floating-xlarge: 0px 12px 28px 0px #8c959f4d;
+    --shadow-inset: inset 0px 1px 0px 0px #1f232814;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff3d;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
+    --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
+    --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
+    --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
+    --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
+    --shadow-floating-large: 0px 40px 80px 0px #424a533d;
+    --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
   }
 }

package/tokens-next-private/scss/functional/themes/light.scss

@@ -58,7 +58,7 @@
     --control-borderColor-emphasis: #868f99;
     --control-borderColor-disabled: #f6f8fa;
     --control-borderColor-selected: #f6f8fa;
-    --control-borderColor-success: #2da44e;
+    --control-borderColor-success: #1a7f37;
     --control-borderColor-danger: #cf222e;
     --control-borderColor-warning: #bf8700;
     --control-iconColor-rest: #636c76;
@@ -188,21 +188,35 @@
     --fgColor-default: #1f2328;
     --fgColor-muted: #636c76;
     --fgColor-onEmphasis: #ffffff;
+    --fgColor-onInverse: #f6f8fa;
     --fgColor-disabled: #8c959f;
     --fgColor-link: #0969da;
+    --fgColor-link-onInverse: #54aeff;
+    --fgColor-neutral: #6e7781;
+    --fgColor-neutral-onInverse: #8c959f;
     --fgColor-accent: #0969da;
+    --fgColor-accent-onInverse: #54aeff;
     --fgColor-success: #1a7f37;
+    --fgColor-success-onInverse: #4ac26b;
     --fgColor-attention: #9a6700;
+    --fgColor-attention-onInverse: #d4a72c;
     --fgColor-severe: #bc4c00;
+    --fgColor-severe-onInverse: #fb8f44;
     --fgColor-danger: #d1242f;
+    --fgColor-danger-onInverse: #fa4549;
     --fgColor-open: #1a7f37;
+    --fgColor-open-onInverse: #4ac26b;
     --fgColor-closed: #d1242f;
+    --fgColor-closed-onInverse: #fa4549;
     --fgColor-done: #8250df;
+    --fgColor-done-onInverse: #a475f9;
     --fgColor-sponsors: #bf3989;
+    --fgColor-sponsors-onInverse: #e85aad;
     --bgColor-default: #ffffff;
     --bgColor-muted: #f6f8fa;
     --bgColor-inset: #f6f8fa;
     --bgColor-emphasis: #24292f;
+    --bgColor-inverse: #24292f;
     --bgColor-disabled: #f6f8fa;
     --bgColor-transparent: #ffffff00;
     --bgColor-neutral-muted: #eaeef280;
@@ -235,7 +249,7 @@
     --borderColor-accent-muted: #54aeff66;
     --borderColor-accent-emphasis: #0969da;
     --borderColor-success-muted: #4ac26b66;
-    --borderColor-success-emphasis: #2da44e;
+    --borderColor-success-emphasis: #1a7f37;
     --borderColor-attention-muted: #d4a72c66;
     --borderColor-attention-emphasis: #bf8700;
     --borderColor-severe-muted: #fb8f4466;
@@ -243,7 +257,7 @@
     --borderColor-danger-muted: #ff818266;
     --borderColor-danger-emphasis: #cf222e;
     --borderColor-open-muted: #4ac26b66;
-    --borderColor-open-emphasis: #2da44e;
+    --borderColor-open-emphasis: #1a7f37;
     --borderColor-closed-muted: #ff818266;
     --borderColor-closed-emphasis: #cf222e;
     --borderColor-done-muted: #c297ff66;
@@ -390,14 +404,14 @@
     --color-scale-coral-7: #801f0f; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-8: #691105; /* Avoid using scales, use other functional tokens instead */
     --color-scale-coral-9: #510901; /* Avoid using scales, use other functional tokens instead */
-    --shadow-inset: inset 0px 1px 0px 0px #1f23280d;
-    --shadow-highlight: inset 0px 1px 0px 0px #ffffff40;
-    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23280f;
-    --shadow-resting-small: 0px 1px 0px 0px #1f23280a;
-    --shadow-resting-medium: 0px 3px 6px 0px #8c959f26;
-    --shadow-floating-small: 0px 1px 3px 0px #1f23281f, 0px 8px 24px 0px #424a531f;
-    --shadow-floating-medium: 0px 4px 32px -4px #8c959f17, 0px 8px 16px -4px #8c959f17, 0px 24px 48px -12px #8c959f29, 0px 48px 96px -24px #8c959f3d;
-    --shadow-floating-large: 0px 8px 24px 0px #8c959f33;
-    --shadow-floating-xlarge: 0px 12px 28px 0px #8c959f4d;
+    --shadow-inset: inset 0px 1px 0px 0px #1f232814;
+    --shadow-highlight: inset 0px 1px 0px 0px #ffffff3d;
+    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
+    --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
+    --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
+    --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
+    --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
+    --shadow-floating-large: 0px 40px 80px 0px #424a533d;
+    --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
   }
 }

package/tokens-v2-private/css/tokens/base/size/size.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 14 Aug 2023 17:34:59 GMT
+ * Generated on Tue, 12 Sep 2023 21:23:35 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/base/typography/typography.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 14 Aug 2023 17:34:58 GMT
+ * Generated on Tue, 12 Sep 2023 21:23:35 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/functional/size/border.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 14 Aug 2023 17:34:58 GMT
+ * Generated on Tue, 12 Sep 2023 21:23:35 GMT
  */
 
 :root {