@databricks/design-system 2.0.4 → 2.0.6

package/dist/patterns.js

@@ -1,4 +1,4 @@
-export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, u as useWizardCurrentStep } from './WizardStepContentWrapper-8bs2FwRi.js';
+export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, d as WizardStepNavigationProvider, u as useWizardCurrentStep, e as useWizardStepNavigation } from './WizardStepContentWrapper-6YTjeEaA.js';
 import '@emotion/react/jsx-runtime';
 import 'lodash/isUndefined';
 import 'react';
@@ -16,6 +16,8 @@ import '@floating-ui/dom';
 import 'react-dom';
 import '@radix-ui/react-hover-card';
 import '@radix-ui/react-toast';
+import '@radix-ui/react-slider';
+import '@radix-ui/react-toolbar';
 import '@react-aria/combobox';
 import '@react-aria/listbox';
 import '@react-aria/overlays';
@@ -52,10 +54,8 @@ import '@radix-ui/react-navigation-menu';
 import '@radix-ui/react-radio-group';
 import '@radix-ui/react-progress';
 import 'react-resizable';
-import '@radix-ui/react-slider';
 import '@radix-ui/react-scroll-area';
 import '@radix-ui/react-tabs';
 import 'lodash/debounce';
 import '@radix-ui/react-toggle';
-import '@radix-ui/react-toolbar';
 //# sourceMappingURL=patterns.js.map

package/dist-types/design-system/Breadcrumb/Breadcrumb.d.ts

@@ -1,10 +1,17 @@
-import type { BreadcrumbProps as AntDBreadcrumbPropsRaw } from "antd";
 import { Breadcrumb as AntDBreadcrumbRaw } from "antd";
 import type React from "react";
