@primer/primitives 7.5.1 → 7.6.0

package/dist/js/colors/light_high_contrast.d.ts

@@ -345,6 +345,22 @@ declare const _default: {
             hoverText: string;
         };
     };
+    switchTrack: {
+        bg: string;
+        border: string;
+        checked: {
+            bg: string;
+            hoverBg: string;
+            activeBg: string;
+            border: string;
+        };
+    };
+    switchKnob: {
+        checked: {
+            bg: string;
+            disabledBg: string;
+        };
+    };
     fg: {
         default: string;
         muted: string;

package/dist/js/colors/light_high_contrast.js

@@ -347,6 +347,22 @@ exports.default = {
             "hoverText": "#ffffff"
         }
     },
+    "switchTrack": {
+        "bg": "#ffffff",
+        "border": "#20252C",
+        "checked": {
+            "bg": "#dff7ff",
+            "hoverBg": "#9cd7ff",
+            "activeBg": "#67b3fd",
+            "border": "#0349b4"
+        }
+    },
+    "switchKnob": {
+        "checked": {
+            "bg": "#0349b4",
+            "disabledBg": "#66707B"
+        }
+    },
     "fg": {
         "default": "#0E1116",
         "muted": "#0E1116",

package/dist/js/index.d.ts

@@ -347,6 +347,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -809,6 +825,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -1271,6 +1303,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -1733,6 +1781,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -2195,6 +2259,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -2657,6 +2737,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;
@@ -3119,6 +3215,22 @@ declare const _default: {
                     hoverText: string;
                 };
             };
+            switchTrack: {
+                bg: string;
+                border: string;
+                checked: {
+                    bg: string;
+                    hoverBg: string;
+                    activeBg: string;
+                    border: string;
+                };
+            };
+            switchKnob: {
+                checked: {
+                    bg: string;
+                    disabledBg: string;
+                };
+            };
             fg: {
                 default: string;
                 muted: string;

package/dist/json/colors/dark.json

@@ -75,7 +75,7 @@
     "bg": "#0d1117",
     "guttersBg": "#0d1117",
     "guttermarkerText": "#0d1117",
-    "guttermarkerSubtleText": "#484f58",
+    "guttermarkerSubtleText": "#6e7681",
     "linenumberText": "#8b949e",
     "cursor": "#c9d1d9",
     "selectionBg": "rgba(56,139,253,0.4)",
@@ -104,7 +104,7 @@
     "btnHoverIcon": "#c9d1d9",
     "btnHoverBg": "rgba(110,118,129,0.1)",
     "inputText": "#8b949e",
-    "inputPlaceholderText": "#484f58",
+    "inputPlaceholderText": "#6e7681",
     "inputFocusText": "#c9d1d9",
     "inputBg": "#161b22",
     "inputShadow": "0 0 0 1px (obj) => get_1.default(obj, path)",
@@ -126,8 +126,8 @@
     "headerBorder": "#21262d",
     "headerIcon": "#8b949e",
     "lineText": "#8b949e",
-    "lineNumText": "#484f58",
-    "lineTimestampText": "#484f58",
+    "lineNumText": "#6e7681",
+    "lineTimestampText": "#6e7681",
     "lineHoverBg": "rgba(110,118,129,0.1)",
     "lineSelectedBg": "rgba(56,139,253,0.15)",
     "lineSelectedNumText": "#58a6ff",
@@ -140,10 +140,10 @@
     "stepErrorText": "#f85149",
     "stepWarningText": "#d29922",
     "loglineText": "#8b949e",
-    "loglineNumText": "#484f58",
+    "loglineNumText": "#6e7681",
     "loglineDebugText": "#a371f7",
     "loglineErrorText": "#8b949e",
-    "loglineErrorNumText": "#484f58",
+    "loglineErrorNumText": "#6e7681",
     "loglineErrorBg": "rgba(248,81,73,0.15)",
     "loglineWarningText": "#8b949e",
     "loglineWarningNumText": "#d29922",
@@ -327,7 +327,7 @@
     }
   },
   "underlinenav": {
-    "icon": "#484f58",
+    "icon": "#6e7681",
     "borderHover": "rgba(110,118,129,0.4)"
   },
   "actionListItem": {
@@ -345,10 +345,26 @@
       "hoverText": "#ff7b72"
     }
   },
