Fix errors in buttonFrom util and Checkbox styles; migration guide pa…

…tches
Shopify · Oct 23, 2023 · 23f792d · 23f792d
1 parent 08cdf8b
commit 23f792d
Show file tree

Hide file tree

Showing 3 changed files with 152 additions and 142 deletions.
diff --git a/polaris-react/src/components/Button/utils.tsx b/polaris-react/src/components/Button/utils.tsx
@@ -26,12 +26,22 @@ export function buttonsFrom(
 }
 
 export function buttonFrom(
-  {content, onAction, ...action}: ComplexAction,
+  {content, onAction, plain, destructive, ...action}: ComplexAction,
   overrides?: Partial<ButtonProps>,
   key?: any,
 ) {
+  const variant = !overrides?.variant && plain ? 'plain' : overrides?.variant;
+  const tone = !overrides?.tone && destructive ? 'critical' : overrides?.tone;
+
   return (
-    <Button key={key} onClick={onAction} {...action} {...overrides}>
+    <Button
+      key={key}
+      onClick={onAction}
+      tone={tone}
+      variant={variant}
+      {...action}
+      {...overrides}
+    >
       {content}
     </Button>
   );

diff --git a/polaris-react/src/components/Checkbox/Checkbox.scss b/polaris-react/src/components/Checkbox/Checkbox.scss
@@ -76,7 +76,7 @@
       // in order for the background color to bleed all the way to the edge of the element.
       border-color: transparent;
       // stylelint-disable-next-line polaris/color/function-disallowed-list -- set background color
-      background-color: rgba(0, 0, 0, 0.08);
+      background-color: rgba(--p-color-checkbox-bg-surface-disabled);
       box-shadow: none;
 
       &::before {