-import type { DangerouslySetAntdProps, HTMLDataAttributes, WithChildrenProps } from "../types";
-export interface BreadcrumbProps extends Pick<AntDBreadcrumbPropsRaw, "itemRender" | "params" | "routes" | "className">, HTMLDataAttributes, DangerouslySetAntdProps<AntDBreadcrumbPropsRaw> {
+import type { HTMLDataAttributes, WithChildrenProps } from "../types";
+interface BreadcrumbDangerouslySetAntdProps {
+	/** Custom separator between crumbs. Defaults to a chevron. */
+	separator?: React.ReactNode;
+}
+export interface BreadcrumbProps extends HTMLDataAttributes {
+	/** Custom className applied to the breadcrumb root */
+	className?: string;
 	/** Include trailing caret */
 	includeTrailingCaret?: boolean;
+	/** Escape hatch to allow passing props directly to the underlying Ant `Breadcrumb` component. Only known-used props are allowed. */
+	dangerouslySetAntdProps?: BreadcrumbDangerouslySetAntdProps;
 	/** The breadcrumb items */
 	children?: React.ReactNode;
 }

package/dist-types/design-system/Button/AntDButtonInternal.d.ts

@@ -0,0 +1,21 @@
+import type { SerializedStyles } from "@emotion/react";
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { ButtonProps, ButtonSize } from "./Button";
+import type { ComponentTheme } from "../../theme";
+export declare const SMALL_BUTTON_HEIGHT = 24;
+export declare const getMemoizedButtonEmotionStyles: (props: Parameters<typeof getButtonEmotionStyles>[0]) => SerializedStyles;
+export declare const getButtonEmotionStyles: ({ theme, classNamePrefix, loading, withIcon, onlyIcon, isAnchor, enableAnimation, size, type, useFocusPseudoClass, forceIconStyles, danger }: {
+	theme: ComponentTheme;
+	classNamePrefix: string;
+	loading?: boolean;
+	withIcon?: boolean;
+	onlyIcon?: boolean;
+	isAnchor?: boolean;
+	danger?: boolean;
+	enableAnimation: boolean;
+	size: ButtonSize;
+	type?: ButtonProps["type"];
+	useFocusPseudoClass?: boolean;
+	forceIconStyles?: boolean;
+}) => SerializedStyles;
+export declare const AntDButtonInternal: ForwardRefExoticComponent<PropsWithoutRef<ButtonProps> & RefAttributes<HTMLButtonElement>>;

package/dist-types/design-system/Button/Button.d.ts

@@ -1,26 +1,9 @@
-import type { SerializedStyles } from "@emotion/react";
 import type { ButtonProps as AntDButtonProps } from "antd";
 import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
-import type { ComponentTheme } from "../../theme";
-import { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
+import type { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
 import type { WithLoadingState } from "../LoadingState/LoadingState";
 import type { AnalyticsEventPropsWithStartInteraction, HTMLDataAttributes } from "../types";
-export declare const SMALL_BUTTON_HEIGHT = 24;
-export declare const getMemoizedButtonEmotionStyles: (props: Parameters<typeof getButtonEmotionStyles>[0]) => SerializedStyles;
-export declare const getButtonEmotionStyles: ({ theme, classNamePrefix, loading, withIcon, onlyIcon, isAnchor, enableAnimation, size, type, useFocusPseudoClass, forceIconStyles, danger }: {
-	theme: ComponentTheme;
-	classNamePrefix: string;
-	loading?: boolean;
-	withIcon?: boolean;
-	onlyIcon?: boolean;
-	isAnchor?: boolean;
-	danger?: boolean;
-	enableAnimation: boolean;
-	size: ButtonSize;
-	type?: ButtonProps["type"];
-	useFocusPseudoClass?: boolean;
-	forceIconStyles?: boolean;
-}) => SerializedStyles;
+export { SMALL_BUTTON_HEIGHT, getButtonEmotionStyles, getMemoizedButtonEmotionStyles } from "./AntDButtonInternal";
 export type ButtonSize = "middle" | "small";
 export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "shape" | "size">, HTMLDataAttributes, Omit<WithLoadingState, "loading">, AnalyticsEventPropsWithStartInteraction<DesignSystemEventProviderAnalyticsEventTypes.OnClick | DesignSystemEventProviderAnalyticsEventTypes.OnView> {
 	type?: "primary" | "link" | "tertiary";
@@ -29,5 +12,6 @@ export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "s
 	dangerouslySetForceIconStyles?: boolean;
 	dangerouslyUseFocusPseudoClass?: boolean;
 	dangerouslyAppendWrapperCss?: React.CSSProperties;
+	useNativeButtonOverride?: boolean;
 }
 export declare const Button: ForwardRefExoticComponent<PropsWithoutRef<ButtonProps> & RefAttributes<HTMLButtonElement>>;

package/dist-types/design-system/Button/NativeButton.d.ts

@@ -0,0 +1,3 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { ButtonProps } from "./Button";
+export declare const NativeButton: ForwardRefExoticComponent<PropsWithoutRef<ButtonProps> & RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;

package/dist-types/design-system/Button/getBtnClassName.d.ts

@@ -0,0 +1,17 @@
+/**
+* Emotion selector that matches a Du Bois button by BOTH its legacy AntD-prefixed class
+* (`.<clsNamePrefix>-btn…`) and the NativeButton class (`.db-btn…`). Style overrides keyed off the
+* button class must match `.db-btn` too, so they survive the migration off the AntD-prefixed
+* `Button` onto `NativeButton`.
+*
+* @param clsNamePrefix theme class prefix, e.g. `classNamePrefix` from `useDesignSystemTheme()`.
+* @param suffix raw selector fragment appended after `-btn` on each class — e.g. `'-primary'`,
+*   `'-icon-only'`, `':first-child'`, `'[disabled]'`, `' > span'`, or `''` for none. Include the
+*   leading `-` yourself.
+* @param prefix combinator/anchor prepended before each class — pass it explicitly so the call reads
+*   at a glance: `'&'` for a self-target selector (`&.…-btn`, when the `css` sits on the Button
+*   element itself), `''` for a bare descendant (`.…-btn`), `'& > '` for a direct child, `'& '` for
+*   any descendant, or a fuller container prefix (e.g. `` `.${prefix}-dropdown-button > ` ``) when the
+*   button is nested deeper.
+*/
+export declare const getBtnClassName: (clsNamePrefix: string, suffix: string, prefix: string) => string;

package/dist-types/design-system/Button/index.d.ts

@@ -1 +1,2 @@
 export * from "./Button";
+export * from "./getBtnClassName";

package/dist-types/design-system/DesignSystemProvider/DesignTokenScopeWithEmotionTheme.d.ts

@@ -1,4 +1,4 @@
-import type { PropsWithChildren } from "react";
+import { type PropsWithChildren } from "react";
 import type { Theme } from "../../theme";
 export interface DesignTokenScopeWithEmotionThemeProps {
 	theme: Theme;
@@ -8,9 +8,9 @@ export interface DesignTokenScopeWithEmotionThemeProps {
 * a full emotion `Theme` on top of `DesignTokenScope` so the override stays consistent across both
 * delivery paths that would otherwise diverge:
 *   1. Emotion JS theme — what legacy AntD-path components read; crosses React portals via context.
-*   2. Design tokens (in-tree + portaled) — `DesignTokenScope` stamps the theme's colors as native
-*      `--db-color-*` variables on its DOM scope and feeds `DesignSystemThemeContext`, so both in-tree
-*      and portaled native (token-based) components inherit them.
+*   2. Design tokens (in-tree + portaled) — `DesignTokenScope` stamps the colors that differ from the
+*      ambient theme as native `--db-color-*` variables and feeds `DesignSystemThemeContext`, so both
+*      in-tree and portaled native (token-based) components inherit them.
 *
 * A bare emotion `ThemeProvider` only drives path 1, so an overridden theme's colors would land on
 * AntD components but leave native ones on the ambient scope's standard tokens. Once everything is on

package/dist-types/design-system/Drawer/Drawer.d.ts

@@ -84,7 +84,9 @@ export interface DrawerContentProps extends AnalyticsEventProps<DesignSystemEven
 	* Applies emotion styles to the top-level element in the component.
 	*/
 	css?: Interpolation<EmotionTheme>;
+	/** Applies a class name to the top-level element in the component. */
+	className?: string;
 }
-export declare const Content: ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId, analyticsEvents, size, ...props }: DrawerContentProps) => JSX.Element;
+export declare const Content: ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId, analyticsEvents, size, className, ...props }: DrawerContentProps) => JSX.Element;
 export declare function Root(props: Pick<DialogPrimitive.DialogProps, "onOpenChange" | "children" | "open" | "modal">): JSX.Element;
 export declare function Trigger(props: Omit<DialogPrimitive.DialogTriggerProps, "asChild">): JSX.Element;