+  "switchTrack": {
+    "bg": "#010409",
+    "border": "#6e7681",
+    "checked": {
+      "bg": "rgba(31,111,235,0.35)",
+      "hoverBg": "rgba(31,111,235,0.5)",
+      "activeBg": "rgba(31,111,235,0.65)",
+      "border": "#58a6ff"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#1f6feb",
+      "disabledBg": "#484f58"
+    }
+  },
   "fg": {
     "default": "#c9d1d9",
     "muted": "#8b949e",
-    "subtle": "#484f58",
+    "subtle": "#6e7681",
     "onEmphasis": "#ffffff"
   },
   "canvas": {

package/dist/json/colors/dark_colorblind.json

@@ -75,7 +75,7 @@
     "bg": "#0d1117",
     "guttersBg": "#0d1117",
     "guttermarkerText": "#0d1117",
-    "guttermarkerSubtleText": "#484f58",
+    "guttermarkerSubtleText": "#6e7681",
     "linenumberText": "#8b949e",
     "cursor": "#c9d1d9",
     "selectionBg": "rgba(56,139,253,0.4)",
@@ -104,7 +104,7 @@
     "btnHoverIcon": "#c9d1d9",
     "btnHoverBg": "rgba(110,118,129,0.1)",
     "inputText": "#8b949e",
-    "inputPlaceholderText": "#484f58",
+    "inputPlaceholderText": "#6e7681",
     "inputFocusText": "#c9d1d9",
     "inputBg": "#161b22",
     "inputShadow": "0 0 0 1px (obj) => get_1.default(obj, path)",
@@ -126,8 +126,8 @@
     "headerBorder": "#21262d",
     "headerIcon": "#8b949e",
     "lineText": "#8b949e",
-    "lineNumText": "#484f58",
-    "lineTimestampText": "#484f58",
+    "lineNumText": "#6e7681",
+    "lineTimestampText": "#6e7681",
     "lineHoverBg": "rgba(110,118,129,0.1)",
     "lineSelectedBg": "rgba(56,139,253,0.15)",
     "lineSelectedNumText": "#58a6ff",
@@ -140,10 +140,10 @@
     "stepErrorText": "#d47616",
     "stepWarningText": "#d29922",
     "loglineText": "#8b949e",
-    "loglineNumText": "#484f58",
+    "loglineNumText": "#6e7681",
     "loglineDebugText": "#a371f7",
     "loglineErrorText": "#8b949e",
-    "loglineErrorNumText": "#484f58",
+    "loglineErrorNumText": "#6e7681",
     "loglineErrorBg": "rgba(212,118,22,0.15)",
     "loglineWarningText": "#8b949e",
     "loglineWarningNumText": "#d29922",
@@ -327,7 +327,7 @@
     }
   },
   "underlinenav": {
-    "icon": "#484f58",
+    "icon": "#6e7681",
     "borderHover": "rgba(110,118,129,0.4)"
   },
   "actionListItem": {
@@ -345,10 +345,26 @@
       "hoverText": "#ec8e2c"
     }
   },
