@primer/components 0.0.0-202191916821 → 0.0.0-2021919182815

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @primer/components
 
-## 0.0.0-202191916821
+## 0.0.0-2021919182815
 
 ### Major Changes
 
@@ -12,6 +12,8 @@
 
 - Fake entry to force publishing
 
+* [#1512](https://github.com/primer/react/pull/1512) [`1e5ac406`](https://github.com/primer/react/commit/1e5ac406f8558a20248157a9bfe13ee4709890c8) Thanks [@pksjce](https://github.com/pksjce)! - Change disabled color from muted to custom primer disabled color
+
 ## 30.3.0
 
 ### Minor Changes

package/dist/browser.esm.js

@@ -45,7 +45,7 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
   }
 
   &:disabled {
-    color: ${It("colors.fg.muted")};
+    color: ${It("colors.primer.fg.disabled")};
     background-color: ${It("colors.btn.bg")};
     border-color: ${It("colors.btn.border")};
   }
@@ -232,7 +232,7 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
   &:disabled {
     &,
     &:hover {
-      color: rgba(${It("colors.fg.muted")}, 0.5);
+      color: ${It("colors.primer.fg.disabled")};
       cursor: default;
     }
   }
@@ -418,7 +418,7 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
   background: ${It("colors.border.muted")};
   margin-top: calc(${It("space.2")} - 1px);
   margin-bottom: ${It("space.2")};
-`;function $a(){return e.createElement(ka,null)}$a.displayName="Divider",$a.renderItem=$a;const Ta={default:{hover:{light:"rgba(46, 77, 108, 0.06)",dark:"rgba(201, 206, 212, 0.12)",dark_dimmed:"rgba(201, 206, 212, 0.12)"},focus:{light:"rgba(54, 77, 100, 0.16)",dark:"rgba(201, 206, 212, 0.24)",dark_dimmed:"rgba(201, 206, 212, 0.24)"}},danger:{hover:{light:"rgba(234, 74, 90, 0.08)",dark:"rgba(248, 81, 73, 0.16)",dark_dimmed:"rgba(248, 81, 73, 0.16)"},focus:{light:"rgba(234, 74, 90, 0.14)",dark:"rgba(248, 81, 73, 0.24)",dark_dimmed:"rgba(248, 81, 73, 0.24)"}}},Sa=(e="default",t)=>{if(t)return{color:It("colors.fg.muted"),iconColor:It("colors.fg.muted"),annotationColor:It("colors.fg.muted"),hoverCursor:"default"};switch(e){case"danger":return{color:It("colors.danger.fg"),iconColor:It("colors.danger.fg"),annotationColor:It("colors.fg.muted"),hoverCursor:"pointer"};default:return{color:It("colors.fg.default"),iconColor:It("colors.fg.muted"),annotationColor:It("colors.fg.muted"),hoverCursor:"pointer"}}},Ea=f.div`
+`;function $a(){return e.createElement(ka,null)}$a.displayName="Divider",$a.renderItem=$a;const Ta={default:{hover:{light:"rgba(46, 77, 108, 0.06)",dark:"rgba(201, 206, 212, 0.12)",dark_dimmed:"rgba(201, 206, 212, 0.12)"},focus:{light:"rgba(54, 77, 100, 0.16)",dark:"rgba(201, 206, 212, 0.24)",dark_dimmed:"rgba(201, 206, 212, 0.24)"}},danger:{hover:{light:"rgba(234, 74, 90, 0.08)",dark:"rgba(248, 81, 73, 0.16)",dark_dimmed:"rgba(248, 81, 73, 0.16)"},focus:{light:"rgba(234, 74, 90, 0.14)",dark:"rgba(248, 81, 73, 0.24)",dark_dimmed:"rgba(248, 81, 73, 0.24)"}}},Sa=(e="default",t)=>{if(t)return{color:It("colors.primer.fg.disabled"),iconColor:It("colors.primer.fg.disabled"),annotationColor:It("colors.primer.fg.disabled"),hoverCursor:"default"};switch(e){case"danger":return{color:It("colors.danger.fg"),iconColor:It("colors.danger.fg"),annotationColor:It("colors.fg.muted"),hoverCursor:"pointer"};default:return{color:It("colors.fg.default"),iconColor:It("colors.fg.muted"),annotationColor:It("colors.fg.muted"),hoverCursor:"pointer"}}},Ea=f.div`
   display: flex;
   min-width: 0;
 
@@ -636,7 +636,7 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
 
   ${e=>e.contrast&&p(["background-color:",";"],It("colors.canvas.inset"))}
 
-  ${e=>e.disabled&&p(["color:",";background-color:",";border-color:",";"],It("colors.fg.muted"),It("colors.input.disabledBg"),It("colors.border.default"))}
+  ${e=>e.disabled&&p(["color:",";background-color:",";border-color:",";"],It("colors.primer.fg.disabled"),It("colors.input.disabledBg"),It("colors.border.default"))}
   
     ${e=>e.block&&p(["display:block;width:100%;"])}
   
@@ -1248,7 +1248,7 @@ import e,{useState as t,useRef as r,useCallback as o,useEffect as a,useMemo as n
 
   &[aria-disabled],
   &[aria-disabled]:hover {
-    color: ${It("colors.fg.muted")}; // check
+    color: ${It("colors.primer.fg.disabled")}; // check
     cursor: default;
     border-color: transparent;
   }