@primer/primitives 11.1.0-rc.f0583fc7 → 11.2.0-rc.1012e204

package/dist/figma/themes/light.json

@@ -1372,6 +1372,44 @@
       "web": "var(--bgColor-closed-emphasis) /* utility class: .color-bg-closed-emphasis */"
     }
   },
+  {
+    "name": "bgColor/draft-muted",
+    "value": {
+      "r": 0.5058823529411764,
+      "g": 0.5450980392156862,
+      "b": 0.596078431372549,
+      "a": 0.12
+    },
+    "type": "COLOR",
+    "refId": "mode/bgColor/draft-muted",
+    "reference": "mode/bgColor/neutral-muted",
+    "collection": "mode",
+    "mode": "light",
+    "group": "semantic",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"],
+    "codeSyntax": {
+      "web": "var(--bgColor-draft-muted)"
+    }
+  },
+  {
+    "name": "bgColor/draft-emphasis",
+    "value": {
+      "r": 0.34901960784313724,
+      "g": 0.38823529411764707,
+      "b": 0.43137254901960786,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/bgColor/draft-emphasis",
+    "reference": "mode/bgColor/neutral-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "semantic",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"],
+    "codeSyntax": {
+      "web": "var(--bgColor-draft-emphasis)"
+    }
+  },
   {
     "name": "bgColor/done-muted",
     "value": {
@@ -1894,6 +1932,44 @@
       "web": "var(--borderColor-closed-emphasis) /* utility class: .color-border-closed-emphasis */"
     }
   },
