@primer/primitives 9.1.2 → 10.0.0-rc.0c3e84bf

package/dist/build/utilities/toPascalCase.js

@@ -1,17 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.toPascalCase = void 0;
-const filterStringArray_1 = require("./filterStringArray");
-const upperCaseFirstCharacter_1 = require("./upperCaseFirstCharacter");
-const toPascalCase = (string) => {
+import { filterStringArray } from './filterStringArray.js';
+import { upperCaseFirstCharacter } from './upperCaseFirstCharacter.js';
+export const toPascalCase = (string) => {
     if (!Array.isArray(string)) {
         string = [string];
     }
-    return ((0, filterStringArray_1.filterStringArray)(string)
+    return (filterStringArray(string)
         // ucFirst all but first part
         .map((part) => {
-        return (0, upperCaseFirstCharacter_1.upperCaseFirstCharacter)(part);
+        return upperCaseFirstCharacter(part);
     })
         .join(''));
 };
-exports.toPascalCase = toPascalCase;

package/dist/build/utilities/treeWalker.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.treeWalker = void 0;
 /**
  * @description converts tokens to type and returns array with used type
  * @param tree object
@@ -8,7 +5,7 @@ exports.treeWalker = void 0;
  * @param validItem function to test if a node is a validItem to be transformed
  * @returns object
  */
-const treeWalker = (tree, callback, isValidItem) => {
+export const treeWalker = (tree, callback, isValidItem) => {
     // is a valid item -> pass through callback
     if (isValidItem(tree)) {
         return callback(tree);
@@ -20,8 +17,7 @@ const treeWalker = (tree, callback, isValidItem) => {
     // is obj -> continue
     const nextObj = {};
     for (const [prop, value] of Object.entries(tree)) {
-        nextObj[prop] = (0, exports.treeWalker)(value, callback, isValidItem);
+        nextObj[prop] = treeWalker(value, callback, isValidItem);
     }
     return nextObj;
 };
-exports.treeWalker = treeWalker;

package/dist/build/utilities/upperCaseFirstCharacter.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.upperCaseFirstCharacter = void 0;
 /**
  * upperCaseFirstCharacter
  * @scope custom implementation should only be used within `name path to ...` transformer
@@ -8,7 +5,6 @@ exports.upperCaseFirstCharacter = void 0;
  * @param string
  * @returns string
  */
-const upperCaseFirstCharacter = ([firstLetter, ...restOfWord]) => {
+export const upperCaseFirstCharacter = ([firstLetter, ...restOfWord]) => {
     return firstLetter.toUpperCase() + restOfWord.join('');
 };
-exports.upperCaseFirstCharacter = upperCaseFirstCharacter;

package/dist/css/base/motion/motion.css

@@ -0,0 +1,17 @@
+:root {
+  --base-easing-linear: cubic-bezier(0, 0, 1, 1); /* Ideal for non-movement properties, like opacity or background color. */
+  --base-easing-easeIn: cubic-bezier(0.7, 0.1, 0.75, 0.9); /* Ideal for movement that starts on the page and ends off the page. */
+  --base-easing-easeOut: cubic-bezier(0.16, 1, 0.3, 1); /* Ideal for movement that starts off the page and ends on the page. */
+  --base-easing-easeInOut: cubic-bezier(0.6, 0, 0.2, 1); /* Ideal for movement that starts and ends on the page. */
+  --base-duration-0: 0ms;
+  --base-duration-75: 75ms;
+  --base-duration-200: 200ms;
+  --base-duration-300: 300ms;
+  --base-duration-400: 400ms;
+  --base-duration-500: 500ms;
+  --base-duration-600: 600ms;
+  --base-duration-700: 700ms;
+  --base-duration-800: 800ms;
+  --base-duration-900: 900ms;
+  --base-duration-1000: 1s;
+}

package/dist/css/functional/motion/motion.css

@@ -1,5 +1,6 @@
 :root {
-  --motion-skeletonLoader-shimmer-duration-scale: 1s; /* The amount of times it takes the "shimmer" effect to go from the start (left) of the skeleton loader to the end (right) */
-  --motion-spinner-duration-rotation: 1s; /* The amount of time it takes the "Spinner" loading indicator to make a full 360deg rotation */
-  --motion-loading-delay-default: 1s; /* The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies. */
+  --motion-loading-delay-default: var(--base-duration-1000); /* The amount of time to wait before showing a loading indicator or announcing a loading state to assistive technologies. */
+  --motion-spinner-duration-rotation: var(--base-duration-1000); /* The amount of time it takes the "Spinner" loading indicator to make a full 360deg rotation */
+  --motion-spinner-easing-rotation: var(--base-easing-linear); /* The easing curve for the "Spinner" loading indicator rotation */
+  --motion-skeletonLoader-shimmer-duration-scale: var(--base-duration-1000); /* The amount of times it takes the "shimmer" effect to go from the start (left) of the skeleton loader to the end (right) */
 }

package/dist/css/functional/themes/dark-colorblind.css

@@ -5,17 +5,26 @@
   --topicTag-borderColor: #00000000;
   --highlight-neutral-bgColor: #d2992266;
   --page-header-bgColor: #0d1117;
-  --diffBlob-addition-fgColor-text: #f0f6fc;
-  --diffBlob-addition-fgColor-num: #f0f6fc;
-  --diffBlob-addition-bgColor-num: #58a6ff4d;
-  --diffBlob-addition-bgColor-line: #388bfd26;
-  --diffBlob-addition-bgColor-word: #388bfd66;
-  --diffBlob-deletion-fgColor-text: #f0f6fc;
-  --diffBlob-deletion-fgColor-num: #f0f6fc;
-  --diffBlob-deletion-bgColor-num: #db6d284d;
-  --diffBlob-deletion-bgColor-line: #db6d2826;
-  --diffBlob-deletion-bgColor-word: #db6d2866;
-  --diffBlob-hunk-bgColor-num: #388bfd66;
+  --diffBlob-additionLine-fgColor: #f0f6fc;
+  --diffBlob-additionLine-bgColor: #388bfd26;
+  --diffBlob-additionWord-fgColor: #f0f6fc;
+  --diffBlob-additionWord-bgColor: #388bfd66;
+  --diffBlob-additionNum-fgColor: #f0f6fc;
+  --diffBlob-additionNum-bgColor: #58a6ff4d;
+  --diffBlob-deletionLine-fgColor: #f0f6fc;
+  --diffBlob-deletionLine-bgColor: #db6d2826;
+  --diffBlob-deletionWord-fgColor: #f0f6fc;
+  --diffBlob-deletionWord-bgColor: #db6d2866;
+  --diffBlob-deletionNum-fgColor: #f0f6fc;
+  --diffBlob-deletionNum-bgColor: #db6d284d;
+  --diffBlob-hunkLine-fgColor: #9198a1;
+  --diffBlob-hunkLine-bgColor: #212830;
+  --diffBlob-hunkNum-fgColor-rest: #f0f6fc;
+  --diffBlob-hunkNum-fgColor-hover: #ffffff;
+  --diffBlob-hunkNum-bgColor-rest: #2f3742;
+  --diffBlob-hunkNum-bgColor-hover: #656c76;
+  --diffBlob-emptyNum-bgColor: #151b23;
+  --diffBlob-emptyLine-bgColor: #151b23;
   --diffBlob-expander-iconColor: #9198a1;
   --codeMirror-fgColor: #f0f6fc;
   --codeMirror-bgColor: #0d1117;
@@ -186,7 +195,7 @@
   --control-transparent-borderColor-rest: #00000000;
   --control-transparent-borderColor-hover: #00000000;
   --control-transparent-borderColor-active: #00000000;
-  --control-danger-fgColor-rest: #db6d28;
+  --control-danger-fgColor-rest: #f0883e;
   --control-danger-fgColor-hover: #f0883e;
   --control-danger-bgColor-hover: #db6d281a;
   --control-danger-bgColor-active: #db6d2866;
@@ -242,6 +251,7 @@
   --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
   --button-invisible-fgColor-rest: #f0f6fc;
   --button-invisible-fgColor-hover: #f0f6fc;
+  --button-invisible-fgColor-active: #f0f6fc;
   --button-invisible-fgColor-disabled: #656c7699;
   --button-invisible-iconColor-rest: #9198a1;
   --button-invisible-iconColor-hover: #9198a1;
@@ -264,11 +274,11 @@
   --button-outline-borderColor-hover: #3d444d;
   --button-outline-borderColor-selected: #3d444d;
   --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
-  --button-danger-fgColor-rest: #e6713e;
+  --button-danger-fgColor-rest: #f0883e;
   --button-danger-fgColor-hover: #ffffff;
   --button-danger-fgColor-active: #ffffff;
-  --button-danger-fgColor-disabled: #db6d2880;
-  --button-danger-iconColor-rest: #e6713e;
+  --button-danger-fgColor-disabled: #f0883e80;
+  --button-danger-iconColor-rest: #f0883e;
   --button-danger-iconColor-hover: #ffffff;
   --button-danger-bgColor-rest: #212830;
   --button-danger-bgColor-hover: #9b4215;
@@ -293,9 +303,9 @@
   --buttonCounter-danger-bgColor-hover: #ffffff33;
   --buttonCounter-danger-bgColor-disabled: #bd561d0d;
   --buttonCounter-danger-bgColor-rest: #49020233;
-  --buttonCounter-danger-fgColor-rest: #db6d28;
+  --buttonCounter-danger-fgColor-rest: #f0883e;
   --buttonCounter-danger-fgColor-hover: #ffffff;
-  --buttonCounter-danger-fgColor-disabled: #db6d2880;
+  --buttonCounter-danger-fgColor-disabled: #f0883e80;
   --reactionButton-selected-bgColor-rest: #388bfd33;
   --reactionButton-selected-bgColor-hover: #3a8cfd5c;
   --reactionButton-selected-fgColor-rest: #4493f8;
@@ -446,7 +456,7 @@
   --fgColor-open: #f0883e;
   --fgColor-attention: #d29922;
   --fgColor-severe: #db6d28;
-  --fgColor-danger: #db6d28;
+  --fgColor-danger: #f0883e;
   --fgColor-closed: #9198a1;
   --fgColor-done: #ab7df8;
   --fgColor-upsell: #ab7df8;
@@ -466,7 +476,7 @@
   --bgColor-accent-emphasis: #1f6feb;
   --bgColor-success-muted: #388bfd26;
   --bgColor-success-emphasis: #1f6feb;
-  --bgColor-open-muted: #db6d2866;
+  --bgColor-open-muted: #db6d2833;
   --bgColor-open-emphasis: #bd561d;
   --bgColor-attention-muted: #bb800926;
   --bgColor-attention-emphasis: #9e6a03;
@@ -574,17 +584,26 @@
     --topicTag-borderColor: #00000000;
     --highlight-neutral-bgColor: #d2992266;
     --page-header-bgColor: #0d1117;
-    --diffBlob-addition-fgColor-text: #f0f6fc;
-    --diffBlob-addition-fgColor-num: #f0f6fc;
-    --diffBlob-addition-bgColor-num: #58a6ff4d;
-    --diffBlob-addition-bgColor-line: #388bfd26;
-    --diffBlob-addition-bgColor-word: #388bfd66;
-    --diffBlob-deletion-fgColor-text: #f0f6fc;
-    --diffBlob-deletion-fgColor-num: #f0f6fc;
-    --diffBlob-deletion-bgColor-num: #db6d284d;
-    --diffBlob-deletion-bgColor-line: #db6d2826;
-    --diffBlob-deletion-bgColor-word: #db6d2866;
-    --diffBlob-hunk-bgColor-num: #388bfd66;
+    --diffBlob-additionLine-fgColor: #f0f6fc;
+    --diffBlob-additionLine-bgColor: #388bfd26;
+    --diffBlob-additionWord-fgColor: #f0f6fc;
+    --diffBlob-additionWord-bgColor: #388bfd66;
+    --diffBlob-additionNum-fgColor: #f0f6fc;
+    --diffBlob-additionNum-bgColor: #58a6ff4d;
+    --diffBlob-deletionLine-fgColor: #f0f6fc;
+    --diffBlob-deletionLine-bgColor: #db6d2826;
+    --diffBlob-deletionWord-fgColor: #f0f6fc;
+    --diffBlob-deletionWord-bgColor: #db6d2866;
+    --diffBlob-deletionNum-fgColor: #f0f6fc;
+    --diffBlob-deletionNum-bgColor: #db6d284d;
+    --diffBlob-hunkLine-fgColor: #9198a1;
+    --diffBlob-hunkLine-bgColor: #212830;
+    --diffBlob-hunkNum-fgColor-rest: #f0f6fc;
+    --diffBlob-hunkNum-fgColor-hover: #ffffff;
+    --diffBlob-hunkNum-bgColor-rest: #2f3742;
+    --diffBlob-hunkNum-bgColor-hover: #656c76;
+    --diffBlob-emptyNum-bgColor: #151b23;
+    --diffBlob-emptyLine-bgColor: #151b23;
     --diffBlob-expander-iconColor: #9198a1;
     --codeMirror-fgColor: #f0f6fc;
     --codeMirror-bgColor: #0d1117;
@@ -755,7 +774,7 @@
     --control-transparent-borderColor-rest: #00000000;
     --control-transparent-borderColor-hover: #00000000;
     --control-transparent-borderColor-active: #00000000;
-    --control-danger-fgColor-rest: #db6d28;
+    --control-danger-fgColor-rest: #f0883e;
     --control-danger-fgColor-hover: #f0883e;
     --control-danger-bgColor-hover: #db6d281a;
     --control-danger-bgColor-active: #db6d2866;
@@ -811,6 +830,7 @@
     --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
     --button-invisible-fgColor-rest: #f0f6fc;
     --button-invisible-fgColor-hover: #f0f6fc;
+    --button-invisible-fgColor-active: #f0f6fc;
     --button-invisible-fgColor-disabled: #656c7699;
     --button-invisible-iconColor-rest: #9198a1;
     --button-invisible-iconColor-hover: #9198a1;
@@ -833,11 +853,11 @@
     --button-outline-borderColor-hover: #3d444d;
     --button-outline-borderColor-selected: #3d444d;
     --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
-    --button-danger-fgColor-rest: #e6713e;
+    --button-danger-fgColor-rest: #f0883e;
     --button-danger-fgColor-hover: #ffffff;
     --button-danger-fgColor-active: #ffffff;
-    --button-danger-fgColor-disabled: #db6d2880;
-    --button-danger-iconColor-rest: #e6713e;
+    --button-danger-fgColor-disabled: #f0883e80;
+    --button-danger-iconColor-rest: #f0883e;
     --button-danger-iconColor-hover: #ffffff;
     --button-danger-bgColor-rest: #212830;
     --button-danger-bgColor-hover: #9b4215;
@@ -862,9 +882,9 @@
     --buttonCounter-danger-bgColor-hover: #ffffff33;
     --buttonCounter-danger-bgColor-disabled: #bd561d0d;
     --buttonCounter-danger-bgColor-rest: #49020233;
-    --buttonCounter-danger-fgColor-rest: #db6d28;
+    --buttonCounter-danger-fgColor-rest: #f0883e;
     --buttonCounter-danger-fgColor-hover: #ffffff;
-    --buttonCounter-danger-fgColor-disabled: #db6d2880;
+    --buttonCounter-danger-fgColor-disabled: #f0883e80;
     --reactionButton-selected-bgColor-rest: #388bfd33;
     --reactionButton-selected-bgColor-hover: #3a8cfd5c;
     --reactionButton-selected-fgColor-rest: #4493f8;
@@ -1015,7 +1035,7 @@
     --fgColor-open: #f0883e;
     --fgColor-attention: #d29922;
     --fgColor-severe: #db6d28;
-    --fgColor-danger: #db6d28;
+    --fgColor-danger: #f0883e;
     --fgColor-closed: #9198a1;
     --fgColor-done: #ab7df8;
     --fgColor-upsell: #ab7df8;
@@ -1035,7 +1055,7 @@
     --bgColor-accent-emphasis: #1f6feb;
     --bgColor-success-muted: #388bfd26;
     --bgColor-success-emphasis: #1f6feb;
-    --bgColor-open-muted: #db6d2866;
+    --bgColor-open-muted: #db6d2833;
     --bgColor-open-emphasis: #bd561d;
     --bgColor-attention-muted: #bb800926;
     --bgColor-attention-emphasis: #9e6a03;

package/dist/css/functional/themes/dark-dimmed.css

@@ -5,18 +5,27 @@
   --topicTag-borderColor: #00000000;
   --highlight-neutral-bgColor: #c6902666;
   --page-header-bgColor: #212830;
-  --diffBlob-addition-fgColor-text: #d1d7e0;
-  --diffBlob-addition-fgColor-num: #d1d7e0;
-  --diffBlob-addition-bgColor-num: #57ab5a4d;
-  --diffBlob-addition-bgColor-line: #46954a26;
-  --diffBlob-addition-bgColor-word: #46954a66;
-  --diffBlob-deletion-fgColor-text: #d1d7e0;
-  --diffBlob-deletion-fgColor-num: #d1d7e0;
-  --diffBlob-deletion-bgColor-num: #e5534b4d;
-  --diffBlob-deletion-bgColor-line: #e5534b26;
-  --diffBlob-deletion-bgColor-word: #e5534b66;
-  --diffBlob-hunk-bgColor-num: #4184e466;
-  --diffBlob-expander-iconColor: #d1d7e0;
+  --diffBlob-additionLine-fgColor: #d1d7e0;
+  --diffBlob-additionLine-bgColor: #46954a26;
+  --diffBlob-additionWord-fgColor: #d1d7e0;
+  --diffBlob-additionWord-bgColor: #46954a66;
+  --diffBlob-additionNum-fgColor: #d1d7e0;
+  --diffBlob-additionNum-bgColor: #57ab5a4d;
+  --diffBlob-deletionLine-fgColor: #d1d7e0;
+  --diffBlob-deletionLine-bgColor: #e5534b1a;
+  --diffBlob-deletionWord-fgColor: #d1d7e0;
+  --diffBlob-deletionWord-bgColor: #e5534b66;
+  --diffBlob-deletionNum-fgColor: #d1d7e0;
+  --diffBlob-deletionNum-bgColor: #e5534b4d;
+  --diffBlob-hunkLine-fgColor: #9198a1;
+  --diffBlob-hunkLine-bgColor: #4184e41a;
+  --diffBlob-hunkNum-fgColor-rest: #d1d7e0;
+  --diffBlob-hunkNum-fgColor-hover: #f0f6fc;
+  --diffBlob-hunkNum-bgColor-rest: #143d79;
+  --diffBlob-hunkNum-bgColor-hover: #316dca;
+  --diffBlob-emptyNum-bgColor: #262c36;
+  --diffBlob-emptyLine-bgColor: #262c36;
+  --diffBlob-expander-iconColor: #9198a1;
   --codeMirror-fgColor: #d1d7e0;
   --codeMirror-bgColor: #212830;
   --codeMirror-gutters-bgColor: #212830;
@@ -242,6 +251,7 @@
   --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
   --button-invisible-fgColor-rest: #d1d7e0;
   --button-invisible-fgColor-hover: #d1d7e0;
+  --button-invisible-fgColor-active: #d1d7e0;
   --button-invisible-fgColor-disabled: #656c76;
   --button-invisible-iconColor-rest: #b7bdc8;
   --button-invisible-iconColor-hover: #b7bdc8;
@@ -574,18 +584,27 @@
     --topicTag-borderColor: #00000000;
     --highlight-neutral-bgColor: #c6902666;
     --page-header-bgColor: #212830;
-    --diffBlob-addition-fgColor-text: #d1d7e0;
-    --diffBlob-addition-fgColor-num: #d1d7e0;
-    --diffBlob-addition-bgColor-num: #57ab5a4d;
-    --diffBlob-addition-bgColor-line: #46954a26;
-    --diffBlob-addition-bgColor-word: #46954a66;
-    --diffBlob-deletion-fgColor-text: #d1d7e0;
-    --diffBlob-deletion-fgColor-num: #d1d7e0;
-    --diffBlob-deletion-bgColor-num: #e5534b4d;
-    --diffBlob-deletion-bgColor-line: #e5534b26;
-    --diffBlob-deletion-bgColor-word: #e5534b66;
-    --diffBlob-hunk-bgColor-num: #4184e466;
-    --diffBlob-expander-iconColor: #d1d7e0;
+    --diffBlob-additionLine-fgColor: #d1d7e0;
+    --diffBlob-additionLine-bgColor: #46954a26;
+    --diffBlob-additionWord-fgColor: #d1d7e0;
+    --diffBlob-additionWord-bgColor: #46954a66;
+    --diffBlob-additionNum-fgColor: #d1d7e0;
+    --diffBlob-additionNum-bgColor: #57ab5a4d;
+    --diffBlob-deletionLine-fgColor: #d1d7e0;
+    --diffBlob-deletionLine-bgColor: #e5534b1a;
+    --diffBlob-deletionWord-fgColor: #d1d7e0;
+    --diffBlob-deletionWord-bgColor: #e5534b66;
+    --diffBlob-deletionNum-fgColor: #d1d7e0;
+    --diffBlob-deletionNum-bgColor: #e5534b4d;
+    --diffBlob-hunkLine-fgColor: #9198a1;
+    --diffBlob-hunkLine-bgColor: #4184e41a;
+    --diffBlob-hunkNum-fgColor-rest: #d1d7e0;
+    --diffBlob-hunkNum-fgColor-hover: #f0f6fc;
+    --diffBlob-hunkNum-bgColor-rest: #143d79;
+    --diffBlob-hunkNum-bgColor-hover: #316dca;
+    --diffBlob-emptyNum-bgColor: #262c36;
+    --diffBlob-emptyLine-bgColor: #262c36;
+    --diffBlob-expander-iconColor: #9198a1;
     --codeMirror-fgColor: #d1d7e0;
     --codeMirror-bgColor: #212830;
     --codeMirror-gutters-bgColor: #212830;
@@ -811,6 +830,7 @@
     --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
     --button-invisible-fgColor-rest: #d1d7e0;
     --button-invisible-fgColor-hover: #d1d7e0;
+    --button-invisible-fgColor-active: #d1d7e0;
     --button-invisible-fgColor-disabled: #656c76;
     --button-invisible-iconColor-rest: #b7bdc8;
     --button-invisible-iconColor-hover: #b7bdc8;

package/dist/css/functional/themes/dark-high-contrast.css

@@ -5,17 +5,26 @@
   --topicTag-borderColor: #409eff;
   --highlight-neutral-bgColor: #f0b72f66;
   --page-header-bgColor: #010409;
-  --diffBlob-addition-fgColor-text: #ffffff;
-  --diffBlob-addition-fgColor-num: #ffffff;
-  --diffBlob-addition-bgColor-num: #28d7514d;
-  --diffBlob-addition-bgColor-line: #0ac74026;
-  --diffBlob-addition-bgColor-word: #006222;
-  --diffBlob-deletion-fgColor-text: #ffffff;
-  --diffBlob-deletion-fgColor-num: #ffffff;
-  --diffBlob-deletion-bgColor-num: #ff80804d;
-  --diffBlob-deletion-bgColor-line: #ff808026;
-  --diffBlob-deletion-bgColor-word: #ad0116;
-  --diffBlob-hunk-bgColor-num: #5cacff66;
+  --diffBlob-additionLine-fgColor: #ffffff;
+  --diffBlob-additionLine-bgColor: #0ac74033;
+  --diffBlob-additionWord-fgColor: #ffffff;
+  --diffBlob-additionWord-bgColor: #006222;
+  --diffBlob-additionNum-fgColor: #ffffff;
+  --diffBlob-additionNum-bgColor: #28d7514d;
+  --diffBlob-deletionLine-fgColor: #ffffff;
+  --diffBlob-deletionLine-bgColor: #ff808033;
+  --diffBlob-deletionWord-fgColor: #ffffff;
+  --diffBlob-deletionWord-bgColor: #ad0116;
+  --diffBlob-deletionNum-fgColor: #ffffff;
+  --diffBlob-deletionNum-bgColor: #ff80804d;
+  --diffBlob-hunkLine-fgColor: #b7bdc8;
+  --diffBlob-hunkLine-bgColor: #5cacff33;
+  --diffBlob-hunkNum-fgColor-rest: #ffffff;
+  --diffBlob-hunkNum-fgColor-hover: #ffffff;
+  --diffBlob-hunkNum-bgColor-rest: #5cacff66;
+  --diffBlob-hunkNum-bgColor-hover: #194fb1;
+  --diffBlob-emptyNum-bgColor: #151b23;
+  --diffBlob-emptyLine-bgColor: #151b23;
   --diffBlob-expander-iconColor: #ffffff;
   --codeMirror-fgColor: #ffffff;
   --codeMirror-bgColor: #010409;
@@ -169,7 +178,7 @@
   --control-bgColor-selected: #262c36;
   --control-fgColor-rest: #ffffff;
   --control-fgColor-placeholder: #b7bdc8;
-  --control-fgColor-disabled: #9198a199;
+  --control-fgColor-disabled: #656c76;
   --control-borderColor-rest: #b7bdc8;
   --control-borderColor-emphasis: #b7bdc8;
   --control-borderColor-disabled: #9198a11f;
@@ -193,21 +202,21 @@
   --control-checked-bgColor-rest: #194fb1;
   --control-checked-bgColor-hover: #2b64c1;
   --control-checked-bgColor-active: #3c79d0;
-  --control-checked-bgColor-disabled: #9198a199;
+  --control-checked-bgColor-disabled: #656c76;
   --control-checked-fgColor-rest: #ffffff;
   --control-checked-fgColor-disabled: #010409;
   --control-checked-borderColor-rest: #91cbff;
   --control-checked-borderColor-hover: #91cbff;
   --control-checked-borderColor-active: #91cbff;
-  --control-checked-borderColor-disabled: #9198a199;
+  --control-checked-borderColor-disabled: #656c76;
   --controlTrack-bgColor-rest: #2a313c;
   --controlTrack-bgColor-hover: #2f3742;
   --controlTrack-bgColor-active: #3d444d;
-  --controlTrack-bgColor-disabled: #9198a199;
+  --controlTrack-bgColor-disabled: #656c76;
   --controlTrack-fgColor-rest: #ffffff;
   --controlTrack-fgColor-disabled: #ffffff;
   --controlTrack-borderColor-rest: #b7bdc8;
-  --controlTrack-borderColor-disabled: #9198a199;
+  --controlTrack-borderColor-disabled: #656c76;
   --controlKnob-bgColor-rest: #010409;
   --controlKnob-bgColor-disabled: #262c36;
   --controlKnob-bgColor-checked: #ffffff;
@@ -242,10 +251,11 @@
   --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
   --button-invisible-fgColor-rest: #ffffff;
   --button-invisible-fgColor-hover: #ffffff;
-  --button-invisible-fgColor-disabled: #9198a199;
+  --button-invisible-fgColor-active: #ffffff;
+  --button-invisible-fgColor-disabled: #656c76;
   --button-invisible-iconColor-rest: #d1d7e0;
   --button-invisible-iconColor-hover: #d1d7e0;
-  --button-invisible-iconColor-disabled: #9198a199;
+  --button-invisible-iconColor-disabled: #656c76;
   --button-invisible-bgColor-rest: #00000000;
   --button-invisible-bgColor-hover: #151b23;
   --button-invisible-bgColor-active: #212830;
@@ -264,11 +274,11 @@
   --button-outline-borderColor-hover: #b7bdc8;
   --button-outline-borderColor-selected: #b7bdc8;
   --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
-  --button-danger-fgColor-rest: #ffa8a6;
+  --button-danger-fgColor-rest: #ffb1af;
   --button-danger-fgColor-hover: #ffffff;
   --button-danger-fgColor-active: #ffffff;
   --button-danger-fgColor-disabled: #ff949280;
-  --button-danger-iconColor-rest: #ffa8a6;
+  --button-danger-iconColor-rest: #ffb1af;
   --button-danger-iconColor-hover: #ffffff;
   --button-danger-bgColor-rest: #262c36;
   --button-danger-bgColor-hover: #ad0116;
@@ -438,7 +448,7 @@
   --fgColor-onInverse: #010409;
   --fgColor-white: #ffffff;
   --fgColor-black: #010409;
-  --fgColor-disabled: #9198a199;
+  --fgColor-disabled: #656c76;
   --fgColor-link: #74b9ff;
   --fgColor-neutral: #d1d7e0;
   --fgColor-accent: #74b9ff;
@@ -574,17 +584,26 @@
     --topicTag-borderColor: #409eff;
     --highlight-neutral-bgColor: #f0b72f66;
     --page-header-bgColor: #010409;
-    --diffBlob-addition-fgColor-text: #ffffff;
-    --diffBlob-addition-fgColor-num: #ffffff;
-    --diffBlob-addition-bgColor-num: #28d7514d;
-    --diffBlob-addition-bgColor-line: #0ac74026;
-    --diffBlob-addition-bgColor-word: #006222;
-    --diffBlob-deletion-fgColor-text: #ffffff;
-    --diffBlob-deletion-fgColor-num: #ffffff;
-    --diffBlob-deletion-bgColor-num: #ff80804d;
-    --diffBlob-deletion-bgColor-line: #ff808026;
-    --diffBlob-deletion-bgColor-word: #ad0116;
-    --diffBlob-hunk-bgColor-num: #5cacff66;
+    --diffBlob-additionLine-fgColor: #ffffff;
+    --diffBlob-additionLine-bgColor: #0ac74033;
+    --diffBlob-additionWord-fgColor: #ffffff;
+    --diffBlob-additionWord-bgColor: #006222;
+    --diffBlob-additionNum-fgColor: #ffffff;
+    --diffBlob-additionNum-bgColor: #28d7514d;
+    --diffBlob-deletionLine-fgColor: #ffffff;
+    --diffBlob-deletionLine-bgColor: #ff808033;
+    --diffBlob-deletionWord-fgColor: #ffffff;
+    --diffBlob-deletionWord-bgColor: #ad0116;
+    --diffBlob-deletionNum-fgColor: #ffffff;
+    --diffBlob-deletionNum-bgColor: #ff80804d;
+    --diffBlob-hunkLine-fgColor: #b7bdc8;
+    --diffBlob-hunkLine-bgColor: #5cacff33;
+    --diffBlob-hunkNum-fgColor-rest: #ffffff;
+    --diffBlob-hunkNum-fgColor-hover: #ffffff;
+    --diffBlob-hunkNum-bgColor-rest: #5cacff66;
+    --diffBlob-hunkNum-bgColor-hover: #194fb1;
+    --diffBlob-emptyNum-bgColor: #151b23;
+    --diffBlob-emptyLine-bgColor: #151b23;
     --diffBlob-expander-iconColor: #ffffff;
     --codeMirror-fgColor: #ffffff;
     --codeMirror-bgColor: #010409;
@@ -738,7 +757,7 @@
     --control-bgColor-selected: #262c36;
     --control-fgColor-rest: #ffffff;
     --control-fgColor-placeholder: #b7bdc8;
-    --control-fgColor-disabled: #9198a199;
+    --control-fgColor-disabled: #656c76;
     --control-borderColor-rest: #b7bdc8;
     --control-borderColor-emphasis: #b7bdc8;
     --control-borderColor-disabled: #9198a11f;
@@ -762,21 +781,21 @@
     --control-checked-bgColor-rest: #194fb1;
     --control-checked-bgColor-hover: #2b64c1;
     --control-checked-bgColor-active: #3c79d0;
-    --control-checked-bgColor-disabled: #9198a199;
+    --control-checked-bgColor-disabled: #656c76;
     --control-checked-fgColor-rest: #ffffff;
     --control-checked-fgColor-disabled: #010409;
     --control-checked-borderColor-rest: #91cbff;
     --control-checked-borderColor-hover: #91cbff;
     --control-checked-borderColor-active: #91cbff;
-    --control-checked-borderColor-disabled: #9198a199;
+    --control-checked-borderColor-disabled: #656c76;
     --controlTrack-bgColor-rest: #2a313c;
     --controlTrack-bgColor-hover: #2f3742;
     --controlTrack-bgColor-active: #3d444d;
-    --controlTrack-bgColor-disabled: #9198a199;
+    --controlTrack-bgColor-disabled: #656c76;
     --controlTrack-fgColor-rest: #ffffff;
     --controlTrack-fgColor-disabled: #ffffff;
     --controlTrack-borderColor-rest: #b7bdc8;
-    --controlTrack-borderColor-disabled: #9198a199;
+    --controlTrack-borderColor-disabled: #656c76;
     --controlKnob-bgColor-rest: #010409;
     --controlKnob-bgColor-disabled: #262c36;
     --controlKnob-bgColor-checked: #ffffff;
@@ -811,10 +830,11 @@
     --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
     --button-invisible-fgColor-rest: #ffffff;
     --button-invisible-fgColor-hover: #ffffff;
-    --button-invisible-fgColor-disabled: #9198a199;
+    --button-invisible-fgColor-active: #ffffff;
+    --button-invisible-fgColor-disabled: #656c76;
     --button-invisible-iconColor-rest: #d1d7e0;
     --button-invisible-iconColor-hover: #d1d7e0;
-    --button-invisible-iconColor-disabled: #9198a199;
+    --button-invisible-iconColor-disabled: #656c76;
     --button-invisible-bgColor-rest: #00000000;
     --button-invisible-bgColor-hover: #151b23;
     --button-invisible-bgColor-active: #212830;
@@ -833,11 +853,11 @@
     --button-outline-borderColor-hover: #b7bdc8;
     --button-outline-borderColor-selected: #b7bdc8;
     --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
-    --button-danger-fgColor-rest: #ffa8a6;
+    --button-danger-fgColor-rest: #ffb1af;
     --button-danger-fgColor-hover: #ffffff;
     --button-danger-fgColor-active: #ffffff;
     --button-danger-fgColor-disabled: #ff949280;
-    --button-danger-iconColor-rest: #ffa8a6;
+    --button-danger-iconColor-rest: #ffb1af;
     --button-danger-iconColor-hover: #ffffff;
     --button-danger-bgColor-rest: #262c36;
     --button-danger-bgColor-hover: #ad0116;
@@ -1007,7 +1027,7 @@
     --fgColor-onInverse: #010409;
     --fgColor-white: #ffffff;
     --fgColor-black: #010409;
-    --fgColor-disabled: #9198a199;
+    --fgColor-disabled: #656c76;
     --fgColor-link: #74b9ff;
     --fgColor-neutral: #d1d7e0;
     --fgColor-accent: #74b9ff;