package/dist-types/design-system/FormV2/RHFAdapters.d.ts

@@ -3,6 +3,7 @@ import type { UseComboboxReturnValue } from "downshift";
 import type { HTMLAttributes } from "react";
 import React from "react";
 import type { Control, FieldPath, FieldValues, UseControllerProps } from "react-hook-form";
+import type { RHFControlledMultiSelectTypeaheadComboboxV2Props, RHFControlledTypeaheadComboboxV2Props } from "./RHFControlledTypeaheadComboboxV2";
 import type { CheckboxProps } from "../Checkbox";
 import type { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
 import type { ConditionalOptionalLabel, DialogComboboxContentProps, DialogComboboxOptionListProps, DialogComboboxProps, DialogComboboxTriggerProps } from "../DialogCombobox";
@@ -146,6 +147,11 @@ interface RHFControlledMultiSelectTypeaheadComboboxProps<
 	onInputChange?: (inputValue: string) => void;
 }
 declare function RHFControlledMultiSelectTypeaheadCombobox<TFieldValues extends FieldValues>({ name, control, rules, allItems, itemToString, matcher, children, validationState, inputProps, menuProps, onInputChange, componentId, analyticsEvents, valueHasNoPii, ...props }: RHFControlledMultiSelectTypeaheadComboboxProps<TFieldValues> & Omit<HTMLAttributes<HTMLDivElement>, "children">): JSX.Element;
+declare function RHFControlledTypeaheadComboboxV2<
+	TFieldValues extends FieldValues,
+	TName extends FieldPath<TFieldValues>
+>(props: RHFControlledTypeaheadComboboxV2Props<TFieldValues, TName> & Omit<HTMLAttributes<HTMLDivElement>, "children">): JSX.Element;
+declare function RHFControlledMultiSelectTypeaheadComboboxV2<TFieldValues extends FieldValues>(props: RHFControlledMultiSelectTypeaheadComboboxV2Props<TFieldValues> & Omit<HTMLAttributes<HTMLDivElement>, "children">): JSX.Element;
 interface RHFControlledCheckboxGroupProps<
 	TFieldValues extends FieldValues = FieldValues,
 	TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