+  {
+    "name": "borderColor/draft-muted",
+    "value": {
+      "r": 0.8196078431372549,
+      "g": 0.8509803921568627,
+      "b": 0.8784313725490196,
+      "a": 0.7
+    },
+    "type": "COLOR",
+    "refId": "mode/borderColor/draft-muted",
+    "reference": "mode/borderColor/neutral-muted",
+    "collection": "mode",
+    "mode": "light",
+    "group": "semantic",
+    "scopes": ["STROKE_COLOR"],
+    "codeSyntax": {
+      "web": "var(--borderColor-draft-muted) */"
+    }
+  },
+  {
+    "name": "borderColor/draft-emphasis",
+    "value": {
+      "r": 0.34901960784313724,
+      "g": 0.38823529411764707,
+      "b": 0.43137254901960786,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/borderColor/draft-emphasis",
+    "reference": "mode/borderColor/neutral-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "semantic",
+    "scopes": ["STROKE_COLOR"],
+    "codeSyntax": {
+      "web": "var(--borderColor-draft-emphasis)"
+    }
+  },
   {
     "name": "borderColor/done-muted",
     "value": {
@@ -8236,6 +8312,25 @@
       "web": "var(--fgColor-closed) /* utility class: .color-fg-closed */"
     }
   },
+  {
+    "name": "fgColor/draft",
+    "value": {
+      "r": 0.34901960784313724,
+      "g": 0.38823529411764707,
+      "b": 0.43137254901960786,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/fgColor/draft",
+    "reference": "mode/fgColor/neutral",
+    "collection": "mode",
+    "mode": "light",
+    "group": "semantic",
+    "scopes": ["TEXT_FILL", "SHAPE_FILL"],
+    "codeSyntax": {
+      "web": "var(--fgColor-draft)"
+    }
+  },
   {
     "name": "fgColor/done",
     "value": {
@@ -13898,6 +13993,166 @@
     "group": "component",
     "scopes": ["FRAME_FILL", "SHAPE_FILL"]
   },
+  {
+    "name": "progressBar/track/bgColor",
+    "value": {
+      "r": 0.8196078431372549,
+      "g": 0.8509803921568627,
+      "b": 0.8784313725490196,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/track/bgColor",
+    "reference": "mode/borderColor/default",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/track/borderColor",
+    "value": {
+      "r": 1,
+      "g": 1,
+      "b": 1,
+      "a": 0
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/track/borderColor",
+    "reference": "base/color/light/base/color/transparent",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["STROKE_COLOR"]
+  },
+  {
+    "name": "progressBar/bgColor/danger",
+    "value": {
+      "r": 0.8117647058823529,
+      "g": 0.13333333333333333,
+      "b": 0.1803921568627451,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/danger",
+    "reference": "mode/bgColor/danger-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/severe",
+    "value": {
+      "r": 0.7372549019607844,
+      "g": 0.2980392156862745,
+      "b": 0,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/severe",
+    "reference": "mode/bgColor/severe-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/sponsors",
+    "value": {
+      "r": 0.7490196078431373,
+      "g": 0.2235294117647059,
+      "b": 0.5372549019607843,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/sponsors",
+    "reference": "mode/bgColor/sponsors-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/done",
+    "value": {
+      "r": 0.5098039215686274,
+      "g": 0.3137254901960784,
+      "b": 0.8745098039215686,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/done",
+    "reference": "mode/bgColor/done-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/accent",
+    "value": {
+      "r": 0.03529411764705882,
+      "g": 0.4117647058823529,
+      "b": 0.8549019607843137,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/accent",
+    "reference": "mode/bgColor/accent-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/success",
+    "value": {
+      "r": 0.12156862745098039,
+      "g": 0.5333333333333333,
+      "b": 0.23921568627450981,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/success",
+    "reference": "mode/bgColor/success-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/neutral",
+    "value": {
+      "r": 0.34901960784313724,
+      "g": 0.38823529411764707,
+      "b": 0.43137254901960786,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/neutral",
+    "reference": "mode/bgColor/neutral-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
+  {
+    "name": "progressBar/bgColor/attention",
+    "value": {
+      "r": 0.6039215686274509,
+      "g": 0.403921568627451,
+      "b": 0,
+      "a": 1
+    },
+    "type": "COLOR",
+    "refId": "mode/progressBar/bgColor/attention",
+    "reference": "mode/bgColor/attention-emphasis",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
   {
     "name": "reactionButton/selected/bgColor/rest",
     "value": {

package/dist/internalCss/dark-colorblind-high-contrast.css

@@ -930,6 +930,7 @@
   --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
   --menu-bgColor-active: var(--base-color-neutral-2);
   --overlay-backdrop-bgColor: #d1d7e066;
+  --progressBar-bgColor-neutral: var(--base-color-neutral-8);
   --reactionButton-selected-bgColor-rest: #5cacff33;
   --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
   --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -942,6 +943,8 @@
   --bgColor-closed-emphasis: var(--bgColor-neutral-emphasis);
   --bgColor-closed-muted: #2128301a;
   --bgColor-default: var(--base-color-neutral-0);
+  --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+  --bgColor-draft-muted: #2128301a;
   --bgColor-inset: var(--base-color-neutral-0);
   --bgColor-inverse: var(--base-color-neutral-13);
   --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
@@ -965,6 +968,7 @@
   --border-success-muted: 0.0625rem solid #5cacff;
   --border-transparent: 0.0625rem solid #00000000;
   --borderColor-closed-muted: var(--borderColor-default);
+  --borderColor-draft-muted: var(--borderColor-default);
   --borderColor-emphasis: var(--borderColor-default);
   --borderColor-muted: var(--borderColor-default);
   --borderColor-upsell-emphasis: var(--borderColor-done-emphasis);
@@ -1041,6 +1045,7 @@
   --fgColor-black: var(--base-color-neutral-0);
   --fgColor-closed: var(--fgColor-muted);
   --fgColor-default: var(--base-color-neutral-13);
+  --fgColor-draft: var(--fgColor-neutral);
   --fgColor-onEmphasis: var(--base-color-neutral-13);
   --fgColor-onInverse: var(--base-color-neutral-0);
   --fgColor-white: var(--base-color-neutral-13);
@@ -1067,6 +1072,13 @@
   --label-yellow-borderColor: var(--label-yellow-fgColor-rest);
   --overlay-bgColor: var(--base-color-neutral-0);
   --overlay-borderColor: var(--borderColor-default);
+  --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+  --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+  --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+  --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+  --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+  --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+  --progressBar-bgColor-success: var(--bgColor-success-emphasis);
   --reactionButton-selected-fgColor-rest: var(--fgColor-link);
   --selectMenu-borderColor: var(--borderColor-default);
   --selection-bgColor: #194fb1b3;
@@ -1131,6 +1143,7 @@
   --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
   --focus-outline: 2px solid #409eff;
   --page-header-bgColor: var(--bgColor-default);
+  --progressBar-track-bgColor: var(--bgColor-inverse);
   --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409;
   --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
   --shadow-floating-small: 0px 0px 0px 1px #b7bdc8, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
@@ -1139,6 +1152,7 @@
   --tooltip-fgColor: var(--fgColor-onInverse);
   --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
   --border-neutral-muted: 0.0625rem solid #b7bdc8;
+  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
   --button-default-borderColor-active: var(--button-default-borderColor-rest);
   --button-default-borderColor-hover: var(--button-default-borderColor-rest);
   --button-default-fgColor-rest: var(--control-fgColor-rest);
@@ -1146,6 +1160,7 @@
   --button-invisible-fgColor-hover: var(--control-fgColor-rest);
   --button-invisible-fgColor-rest: var(--control-fgColor-rest);
   --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
   --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
   --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
   --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
@@ -2081,6 +2096,7 @@
     --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
     --menu-bgColor-active: var(--base-color-neutral-2);
     --overlay-backdrop-bgColor: #d1d7e066;
+    --progressBar-bgColor-neutral: var(--base-color-neutral-8);
     --reactionButton-selected-bgColor-rest: #5cacff33;
     --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
     --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -2093,6 +2109,8 @@
     --bgColor-closed-emphasis: var(--bgColor-neutral-emphasis);
     --bgColor-closed-muted: #2128301a;
     --bgColor-default: var(--base-color-neutral-0);
+    --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+    --bgColor-draft-muted: #2128301a;
     --bgColor-inset: var(--base-color-neutral-0);
     --bgColor-inverse: var(--base-color-neutral-13);
     --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
@@ -2116,6 +2134,7 @@
     --border-success-muted: 0.0625rem solid #5cacff;
     --border-transparent: 0.0625rem solid #00000000;
     --borderColor-closed-muted: var(--borderColor-default);
+    --borderColor-draft-muted: var(--borderColor-default);
     --borderColor-emphasis: var(--borderColor-default);
     --borderColor-muted: var(--borderColor-default);
     --borderColor-upsell-emphasis: var(--borderColor-done-emphasis);
@@ -2192,6 +2211,7 @@
     --fgColor-black: var(--base-color-neutral-0);
     --fgColor-closed: var(--fgColor-muted);
     --fgColor-default: var(--base-color-neutral-13);
+    --fgColor-draft: var(--fgColor-neutral);
     --fgColor-onEmphasis: var(--base-color-neutral-13);
     --fgColor-onInverse: var(--base-color-neutral-0);
     --fgColor-white: var(--base-color-neutral-13);
@@ -2218,6 +2238,13 @@
     --label-yellow-borderColor: var(--label-yellow-fgColor-rest);
     --overlay-bgColor: var(--base-color-neutral-0);
     --overlay-borderColor: var(--borderColor-default);
+    --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+    --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+    --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+    --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+    --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+    --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+    --progressBar-bgColor-success: var(--bgColor-success-emphasis);
     --reactionButton-selected-fgColor-rest: var(--fgColor-link);
     --selectMenu-borderColor: var(--borderColor-default);
     --selection-bgColor: #194fb1b3;
@@ -2282,6 +2309,7 @@
     --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
     --focus-outline: 2px solid #409eff;
     --page-header-bgColor: var(--bgColor-default);
+    --progressBar-track-bgColor: var(--bgColor-inverse);
     --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409;
     --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
     --shadow-floating-small: 0px 0px 0px 1px #b7bdc8, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
@@ -2290,6 +2318,7 @@
     --tooltip-fgColor: var(--fgColor-onInverse);
     --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
     --border-neutral-muted: 0.0625rem solid #b7bdc8;
+    --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
     --button-default-borderColor-active: var(--button-default-borderColor-rest);
     --button-default-borderColor-hover: var(--button-default-borderColor-rest);
     --button-default-fgColor-rest: var(--control-fgColor-rest);
@@ -2297,6 +2326,7 @@
     --button-invisible-fgColor-hover: var(--control-fgColor-rest);
     --button-invisible-fgColor-rest: var(--control-fgColor-rest);
     --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+    --progressBar-track-borderColor: var(--progressBar-track-bgColor);
     --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
     --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
     --button-outline-borderColor-active: var(--button-outline-borderColor-hover);

package/dist/internalCss/dark-colorblind.css

@@ -949,6 +949,7 @@
   --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
   --menu-bgColor-active: var(--base-color-neutral-2);
   --overlay-backdrop-bgColor: #21283066;
+  --progressBar-track-borderColor: var(--base-color-transparent);
   --reactionButton-selected-bgColor-rest: #388bfd33;
   --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
   --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -961,6 +962,8 @@
   --bgColor-black: var(--base-color-neutral-0);
   --bgColor-closed-emphasis: var(--bgColor-neutral-emphasis);
   --bgColor-closed-muted: #656c761a;
+  --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+  --bgColor-draft-muted: #656c761a;
   --bgColor-inset: var(--base-color-neutral-0);
   --bgColor-inverse: var(--base-color-neutral-13);
   --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
@@ -986,6 +989,7 @@
   --border-transparent: 0.0625rem solid #00000000;
   --borderColor-closed-emphasis: var(--borderColor-emphasis);
   --borderColor-closed-muted: #3d444d66;
+  --borderColor-draft-muted: #3d444d66;
   --borderColor-muted: #3d444db3;
   --borderColor-neutral-emphasis: var(--borderColor-emphasis);
   --borderColor-translucent: #ffffff26;
@@ -1077,6 +1081,7 @@
   --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
   --fgColor-black: var(--base-color-neutral-0);
   --fgColor-closed: var(--fgColor-muted);
+  --fgColor-draft: var(--fgColor-neutral);
   --fgColor-onEmphasis: var(--base-color-neutral-13);
   --fgColor-onInverse: var(--base-color-neutral-0);
   --fgColor-upsell: var(--fgColor-done);
@@ -1085,6 +1090,15 @@
   --header-fgColor-default: #ffffffb3;
   --overlay-bgColor: var(--base-color-neutral-0);
   --page-header-bgColor: var(--bgColor-default);
+  --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+  --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+  --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+  --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+  --progressBar-bgColor-neutral: var(--bgColor-neutral-emphasis);
+  --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+  --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+  --progressBar-bgColor-success: var(--bgColor-success-emphasis);
+  --progressBar-track-bgColor: var(--borderColor-default);
   --reactionButton-selected-fgColor-rest: var(--fgColor-link);
   --selectMenu-borderColor: var(--borderColor-default);
   --selection-bgColor: #1f6febb3;
@@ -1105,6 +1119,7 @@
   --border-open-muted: var(--border-success-muted);
   --border-upsell-emphasis: 0.0625rem solid #8957e5;
   --border-upsell-muted: 0.0625rem solid #ab7df866;
+  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
   --borderColor-neutral-muted: var(--borderColor-muted);
   --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
   --button-danger-borderColor-rest: var(--control-borderColor-rest);
@@ -2100,6 +2115,7 @@
     --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
     --menu-bgColor-active: var(--base-color-neutral-2);
     --overlay-backdrop-bgColor: #21283066;
+    --progressBar-track-borderColor: var(--base-color-transparent);
     --reactionButton-selected-bgColor-rest: #388bfd33;
     --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
     --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -2112,6 +2128,8 @@
     --bgColor-black: var(--base-color-neutral-0);
     --bgColor-closed-emphasis: var(--bgColor-neutral-emphasis);
     --bgColor-closed-muted: #656c761a;
+    --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+    --bgColor-draft-muted: #656c761a;
     --bgColor-inset: var(--base-color-neutral-0);
     --bgColor-inverse: var(--base-color-neutral-13);
     --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
@@ -2137,6 +2155,7 @@
     --border-transparent: 0.0625rem solid #00000000;
     --borderColor-closed-emphasis: var(--borderColor-emphasis);
     --borderColor-closed-muted: #3d444d66;
+    --borderColor-draft-muted: #3d444d66;
     --borderColor-muted: #3d444db3;
     --borderColor-neutral-emphasis: var(--borderColor-emphasis);
     --borderColor-translucent: #ffffff26;
@@ -2228,6 +2247,7 @@
     --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
     --fgColor-black: var(--base-color-neutral-0);
     --fgColor-closed: var(--fgColor-muted);
+    --fgColor-draft: var(--fgColor-neutral);
     --fgColor-onEmphasis: var(--base-color-neutral-13);
     --fgColor-onInverse: var(--base-color-neutral-0);
     --fgColor-upsell: var(--fgColor-done);
@@ -2236,6 +2256,15 @@
     --header-fgColor-default: #ffffffb3;
     --overlay-bgColor: var(--base-color-neutral-0);
     --page-header-bgColor: var(--bgColor-default);
+    --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+    --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+    --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+    --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+    --progressBar-bgColor-neutral: var(--bgColor-neutral-emphasis);
+    --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+    --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+    --progressBar-bgColor-success: var(--bgColor-success-emphasis);
+    --progressBar-track-bgColor: var(--borderColor-default);
     --reactionButton-selected-fgColor-rest: var(--fgColor-link);
     --selectMenu-borderColor: var(--borderColor-default);
     --selection-bgColor: #1f6febb3;
@@ -2256,6 +2285,7 @@
     --border-open-muted: var(--border-success-muted);
     --border-upsell-emphasis: 0.0625rem solid #8957e5;
     --border-upsell-muted: 0.0625rem solid #ab7df866;
+    --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
     --borderColor-neutral-muted: var(--borderColor-muted);
     --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
     --button-danger-borderColor-rest: var(--control-borderColor-rest);

package/dist/internalCss/dark-dimmed-high-contrast.css

@@ -935,6 +935,7 @@
   --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
   --menu-bgColor-active: var(--base-color-neutral-2);
   --overlay-backdrop-bgColor: #9198a166;
+  --progressBar-bgColor-neutral: var(--base-color-neutral-8);
   --reactionButton-selected-bgColor-rest: #4184e433;
   --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
   --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -946,6 +947,8 @@
   --bgColor-black: var(--base-color-neutral-0);
   --bgColor-closed-emphasis: var(--bgColor-danger-emphasis);
   --bgColor-closed-muted: var(--bgColor-danger-muted);
+  --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+  --bgColor-draft-muted: var(--bgColor-neutral-muted);
   --bgColor-inverse: var(--base-color-neutral-13);
   --bgColor-open-emphasis: var(--bgColor-success-emphasis);
   --bgColor-open-muted: var(--bgColor-success-muted);
@@ -1064,6 +1067,7 @@
   --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
   --fgColor-black: var(--base-color-neutral-0);
   --fgColor-closed: var(--fgColor-danger);
+  --fgColor-draft: var(--fgColor-neutral);
   --fgColor-link: var(--fgColor-accent);
   --fgColor-onInverse: var(--base-color-neutral-0);
   --fgColor-open: var(--fgColor-success);
@@ -1093,6 +1097,13 @@
   --overlay-bgColor: var(--base-color-neutral-0);
   --overlay-borderColor: var(--borderColor-default);
   --page-header-bgColor: var(--bgColor-default);
+  --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+  --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+  --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+  --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+  --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+  --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+  --progressBar-bgColor-success: var(--bgColor-success-emphasis);
   --selectMenu-borderColor: var(--borderColor-default);
   --selection-bgColor: #1b4b91b3;
   --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
@@ -1134,6 +1145,7 @@
   --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
   --controlTrack-borderColor-rest: var(--borderColor-emphasis);
   --focus-outline: 2px solid #6cb6ff;
+  --progressBar-track-bgColor: var(--bgColor-inverse);
   --reactionButton-selected-fgColor-rest: var(--fgColor-link);
   --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409;
   --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
@@ -1143,9 +1155,12 @@
   --tooltip-fgColor: var(--fgColor-onInverse);
   --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
   --border-neutral-muted: 0.0625rem solid #b7bdc8;
+  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
+  --borderColor-draft-muted: var(--borderColor-neutral-muted);
   --button-default-borderColor-active: var(--button-default-borderColor-rest);
   --button-default-borderColor-hover: var(--button-default-borderColor-rest);
   --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+  --progressBar-track-borderColor: var(--progressBar-track-bgColor);
   --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
   --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
   --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
@@ -2086,6 +2101,7 @@
     --label-yellow-fgColor-rest: var(--base-display-color-yellow-6);
     --menu-bgColor-active: var(--base-color-neutral-2);
     --overlay-backdrop-bgColor: #9198a166;
+    --progressBar-bgColor-neutral: var(--base-color-neutral-8);
     --reactionButton-selected-bgColor-rest: #4184e433;
     --reactionButton-selected-fgColor-hover: var(--base-color-blue-2);
     --selectMenu-bgColor-active: var(--base-color-blue-8);
@@ -2097,6 +2113,8 @@
     --bgColor-black: var(--base-color-neutral-0);
     --bgColor-closed-emphasis: var(--bgColor-danger-emphasis);
     --bgColor-closed-muted: var(--bgColor-danger-muted);
+    --bgColor-draft-emphasis: var(--bgColor-neutral-emphasis);
+    --bgColor-draft-muted: var(--bgColor-neutral-muted);
     --bgColor-inverse: var(--base-color-neutral-13);
     --bgColor-open-emphasis: var(--bgColor-success-emphasis);
     --bgColor-open-muted: var(--bgColor-success-muted);
@@ -2215,6 +2233,7 @@
     --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
     --fgColor-black: var(--base-color-neutral-0);
     --fgColor-closed: var(--fgColor-danger);
+    --fgColor-draft: var(--fgColor-neutral);
     --fgColor-link: var(--fgColor-accent);
     --fgColor-onInverse: var(--base-color-neutral-0);
     --fgColor-open: var(--fgColor-success);
@@ -2244,6 +2263,13 @@
     --overlay-bgColor: var(--base-color-neutral-0);
     --overlay-borderColor: var(--borderColor-default);
     --page-header-bgColor: var(--bgColor-default);
+    --progressBar-bgColor-accent: var(--bgColor-accent-emphasis);
+    --progressBar-bgColor-attention: var(--bgColor-attention-emphasis);
+    --progressBar-bgColor-danger: var(--bgColor-danger-emphasis);
+    --progressBar-bgColor-done: var(--bgColor-done-emphasis);
+    --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
+    --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+    --progressBar-bgColor-success: var(--bgColor-success-emphasis);
     --selectMenu-borderColor: var(--borderColor-default);
     --selection-bgColor: #1b4b91b3;
     --shadow-floating-legacy: 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
@@ -2285,6 +2311,7 @@
     --controlKnob-borderColor-disabled: var(--control-bgColor-disabled);
     --controlTrack-borderColor-rest: var(--borderColor-emphasis);
     --focus-outline: 2px solid #6cb6ff;
+    --progressBar-track-bgColor: var(--bgColor-inverse);
     --reactionButton-selected-fgColor-rest: var(--fgColor-link);
     --shadow-floating-large: 0px 0px 0px 1px #b7bdc8, 0px 24px 48px 0px #010409;
     --shadow-floating-medium: 0px 0px 0px 1px #b7bdc8, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
@@ -2294,9 +2321,12 @@
     --tooltip-fgColor: var(--fgColor-onInverse);
     --border-neutral-emphasis: 0.0625rem solid #b7bdc8;
     --border-neutral-muted: 0.0625rem solid #b7bdc8;
+    --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis);
+    --borderColor-draft-muted: var(--borderColor-neutral-muted);
     --button-default-borderColor-active: var(--button-default-borderColor-rest);
     --button-default-borderColor-hover: var(--button-default-borderColor-rest);
     --controlKnob-borderColor-rest: var(--control-borderColor-emphasis);
+    --progressBar-track-borderColor: var(--progressBar-track-bgColor);
     --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
     --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
     --button-outline-borderColor-active: var(--button-outline-borderColor-hover);