@databricks/design-system 2.0.5 → 2.0.7

package/dist/{WizardStepContentWrapper-Bq1wm0V7.js → WizardStepContentWrapper-bbh_CoIf.js}

@@ -1,9 +1,9 @@
 import { jsx, Fragment, jsxs } from '@emotion/react/jsx-runtime';
 import isUndefined from 'lodash/isUndefined';
 import * as React from 'react';
-import React__default, { useRef, useEffect, useMemo, useCallback, useContext, createContext, useState, forwardRef, useLayoutEffect, useImperativeHandle, Children } from 'react';
+import React__default, { useRef, useEffect, useMemo, useCallback, useContext, createContext, useState, forwardRef, useLayoutEffect, useImperativeHandle, Children, isValidElement } from 'react';
 import { useTheme, ThemeProvider, css, keyframes, ClassNames, Global, createElement } from '@emotion/react';
-import { ConfigProvider, notification, Collapse, Button as Button$2, Typography as Typography$1, Checkbox as Checkbox$1, Input as Input$2, Select as Select$1, Radio as Radio$1, Layout as Layout$1, Form as Form$1, Pagination as Pagination$1, Table, Tooltip as Tooltip$1, Dropdown, Tree as Tree$1 } from 'antd';
+import { ConfigProvider, notification, Collapse, Button as Button$1, Typography as Typography$1, Checkbox as Checkbox$1, Input as Input$2, Select as Select$1, Radio as Radio$1, Layout as Layout$1, Form as Form$1, Pagination as Pagination$1, Table, Dropdown, Tree as Tree$1 } from 'antd';
 import classnames from 'classnames';
 import { useMergeRefs } from '@floating-ui/react';
 import uniqueId$1 from 'lodash/uniqueId';
@@ -16,6 +16,8 @@ import '@floating-ui/dom';
 import { createPortal } from '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 { useOption } from '@react-aria/listbox';
 import '@react-aria/overlays';
@@ -42,23 +44,21 @@ import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as RadixTooltip from '@radix-ui/react-tooltip-patch';
 import { TooltipProvider } from '@radix-ui/react-tooltip-patch';
 import kebabCase from 'lodash/kebabCase';
-import AntDIcon, { EllipsisOutlined } from '@ant-design/icons';
+import AntdIconBase, { EllipsisOutlined } from '@ant-design/icons';
 import random from 'lodash/random';
 import times from 'lodash/times';
 import { ContextMenuArrow, ContextMenuSub, ContextMenuGroup, ContextMenuTrigger, ContextMenuItemIndicator, ContextMenuCheckboxItem, ContextMenuPortal, ContextMenuContent, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuSeparator, ContextMenuRadioItem, ContextMenuRadioGroup, ContextMenuItem, ContextMenuLabel, ContextMenu as ContextMenu$2 } from '@radix-ui/react-context-menu';
-import { DayPicker, useDayRender, Button as Button$3 } from 'react-day-picker';
+import { DayPicker, useDayRender, Button as Button$2 } from 'react-day-picker';
 import { tabbable } from 'tabbable';
 import { useCombobox, useMultipleSelection } from 'downshift';
 import * as RadixNavigationMenu from '@radix-ui/react-navigation-menu';
 import { RadioGroupItem, RadioGroup as RadioGroup$2 } from '@radix-ui/react-radio-group';
 import * as Progress$1 from '@radix-ui/react-progress';
 import { ResizableBox } from 'react-resizable';
-import * as RadixSlider from '@radix-ui/react-slider';
 import * as ScrollArea from '@radix-ui/react-scroll-area';
 import * as RadixTabs from '@radix-ui/react-tabs';
 import debounce from 'lodash/debounce';
 import * as Toggle from '@radix-ui/react-toggle';