+  "switchTrack": {
+    "bg": "#010409",
+    "border": "#6e7681",
+    "checked": {
+      "bg": "rgba(31,111,235,0.35)",
+      "hoverBg": "rgba(31,111,235,0.5)",
+      "activeBg": "rgba(31,111,235,0.65)",
+      "border": "#58a6ff"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#1f6feb",
+      "disabledBg": "#484f58"
+    }
+  },
   "fg": {
     "default": "#c9d1d9",
     "muted": "#8b949e",
-    "subtle": "#484f58",
+    "subtle": "#6e7681",
     "onEmphasis": "#ffffff"
   },
   "canvas": {

package/dist/json/colors/dark_dimmed.json

@@ -75,7 +75,7 @@
     "bg": "#22272e",
     "guttersBg": "#22272e",
     "guttermarkerText": "#22272e",
-    "guttermarkerSubtleText": "#545d68",
+    "guttermarkerSubtleText": "#636e7b",
     "linenumberText": "#768390",
     "cursor": "#adbac7",
     "selectionBg": "rgba(65,132,228,0.4)",
@@ -104,7 +104,7 @@
     "btnHoverIcon": "#adbac7",
     "btnHoverBg": "rgba(99,110,123,0.1)",
     "inputText": "#768390",
-    "inputPlaceholderText": "#545d68",
+    "inputPlaceholderText": "#636e7b",
     "inputFocusText": "#adbac7",
     "inputBg": "#2d333b",
     "inputShadow": "0 0 0 1px (obj) => get_1.default(obj, path)",
@@ -126,8 +126,8 @@
     "headerBorder": "#373e47",
     "headerIcon": "#768390",
     "lineText": "#768390",
-    "lineNumText": "#545d68",
-    "lineTimestampText": "#545d68",
+    "lineNumText": "#636e7b",
+    "lineTimestampText": "#636e7b",
     "lineHoverBg": "rgba(99,110,123,0.1)",
     "lineSelectedBg": "rgba(65,132,228,0.15)",
     "lineSelectedNumText": "#539bf5",
@@ -140,10 +140,10 @@
     "stepErrorText": "#e5534b",
     "stepWarningText": "#c69026",
     "loglineText": "#768390",
-    "loglineNumText": "#545d68",
+    "loglineNumText": "#636e7b",
     "loglineDebugText": "#986ee2",
     "loglineErrorText": "#768390",
-    "loglineErrorNumText": "#545d68",
+    "loglineErrorNumText": "#636e7b",
     "loglineErrorBg": "rgba(229,83,75,0.15)",
     "loglineWarningText": "#768390",
     "loglineWarningNumText": "#c69026",
@@ -327,7 +327,7 @@
     }
   },
   "underlinenav": {
-    "icon": "#545d68",
+    "icon": "#636e7b",
     "borderHover": "rgba(99,110,123,0.4)"
   },
   "actionListItem": {
@@ -345,10 +345,26 @@
       "hoverText": "#f47067"
     }
   },
+  "switchTrack": {
+    "bg": "#1c2128",
+    "border": "#636e7b",
+    "checked": {
+      "bg": "rgba(49,109,202,0.35)",
+      "hoverBg": "rgba(49,109,202,0.5)",
+      "activeBg": "rgba(49,109,202,0.65)",
+      "border": "#539bf5"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#316dca",
+      "disabledBg": "#545d68"
+    }
+  },
   "fg": {
     "default": "#adbac7",
     "muted": "#768390",
-    "subtle": "#545d68",
+    "subtle": "#636e7b",
     "onEmphasis": "#cdd9e5"
   },
   "canvas": {

package/dist/json/colors/dark_high_contrast.json

@@ -75,7 +75,7 @@
     "bg": "#0a0c10",
     "guttersBg": "#0a0c10",
     "guttermarkerText": "#0a0c10",
-    "guttermarkerSubtleText": "#7a828e",
+    "guttermarkerSubtleText": "#9ea7b3",
     "linenumberText": "#f0f3f6",
     "cursor": "#f0f3f6",
     "selectionBg": "rgba(64,158,255,0.4)",
@@ -104,7 +104,7 @@
     "btnHoverIcon": "#f0f3f6",
     "btnHoverBg": "rgba(158,167,179,0.1)",
     "inputText": "#f0f3f6",
-    "inputPlaceholderText": "#7a828e",
+    "inputPlaceholderText": "#9ea7b3",
     "inputFocusText": "#f0f3f6",
     "inputBg": "#272b33",
     "inputShadow": "0 0 0 1px (obj) => get_1.default(obj, path)",
@@ -126,8 +126,8 @@
     "headerBorder": "#7a828e",
     "headerIcon": "#f0f3f6",
     "lineText": "#f0f3f6",
-    "lineNumText": "#7a828e",
-    "lineTimestampText": "#7a828e",
+    "lineNumText": "#9ea7b3",
+    "lineTimestampText": "#9ea7b3",
     "lineHoverBg": "rgba(158,167,179,0.1)",
     "lineSelectedBg": "rgba(64,158,255,0.15)",
     "lineSelectedNumText": "#71b7ff",
@@ -140,10 +140,10 @@
     "stepErrorText": "#ff6a69",
     "stepWarningText": "#f0b72f",
     "loglineText": "#f0f3f6",
-    "loglineNumText": "#7a828e",
+    "loglineNumText": "#9ea7b3",
     "loglineDebugText": "#b780ff",
     "loglineErrorText": "#f0f3f6",
-    "loglineErrorNumText": "#7a828e",
+    "loglineErrorNumText": "#9ea7b3",
     "loglineErrorBg": "rgba(255,106,105,0.15)",
     "loglineWarningText": "#f0f3f6",
     "loglineWarningNumText": "#f0b72f",
@@ -345,10 +345,26 @@
       "hoverText": "#0a0c10"
     }
   },
