diff --git a/.changeset/button-drop-warning.md b/.changeset/button-drop-warning.md
new file mode 100644
index 000000000..19391aa0e
--- /dev/null
+++ b/.changeset/button-drop-warning.md
@@ -0,0 +1,10 @@
+---
+'@workflowbuilder/ui': major
+---
+
+`Button` no longer offers the `warning` and `ghost-warning` variants; `BUTTON_VARIANTS` and the `ButtonVariant` type shrink accordingly, and the `--wb-public-button-warning-*` and `--wb-public-button-ghost-warning-*` custom properties are gone. A warning `Snackbar` renders its action button as `secondary`.
+
+Breaking changes:
+
+- Replace `variant="warning"` with `critical` for destructive actions or `secondary` for cautionary secondary actions; replace `ghost-warning` with `ghost-critical` or `ghost-secondary`.
+- Drop any overrides of the removed `--wb-public-button-warning-*` and `--wb-public-button-ghost-warning-*` properties.
diff --git a/.changeset/import-modal-secondary.md b/.changeset/import-modal-secondary.md
new file mode 100644
index 000000000..a2c9e0474
--- /dev/null
+++ b/.changeset/import-modal-secondary.md
@@ -0,0 +1,5 @@
+---
+'@workflowbuilder/sdk': patch
+---
+
+The import dialog's "Ignore and import" action uses the `secondary` button variant instead of the removed `warning` variant.
diff --git a/apps/docs/src/components/ui-examples/button.tsx b/apps/docs/src/components/ui-examples/button.tsx
index f869f3e63..c96b85624 100644
--- a/apps/docs/src/components/ui-examples/button.tsx
+++ b/apps/docs/src/components/ui-examples/button.tsx
@@ -5,14 +5,8 @@ import styles from './button.module.css';
import { ComponentPreview } from './component-preview';
-const SOLID_VARIANTS = ['primary', 'secondary', 'critical', 'success', 'warning'] as const;
-const GHOST_VARIANTS = [
- 'ghost-primary',
- 'ghost-secondary',
- 'ghost-critical',
- 'ghost-success',
- 'ghost-warning',
-] as const;
+const SOLID_VARIANTS = ['primary', 'secondary', 'critical', 'success'] as const;
+const GHOST_VARIANTS = ['ghost-primary', 'ghost-secondary', 'ghost-critical', 'ghost-success'] as const;
export function ButtonExample() {
return (
diff --git a/packages/sdk/src/features/integration/components/import-export/import-modal/import-modal.tsx b/packages/sdk/src/features/integration/components/import-export/import-modal/import-modal.tsx
index 0dcfe5b64..50149b05c 100644
--- a/packages/sdk/src/features/integration/components/import-export/import-modal/import-modal.tsx
+++ b/packages/sdk/src/features/integration/components/import-export/import-modal/import-modal.tsx
@@ -70,7 +70,7 @@ export function ImportModal() {
{warnings.length > 0 && errors.length === 0 && (
}
onClick={() => handleImport({ shouldIgnoreWarnings: true })}
>
diff --git a/packages/ui/src/components/button/regular-button/types.ts b/packages/ui/src/components/button/regular-button/types.ts
index ae549d090..6b6eadf88 100644
--- a/packages/ui/src/components/button/regular-button/types.ts
+++ b/packages/ui/src/components/button/regular-button/types.ts
@@ -7,12 +7,10 @@ export const BUTTON_VARIANTS = [
'secondary',
'critical',
'success',
- 'warning',
'ghost-primary',
'ghost-secondary',
'ghost-critical',
'ghost-success',
- 'ghost-warning',
] as const;
export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];
diff --git a/packages/ui/src/components/button/styles/variant.module.css b/packages/ui/src/components/button/styles/variant.module.css
index 0619c4ddb..80a868b9e 100644
--- a/packages/ui/src/components/button/styles/variant.module.css
+++ b/packages/ui/src/components/button/styles/variant.module.css
@@ -33,14 +33,6 @@
--wb-public-button-success-color: var(--wb-ds-ui-text-onaccent-default);
--wb-public-button-success-color-disabled: var(--wb-ds-ui-text-disabled);
- --wb-public-button-warning-background: var(--wb-ds-components-button-solid-warning-default);
- --wb-public-button-warning-background-hover: var(--wb-ds-components-button-solid-warning-hover);
- --wb-public-button-warning-background-active: var(--wb-ds-components-button-solid-warning-active);
- --wb-public-button-warning-background-focus: var(--wb-ds-components-button-solid-warning-focus);
- --wb-public-button-warning-background-disabled: var(--wb-ds-components-button-solid-disabled);
- --wb-public-button-warning-color: var(--wb-ds-ui-text-onaccent-default);
- --wb-public-button-warning-color-disabled: var(--wb-ds-ui-text-disabled);
-
--wb-public-button-ghost-primary-background-color: var(--wb-ds-components-button-ghost-primary-default);
--wb-public-button-ghost-primary-background-color-hover: var(--wb-ds-components-button-ghost-primary-hover);
--wb-public-button-ghost-primary-background-color-active: var(--wb-ds-components-button-ghost-primary-active);
@@ -80,15 +72,6 @@
--wb-public-button-ghost-success-border-color: var(--wb-ds-components-button-ghost-success-stroke-default);
--wb-public-button-ghost-success-color: var(--wb-ds-ui-text-success-default);
--wb-public-button-ghost-success-color-disabled: var(--wb-ds-ui-text-success-disabled);
-
- --wb-public-button-ghost-warning-background-color: var(--wb-ds-components-button-ghost-warning-default);
- --wb-public-button-ghost-warning-background-color-hover: var(--wb-ds-components-button-ghost-warning-hover);
- --wb-public-button-ghost-warning-background-color-active: var(--wb-ds-components-button-ghost-warning-active);
- --wb-public-button-ghost-warning-background-color-focus: var(--wb-ds-components-button-ghost-warning-focus);
- --wb-public-button-ghost-warning-background-color-disabled: var(--wb-ds-components-button-ghost-warning-disabled);
- --wb-public-button-ghost-warning-border-color: var(--wb-ds-components-button-ghost-warning-stroke-default);
- --wb-public-button-ghost-warning-color: var(--wb-ds-ui-text-warning-default);
- --wb-public-button-ghost-warning-color-disabled: var(--wb-ds-ui-text-warning-disabled);
}
@layer ui.component {
@@ -132,21 +115,10 @@
--button-color-disabled: var(--wb-public-button-success-color-disabled);
}
- .warning {
- --button-background: var(--wb-public-button-warning-background);
- --button-background-hover: var(--wb-public-button-warning-background-hover);
- --button-background-active: var(--wb-public-button-warning-background-active);
- --button-background-focus: var(--wb-public-button-warning-background-focus);
- --button-background-disabled: var(--wb-public-button-warning-background-disabled);
- --button-color: var(--wb-public-button-warning-color);
- --button-color-disabled: var(--wb-public-button-warning-color-disabled);
- }
-
.primary,
.secondary,
.critical,
- .success,
- .warning {
+ .success {
background-color: var(--button-background);
color: var(--button-color);
@@ -228,26 +200,10 @@
--button-color-disabled: var(--wb-public-button-ghost-success-color-disabled);
}
- .ghost-warning {
- --button-background: var(--wb-public-button-ghost-warning-background-color);
- --button-background-hover: var(--wb-public-button-ghost-warning-background-color-hover);
- --button-background-active: var(--wb-public-button-ghost-warning-background-color-active);
- --button-background-focus: var(--wb-public-button-ghost-warning-background-color-focus);
- --button-background-disabled: var(--wb-public-button-ghost-warning-background-color-disabled);
- --button-border-color: var(--wb-public-button-ghost-warning-border-color);
- --button-border-color-hover: var(--wb-public-button-ghost-warning-border-color);
- --button-border-color-active: var(--wb-public-button-ghost-warning-border-color);
- --button-border-color-focus: var(--wb-public-button-ghost-warning-border-color);
- --button-border-color-disabled: var(--wb-public-button-ghost-warning-border-color);
- --button-color: var(--wb-public-button-ghost-warning-color);
- --button-color-disabled: var(--wb-public-button-ghost-warning-color-disabled);
- }
-
.ghost-primary,
.ghost-secondary,
.ghost-critical,
- .ghost-success,
- .ghost-warning {
+ .ghost-success {
--button-border-color-current: var(--button-border-color);
background-color: var(--button-background);
diff --git a/packages/ui/src/components/snackbar/components/action-buttons.tsx b/packages/ui/src/components/snackbar/components/action-buttons.tsx
index c526cd203..ee89eccf0 100644
--- a/packages/ui/src/components/snackbar/components/action-buttons.tsx
+++ b/packages/ui/src/components/snackbar/components/action-buttons.tsx
@@ -20,7 +20,7 @@ export function ActionButtons({ variant, buttonLabel, onButtonClick, close, onCl
[SnackbarType.DEFAULT]: 'primary',
[SnackbarType.ERROR]: 'critical',
[SnackbarType.INFO]: 'primary',
- [SnackbarType.WARNING]: 'warning',
+ [SnackbarType.WARNING]: 'secondary',
[SnackbarType.SUCCESS]: 'success',
};