-import * as RadixToolbar from '@radix-ui/react-toolbar';
 
 /**
  * Used to hide text visually, but still be readable by screen-readers
@@ -77,6 +77,16 @@ import * as RadixToolbar from '@radix-ui/react-toolbar';
     }
 };
 
+function shouldUseTestDefaultFlagValues() {
+    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {
+        return true;
+    }
+    const globalWithMarker = globalThis;
+    return Boolean(globalWithMarker.__DATABRICKS_USE_TEST_DEFAULT_FLAG_VALUES__ || globalWithMarker.window?.__DATABRICKS_USE_TEST_DEFAULT_FLAG_VALUES__);
+}
+function resolveFlagFallback(defaultValue, testDefault) {
+    return testDefault !== undefined && shouldUseTestDefaultFlagValues() ? testDefault : defaultValue;
+}
 /**
  * Provides access to http://go/safex flags from the frontend. Note that this is a temporary
  * workaround until direct `safex` imports are available.
@@ -87,22 +97,23 @@ import * as RadixToolbar from '@radix-ui/react-toolbar';
  *
  * @param flag The name of the flag to check
  * @param defaultValue The default value to return if the flag is not set
+ * @param testDefault The default to use in Jest or UiTestServer tests
  * @returns
- */ const safex = (flag, defaultValue)=>{
+ */ const safex = (flag, defaultValue, testDefault)=>{
     // Catching errors here, because we don't have type-safety to ensure
     // that `__debug__safex`'s API hasn't changed.
     try {
         const globalSafex = window.__debug__safex;
         if (globalSafex) {
-            return globalSafex(flag, defaultValue);
+            return globalSafex(flag, defaultValue, testDefault);
         }
         const override = globalThis.__TEST_FLAG_OVERRIDES__?.[flag];
         if (override !== undefined) {
             return override;
         }
-        return defaultValue;
+        return resolveFlagFallback(defaultValue, testDefault);
     } catch (e) {
-        return defaultValue;
+        return resolveFlagFallback(defaultValue, testDefault);
     }
 };
 /**
@@ -114,13 +125,14 @@ import * as RadixToolbar from '@radix-ui/react-toolbar';
  *
  * @param flag The name of the flag to check
  * @param defaultValue The default value to return if the flag is not set
+ * @param testDefault The default to use in Jest or UiTestServer tests
  * @returns
- */ const serverSideSafe = (flag, defaultValue)=>{
+ */ const serverSideSafe = (flag, defaultValue, testDefault)=>{
     try {
         // Delegate to web-shared's serverSideSafe if available (includes local overrides)
         const globalServerSideSafe = window.__debug__serverSideSafe;
         if (globalServerSideSafe) {
-            return globalServerSideSafe(flag, defaultValue);
+            return globalServerSideSafe(flag, defaultValue, testDefault);
         }
         // Fallback: check server-side flags directly
         const explicitOverride = window.__DATABRICKS_SAFE_FLAGS__?.[flag];
@@ -131,9 +143,9 @@ import * as RadixToolbar from '@radix-ui/react-toolbar';
         if (envOverride !== undefined) {
             return envOverride;
         }
-        return defaultValue;
+        return resolveFlagFallback(defaultValue, testDefault);
     } catch (e) {
-        return defaultValue;
+        return resolveFlagFallback(defaultValue, testDefault);
     }
 };
 
@@ -249,7 +261,7 @@ const primitiveColors = {
     neutral650: '#424242',
     neutral700: '#262626',
     neutral800: '#161616',
-    neutralWarm050: '#F9F7F4',
+    neutralWarm050: '#FCFBF9',
     orange: '#FF3621',
     pink: '#B45091',
     purple: '#8A63BF',
@@ -688,7 +700,6 @@ const heightBase = 40;
 const borderWidth = 1;
 const antdGeneralVariables = {
     classnamePrefix: antdVars['ant-prefix'],
-    iconfontCssPrefix: 'anticon',
     borderRadiusBase: 4,
     borderWidth: borderWidth,
     heightSm: 32,
@@ -1755,8 +1766,10 @@ const getAnimationCss = memoize((enableAnimation)=>{
         ...disableAnimationCss,
         '&::before': disableAnimationCss,
         '&::after': disableAnimationCss,
-        // Also apply to all child elements with a class that starts with our prefix
-        [`[class*=du-bois]:not(.${DU_BOIS_ENABLE_ANIMATION_CLASSNAME}, .${DU_BOIS_ENABLE_ANIMATION_CLASSNAME} *)`]: {
+        // Also apply to all child elements with a class that starts with our prefix, except elements
+        // which must keep their own animation. Mark those elements directly rather than matching an
+        // ancestor scope for every Du Bois descendant.
+        [`[class*=du-bois]:not(.${DU_BOIS_ENABLE_ANIMATION_CLASSNAME})`]: {
             ...disableAnimationCss,
             // Also target any pseudo-elements associated with those elements, since these can also be animated.
             '&::before': disableAnimationCss,
@@ -1860,6 +1873,20 @@ function semanticColorsToStyle(semanticColors) {
         children: children
     });
 };
+// Entries of `overrides` that differ from `ambient` (added or changed) — what a scope contributes on
+// top of the tokens it already inherits. Empty when the scope changes nothing over ambient.
+function getChangedEntries(overrides, ambient) {
+    const changed = {};
+    if (overrides === undefined) return changed;
+    // Object.keys widens to string[]; the cast restores the key union so the record indexing type-checks.
+    for (const key of Object.keys(overrides)){
+        const value = overrides[key];
+        if (value !== undefined && value !== ambient?.[key]) {
+            changed[key] = value;
+        }
+    }
+    return changed;
+}
 /**
  * Applies design-token overrides to a component or page subtree, reaching BOTH in-tree components and
  * portaled surfaces (Modal, Drawer, DropdownMenu, Popover, Notification, …). This is the primitive to
@@ -1902,6 +1929,32 @@ function semanticColorsToStyle(semanticColors) {
         ambient.designTokenOverrides,
         overrideTokens
     ]);
+    // What THIS scope changes vs the ambient one. The cumulative maps above feed the context, so portaled
+    // surfaces re-stamp the full palette on their detached roots; the scoped delta below is all the in-tree
+    // DOM node needs to stamp, because descendants already inherit the ambient tokens by CSS.
+    const scopedSemanticColors = useMemo(()=>{
+        const changed = getChangedEntries(semanticColors, ambient.semanticColors);
+        return Object.keys(changed).length > 0 ? changed : undefined;
+    }, [
+        semanticColors,
+        ambient.semanticColors
+    ]);
+    const scopedOverrideTokens = useMemo(()=>{
+        const changed = getChangedEntries(overrideTokens, ambient.designTokenOverrides);
+        return Object.keys(changed).length > 0 ? changed : undefined;
+    }, [
+        overrideTokens,
+        ambient.designTokenOverrides
+    ]);
+    // A scope that changes nothing over ambient is a no-op: descendants already inherit the ambient scope
+    // in-tree and read the same cumulative context, so render them directly. The mode check compares the
+    // ambient CONTEXT mode (what descendants inherit and portals re-stamp from), not the emotion theme — a
+    // forced-mode ancestor can make the two diverge, and skipping must not leave that divergence unreset.
+    if (scopedSemanticColors === undefined && scopedOverrideTokens === undefined && resolvedIsDarkMode === ambient.isDarkMode) {
+        return /*#__PURE__*/ jsx(Fragment, {
+            children: children
+        });
+    }
     return(// DesignTokenScope IS the sanctioned wrapper that feeds token overrides into DesignSystemThemeContext
     // for portaled surfaces, so it is one of the "special exceptions" the forbid rule allows.
     // eslint-disable-next-line react/forbid-elements
@@ -1913,8 +1966,8 @@ function semanticColorsToStyle(semanticColors) {
         designTokenOverrides: mergedOverrideTokens,
         children: /*#__PURE__*/ jsx(DesignTokenScopeImpl, {
             isDarkMode: resolvedIsDarkMode,
-            semanticColors: mergedSemanticColors,
-            overrideTokens: mergedOverrideTokens,
+            semanticColors: scopedSemanticColors,
+            overrideTokens: scopedOverrideTokens,
             children: children
         })
     }));
@@ -2152,14 +2205,14 @@ const getIconVariantStyles = (theme, color)=>{
             } : {};
     }
 };
-// Module-level cache. The full css prop for AntDIcon depends only on (theme, color) —
+// Module-level cache. The full css prop for AntdIconBase depends only on (theme, color) —
 // at most ~5 distinct color values per theme — so we share one css object across every
 // Icon instance. Same pattern as getShadowScrollStylesMemoized in css-utils.tsx.
 const getMemoizedIconCss$1 = memoize((theme, color)=>({
         fontSize: theme.general.iconFontSize,
         ...getIconVariantStyles(theme, color)
     }), (theme, color)=>`${themeMemoKey(theme)}|${color ?? 'undef'}`);
-const Icon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
+const AntdIcon = /*#__PURE__*/ forwardRef(function AntdIcon(props, forwardedRef) {
     const { component: Component, color, style, ...otherProps } = props;
     const { theme } = useDesignSystemTheme();
     const linearGradientId = useUniqueId('ai-linear-gradient');
@@ -2217,7 +2270,7 @@ const Icon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
         aiGradientEnd
     ]);
     return /*#__PURE__*/ jsx(DesignSystemAntDConfigProvider, {
-        children: /*#__PURE__*/ jsx(AntDIcon, {
+        children: /*#__PURE__*/ jsx(AntdIconBase, {
             ...addDebugOutlineIfEnabled(),
             ref: forwardedRef,
             "aria-hidden": "true",
@@ -2231,6 +2284,131 @@ const Icon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
     });
 });
 
+const getColorClassName = (color)=>{
+    return color ? `db-icon-${color}` : undefined;
+};
+const NativeIcon = /*#__PURE__*/ forwardRef(function NativeIcon({ component: Component, className, color, style, spin, rotate, viewBox, tabIndex, onClick, children, ...spanProps }, ref) {
+    const effectiveTabIndex = tabIndex ?? (onClick ? -1 : undefined);
+    const linearGradientId = useUniqueId('ai-linear-gradient');
+    const svgStyle = useMemo(()=>rotate || color === 'ai' ? {
+            ...rotate ? {
+                rotate: `${rotate}deg`
+            } : {},
+            ...color === 'ai' ? {
+                '--db-icon-gradient': `url(#${linearGradientId})`
+            } : {}
+        } : undefined, [
+        rotate,
+        color,
+        linearGradientId
+    ]);
+    const svgProps = useMemo(()=>({
+            width: '1em',
+            height: '1em',
+            fill: Component ? 'none' : 'currentColor',
+            'aria-hidden': 'true',
+            focusable: 'false',
+            className: classnames({
+                'db-icon-spin': spin
+            }),
+            style: svgStyle,
+            ...viewBox !== undefined ? {
+                viewBox
+            } : {}
+        }), [
+        Component,
+        spin,
+        svgStyle,
+        viewBox
+    ]);
+    // component takes precedence over children, matching antd's Icon.
+    let glyph = null;
+    if (Component) {
+        glyph = /*#__PURE__*/ jsx(Component, {
+            ...svgProps,
+            children: children
+        });
+    } else if (children) {
+        glyph = /*#__PURE__*/ jsx("svg", {
+            ...svgProps,
+            children: children
+        });
+    }
+    return /*#__PURE__*/ jsxs("span", {
+        ...addDebugOutlineIfEnabled(),
+        // TODO: only set role="img" when the icon is not aria-hidden and has an aria-label or
+        // aria-labelledby. role="img" is for content images, not decorative icons, most of which
+        // are aria-hidden and better represented as text in the DOM.
+        role: "img",
+        "aria-hidden": "true",
+        ...spanProps,
+        ref: ref,
+        tabIndex: effectiveTabIndex,
+        onClick: onClick,
+        className: classnames('db-icon', getColorClassName(color), className),
+        style: style,
+        children: [
+            glyph,
+            color === 'ai' && /*#__PURE__*/ jsx("svg", {
+                className: "db-icon-gradient-definitions",
+                width: "0",
+                height: "0",
+                viewBox: "0 0 0 0",
+                "aria-hidden": "true",
+                focusable: "false",
+                children: /*#__PURE__*/ jsx("defs", {
+                    children: /*#__PURE__*/ jsxs("linearGradient", {
+                        id: linearGradientId,
+                        x1: "0%",
+                        y1: "0%",
+                        x2: "100%",
+                        y2: "100%",
+                        children: [
+                            /*#__PURE__*/ jsx("stop", {
+                                offset: "20.5%",
+                                className: "db-icon-ai-gradient-start"
+                            }),
+                            /*#__PURE__*/ jsx("stop", {
+                                offset: "46.91%",
+                                className: "db-icon-ai-gradient-mid"
+                            }),
+                            /*#__PURE__*/ jsx("stop", {
+                                offset: "79.5%",
+                                className: "db-icon-ai-gradient-end"
+                            })
+                        ]
+                    })
+                })
+            })
+        ]
+    });
+});
+
+// Selector matching the design-system icon wrapper: `.db-icon` once the native icon flag is on,
+// `.anticon` otherwise. Authored icon styles should use this instead of hardcoding either class.
+// Returns a single class (never a comma-list) and callers must not wrap it in `:is()` — both forms
+// multiply the selector count, which inflated Monaco's per-keystroke style-recalc cost.
+function getIconClassName() {
+    return serverSideSafe('databricks.fe.designsystem.useNativeIcon', false) ? '.db-icon' : '.anticon';
+}
+
+// Public Icon selects between the native (plain-DOM, token-driven) implementation and the legacy
+// AntD-backed implementation on the `databricks.fe.designsystem.useNativeIcon` server-side flag,
+// default off. serverSideSafe resolves synchronously at render, so the choice is stable from first paint.
+const Icon = /*#__PURE__*/ forwardRef(function Icon({ forceNativeIcon, ...props }, ref) {
+    const useNativeIcon = forceNativeIcon ?? serverSideSafe('databricks.fe.designsystem.useNativeIcon', false);
+    if (useNativeIcon) {
+        return /*#__PURE__*/ jsx(NativeIcon, {
+            ...props,
+            ref: ref
+        });
+    }
+    return /*#__PURE__*/ jsx(AntdIcon, {
+        ...props,
+        ref: ref
+    });
+});
+
 function SvgAzHorizontalIcon(props) {
     return /*#__PURE__*/ jsx("svg", {
         xmlns: "http://www.w3.org/2000/svg",
@@ -9122,6 +9300,37 @@ const LakewatchDetectionRuleIcon = /*#__PURE__*/ forwardRef((props, forwardedRef
 });
 LakewatchDetectionRuleIcon.displayName = "LakewatchDetectionRuleIcon";
 
+function SvgLakewatchIcon(props) {
+    return /*#__PURE__*/ jsxs("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "1em",
+        height: "1em",
+        fill: "none",
+        viewBox: "0 0 16 16",
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx("path", {
+                fill: "currentColor",
+                d: "M10.726 5.704c.326.712.51 1.504.51 2.338l-.009.289a5.6 5.6 0 0 1-.5 2.045l-1.182-.8a4.2 4.2 0 0 0-.001-3.072z"
+            }),
+            /*#__PURE__*/ jsx("path", {
+                fill: "currentColor",
+                fillRule: "evenodd",
+                d: "M14.393.337c.679-.46 1.607.015 1.607.822v13.765l-.01.147c-.105.715-.96 1.105-1.597.675l-5.108-3.454a5.6 5.6 0 0 1-3.668 1.368l-.289-.008a5.619 5.619 0 0 1 .29-11.228c1.4 0 2.678.514 3.661 1.362zm-6.82 6.29a1.7 1.7 0 0 0-.002 2.817l7.029 4.752V1.886zM5.616 3.825a4.217 4.217 0 1 0 0 8.435c.915 0 1.76-.295 2.451-.79l-1.28-.867C5.024 9.412 4.97 6.86 6.623 5.585l.166-.12 1.273-.859a4.2 4.2 0 0 0-2.446-.781",
+                clipRule: "evenodd"
+            })
+        ]
+    });
+}
+const LakewatchIcon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
+    return /*#__PURE__*/ jsx(Icon, {
+        ref: forwardedRef,
+        ...props,
+        component: SvgLakewatchIcon
+    });
+});
+LakewatchIcon.displayName = "LakewatchIcon";
+
 function SvgLakewatchParserIcon(props) {
     return /*#__PURE__*/ jsxs("svg", {
         xmlns: "http://www.w3.org/2000/svg",
@@ -13099,6 +13308,37 @@ const SlidersIcon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
 });
 SlidersIcon.displayName = "SlidersIcon";
 
+function SvgSlidesIcon(props) {
+    return /*#__PURE__*/ jsxs("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "1em",
+        height: "1em",
+        fill: "none",
+        viewBox: "0 0 16 16",
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx("path", {
+                fill: "currentColor",
+                d: "M12 5.5H4V4h8z"
+            }),
+            /*#__PURE__*/ jsx("path", {
+                fill: "currentColor",
+                fillRule: "evenodd",
+                d: "M14.25 1a.75.75 0 0 1 .75.75v9.5a.75.75 0 0 1-.75.75h-2.837l1.667 3h-1.716l-1.666-3H6.302l-1.666 3H2.92l1.667-3H1.75a.75.75 0 0 1-.75-.75v-9.5A.75.75 0 0 1 1.75 1zM2.5 10.5h11v-8h-11z",
+                clipRule: "evenodd"
+            })
+        ]
+    });
+}
+const SlidesIcon = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
+    return /*#__PURE__*/ jsx(Icon, {
+        ref: forwardedRef,
+        ...props,
+        component: SvgSlidesIcon
+    });
+});
+SlidesIcon.displayName = "SlidesIcon";
+
 function SvgSnippetIcon(props) {
     return /*#__PURE__*/ jsxs("svg", {
         xmlns: "http://www.w3.org/2000/svg",
@@ -17343,6 +17583,7 @@ var ShapeTokens = /*#__PURE__*/ function(ShapeTokens) {
 const token = (token, fallback)=>`var(${token}, ${typeof fallback === 'number' ? `${fallback}px` : fallback})`;
 
 const SMALL_BUTTON_HEIGHT$2 = 24;
+const ICON_SELECTOR$1 = `${getIconClassName()}`;
 // Hoisted to module level so the default reference is stable across renders and instances.
 // Without this, the default `analyticsEvents = [...]` literal would be a fresh array on every
 // render, propagating ref-instability into useDesignSystemEventComponentCallbacks.
@@ -17356,7 +17597,7 @@ const getMemoizedLoadingSpinnerCss = memoize((iconOnly, forceIconStyles)=>({
         color: 'inherit !important',
         pointerEvents: 'none',
         ...!iconOnly && !forceIconStyles && {
-            '.anticon': {
+            [getIconClassName()]: {
                 verticalAlign: '-0.2em'
             }
         },
@@ -17382,12 +17623,11 @@ const getMemoizedButtonEmotionStyles = (props)=>{
     themeCache.set(cacheKey, styles);
     return styles;
 };
-function getEndIconClsName(theme) {
-    return `${theme.general.iconfontCssPrefix}-btn-end-icon`;
-}
+// Trailing-icon slot wrapper class, derived from the design-system icon class so this slot and the
+// consumers that style it stay in sync with it. getIconClassName() is a selector — strip the dot.
+const BUTTON_END_ICON_CLASSNAME = `${getIconClassName().replace('.', '')}-btn-end-icon`;
 const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onlyIcon, isAnchor, enableAnimation, size, type, useFocusPseudoClass, forceIconStyles, danger })=>{
-    const clsIcon = `.${theme.general.iconfontCssPrefix}`;
-    const clsEndIcon = `.${getEndIconClsName(theme)}`;
+    const clsEndIcon = `.${BUTTON_END_ICON_CLASSNAME}`;
     const clsLoadingIcon = `.${classNamePrefix}-btn-loading-icon`;
     const clsIconOnly = `.${classNamePrefix}-btn-icon-only`;
     const classPrimary = `.${classNamePrefix}-btn-primary`;
@@ -17420,7 +17660,7 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
     const inactiveIconCss = {
         color: theme.colors.textSecondary
     };
-    const endIconCssSelector = `span > ${clsEndIcon} > ${clsIcon}`;
+    const endIconCssSelector = `span > ${clsEndIcon} > ${ICON_SELECTOR$1}`;
     const styles = {
         lineHeight: theme.typography.lineHeightBase,
         boxShadow: 'none',
@@ -17504,7 +17744,7 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
                 }
             }
         },
-        [`&[disabled] > ${clsIcon}`]: {
+        [`&[disabled] > ${ICON_SELECTOR$1}`]: {
             color: 'inherit !important'
         },
         [clsLoadingIcon]: {
@@ -17530,7 +17770,7 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
                     animationDuration: '1s !important'
                 }
             },
-            [`& > ${clsLoadingIcon} .anticon`]: {
+            [`& > ${clsLoadingIcon} ${ICON_SELECTOR$1}`]: {
                 paddingRight: 0
             },
             [`> :not(${clsLoadingIcon})`]: {
@@ -17544,17 +17784,17 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
             }
         },
         // Icon styles
-        [`> ${clsIcon} + span, > span + ${clsIcon}`]: {
+        [`> ${ICON_SELECTOR$1} + span, > span + ${ICON_SELECTOR$1}`]: {
             marginRight: 0,
             marginLeft: theme.spacing.xs
         },
-        [`> ${clsIcon}`]: iconCss,
+        [`> ${ICON_SELECTOR$1}`]: iconCss,
         [`> ${endIconCssSelector}`]: {
             ...iconCss,
             marginLeft: size === 'small' ? theme.spacing.xs : theme.spacing.sm
         },
         ...!type && !danger && {
-            [`&:enabled:not(:hover):not(:active) > ${clsIcon}`]: inactiveIconCss
+            [`&:enabled:not(:hover):not(:active) > ${ICON_SELECTOR$1}`]: inactiveIconCss
         },
         ...!type && !danger && {
             [`&:enabled:not(:hover):not(:active) > ${endIconCssSelector}, &[href]:not(:disabled):not(:hover):not(:active) > ${endIconCssSelector}`]: inactiveIconCss
@@ -17579,13 +17819,13 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
                         color: theme.colors.actionDangerDefaultTextPress
                     }
                 },
-                '&:hover > .anticon': {
+                [`&:hover > ${ICON_SELECTOR$1}`]: {
                     color: tertiaryColors['&:hover'].color,
                     ...danger && {
                         color: theme.colors.actionDangerDefaultTextHover
                     }
                 },
-                '&:active > .anticon': {
+                [`&:active > ${ICON_SELECTOR$1}`]: {
                     color: tertiaryColors['&:active'].color,
                     ...danger && {
                         color: theme.colors.actionDangerDefaultTextPress
@@ -17597,7 +17837,7 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
                     }
                 }
             },
-            [`&:enabled:not(${classLink}) > .anticon`]: {
+            [`&:enabled:not(${classLink}) > ${ICON_SELECTOR$1}`]: {
                 color: theme.colors.textSecondary,
                 ...danger && {
                     color: theme.colors.actionDangerDefaultTextDefault
@@ -17652,7 +17892,7 @@ const getButtonEmotionStyles = ({ theme, classNamePrefix, loading, withIcon, onl
                 height: theme.general.heightSm / 2,
                 width: theme.general.heightSm / 2
             },
-            [`& > ${clsLoadingIcon} .anticon`]: {
+            [`& > ${clsLoadingIcon} ${ICON_SELECTOR$1}`]: {
                 // left: `calc(50% - 6px)!important`,
                 height: theme.general.heightSm / 2,
                 width: theme.general.heightSm / 2,
@@ -17688,7 +17928,7 @@ const AntDButtonInternal = /* #__PURE__ */ (()=>{
             // If the button is a submit button and is part of a form, it is not the subject of the interaction, the form submission is
             isInteractionSubject: !(props.htmlType === 'submit' && formContext.componentId)
         });
-        const clsEndIcon = getEndIconClsName(theme);
+        const clsEndIcon = BUTTON_END_ICON_CLASSNAME;
         const loadingCls = `${classNamePrefix}-btn-loading-icon`;
         const { elementRef: buttonRef } = useNotifyOnFirstView({
             onView: eventContext.onView
@@ -17740,7 +17980,7 @@ const AntDButtonInternal = /* #__PURE__ */ (()=>{
             css: getMemoizedLoadingSpinnerCss(iconOnly, Boolean(dangerouslySetForceIconStyles))
         }) : null;
         return /*#__PURE__*/ jsx(DesignSystemAntDConfigProvider, {
-            children: /*#__PURE__*/ jsx(Button$2, {
+            children: /*#__PURE__*/ jsx(Button$1, {
                 ...addDebugOutlineIfEnabled(),
                 ...props,
                 css: getMemoizedButtonEmotionStyles({
@@ -17880,7 +18120,7 @@ const NativeButton = /*#__PURE__*/ forwardRef(function NativeButton({ type, size
         'db-btn-icon-only': iconOnly,
         'db-btn-empty': isEmpty,
         'db-btn-force-icon': forceIconStyles,
-        'db-btn-full-width': Boolean(block),
+        'db-btn-block': Boolean(block),
         'db-btn-loading': loading,
         // While loading with a leading icon, reserve the icon's width so the button doesn't shrink.
         'db-btn-loading-with-icon': loading && Boolean(icon),
@@ -17901,7 +18141,7 @@ const NativeButton = /*#__PURE__*/ forwardRef(function NativeButton({ type, size
     // `.anticon` base rule.
     const leading = loading ? /*#__PURE__*/ jsx(Spinner, {
         className: "db-btn-spinner",
-        animationDuration: 8,
+        animationDuration: 1,
         inheritColor: true,
         label: "loading",
         "aria-label": "loading",
@@ -17965,12 +18205,13 @@ const NativeButton = /*#__PURE__*/ forwardRef(function NativeButton({ type, size
     });
 });
 
-// Public Button selects between the native (plain-DOM, token-driven) implementation and the legacy
-// implementation on the `databricks.fe.designsystem.useNativeButton` server-side flag, default off.
+// Public Button selects between the native (plain-DOM, token-driven) implementation and the legacy one.
+// `forceMode` defaults to `'native'` so new buttons are native; existing callsites pass `'flag'` to
+// defer to the `databricks.fe.designsystem.useNativeButton` server-side flag for rollout.
 // serverSideSafe resolves synchronously at render, so the choice is stable from first paint.
-const Button$1 = /* #__PURE__ */ (()=>{
-    const Button = /*#__PURE__*/ forwardRef(function Button({ useNativeButtonOverride, ...props }, ref) {
-        const useNativeButton = useNativeButtonOverride ?? serverSideSafe('databricks.fe.designsystem.useNativeButton', false);
+const Button = /* #__PURE__ */ (()=>{
+    const Button = /*#__PURE__*/ forwardRef(function Button({ forceMode = 'native', ...props }, ref) {
+        const useNativeButton = forceMode === 'native' || forceMode === 'flag' && serverSideSafe('databricks.fe.designsystem.useNativeButton', false);
         if (useNativeButton) {
             return /*#__PURE__*/ jsx(NativeButton, {
                 ...props,
@@ -17982,8 +18223,8 @@ const Button$1 = /* #__PURE__ */ (()=>{
             ref: ref
         });
     });
-    // The default path is the legacy Ant-backed button, so keep the marker Ant wrappers (e.g. Tooltip)
-    // read to identify it — preserving pre-split behavior while the flag is off.
+    // Keep the marker Ant wrappers (e.g. Tooltip) read to identify a button, so their spacing/rendering
+    // around Button is unchanged regardless of which implementation renders underneath.
     // See: https://github.com/ant-design/ant-design/blob/6dd39c1f89b4d6632e6ed022ff1bc275ca1e0f1f/components/button/button.tsx#L291
     Button.__ANT_BUTTON = true;
     return Button;
@@ -18108,18 +18349,18 @@ const getLinkStyles = (theme, clsPrefix)=>{
         [`&${classTypography}, &${classTypography}:focus`]: {
             color: theme.colors.actionTertiaryTextDefault
         },
-        [`&${classTypography}:hover, &${classTypography}:hover .anticon`]: {
+        [`&${classTypography}:hover, &${classTypography}:hover ${getIconClassName()}`]: {
             color: theme.colors.actionTertiaryTextHover,
             textDecoration: 'underline'
         },
-        [`&${classTypography}:active, &${classTypography}:active .anticon`]: {
+        [`&${classTypography}:active, &${classTypography}:active ${getIconClassName()}`]: {
             color: theme.colors.actionTertiaryTextPress,
             textDecoration: 'underline'
         },
         [`&${classTypography}:focus-visible`]: {
             textDecoration: 'underline'
         },
-        '.anticon': {
+        [getIconClassName()]: {
             fontSize: 12,
             verticalAlign: 'baseline'
         },
@@ -18128,19 +18369,19 @@ const getLinkStyles = (theme, clsPrefix)=>{
         [`.${clsPrefix}-tooltip-inner a&${classTypography}`]: {
             [`&, :focus`]: {
                 color: theme.colors.blue500,
-                '.anticon': {
+                [getIconClassName()]: {
                     color: theme.colors.blue500
                 }
             },
             ':active': {
                 color: theme.colors.blue500,
-                '.anticon': {
+                [getIconClassName()]: {
                     color: theme.colors.blue500
                 }
             },
             ':hover': {
                 color: theme.colors.blue400,
-                '.anticon': {
+                [getIconClassName()]: {
                     color: theme.colors.blue400
                 }
             }
@@ -18176,7 +18417,7 @@ const getEllipsisIconStyles = (useNewIcons)=>{
     };
     return /*#__PURE__*/ css(styles);
 };
-const Link$1 = /*#__PURE__*/ forwardRef(function Link({ dangerouslySetAntdProps, componentId, analyticsEvents, onClick, ...props }, ref) {
+const Link = /*#__PURE__*/ forwardRef(function Link({ dangerouslySetAntdProps, componentId, analyticsEvents, onClick, ...props }, ref) {
     const { children, openInNewTab, dangerouslyHideNewTabIcon, ellipsis, ...restProps } = props;
     const { theme, classNamePrefix } = useDesignSystemTheme();
     const memoizedAnalyticsEvents = useMemo(()=>analyticsEvents ?? [
@@ -18258,7 +18499,7 @@ function getParagraphEmotionStyles(theme, clsPrefix, props) {
             lineHeight: theme.typography.lineHeightBase,
             color: getTypographyColor(theme, props.color, theme.colors.textPrimary)
         },
-        '& .anticon': {
+        [`& ${getIconClassName()}`]: {
             verticalAlign: 'text-bottom'
         },
         [`${getBtnClassName(clsPrefix, '-link', '& ')}, ${getBtnClassName(clsPrefix, '-tertiary', '& ')}`]: {
@@ -18339,7 +18580,7 @@ function getTextEmotionStyles(theme, props) {
                     return {
                         fontSize: theme.typography.fontSizeXxl,
                         lineHeight: theme.typography.lineHeightXxl,
-                        '& .anticon': {
+                        [`& ${getIconClassName()}`]: {
                             lineHeight: theme.typography.lineHeightXxl,
                             verticalAlign: 'middle'
                         }
@@ -18348,7 +18589,7 @@ function getTextEmotionStyles(theme, props) {
                     return {
                         fontSize: theme.typography.fontSizeXl,
                         lineHeight: theme.typography.lineHeightXl,
-                        '& .anticon': {
+                        [`& ${getIconClassName()}`]: {
                             lineHeight: theme.typography.lineHeightXl,
                             verticalAlign: 'middle'
                         }
@@ -18357,7 +18598,7 @@ function getTextEmotionStyles(theme, props) {
                     return {
                         fontSize: theme.typography.fontSizeLg,
                         lineHeight: theme.typography.lineHeightLg,
-                        '& .anticon': {
+                        [`& ${getIconClassName()}`]: {
                             lineHeight: theme.typography.lineHeightLg,
                             verticalAlign: 'middle'
                         }
@@ -18366,7 +18607,7 @@ function getTextEmotionStyles(theme, props) {
                     return {
                         fontSize: theme.typography.fontSizeSm,
                         lineHeight: theme.typography.lineHeightSm,
-                        '& .anticon': {
+                        [`& ${getIconClassName()}`]: {
                             verticalAlign: '-0.219em'
                         }
                     };
@@ -18482,7 +18723,7 @@ function getLevelStyles(theme, props) {
             lineHeight: theme.typography[tokens.lineHeight],
             fontWeight: theme.typography.typographyBoldFontWeight
         },
-        '& > .anticon': {
+        [`& > ${getIconClassName()}`]: {
             lineHeight: theme.typography[tokens.lineHeight]
         }
     });
@@ -18492,7 +18733,7 @@ function getTitleEmotionStyles(theme, props) {
         '&&': {
             color: getTypographyColor(theme, props.color, theme.colors.textPrimary)
         },
-        '& > .anticon': {
+        [`& > ${getIconClassName()}`]: {
             verticalAlign: 'middle'
         }
     }, props.withoutMargins && {
@@ -18568,7 +18809,7 @@ const Typography = /* #__PURE__ */ (()=>{
     Typography.Text = Text$1;
     Typography.Title = Title$1;
     Typography.Paragraph = Paragraph$2;
-    Typography.Link = Link$1;
+    Typography.Link = Link;
     Typography.Hint = Hint$2;
     Typography.Truncate = Truncate;
     Typography.TextMiddleElide = TextMiddleElide;
@@ -18753,7 +18994,7 @@ function DefaultFooter({ componentId, onOk, onCancel, confirmLoading, okText, ca
     const handleOk = (e)=>onOk?.(e);
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
-            cancelText && /*#__PURE__*/ jsx(Button$1, {
+            cancelText && /*#__PURE__*/ jsx(Button, {
                 componentId: componentId ? `${componentId}.footer.cancel` : 'modal.close',
                 onClick: handleCancel,
                 autoFocus: autoFocusButton === 'cancel',
@@ -18762,7 +19003,7 @@ function DefaultFooter({ componentId, onOk, onCancel, confirmLoading, okText, ca
                 ...cancelButtonProps,
                 children: cancelText
             }),
-            okText && /*#__PURE__*/ jsx(Button$1, {
+            okText && /*#__PURE__*/ jsx(Button, {
                 componentId: componentId ? `${componentId}.footer.ok` : 'modal.ok',
                 loading: confirmLoading,
                 onClick: handleOk,
@@ -19080,7 +19321,7 @@ function ModalInternal({ componentId, analyticsEvents = [
                 }),
                 dangerouslySetAntdProps?.closable === undefined || dangerouslySetAntdProps?.closable ? /*#__PURE__*/ jsx(DialogPrimitive.Close, {
                     asChild: true,
-                    children: /*#__PURE__*/ jsx(Button$1, {
+                    children: /*#__PURE__*/ jsx(Button, {
                         icon: dangerouslySetAntdProps?.closeIcon ?? /*#__PURE__*/ jsx(CloseIcon, {
                             ref: elementRef
                         }),
@@ -19180,14 +19421,14 @@ function DangerModal(props) {
         shouldStartInteraction: props.shouldStartInteraction,
         title: titleComp,
         footer: [
-            /*#__PURE__*/ jsx(Button$1, {
+            /*#__PURE__*/ jsx(Button, {
                 componentId: props.componentId ? `${props.componentId}.danger.footer.cancel` : 'modal.danger.cancel',
                 onClick: onCancel,
                 shouldStartInteraction: props.shouldStartInteraction,
                 ...cancelButtonProps,
                 children: cancelText || 'Cancel'
             }, "cancel"),
-            /*#__PURE__*/ jsx(Button$1, {
+            /*#__PURE__*/ jsx(Button, {
                 componentId: props.componentId ? `${props.componentId}.danger.footer.ok` : 'modal.danger.ok',
                 type: "primary",
                 danger: true,
@@ -19214,7 +19455,7 @@ const Anchor = Popover$1.Anchor; // Behavioral component only
 const DEFAULT_ANALYTICS_EVENTS$5 = [
     DesignSystemEventProviderAnalyticsEventTypes.OnView
 ];
-const Root$b = ({ children, onOpenChange, componentId, analyticsEvents = DEFAULT_ANALYTICS_EVENTS$5, ...props })=>{
+const Root$9 = ({ children, onOpenChange, componentId, analyticsEvents = DEFAULT_ANALYTICS_EVENTS$5, ...props })=>{
     const firstView = useRef(true);
     const eventContext = useDesignSystemEventComponentCallbacks({
         componentType: DesignSystemEventProviderComponentTypes.Popover,
@@ -19301,9 +19542,8 @@ const Close = /*#__PURE__*/ forwardRef(function Close({ children, ...props }, re
     });
 });
 const Arrow$2 = /*#__PURE__*/ forwardRef(function Arrow({ children, ...props }, ref) {
-    const { theme } = useDesignSystemTheme();
     return /*#__PURE__*/ jsx(Popover$1.Arrow, {
-        css: getMemoizedArrowCss(theme),
+        css: arrowStyles,
         ref: ref,
         width: 12,
         height: 6,
@@ -19331,39 +19571,41 @@ const CONSTANTS$1 = {
 const popoverContentStylesResolver = memoize(// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore [FEINF-3177] TODO: fix to work with React 18 types
 (theme)=>({
-        backgroundColor: theme.colors.backgroundPrimary,
-        color: theme.colors.textPrimary,
+        backgroundColor: 'var(--db-popover-surface)',
+        color: 'var(--db-popover-text)',
         lineHeight: theme.typography.lineHeightBase,
-        border: `1px solid ${theme.colors.border}`,
-        borderRadius: token(ShapeTokens.POPUP_BORDER_RADIUS, theme.borders.borderRadiusSm),
-        padding: `${theme.spacing.sm}px`,
-        boxShadow: theme.shadows.lg,
+        border: `1px solid var(--db-popover-border)`,
+        borderRadius: 'var(--db-popover-border-radius)',
+        padding: 'var(--db-popover-spacing)',
+        boxShadow: 'var(--db-popover-shadow)',
         zIndex: theme.options.zIndexBase + 30,
         ...getDarkModePortalStyles(theme),
         a: importantify({
-            color: theme.colors.actionTertiaryTextDefault,
+            color: 'var(--db-popover-link-text)',
             '&:hover, &:focus': {
-                color: theme.colors.actionTertiaryTextHover
+                color: 'var(--db-popover-link-text-hover)'
             }
         }),
         '&:focus-visible': {
             outlineStyle: 'solid',
-            outlineWidth: '2px',
+            outlineWidth: 'var(--db-popover-focus-ring-width)',
             outlineOffset: '1px',
-            outlineColor: theme.colors.actionDefaultBorderFocus
+            outlineColor: 'var(--db-popover-focus-ring)'
         }
     }));
 const contentStyles$1 = (theme)=>popoverContentStylesResolver(theme);
-// Module-level cache for the Arrow css. Output depends only on theme.
-const getMemoizedArrowCss = memoize((theme)=>({
-        fill: theme.colors.backgroundPrimary,
-        stroke: theme.colors.borderDecorative,
-        strokeDashoffset: -CONSTANTS$1.arrowBottomLength(),
-        strokeDasharray: CONSTANTS$1.arrowBottomLength() + 2 * CONSTANTS$1.arrowSide(),
-        strokeWidth: CONSTANTS$1.arrowStrokeWidth(),
-        position: 'relative',
-        top: -1
-    }));
+// Fill and stroke read from the popover CSS variables; the rest is fixed geometry, so this no
+// longer depends on the theme. borderDecorative was an alias for border, so the arrow stroke
+// and the content border share --db-popover-border.
+const arrowStyles = {
+    fill: 'var(--db-popover-surface)',
+    stroke: 'var(--db-popover-border)',
+    strokeDashoffset: -CONSTANTS$1.arrowBottomLength(),
+    strokeDasharray: CONSTANTS$1.arrowBottomLength() + 2 * CONSTANTS$1.arrowSide(),
+    strokeWidth: CONSTANTS$1.arrowStrokeWidth(),
+    position: 'relative',
+    top: -1
+};
 
 var Popover = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -19371,7 +19613,7 @@ var Popover = /*#__PURE__*/Object.freeze({
   Arrow: Arrow$2,
   Close: Close,
   Content: Content$7,
-  Root: Root$b,
+  Root: Root$9,
   Trigger: Trigger$5
 });
 
@@ -19463,19 +19705,19 @@ const getTooltipStyles = (theme, clsPrefix)=>{
             [`& a${classTypography}`]: {
                 '&, :focus': {
                     color: 'var(--db-tooltip-link-text)',
-                    '.anticon': {
+                    [getIconClassName()]: {
                         color: 'var(--db-tooltip-link-text)'
                     }
                 },
                 ':active': {
-                    color: 'var(--db-tooltip-link-text-press)',
-                    '.anticon': {
-                        color: 'var(--db-tooltip-link-text-press)'
+                    color: 'var(--db-tooltip-link-text-active)',
+                    [getIconClassName()]: {
+                        color: 'var(--db-tooltip-link-text-active)'
                     }
                 },
                 ':hover': {
                     color: 'var(--db-tooltip-link-text-hover)',
-                    '.anticon': {
+                    [getIconClassName()]: {
                         color: 'var(--db-tooltip-link-text-hover)'
                     }
                 }
@@ -19751,7 +19993,7 @@ const Banner = (props)=>{
     });
     const actionButton = onAccept && ctaText ? /*#__PURE__*/ jsx("div", {
         css: styles.actionButtonContainer,
-        children: /*#__PURE__*/ jsx(Button$1, {
+        children: /*#__PURE__*/ jsx(Button, {
             componentId: `${componentId}.accept`,
             onClick: onAccept,
             css: styles.actionButton,
@@ -19763,7 +20005,7 @@ const Banner = (props)=>{
     }) : null;
     const close = closable !== false ? /*#__PURE__*/ jsx("div", {
         css: styles.closeIconContainer,
-        children: /*#__PURE__*/ jsx(Button$1, {
+        children: /*#__PURE__*/ jsx(Button, {
             componentId: `${componentId}.close`,
             css: styles.closeButton,
             onClick: ()=>{
@@ -19936,6 +20178,7 @@ const TitleSkeleton = ({ label, seed = '', frameRate = 60, style, level, inline
     });
 };
 
+const ICON_SELECTOR = `${getIconClassName()}`;
 // Class names that can be used to reference children within
 // Should not be used outside of design system
 // TODO: PE-239 Maybe we could add "dangerous" into the names or make them completely random.
@@ -19960,7 +20203,7 @@ const repeatingElementsStyles = {
         paddingRight: 'var(--table-spacing-sm)',
         wordBreak: 'break-word',
         overflow: 'hidden',
-        '& .anticon': {
+        [`& ${ICON_SELECTOR}`]: {
             verticalAlign: 'text-bottom'
         }
     }),
@@ -20055,31 +20298,31 @@ const hideIconButtonRowStyles = /*#__PURE__*/ css({
         transition: 'opacity 0.1s ease !important'
     },
     // Hide by default
-    [`.${hideIconButtonActionCellClassName} button:has(> span.anticon[role="img"]:only-child),
+    [`.${hideIconButtonActionCellClassName} button:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} button:has(> i.fa:only-child),
-    .${hideIconButtonActionCellClassName} a:has(> span.anticon[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} a:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} a:has(> i.fa:only-child)`]: {
         opacity: 0,
         transition: 'opacity 0.1s ease !important'
     },
-    [`.${hideIconButtonActionCellClassName} button:focus-visible:has(> span.anticon[role="img"]:only-child),
+    [`.${hideIconButtonActionCellClassName} button:focus-visible:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} button:focus-visible:has(> i.fa:only-child),
-    .${hideIconButtonActionCellClassName} a:focus-visible:has(> span.anticon[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} a:focus-visible:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} a:focus-visible:has(> i.fa:only-child)`]: {
         outlineStyle: 'solid !important'
     },
     // Keep visible when actively clicked or when dropdown is open
-    [`&:hover .${hideIconButtonActionCellClassName} button:has(> span.anticon[role="img"]:only-child),
-    .${hideIconButtonActionCellClassName} button:focus-visible:has(> span.anticon[role="img"]:only-child),
+    [`&:hover .${hideIconButtonActionCellClassName} button:has(> span${ICON_SELECTOR}[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} button:focus-visible:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     &:hover .${hideIconButtonActionCellClassName} button:has(> i.fa:only-child),
     .${hideIconButtonActionCellClassName} button:focus-visible:has(> i.fa:only-child),
-    &:hover .${hideIconButtonActionCellClassName} a:has(> span.anticon[role="img"]:only-child),
-    .${hideIconButtonActionCellClassName} a:focus-visible:has(> span.anticon[role="img"]:only-child),
+    &:hover .${hideIconButtonActionCellClassName} a:has(> span${ICON_SELECTOR}[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} a:focus-visible:has(> span${ICON_SELECTOR}[role="img"]:only-child),
     &:hover .${hideIconButtonActionCellClassName} a:has(> i.fa:only-child),
     .${hideIconButtonActionCellClassName} a:focus-visible:has(> i.fa:only-child)
-    .${hideIconButtonActionCellClassName} div[aria-expanded="true"] > button:has(span.anticon[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} div[aria-expanded="true"] > button:has(span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} div[aria-expanded="true"] > button:has(i.fa:only-child),
-    .${hideIconButtonActionCellClassName} button[aria-expanded="true"]:has(span.anticon[role="img"]:only-child),
+    .${hideIconButtonActionCellClassName} button[aria-expanded="true"]:has(span${ICON_SELECTOR}[role="img"]:only-child),
     .${hideIconButtonActionCellClassName} button[aria-expanded="true"]:has(i.fa:only-child),`]: {
         opacity: 1
     }
@@ -20904,8 +21147,7 @@ zIndex)=>{
     });
 };
 const getChild = (child, isDisabled, disabledReason, tooltip, index, siblingCount)=>{
-    const HintColumnType = (/*#__PURE__*/ jsx(HintColumn, {})).type;
-    const isHintColumnType = Boolean(child && typeof child !== 'string' && typeof child !== 'number' && typeof child !== 'boolean' && 'type' in child && child?.type === HintColumnType);
+    const isHintColumnType = Boolean(child && typeof child !== 'string' && typeof child !== 'number' && typeof child !== 'boolean' && 'type' in child && child?.type === HintColumn);
     if (isDisabled && disabledReason && child && isHintColumnType) {
         return /*#__PURE__*/ jsxs(Fragment, {
             children: [
@@ -20929,7 +21171,7 @@ const DropdownContext = /*#__PURE__*/ createContext({
     setIsOpen: (isOpen)=>{}
 });
 const useDropdownContext = ()=>React__default.useContext(DropdownContext);
-const Root$a = ({ children, itemHtmlType, ...props })=>{
+const Root$8 = ({ children, itemHtmlType, ...props })=>{
     const [isOpen, setIsOpen] = React__default.useState(Boolean(props.defaultOpen || props.open));
     const useExternalState = useRef(props.open !== undefined || props.onOpenChange !== undefined).current;
     useEffect(()=>{
@@ -21194,7 +21436,7 @@ const Label$1 = /*#__PURE__*/ forwardRef(function Label({ children, ...props },
         children: children
     });
 });
-const Separator$2 = /*#__PURE__*/ forwardRef(function Separator({ children, ...props }, ref) {
+const Separator$1 = /*#__PURE__*/ forwardRef(function Separator({ children, ...props }, ref) {
     return /*#__PURE__*/ jsx(DropdownMenu$1.Separator, {
         ref: ref,
         css: dropdownSeparatorStyles,
@@ -21570,8 +21812,8 @@ var DropdownMenu = /*#__PURE__*/Object.freeze({
   Label: Label$1,
   RadioGroup: RadioGroup$1,
   RadioItem: RadioItem$1,
-  Root: Root$a,
-  Separator: Separator$2,
+  Root: Root$8,
+  Separator: Separator$1,
   Sub: Sub$1,
   SubContent: SubContent$1,
   SubTrigger: SubTrigger$1,
@@ -21630,7 +21872,7 @@ const ContextMenuProps = /*#__PURE__*/ createContext({
     setIsOpen: (isOpen)=>{}
 });
 const useContextMenuProps = ()=>React__default.useContext(ContextMenuProps);
-const Root$9 = ({ children, onOpenChange, ...props })=>{
+const Root$7 = ({ children, onOpenChange, ...props })=>{
     const [isOpen, setIsOpen] = React__default.useState(false);
     const handleChange = (isOpen)=>{
         setIsOpen(isOpen);
@@ -21913,7 +22155,7 @@ const Hint$1 = ({ children })=>{
         children: children
     });
 };
-const Separator$1 = ()=>{
+const Separator = ()=>{
     const { theme } = useDesignSystemTheme();
     return /*#__PURE__*/ jsx(ContextMenuSeparator, {
         css: dropdownSeparatorStyles(theme)
@@ -21924,7 +22166,7 @@ const itemIndicatorStyles = (theme)=>/*#__PURE__*/ css({
         paddingRight: theme.spacing.xs
     });
 const ContextMenu = {
-    Root: Root$9,
+    Root: Root$7,
     Trigger: Trigger$3,
     Label: Label,
     Item: Item$2,
@@ -21933,7 +22175,7 @@ const ContextMenu = {
     CheckboxItem: CheckboxItem,
     RadioItem: RadioItem,
     Arrow: Arrow,
-    Separator: Separator$1,
+    Separator: Separator,
     Sub: Sub,
     SubTrigger: SubTrigger,
     SubContent: SubContent,
@@ -21954,8 +22196,8 @@ var ContextMenu$1 = /*#__PURE__*/Object.freeze({
   Label: Label,
   RadioGroup: RadioGroup,
   RadioItem: RadioItem,
-  Root: Root$9,
-  Separator: Separator$1,
+  Root: Root$7,
+  Separator: Separator,
   Sub: Sub,
   SubContent: SubContent,
   SubTrigger: SubTrigger,
@@ -22122,7 +22364,14 @@ const getInputStyles = (clsPrefix, theme, { validationState, type, hasValue, loc
             }
         },
         [clearIcon]: {
-            fontSize: theme.typography.fontSizeSm
+            fontSize: theme.typography.fontSizeSm,
+            color: theme.colors.textSecondary,
+            '&:hover': {
+                color: theme.colors.actionTertiaryTextHover
+            },
+            '&:active': {
+                color: theme.colors.actionTertiaryTextPress
+            }
         },
         [prefixIcon]: {
             marginRight: theme.spacing.sm,
@@ -22569,7 +22818,7 @@ function MonthCell({ index, label, displayYear, selected, disabled, rangeFrom, r
     const isRangeStart = rangeFromValue !== undefined && cellValue === rangeFromValue;
     const isRangeEnd = rangeToValue !== undefined && cellValue === rangeToValue;
     const isRangeMiddle = inRange && !isRangeStart && !isRangeEnd;
-    const defaultButton = /*#__PURE__*/ jsx(Button$1, {
+    const defaultButton = /*#__PURE__*/ jsx(Button, {
         componentId: "datepicker-month-grid-cell",
         "aria-label": `${label} ${displayYear}`,
         "data-selected": selected || undefined,
@@ -22752,7 +23001,7 @@ function MonthCell({ index, label, displayYear, selected, disabled, rangeFrom, r
                     marginBottom: theme.spacing.xs
                 },
                 children: [
-                    /*#__PURE__*/ jsx(Button$1, {
+                    /*#__PURE__*/ jsx(Button, {
                         componentId: "datepicker-month-grid-prev",
                         "aria-label": "Previous year",
                         icon: /*#__PURE__*/ jsx(ChevronLeftIcon, {}),
@@ -22765,7 +23014,7 @@ function MonthCell({ index, label, displayYear, selected, disabled, rangeFrom, r
                         "aria-live": "polite",
                         children: displayYear
                     }),
-                    /*#__PURE__*/ jsx(Button$1, {
+                    /*#__PURE__*/ jsx(Button, {
                         componentId: "datepicker-month-grid-next",
                         "aria-label": "Next year",
                         icon: /*#__PURE__*/ jsx(ChevronRightIcon, {}),
@@ -22915,7 +23164,7 @@ function YearCell({ year, index, selected, disabled, isCurrentYear, rangeFrom, r
     const isRangeStart = rangeFromYear !== undefined && year === rangeFromYear;
     const isRangeEnd = rangeToYear !== undefined && year === rangeToYear;
     const isRangeMiddle = inRange && !isRangeStart && !isRangeEnd;
-    const defaultButton = /*#__PURE__*/ jsx(Button$1, {
+    const defaultButton = /*#__PURE__*/ jsx(Button, {
         componentId: "datepicker-year-grid-cell",
         "aria-label": String(year),
         "data-selected": selected || undefined,
@@ -23100,7 +23349,7 @@ function YearCell({ year, index, selected, disabled, isCurrentYear, rangeFrom, r
                     marginBottom: theme.spacing.xs
                 },
                 children: [
-                    /*#__PURE__*/ jsx(Button$1, {
+                    /*#__PURE__*/ jsx(Button, {
                         componentId: "datepicker-year-grid-prev",
                         "aria-label": "Previous decade",
                         icon: /*#__PURE__*/ jsx(ChevronLeftIcon, {}),
@@ -23117,7 +23366,7 @@ function YearCell({ year, index, selected, disabled, isCurrentYear, rangeFrom, r
                             decadeStart + YEARS_PER_PAGE - 1
                         ]
                     }),
-                    /*#__PURE__*/ jsx(Button$1, {
+                    /*#__PURE__*/ jsx(Button, {
                         componentId: "datepicker-year-grid-next",
                         "aria-label": "Next decade",
                         icon: /*#__PURE__*/ jsx(ChevronRightIcon, {}),
@@ -23380,7 +23629,7 @@ function createDayComponent(renderCellContent) {
             month: 'long',
             day: 'numeric'
         });
-        const defaultButton = /*#__PURE__*/ jsx(Button$3, {
+        const defaultButton = /*#__PURE__*/ jsx(Button$2, {
             name: "day",
             ref: buttonRef,
             ...dayRender.buttonProps,
@@ -24067,7 +24316,7 @@ const DatePicker = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-co
             pointerEvents: restProps?.disabled ? 'none' : 'auto'
         },
         ...wrapperProps,
-        children: /*#__PURE__*/ jsxs(Root$b, {
+        children: /*#__PURE__*/ jsxs(Root$9, {
             componentId: "codegen_design-system_src_development_datepicker_datepicker.tsx_330",
             open: isVisible,
             onOpenChange: setIsVisible,
@@ -24267,7 +24516,7 @@ const DatePicker = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-co
                                 maxWidth: 225,
                                 flexWrap: 'wrap'
                             },
-                            children: quickActions?.map((action, i)=>/*#__PURE__*/ jsx(Button$1, {
+                            children: quickActions?.map((action, i)=>/*#__PURE__*/ jsx(Button, {
                                     size: "small",
                                     componentId: "codegen_design-system_src_design-system_datepicker_datepicker.tsx_281",
                                     onClick: ()=>action.onClick ? action.onClick(action.value) : !Array.isArray(action.value) && handleDatePickerUpdate(action.value),
@@ -24312,7 +24561,7 @@ const DatePicker = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-co
                                 display: 'flex',
                                 justifyContent: 'flex-end'
                             },
-                            children: /*#__PURE__*/ jsx(Button$1, {
+                            children: /*#__PURE__*/ jsx(Button, {
                                 "aria-label": "Open end date picker",
                                 type: "primary",
                                 componentId: "datepicker-dubois-ok-button",
@@ -24797,7 +25046,7 @@ const DialogCombobox = ({ children, label, id, value = [], open, emptyText, scro
             setDisableMouseOver,
             onView: eventContext.onView
         },
-        children: /*#__PURE__*/ jsx(Root$8, {
+        children: /*#__PURE__*/ jsx(Root$6, {
             open: open !== undefined ? open : isOpen,
             ...props,
             children: /*#__PURE__*/ jsx(ComponentFinderContext.Provider, {
@@ -24809,7 +25058,7 @@ const DialogCombobox = ({ children, label, id, value = [], open, emptyText, scro
         })
     });
 };
-const Root$8 = (props)=>{
+const Root$6 = (props)=>{
     const { children, stayOpenOnSelection, multiSelect, ...restProps } = props;
     const { value, setIsOpen, onView } = useDialogComboboxContext();
     const firstView = useRef(true);
@@ -26289,6 +26538,7 @@ const DialogComboboxTrigger = /*#__PURE__*/ forwardRef(// eslint-disable-next-li
             'aria-label': ariaLabel
         },
         ref: forwardedRef,
+        // oxlint-disable-next-line jsx-a11y/role-has-required-aria-props
         role: "combobox",
         "aria-haspopup": "listbox",
         "aria-invalid": validationState === 'error',
@@ -26327,6 +26577,7 @@ const DialogComboboxTrigger = /*#__PURE__*/ forwardRef(// eslint-disable-next-li
             'aria-label': ariaLabel
         },
         ref: forwardedRef,
+        // oxlint-disable-next-line jsx-a11y/role-has-required-aria-props
         role: "combobox",
         "aria-haspopup": "listbox",
         "aria-invalid": validationState === 'error',
@@ -26412,7 +26663,7 @@ const DialogComboboxTrigger = /*#__PURE__*/ forwardRef(// eslint-disable-next-li
                 componentId: "dialogcombobox-trigger-tooltip",
                 children: triggerContent
             }) : triggerContent,
-            removable && /*#__PURE__*/ jsx(Button$1, {
+            removable && /*#__PURE__*/ jsx(Button, {
                 componentId: "codegen_design-system_src_design-system_dialogcombobox_dialogcomboboxtrigger.tsx_355",
                 "aria-label": `Remove ${label}`,
                 onClick: handleRemove,
@@ -26434,16 +26685,24 @@ const DialogComboboxTrigger = /*#__PURE__*/ forwardRef(// eslint-disable-next-li
     });
 };
 
-const getSpacerStyles = memoize((theme, size, shrinks)=>/*#__PURE__*/ css({
-        height: theme.spacing[size],
+// Height comes from the --db-spacer-size-* component tokens (Spacer/tokens.css), so the styles no
+// longer depend on the JS theme. Mapped explicitly rather than interpolated so each token name is greppable.
+const SPACER_SIZE_TOKENS = {
+    xs: 'var(--db-spacer-size-xs)',
+    sm: 'var(--db-spacer-size-sm)',
+    mid: 'var(--db-spacer-size-mid)',
+    md: 'var(--db-spacer-size-md)',
+    lg: 'var(--db-spacer-size-lg)'
+};
+const getSpacerStyles = memoize((size, shrinks)=>/*#__PURE__*/ css({
+        height: SPACER_SIZE_TOKENS[size],
         ...shrinks === false ? {
             flexShrink: 0
         } : undefined
-    }), (theme, size, shrinks)=>`${themeMemoKey(theme)}|${size}|${shrinks ?? ''}`);
+    }), (size, shrinks)=>`${size}|${shrinks ?? ''}`);
 const Spacer = ({ size = 'md', shrinks, ...props })=>{
-    const { theme } = useDesignSystemTheme();
     return /*#__PURE__*/ jsx("div", {
-        css: getSpacerStyles(theme, size, shrinks),
+        css: getSpacerStyles(size, shrinks),
         ...props
     });
 };
@@ -26485,12 +26744,12 @@ const OVERLAY_SHOW_BOTTOM = /*#__PURE__*/ keyframes({
 const DEFAULT_ANALYTICS_EVENTS$3 = [
     DesignSystemEventProviderAnalyticsEventTypes.OnView
 ];
-const Content$4 = ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId = 'design_system.drawer.content', analyticsEvents = DEFAULT_ANALYTICS_EVENTS$3, size = 'default', ...props })=>{
+const Content$4 = ({ children, footer, title, width, height, position: positionOverride, useCustomScrollBehavior, expandContentToFullHeight, disableOpenAutoFocus, onInteractOutside, seeThrough, hideClose, closeOnClickOutside, onCloseClick, componentId = 'design_system.drawer.content', analyticsEvents = DEFAULT_ANALYTICS_EVENTS$3, size = 'default', className, ...props })=>{
     const { getPopupContainer } = useDesignSystemContext();
     const { theme } = useDesignSystemTheme();
     const themeClass = useDuboisThemeClass();
     const themeOverrideStyle = useDesignTokenOverrideStyles();
-    const horizontalContentPadding = size === 'small' ? theme.spacing.md : theme.spacing.lg;
+    const horizontalContentPadding = size === 'small' ? 'var(--db-drawer-padding-horizontal-small)' : 'var(--db-drawer-padding-horizontal)';
     const [shouldContentBeFocusable, setShouldContentBeFocusable] = useState(false);
     const contentContainerRef = useRef(null);
     const eventContext = useDesignSystemEventComponentCallbacks({
@@ -26549,9 +26808,9 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
     const isSidePosition = position === 'left' || position === 'right';
     const overlayShow = position === 'right' ? OVERLAY_SHOW_RIGHT : position === 'left' ? OVERLAY_SHOW_LEFT : OVERLAY_SHOW_BOTTOM;
     const dialogPrimitiveContentStyle = /*#__PURE__*/ css({
-        color: theme.colors.textPrimary,
-        backgroundColor: theme.colors.backgroundPrimary,
-        boxShadow: theme.shadows.xl,
+        color: 'var(--db-drawer-text)',
+        backgroundColor: 'var(--db-drawer-surface)',
+        boxShadow: 'var(--db-drawer-shadow)',
         position: 'fixed',
         boxSizing: 'border-box',
         zIndex: theme.options.zIndexBase + DRAWER_ZINDEX_CONTENT_OFFSET,
@@ -26578,7 +26837,7 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
             minHeight: MIN_HEIGHT,
             maxHeight: MAX_HEIGHT
         } : {},
-        paddingTop: size === 'small' ? theme.spacing.sm : theme.spacing.md,
+        paddingTop: size === 'small' ? 'var(--db-drawer-content-padding-top-small)' : 'var(--db-drawer-content-padding-top)',
         paddingLeft: 0,
         paddingBottom: 0,
         paddingRight: 0,
@@ -26597,14 +26856,19 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
         children: [
             /*#__PURE__*/ jsx(DialogPrimitive.Overlay, {
                 "data-testid": "drawer-overlay",
+                // themeClass scopes the scrim under .du-bois-dark so var(--db-drawer-overlay) resolves the dark value.
+                className: themeClass,
                 css: /*#__PURE__*/ css({
-                    backgroundColor: theme.colors.overlayOverlay,
+                    backgroundColor: 'var(--db-drawer-overlay)',
                     position: 'fixed',
                     inset: 0,
                     // needed so that it covers the PersonaNavSidebar
                     zIndex: theme.options.zIndexBase + DRAWER_ZINDEX_OVERLAY_OFFSET,
                     opacity: seeThrough || isParentDrawerOpen ? 0 : 1
                 }),
+                // A React portal renders this scrim outside the DesignTokenScope wrapper, so it stops
+                // inheriting the consumer's scoped --db-* overrides; re-stamp them inline on the scrim.
+                style: themeOverrideStyle,
                 onClick: closeOnClickOutside ? onCloseClick : undefined
             }),
             /*#__PURE__*/ jsx(DialogPrimitive.DialogContent, {
@@ -26617,14 +26881,13 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                     opacity: seeThrough ? 0 : 1,
                     ...theme.isDarkMode && {
                         ...position === 'bottom' ? {
-                            borderTop: `1px solid ${theme.colors.borderDecorative}`
+                            borderTop: '1px solid var(--db-drawer-border)'
                         } : {
-                            borderLeft: `1px solid ${theme.colors.borderDecorative}`
+                            borderLeft: '1px solid var(--db-drawer-border)'
                         }
                     },
                     ...themeOverrideStyle
                 },
-                className: themeClass,
                 onKeyDownCapture: handleKeyDownCapture,
                 onWheel: (e)=>{
                     e.stopPropagation();
@@ -26642,6 +26905,7 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                 onInteractOutside: onInteractOutside,
                 ...props,
                 ...eventContext.dataComponentProps,
+                className: classnames(className, themeClass),
                 children: /*#__PURE__*/ jsx(ApplyDesignSystemContextOverrides, {
                     getPopupContainer: ()=>contentContainerRef.current ?? document.body,
                     children: /*#__PURE__*/ jsxs(DrawerContext.Provider, {
@@ -26659,7 +26923,7 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                                     alignItems: 'center',
                                     paddingRight: horizontalContentPadding,
                                     paddingLeft: horizontalContentPadding,
-                                    marginBottom: theme.spacing.sm
+                                    marginBottom: 'var(--db-drawer-title-margin-bottom)'
                                 }),
                                 children: [
                                     /*#__PURE__*/ jsx(DialogPrimitive.Title, {
@@ -26684,10 +26948,10 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                                         asChild: true,
                                         css: /*#__PURE__*/ css({
                                             flexShrink: 1,
-                                            marginLeft: theme.spacing.xs
+                                            marginLeft: 'var(--db-drawer-close-button-margin)'
                                         }),
                                         onClick: onCloseClick,
-                                        children: /*#__PURE__*/ jsx(Button$1, {
+                                        children: /*#__PURE__*/ jsx(Button, {
                                             componentId: `${componentId}.close`,
                                             "aria-label": "Close",
                                             icon: /*#__PURE__*/ jsx(CloseIcon, {}),
@@ -26699,7 +26963,7 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                             /*#__PURE__*/ jsxs("div", {
                                 ref: mergedContentRef,
                                 // Needed to make drawer content focusable when scrollable for keyboard-only users to be able to focus & scroll
-                                // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+                                // oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex
                                 tabIndex: shouldContentBeFocusable ? 0 : -1,
                                 css: /*#__PURE__*/ css({
                                     // in order to have specific content in the drawer scroll with fixed title
@@ -26720,10 +26984,10 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
                             }),
                             footer && /*#__PURE__*/ jsx("div", {
                                 style: {
-                                    paddingTop: theme.spacing.md,
+                                    paddingTop: 'var(--db-drawer-footer-padding-top)',
                                     paddingRight: horizontalContentPadding,
                                     paddingLeft: horizontalContentPadding,
-                                    paddingBottom: size === 'small' ? theme.spacing.md : theme.spacing.lg,
+                                    paddingBottom: size === 'small' ? 'var(--db-drawer-footer-padding-bottom-small)' : 'var(--db-drawer-footer-padding-bottom)',
                                     flexGrow: 0,
                                     flexShrink: 1
                                 },
@@ -26736,7 +27000,7 @@ const Content$4 = ({ children, footer, title, width, height, position: positionO
         ]
     });
 };
-function Root$7(props) {
+function Root$5(props) {
     return /*#__PURE__*/ jsx(DialogPrimitive.Root, {
         ...props
     });
@@ -26751,63 +27015,52 @@ function Trigger$2(props) {
 var Drawer = /*#__PURE__*/Object.freeze({
   __proto__: null,
   Content: Content$4,
-  Root: Root$7,
+  Root: Root$5,
   Trigger: Trigger$2
 });
 
 const { Title, Paragraph } = Typography;
-function getEmptyStyles(theme) {
-    const styles = {
-        display: 'flex',
-        flexDirection: 'column',
-        alignItems: 'center',
-        textAlign: 'center',
-        maxWidth: 600,
-        wordBreak: 'break-word',
-        // TODO: This isn't ideal, but migrating to a safer selector would require a SAFE flag / careful migration.
-        '> [role="img"]': {
-            // Set size of image to 64px
-            fontSize: 64,
-            color: theme.colors.actionDisabledText,
-            marginBottom: theme.spacing.md
-        }
-    };
-    return /*#__PURE__*/ css(styles);
-}
-function getEmptyTitleStyles(theme, clsPrefix) {
+function getEmptyTitleStyles(clsPrefix) {
     const styles = {
         [`&.${clsPrefix}-typography`]: {
-            color: theme.colors.textSecondary,
+            color: 'var(--db-empty-text)',
             marginTop: 0,
             marginBottom: 0
         }
     };
     return /*#__PURE__*/ css(styles);
 }
-function getEmptyDescriptionStyles(theme, clsPrefix) {
+function getEmptyDescriptionStyles(clsPrefix) {
     const styles = {
         [`&.${clsPrefix}-typography`]: {
-            color: theme.colors.textSecondary,
-            marginBottom: theme.spacing.md
+            color: 'var(--db-empty-text)',
+            marginBottom: 'var(--db-empty-description-spacing)'
         }
     };
     return /*#__PURE__*/ css(styles);
 }
-// Module-level caches. Each Empty instance shares one SerializedStyles per
-// (isDarkMode, classNamePrefix) combination. Same pattern as
-// getShadowScrollStylesMemoized in css-utils.tsx.
-const getMemoizedEmptyStyles = memoize((theme)=>getEmptyStyles(theme));
-const getMemoizedEmptyTitleStyles = memoize((theme, clsPrefix)=>getEmptyTitleStyles(theme, clsPrefix), (theme, clsPrefix)=>`${themeMemoKey(theme)}|${clsPrefix}`);
-const getMemoizedEmptyDescriptionStyles = memoize((theme, clsPrefix)=>getEmptyDescriptionStyles(theme, clsPrefix), (theme, clsPrefix)=>`${themeMemoKey(theme)}|${clsPrefix}`);
-// Stable wrapper styles — never depend on theme.
+const getMemoizedEmptyTitleStyles = memoize(getEmptyTitleStyles);
+const getMemoizedEmptyDescriptionStyles = memoize(getEmptyDescriptionStyles);
 const OUTER_WRAPPER_CSS = /*#__PURE__*/ css({
     display: 'flex',
     justifyContent: 'center'
 });
-// Stable default image element.
+const CONTENT_CSS = /*#__PURE__*/ css({
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    textAlign: 'center',
+    maxWidth: 'var(--db-empty-max-width)',
+    wordBreak: 'break-word',
+    '> [role="img"]': {
+        fontSize: 'var(--db-empty-image-size)',
+        color: 'var(--db-empty-image-color)',
+        marginBottom: 'var(--db-empty-image-spacing)'
+    }
+});
 const DEFAULT_IMAGE = /*#__PURE__*/ jsx(ListIcon, {});
 const Empty = (props)=>{
-    const { theme, classNamePrefix } = useDesignSystemTheme();
+    const { classNamePrefix } = useDesignSystemTheme();
     const { title, description, image = DEFAULT_IMAGE, button, dangerouslyAppendEmotionCSS, ...dataProps } = props;
     return /*#__PURE__*/ jsx("div", {
         ...dataProps,
@@ -26815,18 +27068,18 @@ const Empty = (props)=>{
         css: OUTER_WRAPPER_CSS,
         children: /*#__PURE__*/ jsxs("div", {
             css: [
-                getMemoizedEmptyStyles(theme),
+                CONTENT_CSS,
                 dangerouslyAppendEmotionCSS
             ],
             children: [
                 image,
                 title && /*#__PURE__*/ jsx(Title, {
                     level: 3,
-                    css: getMemoizedEmptyTitleStyles(theme, classNamePrefix),
+                    css: getMemoizedEmptyTitleStyles(classNamePrefix),
                     children: title
                 }),
                 /*#__PURE__*/ jsx(Paragraph, {
-                    css: getMemoizedEmptyDescriptionStyles(theme, classNamePrefix),
+                    css: getMemoizedEmptyDescriptionStyles(classNamePrefix),
                     children: description
                 }),
                 button
@@ -26951,12 +27204,18 @@ function getSelectEmotionStyles({ clsPrefix, theme, validationState }) {
             marginTop: 0,
             color: theme.colors.textSecondary,
             fontSize: theme.general.iconFontSize,
-            '.anticon': {
+            [getIconClassName()]: {
                 // For some reason ant sets this to 'auto'. Need to set it back to 'none' to allow the element below to receive
                 // the click event.
                 pointerEvents: 'none',
                 // anticon default line height is 0 and that wrongly shifts the icon down
-                lineHeight: 1
+                lineHeight: 1,
+                // AntD vendors `.<prefix>-select-arrow .anticon(> svg) { vertical-align: top }`, which the native
+                // `.db-icon` glyph can't match; without it the glyph falls to its baseline default and shifts up.
+                verticalAlign: 'top',
+                '& > svg': {
+                    verticalAlign: 'top'
+                }
             },
             [`&${classArrowLoading}`]: {
                 top: (theme.general.heightSm - theme.general.iconFontSize) / 2,
@@ -27069,7 +27328,7 @@ function getSelectEmotionStyles({ clsPrefix, theme, validationState }) {
             lineHeight: theme.typography.lineHeightBase,
             paddingInlineEnd: 0,
             marginInlineEnd: 0,
-            '& > .anticon': {
+            [`& > ${getIconClassName()}`]: {
                 height: theme.general.iconFontSize - 4,
                 fontSize: theme.general.iconFontSize - 4
             },
@@ -31661,7 +31920,7 @@ const getFormItemEmotionStyles = ({ theme, clsPrefix })=>{
         [clsFormItemLabel]: {
             fontWeight: theme.typography.typographyBoldFontWeight,
             lineHeight: theme.typography.lineHeightBase,
-            '.anticon': {
+            [getIconClassName()]: {
                 fontSize: theme.general.iconFontSize
             }
         },
@@ -31762,10 +32021,31 @@ const FormItem = ({ dangerouslySetAntdProps, children, ...props })=>{
         implicitContext,
         props.rules
     ]);
+    // Use a DS icon for the help affordance so it tracks the native-icon flag and keeps the
+    // getIconClassName()-keyed 16px size; AntD's QuestionCircleOutlined shrinks once the flag is on.
+    let tooltip = props.tooltip;
+    if (props.tooltip != null) {
+        tooltip = typeof props.tooltip === 'object' && !/*#__PURE__*/ isValidElement(props.tooltip) ? {
+            icon: /*#__PURE__*/ jsx(InfoSmallIcon, {
+                css: /*#__PURE__*/ css({
+                    color: theme.colors.textSecondary
+                })
+            }),
+            ...props.tooltip
+        } : {
+            title: props.tooltip,
+            icon: /*#__PURE__*/ jsx(InfoSmallIcon, {
+                css: /*#__PURE__*/ css({
+                    color: theme.colors.textSecondary
+                })
+            })
+        };
+    }
     return /*#__PURE__*/ jsx(DesignSystemAntDConfigProvider, {
         children: /*#__PURE__*/ jsx(Form$1.Item, {
             ...addDebugOutlineIfEnabled(),
             ...props,
+            tooltip: tooltip,
             rules: wrappedRules,
             css: getMemoizedFormItemEmotionStyles({
                 theme,
@@ -32015,7 +32295,7 @@ const CursorPagination = function CursorPagination({ onNextPage, onPreviousPage,
         }),
         ...pageSizeEventContext.dataComponentProps,
         children: [
-            /*#__PURE__*/ jsx(Button$1, {
+            /*#__PURE__*/ jsx(Button, {
                 componentId: `${componentId}.previous_page`,
                 icon: /*#__PURE__*/ jsx(ChevronLeftIcon, {}),
                 disabled: !hasPreviousPage,
@@ -32023,7 +32303,7 @@ const CursorPagination = function CursorPagination({ onNextPage, onPreviousPage,
                 type: "tertiary",
                 children: previousPageText
             }),
-            /*#__PURE__*/ jsx(Button$1, {
+            /*#__PURE__*/ jsx(Button, {
                 componentId: `${componentId}.next_page`,
                 endIcon: /*#__PURE__*/ jsx(ChevronRightIcon, {}),
                 disabled: !hasNextPage,
@@ -32135,132 +32415,6 @@ const LegacyTable = (props)=>{
     });
 };
 
-// Module-level caches. Both styles depend only on theme (and zIndex), so share one
-// object across every LegacyTooltip instance instead of allocating per render.
-const TRIGGER = [
-    'hover',
-    'focus'
-];
-const getMemoizedDefaultOverlayInnerStyle = memoize((theme)=>({
-        backgroundColor: '#2F3941',
-        lineHeight: '22px',
-        padding: '4px 8px',
-        boxShadow: theme.general.shadowLow,
-        ...getDarkModePortalStyles(theme)
-    }));
-const getMemoizedDefaultOverlayStyle = memoize((theme)=>({
-        zIndex: theme.options.zIndexBase + 70
-    }), (theme)=>String(theme.options.zIndexBase));
-const getMemoizedAnimationCss = memoize((enableAnimation)=>/*#__PURE__*/ css({
-        ...getAnimationCss(enableAnimation)
-    }));
-/**
- * `LegacyTooltip` is deprecated in favor of the new `Tooltip` component
- * @deprecated
- */ const LegacyTooltip = ({ children, title, placement = 'top', dataTestId, dangerouslySetAntdProps, silenceScreenReader = false, useAsLabel = false, ...props })=>{
-    const { theme } = useDesignSystemTheme();
-    const tooltipRef = useRef(null);
-    const duboisId = useUniqueId('dubois-tooltip-component-');
-    const id = dangerouslySetAntdProps?.id ? dangerouslySetAntdProps?.id : duboisId;
-    if (!title) {
-        return /*#__PURE__*/ jsx(React__default.Fragment, {
-            children: children
-        });
-    }
-    const titleProps = silenceScreenReader ? {} : {
-        'aria-live': 'polite',
-        'aria-relevant': 'additions'
-    };
-    if (dataTestId) {
-        titleProps['data-testid'] = dataTestId;
-    }
-    const liveTitle = title && /*#__PURE__*/ React__default.isValidElement(title) ? /*#__PURE__*/ React__default.cloneElement(title, titleProps) : /*#__PURE__*/ jsx("span", {
-        ...titleProps,
-        children: title
-    });
-    const ariaProps = {
-        'aria-hidden': false
-    };
-    const addAriaProps = (e)=>{
-        if (!tooltipRef.current || e.currentTarget.hasAttribute('aria-describedby') || e.currentTarget.hasAttribute('aria-labelledby')) {
-            return;
-        }
-        if (id) {
-            e.currentTarget.setAttribute('aria-live', 'polite');
-            if (useAsLabel) {
-                e.currentTarget.setAttribute('aria-labelledby', id);
-            } else {
-                e.currentTarget.setAttribute('aria-describedby', id);
-            }
-        }
-    };
-    const removeAriaProps = (e)=>{
-        if (!tooltipRef || !e.currentTarget.hasAttribute('aria-describedby') && !e.currentTarget.hasAttribute('aria-labelledby')) {
-            return;
-        }
-        if (useAsLabel) {
-            e.currentTarget.removeAttribute('aria-labelledby');
-        } else {
-            e.currentTarget.removeAttribute('aria-describedby');
-        }
-        e.currentTarget.removeAttribute('aria-live');
-    };
-    const interactionProps = {
-        onMouseEnter: (e)=>{
-            addAriaProps(e);
-        },
-        onMouseLeave: (e)=>{
-            removeAriaProps(e);
-        },
-        onFocus: (e)=>{
-            addAriaProps(e);
-        },
-        onBlur: (e)=>{
-            removeAriaProps(e);
-        }
-    };
-    const childWithProps = /*#__PURE__*/ React__default.isValidElement(children) ? /*#__PURE__*/ React__default.cloneElement(children, {
-        ...ariaProps,
-        ...interactionProps,
-        ...children.props
-    }) : isNil(children) ? children : /*#__PURE__*/ jsx("span", {
-        ...ariaProps,
-        ...interactionProps,
-        children: children
-    });
-    const { overlayInnerStyle, overlayStyle, ...delegatedDangerouslySetAntdProps } = dangerouslySetAntdProps || {};
-    // When no overrides are passed, reuse the module-level memoized objects directly so
-    // the same reference is shared across every tooltip instance with the same theme.
-    const mergedOverlayInnerStyle = overlayInnerStyle ? {
-        backgroundColor: '#2F3941',
-        lineHeight: '22px',
-        padding: '4px 8px',
-        boxShadow: theme.general.shadowLow,
-        ...overlayInnerStyle,
-        ...getDarkModePortalStyles(theme)
-    } : getMemoizedDefaultOverlayInnerStyle(theme);
-    const mergedOverlayStyle = overlayStyle ? {
-        zIndex: theme.options.zIndexBase + 70,
-        ...overlayStyle
-    } : getMemoizedDefaultOverlayStyle(theme);
-    return /*#__PURE__*/ jsx(DesignSystemAntDConfigProvider, {
-        children: /*#__PURE__*/ jsx(Tooltip$1, {
-            id: id,
-            ref: tooltipRef,
-            title: liveTitle,
-            placement: placement,
-            // Always trigger on hover and focus
-            trigger: TRIGGER,
-            overlayInnerStyle: mergedOverlayInnerStyle,
-            overlayStyle: mergedOverlayStyle,
-            css: getMemoizedAnimationCss(theme.options.enableAnimation),
-            ...delegatedDangerouslySetAntdProps,
-            ...props,
-            children: childWithProps
-        })
-    });
-};
-
 const ListboxContext = /*#__PURE__*/ createContext(null);
 const useListboxContext = ()=>{
     const context = useContext(ListboxContext);
@@ -32391,7 +32545,7 @@ const ListboxInput = ({ value, onChange, placeholder, 'aria-controls': ariaContr
         css: {
             position: 'sticky',
             top: 0,
-            background: designSystemTheme.theme.colors.backgroundPrimary,
+            background: 'var(--db-listbox-surface)',
             zIndex: designSystemTheme.theme.options.zIndexBase + 1
         },
         children: /*#__PURE__*/ jsx(Input, {
@@ -32412,6 +32566,13 @@ const ListboxInput = ({ value, onChange, placeholder, 'aria-controls': ariaContr
     });
 };
 
+const LISTBOX_STYLES = /*#__PURE__*/ css({
+    outline: 'none',
+    '&:focus-visible': {
+        boxShadow: '0 0 0 var(--db-listbox-focus-ring-width) var(--db-listbox-focus-ring-color)',
+        borderRadius: 'var(--db-listbox-border-radius)'
+    }
+});
 const ListboxOptions = ({ options, onSelect, onHighlight, className })=>{
     const theme = useTheme();
     const { listboxId, selectedValue, setSelectedValue, highlightedValue, handleKeyNavigation } = useListboxContext();
@@ -32452,13 +32613,7 @@ const ListboxOptions = ({ options, onSelect, onHighlight, className })=>{
         tabIndex: 0,
         onKeyDown: handleKeyDown,
         "aria-activedescendant": highlightedValue ? `${listboxId}-${highlightedValue}` : undefined,
-        css: /*#__PURE__*/ css({
-            outline: 'none',
-            '&:focus-visible': {
-                boxShadow: `0 0 0 2px ${theme.colors.actionDefaultBorderFocus}`,
-                borderRadius: token(ShapeTokens.LIST_ITEM_BORDER_RADIUS, theme.borders.borderRadiusSm)
-            }
-        }),
+        css: LISTBOX_STYLES,
         children: options.map((option)=>(option.renderOption || ((additionalProps)=>/*#__PURE__*/ jsx("div", {
                     ...additionalProps,
                     children: option.label
@@ -32488,25 +32643,24 @@ const ListboxOptions = ({ options, onSelect, onHighlight, className })=>{
 const CONTAINER_CSS = /*#__PURE__*/ css({
     display: 'flex',
     flexDirection: 'column',
-    gap: '8px'
+    gap: 'var(--db-listbox-spacing)'
 });
 const RESULTS_WRAPPER_CSS = /*#__PURE__*/ css({
     width: '100%'
 });
-const getMemoizedNoResultsCss = memoize((theme)=>/*#__PURE__*/ css({
-        color: theme.colors.textSecondary,
-        textAlign: 'center',
-        padding: '6px 12px',
-        width: '100%',
-        boxSizing: 'border-box'
-    }));
+const NO_RESULTS_CSS = /*#__PURE__*/ css({
+    color: 'var(--db-listbox-empty-text)',
+    textAlign: 'center',
+    padding: 'var(--db-listbox-empty-spacing-vertical) var(--db-listbox-empty-spacing-horizontal)',
+    width: '100%',
+    boxSizing: 'border-box'
+});
 const DEFAULT_ANALYTICS_EVENTS$2 = [
     DesignSystemEventProviderAnalyticsEventTypes.OnValueChange
 ];
 const ListboxContent = ({ options, filterValue, setFilterValue, filterInputPlaceholder, onSelect, ariaLabel, includeFilterInput, filterInputEmptyMessage, listBoxDivRef })=>{
     const [highlightedValue, setHighlightedValue] = useState();
     const { listboxId } = useListboxContext();
-    const designSystemTheme = useDesignSystemTheme();
     const noResultsId = useMemo(()=>`${listboxId}-no-results`, [
         listboxId
     ]);
@@ -32573,7 +32727,7 @@ const ListboxContent = ({ options, filterValue, setFilterValue, filterInputPlace
                 })
             }) : /*#__PURE__*/ jsx("div", {
                 id: noResultsId,
-                css: getMemoizedNoResultsCss(designSystemTheme.theme),
+                css: NO_RESULTS_CSS,
                 children: filterInputEmptyMessage ?? 'No results found'
             })
         ]
@@ -32617,52 +32771,52 @@ const Listbox = ({ options, onSelect, includeFilterInput, filterInputEmptyMessag
     });
 };
 
-const getCommonTabsListStyles = (theme)=>{
-    return {
-        display: 'flex',
-        borderBottom: `1px solid ${theme.colors.actionDefaultBorderDefault}`,
-        marginBottom: theme.spacing.md,
-        height: theme.general.heightSm,
-        boxSizing: 'border-box'
-    };
+// Shared by Tabs and NavigationMenu, so these reference existing system/v1 tokens directly (no
+// component tier).
+const COMMON_TABS_LIST_STYLES = {
+    display: 'flex',
+    // No v2 token holds the shared tab/list divider color yet; bridges on the v1 --db-color-* token. TODO(FEINF-6505): adopt a v2 token when one lands.
+    borderBottom: '1px solid var(--db-color-action-default-border-default)',
+    marginBottom: 'var(--db-space-4)',
+    height: 'var(--db-size-8)',
+    boxSizing: 'border-box'
 };
-const getCommonTabsTriggerStyles = (theme)=>{
-    return {
-        display: 'flex',
-        fontWeight: theme.typography.typographyBoldFontWeight,
-        fontSize: theme.typography.fontSizeMd,
-        backgroundColor: 'transparent',
-        marginRight: theme.spacing.md
-    };
+const COMMON_TABS_TRIGGER_STYLES = {
+    display: 'flex',
+    'font-weight': 'var(--db-font-weight-semibold)',
+    fontSize: 'var(--db-font-size-base)',
+    backgroundColor: 'transparent',
+    marginRight: 'var(--db-space-4)'
 };
 
-const Root$6 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
+const Root$4 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
 /*#__PURE__*/ React__default.forwardRef((props, forwardedRef)=>{
     return /*#__PURE__*/ jsx(RadixNavigationMenu.Root, {
         ...props,
         ref: forwardedRef
     });
 });
-// Module-level caches keyed by discrete inputs (theme and/or active), so each holds only a
-// handful of entries. Same pattern as getShadowScrollStylesMemoized in css-utils.tsx.
-const getMemoizedListCss = memoize((theme)=>({
-        ...getCommonTabsListStyles(theme),
-        marginTop: 0,
-        padding: 0,
-        overflow: 'auto hidden',
-        listStyle: 'none'
-    }));
-const getMemoizedItemCss = memoize((theme, active)=>({
-        ...getCommonTabsTriggerStyles(theme),
+const LIST_CSS = {
+    ...COMMON_TABS_LIST_STYLES,
+    marginTop: 0,
+    padding: 0,
+    overflow: 'auto hidden',
+    listStyle: 'none'
+};
+// Module-level caches keyed by `active`, so each holds only a handful of entries. Same pattern
+// as getShadowScrollStylesMemoized in css-utils.tsx.
+const getMemoizedItemCss = memoize((active)=>({
+        ...COMMON_TABS_TRIGGER_STYLES,
         height: 'var(--db-navigation-menu-item-height)',
         minWidth: 'var(--db-navigation-menu-item-min-width)',
         justifyContent: 'center',
         ...active && {
             // Use box-shadow instead of border to prevent it from affecting the size of the element, which results in visual
             // jumping when switching tabs.
+            // No v2 token holds the box shadow yet. TODO(FEINF-6505): adopt a v2 token when one lands.
             boxShadow: 'inset 0 calc(-1 * var(--db-navigation-menu-indicator-thickness)) 0 var(--db-navigation-menu-indicator)'
         }
-    }), (theme, active)=>`${themeMemoKey(theme)}|${active}`);
+    }));
 const getMemoizedLinkCss = memoize((active)=>({
         padding: 'var(--db-navigation-menu-link-padding-top) 0 var(--db-navigation-menu-link-padding-bottom) 0',
         '&:focus-visible': {
@@ -32670,34 +32824,32 @@ const getMemoizedLinkCss = memoize((active)=>({
             outlineOffset: 'var(--db-navigation-menu-focus-ring-offset)'
         },
         '&&': {
-            color: active ? 'var(--db-navigation-menu-text-active)' : 'var(--db-navigation-menu-text)',
+            color: active ? 'var(--db-navigation-menu-text-selected)' : 'var(--db-navigation-menu-text)',
             textDecoration: 'none',
             '&:hover': {
-                color: active ? 'var(--db-navigation-menu-text-active)' : 'var(--db-navigation-menu-text-hover)',
+                color: active ? 'var(--db-navigation-menu-text-selected)' : 'var(--db-navigation-menu-text-hover)',
                 textDecoration: 'none'
             },
             '&:focus': {
                 textDecoration: 'none'
             },
             '&:active': {
-                color: active ? 'var(--db-navigation-menu-text-active)' : 'var(--db-navigation-menu-text-press)'
+                color: active ? 'var(--db-navigation-menu-text-selected)' : 'var(--db-navigation-menu-text-active)'
             }
         }
     }));
 const List$1 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
 /*#__PURE__*/ React__default.forwardRef((props, forwardedRef)=>{
-    const { theme } = useDesignSystemTheme();
     return /*#__PURE__*/ jsx(RadixNavigationMenu.List, {
-        css: getMemoizedListCss(theme),
+        css: LIST_CSS,
         ...props,
         ref: forwardedRef
     });
 });
 const Item$1 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
 /*#__PURE__*/ React__default.forwardRef(({ children, active, ...props }, forwardedRef)=>{
-    const { theme } = useDesignSystemTheme();
     return /*#__PURE__*/ jsx(RadixNavigationMenu.Item, {
-        css: getMemoizedItemCss(theme, Boolean(active)),
+        css: getMemoizedItemCss(Boolean(active)),
         ...props,
         ref: forwardedRef,
         children: /*#__PURE__*/ jsx(RadixNavigationMenu.Link, {
@@ -32713,7 +32865,7 @@ var NavigationMenu = /*#__PURE__*/Object.freeze({
   __proto__: null,
   Item: Item$1,
   List: List$1,
-  Root: Root$6
+  Root: Root$4
 });
 
 const DEFAULT_ANALYTICS_EVENTS_WITH_VIEW$2 = [
@@ -32827,7 +32979,7 @@ function getTagEmotionStyles(theme, color = 'default', clickable = false, closab
                 color: iconPress
             },
             '&:focus-visible': focusVisibleStyles,
-            '.anticon': {
+            [getIconClassName()]: {
                 verticalAlign: 0
             }
         },
@@ -32836,7 +32988,7 @@ function getTagEmotionStyles(theme, color = 'default', clickable = false, closab
             fontSize: theme.typography.fontSizeBase,
             fontWeight: theme.typography.typographyRegularFontWeight,
             lineHeight: theme.typography.lineHeightSm,
-            '& .anticon': {
+            [`& ${getIconClassName()}`]: {
                 verticalAlign: 'text-top'
             },
             whiteSpace: 'nowrap'
@@ -32911,7 +33063,6 @@ const Tag = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
     ]);
     const handleKeyDown = useCallback(// eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore [FEINF-3177] TODO: fix to work with React 18 types
-    // oxlint-disable-next-line @databricks/react-18-types-migration -- TODO(FEINF-6292)
     (e)=>{
         if (onKeyDown) {
             onKeyDown(e);
@@ -33009,11 +33160,11 @@ const getMemoizedRootCss = memoize((theme)=>({
 // Item icon css depends on (theme, size). At most 6 cache entries.
 const getMemoizedItemIconCss = memoize((theme, size)=>({
         marginRight: size === 'large' ? theme.spacing.sm : theme.spacing.xs,
-        [`& > .anticon`]: {
+        [`& > ${getIconClassName()}`]: {
             verticalAlign: `-3px`
         }
     }), (theme, size)=>`${themeMemoKey(theme)}|${size}`);
-const Root$5 = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
+const Root$3 = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
 ({ size, componentId, analyticsEvents = DEFAULT_ANALYTICS_EVENTS$1, valueHasNoPii, onValueChange, ...props }, forwardedRef)=>{
     const { theme } = useDesignSystemTheme();
     const contextValue = React__default.useMemo(()=>size ?? 'medium', [
@@ -33178,7 +33329,7 @@ const getMemoizedRadioGroupItemStyles = memoize((theme, size, iconClass)=>getRad
 var PillControl = /*#__PURE__*/Object.freeze({
   __proto__: null,
   Item: Item,
-  Root: Root$5
+  Root: Root$3
 });
 
 const DEFAULT_ANALYTICS_EVENTS = [
@@ -33304,64 +33455,66 @@ const PreviewCard = ({ icon, title, subtitle, titleActions, children, startActio
     return content;
 };
 const getPreviewCardStyles = (theme, isInteractive, size, disabled, fullBleedImage)=>{
-    const paddingSize = size === 'large' ? theme.spacing.lg : theme.spacing.md;
+    const paddingSize = size === 'large' ? 'var(--db-preview-card-padding-large)' : 'var(--db-preview-card-padding)';
+    const gapSize = size === 'large' ? 'var(--db-preview-card-gap-large)' : 'var(--db-preview-card-gap)';
     return {
         container: {
             overflow: 'hidden',
-            borderRadius: token(ShapeTokens.INFO_CONTAINER_BORDER_RADIUS, theme.borders.borderRadiusMd),
-            border: `1px solid ${theme.colors.border}`,
+            borderRadius: 'var(--db-preview-card-border-radius)',
+            border: 'var(--db-preview-card-border-width) solid var(--db-preview-card-border)',
             padding: paddingSize,
-            color: theme.colors.textSecondary,
+            color: 'var(--db-preview-card-text)',
             display: 'flex',
             flexDirection: 'column',
             justifyContent: 'space-between',
-            gap: size === 'large' ? theme.spacing.md : theme.spacing.sm,
-            boxShadow: theme.shadows.sm,
+            gap: gapSize,
+            boxShadow: 'var(--db-preview-card-shadow)',
             cursor: isInteractive ? 'pointer' : 'default',
             ...isInteractive && {
                 transition: 'box-shadow 0.2s, background-color 0.2s, border-color 0.2s, color 0.2s',
                 '&[aria-disabled="true"]': {
                     pointerEvents: 'none',
-                    backgroundColor: theme.colors.actionDisabledBackground,
-                    borderColor: theme.colors.actionDisabledBorder,
-                    color: theme.colors.actionDisabledText
+                    backgroundColor: 'var(--db-preview-card-surface-disabled)',
+                    borderColor: 'var(--db-preview-card-border-disabled)',
+                    color: 'var(--db-preview-card-text-disabled)'
                 },
                 '&:hover, &:focus-within': {
-                    boxShadow: theme.shadows.md
+                    boxShadow: 'var(--db-preview-card-shadow-hover)'
                 },
                 '&:active': {
-                    background: theme.colors.actionTertiaryBackgroundPress,
-                    borderColor: theme.colors.actionDefaultBorderHover,
-                    boxShadow: theme.shadows.md
+                    background: 'var(--db-preview-card-surface-active)',
+                    borderColor: 'var(--db-preview-card-border-hover)',
+                    boxShadow: 'var(--db-preview-card-shadow-hover)'
                 },
                 '&:focus, &[aria-pressed="true"]': {
-                    outlineColor: theme.colors.actionDefaultBorderFocus,
+                    outlineColor: 'var(--db-preview-card-border-focus)',
                     outlineWidth: 2,
                     outlineOffset: -2,
                     outlineStyle: 'solid',
-                    boxShadow: theme.shadows.md,
-                    borderColor: theme.colors.actionDefaultBorderHover
+                    boxShadow: 'var(--db-preview-card-shadow-hover)',
+                    borderColor: 'var(--db-preview-card-border-hover)'
                 },
                 '&:active:not(:focus):not(:focus-within)': {
                     background: 'transparent',
-                    borderColor: theme.colors.border
+                    borderColor: 'var(--db-preview-card-border)'
                 }
             }
         },
         image: {
-            margin: fullBleedImage ? `-${paddingSize}px -${paddingSize}px 0` : 0,
+            margin: fullBleedImage ? `calc(${paddingSize} * -1) calc(${paddingSize} * -1) 0` : 0,
             '& > *': {
-                borderRadius: fullBleedImage ? 0 : token(ShapeTokens.INFO_CONTAINER_BORDER_RADIUS, theme.borders.borderRadiusSm)
+                borderRadius: fullBleedImage ? 0 : 'var(--db-preview-card-image-border-radius)'
             }
         },
         header: {
             display: 'flex',
             alignItems: 'center',
-            gap: theme.spacing.sm
+            gap: 'var(--db-preview-card-gap)'
         },
         title: {
-            fontWeight: theme.typography.typographyBoldFontWeight,
-            color: disabled ? theme.colors.actionDisabledText : theme.colors.textPrimary,
+            fontWeight: 'var(--db-preview-card-title-font-weight)',
+            color: disabled ? 'var(--db-preview-card-text-disabled)' : 'var(--db-preview-card-title-text)',
+            // No v2 line-height token. TODO(FEINF-6557): adopt one when it lands.
             lineHeight: theme.typography.lineHeightSm
         },
         subTitle: {
@@ -33379,13 +33532,13 @@ const getPreviewCardStyles = (theme, isInteractive, size, disabled, fullBleedIma
             justifyContent: 'space-between',
             alignItems: 'center',
             flexWrap: 'wrap',
-            gap: theme.spacing.sm
+            gap: 'var(--db-preview-card-gap)'
         },
         action: {
             overflow: 'hidden',
             // to ensure focus ring is rendered
-            margin: theme.spacing.md * -1,
-            padding: theme.spacing.md
+            margin: 'calc(var(--db-preview-card-action-spacing) * -1)',
+            padding: 'var(--db-preview-card-action-spacing)'
         }
     };
 };
@@ -33421,7 +33574,7 @@ const getProgressRootStyles = (minWidth, maxWidth)=>{
     return /*#__PURE__*/ css(importantify(styles));
 };
 const getMemoizedProgressRootStyles = memoize(getProgressRootStyles, (minWidth, maxWidth)=>`${minWidth ?? ''}|${maxWidth ?? ''}`);
-const Root$4 = (props)=>{
+const Root$2 = (props)=>{
     const { children, value, minWidth, maxWidth, ...restProps } = props;
     const contextValue = useMemo(()=>({
             progress: value
@@ -33459,7 +33612,7 @@ const Indicator = (props)=>{
 var Progress = /*#__PURE__*/Object.freeze({
   __proto__: null,
   Indicator: Indicator,
-  Root: Root$4
+  Root: Root$2
 });
 
 const getRadioTileStyles = (theme, classNamePrefix, maxWidth)=>{
@@ -33637,7 +33790,6 @@ function getSegmentedControlButtonEmotionStyles(clsPrefix, theme, size, spaced =
     const classWrapper = `.${clsPrefix}-radio-button-wrapper`;
     const classWrapperDisabled = `.${clsPrefix}-radio-button-wrapper-disabled`;
     const classButton = `.${clsPrefix}-radio-button`;
-    const classIcon = `.${theme.general.iconfontCssPrefix}`;
     // Note: Ant radio button uses a 1px-wide `before` pseudo-element to recreate the left border of the button.
     // This is because the actual left border is disabled to avoid a double-border effect with the adjacent button's
     // right border.
@@ -33801,7 +33953,7 @@ function getSegmentedControlButtonEmotionStyles(clsPrefix, theme, size, spaced =
         },
         [`&${classWrapperChecked}`]: {
             color: theme.colors.actionDefaultTextDefault,
-            [`${classIcon}`]: {
+            [`& ${getIconClassName()}`]: {
                 color: theme.colors.textSecondary
             },
             backgroundColor: theme.colors.backgroundPrimary,
@@ -34227,7 +34379,7 @@ const getMemoizedNavButtonActiveCss = memoize((theme)=>importantify({
         borderRadius: theme.borders.borderRadiusSm,
         background: theme.colors.actionDefaultBackgroundPress,
         button: {
-            '&:enabled:not(:hover):not(:active) > .anticon': {
+            [`&:enabled:not(:hover):not(:active) > ${getIconClassName()}`]: {
                 color: theme.colors.actionTertiaryTextPress
             }
         }
@@ -34284,7 +34436,7 @@ const NavButton = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next
             active ? getMemoizedNavButtonActiveCss(theme) : undefined,
             dangerouslyAppendEmotionCSS
         ],
-        children: /*#__PURE__*/ jsx(Button$1, {
+        children: /*#__PURE__*/ jsx(Button, {
             ref: ref,
             icon: icon,
             onClick: onClick,
@@ -34645,7 +34797,7 @@ function PanelHeader({ children, dangerouslyAppendEmotionCSS, componentId, close
                 })
             }),
             contentContext.closable ? /*#__PURE__*/ jsx("div", {
-                children: /*#__PURE__*/ jsx(Button$1, {
+                children: /*#__PURE__*/ jsx(Button, {
                     componentId: componentId ? `${componentId}.close` : 'codegen_design-system_src_design-system_sidebar_sidebar.tsx_427',
                     size: "small",
                     icon: closeIcon ?? /*#__PURE__*/ jsx(CloseIcon, {}),
@@ -34693,7 +34845,7 @@ function PanelBody({ children, dangerouslyAppendEmotionCSS }) {
     return /*#__PURE__*/ jsx("div", {
         ref: bodyRef,
         // Needed to make panel body content focusable when scrollable for keyboard-only users to be able to focus & scroll
-        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+        // oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex
         tabIndex: shouldBeFocusable ? 0 : -1,
         css: [
             getMemoizedPanelBodyCss(theme),
@@ -34738,106 +34890,6 @@ const Sidebar = /* #__PURE__ */ (()=>{
     return Sidebar;
 })();
 
-const ROOT_STYLES = /*#__PURE__*/ css({
-    position: 'relative',
-    display: 'flex',
-    alignItems: 'center',
-    '&[data-orientation="vertical"]': {
-        flexDirection: 'column',
-        width: 20,
-        height: 100
-    },
-    '&[data-orientation="horizontal"]': {
-        height: 20,
-        width: 200
-    }
-});
-const Root$3 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    return /*#__PURE__*/ jsx(RadixSlider.Root, {
-        ...addDebugOutlineIfEnabled(),
-        css: ROOT_STYLES,
-        ...props,
-        ref: ref
-    });
-});
-const getTrackStyles = memoize((theme)=>/*#__PURE__*/ css({
-        backgroundColor: theme.colors.grey100,
-        position: 'relative',
-        flexGrow: 1,
-        borderRadius: theme.borders.borderRadiusFull,
-        '&[data-orientation="vertical"]': {
-            width: 3
-        },
-        '&[data-orientation="horizontal"]': {
-            height: 3
-        }
-    }));
-const Track = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixSlider.Track, {
-        css: getTrackStyles(theme),
-        ...props,
-        ref: ref
-    });
-});
-const getRangeStyles = memoize((theme)=>/*#__PURE__*/ css({
-        backgroundColor: theme.colors.primary,
-        position: 'absolute',
-        borderRadius: theme.borders.borderRadiusFull,
-        height: '100%',
-        '&[data-disabled]': {
-            backgroundColor: theme.colors.grey100
-        }
-    }));
-const Range = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixSlider.Range, {
-        css: getRangeStyles(theme),
-        ...props,
-        ref: ref
-    });
-});
-const getThumbStyles = memoize((theme)=>/*#__PURE__*/ css({
-        display: 'block',
-        width: 20,
-        height: 20,
-        backgroundColor: theme.colors.actionPrimaryBackgroundDefault,
-        boxShadow: 'none',
-        borderRadius: theme.borders.borderRadiusFull,
-        outline: 'none',
-        '&:hover': {
-            backgroundColor: theme.colors.actionPrimaryBackgroundHover
-        },
-        '&:focus': {
-            backgroundColor: theme.colors.actionPrimaryBackgroundPress
-        },
-        '&[data-disabled]': {
-            backgroundColor: theme.colors.grey200,
-            boxShadow: 'none'
-        }
-    }));
-const Thumb = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixSlider.Thumb, {
-        css: getThumbStyles(theme),
-        "aria-label": "Slider thumb",
-        ...props,
-        ref: ref
-    });
-});
-
-var Slider = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  Range: Range,
-  Root: Root$3,
-  Thumb: Thumb,
-  Track: Track
-});
-
 // eslint-disable-next-line @databricks/no-restricted-imports-regexp -- we can directly import antd icons here in order to wrap them for use elsewhere in the design system
 function React18CompatibleIconComponent(IconComponent) {
     return IconComponent;
@@ -34851,7 +34903,7 @@ function React18CompatibleIconComponent(IconComponent) {
  * use Du Bois icons from `__generated/icons`.
  */ const LegacyEllipsisOutlined = React18CompatibleIconComponent(EllipsisOutlined);
 
-const ButtonGroup = Button$2.Group;
+const ButtonGroup = Button$1.Group;
 const DropdownButton = (props)=>{
     const { theme } = useDesignSystemTheme();
     const { getPopupContainer: getContextPopupContainer, getPrefixCls } = useDesignSystemContext();
@@ -34878,7 +34930,7 @@ const DropdownButton = (props)=>{
     } else {
         dropdownProps.placement = 'bottomRight';
     }
-    const leftButton = /*#__PURE__*/ jsxs(Button$1, {
+    const leftButton = /*#__PURE__*/ jsxs(Button, {
         componentId: componentId ? `${componentId}.primary_button` : 'codegen_design-system_src_design-system_splitbutton_dropdown_dropdownbutton.tsx_148',
         type: type,
         form: form,
@@ -34901,7 +34953,7 @@ const DropdownButton = (props)=>{
             children
         ]
     });
-    const rightButton = /*#__PURE__*/ jsx(Button$1, {
+    const rightButton = /*#__PURE__*/ jsx(Button, {
         componentId: componentId ? `${componentId}.dropdown_button` : 'codegen_design-system_src_design-system_splitbutton_dropdown_dropdownbutton.tsx_166',
         type: type,
         danger: danger,
@@ -34938,7 +34990,7 @@ const DropdownButton = (props)=>{
                 ...dropdownProps,
                 overlay: overlay,
                 children: rightButtonToRender
-            }) : /*#__PURE__*/ jsxs(Root$a, {
+            }) : /*#__PURE__*/ jsxs(Root$8, {
                 ...dropdownMenuRootProps,
                 itemHtmlType: htmlType === 'submit' ? 'submit' : undefined,
                 children: [
@@ -34967,6 +35019,8 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, size) {
     const primary = (suffix = '')=>getBtnClassName(classNamePrefix, `-primary${suffix}`, '');
     const classDropdownTrigger = `.${classNamePrefix}-dropdown-trigger`;
     const classSmall = `.${classNamePrefix}-btn-group-sm`;
+    const iconClass = getIconClassName();
+    const iconStateSelectors = `${iconClass}, &:hover ${iconClass}, &:active ${iconClass}, &:focus-visible ${iconClass}`;
     const styles = {
         [btn()]: {
             ...getDefaultStyles(theme),
@@ -34980,13 +35034,13 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, size) {
                 outlineOffset: '-2px',
                 outlineColor: theme.colors.actionDefaultBorderFocus
             },
-            '.anticon, &:focus-visible .anticon': {
+            [`${iconClass}, &:focus-visible ${iconClass}`]: {
                 color: theme.colors.textSecondary
             },
-            '&:hover .anticon': {
+            [`&:hover ${iconClass}`]: {
                 color: theme.colors.actionDefaultIconHover
             },
-            '&:active .anticon': {
+            [`&:active ${iconClass}`]: {
                 color: theme.colors.actionDefaultIconPress
             }
         },
@@ -35010,7 +35064,7 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, size) {
                 outlineOffset: '-3px',
                 outlineColor: theme.colors.white
             },
-            '.anticon, &:hover .anticon, &:active .anticon, &:focus-visible .anticon': {
+            [iconStateSelectors]: {
                 color: theme.colors.actionPrimaryIcon
             }
         },
@@ -35036,13 +35090,13 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, size) {
                 [classDropdownTrigger]: {
                     borderLeft: `1px solid ${theme.colors.actionPrimaryIcon}`
                 },
-                '.anticon, &:hover .anticon, &:active .anticon, &:focus-visible .anticon': {
+                [iconStateSelectors]: {
                     color: theme.colors.actionDisabledText
                 }
             },
             [primary('[disabled]')]: {
                 ...getDisabledPrimarySplitButtonStyles(theme),
-                '.anticon, &:hover .anticon, &:active .anticon, &:focus-visible .anticon': {
+                [iconStateSelectors]: {
                     color: theme.colors.actionPrimaryTextDefault
                 }
             }
@@ -35105,7 +35159,7 @@ const SplitButton = (props)=>{
         children: /*#__PURE__*/ jsx("div", {
             ref: ref,
             css: SPLIT_BUTTON_CONTAINER_CSS,
-            children: loading ? /*#__PURE__*/ jsx(Button$1, {
+            children: loading ? /*#__PURE__*/ jsx(Button, {
                 componentId: "codegen_design-system_src_design-system_splitbutton_splitbutton.tsx_163",
                 type: type === 'default' ? undefined : type,
                 style: loadingButtonStyle,
@@ -35539,7 +35593,7 @@ const TabsListContext = /*#__PURE__*/ React__default.createContext({
         current: null
     }
 });
-const Root$2 = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
+const Root$1 = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
 ({ value, defaultValue, onValueChange, componentId, analyticsEvents, valueHasNoPii, ...props }, forwardedRef)=>{
     const emitOnView = safex('databricks.fe.observability.defaultComponentView.tabs', false);
     const isControlled = value !== undefined;
@@ -35655,7 +35709,7 @@ const List = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next-line
                         styles['addButtonContainer'],
                         addButtonProps.dangerouslyAppendEmotionCSS
                     ],
-                    children: /*#__PURE__*/ jsx(Button$1, {
+                    children: /*#__PURE__*/ jsx(Button, {
                         icon: /*#__PURE__*/ jsx(PlusIcon, {}),
                         size: "small",
                         "aria-label": "Add tab",
@@ -35841,8 +35895,6 @@ const Trigger$1 = /*#__PURE__*/ React__default.forwardRef(// eslint-disable-next
     });
 });
 const Content$1 = /*#__PURE__*/ React__default.forwardRef(({ mountMode = 'active', children, ...props }, forwardedRef)=>{
-    const { theme } = useDesignSystemTheme();
-    const css = getMemoizedContentStyles(theme);
     const { activeValue } = React__default.useContext(TabsRootContext);
     const shouldSetActivated = props.value === activeValue;
     const [hasBeenActivated, setHasBeenActivated] = React__default.useState(shouldSetActivated);
@@ -35850,7 +35902,7 @@ const Content$1 = /*#__PURE__*/ React__default.forwardRef(({ mountMode = 'active
         setHasBeenActivated(true);
     }
     return /*#__PURE__*/ jsx(RadixTabs.Content, {
-        css: css,
+        css: CONTENT_STYLES,
         ...props,
         ref: forwardedRef,
         forceMount: mountMode === 'force' || mountMode === 'preserve' || undefined,
@@ -35870,13 +35922,12 @@ const ADD_BUTTON_CONTAINER_CSS = {
     flex: 1
 };
 const ADD_BUTTON_CSS = {
-    margin: '2px 0 6px 0'
+    margin: 'var(--db-tabs-add-button-margin-top) 0 var(--db-tabs-add-button-margin-bottom) 0'
 };
 const getListStyles = (theme, shadowScrollStylesBackgroundColor, scrollbarHeight)=>{
-    const containerStyles = getCommonTabsListStyles(theme);
     return {
         container: {
-            ...containerStyles,
+            ...COMMON_TABS_LIST_STYLES,
             contain: 'layout paint'
         },
         root: SCROLL_ROOT_CSS,
@@ -35895,11 +35946,11 @@ const getListStyles = (theme, shadowScrollStylesBackgroundColor, scrollbarHeight
         },
         thumb: {
             flex: 1,
-            background: theme.isDarkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(17, 23, 28, 0.2)',
+            background: 'var(--db-tabs-scrollbar-thumb)',
             '&:hover': {
-                background: theme.isDarkMode ? 'rgba(255, 255, 255, 0.3)' : 'rgba(17, 23, 28, 0.3)'
+                background: 'var(--db-tabs-scrollbar-thumb-hover)'
             },
-            borderRadius: theme.borders.borderRadiusSm,
+            borderRadius: 'var(--db-tabs-scrollbar-radius)',
             position: 'relative'
         },
         addButtonContainer: ADD_BUTTON_CONTAINER_CSS,
@@ -35908,69 +35959,69 @@ const getListStyles = (theme, shadowScrollStylesBackgroundColor, scrollbarHeight
 };
 const getMemoizedListStyles = memoize(getListStyles, (theme, bg, scrollbarHeight)=>`${themeMemoKey(theme)}|${bg ?? ''}|${scrollbarHeight ?? ''}`);
 const getTriggerStyles = (theme, isClosable)=>{
-    const commonTriggerStyles = getCommonTabsTriggerStyles(theme);
+    const iconSelector = `${getIconClassName()}`;
     return {
         trigger: {
-            ...commonTriggerStyles,
+            ...COMMON_TABS_TRIGGER_STYLES,
             alignItems: 'center',
             justifyContent: isClosable ? 'space-between' : 'center',
-            minWidth: isClosable ? theme.spacing.lg + theme.spacing.md : theme.spacing.lg,
-            color: theme.colors.textSecondary,
-            lineHeight: theme.typography.lineHeightBase,
+            minWidth: isClosable ? 'var(--db-tabs-trigger-min-width-closable)' : 'var(--db-tabs-trigger-min-width)',
+            color: 'var(--db-tabs-text)',
+            lineHeight: 'var(--db-tabs-line-height)',
             whiteSpace: 'nowrap',
             border: 'none',
-            padding: `${theme.spacing.xs}px 0 ${theme.spacing.sm}px 0`,
+            padding: 'var(--db-tabs-trigger-padding-top) 0 var(--db-tabs-trigger-padding-bottom) 0',
             // The close icon is hidden on inactive tabs until the tab is hovered
             // Checking for the last icon to handle cases where the tab name includes an icon
-            [`& > .anticon:last-of-type`]: {
+            [`& > ${iconSelector}:last-of-type`]: {
                 visibility: 'hidden'
             },
             '&:hover': {
                 cursor: 'pointer',
-                color: theme.colors.actionDefaultTextHover,
-                [`& > .anticon:last-of-type`]: {
+                color: 'var(--db-tabs-text-hover)',
+                [`& > ${iconSelector}:last-of-type`]: {
                     visibility: 'visible'
                 }
             },
             '&:active': {
-                color: theme.colors.actionDefaultTextPress
+                color: 'var(--db-tabs-text-press)'
             },
             outlineStyle: 'none',
-            outlineColor: theme.colors.actionDefaultBorderFocus,
+            outlineColor: 'var(--db-tabs-focus-ring)',
             '&:focus-visible': {
                 outlineStyle: 'auto'
             },
             '&[data-state="active"]': {
-                color: theme.colors.textPrimary,
+                color: 'var(--db-tabs-text-active)',
                 // Use box-shadow instead of border to prevent it from affecting the size of the element, which results in visual
                 // jumping when switching tabs.
-                boxShadow: `inset 0 -4px 0 ${theme.colors.actionPrimaryBackgroundDefault}`,
+                boxShadow: 'inset 0 -4px 0 var(--db-tabs-indicator)',
                 // The close icon is always visible on active tabs
-                [`& > .anticon:last-of-type`]: {
+                [`& > ${iconSelector}:last-of-type`]: {
                     visibility: 'visible'
                 }
             },
             '&[data-disabled]': {
-                color: theme.colors.actionDisabledText,
+                color: 'var(--db-tabs-text-disabled)',
                 '&:hover': {
                     cursor: 'not-allowed'
                 }
             }
         },
         closeSmallIcon: {
-            marginLeft: theme.spacing.xs,
-            color: theme.colors.textSecondary,
+            marginLeft: 'var(--db-tabs-close-icon-gap)',
+            color: 'var(--db-tabs-text)',
             '&:hover': {
-                color: theme.colors.actionDefaultTextHover
+                color: 'var(--db-tabs-text-hover)'
             },
             '&:active': {
-                color: theme.colors.actionDefaultTextPress
+                color: 'var(--db-tabs-text-press)'
             }
         },
         // `trailingActions` only: the container is the visual tab (takes the consumer's className); the
         // inner trigger is a transparent passthrough.
         triggerContainer: {
-            ...commonTriggerStyles,
+            ...COMMON_TABS_TRIGGER_STYLES,
             display: 'inline-flex',
             alignItems: 'center',
             // Fill the list height so the active-tab underline (`inset 0 -4px` box-shadow below) lands on
@@ -35978,42 +36029,42 @@ const getTriggerStyles = (theme, isClosable)=>{
             // 20px line box (= heightSm); this branch's tallest child is a small Button, so match the
             // height explicitly instead — padding would overflow the list. Centered content keeps the
             // trailing actions and close icon in place; only the underline drops to the baseline.
-            height: theme.general.heightSm,
+            height: 'var(--db-tabs-height)',
             position: 'relative',
             // Scope the inner trigger's z-index:-1 hit-area overlay (see `triggerInner`) to this tab.
             isolation: 'isolate',
-            color: theme.colors.textSecondary,
+            color: 'var(--db-tabs-text)',
             // Focus lands on the inner button; draw the ring on the whole tab instead. Inset `outline`
             // (not box-shadow) so the strip's overflow can't clip it and it won't clobber an active underline.
             '&:has([role="tab"]:focus-visible)': {
-                outline: `2px solid ${theme.colors.actionDefaultBorderFocus}`,
+                outline: 'var(--db-tabs-focus-ring-width) solid var(--db-tabs-focus-ring)',
                 outlineOffset: '-2px'
             },
             '&:hover': {
                 cursor: 'pointer',
-                color: theme.colors.actionDefaultTextHover
+                color: 'var(--db-tabs-text-hover)'
             },
             '&:active': {
-                color: theme.colors.actionDefaultTextPress
+                color: 'var(--db-tabs-text-press)'
             },
             '&[data-state="active"]': {
-                color: theme.colors.textPrimary,
+                color: 'var(--db-tabs-text-active)',
                 // Use box-shadow instead of border to prevent it from affecting the size of the element, which results in visual
                 // jumping when switching tabs.
-                boxShadow: `inset 0 -4px 0 ${theme.colors.actionPrimaryBackgroundDefault}`
+                boxShadow: 'inset 0 -4px 0 var(--db-tabs-indicator)'
             },
             '&[data-disabled]': {
-                color: theme.colors.actionDisabledText,
+                color: 'var(--db-tabs-text-disabled)',
                 '&:hover': {
                     cursor: 'not-allowed'
                 }
             },
             // Mirror the single-trigger branch: hide the close icon on inactive tabs but keep its box
             // reserved (`visibility`, not width) so it doesn't shift the tab, and reveal on hover/active.
-            [`& > .anticon:last-of-type`]: {
+            [`& > ${iconSelector}:last-of-type`]: {
                 visibility: 'hidden'
             },
-            [`&:hover > .anticon:last-of-type, &[data-state="active"] > .anticon:last-of-type`]: {
+            [`&:hover > ${iconSelector}:last-of-type, &[data-state="active"] > ${iconSelector}:last-of-type`]: {
                 visibility: 'visible'
             }
         },
@@ -36047,18 +36098,18 @@ const getTriggerStyles = (theme, isClosable)=>{
     };
 };
 const getMemoizedTriggerStyles = memoize(getTriggerStyles, (theme, isClosable)=>`${themeMemoKey(theme)}|${isClosable}`);
-const getMemoizedContentStyles = memoize((theme)=>({
-        color: theme.colors.textPrimary,
-        '&[data-state="inactive"]': {
-            display: 'none'
-        }
-    }));
+const CONTENT_STYLES = {
+    color: 'var(--db-tabs-content-text)',
+    '&[data-state="inactive"]': {
+        display: 'none'
+    }
+};
 
 var Tabs = /*#__PURE__*/Object.freeze({
   __proto__: null,
   Content: Content$1,
   List: List,
-  Root: Root$2,
+  Root: Root$1,
   Trigger: Trigger$1
 });
 
@@ -36249,93 +36300,6 @@ const ToggleButton = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-
     });
 });
 
-const getRootStyles = memoize((theme)=>/*#__PURE__*/ css({
-        alignItems: 'center',
-        backgroundColor: theme.colors.backgroundSecondary,
-        border: `1px solid ${theme.colors.border}`,
-        borderRadius: theme.borders.borderRadiusSm,
-        boxShadow: theme.shadows.lg,
-        display: 'flex',
-        gap: theme.spacing.md,
-        width: 'max-content',
-        padding: theme.spacing.sm
-    }));
-const Root$1 = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixToolbar.Root, {
-        ...addDebugOutlineIfEnabled(),
-        css: getRootStyles(theme),
-        ...props,
-        ref: ref
-    });
-});
-const Button = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-(props, ref)=>{
-    return /*#__PURE__*/ jsx(RadixToolbar.Button, {
-        ...props,
-        ref: ref
-    });
-});
-const getSeparatorStyles = memoize((theme)=>/*#__PURE__*/ css({
-        alignSelf: 'stretch',
-        backgroundColor: theme.colors.borderDecorative,
-        width: 1
-    }));
-const Separator = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-(props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixToolbar.Separator, {
-        css: getSeparatorStyles(theme),
-        ...props,
-        ref: ref
-    });
-});
-const Link = // eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-/*#__PURE__*/ forwardRef((props, ref)=>{
-    return /*#__PURE__*/ jsx(RadixToolbar.Link, {
-        ...props,
-        ref: ref
-    });
-});
-const ToggleGroup = /*#__PURE__*/ forwardRef((props, ref)=>{
-    return /*#__PURE__*/ jsx(RadixToolbar.ToggleGroup, {
-        ...props,
-        ref: ref
-    });
-});
-const getToggleItemStyles = memoize((theme)=>/*#__PURE__*/ css({
-        background: 'none',
-        color: theme.colors.textPrimary,
-        border: 'none',
-        cursor: 'pointer',
-        '&:hover': {
-            color: theme.colors.actionDefaultTextHover
-        },
-        '&[data-state="on"]': {
-            color: theme.colors.actionDefaultTextPress
-        }
-    }));
-const ToggleItem = /*#__PURE__*/ forwardRef(// eslint-disable-next-line react-component-name/react-component-name -- TODO(FEINF-4716)
-(props, ref)=>{
-    const { theme } = useDesignSystemTheme();
-    return /*#__PURE__*/ jsx(RadixToolbar.ToggleItem, {
-        css: getToggleItemStyles(theme),
-        ...props,
-        ref: ref
-    });
-});
-
-var Toolbar = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  Button: Button,
-  Link: Link,
-  Root: Root$1,
-  Separator: Separator,
-  ToggleGroup: ToggleGroup,
-  ToggleItem: ToggleItem
-});
-
 const SWITCHER_ICON_CSS = {
     fontSize: '16px !important'
 };
@@ -37038,7 +37002,7 @@ function getWizardFooterButtons({ goToNextStepOrDone, isLastStep, currentStepInd
             // oxlint-disable-next-line @databricks/no-dynamic-property-value -- Validated through JSX componentId exempt:acae06b0-d74d-44ee-86db-15b3014e2bcf
             componentId: componentId ? `${componentId}.cancel` : undefined
         }, "cancel")),
-        currentStepIndex > 0 && !previousStepButtonHidden && /*#__PURE__*/ jsx(Button$1, {
+        currentStepIndex > 0 && !previousStepButtonHidden && /*#__PURE__*/ jsx(Button, {
             onClick: goToPreviousStep,
             type: "tertiary",
             disabled: previousButtonDisabled,
@@ -37067,7 +37031,7 @@ function getWizardFooterButtons({ goToNextStepOrDone, isLastStep, currentStepInd
     ]);
 }
 function CancelButton({ onCancel, cancelButtonContent, componentId, disabled }) {
-    return /*#__PURE__*/ jsx(Button$1, {
+    return /*#__PURE__*/ jsx(Button, {
         onClick: onCancel,
         type: "tertiary",
         componentId: componentId ?? 'dubois-wizard-footer-cancel',
@@ -37079,12 +37043,12 @@ function ButtonWithTooltip({ tooltipContent, disabled, children, ...props }) {
     return tooltipContent ? /*#__PURE__*/ jsx(Tooltip, {
         componentId: "dubois-wizard-footer-tooltip",
         content: tooltipContent,
-        children: /*#__PURE__*/ jsx(Button$1, {
+        children: /*#__PURE__*/ jsx(Button, {
             ...props,
             disabled: disabled,
             children: children
         })
-    }) : /*#__PURE__*/ jsx(Button$1, {
+    }) : /*#__PURE__*/ jsx(Button, {
         ...props,
         disabled: disabled,
         children: children
@@ -37257,7 +37221,7 @@ function Content({ title, modalTitleWhenCompact, width, children, closeLabel, di
                                     color: "secondary",
                                     children: title
                                 }),
-                                /*#__PURE__*/ jsx(Button$1, {
+                                /*#__PURE__*/ jsx(Button, {
                                     "aria-label": closeLabel,
                                     icon: /*#__PURE__*/ jsx(CloseIcon, {}),
                                     componentId: "documentation-side-bar-close",
@@ -37370,13 +37334,13 @@ function VerticalWizardContent({ width, height, steps: wizardSteps, currentStepI
                     ]
                 }),
                 isCompactStepper && (()=>{
-                    const compactStepperContent = /*#__PURE__*/ jsxs(Root$b, {
+                    const compactStepperContent = /*#__PURE__*/ jsxs(Root$9, {
                         componentId: "codegen_design-system_src_~patterns_wizard_verticalwizardcontent.tsx_93",
                         children: [
                             /*#__PURE__*/ jsx(Trigger$5, {
                                 asChild: true,
                                 children: /*#__PURE__*/ jsx("div", {
-                                    children: /*#__PURE__*/ jsx(Button$1, {
+                                    children: /*#__PURE__*/ jsx(Button, {
                                         icon: /*#__PURE__*/ jsx(ListIcon, {}),
                                         componentId: "dubois-wizard-vertical-compact-show-stepper-popover",
                                         children: verticalCompactButtonContent?.(currentStepIndex, stepperSteps.length)
@@ -37578,13 +37542,14 @@ function WizardStepNavigationProvider({ goToStep, currentStepIndex, children })
     });
 }
 
-function WizardModal({ onStepChanged, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }) {
+function WizardModal({ onStepChanged, onValidateStepChange, onCancel, initialStep, steps, onModalClose, localizeStepNumber, cancelButtonContent, nextButtonContent, previousButtonContent, doneButtonContent, enableClickingToSteps, ...modalProps }) {
     const [currentStepIndex, setCurrentStepIndex] = useState(initialStep ?? 0);
     const { onStepsChange, isLastStep, ...footerActions } = useWizardCurrentStep({
         currentStepIndex,
         setCurrentStepIndex,
         totalSteps: steps.length,
-        onStepChanged
+        onStepChanged,
+        onValidateStepChange
     });
     if (steps.length === 0 || !isUndefined(initialStep) && (initialStep < 0 || initialStep >= steps.length)) {
         return null;
@@ -37692,5 +37657,5 @@ function WizardStepContentWrapper({ header, title, description, alertContent, de
     });
 }
 
-export { tableClassNames as $, token as A, Button$1 as B, CheckCircleFillIcon as C, DocumentationSidebar as D, getDarkModePortalStyles as E, FIXED_VERTICAL_STEPPER_WIDTH as F, useModalContext as G, Trigger$5 as H, InfoFillIcon as I, InfoSmallIcon as J, Content$7 as K, Arrow$2 as L, MAX_VERTICAL_WIZARD_CONTENT_WIDTH as M, Tooltip as N, SparkleDoubleIcon as O, LoadingState as P, visuallyHidden as Q, Root$b as R, ShapeTokens as S, Typography as T, genSkeletonAnimatedColor as U, getOffsets as V, Wizard as W, DesignSystemEventSuppressInteractionProviderContext as X, DesignSystemEventSuppressInteractionTrueContextValue as Y, tableStyles as Z, repeatingElementsStyles as _, WizardControlled as a, MinusSquareIcon as a$, hideIconButtonRowStyles as a0, hideIconButtonActionCellClassName as a1, safex as a2, TitleSkeleton as a3, useDialogComboboxContext as a4, PlusIcon as a5, importantify as a6, getComboboxOptionItemWrapperStyles as a7, getFooterStyles as a8, useDialogComboboxOptionListContext as a9, Radio as aA, Checkbox as aB, DialogCombobox as aC, DialogComboboxTrigger as aD, DialogComboboxContent as aE, Select as aF, SelectTrigger as aG, SelectContent as aH, SelectOption as aI, LegacySelect as aJ, WarningIcon as aK, CheckCircleIcon as aL, DangerIcon as aM, Hint as aN, Title$1 as aO, CloseIcon as aP, RestoreAntDDefaultClsPrefix as aQ, AccessibleContainer as aR, DU_BOIS_ENABLE_ANIMATION_CLASSNAME as aS, Tag as aT, CircleOffIcon as aU, CircleOutlineIcon as aV, CircleIcon as aW, getBtnClassName as aX, SortAscendingIcon as aY, SortDescendingIcon as aZ, SortUnsortedIcon as a_, generateUuidV4 as aa, getContentOptions as ab, findHighlightedOption as ac, highlightOption as ad, Input as ae, SearchIcon as af, EmptyResults as ag, findClosestOptionSibling as ah, DialogComboboxOptionListCheckboxItem as ai, DialogComboboxOptionListSelectItem as aj, DialogComboboxOptionListContextProvider as ak, LoadingSpinner as al, DialogComboboxOptionList as am, useUniqueId as an, TypeaheadComboboxContextProvider as ao, useTypeaheadComboboxContext as ap, useDuboisThemeClass as aq, useDesignTokenOverrideStyles as ar, getComboboxContentWrapperStyles as as, ClearSelectionButton as at, TypeaheadComboboxSelectedItem$1 as au, CountBadge$1 as av, getValidationStateColor as aw, SectionHeader as ax, useComboboxState as ay, useMultipleSelectionState as az, WizardModal as b, BeakerIcon as b$, PlusSquareIcon as b0, TypeaheadComboboxV2ContextProvider as b1, useTypeaheadComboboxV2Context as b2, useRadixModalContext as b3, useIsomorphicLayoutEffect as b4, useScrollOptionIntoView as b5, InfoTooltip as b6, getInfoIconStyles as b7, HintRow as b8, getCheckboxStyles as b9, ArrowUpDotIcon as bA, ArrowUpFillIcon as bB, ArrowUpIcon as bC, ArrowsCollapseIcon as bD, ArrowsConnectIcon as bE, ArrowsExpandIcon as bF, ArrowsUpDownIcon as bG, AssistantIcon as bH, AtIcon as bI, Auth0Graphic as bJ, Auth0GraphicLarge as bK, AzHorizontalIcon as bL, AzVerticalIcon as bM, BANNER_MAX_HEIGHT as bN, BANNER_MIN_HEIGHT as bO, BackupIcon as bP, BadgeCodeIcon as bQ, BadgeCodeOffIcon as bR, Banner as bS, BarChartIcon as bT, BarGroupedIcon as bU, BarStackedIcon as bV, BarStackedPercentageIcon as bW, BarsAscendingHorizontalIcon as bX, BarsAscendingVerticalIcon as bY, BarsDescendingHorizontalIcon as bZ, BarsDescendingVerticalIcon as b_, getMenuItemStyles as ba, TypeaheadComboboxSelectedItem as bb, CountBadge as bc, TypeaheadComboboxMenuItem as bd, AccessDeniedGraphic as be, Accordion as bf, AccordionPanel as bg, AlignCenterIcon as bh, AlignJustifyIcon as bi, AlignLeftIcon as bj, AlignRightIcon as bk, AlignVerticalBottomIcon as bl, AlignVerticalCenterIcon as bm, AlignVerticalTopIcon as bn, AppIcon as bo, ApplyDesignSystemContextOverrides as bp, ApplyDesignSystemFlags as bq, ArrowDownDotIcon as br, ArrowDownFillIcon as bs, ArrowDownIcon as bt, ArrowInIcon as bu, ArrowInTableIcon as bv, ArrowLeftIcon as bw, ArrowOutTableIcon as bx, ArrowOverIcon as by, ArrowRightIcon as bz, WizardStepContentWrapper as c, CloudCheckIcon as c$, BinaryIcon as c0, BlockQuoteIcon as c1, BoldIcon as c2, BookIcon as c3, BookmarkFillIcon as c4, BookmarkIcon as c5, BooksIcon as c6, BracketsCheckIcon as c7, BracketsCurlyIcon as c8, BracketsErrorIcon as c9, CertifiedFillIcon as cA, CertifiedFillSmallIcon as cB, CertifiedIcon as cC, ChainIcon as cD, ChartLineIcon as cE, CheckCircleBadgeIcon as cF, CheckCircleSmallIcon as cG, CheckIcon as cH, CheckLineIcon as cI, CheckSmallIcon as cJ, CheckboxIcon as cK, ChecklistIcon as cL, ChevronDoubleDownIcon as cM, ChevronDoubleLeftIcon as cN, ChevronDoubleLeftOffIcon as cO, ChevronDoubleRightIcon as cP, ChevronDoubleRightOffIcon as cQ, ChevronDoubleUpIcon as cR, ChevronLeftIcon as cS, ChevronUpIcon as cT, ChipIcon as cU, CircleOffLargeIcon as cV, CircleOutlineLargeIcon as cW, ClipboardIcon as cX, ClockIcon as cY, ClockKeyIcon as cZ, ClockOffIcon as c_, BracketsSquareIcon as ca, BracketsXIcon as cb, BranchCheckIcon as cc, BranchIcon as cd, BranchResetIcon as ce, BriefcaseFillIcon as cf, BriefcaseIcon as cg, BrushIcon as ch, BugIcon as ci, CalendarClockIcon as cj, CalendarEventIcon as ck, CalendarIcon as cl, CalendarRangeIcon as cm, CalendarSyncIcon as cn, CameraIcon as co, CapitalizeIcon as cp, CaretDownSquareIcon as cq, CaretUpSquareIcon as cr, CatalogCloudIcon as cs, CatalogGearIcon as ct, CatalogHomeIcon as cu, CatalogIcon as cv, CatalogOffIcon as cw, CatalogSharedIcon as cx, CatalogUserHomeIcon as cy, CellsSquareIcon as cz, WizardStepNavigationProvider as d, Drawer as d$, CloudDatabaseIcon as d0, CloudDownloadIcon as d1, CloudIcon as d2, CloudKeyIcon as d3, CloudModelIcon as d4, CloudOffIcon as d5, CloudUploadIcon as d6, CodeIcon as d7, ColorFillIcon as d8, ColorMappingEditIcon as d9, DangerSmallIcon as dA, DashIcon as dB, DashboardCodeIcon as dC, DashboardIcon as dD, DataIcon as dE, DataMaskiingGraphic as dF, DatabaseClockIcon as dG, DatabaseIcon as dH, DatabaseImportIcon as dI, DatePicker as dJ, DecimalIcon as dK, DeprecatedIcon as dL, DeprecatedSmallIcon as dM, DesignSystemContext as dN, DesignSystemEventProviderComponentSubTypes as dO, DesignSystemProvider as dP, DesignSystemThemeContext as dQ, DesignSystemThemeProvider as dR, DialogComboboxCountBadge as dS, DialogComboboxCustomButtonTriggerWrapper as dT, DialogComboboxSectionHeader as dU, DollarIcon as dV, DomainCirclesThree as dW, DomainsIcon as dX, DotsCircleIcon as dY, DownloadIcon as dZ, DragIcon as d_, ColorMappingIcon as da, ColorVars as db, ColumnIcon as dc, ColumnSplitIcon as dd, ColumnTagIcon as de, ColumnsIcon as df, CommandIcon as dg, CommandPaletteIcon as dh, CompassIcon as di, ComponentFinderContext as dj, ConnectIcon as dk, Content$2 as dl, ContextMenu$1 as dm, CopyIcon as dn, CreditCardIcon as dp, CursorClickIcon as dq, CursorIcon as dr, CursorPagination as ds, CursorTypeIcon as dt, CustomAppIcon as du, DS_OVERRIDE_TOKENS_WRAPPER_TESTID as dv, DagHorizontalIcon as dw, DagIcon as dx, DagVerticalIcon as dy, DangerModal as dz, useWizardStepNavigation as e, GridIcon as e$, DropdownMenu as e0, Empty as e1, EmptyDashboardGraphic as e2, ErdIcon as e3, ExpandLessIcon as e4, ExpandMoreIcon as e5, FaceFrownIcon as e6, FaceNeutralIcon as e7, FaceSmileIcon as e8, FileCodeIcon as e9, FolderOpenCloudIcon as eA, FolderOpenCubeIcon as eB, FolderOpenIcon as eC, FolderOpenPipelineIcon as eD, FolderOutlinePipelineIcon as eE, FolderSolidPipelineIcon as eF, FontIcon as eG, ForkHorizontalIcon as eH, ForkIcon as eI, Form as eJ, FormContextResetBoundary as eK, FullscreenExitIcon as eL, FullscreenIcon as eM, FunctionIcon as eN, FunctionInputIcon as eO, GavelIcon as eP, GearFillIcon as eQ, GearIcon as eR, GenieCodeIcon as eS, GenieDeepResearchIcon as eT, GiftIcon as eU, GitCommitIcon as eV, GitMergeIcon as eW, GitRebaseIcon as eX, GlobeIcon as eY, Graphic as eZ, GridDashIcon as e_, FileCubeIcon as ea, FileDocumentIcon as eb, FileIcon as ec, FileImageIcon as ed, FileLockIcon as ee, FileModelIcon as ef, FileNewIcon as eg, FilePipelineIcon as eh, FilterFillIcon as ei, FilterIcon as ej, FlagPointerIcon as ek, FloatIcon as el, FlowIcon as em, FlowsIcon as en, FolderBranchFillIcon as eo, FolderBranchIcon as ep, FolderCloudFilledIcon as eq, FolderCloudIcon as er, FolderCubeIcon as es, FolderCubeOutlineIcon as et, FolderFillIcon as eu, FolderHomeIcon as ev, FolderIcon as ew, FolderNewIcon as ex, FolderNodeIcon as ey, FolderOpenBranchIcon as ez, DesignSystemEventProvider as f, LoopIcon as f$, GroupIcon as f0, H1Icon as f1, H2Icon as f2, H3Icon as f3, H4Icon as f4, H5Icon as f5, H6Icon as f6, HashIcon as f7, HistoryIcon as f8, HomeIcon as f9, LegacyOption as fA, LegacySelectOptGroup as fB, LegacySelectOption as fC, LegacyTable as fD, LegacyTooltip as fE, LetterFormatIcon as fF, LettersIcon as fG, LettersNumbersIcon as fH, LibrariesIcon as fI, LifesaverIcon as fJ, LightbulbIcon as fK, LightningCircleFillIcon as fL, LightningIcon as fM, LinearLineIcon as fN, LinkIcon as fO, LinkOffIcon as fP, ListBorderIcon as fQ, ListClearIcon as fR, ListIcon as fS, ListNumberIcon as fT, Listbox as fU, LoadingIcon as fV, LoadingStateContext as fW, LockFillIcon as fX, LockIcon as fY, LockShareIcon as fZ, LockUnlockedIcon as f_, Icon as fa, ImageIcon as fb, IndentDecreaseIcon as fc, IndentIncreaseIcon as fd, InfinityIcon as fe, InfoBookIcon as ff, InfoIcon as fg, IngestionIcon as fh, ItalicIcon as fi, JoinOperatorIcon as fj, KeyIcon as fk, KeyboardIcon as fl, LakebaseCatalogIcon as fm, LakebaseIcon as fn, LakeflowDesignerIcon as fo, LakewatchAlertIcon as fp, LakewatchDatasourceIcon as fq, LakewatchDetectionRuleIcon as fr, LakewatchParserIcon as fs, LayerGraphIcon as ft, LayerIcon as fu, Layout as fv, LeafIcon as fw, LegacyForm as fx, LegacyFormDubois as fy, LegacyOptGroup as fz, useDesignSystemTheme as g, PinIcon as g$, LowercaseIcon as g0, MailIcon as g1, MapIcon as g2, MarkdownIcon as g3, McpIcon as g4, MeasureIcon as g5, MegaphoneIcon as g6, MenuIcon as g7, MicrophoneIcon as g8, MicrophoneOffIcon as g9, OperatorIcon as gA, OutageGraphic as gB, OverflowHorizontalIcon as gC, OverflowIcon as gD, PageBottomIcon as gE, PageFirstIcon as gF, PageIcon as gG, PageLastIcon as gH, PageTopIcon as gI, Pagination as gJ, Panel as gK, PanelBody as gL, PanelDockedIcon as gM, PanelFloatingIcon as gN, PanelHeader as gO, PanelHeaderButtons as gP, PanelHeaderTitle as gQ, PaperclipIcon as gR, PassFailChecklistIcon as gS, PauseIcon as gT, PencilFillIcon as gU, PencilIcon as gV, PencilSparkleIcon as gW, PieChartIcon as gX, PillControl as gY, PinCancelIcon as gZ, PinFillIcon as g_, MinusCircleFillIcon as ga, MinusCircleIcon as gb, MinusCircleSmallIcon as gc, MissingBranchGraphic as gd, MissingGraphic as ge, ModelsIcon as gf, MonotoneLineIcon as gg, MonthPickerGrid as gh, MoonIcon as gi, Nav as gj, NavButton as gk, NavigationMenu as gl, NeonProjectIcon as gm, NewChatIcon as gn, NewTabIcon as go, NewWindowIcon as gp, NoCaseIcon as gq, NoIcon as gr, NotebookIcon as gs, NotebookPipelineIcon as gt, NotificationIcon as gu, NotificationOffIcon as gv, NumberFormatIcon as gw, NumbersIcon as gx, OfficeIcon as gy, OntologyIcon as gz, DesignTokenScope as h, SidebarAutoIcon as h$, PipelineCodeIcon as h0, PipelineCubeIcon as h1, PipelineIcon as h2, PivotOperatorIcon as h3, PlayCircleFillIcon as h4, PlayCircleIcon as h5, PlayDoubleIcon as h6, PlayIcon as h7, PlayMultipleIcon as h8, PlugIcon as h9, ResizeIcon as hA, RhfForm as hB, RichTextIcon as hC, RobotIcon as hD, RocketIcon as hE, RowsIcon as hF, RunIcon as hG, RunningIcon as hH, SMALL_BUTTON_HEIGHT$2 as hI, SaveClockIcon as hJ, SaveIcon as hK, SchemaIcon as hL, SchoolIcon as hM, SearchDataIcon as hN, SegmentedControlButton as hO, SegmentedControlGroup as hP, SelectContext as hQ, SelectContextProvider as hR, SelectOptionGroup as hS, SendIcon as hT, ShareIcon as hU, ShareNodesIcon as hV, ShieldCheckIcon as hW, ShieldIcon as hX, ShieldOffIcon as hY, ShortcutIcon as hZ, Sidebar as h_, PlusCircleFillIcon as ha, PlusCircleIcon as hb, PlusCircleSmallIcon as hc, PlusMinusSquareIcon as hd, Popover as he, PositionBottomIcon as hf, PositionLeftIcon as hg, PositionRightIcon as hh, PositionTopIcon as hi, PreviewCard as hj, Progress as hk, PullRequestIcon as hl, PuzzleIcon as hm, QueryEditorIcon as hn, QueryIcon as ho, QuestionMarkFillIcon as hp, QuestionMarkIcon as hq, RadioIcon as hr, RadioTile as hs, RangePicker as ht, ReaderModeIcon as hu, RedoIcon as hv, RefreshIcon as hw, RefreshPlayIcon as hx, RefreshXIcon as hy, ReplyIcon as hz, useDesignSystemContext as i, TableReportIcon as i$, SidebarClosedIcon as i0, SidebarCollapseIcon as i1, SidebarExpandIcon as i2, SidebarIcon as i3, SidebarOpenIcon as i4, SidebarSyncIcon as i5, SimpleSelect as i6, SimpleSelectOption as i7, SimpleSelectOptionGroup as i8, SlashSquareIcon as i9, SplitButton as iA, SqlIcon as iB, StarFillIcon as iC, StarIcon as iD, StepAfterLineIcon as iE, StepBeforeLineIcon as iF, Stepper as iG, StopCircleFillIcon as iH, StopCircleIcon as iI, StopIcon as iJ, StoredProcedureIcon as iK, StorefrontIcon as iL, StreamIcon as iM, StrikeThroughIcon as iN, SunIcon as iO, SyncIcon as iP, SyncSmallIcon as iQ, SyncToFileIcon as iR, TableAsteriskIcon as iS, TableClockIcon as iT, TableCombineIcon as iU, TableGlassesIcon as iV, TableGlobeIcon as iW, TableIcon as iX, TableLightningIcon as iY, TableMeasureIcon as iZ, TableModelIcon as i_, Slider as ia, SlidersIcon as ib, SnippetIcon as ic, SortCustomHorizontalIcon as id, SortCustomVerticalIcon as ie, SortHorizontalAscendingIcon as ig, SortHorizontalDescendingIcon as ih, SortLetterHorizontalAscendingIcon as ii, SortLetterHorizontalDescendingIcon as ij, SortLetterUnsortedIcon as ik, SortLetterVerticalAscendingIcon as il, SortLetterVerticalDescendingIcon as im, Spacer as io, SparkleDoubleFillIcon as ip, SparkleFillIcon as iq, SparkleIcon as ir, SparkleRectangleIcon as is, SpeechBubbleIcon as it, SpeechBubblePlusIcon as iu, SpeechBubbleQuestionMarkFillIcon as iv, SpeechBubbleQuestionMarkIcon as iw, SpeechBubbleStarIcon as ix, SpeedometerIcon as iy, Spinner as iz, WarningFillIcon as j, ZaHorizontalIcon as j$, TableStreamIcon as j0, TableVectorIcon as j1, TableViewIcon as j2, Tabs as j3, TagColumnIcon as j4, TagIcon as j5, TagTableIcon as j6, TargetIcon as j7, TerminalIcon as j8, TextBoxIcon as j9, UppercaseIcon as jA, UsageOverageGraphic as jB, UsageSpikeGraphic as jC, UsbIcon as jD, UserBadgeIcon as jE, UserCircleIcon as jF, UserGroupFillIcon as jG, UserGroupIcon as jH, UserIcon as jI, UserKeyIconIcon as jJ, UserShieldIcon as jK, UserSparkleIcon as jL, UserTeamIcon as jM, VisibleFillIcon as jN, VisibleIcon as jO, VisibleOffIcon as jP, VoiceModeIcon as jQ, WithDesignSystemThemeHoc as jR, WorkflowCodeIcon as jS, WorkflowCubeIcon as jT, WorkflowsIcon as jU, WorkspacesIcon as jV, WrenchIcon as jW, WrenchSparkleIcon as jX, XCircleFillIcon as jY, XCircleIcon as jZ, YearPickerGrid as j_, TextColorIcon as ja, TextIcon as jb, TextJustifyIcon as jc, TextUnderlineIcon as jd, ThreeDotsIcon as je, ThumbsDownFilledIcon as jf, ThumbsDownIcon as jg, ThumbsUpFilledIcon as jh, ThumbsUpIcon as ji, ToggleButton as jj, TokenIcon as jk, Toolbar as jl, TrashIcon as jm, Tree as jn, TreeIcon as jo, TrendingFillIcon as jp, TrendingIcon as jq, TriangleIcon as jr, TypeaheadComboboxCheckboxItem as js, TypeaheadComboboxFooter as jt, TypeaheadComboboxMenuItem$1 as ju, TypeaheadComboboxMultiSelectStateChangeTypes as jv, TypeaheadComboboxStateChangeTypes as jw, UnderlineIcon as jx, UndoIcon as jy, UploadIcon as jz, DangerFillIcon as k, ZaVerticalIcon as k0, ZeroOpsIcon as k1, ZeroOpsOutlineIcon as k2, ZoomInIcon as k3, ZoomMarqueeSelection as k4, ZoomOutIcon as k5, ZoomToFitIcon as k6, __INTERNAL_DO_NOT_USE__FormItem as k7, __INTERNAL_DO_NOT_USE__Group as k8, __INTERNAL_DO_NOT_USE__HorizontalGroup as k9, setImplicitContextGetter as kA, skipHideIconButtonActionClassName as kB, themeMemoKey as kC, useAntDConfigProviderContext as kD, useCallbackOnEnter as kE, useComponentFinderContext as kF, useDesignSystemEventSuppressInteractionContext as kG, useFormContext as kH, useRadioGroupContext as kI, __INTERNAL_DO_NOT_USE__VerticalGroup as ka, __INTERNAL_DO_NOT_USE__wrapLegacyFormRules as kb, augmentWithDataComponentProps as kc, dialogComboboxLookAheadKeyDown as kd, getBottomOnlyShadowScrollStyles as ke, getButtonEmotionStyles as kf, getComboboxOptionLabelStyles as kg, getDatePickerQuickActionBasic as kh, getDialogComboboxOptionLabelWidth as ki, getHorizontalTabShadowStyles as kj, getInputStyles as kk, getKeyboardNavigationFunctions as kl, getMemoizedButtonEmotionStyles as km, getPaginationEmotionStyles as kn, getPanelContainmentStyle as ko, getRadioStyles as kp, getRangeQuickActionsBasic as kq, getShadowScrollStyles as kr, getTypographyColor as ks, getVirtualListScrollbarStyles as kt, getVirtualListScrollbarThumbColor as ku, getVirtualizedComboboxMenuItemStyles as kv, getWrapperStyle as kw, highlightFirstNonDisabledOption as kx, isOptionDisabled as ky, resetTabIndexToFocusedElement as kz, DesignSystemEventProviderAnalyticsEventTypes as l, useDesignSystemEventComponentCallbacks as m, DesignSystemEventProviderComponentTypes as n, DesignSystemEventProviderComponentSubTypeMap as o, primitiveColors as p, useNotifyOnFirstView as q, useStableUuidV4 as r, ChevronDownIcon as s, ChevronRightIcon as t, useWizardCurrentStep as u, DesignSystemAntDConfigProvider as v, CloseSmallIcon as w, addDebugOutlineIfEnabled as x, Modal as y, getAnimationCss as z };
-//# sourceMappingURL=WizardStepContentWrapper-Bq1wm0V7.js.map
+export { repeatingElementsStyles as $, token as A, Button as B, CheckCircleFillIcon as C, DocumentationSidebar as D, getDarkModePortalStyles as E, FIXED_VERTICAL_STEPPER_WIDTH as F, useModalContext as G, Trigger$5 as H, InfoFillIcon as I, InfoSmallIcon as J, Content$7 as K, Arrow$2 as L, MAX_VERTICAL_WIZARD_CONTENT_WIDTH as M, Tooltip as N, SparkleDoubleIcon as O, getIconClassName as P, LoadingState as Q, Root$9 as R, ShapeTokens as S, Typography as T, visuallyHidden as U, genSkeletonAnimatedColor as V, Wizard as W, getOffsets as X, DesignSystemEventSuppressInteractionProviderContext as Y, DesignSystemEventSuppressInteractionTrueContextValue as Z, tableStyles as _, WizardControlled as a, SortUnsortedIcon as a$, tableClassNames as a0, hideIconButtonRowStyles as a1, hideIconButtonActionCellClassName as a2, safex as a3, TitleSkeleton as a4, useDialogComboboxContext as a5, PlusIcon as a6, importantify as a7, getComboboxOptionItemWrapperStyles as a8, getFooterStyles as a9, useMultipleSelectionState as aA, Radio as aB, Checkbox as aC, DialogCombobox as aD, DialogComboboxTrigger as aE, DialogComboboxContent as aF, Select as aG, SelectTrigger as aH, SelectContent as aI, SelectOption as aJ, LegacySelect as aK, WarningIcon as aL, CheckCircleIcon as aM, DangerIcon as aN, Hint as aO, Title$1 as aP, CloseIcon as aQ, RestoreAntDDefaultClsPrefix as aR, AccessibleContainer as aS, DU_BOIS_ENABLE_ANIMATION_CLASSNAME as aT, Tag as aU, CircleOffIcon as aV, CircleOutlineIcon as aW, CircleIcon as aX, getBtnClassName as aY, SortAscendingIcon as aZ, SortDescendingIcon as a_, useDialogComboboxOptionListContext as aa, generateUuidV4 as ab, getContentOptions as ac, findHighlightedOption as ad, highlightOption as ae, Input as af, SearchIcon as ag, EmptyResults as ah, findClosestOptionSibling as ai, DialogComboboxOptionListCheckboxItem as aj, DialogComboboxOptionListSelectItem as ak, DialogComboboxOptionListContextProvider as al, LoadingSpinner as am, DialogComboboxOptionList as an, useUniqueId as ao, TypeaheadComboboxContextProvider as ap, useTypeaheadComboboxContext as aq, useDuboisThemeClass as ar, useDesignTokenOverrideStyles as as, getComboboxContentWrapperStyles as at, ClearSelectionButton as au, TypeaheadComboboxSelectedItem$1 as av, CountBadge$1 as aw, getValidationStateColor as ax, SectionHeader as ay, useComboboxState as az, WizardModal as b, BarsDescendingVerticalIcon as b$, MinusSquareIcon as b0, PlusSquareIcon as b1, TypeaheadComboboxV2ContextProvider as b2, useTypeaheadComboboxV2Context as b3, useRadixModalContext as b4, useIsomorphicLayoutEffect as b5, useScrollOptionIntoView as b6, InfoTooltip as b7, getInfoIconStyles as b8, HintRow as b9, ArrowRightIcon as bA, ArrowUpDotIcon as bB, ArrowUpFillIcon as bC, ArrowUpIcon as bD, ArrowsCollapseIcon as bE, ArrowsConnectIcon as bF, ArrowsExpandIcon as bG, ArrowsUpDownIcon as bH, AssistantIcon as bI, AtIcon as bJ, Auth0Graphic as bK, Auth0GraphicLarge as bL, AzHorizontalIcon as bM, AzVerticalIcon as bN, BANNER_MAX_HEIGHT as bO, BANNER_MIN_HEIGHT as bP, BackupIcon as bQ, BadgeCodeIcon as bR, BadgeCodeOffIcon as bS, Banner as bT, BarChartIcon as bU, BarGroupedIcon as bV, BarStackedIcon as bW, BarStackedPercentageIcon as bX, BarsAscendingHorizontalIcon as bY, BarsAscendingVerticalIcon as bZ, BarsDescendingHorizontalIcon as b_, getCheckboxStyles as ba, getMenuItemStyles as bb, TypeaheadComboboxSelectedItem as bc, CountBadge as bd, TypeaheadComboboxMenuItem as be, AccessDeniedGraphic as bf, Accordion as bg, AccordionPanel as bh, AlignCenterIcon as bi, AlignJustifyIcon as bj, AlignLeftIcon as bk, AlignRightIcon as bl, AlignVerticalBottomIcon as bm, AlignVerticalCenterIcon as bn, AlignVerticalTopIcon as bo, AppIcon as bp, ApplyDesignSystemContextOverrides as bq, ApplyDesignSystemFlags as br, ArrowDownDotIcon as bs, ArrowDownFillIcon as bt, ArrowDownIcon as bu, ArrowInIcon as bv, ArrowInTableIcon as bw, ArrowLeftIcon as bx, ArrowOutTableIcon as by, ArrowOverIcon as bz, WizardStepContentWrapper as c, ClockOffIcon as c$, BeakerIcon as c0, BinaryIcon as c1, BlockQuoteIcon as c2, BoldIcon as c3, BookIcon as c4, BookmarkFillIcon as c5, BookmarkIcon as c6, BooksIcon as c7, BracketsCheckIcon as c8, BracketsCurlyIcon as c9, CellsSquareIcon as cA, CertifiedFillIcon as cB, CertifiedFillSmallIcon as cC, CertifiedIcon as cD, ChainIcon as cE, ChartLineIcon as cF, CheckCircleBadgeIcon as cG, CheckCircleSmallIcon as cH, CheckIcon as cI, CheckLineIcon as cJ, CheckSmallIcon as cK, CheckboxIcon as cL, ChecklistIcon as cM, ChevronDoubleDownIcon as cN, ChevronDoubleLeftIcon as cO, ChevronDoubleLeftOffIcon as cP, ChevronDoubleRightIcon as cQ, ChevronDoubleRightOffIcon as cR, ChevronDoubleUpIcon as cS, ChevronLeftIcon as cT, ChevronUpIcon as cU, ChipIcon as cV, CircleOffLargeIcon as cW, CircleOutlineLargeIcon as cX, ClipboardIcon as cY, ClockIcon as cZ, ClockKeyIcon as c_, BracketsErrorIcon as ca, BracketsSquareIcon as cb, BracketsXIcon as cc, BranchCheckIcon as cd, BranchIcon as ce, BranchResetIcon as cf, BriefcaseFillIcon as cg, BriefcaseIcon as ch, BrushIcon as ci, BugIcon as cj, CalendarClockIcon as ck, CalendarEventIcon as cl, CalendarIcon as cm, CalendarRangeIcon as cn, CalendarSyncIcon as co, CameraIcon as cp, CapitalizeIcon as cq, CaretDownSquareIcon as cr, CaretUpSquareIcon as cs, CatalogCloudIcon as ct, CatalogGearIcon as cu, CatalogHomeIcon as cv, CatalogIcon as cw, CatalogOffIcon as cx, CatalogSharedIcon as cy, CatalogUserHomeIcon as cz, WizardStepNavigationProvider as d, DragIcon as d$, CloudCheckIcon as d0, CloudDatabaseIcon as d1, CloudDownloadIcon as d2, CloudIcon as d3, CloudKeyIcon as d4, CloudModelIcon as d5, CloudOffIcon as d6, CloudUploadIcon as d7, CodeIcon as d8, ColorFillIcon as d9, DangerModal as dA, DangerSmallIcon as dB, DashIcon as dC, DashboardCodeIcon as dD, DashboardIcon as dE, DataIcon as dF, DataMaskiingGraphic as dG, DatabaseClockIcon as dH, DatabaseIcon as dI, DatabaseImportIcon as dJ, DatePicker as dK, DecimalIcon as dL, DeprecatedIcon as dM, DeprecatedSmallIcon as dN, DesignSystemContext as dO, DesignSystemEventProviderComponentSubTypes as dP, DesignSystemProvider as dQ, DesignSystemThemeContext as dR, DesignSystemThemeProvider as dS, DialogComboboxCountBadge as dT, DialogComboboxCustomButtonTriggerWrapper as dU, DialogComboboxSectionHeader as dV, DollarIcon as dW, DomainCirclesThree as dX, DomainsIcon as dY, DotsCircleIcon as dZ, DownloadIcon as d_, ColorMappingEditIcon as da, ColorMappingIcon as db, ColorVars as dc, ColumnIcon as dd, ColumnSplitIcon as de, ColumnTagIcon as df, ColumnsIcon as dg, CommandIcon as dh, CommandPaletteIcon as di, CompassIcon as dj, ComponentFinderContext as dk, ConnectIcon as dl, Content$2 as dm, ContextMenu$1 as dn, CopyIcon as dp, CreditCardIcon as dq, CursorClickIcon as dr, CursorIcon as ds, CursorPagination as dt, CursorTypeIcon as du, CustomAppIcon as dv, DS_OVERRIDE_TOKENS_WRAPPER_TESTID as dw, DagHorizontalIcon as dx, DagIcon as dy, DagVerticalIcon as dz, useWizardStepNavigation as e, GridDashIcon as e$, Drawer as e0, DropdownMenu as e1, Empty as e2, EmptyDashboardGraphic as e3, ErdIcon as e4, ExpandLessIcon as e5, ExpandMoreIcon as e6, FaceFrownIcon as e7, FaceNeutralIcon as e8, FaceSmileIcon as e9, FolderOpenBranchIcon as eA, FolderOpenCloudIcon as eB, FolderOpenCubeIcon as eC, FolderOpenIcon as eD, FolderOpenPipelineIcon as eE, FolderOutlinePipelineIcon as eF, FolderSolidPipelineIcon as eG, FontIcon as eH, ForkHorizontalIcon as eI, ForkIcon as eJ, Form as eK, FormContextResetBoundary as eL, FullscreenExitIcon as eM, FullscreenIcon as eN, FunctionIcon as eO, FunctionInputIcon as eP, GavelIcon as eQ, GearFillIcon as eR, GearIcon as eS, GenieCodeIcon as eT, GenieDeepResearchIcon as eU, GiftIcon as eV, GitCommitIcon as eW, GitMergeIcon as eX, GitRebaseIcon as eY, GlobeIcon as eZ, Graphic as e_, FileCodeIcon as ea, FileCubeIcon as eb, FileDocumentIcon as ec, FileIcon as ed, FileImageIcon as ee, FileLockIcon as ef, FileModelIcon as eg, FileNewIcon as eh, FilePipelineIcon as ei, FilterFillIcon as ej, FilterIcon as ek, FlagPointerIcon as el, FloatIcon as em, FlowIcon as en, FlowsIcon as eo, FolderBranchFillIcon as ep, FolderBranchIcon as eq, FolderCloudFilledIcon as er, FolderCloudIcon as es, FolderCubeIcon as et, FolderCubeOutlineIcon as eu, FolderFillIcon as ev, FolderHomeIcon as ew, FolderIcon as ex, FolderNewIcon as ey, FolderNodeIcon as ez, DesignSystemEventProvider as f, LockUnlockedIcon as f$, GridIcon as f0, GroupIcon as f1, H1Icon as f2, H2Icon as f3, H3Icon as f4, H4Icon as f5, H5Icon as f6, H6Icon as f7, HashIcon as f8, HistoryIcon as f9, LegacyFormDubois as fA, LegacyOptGroup as fB, LegacyOption as fC, LegacySelectOptGroup as fD, LegacySelectOption as fE, LegacyTable as fF, LetterFormatIcon as fG, LettersIcon as fH, LettersNumbersIcon as fI, LibrariesIcon as fJ, LifesaverIcon as fK, LightbulbIcon as fL, LightningCircleFillIcon as fM, LightningIcon as fN, LinearLineIcon as fO, LinkIcon as fP, LinkOffIcon as fQ, ListBorderIcon as fR, ListClearIcon as fS, ListIcon as fT, ListNumberIcon as fU, Listbox as fV, LoadingIcon as fW, LoadingStateContext as fX, LockFillIcon as fY, LockIcon as fZ, LockShareIcon as f_, HomeIcon as fa, Icon as fb, ImageIcon as fc, IndentDecreaseIcon as fd, IndentIncreaseIcon as fe, InfinityIcon as ff, InfoBookIcon as fg, InfoIcon as fh, IngestionIcon as fi, ItalicIcon as fj, JoinOperatorIcon as fk, KeyIcon as fl, KeyboardIcon as fm, LakebaseCatalogIcon as fn, LakebaseIcon as fo, LakeflowDesignerIcon as fp, LakewatchAlertIcon as fq, LakewatchDatasourceIcon as fr, LakewatchDetectionRuleIcon as fs, LakewatchIcon as ft, LakewatchParserIcon as fu, LayerGraphIcon as fv, LayerIcon as fw, Layout as fx, LeafIcon as fy, LegacyForm as fz, useDesignSystemTheme as g, PinFillIcon as g$, LoopIcon as g0, LowercaseIcon as g1, MailIcon as g2, MapIcon as g3, MarkdownIcon as g4, McpIcon as g5, MeasureIcon as g6, MegaphoneIcon as g7, MenuIcon as g8, MicrophoneIcon as g9, OntologyIcon as gA, OperatorIcon as gB, OutageGraphic as gC, OverflowHorizontalIcon as gD, OverflowIcon as gE, PageBottomIcon as gF, PageFirstIcon as gG, PageIcon as gH, PageLastIcon as gI, PageTopIcon as gJ, Pagination as gK, Panel as gL, PanelBody as gM, PanelDockedIcon as gN, PanelFloatingIcon as gO, PanelHeader as gP, PanelHeaderButtons as gQ, PanelHeaderTitle as gR, PaperclipIcon as gS, PassFailChecklistIcon as gT, PauseIcon as gU, PencilFillIcon as gV, PencilIcon as gW, PencilSparkleIcon as gX, PieChartIcon as gY, PillControl as gZ, PinCancelIcon as g_, MicrophoneOffIcon as ga, MinusCircleFillIcon as gb, MinusCircleIcon as gc, MinusCircleSmallIcon as gd, MissingBranchGraphic as ge, MissingGraphic as gf, ModelsIcon as gg, MonotoneLineIcon as gh, MonthPickerGrid as gi, MoonIcon as gj, Nav as gk, NavButton as gl, NavigationMenu as gm, NeonProjectIcon as gn, NewChatIcon as go, NewTabIcon as gp, NewWindowIcon as gq, NoCaseIcon as gr, NoIcon as gs, NotebookIcon as gt, NotebookPipelineIcon as gu, NotificationIcon as gv, NotificationOffIcon as gw, NumberFormatIcon as gx, NumbersIcon as gy, OfficeIcon as gz, DesignTokenScope as h, Sidebar as h$, PinIcon as h0, PipelineCodeIcon as h1, PipelineCubeIcon as h2, PipelineIcon as h3, PivotOperatorIcon as h4, PlayCircleFillIcon as h5, PlayCircleIcon as h6, PlayDoubleIcon as h7, PlayIcon as h8, PlayMultipleIcon as h9, ReplyIcon as hA, ResizeIcon as hB, RhfForm as hC, RichTextIcon as hD, RobotIcon as hE, RocketIcon as hF, RowsIcon as hG, RunIcon as hH, RunningIcon as hI, SMALL_BUTTON_HEIGHT$2 as hJ, SaveClockIcon as hK, SaveIcon as hL, SchemaIcon as hM, SchoolIcon as hN, SearchDataIcon as hO, SegmentedControlButton as hP, SegmentedControlGroup as hQ, SelectContext as hR, SelectContextProvider as hS, SelectOptionGroup as hT, SendIcon as hU, ShareIcon as hV, ShareNodesIcon as hW, ShieldCheckIcon as hX, ShieldIcon as hY, ShieldOffIcon as hZ, ShortcutIcon as h_, PlugIcon as ha, PlusCircleFillIcon as hb, PlusCircleIcon as hc, PlusCircleSmallIcon as hd, PlusMinusSquareIcon as he, Popover as hf, PositionBottomIcon as hg, PositionLeftIcon as hh, PositionRightIcon as hi, PositionTopIcon as hj, PreviewCard as hk, Progress as hl, PullRequestIcon as hm, PuzzleIcon as hn, QueryEditorIcon as ho, QueryIcon as hp, QuestionMarkFillIcon as hq, QuestionMarkIcon as hr, RadioIcon as hs, RadioTile as ht, RangePicker as hu, ReaderModeIcon as hv, RedoIcon as hw, RefreshIcon as hx, RefreshPlayIcon as hy, RefreshXIcon as hz, useDesignSystemContext as i, TableModelIcon as i$, SidebarAutoIcon as i0, SidebarClosedIcon as i1, SidebarCollapseIcon as i2, SidebarExpandIcon as i3, SidebarIcon as i4, SidebarOpenIcon as i5, SidebarSyncIcon as i6, SimpleSelect as i7, SimpleSelectOption as i8, SimpleSelectOptionGroup as i9, Spinner as iA, SplitButton as iB, SqlIcon as iC, StarFillIcon as iD, StarIcon as iE, StepAfterLineIcon as iF, StepBeforeLineIcon as iG, Stepper as iH, StopCircleFillIcon as iI, StopCircleIcon as iJ, StopIcon as iK, StoredProcedureIcon as iL, StorefrontIcon as iM, StreamIcon as iN, StrikeThroughIcon as iO, SunIcon as iP, SyncIcon as iQ, SyncSmallIcon as iR, SyncToFileIcon as iS, TableAsteriskIcon as iT, TableClockIcon as iU, TableCombineIcon as iV, TableGlassesIcon as iW, TableGlobeIcon as iX, TableIcon as iY, TableLightningIcon as iZ, TableMeasureIcon as i_, SlashSquareIcon as ia, SlidersIcon as ib, SlidesIcon as ic, SnippetIcon as id, SortCustomHorizontalIcon as ie, SortCustomVerticalIcon as ig, SortHorizontalAscendingIcon as ih, SortHorizontalDescendingIcon as ii, SortLetterHorizontalAscendingIcon as ij, SortLetterHorizontalDescendingIcon as ik, SortLetterUnsortedIcon as il, SortLetterVerticalAscendingIcon as im, SortLetterVerticalDescendingIcon as io, Spacer as ip, SparkleDoubleFillIcon as iq, SparkleFillIcon as ir, SparkleIcon as is, SparkleRectangleIcon as it, SpeechBubbleIcon as iu, SpeechBubblePlusIcon as iv, SpeechBubbleQuestionMarkFillIcon as iw, SpeechBubbleQuestionMarkIcon as ix, SpeechBubbleStarIcon as iy, SpeedometerIcon as iz, WarningFillIcon as j, ZaHorizontalIcon as j$, TableReportIcon as j0, TableStreamIcon as j1, TableVectorIcon as j2, TableViewIcon as j3, Tabs as j4, TagColumnIcon as j5, TagIcon as j6, TagTableIcon as j7, TargetIcon as j8, TerminalIcon as j9, UppercaseIcon as jA, UsageOverageGraphic as jB, UsageSpikeGraphic as jC, UsbIcon as jD, UserBadgeIcon as jE, UserCircleIcon as jF, UserGroupFillIcon as jG, UserGroupIcon as jH, UserIcon as jI, UserKeyIconIcon as jJ, UserShieldIcon as jK, UserSparkleIcon as jL, UserTeamIcon as jM, VisibleFillIcon as jN, VisibleIcon as jO, VisibleOffIcon as jP, VoiceModeIcon as jQ, WithDesignSystemThemeHoc as jR, WorkflowCodeIcon as jS, WorkflowCubeIcon as jT, WorkflowsIcon as jU, WorkspacesIcon as jV, WrenchIcon as jW, WrenchSparkleIcon as jX, XCircleFillIcon as jY, XCircleIcon as jZ, YearPickerGrid as j_, TextBoxIcon as ja, TextColorIcon as jb, TextIcon as jc, TextJustifyIcon as jd, TextUnderlineIcon as je, ThreeDotsIcon as jf, ThumbsDownFilledIcon as jg, ThumbsDownIcon as jh, ThumbsUpFilledIcon as ji, ThumbsUpIcon as jj, ToggleButton as jk, TokenIcon as jl, TrashIcon as jm, Tree as jn, TreeIcon as jo, TrendingFillIcon as jp, TrendingIcon as jq, TriangleIcon as jr, TypeaheadComboboxCheckboxItem as js, TypeaheadComboboxFooter as jt, TypeaheadComboboxMenuItem$1 as ju, TypeaheadComboboxMultiSelectStateChangeTypes as jv, TypeaheadComboboxStateChangeTypes as jw, UnderlineIcon as jx, UndoIcon as jy, UploadIcon as jz, DangerFillIcon as k, ZaVerticalIcon as k0, ZeroOpsIcon as k1, ZeroOpsOutlineIcon as k2, ZoomInIcon as k3, ZoomMarqueeSelection as k4, ZoomOutIcon as k5, ZoomToFitIcon as k6, __INTERNAL_DO_NOT_USE__FormItem as k7, __INTERNAL_DO_NOT_USE__Group as k8, __INTERNAL_DO_NOT_USE__HorizontalGroup as k9, setImplicitContextGetter as kA, skipHideIconButtonActionClassName as kB, themeMemoKey as kC, useAntDConfigProviderContext as kD, useCallbackOnEnter as kE, useComponentFinderContext as kF, useDesignSystemEventSuppressInteractionContext as kG, useFormContext as kH, useRadioGroupContext as kI, __INTERNAL_DO_NOT_USE__VerticalGroup as ka, __INTERNAL_DO_NOT_USE__wrapLegacyFormRules as kb, augmentWithDataComponentProps as kc, dialogComboboxLookAheadKeyDown as kd, getBottomOnlyShadowScrollStyles as ke, getButtonEmotionStyles as kf, getComboboxOptionLabelStyles as kg, getDatePickerQuickActionBasic as kh, getDialogComboboxOptionLabelWidth as ki, getHorizontalTabShadowStyles as kj, getInputStyles as kk, getKeyboardNavigationFunctions as kl, getMemoizedButtonEmotionStyles as km, getPaginationEmotionStyles as kn, getPanelContainmentStyle as ko, getRadioStyles as kp, getRangeQuickActionsBasic as kq, getShadowScrollStyles as kr, getTypographyColor as ks, getVirtualListScrollbarStyles as kt, getVirtualListScrollbarThumbColor as ku, getVirtualizedComboboxMenuItemStyles as kv, getWrapperStyle as kw, highlightFirstNonDisabledOption as kx, isOptionDisabled as ky, resetTabIndexToFocusedElement as kz, DesignSystemEventProviderAnalyticsEventTypes as l, useDesignSystemEventComponentCallbacks as m, DesignSystemEventProviderComponentTypes as n, DesignSystemEventProviderComponentSubTypeMap as o, primitiveColors as p, useNotifyOnFirstView as q, useStableUuidV4 as r, ChevronDownIcon as s, ChevronRightIcon as t, useWizardCurrentStep as u, DesignSystemAntDConfigProvider as v, CloseSmallIcon as w, addDebugOutlineIfEnabled as x, Modal as y, getAnimationCss as z };
+//# sourceMappingURL=WizardStepContentWrapper-bbh_CoIf.js.map