fix: Respect icon intent color passed to Dialog (#6947)

Co-authored-by: svc-changelog <[email protected]>

packages/core/changelog/@unreleased/pr-6947.v2.yml

@@ -0,0 +1,5 @@
+type: fix
+fix:
+  description: Respect icon intent color passed to Dialog
+  links:
+  - https://github.com/palantir/blueprint/pull/6947

packages/core/src/components/dialog/_dialog.scss

@@ -106,10 +106,14 @@ $dialog-header-padding: math.div($pt-grid-size, 2);
 
   .#{$ns}-icon-large,
   .#{$ns}-icon {
-    color: $pt-icon-color;
     flex: 0 0 auto;
     margin-left: -3px;
     margin-right: $dialog-padding * 0.5;
+
+    // only apply light color to icons that are not intent-specific
+    &:not([class*="#{$ns}-intent"]) {
+      color: $pt-icon-color;
+    }
   }
 
   .#{$ns}-heading {
@@ -127,9 +131,12 @@ $dialog-header-padding: math.div($pt-grid-size, 2);
     background: $dark-gray3;
     box-shadow: inset 0 0 0 1px $pt-dark-divider-white;
 
-    .#{$ns}-icon-large,
-    .#{$ns}-icon {
-      color: $pt-dark-icon-color;
+    // only apply dark color to icons that are not intent-specific
+    :not([class*="#{$ns}-intent"]) {
+      &.#{$ns}-icon-large,
+      &.#{$ns}-icon {
+        color: $pt-dark-icon-color;
+      }
     }
   }
 

packages/docs-app/changelog/@unreleased/pr-6947.v2.yml

@@ -0,0 +1,5 @@
+type: fix
+fix:
+  description: Respect icon intent color passed to Dialog
+  links:
+  - https://github.com/palantir/blueprint/pull/6947

packages/docs-app/src/examples/core-examples/dialogExample.tsx

@@ -25,10 +25,13 @@ import {
     DialogFooter,
     type DialogProps,
     H5,
+    Icon,
+    Intent,
     Switch,
     Tooltip,
 } from "@blueprintjs/core";
 import { Example, type ExampleProps, handleBooleanChange } from "@blueprintjs/docs-theme";
+import { IconNames } from "@blueprintjs/icons";
 
 import type { BlueprintExampleData } from "../../tags/types";
 
@@ -75,23 +78,23 @@ export class DialogExample extends React.PureComponent<ExampleProps<BlueprintExa
                 />
                 <ButtonWithDialog
                     className={this.props.data.themeName}
-                    icon="info-sign"
+                    icon={<Icon icon={IconNames.INFO_SIGN} intent={Intent.PRIMARY} />}
                     title="Palantir Foundry"
                     buttonText="Show dialog with title"
                     footerStyle="none"
                     {...this.state}
                 />
                 <ButtonWithDialog
                     className={this.props.data.themeName}
-                    icon="info-sign"
+                    icon={IconNames.INFO_SIGN}
                     title="Palantir Foundry"
                     buttonText="Show dialog with title and footer"
                     footerStyle="default"
                     {...this.state}
                 />
                 <ButtonWithDialog
                     className={this.props.data.themeName}
-                    icon="info-sign"
+                    icon={IconNames.INFO_SIGN}
                     title="Palantir Foundry"
                     buttonText="Show dialog with title and minimal footer"
                     footerStyle="minimal"