+  "switchTrack": {
+    "bg": "#010409",
+    "border": "#7a828e",
+    "checked": {
+      "bg": "rgba(64,158,255,0.35)",
+      "hoverBg": "rgba(64,158,255,0.5)",
+      "activeBg": "rgba(64,158,255,0.65)",
+      "border": "#409eff"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#409eff",
+      "disabledBg": "#7a828e"
+    }
+  },
   "fg": {
     "default": "#f0f3f6",
     "muted": "#f0f3f6",
-    "subtle": "#7a828e",
+    "subtle": "#9ea7b3",
     "onEmphasis": "#0a0c10"
   },
   "canvas": {

package/dist/json/colors/light.json

@@ -345,6 +345,22 @@
       "hoverText": "#cf222e"
     }
   },
+  "switchTrack": {
+    "bg": "#eaeef2",
+    "border": "#afb8c1",
+    "checked": {
+      "bg": "#ddf4ff",
+      "hoverBg": "#b6e3ff",
+      "activeBg": "#80ccff",
+      "border": "#54aeff"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#0969da",
+      "disabledBg": "#6e7781"
+    }
+  },
   "fg": {
     "default": "#24292f",
     "muted": "#57606a",

package/dist/json/colors/light_colorblind.json

@@ -345,6 +345,22 @@
       "hoverText": "#b35900"
     }
   },
+  "switchTrack": {
+    "bg": "#eaeef2",
+    "border": "#afb8c1",
+    "checked": {
+      "bg": "#ddf4ff",
+      "hoverBg": "#b6e3ff",
+      "activeBg": "#80ccff",
+      "border": "#54aeff"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#0969da",
+      "disabledBg": "#6e7781"
+    }
+  },
   "fg": {
     "default": "#24292f",
     "muted": "#57606a",

package/dist/json/colors/light_high_contrast.json

@@ -345,6 +345,22 @@
       "hoverText": "#ffffff"
     }
   },