@@ -198,6 +204,8 @@ export declare const RHFControlledComponents: {
 	RadioGroup: typeof RHFControlledRadioGroup;
 	TypeaheadCombobox: typeof RHFControlledTypeaheadCombobox;
 	MultiSelectTypeaheadCombobox: typeof RHFControlledMultiSelectTypeaheadCombobox;
+	TypeaheadComboboxV2: typeof RHFControlledTypeaheadComboboxV2;
+	MultiSelectTypeaheadComboboxV2: typeof RHFControlledMultiSelectTypeaheadComboboxV2;
 	Switch: typeof RHFControlledSwitch;
 };
 export {};

package/dist-types/design-system/FormV2/RHFControlledTypeaheadComboboxV2.d.ts

@@ -0,0 +1,58 @@
+import type { Key } from "@react-types/shared";
+import type { HTMLAttributes } from "react";
+import React from "react";
+import type { Control, FieldPath, FieldValues, UseControllerProps } from "react-hook-form";
+import type { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
+import type { TypeaheadComboboxInputProps as TypeaheadComboboxV2InputProps } from "../TypeaheadComboboxV2/TypeaheadComboboxInput";
+import type { TypeaheadComboboxMenuProps as TypeaheadComboboxV2MenuProps } from "../TypeaheadComboboxV2/TypeaheadComboboxMenu";
+import type { TypeaheadComboboxMultiSelectInputProps as TypeaheadComboboxV2MultiSelectInputProps } from "../TypeaheadComboboxV2/TypeaheadComboboxMultiSelectInput";
+import type { TypeaheadComboboxRootProps as TypeaheadComboboxV2RootProps } from "../TypeaheadComboboxV2/TypeaheadComboboxRoot";
+import type { ComboboxStateValue } from "../TypeaheadComboboxV2/hooks/useComboboxState";
+import type { AnalyticsEventValueChangeNoPiiFlagProps, ValidationState } from "../types";
+type OmittedOriginalProps = "name" | "onChange" | "onBlur" | "value" | "defaultValue" | "checked";
+export interface RHFControlledTypeaheadComboboxV2Props<
+	TFieldValues extends FieldValues = FieldValues,
+	TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+> extends Omit<TypeaheadComboboxV2RootProps<TFieldValues[TName]>, OmittedOriginalProps | "comboboxState" | "componentId" | "children">, UseControllerProps<TFieldValues, TName>, AnalyticsEventValueChangeNoPiiFlagProps<DesignSystemEventProviderAnalyticsEventTypes.OnValueChange> {
+	control: Control<TFieldValues, any>;
+	name: TName;
+	children: (renderProps: {
+		comboboxState: ComboboxStateValue<Required<TFieldValues>[TName]>;
+	}) => React.ReactNode;
+	validationState?: ValidationState;
+	allItems: Required<TFieldValues>[TName][];
+	itemToString: (item: Required<TFieldValues>[TName]) => string;
+	matcher?: (item: Required<TFieldValues>[TName], query: string) => boolean;
+	getKey?: (item: Required<TFieldValues>[TName]) => Key;
+	allowNewValue?: boolean;
+	inputProps?: Partial<Omit<TypeaheadComboboxV2InputProps, "componentId">>;
+	menuProps?: Partial<TypeaheadComboboxV2MenuProps>;
+	onInputChange?: (inputValue: string) => void;
+	/** @deprecated No-op under react-aria; accepted for source-compat while migrating off the legacy adapter. */
+	preventUnsetOnBlur?: boolean;
+}
+export declare function RHFControlledTypeaheadComboboxV2<
+	TFieldValues extends FieldValues,
+	TName extends FieldPath<TFieldValues>
+>({ name, control, rules, allItems, itemToString, matcher, getKey, allowNewValue, children, validationState, inputProps, menuProps, onInputChange, componentId, analyticsEvents, valueHasNoPii, preventUnsetOnBlur, ...props }: RHFControlledTypeaheadComboboxV2Props<TFieldValues, TName> & Omit<HTMLAttributes<HTMLDivElement>, "children">): JSX.Element;
+export interface RHFControlledMultiSelectTypeaheadComboboxV2Props<
+	TFieldValues extends FieldValues = FieldValues,
+	TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+> extends Omit<TypeaheadComboboxV2RootProps<TFieldValues>, OmittedOriginalProps | "comboboxState" | "componentId" | "children">, UseControllerProps<TFieldValues, TName>, AnalyticsEventValueChangeNoPiiFlagProps<DesignSystemEventProviderAnalyticsEventTypes.OnValueChange> {
+	control: Control<any, TFieldValues>;
+	name: any;
+	children: (renderProps: {
+		comboboxState: ComboboxStateValue<TFieldValues>;
+		selectedItems: TFieldValues[];
+	}) => React.ReactNode;
+	validationState?: ValidationState;
+	allItems: TFieldValues[];
+	itemToString: (item: TFieldValues) => string;
+	matcher?: (item: TFieldValues, query: string) => boolean;
+	getKey?: (item: TFieldValues) => Key;
+	inputProps?: Partial<Omit<TypeaheadComboboxV2MultiSelectInputProps<TFieldValues>, "selectedItems" | "setSelectedItems" | "getSelectedItemLabel">>;
+	menuProps?: Partial<TypeaheadComboboxV2MenuProps>;
+	onInputChange?: (inputValue: string) => void;
+}
+export declare function RHFControlledMultiSelectTypeaheadComboboxV2<TFieldValues extends FieldValues>({ name, control, rules, allItems, itemToString, matcher, getKey, children, validationState, inputProps, menuProps, onInputChange, componentId, analyticsEvents, valueHasNoPii, ...props }: RHFControlledMultiSelectTypeaheadComboboxV2Props<TFieldValues> & Omit<HTMLAttributes<HTMLDivElement>, "children">): JSX.Element;
+export {};

package/dist-types/design-system/Icon/AntdIcon.d.ts

@@ -0,0 +1,3 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "./Icon";
+export declare const AntdIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;

package/dist-types/design-system/Icon/Icon.d.ts

@@ -1,12 +1,26 @@
-import AntDIcon from "@ant-design/icons";
-import type { ForwardRefExoticComponent, PropsWithoutRef, ReactElement, RefAttributes } from "react";
+import type { ComponentType, CSSProperties, ForwardRefExoticComponent, HTMLProps, PropsWithoutRef, ReactElement, RefAttributes, SVGProps } from "react";
 import React from "react";
-import type { DangerouslySetAntdProps, HTMLDataAttributes } from "../types";
-type AntDIconProps = Omit<React.ComponentProps<typeof AntDIcon>, "onPointerEnterCapture" | "onPointerLeaveCapture">;
+import type { HTMLDataAttributes } from "../types";
+export { getIconClassName } from "./utils";
 export type IconColors = "danger" | "warning" | "success" | "ai";
-export interface IconProps extends Omit<AntDIconProps, "component">, DangerouslySetAntdProps<AntDIconProps>, HTMLDataAttributes, React.HTMLAttributes<HTMLSpanElement> {
-	component?: (props: React.SVGProps<SVGSVGElement>) => ReactElement | null;
+interface CustomIconComponentProps {
+	width: string | number;
+	height: string | number;
+	fill: string;
+	viewBox?: string;
+	className?: string;
+	style?: CSSProperties;
+}
+interface IconCompatibilityProps extends Omit<HTMLProps<HTMLSpanElement>, "onPointerEnterCapture" | "onPointerLeaveCapture"> {
+	spin?: boolean;
+	rotate?: number;
+	viewBox?: string;
+	component?: ComponentType<CustomIconComponentProps | SVGProps<SVGSVGElement>> | ForwardRefExoticComponent<CustomIconComponentProps>;
+	ariaLabel?: React.AriaAttributes["aria-label"];
+}
+export interface IconProps extends Omit<IconCompatibilityProps, "component">, HTMLDataAttributes, React.HTMLAttributes<HTMLSpanElement> {
+	component?: (props: SVGProps<SVGSVGElement>) => ReactElement | null;
 	color?: IconColors;
+	forceNativeIcon?: boolean;
 }
 export declare const Icon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
-export {};

package/dist-types/design-system/Icon/NativeIcon.d.ts

@@ -0,0 +1,3 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "./Icon";
+export declare const NativeIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;

package/dist-types/design-system/Icon/__generated/icons/ColorMappingEditIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const ColorMappingEditIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default ColorMappingEditIcon;

package/dist-types/design-system/Icon/__generated/icons/ColorMappingIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const ColorMappingIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default ColorMappingIcon;

package/dist-types/design-system/Icon/__generated/icons/LakewatchIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const LakewatchIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default LakewatchIcon;

package/dist-types/design-system/Icon/__generated/icons/MicrophoneIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const MicrophoneIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default MicrophoneIcon;

package/dist-types/design-system/Icon/__generated/icons/MicrophoneOffIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const MicrophoneOffIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default MicrophoneOffIcon;

package/dist-types/design-system/Icon/__generated/icons/OperatorIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const OperatorIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default OperatorIcon;

package/dist-types/design-system/Icon/__generated/icons/VoiceModeIcon.d.ts

@@ -0,0 +1,4 @@
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import type { IconProps } from "../../Icon";
+declare const VoiceModeIcon: ForwardRefExoticComponent<PropsWithoutRef<IconProps> & RefAttributes<HTMLSpanElement>>;
+export default VoiceModeIcon;

package/dist-types/design-system/Icon/__generated/icons/index.d.ts

@@ -120,6 +120,8 @@ export { default as CloudOffIcon } from "./CloudOffIcon";
 export { default as CloudUploadIcon } from "./CloudUploadIcon";
 export { default as CodeIcon } from "./CodeIcon";
 export { default as ColorFillIcon } from "./ColorFillIcon";
+export { default as ColorMappingEditIcon } from "./ColorMappingEditIcon";
+export { default as ColorMappingIcon } from "./ColorMappingIcon";
 export { default as ColumnIcon } from "./ColumnIcon";
 export { default as ColumnSplitIcon } from "./ColumnSplitIcon";
 export { default as ColumnTagIcon } from "./ColumnTagIcon";
@@ -243,6 +245,7 @@ export { default as LakeflowDesignerIcon } from "./LakeflowDesignerIcon";
 export { default as LakewatchAlertIcon } from "./LakewatchAlertIcon";
 export { default as LakewatchDatasourceIcon } from "./LakewatchDatasourceIcon";
 export { default as LakewatchDetectionRuleIcon } from "./LakewatchDetectionRuleIcon";
+export { default as LakewatchIcon } from "./LakewatchIcon";
 export { default as LakewatchParserIcon } from "./LakewatchParserIcon";
 export { default as LayerGraphIcon } from "./LayerGraphIcon";
 export { default as LayerIcon } from "./LayerIcon";
@@ -276,6 +279,8 @@ export { default as McpIcon } from "./McpIcon";
 export { default as MeasureIcon } from "./MeasureIcon";
 export { default as MegaphoneIcon } from "./MegaphoneIcon";
 export { default as MenuIcon } from "./MenuIcon";
+export { default as MicrophoneIcon } from "./MicrophoneIcon";
+export { default as MicrophoneOffIcon } from "./MicrophoneOffIcon";
 export { default as MinusCircleFillIcon } from "./MinusCircleFillIcon";
 export { default as MinusCircleIcon } from "./MinusCircleIcon";
 export { default as MinusCircleSmallIcon } from "./MinusCircleSmallIcon";
@@ -297,6 +302,7 @@ export { default as NumberFormatIcon } from "./NumberFormatIcon";
 export { default as NumbersIcon } from "./NumbersIcon";
 export { default as OfficeIcon } from "./OfficeIcon";
 export { default as OntologyIcon } from "./OntologyIcon";
+export { default as OperatorIcon } from "./OperatorIcon";
 export { default as OverflowHorizontalIcon } from "./OverflowHorizontalIcon";
 export { default as OverflowIcon } from "./OverflowIcon";
 export { default as PageBottomIcon } from "./PageBottomIcon";
@@ -469,6 +475,7 @@ export { default as UserTeamIcon } from "./UserTeamIcon";
 export { default as VisibleFillIcon } from "./VisibleFillIcon";
 export { default as VisibleIcon } from "./VisibleIcon";
 export { default as VisibleOffIcon } from "./VisibleOffIcon";
+export { default as VoiceModeIcon } from "./VoiceModeIcon";
 export { default as WarningFillIcon } from "./WarningFillIcon";
 export { default as WarningIcon } from "./WarningIcon";
 export { default as WorkflowCodeIcon } from "./WorkflowCodeIcon";

package/dist-types/design-system/Icon/index.d.ts

@@ -1,3 +1,4 @@
 export { Icon } from "./Icon";
 export type { IconProps } from "./Icon";
+export { getIconClassName } from "./utils";
 export * from "./__generated/icons";

package/dist-types/design-system/Icon/utils.d.ts

@@ -0,0 +1 @@
+export declare function getIconClassName(): string;

package/dist-types/design-system/Overflow/Overflow.d.ts

@@ -8,6 +8,8 @@ export interface OverflowProps extends PopoverProps {
 	* @default 1
 	*/
 	visibleItemsCount?: number;
+	/** Opens the overflow menu on mount; passed through to the underlying Popover. */
+	defaultOpen?: boolean;
 	children: React.ReactNode;
 }
-export declare const Overflow: ({ children, noMargin, visibleItemsCount, ...props }: OverflowProps) => React.ReactElement;
+export declare const Overflow: ({ children, noMargin, visibleItemsCount, defaultOpen, ...props }: OverflowProps) => React.ReactElement;

package/dist-types/design-system/Overflow/OverflowPopover.d.ts

@@ -4,6 +4,7 @@ interface OverflowPopoverProps extends PopoverProps {
 	renderLabel?: (label: string) => React.ReactNode;
 	tooltipText?: string;
 	ariaLabel?: string;
+	defaultOpen?: boolean;
 }
-export declare const OverflowPopover: ({ items, renderLabel, tooltipText, ariaLabel, ...props }: OverflowPopoverProps) => JSX.Element;
+export declare const OverflowPopover: ({ items, renderLabel, tooltipText, ariaLabel, defaultOpen, ...props }: OverflowPopoverProps) => JSX.Element;
 export {};

package/dist-types/design-system/TypeaheadComboboxV2/TypeaheadComboboxMenu.d.ts

@@ -13,5 +13,7 @@ export interface TypeaheadComboboxMenuProps extends HTMLAttributes<HTMLUListElem
 	virtualizerRef?: Ref<HTMLUListElement>;
 	children?: ReactNode;
 	matchTriggerWidth?: boolean;
+	/** Gap in px between the trigger and the menu. */
+	offset?: number;
 }
 export declare const TypeaheadComboboxMenu: ForwardRefExoticComponent<TypeaheadComboboxMenuProps & RefAttributes<HTMLElement | null>>;

package/dist-types/design-system/_shared_/Tabs/styles.d.ts

@@ -1,4 +1,3 @@
 import type { CSSObject } from "@emotion/react";
-import type { Theme } from "../../../theme";
-export declare const getCommonTabsListStyles: (theme: Theme) => CSSObject;
-export declare const getCommonTabsTriggerStyles: (theme: Theme) => CSSObject;
+export declare const COMMON_TABS_LIST_STYLES: CSSObject;
+export declare const COMMON_TABS_TRIGGER_STYLES: CSSObject;

package/dist-types/design-system/shape-tokens.d.ts

@@ -2,6 +2,6 @@ export declare enum ShapeTokens {
 	ACTION_BORDER_RADIUS = "--action-border-radius",
 	INPUT_BORDER_RADIUS = "--input-border-radius",
 	LIST_ITEM_BORDER_RADIUS = "--list-item-border-radius",
-	POPOVER_BORDER_RADIUS = "--popover-border-radius",
+	POPUP_BORDER_RADIUS = "--popup-border-radius",
 	INFO_CONTAINER_BORDER_RADIUS = "--info-container-border-radius"
 }

package/dist-types/test-utils/rtl/buttonVariants.d.ts

@@ -1,8 +1,8 @@
 export declare const BUTTON_VARIANT_CLASS_TOKENS: {
-	readonly primary: readonly ["du-bois-light-btn-primary", "du-bois-dark-btn-primary", "ant-btn-primary", "ds-btn-primary"];
-	readonly dangerous: readonly ["du-bois-light-btn-dangerous", "du-bois-dark-btn-dangerous", "ant-btn-dangerous", "ds-btn-danger"];
-	readonly block: readonly ["du-bois-light-btn-block", "du-bois-dark-btn-block", "ant-btn-block", "ds-btn-block"];
-	readonly link: readonly ["du-bois-light-btn-link", "du-bois-dark-btn-link", "ant-btn-link", "ds-btn-link"];
+	readonly primary: readonly ["du-bois-light-btn-primary", "du-bois-dark-btn-primary", "ant-btn-primary", "db-btn-primary"];
+	readonly dangerous: readonly ["du-bois-light-btn-dangerous", "du-bois-dark-btn-dangerous", "ant-btn-dangerous", "db-btn-danger"];
+	readonly block: readonly ["du-bois-light-btn-block", "du-bois-dark-btn-block", "ant-btn-block", "db-btn-block"];
+	readonly link: readonly ["du-bois-light-btn-link", "du-bois-dark-btn-link", "ant-btn-link", "db-btn-link"];
 };
 export type ButtonVariant = keyof typeof BUTTON_VARIANT_CLASS_TOKENS;
 export declare const isPrimaryButton: (button: Element) => boolean;

package/dist-types/~patterns/Wizard/WizardModal.d.ts

@@ -3,4 +3,4 @@ import { type ModalProps } from "../../design-system";
 export interface WizardModalProps extends Omit<ModalProps, "footer" | "onCancel" | "onOk">, Omit<WizardProps, "width" | "layout" | "title"> {
 	onModalClose: () => void;
 }
-export declare function WizardModal({ onStepChanged, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }: WizardModalProps): JSX.Element | null;
+export declare function WizardModal({ onStepChanged, onValidateStepChange, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }: WizardModalProps): JSX.Element | null;

package/dist-types/~patterns/Wizard/WizardStepNavigation.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from "react";
+export interface WizardStepNavigation {
+	goToStep: (step: number) => void;
+	currentStepIndex: number;
+}
+export declare function useWizardStepNavigation(): WizardStepNavigation | undefined;
+export declare function WizardStepNavigationProvider({ goToStep, currentStepIndex, children }: WizardStepNavigation & {
+	children: ReactNode;
+}): JSX.Element;

package/dist-types/~patterns/Wizard/index.d.ts

@@ -2,6 +2,7 @@ export * from "./Wizard";
 export * from "./WizardProps";
 export * from "./useWizardCurrentStep";
 export type { WizardStep } from "./WizardStep";
+export * from "./WizardStepNavigation";
 export * from "./WizardModal";
 export * from "./DocumentationSidebar";
 export * from "./WizardStepContentWrapper";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@databricks/design-system",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "description": "DuBois Design System",
   "keywords": [],
   "license": "ISC",
@@ -16,6 +16,7 @@
   "types": "dist-types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
+    "./icon-metadata.json": "./dist/icon-metadata.json",
     ".": {
       "types": "./dist-types/index.d.ts",
       "import": "./dist/index.js",
@@ -56,7 +57,8 @@
     "/CHANGELOG.md",
     "dist",
     "dist-types",
-    "test-utils"
+    "test-utils",
+    "/design-guidance"
   ],
   "scripts": {
     "prepublish": "./scripts/prepublish",
@@ -84,6 +86,8 @@
     "test:watch": "yarn test --watch",
     "type-check": "tsc --noEmit --project ./tsconfig.json",
     "type-check:watch": "yarn type-check --watch",
+    "figma:publish": "figma connect publish",
+    "figma:unpublish": "figma connect unpublish",
     "check-all": "yarn type-check && yarn format:check && yarn lint",
     "fix-all": "yarn generate && yarn format && yarn indexes-regenerate && yarn lint:fix && yarn type-check",
     "prep-deps": ": # magic task to allow yarn ensure-deps plugin prepare dependencies of this package"
@@ -99,6 +103,7 @@
     "@emotion/cache": "^11.11.0",
     "@emotion/react": "^11.11.3",
     "@faker-js/faker": "^9.8.0",
+    "@figma/code-connect": "^2.0.0",
     "@jest/globals": "^30.0.2",
     "@svgr/cli": "^8.1.0",
     "@swc/core": "^1.15.47",
@@ -110,8 +115,8 @@
     "@types/jscodeshift": "^0.11.2",
     "@types/lodash": "^4.17.14",
     "@types/node": "24.12.0",
-    "@types/react": "^17.0.50",
-    "@types/react-dom": "^17.0.17",
+    "@types/react": "^18.3.31",
+    "@types/react-dom": "^18.3.7",
     "@types/react-resizable": "^3.0.3",
     "eslint-import-resolver-typescript": "^3.6.1",
     "glob": "^8.0.1",
@@ -169,7 +174,6 @@
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.1.0",
     "@testing-library/user-event": "^14.5.2",
-    "@types/use-sync-external-store": "^1.5.0",
     "antd": "4.16.8",
     "chroma-js": "^2.4.2",
     "classnames": "^2.3.1",