+  "switchTrack": {
+    "bg": "#ffffff",
+    "border": "#20252C",
+    "checked": {
+      "bg": "#dff7ff",
+      "hoverBg": "#9cd7ff",
+      "activeBg": "#67b3fd",
+      "border": "#0349b4"
+    }
+  },
+  "switchKnob": {
+    "checked": {
+      "bg": "#0349b4",
+      "disabledBg": "#66707B"
+    }
+  },
   "fg": {
     "default": "#0E1116",
     "muted": "#0E1116",

package/dist/scss/colors/_dark.scss

@@ -55,7 +55,7 @@
     --color-codemirror-bg: #0d1117;
     --color-codemirror-gutters-bg: #0d1117;
     --color-codemirror-guttermarker-text: #0d1117;
-    --color-codemirror-guttermarker-subtle-text: #484f58;
+    --color-codemirror-guttermarker-subtle-text: #6e7681;
     --color-codemirror-linenumber-text: #8b949e;
     --color-codemirror-cursor: #c9d1d9;
     --color-codemirror-selection-bg: rgba(56,139,253,0.4);
@@ -80,7 +80,7 @@
     --color-checks-btn-hover-icon: #c9d1d9;
     --color-checks-btn-hover-bg: rgba(110,118,129,0.1);
     --color-checks-input-text: #8b949e;
-    --color-checks-input-placeholder-text: #484f58;
+    --color-checks-input-placeholder-text: #6e7681;
     --color-checks-input-focus-text: #c9d1d9;
     --color-checks-input-bg: #161b22;
     --color-checks-input-shadow: 0 0 0 1px (obj) => get_1.default(obj, path);
@@ -102,8 +102,8 @@
     --color-checks-header-border: #21262d;
     --color-checks-header-icon: #8b949e;
     --color-checks-line-text: #8b949e;
-    --color-checks-line-num-text: #484f58;
-    --color-checks-line-timestamp-text: #484f58;
+    --color-checks-line-num-text: #6e7681;
+    --color-checks-line-timestamp-text: #6e7681;
     --color-checks-line-hover-bg: rgba(110,118,129,0.1);
     --color-checks-line-selected-bg: rgba(56,139,253,0.15);
     --color-checks-line-selected-num-text: #58a6ff;
@@ -116,10 +116,10 @@
     --color-checks-step-error-text: #f85149;
     --color-checks-step-warning-text: #d29922;
     --color-checks-logline-text: #8b949e;
-    --color-checks-logline-num-text: #484f58;
+    --color-checks-logline-num-text: #6e7681;
     --color-checks-logline-debug-text: #a371f7;
     --color-checks-logline-error-text: #8b949e;
-    --color-checks-logline-error-num-text: #484f58;
+    --color-checks-logline-error-num-text: #6e7681;
     --color-checks-logline-error-bg: rgba(248,81,73,0.15);
     --color-checks-logline-warning-text: #8b949e;
     --color-checks-logline-warning-num-text: #d29922;
@@ -259,7 +259,7 @@
     --color-btn-danger-focus-shadow: 0 0 0 3px rgba(248,81,73,0.4);
     --color-btn-danger-counter-bg: rgba(218,54,51,0.1);
     --color-btn-danger-icon: #f85149;
-    --color-underlinenav-icon: #484f58;
+    --color-underlinenav-icon: #6e7681;
     --color-underlinenav-border-hover: rgba(110,118,129,0.4);
     --color-action-list-item-inline-divider: rgba(48,54,61,0.48);
     --color-action-list-item-default-hover-bg: rgba(177,186,196,0.12);
@@ -270,9 +270,17 @@
     --color-action-list-item-danger-hover-bg: rgba(248,81,73,0.16);
     --color-action-list-item-danger-active-bg: rgba(248,81,73,0.24);
     --color-action-list-item-danger-hover-text: #ff7b72;
+    --color-switch-track-bg: #010409;
+    --color-switch-track-border: #6e7681;
+    --color-switch-track-checked-bg: rgba(31,111,235,0.35);
+    --color-switch-track-checked-hover-bg: rgba(31,111,235,0.5);
+    --color-switch-track-checked-active-bg: rgba(31,111,235,0.65);
+    --color-switch-track-checked-border: #58a6ff;
+    --color-switch-knob-checked-bg: #1f6feb;
+    --color-switch-knob-checked-disabled-bg: #484f58;
     --color-fg-default: #c9d1d9;
     --color-fg-muted: #8b949e;
-    --color-fg-subtle: #484f58;
+    --color-fg-subtle: #6e7681;
     --color-fg-on-emphasis: #ffffff;
     --color-canvas-default: #0d1117;
     --color-canvas-overlay: #161b22;