@databricks/design-system 1.12.18 → 1.12.19

package/dist/index.js

@@ -1,12 +1,12 @@
-import { u as useDesignSystemContext, a as useDesignSystemTheme, I as Icon, S as Spinner, D as DesignSystemAntDConfigProvider, R as RestoreAntDDefaultClsPrefix, b as DesignSystemEventProviderAnalyticsEventTypes, c as useDesignSystemEventComponentCallbacks, d as DesignSystemEventProviderComponentTypes, e as addDebugOutlineStylesIfEnabled, g as getAnimationCss, f as useNotifyOnFirstView, h as addDebugOutlineIfEnabled, C as CloseIcon, i as useDesignSystemSafexFlags, j as getDarkModePortalStyles, k as useUniqueId, l as Root$8, T as Trigger$4, m as Content$5, A as Arrow$2, B as Button, n as ChevronRightIcon, L as LoadingState, v as visuallyHidden, o as DesignSystemEventSuppressInteractionProviderContext, p as DesignSystemEventSuppressInteractionTrueContextValue, q as Typography, r as importantify, s as safex, t as CheckIcon, w as getComboboxOptionItemWrapperStyles, x as getComboboxContentWrapperStyles, y as getFooterStyles, z as highlightFirstNonDisabledOption, E as getInfoIconStyles, F as getKeyboardNavigationFunctions, G as dialogComboboxLookAheadKeyDown, H as getCheckboxStyles, J as getDialogComboboxOptionLabelWidth, K as getContentOptions, M as findHighlightedOption, N as highlightOption, O as findClosestOptionSibling, P as getComboboxOptionLabelStyles, Q as getSelectItemWithHintColumnStyles, U as getHintColumnStyles, V as getValidationStateColor, W as ApplyDesignSystemContextOverrides, X as getShadowScrollStyles, Y as DangerIcon, Z as WarningIcon, _ as LoadingIcon, $ as Title$2, a0 as AccessibleContainer, a1 as ChevronLeftIcon, a2 as DU_BOIS_ENABLE_ANIMATION_CLASSNAME, a3 as lightColorList, a4 as getDefaultStyles, a5 as getPrimaryStyles, a6 as getDisabledSplitButtonStyles, a7 as getDisabledPrimarySplitButtonStyles } from './Typography-CTfAhQ8V.js';
-export { ag as ApplyDesignSystemFlags, ar as ColorVars, ad as DesignSystemContext, aa as DesignSystemEventProvider, af as DesignSystemProvider, ac as DesignSystemThemeContext, ae as DesignSystemThemeProvider, am as LoadingStateContext, al as NewWindowIcon, an as Popover, ak as WithDesignSystemThemeHoc, ap as getBottomOnlyShadowScrollStyles, a9 as getButtonEmotionStyles, a8 as getMemoizedButtonEmotionStyles, ao as getTypographyColor, aq as getVirtualizedComboboxMenuItemStyles, ai as isOptionDisabled, aj as resetTabIndexToFocusedElement, ah as useAntDConfigProviderContext, ab as useDesignSystemEventSuppressInteractionContext } from './Typography-CTfAhQ8V.js';
+import { G as useDesignSystemContext, u as useDesignSystemTheme, I as Icon, H as Spinner, D as DesignSystemAntDConfigProvider, y as RestoreAntDDefaultClsPrefix, w as safex, d as DesignSystemEventProviderAnalyticsEventTypes, f as useDesignSystemEventComponentCallbacks, h as DesignSystemEventProviderComponentTypes, l as useNotifyOnFirstView, z as addDebugOutlineStylesIfEnabled, c as getAnimationCss, a as useDesignSystemSafexFlags, k as DesignSystemEventProviderComponentSubTypeMap, B as Button, T as Typography, b as addDebugOutlineIfEnabled, C as CloseIcon, A as getDarkModePortalStyles, J as useUniqueId, R as Root$8, m as Trigger$4, n as Content$5, K as Arrow$2, q as ChevronRightIcon, L as LoadingState, M as visuallyHidden, t as DesignSystemEventSuppressInteractionProviderContext, v as DesignSystemEventSuppressInteractionTrueContextValue, i as importantify, e as useFormContext, N as CheckIcon, O as ComponentFinderContext, r as getComboboxOptionItemWrapperStyles, P as getComboboxContentWrapperStyles, Q as getFooterStyles, U as highlightFirstNonDisabledOption, V as getInfoIconStyles, X as getKeyboardNavigationFunctions, Y as dialogComboboxLookAheadKeyDown, Z as getCheckboxStyles, _ as getDialogComboboxOptionLabelWidth, $ as getContentOptions, a0 as findHighlightedOption, a1 as highlightOption, a2 as findClosestOptionSibling, a3 as getComboboxOptionLabelStyles, a4 as getSelectItemWithHintColumnStyles, a5 as getHintColumnStyles, a6 as useComponentFinderContext, g as getValidationStateColor, a7 as ApplyDesignSystemContextOverrides, E as getShadowScrollStyles, j as DangerIcon, W as WarningIcon, a8 as LoadingIcon, a9 as Title$2, aa as AccessibleContainer, o as ChevronLeftIcon, ab as DU_BOIS_ENABLE_ANIMATION_CLASSNAME, ac as getDefaultStyles, ad as getPrimaryStyles, ae as getDisabledSplitButtonStyles, af as getDisabledPrimarySplitButtonStyles } from './Stepper-BevE-qWg.js';
+export { ap as ApplyDesignSystemFlags, aA as ColorVars, am as DesignSystemContext, aj as DesignSystemEventProvider, ai as DesignSystemEventProviderComponentSubTypes, ao as DesignSystemProvider, al as DesignSystemThemeContext, an as DesignSystemThemeProvider, av as LoadingStateContext, au as NewWindowIcon, aw as Popover, at as WithDesignSystemThemeHoc, x as augmentWithDataComponentProps, ay as getBottomOnlyShadowScrollStyles, ah as getButtonEmotionStyles, ag as getMemoizedButtonEmotionStyles, ax as getTypographyColor, az as getVirtualizedComboboxMenuItemStyles, ar as isOptionDisabled, as as resetTabIndexToFocusedElement, aq as useAntDConfigProviderContext, ak as useDesignSystemEventSuppressInteractionContext } from './Stepper-BevE-qWg.js';
 import * as React from 'react';
-import React__default, { useRef, useMemo, forwardRef, createContext, useContext, useCallback, useEffect, useState, useImperativeHandle, Children, Fragment as Fragment$1, useLayoutEffect } from 'react';
+import React__default, { useRef, useMemo, forwardRef, createContext, useContext, useCallback, useState, useEffect, useImperativeHandle, Children, Fragment as Fragment$1, useLayoutEffect } from 'react';
 import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
-import { I as Input } from './index-DSCOuDtB.js';
-export { C as ClockIcon, M as MegaphoneIcon, g as getInputStyles, u as useCallbackOnEnter } from './index-DSCOuDtB.js';
-import { u as useModalContext, I as InfoIcon, S as Spacer, L as ListIcon, T as Tooltip$1 } from './Tooltip-CQoHJStg.js';
-export { C as Content, D as DangerModal, M as Modal, N as Nav, a as NavButton, P as Panel, e as PanelBody, b as PanelHeader, d as PanelHeaderButtons, c as PanelHeaderTitle, f as Sidebar } from './Tooltip-CQoHJStg.js';
+import { I as Input, S as SearchIcon } from './index-BikpTrq_.js';
+export { C as ClockIcon, M as MegaphoneIcon, g as getInputStyles, u as useCallbackOnEnter } from './index-BikpTrq_.js';
+import { d as Modal, e as useModalContext, I as InfoIcon, S as Spacer, L as ListIcon, T as Tooltip$1 } from './WizardStepContentWrapper-DydFUbdD.js';
+export { C as Content, f as DangerModal, D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, N as Nav, g as NavButton, P as Panel, k as PanelBody, h as PanelHeader, j as PanelHeaderButtons, i as PanelHeaderTitle, l as Sidebar, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, u as useWizardCurrentStep } from './WizardStepContentWrapper-DydFUbdD.js';
 import { css, Global, keyframes, ClassNames, createElement } from '@emotion/react';
 import { Collapse, Alert as Alert$1, AutoComplete as AutoComplete$1, Tooltip, Breadcrumb as Breadcrumb$1, Checkbox as Checkbox$1, DatePicker, Dropdown as Dropdown$1, Select as Select$1, Radio as Radio$1, Switch as Switch$1, Col as Col$1, Row as Row$1, Space as Space$1, Layout as Layout$1, Form, notification, Popover as Popover$1, Skeleton, Pagination as Pagination$1, Table as Table$1, Tabs as Tabs$1, Menu as Menu$1, Button as Button$1, Steps as Steps$1, Tree as Tree$1 } from 'antd';
 import classnames from 'classnames';
@@ -20,6 +20,7 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { useController } from 'react-hook-form';
 import _uniqueId from 'lodash/uniqueId';
 import { useCombobox, useMultipleSelection } from 'downshift';
+import { computePosition, flip as flip$1, size } from '@floating-ui/dom';
 import { createPortal } from 'react-dom';
 import * as RadixHoverCard from '@radix-ui/react-hover-card';
 import AntDIcon, { InfoCircleOutlined } from '@ant-design/icons';
@@ -34,15 +35,18 @@ import * as RadixTabs from '@radix-ui/react-tabs';
 import * as Toggle from '@radix-ui/react-toggle';
 import chroma from 'chroma-js';
 import _isEqual from 'lodash/isEqual';
+import 'lodash/memoize';
 import '@radix-ui/react-tooltip';
 import 'lodash/endsWith';
 import 'lodash/isBoolean';
 import 'lodash/isNumber';
 import 'lodash/isString';
 import 'lodash/mapValues';
-import 'lodash/memoize';
 import '@emotion/unitless';
+import 'lodash/noop';
 import 'react-resizable';
+import 'lodash/pick';
+import 'lodash/compact';
 
 function useDesignSystemFlags() {
   const context = useDesignSystemContext();
@@ -1479,14 +1483,23 @@ function SvgCatalogOffIcon(props) {
     fill: "none",
     viewBox: "0 0 16 16",
     ...props,
-    children: [jsx("path", {
-      fill: "currentColor",
-      d: "M14.03.75v10.69l-1.5-1.5V1.5H4.78c-.2 0-.39.047-.558.131L3.136.545A2.74 2.74 0 0 1 4.78 0h8.5a.75.75 0 0 1 .75.75"
-    }), jsx("path", {
+    children: [jsxs("g", {
       fill: "currentColor",
-      fillRule: "evenodd",
-      d: "M2.03 3.56 1 2.53l1.06-1.06 13 13L14 15.53l-.017-.017a.75.75 0 0 1-.703.487H4.53a2.5 2.5 0 0 1-2.5-2.5zm8.94 8.94 1.56 1.56v.44h-8a1 1 0 1 1 0-2zM9.47 11H4.53c-.355 0-.693.074-1 .208V5.061z",
-      clipRule: "evenodd"
+      clipPath: "url(#CatalogOffIcon_svg__a)",
+      children: [jsx("path", {
+        d: "m14 11.94-1.5-1.5V5H7.061l-1.5-1.5h6.94v-2h-8c-.261 0-.499.1-.677.263L2.764.703A2.5 2.5 0 0 1 4.5 0h8.75a.75.75 0 0 1 .75.75z"
+      }), jsx("path", {
+        fillRule: "evenodd",
+        d: "M2 4.06.47 2.53l1.06-1.06 13.5 13.5-1.06 1.06-.03-.03H4.75A2.75 2.75 0 0 1 2 13.25zm1.5 1.5v7.69c0 .69.56 1.25 1.25 1.25h7.69z",
+        clipRule: "evenodd"
+      })]
+    }), jsx("defs", {
+      children: jsx("clipPath", {
+        children: jsx("path", {
+          fill: "#fff",
+          d: "M0 0h16v16H0z"
+        })
+      })
     })]
   });
 }
@@ -2480,17 +2493,22 @@ const CopyIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 CopyIcon.displayName = 'CopyIcon';
 
 function SvgCreditCardIcon(props) {
-  return jsx("svg", {
+  return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "none",
     viewBox: "0 0 16 16",
     ...props,
-    children: jsx("path", {
+    children: [jsx("path", {
       fill: "currentColor",
-      d: "M14.4 4.4v7.2q0 .483-.353.842a1.15 1.15 0 0 1-.847.358H2.8q-.483 0-.842-.358A1.15 1.15 0 0 1 1.6 11.6V4.4q0-.483.358-.841.36-.36.842-.359h10.4q.495 0 .848.359.352.357.352.841M2.8 5.6h10.4V4.4H2.8zm0 2.4v3.6h10.4V8z"
-    })
+      d: "M13 9H9v1.5h4z"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M1.75 2A1.75 1.75 0 0 0 0 3.75v8.5C0 13.216.784 14 1.75 14h12.5A1.75 1.75 0 0 0 16 12.25v-8.5A1.75 1.75 0 0 0 14.25 2zM1.5 3.75a.25.25 0 0 1 .25-.25h12.5a.25.25 0 0 1 .25.25V5.5h-13zM1.5 7h13v5.25a.25.25 0 0 1-.25.25H1.75a.25.25 0 0 1-.25-.25z",
+      clipRule: "evenodd"
+    })]
   });
 }
 const CreditCardIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
@@ -2586,6 +2604,31 @@ const CustomAppIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 CustomAppIcon.displayName = 'CustomAppIcon';
 
+function SvgDagHorizontalIcon(props) {
+  return jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M9 2.75A.75.75 0 0 1 9.75 2h5.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-5.5a.75.75 0 0 1-.748-.692L7.311 8l1.691 1.692A.75.75 0 0 1 9.75 9h5.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-5.5a.75.75 0 0 1-.75-.75v-1.44L6.998 9.809a.75.75 0 0 1-.748.692H.75A.75.75 0 0 1 0 9.75v-3.5a.75.75 0 0 1 .75-.75h5.5a.75.75 0 0 1 .748.692L9 4.189zm1.5 2.75h4v-2h-4zM5.5 7h-4v2h4zm5 3.5v2h4v-2z",
+      clipRule: "evenodd"
+    })
+  });
+}
+const DagHorizontalIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgDagHorizontalIcon
+  });
+});
+DagHorizontalIcon.displayName = 'DagHorizontalIcon';
+
 function SvgDagIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2611,6 +2654,31 @@ const DagIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 DagIcon.displayName = 'DagIcon';
 
+function SvgDagVerticalIcon(props) {
+  return jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M4.5 2.75A.75.75 0 0 1 5.25 2h5.5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-.564l2.571 2h2.493a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75h-5.5a.75.75 0 0 1-.75-.75v-3.5A.75.75 0 0 1 9.75 9h.564L8 7.2 5.686 9h.564a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-.75.75H.75a.75.75 0 0 1-.75-.75v-3.5A.75.75 0 0 1 .75 9h2.493l2.571-2H5.25a.75.75 0 0 1-.75-.75zM6 3.5v2h4v-2zm-4.5 7v2h4v-2zm9 0v2h4v-2z",
+      clipRule: "evenodd"
+    })
+  });
+}
+const DagVerticalIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgDagVerticalIcon
+  });
+});
+DagVerticalIcon.displayName = 'DagVerticalIcon';
+
 function SvgDIcon(props) {
   return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -3241,6 +3309,64 @@ const FileModelIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 FileModelIcon.displayName = 'FileModelIcon';
 
+function SvgFileNewIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M2 .75A.75.75 0 0 1 2.75 0h6a.75.75 0 0 1 .53.22l4.5 4.5c.141.14.22.331.22.53V7.5h-1.5V6H8.75A.75.75 0 0 1 8 5.25V1.5H3.5v12h4V15H2.75a.75.75 0 0 1-.75-.75zm7.5 1.81 1.94 1.94H9.5z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      d: "M11.25 15v-2.25H9v-1.5h2.25V9h1.5v2.25H15v1.5h-2.25V15z"
+    })]
+  });
+}
+const FileNewIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFileNewIcon
+  });
+});
+FileNewIcon.displayName = 'FileNewIcon';
+
+function SvgFilePipelineIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M2 .75A.75.75 0 0 1 2.75 0h6a.75.75 0 0 1 .53.22l4.5 4.5c.141.14.22.331.22.53V8h-1.5V6H8.75A.75.75 0 0 1 8 5.25V1.5H3.5v12h6V15H2.75a.75.75 0 0 1-.75-.75zm7.5 1.81 1.94 1.94H9.5z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M9.25 8.5a.75.75 0 0 0-.75.75v2.5c0 .414.336.75.75.75h.785a3.5 3.5 0 0 0 3.465 3h1.25a.75.75 0 0 0 .75-.75v-2.5a.75.75 0 0 0-.75-.75h-.785a3.5 3.5 0 0 0-3.465-3zM10 11v-1h.5a2 2 0 0 1 2 2 1 1 0 0 0 1 1h.5v1h-.5a2 2 0 0 1-2-2 1 1 0 0 0-1-1z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const FilePipelineIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFilePipelineIcon
+  });
+});
+FilePipelineIcon.displayName = 'FilePipelineIcon';
+
 function SvgFilterIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -3441,6 +3567,39 @@ const FolderCloudIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 FolderCloudIcon.displayName = 'FolderCloudIcon';
 
+function SvgFolderCubeIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M12.314 8.069a.75.75 0 0 0-.628 0l-3.248 1.5-.017.007A.75.75 0 0 0 8 10.25v3.5c0 .293.17.558.436.681l3.246 1.498a.75.75 0 0 0 .636 0l3.246-1.498A.75.75 0 0 0 16 13.75v-3.5a.75.75 0 0 0-.436-.681m-2.104.681L12 9.576l-1.46.674 1.46.674zm1.04 1.172-1.75.808v1.848l1.75-.808zm-3.25.808-1.75-.808v1.848l1.75.808z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      d: "m12.314 8.069 3.248 1.5Z"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M.75 2a.75.75 0 0 0-.75.75v10.5c0 .414.336.75.75.75h5.268A3 3 0 0 1 6 13.68V12.5H1.5v-9h3.172c.331 0 .649.132.883.366L6.97 5.28c.14.141.331.22.53.22h7v1.362l1.5.692V4.75a.75.75 0 0 0-.75-.75H7.81L6.617 2.805A2.75 2.75 0 0 0 4.672 2z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const FolderCubeIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderCubeIcon
+  });
+});
+FolderCubeIcon.displayName = 'FolderCubeIcon';
+
 function SvgFolderFillIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -3489,6 +3648,143 @@ const FolderIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 FolderIcon.displayName = 'FolderIcon';
 
+function SvgFolderNewIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      d: "M.75 2a.75.75 0 0 0-.75.75v10.5c0 .414.336.75.75.75H7.5v-1.5h-6v-9h3.172c.331 0 .649.132.883.366L6.97 5.28c.14.141.331.22.53.22h7V8H16V4.75a.75.75 0 0 0-.75-.75H7.81L6.617 2.805A2.75 2.75 0 0 0 4.672 2z"
+    }), jsx("path", {
+      fill: "currentColor",
+      d: "M11.25 11.25V9h1.5v2.25H15v1.5h-2.25V15h-1.5v-2.25H9v-1.5z"
+    })]
+  });
+}
+const FolderNewIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderNewIcon
+  });
+});
+FolderNewIcon.displayName = 'FolderNewIcon';
+
+function SvgFolderOpenIcon(props) {
+  return jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M0 2.75A.75.75 0 0 1 .75 2h3.922c.729 0 1.428.29 1.944.805L7.811 4h5.439a.75.75 0 0 1 .75.75V7h1.25a.75.75 0 0 1 .658 1.11l-3 5.5a.75.75 0 0 1-.658.39H.75a.747.747 0 0 1-.75-.75zm1.5 7.559L3.092 7.39A.75.75 0 0 1 3.75 7h8.75V5.5h-5a.75.75 0 0 1-.53-.22L5.555 3.866a1.25 1.25 0 0 0-.883-.366H1.5z",
+      clipRule: "evenodd"
+    })
+  });
+}
+const FolderOpenIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderOpenIcon
+  });
+});
+FolderOpenIcon.displayName = 'FolderOpenIcon';
+
+function SvgFolderOpenPipelineIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M0 1.75A.75.75 0 0 1 .75 1h3.922c.729 0 1.428.29 1.944.805L7.811 3h5.439a.75.75 0 0 1 .75.75V6h1.25a.75.75 0 0 1 .658 1.11L14.56 9.58A4.99 4.99 0 0 0 10.5 7.5H9.25A2.25 2.25 0 0 0 7 9.75v2.5q.002.396.128.75H.75a.747.747 0 0 1-.75-.75zm1.5 7.559L3.092 6.39A.75.75 0 0 1 3.75 6h8.75V4.5h-5a.75.75 0 0 1-.53-.22L5.555 2.866a1.25 1.25 0 0 0-.883-.366H1.5z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M8.5 9.75A.75.75 0 0 1 9.25 9h1.25a3.5 3.5 0 0 1 3.465 3h.785a.75.75 0 0 1 .75.75v2.5a.75.75 0 0 1-.75.75H13.5a3.5 3.5 0 0 1-3.465-3H9.25a.75.75 0 0 1-.75-.75zm1.5.75v1h.5a1 1 0 0 1 1 1 2 2 0 0 0 2 2h.5v-1h-.5a1 1 0 0 1-1-1 2 2 0 0 0-2-2z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const FolderOpenPipelineIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderOpenPipelineIcon
+  });
+});
+FolderOpenPipelineIcon.displayName = 'FolderOpenPipelineIcon';
+
+function SvgFolderOutlinePipelineIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      d: "M0 2.75A.75.75 0 0 1 .75 2h3.922c.729 0 1.428.29 1.944.805L7.811 4h7.439a.75.75 0 0 1 .75.75V10h-1.5V5.5h-7a.75.75 0 0 1-.53-.22L5.555 3.866a1.25 1.25 0 0 0-.883-.366H1.5v9h6V14H.75a.75.75 0 0 1-.75-.75z"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M9.25 8.5a.75.75 0 0 0-.75.75v2.5c0 .414.336.75.75.75h.785a3.5 3.5 0 0 0 3.465 3h1.25a.75.75 0 0 0 .75-.75v-2.5a.75.75 0 0 0-.75-.75h-.785a3.5 3.5 0 0 0-3.465-3zM10 11v-1h.5a2 2 0 0 1 2 2 1 1 0 0 0 1 1h.5v1h-.5a2 2 0 0 1-2-2 1 1 0 0 0-1-1z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const FolderOutlinePipelineIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderOutlinePipelineIcon
+  });
+});
+FolderOutlinePipelineIcon.displayName = 'FolderOutlinePipelineIcon';
+
+function SvgFolderSolidPipelineIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      d: "M.75 2a.75.75 0 0 0-.75.75v10.5c0 .414.336.75.75.75h8.166l-.01-.026A2.25 2.25 0 0 1 7 11.75v-2.5A2.25 2.25 0 0 1 9.25 7h1.25a5 5 0 0 1 4.595 3.026c.33.051.638.174.905.353V4.75a.75.75 0 0 0-.75-.75H7.81L6.617 2.805A2.75 2.75 0 0 0 4.672 2z"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M9.25 8.5a.75.75 0 0 0-.75.75v2.5c0 .414.336.75.75.75h.785a3.5 3.5 0 0 0 3.465 3h1.25a.75.75 0 0 0 .75-.75v-2.5a.75.75 0 0 0-.75-.75h-.785a3.5 3.5 0 0 0-3.465-3zM10 11v-1h.5a2 2 0 0 1 2 2 1 1 0 0 0 1 1h.5v1h-.5a2 2 0 0 1-2-2 1 1 0 0 0-1-1z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const FolderSolidPipelineIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgFolderSolidPipelineIcon
+  });
+});
+FolderSolidPipelineIcon.displayName = 'FolderSolidPipelineIcon';
+
 function SvgFontIcon(props) {
   return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -4393,20 +4689,13 @@ function SvgLightbulbIcon(props) {
     viewBox: "0 0 16 16",
     ...props,
     children: [jsx("path", {
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeWidth: 1.5,
-      d: "M7 15h2"
+      fill: "currentColor",
+      d: "M7.25 0v2h1.5V0zM16 7.25h-2v1.5h2zM0 7.25h2v1.5H0zM13.127 1.813l-1.415 1.414 1.061 1.06 1.414-1.414zM2.874 1.813l1.414 1.414-1.06 1.06-1.415-1.414z"
     }), jsx("path", {
       fill: "currentColor",
       fillRule: "evenodd",
-      d: "M9.475 10.019a2.5 2.5 0 1 0-2.95 0c.528.386.975 1.048.975 1.879V12h1v-.102c0-.83.447-1.492.975-1.88m.887 1.21a.84.84 0 0 0-.362.669v.852a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1-.75-.75v-.852a.84.84 0 0 0-.362-.67 4 4 0 1 1 4.724 0",
+      d: "M3.25 8.221C3.25 5.61 5.382 3.5 8 3.5s4.75 2.109 4.75 4.721a4.7 4.7 0 0 1-.985 2.879c-.754.973-1.33 1.776-1.33 2.644v1.506a.75.75 0 0 1-.75.75h-3.37a.75.75 0 0 1-.75-.75v-1.506c0-.868-.576-1.67-1.33-2.644A4.7 4.7 0 0 1 3.25 8.22M8 5C6.2 5 4.75 6.447 4.75 8.221c0 .738.25 1.417.67 1.96l.044.056c.284.366.612.789.897 1.263h3.278c.285-.474.613-.897.897-1.263l.043-.056c.422-.543.671-1.222.671-1.96C11.25 6.447 9.8 5 8 5m-.934 8.744c0-.256-.03-.504-.081-.744h2.03q-.079.36-.08.744v.756h-1.87z",
       clipRule: "evenodd"
-    }), jsx("path", {
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeWidth: 1.5,
-      d: "M11.375 3.78 12 3M13.051 6.316 14 6M4.625 3.78 4 3M2.949 6.316 2 6M8 2.5v-1"
     })]
   });
 }
@@ -4742,7 +5031,7 @@ const MailIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 MailIcon.displayName = 'MailIcon';
 
-function SvgMeasureIcon(props) {
+function SvgMapIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
@@ -4752,20 +5041,22 @@ function SvgMeasureIcon(props) {
     ...props,
     children: jsx("path", {
       fill: "currentColor",
-      d: "m14.884 4.409-3.293-3.293a1.25 1.25 0 0 0-1.768 0L1.116 9.823a1.25 1.25 0 0 0 0 1.768l3.293 3.293a1.25 1.25 0 0 0 1.768 0l8.707-8.707a1.25 1.25 0 0 0 0-1.768m-9.592 9.237L2.355 10.71 4 9.063l1.47 1.47A.751.751 0 1 0 6.532 9.47L5.062 8 6 7.063l1.47 1.47A.751.751 0 0 0 8.531 7.47L7.062 6 8 5.063l1.47 1.47a.751.751 0 1 0 1.062-1.063L9.062 4l1.647-1.646 2.938 2.937z"
-    })
+      fillRule: "evenodd",
+      d: "m2.058 13.934 3.827-1.723 3.675 2.646.015.011a.75.75 0 0 0 .735.065l4.248-1.912a.75.75 0 0 0 .442-.684V2.75a.75.75 0 0 0-1.058-.684L10.115 3.79 6.44 1.143l-.015-.011a.75.75 0 0 0-.735-.065L1.442 2.979A.75.75 0 0 0 1 3.663v9.587a.75.75 0 0 0 1.058.684M2.5 4.148 5.25 2.91v7.942L2.5 12.09zm8.25 1v7.942l2.75-1.238V3.91zm-1.5-.134-2.5-1.8v7.772l2.5 1.8z",
+      clipRule: "evenodd"
+    })
   });
 }
-const MeasureIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+const MapIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   return jsx(Icon, {
     ref: forwardedRef,
     ...props,
-    component: SvgMeasureIcon
+    component: SvgMapIcon
   });
 });
-MeasureIcon.displayName = 'MeasureIcon';
+MapIcon.displayName = 'MapIcon';
 
-function SvgMenuIcon(props) {
+function SvgMeasureIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
@@ -4776,21 +5067,21 @@ function SvgMenuIcon(props) {
     children: jsx("path", {
       fill: "currentColor",
       fillRule: "evenodd",
-      d: "M15 4H1V2.5h14zm0 4.75H1v-1.5h14zm0 4.75H1V12h14z",
+      d: "M10.22.72a.75.75 0 0 1 1.06 0l4 4a.75.75 0 0 1 0 1.06l-9.5 9.5a.75.75 0 0 1-1.06 0l-4-4a.75.75 0 0 1 0-1.06zm.53 1.59-8.44 8.44 2.94 2.94 1.314-1.315-1.47-1.47 1.061-1.06 1.47 1.47L8.939 10 7.47 8.53 8.53 7.47 10 8.94l1.314-1.315-1.47-1.47 1.061-1.06 1.47 1.47 1.314-1.315z",
       clipRule: "evenodd"
     })
   });
 }
-const MenuIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+const MeasureIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   return jsx(Icon, {
     ref: forwardedRef,
     ...props,
-    component: SvgMenuIcon
+    component: SvgMeasureIcon
   });
 });
-MenuIcon.displayName = 'MenuIcon';
+MeasureIcon.displayName = 'MeasureIcon';
 
-function SvgMetricViewIcon(props) {
+function SvgMenuIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
@@ -4800,18 +5091,20 @@ function SvgMetricViewIcon(props) {
     ...props,
     children: jsx("path", {
       fill: "currentColor",
-      d: "M14.1 3.915 8.6.905a1.24 1.24 0 0 0-1.2 0l-5.5 3.01a1.25 1.25 0 0 0-.65 1.097v5.976a1.25 1.25 0 0 0 .65 1.097l5.5 3.01a1.24 1.24 0 0 0 1.2 0l5.5-3.01a1.25 1.25 0 0 0 .65-1.097V5.012a1.25 1.25 0 0 0-.65-1.097M8 2.285l4.5 2.465L8 7.213 3.5 4.75zM2.75 6.05l4.5 2.463v4.792l-4.5-2.464zm6 7.255V8.512l4.5-2.463v4.791z"
+      fillRule: "evenodd",
+      d: "M15 4H1V2.5h14zm0 4.75H1v-1.5h14zm0 4.75H1V12h14z",
+      clipRule: "evenodd"
     })
   });
 }
-const MetricViewIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+const MenuIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   return jsx(Icon, {
     ref: forwardedRef,
     ...props,
-    component: SvgMetricViewIcon
+    component: SvgMenuIcon
   });
 });
-MetricViewIcon.displayName = 'MetricViewIcon';
+MenuIcon.displayName = 'MenuIcon';
 
 function SvgMinusCircleFillIcon(props) {
   return jsx("svg", {
@@ -4979,6 +5272,36 @@ const NotebookIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 NotebookIcon.displayName = 'NotebookIcon';
 
+function SvgNotebookPipelineIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M3 1.75A.75.75 0 0 1 3.75 1h10.5a.75.75 0 0 1 .75.75V8h-1.5V2.5h-6v11h2V15H3.75a.75.75 0 0 1-.75-.75V12.5H1V11h2V8.75H1v-1.5h2V5H1V3.5h2zm1.5.75v11H6v-11z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M9.25 8.5a.75.75 0 0 0-.75.75v2.5c0 .414.336.75.75.75h.785a3.5 3.5 0 0 0 3.465 3h1.25a.75.75 0 0 0 .75-.75v-2.5a.75.75 0 0 0-.75-.75h-.785a3.5 3.5 0 0 0-3.465-3zM10 11v-1h.5a2 2 0 0 1 2 2 1 1 0 0 0 1 1h.5v1h-.5a2 2 0 0 1-2-2 1 1 0 0 0-1-1z",
+      clipRule: "evenodd"
+    })]
+  });
+}
+const NotebookPipelineIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgNotebookPipelineIcon
+  });
+});
+NotebookPipelineIcon.displayName = 'NotebookPipelineIcon';
+
 function SvgNotificationIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -5462,6 +5785,34 @@ const PinIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 PinIcon.displayName = 'PinIcon';
 
+function SvgPipelineCodeIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M10.75 6.75A5.75 5.75 0 0 0 5 1H1.75a.75.75 0 0 0-.75.75V6c0 .414.336.75.75.75H5a.25.25 0 0 1 .25.25v2.25c0 1.338.457 2.57 1.223 3.546l1.072-1.071A4.23 4.23 0 0 1 6.75 9.25V7A1.75 1.75 0 0 0 5.5 5.322V2.53A4.25 4.25 0 0 1 9.25 6.75V9c0 .295.073.573.202.817L10.75 8.52zM4 2.5v2.75H2.5V2.5z",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      d: "m13.319 10.66 2.608 2.61-2.608 2.609-1.061-1.061 1.548-1.548-1.548-1.549zM10.68 10.66l-2.61 2.61 2.61 2.609 1.06-1.06-1.549-1.55 1.549-1.548z"
+    })]
+  });
+}
+const PipelineCodeIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgPipelineCodeIcon
+  });
+});
+PipelineCodeIcon.displayName = 'PipelineCodeIcon';
+
 function SvgPipelineIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -6245,41 +6596,6 @@ const SearchDataIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 SearchDataIcon.displayName = 'SearchDataIcon';
 
-function SvgSearchIcon(props) {
-  return jsxs("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "1em",
-    height: "1em",
-    fill: "none",
-    viewBox: "0 0 16 16",
-    ...props,
-    children: [jsx("g", {
-      clipPath: "url(#SearchIcon_svg__a)",
-      children: jsx("path", {
-        fill: "currentColor",
-        fillRule: "evenodd",
-        d: "M8 1a7 7 0 1 0 4.39 12.453l2.55 2.55 1.06-1.06-2.55-2.55A7 7 0 0 0 8 1M2.5 8a5.5 5.5 0 1 1 11 0 5.5 5.5 0 0 1-11 0",
-        clipRule: "evenodd"
-      })
-    }), jsx("defs", {
-      children: jsx("clipPath", {
-        children: jsx("path", {
-          fill: "#fff",
-          d: "M0 0h16v16H0z"
-        })
-      })
-    })]
-  });
-}
-const SearchIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
-  return jsx(Icon, {
-    ref: forwardedRef,
-    ...props,
-    component: SvgSearchIcon
-  });
-});
-SearchIcon.displayName = 'SearchIcon';
-
 function SvgSendIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -6583,7 +6899,7 @@ function SvgSlidersIcon(props) {
     children: jsx("path", {
       fill: "currentColor",
       fillRule: "evenodd",
-      d: "M2 3.104V2h1.5v1.104a2.751 2.751 0 0 1 0 5.292V14H2V8.396a2.751 2.751 0 0 1 0-5.292M1.5 5.75a1.25 1.25 0 1 1 2.5 0 1.25 1.25 0 0 1-2.5 0M12.5 2v1.104a2.751 2.751 0 0 0 0 5.292V14H14V8.396a2.751 2.751 0 0 0 0-5.292V2zm.75 2.5a1.25 1.25 0 1 0 0 2.5 1.25 1.25 0 0 0 0-2.5M7.25 14v-1.104a2.751 2.751 0 0 1 0-5.292V2h1.5v5.604a2.751 2.751 0 0 1 0 5.292V14zM8 11.5A1.25 1.25 0 1 1 8 9a1.25 1.25 0 0 1 0 2.5",
+      d: "M4 15v-2.354a2.751 2.751 0 0 1 0-5.292V1h1.5v6.354a2.751 2.751 0 0 1 0 5.292V15zm.75-3.75a1.25 1.25 0 1 1 0-2.5 1.25 1.25 0 0 1 0 2.5M10.5 1v2.354a2.751 2.751 0 0 0 0 5.292V15H12V8.646a2.751 2.751 0 0 0 0-5.292V1zm.75 3.75a1.25 1.25 0 1 0 0 2.5 1.25 1.25 0 0 0 0-2.5",
       clipRule: "evenodd"
     })
   });
@@ -6852,6 +7168,31 @@ const SpeechBubblePlusIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 SpeechBubblePlusIcon.displayName = 'SpeechBubblePlusIcon';
 
+function SvgSpeechBubbleQuestionMarkFillIcon(props) {
+  return jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M0 7a6 6 0 0 1 6-6h4a6 6 0 0 1 0 12h-.94l-2.78 2.78A.75.75 0 0 1 5 15.25v-2.299A5.75 5.75 0 0 1 0 7.25zm10.079-.389A2.25 2.25 0 1 0 5.75 5.75h1.5A.75.75 0 1 1 8 6.5h-.75V8H8a2.25 2.25 0 0 0 2.079-1.389M8 10.5A.75.75 0 1 1 8 9a.75.75 0 0 1 0 1.5",
+      clipRule: "evenodd"
+    })
+  });
+}
+const SpeechBubbleQuestionMarkFillIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgSpeechBubbleQuestionMarkFillIcon
+  });
+});
+SpeechBubbleQuestionMarkFillIcon.displayName = 'SpeechBubbleQuestionMarkFillIcon';
+
 function SvgSpeechBubbleQuestionMarkIcon(props) {
   return jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -7235,7 +7576,7 @@ const TableLightningIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 TableLightningIcon.displayName = 'TableLightningIcon';
 
-function SvgTableModelIcon(props) {
+function SvgTableMeasureIcon(props) {
   return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
@@ -7246,54 +7587,52 @@ function SvgTableModelIcon(props) {
     children: [jsx("path", {
       fill: "currentColor",
       fillRule: "evenodd",
-      d: "M1.75 1a.75.75 0 0 0-.75.75v12.5c0 .414.336.75.75.75H6.5V7H15V1.75a.75.75 0 0 0-.75-.75zM5 7v6.5H2.5V7zm8.5-1.5v-3h-11v3z",
+      d: "M1.75 1a.75.75 0 0 0-.75.75v12.5c0 .414.336.75.75.75H4v-1.5H2.5V7H5v2h1.5V7h3v2H11V7h2.5v2H15V1.75a.75.75 0 0 0-.75-.75zM13.5 5.5v-3h-11v3z",
       clipRule: "evenodd"
     }), jsx("path", {
       fill: "currentColor",
-      fillRule: "evenodd",
-      d: "M7.25 8.5a1.25 1.25 0 1 1 2.488.177l1.48 1.481a2 2 0 0 1 1.563 0l.731-.731a1.25 1.25 0 1 1 1.06 1.06l-.73.732a2 2 0 0 1 0 1.562l.731.731a1.25 1.25 0 1 1-1.06 1.06l-.732-.73a2 2 0 0 1-2.636-1.092H9.5a1.25 1.25 0 1 1 0-1.5h.645l.013-.031-1.481-1.481A1.25 1.25 0 0 1 7.25 8.5M11.5 12a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0",
-      clipRule: "evenodd"
+      d: "M5 11v3.25c0 .414.336.75.75.75h9.5a.75.75 0 0 0 .75-.75V11h-1.5v2.5h-.875V12h-1.5v1.5h-.875V11h-1.5v2.5h-.875V12h-1.5v1.5H6.5V11z"
     })]
   });
 }
-const TableModelIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+const TableMeasureIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   return jsx(Icon, {
     ref: forwardedRef,
     ...props,
-    component: SvgTableModelIcon
+    component: SvgTableMeasureIcon
   });
 });
-TableModelIcon.displayName = 'TableModelIcon';
+TableMeasureIcon.displayName = 'TableMeasureIcon';
 
-function SvgTableOnlineViewIcon(props) {
+function SvgTableModelIcon(props) {
   return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "none",
-    viewBox: "0 0 16 15",
+    viewBox: "0 0 16 16",
     ...props,
     children: [jsx("path", {
-      stroke: "currentColor",
-      strokeWidth: 1.5,
-      d: "M.75 1A.25.25 0 0 1 1 .75h12a.25.25 0 0 1 .25.25v12a.25.25 0 0 1-.25.25H1A.25.25 0 0 1 .75 13zM1 5.25h12M5.25 13V6"
-    }), jsx("path", {
-      fill: "#fff",
-      d: "M7 7h9v7.5H7z"
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M1.75 1a.75.75 0 0 0-.75.75v12.5c0 .414.336.75.75.75H6.5V7H15V1.75a.75.75 0 0 0-.75-.75zM5 7v6.5H2.5V7zm8.5-1.5v-3h-11v3z",
+      clipRule: "evenodd"
     }), jsx("path", {
-      stroke: "currentColor",
-      d: "M10.5 12H15m0 0-1.5-1.5M15 12l-1.5 1.5M12.5 9.5H8m0 0L9.5 11M8 9.5 9.5 8"
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M7.25 8.5a1.25 1.25 0 1 1 2.488.177l1.48 1.481a2 2 0 0 1 1.563 0l.731-.731a1.25 1.25 0 1 1 1.06 1.06l-.73.732a2 2 0 0 1 0 1.562l.731.731a1.25 1.25 0 1 1-1.06 1.06l-.732-.73a2 2 0 0 1-2.636-1.092H9.5a1.25 1.25 0 1 1 0-1.5h.645l.013-.031-1.481-1.481A1.25 1.25 0 0 1 7.25 8.5M11.5 12a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0",
+      clipRule: "evenodd"
     })]
   });
 }
-const TableOnlineViewIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+const TableModelIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
   return jsx(Icon, {
     ref: forwardedRef,
     ...props,
-    component: SvgTableOnlineViewIcon
+    component: SvgTableModelIcon
   });
 });
-TableOnlineViewIcon.displayName = 'TableOnlineViewIcon';
+TableModelIcon.displayName = 'TableModelIcon';
 
 function SvgTableStreamIcon(props) {
   return jsxs("svg", {
@@ -7888,6 +8227,34 @@ const UserIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 UserIcon.displayName = 'UserIcon';
 
+function SvgUserKeyIconIcon(props) {
+  return jsxs("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: [jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      d: "M4.75 4.25a3.25 3.25 0 1 1 6.5 0 3.25 3.25 0 0 1-6.5 0M8 2.5A1.75 1.75 0 1 0 8 6a1.75 1.75 0 0 0 0-3.5M12.75 12.372a2.251 2.251 0 1 0-1.5 0v2.878c0 .414.336.75.75.75h2v-2.75h-1.25zM12 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5",
+      clipRule: "evenodd"
+    }), jsx("path", {
+      fill: "currentColor",
+      d: "M1.75 15h8v-1.5H2.5v-.474a7.23 7.23 0 0 1 5.759-2.521 3.8 3.8 0 0 1 .2-1.493 8.735 8.735 0 0 0-7.295 3.275.75.75 0 0 0-.164.469v1.494c0 .414.336.75.75.75"
+    })]
+  });
+}
+const UserKeyIconIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgUserKeyIconIcon
+  });
+});
+UserKeyIconIcon.displayName = 'UserKeyIconIcon';
+
 function SvgUserSparkleIcon(props) {
   return jsxs("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -8353,6 +8720,29 @@ const ZoomOutIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
 });
 ZoomOutIcon.displayName = 'ZoomOutIcon';
 
+function SvgZoomToFitIcon(props) {
+  return jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "none",
+    viewBox: "0 0 16 16",
+    ...props,
+    children: jsx("path", {
+      fill: "currentColor",
+      d: "m2.5 3.56 2.97 2.97 1.06-1.06L3.56 2.5H6V1H1v5h1.5zM10.53 6.53l2.97-2.97V6H15V1h-5v1.5h2.44L9.47 5.47zM9.47 10.53l2.97 2.97H10V15h5v-5h-1.5v2.44l-2.97-2.97zM5.47 9.47 2.5 12.44V10H1v5h5v-1.5H3.56l2.97-2.97z"
+    })
+  });
+}
+const ZoomToFitIcon = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  return jsx(Icon, {
+    ref: forwardedRef,
+    ...props,
+    component: SvgZoomToFitIcon
+  });
+});
+ZoomToFitIcon.displayName = 'ZoomToFitIcon';
+
 const getButtonStyles = theme => {
   return /*#__PURE__*/css({
     color: theme.colors.textPlaceholder,
@@ -8396,7 +8786,9 @@ const dialogComboboxContextDefaults = {
   textOverflowMode: 'multiline',
   setTextOverflowMode: () => {},
   scrollToSelectedElement: true,
-  rememberLastScrollPosition: false
+  rememberLastScrollPosition: false,
+  disableMouseOver: false,
+  setDisableMouseOver: () => {}
 };
 const DialogComboboxContext = /*#__PURE__*/createContext(dialogComboboxContextDefaults);
 const DialogComboboxContextProvider = _ref => {
@@ -8538,7 +8930,13 @@ const getCommonTabsTriggerStyles = theme => {
   };
 };
 
-function getAccordionEmotionStyles(clsPrefix, theme) {
+function getAccordionEmotionStyles(_ref) {
+  let {
+    clsPrefix,
+    theme,
+    alignContentToEdge,
+    isLeftAligned
+  } = _ref;
   const classItem = `.${clsPrefix}-item`;
   const classItemActive = `${classItem}-active`;
   const classHeader = `.${clsPrefix}-header`;
@@ -8571,26 +8969,30 @@ function getAccordionEmotionStyles(clsPrefix, theme) {
       color: theme.colors.textPrimary,
       fontWeight: 600,
       '&:focus-visible': {
-        outlineColor: `${theme.colors.primary} !important`,
+        outlineColor: `${theme.colors.actionDefaultBorderFocus} !important`,
         outlineStyle: 'auto !important'
       }
     },
     [`& > ${classItem} > ${classHeader} > ${classArrow}`]: {
-      fontSize: theme.general.iconSize,
-      right: 12
+      fontSize: theme.general.iconFontSize,
+      right: alignContentToEdge || isLeftAligned ? 0 : 12,
+      ...(isLeftAligned && {
+        verticalAlign: 'middle',
+        marginTop: -2
+      })
     },
     [classArrow]: {
       color: theme.colors.textSecondary
     },
     [`& > ${classItemActive} > ${classHeader} > ${classArrow}`]: {
-      transform: 'translateY(-50%) rotate(180deg)'
+      transform: isLeftAligned ? 'rotate(180deg)' : 'translateY(-50%) rotate(180deg)'
     },
     [classContent]: {
       border: '0 none',
       backgroundColor: theme.colors.backgroundPrimary
     },
     [classContentBox]: {
-      padding: '8px 16px 16px'
+      padding: alignContentToEdge ? '8px 0px 16px' : '8px 16px 16px'
     },
     [`& > ${classItem} > ${classHeader}`]: {
       padding: '6px 44px 6px 0',
@@ -8600,13 +9002,13 @@ function getAccordionEmotionStyles(clsPrefix, theme) {
   };
   return /*#__PURE__*/css(styles, process.env.NODE_ENV === "production" ? "" : ";label:getAccordionEmotionStyles;");
 }
-const AccordionPanel = _ref => {
+const AccordionPanel = _ref2 => {
   let {
     dangerouslySetAntdProps,
     dangerouslyAppendEmotionCSS,
     children,
     ...props
-  } = _ref;
+  } = _ref2;
   return jsx(DesignSystemAntDConfigProvider, {
     children: jsx(Collapse.Panel, {
       ...props,
@@ -8619,30 +9021,38 @@ const AccordionPanel = _ref => {
   });
 };
 const Accordion = /* #__PURE__ */(() => {
-  const Accordion = _ref2 => {
+  const Accordion = _ref3 => {
     let {
       dangerouslySetAntdProps,
       dangerouslyAppendEmotionCSS,
       displayMode = 'multiple',
-      analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
+      analyticsEvents,
       componentId,
       valueHasNoPii,
       onChange,
+      alignContentToEdge = false,
+      chevronAlignment = 'right',
       ...props
-    } = _ref2;
+    } = _ref3;
+    const emitOnView = safex('databricks.fe.observability.defaultComponentView.accordion', false);
     const {
       theme,
       getPrefixedClassName
     } = useDesignSystemTheme();
     // While this component is called `Accordion` for correctness, in AntD it is called `Collapse`.
     const clsPrefix = getPrefixedClassName('collapse');
-    const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+    const memoizedAnalyticsEvents = useMemo(() => analyticsEvents !== null && analyticsEvents !== void 0 ? analyticsEvents : emitOnView ? [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange, DesignSystemEventProviderAnalyticsEventTypes.OnView] : [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange], [analyticsEvents, emitOnView]);
     const eventContext = useDesignSystemEventComponentCallbacks({
       componentType: DesignSystemEventProviderComponentTypes.Accordion,
       componentId,
       analyticsEvents: memoizedAnalyticsEvents,
       valueHasNoPii
     });
+    const {
+      elementRef: accordionRef
+    } = useNotifyOnFirstView({
+      onView: eventContext.onView
+    });
     const onChangeWrapper = useCallback(newValue => {
       if (Array.isArray(newValue)) {
         eventContext.onValueChange(JSON.stringify(newValue));
@@ -8655,12 +9065,20 @@ const Accordion = /* #__PURE__ */(() => {
       children: jsx(Collapse
       // eslint-disable-next-line @databricks/no-unstable-nested-components -- go/no-nested-components
       , {
-        expandIcon: () => jsx(ChevronDownIcon, {}),
-        expandIconPosition: "right",
+        expandIcon: () => jsx(ChevronDownIcon, {
+          ...eventContext.dataComponentProps,
+          ref: accordionRef
+        }),
+        expandIconPosition: chevronAlignment,
         accordion: displayMode === 'single',
         ...props,
         ...dangerouslySetAntdProps,
-        css: [getAccordionEmotionStyles(clsPrefix, theme), dangerouslyAppendEmotionCSS, addDebugOutlineStylesIfEnabled(theme), process.env.NODE_ENV === "production" ? "" : ";label:Accordion;"],
+        css: [getAccordionEmotionStyles({
+          clsPrefix,
+          theme,
+          alignContentToEdge,
+          isLeftAligned: chevronAlignment === 'left'
+        }), dangerouslyAppendEmotionCSS, addDebugOutlineStylesIfEnabled(theme), process.env.NODE_ENV === "production" ? "" : ";label:Accordion;"],
         onChange: onChangeWrapper
       })
     });
@@ -8685,24 +9103,44 @@ const SeverityIcon = /*#__PURE__*/forwardRef(function (props, ref) {
   });
 });
 
+function _EMOTION_STRINGIFIED_CSS_ERROR__$v() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref2$j = process.env.NODE_ENV === "production" ? {
+  name: "qbt5ty",
+  styles: "align-self:center"
+} : {
+  name: "13fhwfc-Alert",
+  styles: "align-self:center;label:Alert;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$v
+};
 const Alert = _ref => {
   let {
     componentId,
-    analyticsEvents = [],
+    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnView],
     dangerouslySetAntdProps,
     closable = true,
     closeIconLabel = 'Close alert',
     onClose,
+    actions,
+    showMoreContent,
+    showMoreText = 'Show details',
+    showMoreModalTitle = 'Details',
+    forceVerticalActionsPlacement = false,
+    size = 'large',
     ...props
   } = _ref;
   const {
     theme,
     getPrefixedClassName
   } = useDesignSystemTheme();
+  const {
+    useNewBorderRadii,
+    useNewLargeAlertSizing
+  } = useDesignSystemSafexFlags();
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Alert,
     componentId,
+    componentSubType: DesignSystemEventProviderComponentSubTypeMap[props.type],
     analyticsEvents: memoizedAnalyticsEvents
   });
   const closeButtonEventContext = useDesignSystemEventComponentCallbacks({
@@ -8711,17 +9149,19 @@ const Alert = _ref => {
     analyticsEvents: [DesignSystemEventProviderAnalyticsEventTypes.OnClick]
   });
   const {
-    elementRef: closeIconRef
+    elementRef
   } = useNotifyOnFirstView({
     onView: eventContext.onView
   });
   const clsPrefix = getPrefixedClassName('alert');
+  const [isModalOpen, setIsModalOpen] = useState(false);
   const mergedProps = {
     ...props,
     type: props.type || 'error',
     showIcon: true,
     closable
   };
+  const closeIconRef = useRef(null);
   useEffect(() => {
     if (closeIconRef.current) {
       var _closeIconRef$current;
@@ -8733,33 +9173,122 @@ const Alert = _ref => {
     closeButtonEventContext.onClick(e);
     onClose === null || onClose === void 0 || onClose(e);
   };
-  return jsx(DesignSystemAntDConfigProvider, {
-    children: jsx(Alert$1, {
+  const memoizedActions = useMemo(() => {
+    if (!(actions !== null && actions !== void 0 && actions.length)) return null;
+    return actions.map((action, index) => jsx(Button, {
+      size: "small",
+      ...action
+    }, index));
+  }, [actions]);
+
+  // Determine action placement based on number of actions
+  const actionsPlacement = (actions === null || actions === void 0 ? void 0 : actions.length) === 1 && !forceVerticalActionsPlacement ? 'horizontal' : 'vertical';
+  const description = jsx("div", {
+    css: /*#__PURE__*/css({
+      ...(useNewLargeAlertSizing ? {
+        display: 'flex',
+        flexDirection: 'row',
+        gap: theme.spacing.sm,
+        justifyContent: 'space-between'
+      } : {})
+    }, process.env.NODE_ENV === "production" ? "" : ";label:description;"),
+    children: jsxs("div", {
+      css: /*#__PURE__*/css({
+        ...(actionsPlacement === 'horizontal' && {
+          display: 'flex',
+          flexDirection: 'row',
+          justifyContent: 'space-between',
+          gap: theme.spacing.sm,
+          alignItems: 'flex-start'
+        })
+      }, process.env.NODE_ENV === "production" ? "" : ";label:description;"),
+      children: [jsxs("div", {
+        children: [props.description, ' ', showMoreContent && jsx(Typography.Link, {
+          href: "#",
+          componentId: componentId ? `${componentId}.show_more` : 'alert.show_more',
+          onClick: e => {
+            e.preventDefault();
+            setIsModalOpen(true);
+          },
+          children: showMoreText
+        })]
+      }), !useNewLargeAlertSizing && memoizedActions && actionsPlacement === 'horizontal' && jsx("div", {
+        css: /*#__PURE__*/css({
+          display: 'flex',
+          gap: theme.spacing.sm,
+          ...(useNewLargeAlertSizing ? {
+            alignSelf: 'center'
+          } : {})
+        }, process.env.NODE_ENV === "production" ? "" : ";label:description;"),
+        children: memoizedActions
+      })]
+    })
+  });
+
+  // Create a separate section for vertical actions if needed
+  const verticalActions = memoizedActions && actionsPlacement === 'vertical' && jsx("div", {
+    css: /*#__PURE__*/css({
+      display: 'flex',
+      gap: theme.spacing.sm,
+      marginTop: useNewLargeAlertSizing ? theme.spacing.xs : theme.spacing.sm,
+      marginBottom: theme.spacing.xs
+    }, process.env.NODE_ENV === "production" ? "" : ";label:verticalActions;"),
+    children: memoizedActions
+  });
+
+  // Create the final description that includes both the description and vertical actions if present
+  const finalDescription = jsxs(Fragment, {
+    children: [description, verticalActions]
+  });
+  return jsxs(DesignSystemAntDConfigProvider, {
+    children: [jsx(Alert$1, {
       ...addDebugOutlineIfEnabled(),
       ...mergedProps,
       onClose: onCloseWrapper,
       className: classnames(mergedProps.className),
-      css: getAlertEmotionStyles(clsPrefix, theme, mergedProps),
+      css: getAlertEmotionStyles(clsPrefix, theme, mergedProps, size, Boolean(actions === null || actions === void 0 ? void 0 : actions.length), forceVerticalActionsPlacement, useNewBorderRadii, useNewLargeAlertSizing),
       icon: jsx(SeverityIcon, {
-        severity: mergedProps.type
+        severity: mergedProps.type,
+        ref: elementRef
       })
       // Antd calls this prop `closeText` but we can use it to set any React element to replace the close icon.
       ,
-      closeText: mergedProps.closable && jsx(CloseIcon, {
+      closeText: mergedProps.closable && (useNewLargeAlertSizing ? jsx("div", {
+        css: /*#__PURE__*/css({
+          marginTop: actionsPlacement === 'horizontal' ? theme.spacing.xs : 0
+        }, process.env.NODE_ENV === "production" ? "" : ";label:Alert;"),
+        children: jsx(CloseSmallIcon, {
+          ref: closeIconRef,
+          "aria-label": closeIconLabel,
+          css: _ref2$j
+        })
+      }) : jsx(CloseIcon, {
         ref: closeIconRef,
         "aria-label": closeIconLabel,
         css: /*#__PURE__*/css({
           fontSize: theme.general.iconSize
         }, process.env.NODE_ENV === "production" ? "" : ";label:Alert;")
-      })
+      }))
       // Always set a description for consistent styling (e.g. icon size)
       ,
-      description: props.description || ' ',
-      ...dangerouslySetAntdProps
-    })
+      description: finalDescription,
+      action: mergedProps.action ? mergedProps.action : useNewLargeAlertSizing && actionsPlacement === 'horizontal' ? memoizedActions : undefined,
+      ...dangerouslySetAntdProps,
+      ...eventContext.dataComponentProps
+    }), showMoreContent && jsx(Modal, {
+      title: showMoreModalTitle,
+      visible: isModalOpen,
+      onCancel: () => setIsModalOpen(false),
+      componentId: componentId ? `${componentId}.show_more_modal` : 'alert.show_more_modal',
+      footer: null,
+      size: "wide",
+      children: showMoreContent
+    })]
   });
 };
-const getAlertEmotionStyles = (clsPrefix, theme, props) => {
+const getAlertEmotionStyles = (clsPrefix, theme, props, size, hasActions, isVertical, useNewBorderRadii, useNewLargeAlertSizing) => {
+  const isSmall = size === 'small';
+  const classContent = `.${clsPrefix}-content`;
   const classCloseIcon = `.${clsPrefix}-close-icon`;
   const classCloseButton = `.${clsPrefix}-close-button`;
   const classCloseText = `.${clsPrefix}-close-text`;
@@ -8767,16 +9296,35 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
   const classMessage = `.${clsPrefix}-message`;
   const classWithDescription = `.${clsPrefix}-with-description`;
   const classWithIcon = `.${clsPrefix}-icon`;
+  const classAction = `.${clsPrefix}-action`;
   const ALERT_ICON_HEIGHT = 16;
   const ALERT_ICON_FONT_SIZE = 16;
+  const BORDER_SIZE = theme.general.borderWidth;
+  const LARGE_SIZE_PADDING = theme.spacing.xs * 3;
+  const SMALL_SIZE_PADDING = theme.spacing.sm;
   const styles = {
     // General
     padding: theme.spacing.sm,
+    ...(useNewLargeAlertSizing && {
+      padding: `${LARGE_SIZE_PADDING - BORDER_SIZE}px ${LARGE_SIZE_PADDING}px`,
+      boxSizing: 'border-box',
+      ...(isSmall && {
+        padding: `${theme.spacing.xs + BORDER_SIZE}px ${SMALL_SIZE_PADDING}px`
+      }),
+      [classAction]: {
+        alignSelf: 'center'
+      }
+    }),
+    ...(useNewBorderRadii && {
+      borderRadius: theme.borders.borderRadiusSm
+    }),
     [`${classMessage}, &${classWithDescription} ${classMessage}`]: {
-      // TODO(giles): These three rules are all the same as the H3 styles. We can refactor them out into a shared object.
       fontSize: theme.typography.fontSizeBase,
       fontWeight: theme.typography.typographyBoldFontWeight,
-      lineHeight: theme.typography.lineHeightBase
+      lineHeight: theme.typography.lineHeightBase,
+      ...(useNewLargeAlertSizing && {
+        marginBottom: 0
+      })
     },
     [`${classDescription}`]: {
       lineHeight: theme.typography.lineHeightBase
@@ -8789,7 +9337,7 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
     [classCloseIcon]: {
       '&:focus-visible': {
         outlineStyle: 'auto',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       }
     },
     [`${classCloseIcon}, ${classCloseButton}`]: {
@@ -8802,7 +9350,11 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
     },
     [classWithIcon]: {
       fontSize: ALERT_ICON_FONT_SIZE,
-      marginTop: 2
+      marginTop: 2,
+      ...(useNewLargeAlertSizing && {
+        alignSelf: 'flex-start',
+        marginTop: isSmall ? 0 : 2
+      })
     },
     [`${classCloseIcon}, ${classCloseButton}, ${classCloseText} > span`]: {
       lineHeight: theme.typography.lineHeightBase,
@@ -8810,8 +9362,10 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
       width: ALERT_ICON_HEIGHT,
       fontSize: ALERT_ICON_FONT_SIZE,
       marginTop: 2,
-      '& > span': {
-        lineHeight: theme.typography.lineHeightBase
+      '& > span, & > span > span': {
+        lineHeight: theme.typography.lineHeightBase,
+        display: 'inline-flex',
+        alignItems: 'center'
       }
     },
     // No description
@@ -8820,7 +9374,11 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
       alignItems: 'center',
       [classWithIcon]: {
         fontSize: ALERT_ICON_FONT_SIZE,
-        marginTop: 0
+        marginTop: 0,
+        ...(useNewLargeAlertSizing && {
+          alignSelf: 'flex-start',
+          marginTop: 2
+        })
       },
       [classMessage]: {
         margin: 0
@@ -8832,8 +9390,21 @@ const getAlertEmotionStyles = (clsPrefix, theme, props) => {
         alignSelf: 'baseline'
       }
     }),
-    // Warning
-    ...(props.type === 'warning' && {
+    // No description with icons
+    ...(!props.description && hasActions && {
+      ...(!isVertical && {
+        [classContent]: {
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between'
+        }
+      }),
+      [classDescription]: {
+        display: 'flex'
+      }
+    }),
+    // Warning
+    ...(props.type === 'warning' && {
       color: theme.colors.textValidationWarning,
       borderColor: theme.colors.yellow300
     }),
@@ -9187,20 +9758,21 @@ const InfoPopover = _ref => {
   });
 };
 
-function _EMOTION_STRINGIFIED_CSS_ERROR__$t() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var _ref2$h = process.env.NODE_ENV === "production" ? {
+function _EMOTION_STRINGIFIED_CSS_ERROR__$u() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref2$i = process.env.NODE_ENV === "production" ? {
   name: "1amee4m",
   styles: "line-height:0"
 } : {
   name: "c77cjr-trigger",
   styles: "line-height:0;label:trigger;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$t
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$u
 };
 const OverflowPopover = _ref => {
   let {
     items,
     renderLabel,
     tooltipText,
+    ariaLabel = 'More items',
     ...props
   } = _ref;
   const {
@@ -9209,7 +9781,7 @@ const OverflowPopover = _ref => {
   const [showTooltip, setShowTooltip] = useState(true);
   const label = `+${items.length}`;
   let trigger = jsx("span", {
-    css: _ref2$h,
+    css: _ref2$i,
     ...addDebugOutlineIfEnabled(),
     children: jsx(Trigger$4, {
       asChild: true,
@@ -9231,6 +9803,7 @@ const OverflowPopover = _ref => {
     onOpenChange: open => setShowTooltip(!open),
     children: [trigger, jsx(Content$5, {
       align: "start",
+      "aria-label": ariaLabel,
       ...props,
       ...addDebugOutlineIfEnabled(),
       children: jsx("div", {
@@ -9272,6 +9845,11 @@ const SIZE = new Map([['xl', {
   fontSize: 12,
   groupShift: 2,
   iconSize: 12
+}], ['xxs', {
+  avatarSize: 16,
+  fontSize: 11,
+  groupShift: 2,
+  iconSize: 12
 }]]);
 const DEFAULT_SIZE = 'sm';
 function getAvatarEmotionStyles(_ref) {
@@ -9312,7 +9890,7 @@ function getAvatarEmotionStyles(_ref) {
       objectPosition: 'center'
     },
     system: {
-      borderRadius: theme.legacyBorders.borderRadiusMd,
+      borderRadius: theme.borders.borderRadiusSm,
       overflow: 'hidden'
     },
     user: {
@@ -9554,7 +10132,7 @@ const Breadcrumb = /* #__PURE__ */(() => {
       // TODO: Consider making this global within dubois components
       a: {
         '&:focus-visible': {
-          outlineColor: `${theme.colors.primary} !important`,
+          outlineColor: `${theme.colors.actionDefaultBorderFocus} !important`,
           outlineStyle: 'auto !important'
         }
       },
@@ -9641,14 +10219,14 @@ const genSkeletonAnimatedColor = function (theme) {
   }, process.env.NODE_ENV === "production" ? "" : ";label:genSkeletonAnimatedColor;");
 };
 
-function _EMOTION_STRINGIFIED_CSS_ERROR__$s() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__$t() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 const GenericContainerStyles = process.env.NODE_ENV === "production" ? {
   name: "12h7em6",
   styles: "cursor:progress;border-radius:var(--border-radius)"
 } : {
   name: "19fx6jo-GenericContainerStyles",
   styles: "cursor:progress;border-radius:var(--border-radius);label:GenericContainerStyles;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$s
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$t
 };
 const GenericSkeleton = _ref => {
   let {
@@ -9679,14 +10257,14 @@ const GenericSkeleton = _ref => {
   });
 };
 
-function _EMOTION_STRINGIFIED_CSS_ERROR__$r() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__$s() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 const paragraphContainerStyles = process.env.NODE_ENV === "production" ? {
   name: "sj05g9",
   styles: "cursor:progress;width:100%;height:20px;display:flex;justify-content:flex-start;align-items:center"
 } : {
   name: "u3a3v7-paragraphContainerStyles",
   styles: "cursor:progress;width:100%;height:20px;display:flex;justify-content:flex-start;align-items:center;label:paragraphContainerStyles;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$r
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$s
 };
 const paragraphFillStyles = process.env.NODE_ENV === "production" ? {
   name: "10nptxl",
@@ -9694,7 +10272,7 @@ const paragraphFillStyles = process.env.NODE_ENV === "production" ? {
 } : {
   name: "h6xifd-paragraphFillStyles",
   styles: "border-radius:var(--border-radius);height:8px;label:paragraphFillStyles;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$r
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$s
 };
 const ParagraphSkeleton = _ref => {
   let {
@@ -9732,14 +10310,14 @@ const ParagraphSkeleton = _ref => {
   });
 };
 
-function _EMOTION_STRINGIFIED_CSS_ERROR__$q() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__$r() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 const titleContainerStyles = process.env.NODE_ENV === "production" ? {
   name: "116rc6i",
   styles: "cursor:progress;width:100%;height:28px;display:flex;justify-content:flex-start;align-items:center"
 } : {
   name: "1dar8xl-titleContainerStyles",
   styles: "cursor:progress;width:100%;height:28px;display:flex;justify-content:flex-start;align-items:center;label:titleContainerStyles;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$r
 };
 const titleFillStyles = process.env.NODE_ENV === "production" ? {
   name: "9fmdbb",
@@ -9747,7 +10325,7 @@ const titleFillStyles = process.env.NODE_ENV === "production" ? {
 } : {
   name: "1vyd6dg-titleFillStyles",
   styles: "border-radius:var(--border-radius);height:12px;width:100%;label:titleFillStyles;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$r
 };
 const TitleSkeleton = _ref => {
   let {
@@ -9781,7 +10359,7 @@ const TitleSkeleton = _ref => {
   });
 };
 
-function _EMOTION_STRINGIFIED_CSS_ERROR__$p() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__$q() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 // 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.
@@ -9804,7 +10382,7 @@ const repeatingElementsStyles = {
   } : {
     name: "10gwa9a-cell",
     styles: "display:inline-grid;position:relative;flex:1;box-sizing:border-box;padding-left:var(--table-spacing-sm);padding-right:var(--table-spacing-sm);word-break:break-word;overflow:hidden;& .anticon{vertical-align:text-bottom;};label:cell;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   header: process.env.NODE_ENV === "production" ? {
     name: "ik7qgz",
@@ -9812,7 +10390,7 @@ const repeatingElementsStyles = {
   } : {
     name: "1xg6jn4-header",
     styles: "font-weight:bold;align-items:flex-end;display:flex;overflow:hidden;&[aria-sort]{cursor:pointer;user-select:none;}.table-header-text{color:var(--table-header-text-color);}.table-header-icon-container{color:var(--table-header-sort-icon-color);display:none;}&[aria-sort]:hover{.table-header-icon-container, .table-header-text{color:var(--table-header-focus-color);}}&[aria-sort]:active{.table-header-icon-container, .table-header-text{color:var(--table-header-active-color);}}&:hover, &[aria-sort=\"ascending\"], &[aria-sort=\"descending\"]{.table-header-icon-container{display:inline;}};label:header;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   row: process.env.NODE_ENV === "production" ? {
     name: "ndcf6g",
@@ -9820,7 +10398,7 @@ const repeatingElementsStyles = {
   } : {
     name: "8dtpje-row",
     styles: "display:flex;&.table-isHeader{> *{background-color:var(--table-header-background-color);}.table-isScrollable &{position:sticky;top:0;z-index:1;}}.table-row-select-cell input[type=\"checkbox\"] ~ *{opacity:var(--row-checkbox-opacity, 0);}&:not(.table-row-isGrid)&:hover{&:not(.table-isHeader){background-color:var(--table-row-hover);}.table-row-select-cell input[type=\"checkbox\"] ~ *{opacity:1;}}.table-row-select-cell input[type=\"checkbox\"]:focus ~ *{opacity:1;}> *{padding-top:var(--table-row-vertical-padding);padding-bottom:var(--table-row-vertical-padding);border-bottom:1px solid;border-color:var(--table-separator-color);}&.table-row-isGrid > *{border-right:1px solid;border-color:var(--table-separator-color);}&.table-row-isGrid > :first-of-type{border-left:1px solid;border-color:var(--table-separator-color);}&.table-row-isGrid.table-isHeader:first-of-type > *{border-top:1px solid;border-color:var(--table-separator-color);};label:row;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   }
 };
 
@@ -9845,7 +10423,7 @@ const tableStyles = {
   } : {
     name: "1csnd2v-table",
     styles: ".table-isScrollable &{flex:1;overflow:auto;};label:table;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   headerButtonTarget: process.env.NODE_ENV === "production" ? {
     name: "sezlox",
@@ -9853,7 +10431,7 @@ const tableStyles = {
   } : {
     name: "1iv4trp-headerButtonTarget",
     styles: "align-items:flex-end;display:flex;overflow:hidden;width:100%;justify-content:inherit;&:focus{.table-header-text{color:var(--table-header-focus-color);}.table-header-icon-container{color:var(--table-header-focus-color);display:inline;}}&:active{.table-header-icon-container, .table-header-text{color:var(--table-header-active-color);}};label:headerButtonTarget;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   sortHeaderIconOnRight: process.env.NODE_ENV === "production" ? {
     name: "1hdiaor",
@@ -9861,7 +10439,7 @@ const tableStyles = {
   } : {
     name: "evh3p3-sortHeaderIconOnRight",
     styles: "margin-left:var(--table-spacing-xs);label:sortHeaderIconOnRight;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   sortHeaderIconOnLeft: process.env.NODE_ENV === "production" ? {
     name: "d4plmt",
@@ -9869,7 +10447,7 @@ const tableStyles = {
   } : {
     name: "1gr7edl-sortHeaderIconOnLeft",
     styles: "margin-right:var(--table-spacing-xs);label:sortHeaderIconOnLeft;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   checkboxCell: process.env.NODE_ENV === "production" ? {
     name: "4cdr0s",
@@ -9877,7 +10455,7 @@ const tableStyles = {
   } : {
     name: "17au6u2-checkboxCell",
     styles: "display:flex;align-items:center;flex:0;padding-left:var(--table-spacing-sm);padding-top:0;padding-bottom:0;min-width:var(--table-spacing-md);max-width:var(--table-spacing-md);box-sizing:content-box;label:checkboxCell;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   resizeHandleContainer: /*#__PURE__*/css({
     position: 'absolute',
@@ -9898,7 +10476,7 @@ const tableStyles = {
   } : {
     name: "1ot7jju-resizeHandle",
     styles: "width:1px;background:var(--table-resize-handle-color);label:resizeHandle;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   },
   paginationContainer: process.env.NODE_ENV === "production" ? {
     name: "ehlmid",
@@ -9906,7 +10484,7 @@ const tableStyles = {
   } : {
     name: "p324df-paginationContainer",
     styles: "display:flex;justify-content:flex-end;padding-top:var(--table-spacing-sm);padding-bottom:var(--table-spacing-sm);label:paginationContainer;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__$q
   }
 };
 
@@ -9993,6 +10571,15 @@ const Table = /*#__PURE__*/forwardRef(function Table(_ref, ref) {
   });
 });
 
+function _EMOTION_STRINGIFIED_CSS_ERROR__$p() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref2$h = process.env.NODE_ENV === "production" ? {
+  name: "1hipw91",
+  styles: "&:has(> button){overflow:visible;}"
+} : {
+  name: "4vmsrk-content",
+  styles: "&:has(> button){overflow:visible;};label:content;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$p
+};
 const TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
   let {
     children,
@@ -10015,7 +10602,10 @@ const TableCell = /*#__PURE__*/forwardRef(function (_ref, ref) {
   const content = wrapContent === true ? jsx(Typography.Text, {
     ellipsis: !multiline,
     size: typographySize,
-    title: !multiline && typeof children === 'string' && children || undefined,
+    title: !multiline && typeof children === 'string' && children || undefined
+    // Needed for the button focus outline to be visible for the expand/collapse buttons
+    ,
+    css: _ref2$h,
     children: children
   }) : children;
   return jsx("div", {
@@ -10159,6 +10749,7 @@ const TableSkeleton = _ref => {
     seed = '',
     frameRate = 60,
     style,
+    label,
     ...rest
   } = _ref;
   const {
@@ -10168,7 +10759,7 @@ const TableSkeleton = _ref => {
     size
   } = useContext(TableContext);
   const widths = getOffsets(seed);
-  return jsx("div", {
+  return jsxs("div", {
     ...rest,
     ...addDebugOutlineIfEnabled(),
     "aria-busy": true,
@@ -10180,11 +10771,14 @@ const TableSkeleton = _ref => {
       ['--table-skeleton-color']: theme.isDarkMode ? 'rgba(255, 255, 255, 0.1)' : 'rgba(31, 38, 45, 0.1)',
       ['--table-skeleton-row-vertical-margin']: size === 'small' ? '4px' : '6px'
     },
-    children: [...Array(lines)].map((_, idx) => jsx("div", {
+    children: [[...Array(lines)].map((_, idx) => jsx("div", {
       css: [TableSkeletonStyles.cell, genSkeletonAnimatedColor(theme, frameRate), {
         width: `calc(100% - ${widths[idx % widths.length]}px)`
       }, process.env.NODE_ENV === "production" ? "" : ";label:TableSkeleton;"]
-    }, idx))
+    }, idx)), jsx("span", {
+      css: visuallyHidden,
+      children: label
+    })]
   });
 };
 const TableSkeletonRows = _ref2 => {
@@ -10236,7 +10830,8 @@ function getStyles$1(args) {
     hasTopBar,
     hasBottomBar,
     hasHref,
-    useNewShadows
+    useNewShadows,
+    useNewBorderRadii
   } = args;
   const hoverOrFocusStyle = {
     boxShadow: disableHover || loading ? '' : useNewShadows ? theme.shadows.sm : theme.general.shadowLow,
@@ -10259,7 +10854,7 @@ function getStyles$1(args) {
     paddingTop: hasTopBar ? 0 : theme.spacing.md,
     paddingBottom: hasBottomBar ? 0 : theme.spacing.md,
     width: width !== null && width !== void 0 ? width : 'fit-content',
-    borderRadius: theme.legacyBorders.borderRadiusMd,
+    borderRadius: useNewBorderRadii ? theme.borders.borderRadiusMd : theme.legacyBorders.borderRadiusMd,
     borderColor: theme.colors.border,
     borderWidth: '1px',
     borderStyle: 'solid',
@@ -10274,19 +10869,19 @@ function getStyles$1(args) {
     ...getAnimationCss(theme.options.enableAnimation)
   }, process.env.NODE_ENV === "production" ? "" : ";label:getStyles;");
 }
-function getBottomBarStyles(theme) {
+function getBottomBarStyles(theme, useNewBorderRadii) {
   return /*#__PURE__*/css({
     marginTop: theme.spacing.sm,
-    borderBottomRightRadius: theme.legacyBorders.borderRadiusMd,
-    borderBottomLeftRadius: theme.legacyBorders.borderRadiusMd,
+    borderBottomRightRadius: useNewBorderRadii ? theme.borders.borderRadiusSm : theme.legacyBorders.borderRadiusMd,
+    borderBottomLeftRadius: useNewBorderRadii ? theme.borders.borderRadiusSm : theme.legacyBorders.borderRadiusMd,
     overflow: 'hidden'
   }, process.env.NODE_ENV === "production" ? "" : ";label:getBottomBarStyles;");
 }
-function getTopBarStyles(theme) {
+function getTopBarStyles(theme, useNewBorderRadii) {
   return /*#__PURE__*/css({
     marginBottom: theme.spacing.sm,
-    borderTopRightRadius: theme.legacyBorders.borderRadiusMd,
-    borderTopLeftRadius: theme.legacyBorders.borderRadiusMd,
+    borderTopRightRadius: useNewBorderRadii ? theme.borders.borderRadiusSm : theme.legacyBorders.borderRadiusMd,
+    borderTopLeftRadius: useNewBorderRadii ? theme.borders.borderRadiusSm : theme.legacyBorders.borderRadiusMd,
     overflow: 'hidden'
   }, process.env.NODE_ENV === "production" ? "" : ";label:getTopBarStyles;");
 }
@@ -10305,15 +10900,17 @@ const Card = _ref => {
     navigateFn,
     anchorProps,
     componentId,
-    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnClick],
+    analyticsEvents,
     shouldStartInteraction,
     ...dataAndAttributes
   } = _ref;
+  const emitOnView = safex('databricks.fe.observability.defaultComponentView.card', false);
   const {
     theme
   } = useDesignSystemTheme();
   const {
-    useNewShadows
+    useNewShadows,
+    useNewBorderRadii
   } = useDesignSystemSafexFlags();
   const hasTopBar = !_isUndefined(topBarContent);
   const hasBottomBar = !_isUndefined(bottomBarContent);
@@ -10325,19 +10922,20 @@ const Card = _ref => {
     hasBottomBar,
     hasTopBar,
     hasHref: Boolean(href),
-    useNewShadows
+    useNewShadows,
+    useNewBorderRadii
   }), process.env.NODE_ENV === "production" ? "" : ";label:cardStyle;");
   const ref = React__default.useRef(null);
   const bottomBar = bottomBarContent ? jsx("div", {
-    css: /*#__PURE__*/css(getBottomBarStyles(theme), process.env.NODE_ENV === "production" ? "" : ";label:bottomBar;"),
+    css: /*#__PURE__*/css(getBottomBarStyles(theme, useNewBorderRadii), process.env.NODE_ENV === "production" ? "" : ";label:bottomBar;"),
     children: bottomBarContent
   }) : null;
   const topBar = topBarContent ? jsx("div", {
-    css: /*#__PURE__*/css(getTopBarStyles(theme), process.env.NODE_ENV === "production" ? "" : ";label:topBar;"),
+    css: /*#__PURE__*/css(getTopBarStyles(theme, useNewBorderRadii), process.env.NODE_ENV === "production" ? "" : ";label:topBar;"),
     children: topBarContent
   }) : null;
   const contentPadding = hasTopBar || hasBottomBar ? theme.spacing.lg : 0;
-  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents !== null && analyticsEvents !== void 0 ? analyticsEvents : emitOnView ? [DesignSystemEventProviderAnalyticsEventTypes.OnClick, DesignSystemEventProviderAnalyticsEventTypes.OnView] : [DesignSystemEventProviderAnalyticsEventTypes.OnClick], [analyticsEvents, emitOnView]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Card,
     componentId,
@@ -10378,7 +10976,6 @@ const Card = _ref => {
     onClick: loading || href ? undefined : handleClick,
     ...dataAndAttributes,
     ...(href && {
-      role: 'link',
       onKeyDown: async e => {
         var _dataAndAttributes$on;
         if (e.key === 'Enter' || e.key === ' ') {
@@ -10387,6 +10984,7 @@ const Card = _ref => {
         (_dataAndAttributes$on = dataAndAttributes.onKeyDown) === null || _dataAndAttributes$on === void 0 || _dataAndAttributes$on.call(dataAndAttributes, e);
       }
     }),
+    ...eventContext.dataComponentProps,
     children: loading ? jsx(DefaultCardLoadingContent, {
       width: width,
       customLoadingContent: customLoadingContent
@@ -10435,6 +11033,8 @@ function DefaultCardLoadingContent(_ref2) {
 function getCheckboxEmotionStyles(clsPrefix, theme) {
   let isHorizontal = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   let useNewShadows = arguments.length > 3 ? arguments[3] : undefined;
+  let useNewFormUISpacing = arguments.length > 4 ? arguments[4] : undefined;
+  let useNewBorderRadii = arguments.length > 5 ? arguments[5] : undefined;
   const classInput = `.${clsPrefix}-input`;
   const classInner = `.${clsPrefix}-inner`;
   const classIndeterminate = `.${clsPrefix}-indeterminate`;
@@ -10446,10 +11046,15 @@ function getCheckboxEmotionStyles(clsPrefix, theme) {
   const defaultSelector = `${classInput} + ${classInner}`;
   const hoverSelector = `${classInput}:hover + ${classInner}`;
   const pressSelector = `${classInput}:active + ${classInner}`;
+  const cleanClsPrefix = `.${clsPrefix.replace('-checkbox', '')}`;
   const styles = {
     [`.${clsPrefix}`]: {
       top: 'unset',
-      lineHeight: theme.typography.lineHeightBase
+      lineHeight: theme.typography.lineHeightBase,
+      alignSelf: 'flex-start',
+      display: 'flex',
+      alignItems: 'center',
+      height: theme.typography.lineHeightBase
     },
     [`&${classWrapper}, ${classWrapper}`]: {
       alignItems: 'center',
@@ -10457,7 +11062,10 @@ function getCheckboxEmotionStyles(clsPrefix, theme) {
     },
     // Top level styles are for the unchecked state
     [classInner]: {
-      borderColor: theme.colors.actionDefaultBorderDefault
+      borderColor: theme.colors.actionDefaultBorderDefault,
+      ...(useNewBorderRadii && {
+        borderRadius: theme.borders.borderRadiusSm
+      })
     },
     // Style wrapper span added by Antd
     [`&> span:not(.${clsPrefix})`]: {
@@ -10469,8 +11077,18 @@ function getCheckboxEmotionStyles(clsPrefix, theme) {
       display: 'flex',
       flexDirection: 'column',
       rowGap: theme.spacing.sm,
-      columnGap: 0
+      columnGap: 0,
+      ...(useNewFormUISpacing && {
+        [`& + ${cleanClsPrefix}-form-message`]: {
+          marginTop: theme.spacing.sm
+        }
+      })
     },
+    ...(useNewFormUISpacing && {
+      [`${cleanClsPrefix}-hint + &${classContainer}`]: {
+        marginTop: theme.spacing.sm
+      }
+    }),
     ...(isHorizontal && {
       [`&${classContainer}`]: {
         display: 'flex',
@@ -10485,7 +11103,7 @@ function getCheckboxEmotionStyles(clsPrefix, theme) {
     // Keyboard focus
     [`${classInput}:focus-visible + ${classInner}`]: {
       outlineWidth: '2px',
-      outlineColor: theme.colors.primary,
+      outlineColor: theme.colors.actionDefaultBorderFocus,
       outlineOffset: '4px',
       outlineStyle: 'solid'
     },
@@ -10612,12 +11230,14 @@ const getWrapperStyle = _ref => {
   let {
     clsPrefix,
     theme,
-    wrapperStyle = {}
+    wrapperStyle = {},
+    useNewFormUISpacing
   } = _ref;
+  const extraSelector = useNewFormUISpacing ? `, && + .${clsPrefix}-hint + .${clsPrefix}-form-message` : '';
   const styles = {
     height: theme.typography.lineHeightBase,
     lineHeight: theme.typography.lineHeightBase,
-    [`&& + .${clsPrefix}-hint, && + .${clsPrefix}-form-message`]: {
+    [`&& + .${clsPrefix}-hint, && + .${clsPrefix}-form-message${extraSelector}`]: {
       paddingLeft: theme.spacing.lg,
       marginTop: 0
     },
@@ -10645,7 +11265,9 @@ const DuboisCheckbox = /*#__PURE__*/forwardRef(function Checkbox(_ref2, ref) {
     getPrefixedClassName
   } = useDesignSystemTheme();
   const {
-    useNewShadows
+    useNewShadows,
+    useNewFormUISpacing,
+    useNewBorderRadii
   } = useDesignSystemSafexFlags();
   const clsPrefix = getPrefixedClassName('checkbox');
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
@@ -10666,7 +11288,8 @@ const DuboisCheckbox = /*#__PURE__*/forwardRef(function Checkbox(_ref2, ref) {
       css: getWrapperStyle({
         clsPrefix: classNamePrefix,
         theme,
-        wrapperStyle
+        wrapperStyle,
+        useNewFormUISpacing
       }),
       children: jsx(Checkbox$1, {
         checked: isChecked === null ? undefined : isChecked,
@@ -10676,13 +11299,12 @@ const DuboisCheckbox = /*#__PURE__*/forwardRef(function Checkbox(_ref2, ref) {
         indeterminate: isChecked === null
         // Individual checkboxes don't depend on isHorizontal flag, orientation and spacing is handled by end users
         ,
-        css: /*#__PURE__*/css(importantify(getCheckboxEmotionStyles(clsPrefix, theme, false, useNewShadows)), process.env.NODE_ENV === "production" ? "" : ";label:Checkbox;"),
+        css: /*#__PURE__*/css(importantify(getCheckboxEmotionStyles(clsPrefix, theme, false, useNewShadows, useNewFormUISpacing, useNewBorderRadii)), process.env.NODE_ENV === "production" ? "" : ";label:Checkbox;"),
         style: style,
         "aria-checked": isChecked === null ? 'mixed' : isChecked,
         ...restProps,
         ...dangerouslySetAntdProps,
-        "data-component-type": DesignSystemEventProviderComponentTypes.Checkbox,
-        "data-component-id": componentId,
+        ...eventContext.dataComponentProps,
         children: jsx(RestoreAntDDefaultClsPrefix, {
           children: children
         })
@@ -10702,14 +11324,16 @@ const CheckboxGroup = /*#__PURE__*/forwardRef(function CheckboxGroup(_ref3, ref)
   } = useDesignSystemTheme();
   const clsPrefix = getPrefixedClassName('checkbox');
   const {
-    useNewShadows
+    useNewShadows,
+    useNewFormUISpacing,
+    useNewBorderRadii
   } = useDesignSystemSafexFlags();
   return jsx(DesignSystemAntDConfigProvider, {
     children: jsx(Checkbox$1.Group, {
       ...addDebugOutlineIfEnabled(),
       ref: ref,
       ...props,
-      css: getCheckboxEmotionStyles(clsPrefix, theme, layout === 'horizontal', useNewShadows),
+      css: getCheckboxEmotionStyles(clsPrefix, theme, layout === 'horizontal', useNewShadows, useNewFormUISpacing, useNewBorderRadii),
       children: jsx(RestoreAntDDefaultClsPrefix, {
         children: children
       })
@@ -10859,6 +11483,7 @@ const useDropdownContext = () => React__default.useContext(DropdownContext);
 const Root$7 = _ref => {
   let {
     children,
+    itemHtmlType,
     ...props
   } = _ref;
   const [isOpen, setIsOpen] = React__default.useState(Boolean(props.defaultOpen || props.open));
@@ -10887,7 +11512,8 @@ const Root$7 = _ref => {
     children: jsx(DropdownContext.Provider, {
       value: {
         isOpen: useExternalState ? props.open : isOpen,
-        setIsOpen: useExternalState ? props.onOpenChange : handleOpenChange
+        setIsOpen: useExternalState ? props.onOpenChange : handleOpenChange,
+        itemHtmlType
       },
       children: children
     })
@@ -10980,48 +11606,40 @@ const SubContent$1 = /*#__PURE__*/forwardRef(function Content(_ref3, ref) {
   const {
     isOpen
   } = useSubContext();
-  const useResponsiveDropdownPosition = safex('databricks.fe.designsystem.useResponsiveDropdownPosition', false);
   const elemRef = useRef(null);
   useImperativeHandle(ref, () => elemRef.current);
   const checkAvailableWidth = useCallback(() => {
-    if (useResponsiveDropdownPosition) {
-      if (elemRef.current) {
-        const elemStyle = getComputedStyle(elemRef.current);
-        const availableWidth = parseFloat(elemStyle.getPropertyValue('--radix-dropdown-menu-content-available-width'));
-        const elemWidth = elemRef.current.offsetWidth;
-        const openOnSide = elemRef.current.getAttribute('data-side');
-        if (openOnSide === 'left' || openOnSide === 'right') {
-          setDataSide(openOnSide);
-        } else {
-          setDataSide(null);
-        }
-        if (availableWidth < elemWidth) {
-          setContentFitsInViewport(false);
-        } else {
-          setContentFitsInViewport(true);
-        }
+    if (elemRef.current) {
+      const elemStyle = getComputedStyle(elemRef.current);
+      const availableWidth = parseFloat(elemStyle.getPropertyValue('--radix-dropdown-menu-content-available-width'));
+      const elemWidth = elemRef.current.offsetWidth;
+      const openOnSide = elemRef.current.getAttribute('data-side');
+      if (openOnSide === 'left' || openOnSide === 'right') {
+        setDataSide(openOnSide);
+      } else {
+        setDataSide(null);
+      }
+      if (availableWidth < elemWidth) {
+        setContentFitsInViewport(false);
+      } else {
+        setContentFitsInViewport(true);
       }
     }
-  }, [useResponsiveDropdownPosition]);
+  }, []);
   useEffect(() => {
-    if (useResponsiveDropdownPosition) {
-      window.addEventListener('resize', checkAvailableWidth);
-      checkAvailableWidth();
-      return () => {
-        window.removeEventListener('resize', checkAvailableWidth);
-      };
-    }
-    return;
-  }, [useResponsiveDropdownPosition, checkAvailableWidth]);
+    window.addEventListener('resize', checkAvailableWidth);
+    checkAvailableWidth();
+    return () => {
+      window.removeEventListener('resize', checkAvailableWidth);
+    };
+  }, [checkAvailableWidth]);
   useEffect(() => {
-    if (useResponsiveDropdownPosition) {
-      if (isOpen) {
-        setTimeout(() => {
-          checkAvailableWidth();
-        }, 25);
-      }
+    if (isOpen) {
+      setTimeout(() => {
+        checkAvailableWidth();
+      }, 25);
     }
-  }, [isOpen, useResponsiveDropdownPosition, checkAvailableWidth]);
+  }, [isOpen, checkAvailableWidth]);
   let transformCalc = `calc(var(--radix-dropdown-menu-content-available-width) + var(--radix-dropdown-menu-trigger-width) * -1)`;
   if (dataSide === 'left') {
     transformCalc = `calc(var(--radix-dropdown-menu-trigger-width) - var(--radix-dropdown-menu-content-available-width))`;
@@ -11038,7 +11656,7 @@ const SubContent$1 = /*#__PURE__*/forwardRef(function Content(_ref3, ref) {
       loop: true,
       css: [contentStyles(theme, useNewShadows), {
         minWidth
-      }, useResponsiveDropdownPosition ? contentFitsInViewport ? '' : responsiveCss : '', process.env.NODE_ENV === "production" ? "" : ";label:Content;"],
+      }, contentFitsInViewport ? '' : responsiveCss, process.env.NODE_ENV === "production" ? "" : ";label:Content;"],
       sideOffset: -2,
       alignOffset: -5,
       onKeyDown: e => {
@@ -11075,13 +11693,19 @@ const Item$2 = /*#__PURE__*/forwardRef(function Item(_ref5, ref) {
     analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnClick],
     ...props
   } = _ref5;
+  const formContext = useFormContext();
+  const {
+    itemHtmlType
+  } = useDropdownContext();
   const itemRef = useRef(null);
   useImperativeHandle(ref, () => itemRef.current);
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.DropdownMenuItem,
     componentId,
-    analyticsEvents: memoizedAnalyticsEvents
+    analyticsEvents: memoizedAnalyticsEvents,
+    // If the item is a submit item and is part of a form, it is not the subject of the interaction, the form submission is
+    isInteractionSubject: !(itemHtmlType === 'submit' && formContext.componentId)
   });
   return jsx(DropdownMenu$1.Item, {
     css: theme => [dropdownItemStyles, danger && dangerItemStyles(theme)],
@@ -11090,9 +11714,14 @@ const Item$2 = /*#__PURE__*/forwardRef(function Item(_ref5, ref) {
       if (props.disabled) {
         e.preventDefault();
       } else {
+        var _formContext$formRef;
         if (!props.asChild) {
           eventContext.onClick(e);
         }
+        if (itemHtmlType === 'submit' && (_formContext$formRef = formContext.formRef) !== null && _formContext$formRef !== void 0 && _formContext$formRef.current) {
+          e.preventDefault();
+          formContext.formRef.current.requestSubmit();
+        }
         onClick === null || onClick === void 0 || onClick(e);
       }
     },
@@ -11104,6 +11733,7 @@ const Item$2 = /*#__PURE__*/forwardRef(function Item(_ref5, ref) {
       (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 || _props$onKeyDown.call(props, e);
     },
     ...props,
+    ...eventContext.dataComponentProps,
     children: getNewChildren(children, props, disabledReason, itemRef)
   });
 });
@@ -11214,6 +11844,7 @@ const CheckboxItem$1 = /*#__PURE__*/forwardRef(function CheckboxItem(_ref9, ref)
       (_props$onKeyDown3 = props.onKeyDown) === null || _props$onKeyDown3 === void 0 || _props$onKeyDown3.call(props, e);
     },
     ...props,
+    ...eventContext.dataComponentProps,
     children: getNewChildren(children, props, disabledReason, checkboxItemRef)
   });
 });
@@ -11243,6 +11874,7 @@ const RadioGroup$1 = /*#__PURE__*/forwardRef(function RadioGroup(_ref10, ref) {
     ref: radioGroupItemRef,
     onValueChange: onValueChangeWrapper,
     ...props,
+    ...eventContext.dataComponentProps,
     children: children
   });
 });
@@ -11431,7 +12063,7 @@ const dropdownContentStyles = (theme, useNewShadows) => ({
   color: theme.colors.textPrimary,
   lineHeight: theme.typography.lineHeightBase,
   border: `1px solid ${theme.colors.borderDecorative}`,
-  borderRadius: theme.legacyBorders.borderRadiusMd,
+  borderRadius: theme.borders.borderRadiusSm,
   padding: `${theme.spacing.xs}px 0`,
   boxShadow: useNewShadows ? theme.shadows.lg : theme.general.shadowLow,
   userSelect: 'none',
@@ -11475,7 +12107,7 @@ const dropdownItemStyles = theme => ({
   },
   '&[data-disabled]': {
     pointerEvents: 'none',
-    color: theme.colors.actionDisabledText
+    color: `${theme.colors.actionDisabledText} !important`
   }
 });
 const dangerItemStyles = theme => ({
@@ -11714,6 +12346,7 @@ const Item$1 = _ref5 => {
       }
       (_props$onKeyDown2 = props.onKeyDown) === null || _props$onKeyDown2 === void 0 || _props$onKeyDown2.call(props, e);
     },
+    ...eventContext.dataComponentProps,
     children: getNewChildren(children, props, disabledReason, ref)
   });
 };
@@ -11753,6 +12386,7 @@ const CheckboxItem = _ref6 => {
       }
       (_props$onKeyDown3 = props.onKeyDown) === null || _props$onKeyDown3 === void 0 || _props$onKeyDown3.call(props, e);
     },
+    ...eventContext.dataComponentProps,
     children: [jsx(ContextMenuItemIndicator, {
       css: itemIndicatorStyles(theme),
       children: jsx(CheckIcon, {})
@@ -11784,7 +12418,8 @@ const RadioGroup = _ref7 => {
   }, [eventContext, onValueChange]);
   return jsx(ContextMenuRadioGroup, {
     ...props,
-    onValueChange: onValueChangeWrapper
+    onValueChange: onValueChangeWrapper,
+    ...eventContext.dataComponentProps
   });
 };
 const RadioItem = _ref8 => {
@@ -11903,7 +12538,7 @@ function getEmotionStyles(clsPrefix, theme) {
   const classSuffix = `.${clsPrefix}-suffix`;
   const styles = {
     height: 32,
-    borderRadius: theme.legacyBorders.borderRadiusMd,
+    borderRadius: theme.borders.borderRadiusSm,
     borderColor: theme.colors.border,
     color: theme.colors.textPrimary,
     transition: 'border 0s, box-shadow 0s',
@@ -12214,6 +12849,7 @@ const DialogCombobox = _ref => {
   const [contentWidth, setContentWidth] = useState();
   const [textOverflowMode, setTextOverflowMode] = useState('multiline');
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const [disableMouseOver, setDisableMouseOver] = useState(false);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.DialogCombobox,
     componentId,
@@ -12253,12 +12889,19 @@ const DialogCombobox = _ref => {
       rememberLastScrollPosition,
       componentId,
       analyticsEvents,
-      valueHasNoPii
+      valueHasNoPii,
+      disableMouseOver,
+      setDisableMouseOver
     },
     children: jsx(Root$5, {
       open: open !== undefined ? open : isOpen,
       ...props,
-      children: children
+      children: jsx(ComponentFinderContext.Provider, {
+        value: {
+          dataComponentProps: eventContext.dataComponentProps
+        },
+        children: children
+      })
     })
   });
 };
@@ -12662,7 +13305,7 @@ var _ref2$e = process.env.NODE_ENV === "production" ? {
   styles: "display:flex;label:content;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$k
 };
-var _ref3$6 = process.env.NODE_ENV === "production" ? {
+var _ref3$5 = process.env.NODE_ENV === "production" ? {
   name: "qhxz92",
   styles: "max-width:100%"
 } : {
@@ -12686,7 +13329,9 @@ const DuboisDialogComboboxOptionListCheckboxItem = /*#__PURE__*/forwardRef((_ref
   } = useDesignSystemTheme();
   const {
     textOverflowMode,
-    contentWidth
+    contentWidth,
+    disableMouseOver,
+    setDisableMouseOver
   } = useDialogComboboxContext();
   const {
     isInsideDialogComboboxOptionList,
@@ -12741,7 +13386,9 @@ const DuboisDialogComboboxOptionListCheckboxItem = /*#__PURE__*/forwardRef((_ref
     ...getKeyboardNavigationFunctions(handleSelect, {
       onKeyDown: props.onKeyDown,
       onMouseEnter: props.onMouseEnter,
-      onDefaultKeyDown: e => dialogComboboxLookAheadKeyDown(e, setLookAhead, lookAhead)
+      onDefaultKeyDown: e => dialogComboboxLookAheadKeyDown(e, setLookAhead, lookAhead),
+      disableMouseOver,
+      setDisableMouseOver
     }),
     children: jsx(Checkbox, {
       componentId: "codegen_design-system_src_design-system_dialogcombobox_dialogcomboboxoptionlistcheckboxitem.tsx_86",
@@ -12760,7 +13407,7 @@ const DuboisDialogComboboxOptionListCheckboxItem = /*#__PURE__*/forwardRef((_ref
         handleSelect(e);
       },
       children: jsx("div", {
-        css: _ref3$6,
+        css: _ref3$5,
         children: content
       })
     })
@@ -12833,7 +13480,7 @@ const DialogComboboxOptionListSearch = /*#__PURE__*/forwardRef((_ref, forwardedR
   }
   const handleOnChange = event => {
     if (!virtualized) {
-      setSearchValue(event.target.value.toLowerCase());
+      setSearchValue(event.target.value);
     }
     setControlledValue === null || setControlledValue === void 0 || setControlledValue(event.target.value);
     onSearch === null || onSearch === void 0 || onSearch(event.target.value);
@@ -12930,6 +13577,7 @@ const DialogComboboxOptionListSearch = /*#__PURE__*/forwardRef((_ref, forwardedR
           (_restProps$onKeyDown = restProps.onKeyDown) === null || _restProps$onKeyDown === void 0 || _restProps$onKeyDown.call(restProps, event);
         },
         value: controlledValue !== null && controlledValue !== void 0 ? controlledValue : searchValue,
+        shouldPreventFormSubmission: true,
         ...restProps
       })
     }), virtualized ? children : (hasWrapper && (_filteredChildren = filteredChildren) !== null && _filteredChildren !== void 0 && (_filteredChildren = _filteredChildren.props.children) !== null && _filteredChildren !== void 0 && _filteredChildren.length || !hasWrapper && (_filteredChildren2 = filteredChildren) !== null && _filteredChildren2 !== void 0 && _filteredChildren2.length) && childrenIsNotEmpty ? jsx("div", {
@@ -12968,14 +13616,6 @@ var _ref2$c = process.env.NODE_ENV === "production" ? {
   styles: "display:flex;label:content;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__$i
 };
-var _ref3$5 = process.env.NODE_ENV === "production" ? {
-  name: "kjj0ot",
-  styles: "padding-top:2px"
-} : {
-  name: "15osdio-DuboisDialogComboboxOptionListSelectItem",
-  styles: "padding-top:2px;label:DuboisDialogComboboxOptionListSelectItem;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__$i
-};
 const DuboisDialogComboboxOptionListSelectItem = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     value,
@@ -13000,7 +13640,9 @@ const DuboisDialogComboboxOptionListSelectItem = /*#__PURE__*/forwardRef((_ref,
     value: existingValue,
     contentWidth,
     textOverflowMode,
-    scrollToSelectedElement
+    scrollToSelectedElement,
+    disableMouseOver,
+    setDisableMouseOver
   } = useDialogComboboxContext();
   const {
     isInsideDialogComboboxOptionList,
@@ -13096,12 +13738,17 @@ const DuboisDialogComboboxOptionListSelectItem = /*#__PURE__*/forwardRef((_ref,
     ...getKeyboardNavigationFunctions(handleSelect, {
       onKeyDown: props.onKeyDown,
       onMouseEnter: props.onMouseEnter,
-      onDefaultKeyDown: e => dialogComboboxLookAheadKeyDown(e, setLookAhead, lookAhead)
+      onDefaultKeyDown: e => dialogComboboxLookAheadKeyDown(e, setLookAhead, lookAhead),
+      disableMouseOver,
+      setDisableMouseOver
     }),
     role: "option",
     "aria-selected": checked,
     children: [!dangerouslyHideCheck && (checked ? jsx(CheckIcon, {
-      css: _ref3$5
+      css: /*#__PURE__*/css({
+        paddingTop: 2,
+        color: theme.colors.textSecondary
+      }, process.env.NODE_ENV === "production" ? "" : ";label:DuboisDialogComboboxOptionListSelectItem;")
     }) : jsx("div", {
       style: {
         width: 16,
@@ -13326,9 +13973,14 @@ const DialogComboboxSeparator = props => {
   });
 };
 
-const getTriggerWrapperStyles = (removable, width) => /*#__PURE__*/css(importantify({
+const getTriggerWrapperStyles = (theme, clsPrefix, removable, width, useNewFormUISpacing) => /*#__PURE__*/css(importantify({
   display: 'inline-flex',
   alignItems: 'center',
+  ...(useNewFormUISpacing && {
+    [`& + .${clsPrefix}-form-message`]: {
+      marginTop: theme.spacing.sm
+    }
+  }),
   ...(width && {
     width: width
   }),
@@ -13375,7 +14027,7 @@ const getTriggerStyles = function (theme) {
     ...(useNewShadows && {
       boxShadow: theme.shadows.xs
     }),
-    borderRadius: 4,
+    borderRadius: theme.borders.borderRadiusSm,
     color: theme.colors.textPrimary,
     lineHeight: theme.typography.lineHeightBase,
     fontSize: theme.typography.fontSizeBase,
@@ -13417,7 +14069,7 @@ const getTriggerStyles = function (theme) {
         borderColor: theme.colors.actionDefaultBorderHover
       },
       '&&:focus, &[data-state="open"]': {
-        outlineColor: theme.colors.actionPrimaryBackgroundDefault,
+        outlineColor: theme.colors.actionDefaultBorderFocus,
         outlineWidth: 2,
         outlineOffset: -2,
         outlineStyle: 'solid',
@@ -13476,7 +14128,8 @@ const DialogComboboxTrigger = /*#__PURE__*/forwardRef((_ref, forwardedRef) => {
     placeholder: selectPlaceholder
   } = useSelectContext();
   const {
-    useNewShadows
+    useNewShadows,
+    useNewFormUISpacing
   } = useDesignSystemSafexFlags();
   const id = topLevelId !== null && topLevelId !== void 0 ? topLevelId : legacyId;
   if (!isInsideDialogCombobox) {
@@ -13647,11 +14300,13 @@ const DialogComboboxTrigger = /*#__PURE__*/forwardRef((_ref, forwardedRef) => {
       }, process.env.NODE_ENV === "production" ? "" : ";label:triggerContent;")
     }) : null]
   });
+  const dataComponentProps = useComponentFinderContext(DesignSystemEventProviderComponentTypes.DialogCombobox);
   return jsxs("div", {
     ...wrapperProps,
     className: `${(_restProps$className = restProps === null || restProps === void 0 ? void 0 : restProps.className) !== null && _restProps$className !== void 0 ? _restProps$className : ''} ${dialogComboboxClassname} ${selectV2Classname}`.trim(),
-    css: [getTriggerWrapperStyles(removable, width), wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.css, process.env.NODE_ENV === "production" ? "" : ";label:DialogComboboxTrigger;"],
+    css: [getTriggerWrapperStyles(theme, classNamePrefix, removable, width, useNewFormUISpacing), wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.css, process.env.NODE_ENV === "production" ? "" : ";label:DialogComboboxTrigger;"],
     ...addDebugOutlineIfEnabled(),
+    ...dataComponentProps,
     children: [showTooltip && value !== null && value !== void 0 && value.length ? jsx(LegacyTooltip, {
       title: customSelectContent !== null && customSelectContent !== void 0 ? customSelectContent : displayedValues,
       children: triggerContent
@@ -13687,6 +14342,11 @@ const MAX_WIDTH = '90vw';
 const DEFAULT_POSITION = 'right';
 const ZINDEX_OVERLAY = 1;
 const ZINDEX_CONTENT = ZINDEX_OVERLAY + 1;
+
+/** Context to track if drawer is nested within a parent drawer */
+const DrawerContext = /*#__PURE__*/React__default.createContext({
+  isParentDrawerOpen: false
+});
 var _ref2$a = process.env.NODE_ENV === "production" ? {
   name: "zh83op",
   styles: "flex-grow:1;margin-bottom:0;margin-top:0;white-space:nowrap;overflow:hidden"
@@ -13708,8 +14368,9 @@ const Content$2 = _ref => {
     onInteractOutside,
     seeThrough,
     hideClose,
+    onCloseClick,
     componentId = 'design_system.drawer.content',
-    analyticsEvents = [],
+    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnView],
     size = 'default',
     ...props
   } = _ref;
@@ -13731,6 +14392,9 @@ const Content$2 = _ref => {
   const {
     useNewShadows
   } = useDesignSystemSafexFlags();
+  const {
+    isParentDrawerOpen
+  } = React__default.useContext(DrawerContext);
   const {
     elementRef: onViewRef
   } = useNotifyOnFirstView({
@@ -13779,20 +14443,23 @@ const Content$2 = _ref => {
     '&:focus': {
       outline: 'none'
     },
-    '@media (prefers-reduced-motion: no-preference)': {
-      animation: `${overlayShow} 350ms cubic-bezier(0.16, 1, 0.3, 1)`
-    }
+    ...(isParentDrawerOpen ? {} : {
+      '@media (prefers-reduced-motion: no-preference)': {
+        animation: `${overlayShow} 350ms cubic-bezier(0.16, 1, 0.3, 1)`
+      }
+    })
   }, process.env.NODE_ENV === "production" ? "" : ";label:dialogPrimitiveContentStyle;");
   return jsxs(DialogPrimitive.Portal, {
     container: getPopupContainer && getPopupContainer(),
     children: [jsx(DialogPrimitive.Overlay, {
+      "data-testid": "drawer-overlay",
       css: /*#__PURE__*/css({
         backgroundColor: theme.colors.overlayOverlay,
         position: 'fixed',
         inset: 0,
         // needed so that it covers the PersonaNavSidebar
         zIndex: theme.options.zIndexBase + ZINDEX_OVERLAY,
-        opacity: seeThrough ? 0 : 1
+        opacity: seeThrough || isParentDrawerOpen ? 0 : 1
       }, process.env.NODE_ENV === "production" ? "" : ";label:Content;")
     }), jsx(DialogPrimitive.DialogContent, {
       ...addDebugOutlineIfEnabled(),
@@ -13818,12 +14485,13 @@ const Content$2 = _ref => {
       },
       onInteractOutside: onInteractOutside,
       ...props,
+      ...eventContext.dataComponentProps,
       children: jsxs(ApplyDesignSystemContextOverrides, {
         getPopupContainer: () => {
           var _contentContainerRef$;
           return (_contentContainerRef$ = contentContainerRef.current) !== null && _contentContainerRef$ !== void 0 ? _contentContainerRef$ : document.body;
         },
-        children: [jsxs("div", {
+        children: [(title || !hideClose) && jsxs("div", {
           css: /*#__PURE__*/css({
             flexGrow: 0,
             flexShrink: 1,
@@ -13852,6 +14520,7 @@ const Content$2 = _ref => {
               flexShrink: 1,
               marginLeft: theme.spacing.xs
             }, process.env.NODE_ENV === "production" ? "" : ";label:Content;"),
+            onClick: onCloseClick,
             children: jsx(Button, {
               componentId: `${componentId}.close`,
               "aria-label": "Close",
@@ -13875,7 +14544,12 @@ const Content$2 = _ref => {
             height: expandContentToFullHeight ? '100%' : undefined,
             ...(!useCustomScrollBehavior ? getShadowScrollStyles(theme) : {})
           }, process.env.NODE_ENV === "production" ? "" : ";label:Content;"),
-          children: [children, !footer && jsx(Spacer, {
+          children: [jsx(DrawerContext.Provider, {
+            value: {
+              isParentDrawerOpen: true
+            },
+            children: children
+          }), !footer && jsx(Spacer, {
             size: size === 'small' ? 'md' : 'lg'
           })]
         }), footer && jsx("div", {
@@ -14190,7 +14864,8 @@ function getSelectEmotionStyles(_ref) {
   let {
     clsPrefix,
     theme,
-    validationState
+    validationState,
+    useNewFormUISpacing
   } = _ref;
   const classFocused = `.${clsPrefix}-focused`;
   const classOpen = `.${clsPrefix}-open`;
@@ -14211,9 +14886,15 @@ function getSelectEmotionStyles(_ref) {
   const classSearchClear = `.${clsPrefix}-clear`;
   const classAllowClear = `.${clsPrefix}-allow-clear`;
   const classSearchInput = `.${clsPrefix}-selection-search-input`;
+  const classFormMessage = `.${clsPrefix.replace('-select', '')}-form-message`;
   const validationColor = getValidationStateColor(theme, validationState);
   const styles = {
     ...addDebugOutlineStylesIfEnabled(theme),
+    ...(useNewFormUISpacing && {
+      [`& + ${classFormMessage}`]: {
+        marginTop: theme.spacing.sm
+      }
+    }),
     '&:hover': {
       [classSelector]: {
         borderColor: theme.colors.actionDefaultBorderHover
@@ -14274,7 +14955,7 @@ function getSelectEmotionStyles(_ref) {
     },
     [`&${classFocused}`]: {
       [classSelector]: {
-        outlineColor: theme.colors.actionPrimaryBackgroundDefault,
+        outlineColor: theme.colors.actionDefaultBorderFocus,
         outlineWidth: 2,
         outlineOffset: -2,
         outlineStyle: 'solid',
@@ -14529,7 +15210,8 @@ function DuboisSelect(_ref2, ref) {
     getPrefixedClassName
   } = useDesignSystemTheme();
   const {
-    useNewShadows
+    useNewShadows,
+    useNewFormUISpacing
   } = useDesignSystemSafexFlags();
   const clsPrefix = getPrefixedClassName('select');
   const [isOpen, setIsOpen] = useState(false);
@@ -14573,7 +15255,8 @@ function DuboisSelect(_ref2, ref) {
           css: getSelectEmotionStyles({
             clsPrefix,
             theme,
-            validationState
+            validationState,
+            useNewFormUISpacing
           }),
           removeIcon: jsx(CloseIcon, {
             "aria-hidden": "false",
@@ -14691,6 +15374,13 @@ const LegacySelect = /* #__PURE__ */(() => {
 })();
 
 const RadioGroupContext = /*#__PURE__*/React__default.createContext(undefined);
+const useRadioGroupContext = () => {
+  const context = React__default.useContext(RadioGroupContext);
+  if (!context) {
+    throw new Error('Radio components are only allowed within a Radio.Group');
+  }
+  return context;
+};
 const getRadioInputStyles = _ref => {
   let {
     clsPrefix,
@@ -14713,7 +15403,7 @@ const getRadioInputStyles = _ref => {
         display: 'flex',
         justifyContent: 'center',
         alignItems: 'center',
-        borderRadius: '50%',
+        borderRadius: theme.borders.borderRadiusFull,
         '&:after': {
           all: 'unset'
         }
@@ -14771,9 +15461,10 @@ const getRadioInputStyles = _ref => {
         },
         // Focus
         [`&:not(.${clsPrefix}-disabled) > .${clsPrefix}-input:focus-visible + .${clsPrefix}-inner`]: {
-          background: theme.colors.actionDefaultBackgroundPress,
+          background: theme.colors.actionPrimaryBackgroundDefault,
           borderColor: theme.colors.actionDefaultBorderFocus,
-          boxShadow: `0 0 0 1px ${theme.colors.actionDefaultBackgroundDefault}, 0 0 0 3px ${theme.colors.primary}`
+          outline: `1px solid ${theme.colors.actionPrimaryBackgroundDefault}`,
+          outlineOffset: 1
         },
         // Active
         [`&:not(.${clsPrefix}-disabled) > .${clsPrefix}-input:active + .${clsPrefix}-inner`]: {
@@ -14823,16 +15514,28 @@ const getCommonRadioGroupStyles = _ref2 => {
 const getHorizontalRadioGroupStyles = _ref3 => {
   let {
     theme,
-    classNamePrefix
+    classNamePrefix,
+    useEqualColumnWidths,
+    useNewFormUISpacing
   } = _ref3;
   return /*#__PURE__*/css({
     '&&': {
       display: 'grid',
       gridTemplateRows: '[label] auto [hint] auto',
-      gridAutoColumns: 'max-content',
-      gridColumnGap: theme.spacing.md
+      gridAutoColumns: useEqualColumnWidths ? 'minmax(0, 1fr)' : 'max-content',
+      gridColumnGap: theme.spacing.md,
+      ...(useNewFormUISpacing && {
+        [`& + .${classNamePrefix}-form-message`]: {
+          marginTop: theme.spacing.sm
+        }
+      })
     },
-    '& > label': {
+    ...(useNewFormUISpacing && {
+      [`:has(> .${classNamePrefix}-hint)`]: {
+        marginTop: theme.spacing.sm
+      }
+    }),
+    [`& > label, & > .${classNamePrefix}-radio-tile`]: {
       gridRow: 'label / label',
       marginRight: 0
     },
@@ -14845,12 +15548,25 @@ const getHorizontalRadioGroupStyles = _ref3 => {
 const getVerticalRadioGroupStyles = _ref4 => {
   let {
     theme,
-    classNamePrefix
+    classNamePrefix,
+    useNewFormUISpacing
   } = _ref4;
   return /*#__PURE__*/css({
     display: 'flex',
     flexDirection: 'column',
     flexWrap: 'wrap',
+    ...(useNewFormUISpacing && {
+      [`& + .${classNamePrefix}-form-message`]: {
+        marginTop: theme.spacing.sm
+      },
+      [`~ .${classNamePrefix}-label)`]: {
+        marginTop: theme.spacing.sm,
+        background: 'red'
+      }
+    }),
+    [`.${classNamePrefix}-radio-tile + .${classNamePrefix}-radio-tile`]: {
+      marginTop: theme.spacing.md
+    },
     '& > label': {
       fontWeight: 'normal',
       paddingBottom: theme.spacing.sm
@@ -14893,6 +15609,11 @@ const DuboisRadio = /*#__PURE__*/forwardRef(function Radio(_ref6, ref) {
   let {
     children,
     dangerouslySetAntdProps,
+    __INTERNAL_DISABLE_RADIO_ROLE,
+    componentId,
+    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
+    valueHasNoPii,
+    onChange,
     ...props
   } = _ref6;
   const {
@@ -14900,12 +15621,27 @@ const DuboisRadio = /*#__PURE__*/forwardRef(function Radio(_ref6, ref) {
     getPrefixedClassName
   } = useDesignSystemTheme();
   const {
-    componentId
+    componentId: contextualComponentId
   } = (_React$useContext = React__default.useContext(RadioGroupContext)) !== null && _React$useContext !== void 0 ? _React$useContext : {};
   const {
     useNewShadows
   } = useDesignSystemSafexFlags();
   const clsPrefix = getPrefixedClassName('radio');
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const eventContext = useDesignSystemEventComponentCallbacks({
+    componentType: DesignSystemEventProviderComponentTypes.Radio,
+    componentId,
+    analyticsEvents: memoizedAnalyticsEvents,
+    valueHasNoPii
+  });
+  const onChangeWrapper = useCallback(e => {
+    // Only call the onValueChange callback if the Radio is standalone and not part of a RadioGroup
+    if (contextualComponentId === undefined) {
+      var _eventContext$onValue;
+      (_eventContext$onValue = eventContext.onValueChange) === null || _eventContext$onValue === void 0 || _eventContext$onValue.call(eventContext, e.target.value);
+    }
+    onChange === null || onChange === void 0 || onChange(e);
+  }, [contextualComponentId, eventContext, onChange]);
   return jsx(DesignSystemAntDConfigProvider, {
     children: jsx(Radio$1, {
       ...addDebugOutlineIfEnabled(),
@@ -14916,9 +15652,13 @@ const DuboisRadio = /*#__PURE__*/forwardRef(function Radio(_ref6, ref) {
       }),
       ...props,
       ...dangerouslySetAntdProps,
+      ...(__INTERNAL_DISABLE_RADIO_ROLE ? {
+        role: 'none'
+      } : {}),
+      onChange: onChangeWrapper,
       ref: ref,
-      "data-component-type": DesignSystemEventProviderComponentTypes.RadioGroup,
-      "data-component-id": componentId,
+      "data-component-type": contextualComponentId ? DesignSystemEventProviderComponentTypes.RadioGroup : DesignSystemEventProviderComponentTypes.Radio,
+      "data-component-id": contextualComponentId !== null && contextualComponentId !== void 0 ? contextualComponentId : componentId,
       children: jsx(RestoreAntDDefaultClsPrefix, {
         children: children
       })
@@ -14926,6 +15666,7 @@ const DuboisRadio = /*#__PURE__*/forwardRef(function Radio(_ref6, ref) {
   });
 });
 const StyledRadioGroup = /*#__PURE__*/forwardRef(function StyledRadioGroup(_ref7, ref) {
+  var _props$defaultValue;
   let {
     children,
     dangerouslySetAntdProps,
@@ -14945,21 +15686,48 @@ const StyledRadioGroup = /*#__PURE__*/forwardRef(function StyledRadioGroup(_ref7
   } = useDesignSystemSafexFlags();
   const clsPrefix = getPrefixedClassName('radio');
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const [value, setValue] = React__default.useState((_props$defaultValue = props.defaultValue) !== null && _props$defaultValue !== void 0 ? _props$defaultValue : '');
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.RadioGroup,
     componentId,
     analyticsEvents: memoizedAnalyticsEvents,
     valueHasNoPii
   });
+  const internalRef = useRef();
+  useImperativeHandle(ref, () => internalRef.current);
   const onChangeWrapper = useCallback(e => {
-    var _eventContext$onValue;
-    (_eventContext$onValue = eventContext.onValueChange) === null || _eventContext$onValue === void 0 || _eventContext$onValue.call(eventContext, e.target.value);
+    var _eventContext$onValue2;
+    (_eventContext$onValue2 = eventContext.onValueChange) === null || _eventContext$onValue2 === void 0 || _eventContext$onValue2.call(eventContext, e.target.value);
+    setValue(e.target.value);
     onChange === null || onChange === void 0 || onChange(e);
   }, [eventContext, onChange]);
+  useEffect(() => {
+    if (props.value !== undefined) {
+      setValue(props.value);
+
+      // Antd's Radio (rc-checkbox) is not updating checked state correctly even though state is managed appropriately on our end
+      // Manually add and remove checked attribute to the radio input to ensure it is checked and A11y tools and tests can rely on this for validation
+      if (internalRef !== null && internalRef !== void 0 && internalRef.current) {
+        // Remove checked attribute from old radio input
+        const checkedInput = internalRef.current.querySelector('input[checked]');
+        if (checkedInput) {
+          checkedInput.removeAttribute('checked');
+        }
+
+        // Add checked attribute to new radio input
+        const toBeCheckedInput = internalRef.current.querySelector(`input[value="${props.value}"]`);
+        if (toBeCheckedInput) {
+          toBeCheckedInput.setAttribute('checked', 'checked');
+        }
+      }
+    }
+  }, [props.value]);
   return jsx(DesignSystemAntDConfigProvider, {
     children: jsx(RadioGroupContext.Provider, {
       value: {
-        componentId
+        componentId,
+        value,
+        onChange: onChangeWrapper
       },
       children: jsx(Radio$1.Group, {
         ...addDebugOutlineIfEnabled(),
@@ -14970,9 +15738,10 @@ const StyledRadioGroup = /*#__PURE__*/forwardRef(function StyledRadioGroup(_ref7
           classNamePrefix,
           useNewShadows
         }),
+        value: value,
         onChange: onChangeWrapper,
         ...dangerouslySetAntdProps,
-        ref: ref,
+        ref: internalRef,
         children: jsx(RestoreAntDDefaultClsPrefix, {
           children: children
         })
@@ -14983,16 +15752,22 @@ const StyledRadioGroup = /*#__PURE__*/forwardRef(function StyledRadioGroup(_ref7
 const HorizontalGroup = /*#__PURE__*/forwardRef(function HorizontalGroup(_ref8, ref) {
   let {
     dangerouslySetAntdProps,
+    useEqualColumnWidths,
     ...props
   } = _ref8;
   const {
     theme,
     classNamePrefix
   } = useDesignSystemTheme();
+  const {
+    useNewFormUISpacing
+  } = useDesignSystemSafexFlags();
   return jsx(StyledRadioGroup, {
     css: getHorizontalRadioGroupStyles({
       theme,
-      classNamePrefix
+      classNamePrefix,
+      useEqualColumnWidths,
+      useNewFormUISpacing
     }),
     ...props,
     ref: ref,
@@ -15003,19 +15778,26 @@ const Group = /*#__PURE__*/forwardRef(function HorizontalGroup(_ref9, ref) {
   let {
     dangerouslySetAntdProps,
     layout = 'vertical',
+    useEqualColumnWidths,
     ...props
   } = _ref9;
   const {
     theme,
     classNamePrefix
   } = useDesignSystemTheme();
+  const {
+    useNewFormUISpacing
+  } = useDesignSystemSafexFlags();
   return jsx(StyledRadioGroup, {
     css: layout === 'horizontal' ? getHorizontalRadioGroupStyles({
       theme,
-      classNamePrefix
+      classNamePrefix,
+      useEqualColumnWidths,
+      useNewFormUISpacing
     }) : getVerticalRadioGroupStyles({
       theme,
-      classNamePrefix
+      classNamePrefix,
+      useNewFormUISpacing
     }),
     ...props,
     ref: ref,
@@ -15278,6 +16060,7 @@ const SimpleSelect = /*#__PURE__*/forwardRef((_ref, ref) => {
           },
           id: id,
           value: internalValue,
+          ...eventContext.dataComponentProps,
           children: selectedLabel || placeholder
         }), jsx("input", {
           type: "hidden",
@@ -15379,7 +16162,7 @@ const getSwitchWithLabelStyles = _ref => {
         [`.${clsPrefix}-switch-handle, .${clsPrefix}-switch-handle:before`]: {
           width: 16,
           height: 16,
-          borderRadius: 99999
+          borderRadius: theme.borders.borderRadiusFull
         }
       }
     }),
@@ -15387,6 +16170,7 @@ const getSwitchWithLabelStyles = _ref => {
     [`&.${clsPrefix}-switch`]: {
       backgroundColor: theme.colors.backgroundPrimary,
       border: `1px solid ${theme.colors.actionDefaultBorderDefault}`,
+      borderRadius: theme.borders.borderRadiusFull,
       [`.${clsPrefix}-switch-handle:before`]: {
         ...(useNewShadows ? {
           border: `1px solid ${theme.colors.actionDefaultBorderDefault}`,
@@ -15395,7 +16179,8 @@ const getSwitchWithLabelStyles = _ref => {
         } : {
           boxShadow: `0px 0px 0px 1px ${theme.colors.actionDefaultBorderDefault}`
         }),
-        transition: 'none'
+        transition: 'none',
+        borderRadius: theme.borders.borderRadiusFull
       },
       [`&:hover:not(.${clsPrefix}-switch-disabled)`]: {
         backgroundColor: theme.colors.actionDefaultBackgroundHover,
@@ -15528,10 +16313,11 @@ const Switch = _ref2 => {
     inactiveLabel,
     disabledLabel,
     componentId,
-    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
+    analyticsEvents,
     onChange,
     ...props
   } = _ref2;
+  const emitOnView = safex('databricks.fe.observability.defaultComponentView.switch', false);
   const {
     theme,
     classNamePrefix
@@ -15542,13 +16328,19 @@ const Switch = _ref2 => {
   } = useDesignSystemSafexFlags();
   const uniqueId = (_props$id = props.id) !== null && _props$id !== void 0 ? _props$id : duboisId;
   const [isChecked, setIsChecked] = useState(props.checked || props.defaultChecked);
-  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents !== null && analyticsEvents !== void 0 ? analyticsEvents : emitOnView ? [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange, DesignSystemEventProviderAnalyticsEventTypes.OnView] : [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange], [analyticsEvents, emitOnView]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Switch,
     componentId,
     analyticsEvents: memoizedAnalyticsEvents,
     valueHasNoPii: true
   });
+  const {
+    elementRef: viewRef
+  } = useNotifyOnFirstView({
+    onView: eventContext.onView,
+    value: isChecked
+  });
   const handleToggle = (newState, event) => {
     eventContext.onValueChange(newState);
     if (onChange) {
@@ -15586,7 +16378,8 @@ const Switch = _ref2 => {
         disabled: props.disabled,
         useNewShadows
       })
-    }, process.env.NODE_ENV === "production" ? "" : ";label:switchComponent;")
+    }, process.env.NODE_ENV === "production" ? "" : ";label:switchComponent;"),
+    ref: viewRef
   });
   const labelComponent = jsx(Label, {
     inline: true,
@@ -15608,11 +16401,13 @@ const Switch = _ref2 => {
         disabled: props.disabled,
         useNewShadows
       }),
+      ...eventContext.dataComponentProps,
       children: hasNewLabels ? jsxs(Fragment, {
         children: [labelComponent, jsx("span", {
           style: {
             marginLeft: 'auto',
-            marginRight: theme.spacing.sm
+            marginRight: theme.spacing.sm,
+            color: theme.colors.textPrimary
           },
           children: `${stateMessage}${props.disabled ? ` (${disabledLabel})` : ''}`
         }), switchComponent]
@@ -15635,7 +16430,9 @@ const Switch = _ref2 => {
           disabled: props.disabled,
           useNewShadows
         })
-      }, process.env.NODE_ENV === "production" ? "" : ";label:Switch;")
+      }, process.env.NODE_ENV === "production" ? "" : ";label:Switch;"),
+      ...eventContext.dataComponentProps,
+      ref: viewRef
     })
   });
 };
@@ -15705,13 +16502,15 @@ const TypeaheadComboboxRoot = /*#__PURE__*/forwardRef((_ref, ref) => {
       css: _ref2$8,
       ...props,
       ref: ref,
+      "data-component-type": DesignSystemEventProviderComponentTypes.TypeaheadCombobox,
+      "data-component-id": comboboxState.componentId,
       children: children
     })
   });
 });
 
-const mapItemsToStrings = (items, itemToString) => {
-  return JSON.stringify(items.map(item => item ? itemToString ? itemToString(item) : item.toString() : ''));
+const mapItemsToString = (items, itemToString) => {
+  return JSON.stringify(items.map(itemToString));
 };
 const TypeaheadComboboxStateChangeTypes = useCombobox.stateChangeTypes;
 const TypeaheadComboboxMultiSelectStateChangeTypes = useMultipleSelection.stateChangeTypes;
@@ -15728,14 +16527,18 @@ function useComboboxState(_ref) {
     componentId,
     valueHasNoPii,
     analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
+    matcher,
+    shouldSetItemsOnAllItemsChanges = safex('databricks.fe.designsystem.useComboboxStateUpdatesItemsWithEffect', false),
+    preventUnsetOnBlur = false,
     ...props
   } = _ref;
-  function getFilteredItems(inputValue) {
+  const getFilteredItems = useCallback(inputValue => {
     var _inputValue$toLowerCa;
     const lowerCasedInputValue = (_inputValue$toLowerCa = inputValue === null || inputValue === void 0 ? void 0 : inputValue.toLowerCase()) !== null && _inputValue$toLowerCa !== void 0 ? _inputValue$toLowerCa : '';
     // If the input is empty or if there is no matcher supplied, do not filter
-    return allItems.filter(item => !inputValue || !props.matcher || props.matcher(item, lowerCasedInputValue));
-  }
+    return allItems.filter(item => !inputValue || !matcher || matcher(item, lowerCasedInputValue));
+  }, [allItems, matcher]);
+  const [inputValue, setInputValue] = useState();
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.TypeaheadCombobox,
@@ -15743,6 +16546,19 @@ function useComboboxState(_ref) {
     analyticsEvents: memoizedAnalyticsEvents,
     valueHasNoPii
   });
+  const itemToStringWithDefaultToString = useCallback(item => {
+    return item ? itemToString ? itemToString(item) : item.toString() : '';
+  }, [itemToString]);
+  const prevAllItems = useRef(allItems);
+  useEffect(() => {
+    // When allItems changes, re-apply filter so users don't see stale items values in the dropdown box
+    if (shouldSetItemsOnAllItemsChanges && !props.multiSelect && (allItems.length !== prevAllItems.current.length ||
+    // Avoid redundant or endless updates by checking individual elements as allItems may have an unstable reference.
+    allItems.some((item, index) => itemToStringWithDefaultToString(item) !== itemToStringWithDefaultToString(prevAllItems.current[index])))) {
+      props.setItems(getFilteredItems(inputValue));
+      prevAllItems.current = allItems;
+    }
+  }, [allItems, inputValue, getFilteredItems, props, itemToStringWithDefaultToString, shouldSetItemsOnAllItemsChanges]);
   const comboboxState = {
     ...useCombobox({
       onIsOpenChange: onIsOpenChange,
@@ -15752,6 +16568,7 @@ function useComboboxState(_ref) {
         } = _ref2;
         if (inputValue !== undefined) {
           var _props$setInputValue;
+          setInputValue(inputValue);
           (_props$setInputValue = props.setInputValue) === null || _props$setInputValue === void 0 || _props$setInputValue.call(props, inputValue);
         }
         if (!props.multiSelect) {
@@ -15759,9 +16576,7 @@ function useComboboxState(_ref) {
         }
       },
       items: items,
-      itemToString(item) {
-        return item ? itemToString ? itemToString(item) : item.toString() : '';
-      },
+      itemToString: itemToStringWithDefaultToString,
       defaultHighlightedIndex: props.multiSelect ? 0 : undefined,
       // after selection for multiselect, highlight the first item.
       scrollIntoView: () => {},
@@ -15775,6 +16590,9 @@ function useComboboxState(_ref) {
         } = actionAndChanges;
         switch (type) {
           case useCombobox.stateChangeTypes.InputBlur:
+            if (preventUnsetOnBlur) {
+              return changes;
+            }
             if (!props.multiSelect) {
               // If allowNewValue is true, register the input's current value on blur
               if (allowNewValue) {
@@ -15834,14 +16652,14 @@ function useComboboxState(_ref) {
             var _eventContext$onValue2;
             const newSelectedItems = props.selectedItems.filter(item => item !== newSelectedItem);
             props.setSelectedItems(newSelectedItems);
-            (_eventContext$onValue2 = eventContext.onValueChange) === null || _eventContext$onValue2 === void 0 || _eventContext$onValue2.call(eventContext, mapItemsToStrings(newSelectedItems, itemToString));
+            (_eventContext$onValue2 = eventContext.onValueChange) === null || _eventContext$onValue2 === void 0 || _eventContext$onValue2.call(eventContext, mapItemsToString(newSelectedItems, itemToStringWithDefaultToString));
           } else if (newSelectedItem) {
             var _eventContext$onValue3;
-            (_eventContext$onValue3 = eventContext.onValueChange) === null || _eventContext$onValue3 === void 0 || _eventContext$onValue3.call(eventContext, mapItemsToStrings([...props.selectedItems, newSelectedItem], itemToString));
+            (_eventContext$onValue3 = eventContext.onValueChange) === null || _eventContext$onValue3 === void 0 || _eventContext$onValue3.call(eventContext, mapItemsToString([...props.selectedItems, newSelectedItem], itemToStringWithDefaultToString));
           }
         } else if (newSelectedItem) {
           var _eventContext$onValue4;
-          (_eventContext$onValue4 = eventContext.onValueChange) === null || _eventContext$onValue4 === void 0 || _eventContext$onValue4.call(eventContext, itemToString ? itemToString(newSelectedItem) : newSelectedItem.toString());
+          (_eventContext$onValue4 = eventContext.onValueChange) === null || _eventContext$onValue4 === void 0 || _eventContext$onValue4.call(eventContext, itemToStringWithDefaultToString(newSelectedItem));
         } else if (type === useCombobox.stateChangeTypes.FunctionReset) {
           var _eventContext$onValue5;
           (_eventContext$onValue5 = eventContext.onValueChange) === null || _eventContext$onValue5 === void 0 || _eventContext$onValue5.call(eventContext, '');
@@ -15886,7 +16704,11 @@ function useMultipleSelectionState(selectedItems, setSelectedItems, _ref3) {
           setSelectedItems(newSelectedItems || []);
           break;
       }
-      (_eventContext$onValue6 = eventContext.onValueChange) === null || _eventContext$onValue6 === void 0 || _eventContext$onValue6.call(eventContext, mapItemsToStrings(newSelectedItems || [], itemToString));
+      const itemToStringWithDefaultToString = itemToString !== null && itemToString !== void 0 ? itemToString : item => {
+        var _item$toString;
+        return (_item$toString = item === null || item === void 0 ? void 0 : item.toString()) !== null && _item$toString !== void 0 ? _item$toString : '';
+      };
+      (_eventContext$onValue6 = eventContext.onValueChange) === null || _eventContext$onValue6 === void 0 || _eventContext$onValue6.call(eventContext, mapItemsToString(newSelectedItems || [], itemToStringWithDefaultToString));
     }
   });
 }
@@ -15936,6 +16758,7 @@ const TypeaheadComboboxMenu = /*#__PURE__*/forwardRef((_ref2, ref) => {
   const {
     useNewShadows
   } = useDesignSystemSafexFlags();
+  const [viewPortMaxHeight, setViewPortMaxHeight] = useState(undefined);
   const {
     floatingUiRefs,
     floatingStyles,
@@ -15952,25 +16775,58 @@ const TypeaheadComboboxMenu = /*#__PURE__*/forwardRef((_ref2, ref) => {
   const {
     getPopupContainer
   } = useDesignSystemContext();
+  const recalculateMaxHeight = useCallback(() => {
+    if (isOpen && floatingUiRefs !== null && floatingUiRefs !== void 0 && floatingUiRefs.floating && floatingUiRefs.reference.current && floatingUiRefs !== null && floatingUiRefs !== void 0 && floatingUiRefs.reference && floatingUiRefs.floating.current) {
+      computePosition(floatingUiRefs.reference.current, floatingUiRefs.floating.current, {
+        middleware: [flip$1(), size({
+          padding: theme.spacing.sm,
+          apply(_ref3) {
+            let {
+              availableHeight
+            } = _ref3;
+            setViewPortMaxHeight(availableHeight);
+          }
+        })]
+      });
+    }
+  }, [isOpen, floatingUiRefs, theme.spacing.sm]);
+  useEffect(() => {
+    if (isOpen && !maxHeight) {
+      window.addEventListener('scroll', recalculateMaxHeight);
+      return () => {
+        window.removeEventListener('scroll', recalculateMaxHeight);
+      };
+    } else {
+      return;
+    }
+  }, [isOpen, maxHeight, recalculateMaxHeight]);
   if (!isOpen) return null;
   const hasFragmentWrapper = children && !Array.isArray(children) && children.type === Fragment$1;
   const filterableChildren = hasFragmentWrapper ? children.props.children : children;
   const hasResults = filterableChildren && Children.toArray(filterableChildren).some(child => {
     if (/*#__PURE__*/React__default.isValidElement(child)) {
       var _child$props$__EMOTIO, _child$props$__EMOTIO2;
-      const childType = (_child$props$__EMOTIO = (_child$props$__EMOTIO2 = child.props['__EMOTION_TYPE_PLEASE_DO_NOT_USE__']) === null || _child$props$__EMOTIO2 === void 0 ? void 0 : _child$props$__EMOTIO2.defaultProps._TYPE) !== null && _child$props$__EMOTIO !== void 0 ? _child$props$__EMOTIO : child.props._TYPE;
+      const childType = (_child$props$__EMOTIO = (_child$props$__EMOTIO2 = child.props['__EMOTION_TYPE_PLEASE_DO_NOT_USE__']) === null || _child$props$__EMOTIO2 === void 0 ? void 0 : _child$props$__EMOTIO2.defaultProps._type) !== null && _child$props$__EMOTIO !== void 0 ? _child$props$__EMOTIO : child.props._type;
       return ['TypeaheadComboboxMenuItem', 'TypeaheadComboboxCheckboxItem'].includes(childType);
     }
     return false;
   });
-  const footer = Children.toArray(children).filter(child => /*#__PURE__*/React__default.isValidElement(child) && child.props._TYPE === 'TypeaheadComboboxFooter');
+  const [menuItemChildren, footer] = Children.toArray(filterableChildren).reduce((acc, child) => {
+    const isFooter = /*#__PURE__*/React__default.isValidElement(child) && child.props._type === 'TypeaheadComboboxFooter';
+    if (isFooter) {
+      acc[1].push(child);
+    } else {
+      acc[0].push(child);
+    }
+    return acc;
+  }, [[], []]);
   return /*#__PURE__*/createPortal(jsx("ul", {
     ...addDebugOutlineIfEnabled(),
     "aria-busy": loading,
     ...downshiftProps,
     ref: mergedRef,
     css: [getComboboxContentWrapperStyles(theme, {
-      maxHeight,
+      maxHeight: maxHeight !== null && maxHeight !== void 0 ? maxHeight : viewPortMaxHeight,
       maxWidth,
       minHeight,
       minWidth,
@@ -15986,16 +16842,18 @@ const TypeaheadComboboxMenu = /*#__PURE__*/forwardRef((_ref2, ref) => {
     children: loading ? jsx(LoadingSpinner, {
       "aria-label": "Loading",
       alt: "Loading spinner"
-    }) : hasResults ? jsx("div", {
-      style: {
-        position: 'relative',
-        width: '100%',
-        ...(listWrapperHeight && {
-          height: listWrapperHeight,
-          flexShrink: 0
-        })
-      },
-      children: children
+    }) : hasResults ? jsxs(Fragment, {
+      children: [jsx("div", {
+        style: {
+          position: 'relative',
+          width: '100%',
+          ...(listWrapperHeight && {
+            height: listWrapperHeight,
+            flexShrink: 0
+          })
+        },
+        children: menuItemChildren
+      }), footer]
     }) : jsxs(Fragment, {
       children: [jsx(EmptyResults, {
         emptyText: emptyText
@@ -16116,7 +16974,7 @@ const TypeaheadComboboxMenuItem = /*#__PURE__*/forwardRef((_ref, ref) => {
   return jsxs("li", {
     role: "option",
     "aria-selected": isSelected,
-    disabled: isDisabled,
+    "aria-disabled": isDisabled,
     onClick: handleClick,
     css: [getComboboxOptionItemWrapperStyles(theme), getMenuItemStyles(theme, isHighlighted, isDisabled), process.env.NODE_ENV === "production" ? "" : ";label:TypeaheadComboboxMenuItem;"],
     ...downshiftItemProps,
@@ -16148,7 +17006,7 @@ const TypeaheadComboboxMenuItem = /*#__PURE__*/forwardRef((_ref, ref) => {
   });
 });
 TypeaheadComboboxMenuItem.defaultProps = {
-  _TYPE: 'TypeaheadComboboxMenuItem'
+  _type: 'TypeaheadComboboxMenuItem'
 };
 
 function _EMOTION_STRINGIFIED_CSS_ERROR__$a() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -16265,7 +17123,7 @@ const TypeaheadComboboxCheckboxItem = /*#__PURE__*/forwardRef((_ref, ref) => {
   });
 });
 TypeaheadComboboxCheckboxItem.defaultProps = {
-  _TYPE: 'TypeaheadComboboxCheckboxItem'
+  _type: 'TypeaheadComboboxCheckboxItem'
 };
 
 const getToggleButtonStyles = (theme, disabled) => {
@@ -16361,10 +17219,13 @@ var _ref$5 = process.env.NODE_ENV === "production" ? {
 const getContainerStyles$1 = () => {
   return _ref$5;
 };
-const getInputStyles$1 = (theme, showComboboxToggleButton) => /*#__PURE__*/css({
+const getInputStyles$1 = (theme, showComboboxToggleButton, useNewBorderRadii) => /*#__PURE__*/css({
   paddingRight: showComboboxToggleButton ? 52 : 26,
   width: '100%',
   minWidth: 72,
+  ...(useNewBorderRadii && {
+    borderRadius: theme.borders.borderRadiusSm
+  }),
   '&:disabled': {
     borderColor: theme.colors.actionDisabledBorder,
     backgroundColor: theme.colors.actionDisabledBackground,
@@ -16414,6 +17275,9 @@ const TypeaheadComboboxInput = /*#__PURE__*/forwardRef((_ref2, ref) => {
   const {
     theme
   } = useDesignSystemTheme();
+  const {
+    useNewBorderRadii
+  } = useDesignSystemSafexFlags();
   const handleClick = e => {
     onClick === null || onClick === void 0 || onClick(e);
     toggleMenu();
@@ -16470,7 +17334,7 @@ const TypeaheadComboboxInput = /*#__PURE__*/forwardRef((_ref2, ref) => {
       ...downshiftProps,
       "aria-controls": comboboxState.isOpen ? downshiftProps['aria-controls'] : undefined,
       onClick: handleClick,
-      css: getInputStyles$1(theme, showComboboxToggleButton),
+      css: getInputStyles$1(theme, showComboboxToggleButton, useNewBorderRadii),
       ...restProps
     }), jsx(TypeaheadComboboxControls, {
       getDownshiftToggleButtonProps: getToggleButtonProps,
@@ -16617,7 +17481,7 @@ const getContainerStyles = (theme, validationState, width, maxHeight, disabled)
       border: `1px solid ${theme.colors.actionPrimaryBackgroundHover}`
     },
     '&:focus-within': {
-      outlineColor: theme.colors.actionPrimaryBackgroundDefault,
+      outlineColor: theme.colors.actionDefaultBorderFocus,
       outlineWidth: 2,
       outlineOffset: -2,
       outlineStyle: 'solid',
@@ -16632,7 +17496,7 @@ const getContainerStyles = (theme, validationState, width, maxHeight, disabled)
         borderColor: validationState ? validationColor : theme.colors.actionPrimaryBackgroundHover
       },
       '&:focus': {
-        outlineColor: validationState ? validationColor : theme.colors.actionPrimaryBackgroundDefault,
+        outlineColor: validationState ? validationColor : theme.colors.actionDefaultBorderFocus,
         outlineWidth: 2,
         outlineOffset: -2,
         outlineStyle: 'solid',
@@ -16920,11 +17784,11 @@ const DuboisTypeaheadComboboxFooter = _ref => {
   });
 };
 DuboisTypeaheadComboboxFooter.defaultProps = {
-  _TYPE: 'TypeaheadComboboxFooter'
+  _type: 'TypeaheadComboboxFooter'
 };
 const TypeaheadComboboxFooter = DuboisTypeaheadComboboxFooter;
 
-const TypeaheadComboboxAddButton = _ref => {
+const TypeaheadComboboxAddButton = /*#__PURE__*/forwardRef((_ref, forwardedRef) => {
   let {
     children,
     ...restProps
@@ -16969,15 +17833,17 @@ const TypeaheadComboboxAddButton = _ref => {
       }), process.env.NODE_ENV === "production" ? "" : ";label:TypeaheadComboboxAddButton;")
     }, process.env.NODE_ENV === "production" ? "" : ";label:TypeaheadComboboxAddButton;"),
     icon: jsx(PlusIcon, {}),
+    ref: forwardedRef,
     children: children
   });
-};
+});
 
 function RHFControlledInput(_ref) {
   let {
     name,
     control,
     rules,
+    inputRef,
     ...restProps
   } = _ref;
   const {
@@ -16987,9 +17853,11 @@ function RHFControlledInput(_ref) {
     control: control,
     rules: rules
   });
+  const mergedRef = useMergeRefs([field.ref, inputRef]);
   return jsx(Input, {
     ...restProps,
     ...field,
+    ref: mergedRef,
     value: field.value,
     defaultValue: restProps.defaultValue
   });
@@ -17264,6 +18132,7 @@ function RHFControlledTypeaheadCombobox(_ref7) {
     componentId,
     analyticsEvents,
     valueHasNoPii,
+    preventUnsetOnBlur = false,
     ...props
   } = _ref7;
   const {
@@ -17286,7 +18155,8 @@ function RHFControlledTypeaheadCombobox(_ref7) {
     formOnBlur: field.onBlur,
     componentId,
     analyticsEvents,
-    valueHasNoPii
+    valueHasNoPii,
+    preventUnsetOnBlur
   });
   const lastEmmitedInputValue = useRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.value);
   useEffect(() => {
@@ -17780,7 +18650,7 @@ const useHoverCardStyles = _ref2 => {
       color: theme.colors.textPrimary,
       lineHeight: theme.typography.lineHeightBase,
       border: `1px solid ${theme.colors.borderDecorative}`,
-      borderRadius: theme.legacyBorders.borderRadiusMd,
+      borderRadius: theme.borders.borderRadiusSm,
       padding: `${theme.spacing.sm}px`,
       boxShadow: useNewShadows ? theme.shadows.lg : theme.general.shadowLow,
       userSelect: 'none',
@@ -17799,7 +18669,7 @@ const useHoverCardStyles = _ref2 => {
         outlineStyle: 'solid',
         outlineWidth: '2px',
         outlineOffset: '1px',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       }
     },
     arrow: {
@@ -18310,8 +19180,9 @@ const Pagination = function Pagination(_ref) {
     hideOnSinglePage,
     dangerouslySetAntdProps,
     componentId,
-    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange]
+    analyticsEvents
   } = _ref;
+  const emitOnView = safex('databricks.fe.observability.defaultComponentView.pagination', false);
   const {
     classNamePrefix,
     theme
@@ -18325,7 +19196,7 @@ const Pagination = function Pagination(_ref) {
     ...restDangerouslySetAntdProps
   } = dangerouslySetAntdProps !== null && dangerouslySetAntdProps !== void 0 ? dangerouslySetAntdProps : {};
   const ref = useRef(null);
-  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents !== null && analyticsEvents !== void 0 ? analyticsEvents : emitOnView ? [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange, DesignSystemEventProviderAnalyticsEventTypes.OnView] : [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange], [analyticsEvents, emitOnView]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Pagination,
     componentId,
@@ -18336,6 +19207,12 @@ const Pagination = function Pagination(_ref) {
     eventContext.onValueChange(pageIndex);
     onChange(pageIndex, pageSize);
   }, [eventContext, onChange]);
+  const {
+    elementRef: paginationRef
+  } = useNotifyOnFirstView({
+    onView: eventContext.onView
+  });
+  const mergedRef = useMergeRefs([ref, paginationRef]);
   useEffect(() => {
     if (ref && ref.current) {
       const selectDropdown = ref.current.querySelector(`.${classNamePrefix}-select-selection-search-input`);
@@ -18350,7 +19227,7 @@ const Pagination = function Pagination(_ref) {
   }, [pageQuickJumperAriaLabel, pageSizeSelectAriaLabel, classNamePrefix]);
   return jsx(DesignSystemAntDConfigProvider, {
     children: jsx("div", {
-      ref: ref,
+      ref: mergedRef,
       children: jsx(Pagination$1, {
         ...addDebugOutlineIfEnabled(),
         css: getPaginationEmotionStyles(classNamePrefix, theme, useNewShadows),
@@ -18364,7 +19241,8 @@ const Pagination = function Pagination(_ref) {
         size: "small",
         style: style,
         hideOnSinglePage: hideOnSinglePage,
-        ...restDangerouslySetAntdProps
+        ...restDangerouslySetAntdProps,
+        ...eventContext.dataComponentProps
       })
     })
   });
@@ -18402,9 +19280,10 @@ const CursorPagination = function CursorPagination(_ref2) {
   } = useDesignSystemTheme();
   const [pageSizeValue, setPageSizeValue] = useState(defaultPageSize);
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const pageSizeEventComponentId = `${componentId}.page_size`;
   const pageSizeEventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.LegacySelect,
-    componentId: `${componentId}.page_size`,
+    componentId: pageSizeEventComponentId,
     analyticsEvents: memoizedAnalyticsEvents,
     valueHasNoPii
   });
@@ -18418,6 +19297,7 @@ const CursorPagination = function CursorPagination(_ref2) {
         content: 'none'
       }
     }, process.env.NODE_ENV === "production" ? "" : ";label:CursorPagination;"),
+    ...pageSizeEventContext.dataComponentProps,
     children: [jsx(Button, {
       componentId: `${componentId}.previous_page`,
       icon: jsx(ChevronLeftIcon, {}),
@@ -18574,7 +19454,7 @@ const getLegacyTabEmotionStyles = (clsPrefix, theme) => {
       },
       outlineWidth: 2,
       outlineStyle: 'none',
-      outlineColor: theme.colors.primary,
+      outlineColor: theme.colors.actionDefaultBorderFocus,
       outlineOffset: 2,
       '&:focus-visible': {
         outlineStyle: 'auto'
@@ -18637,7 +19517,7 @@ const getLegacyTabEmotionStyles = (clsPrefix, theme) => {
       '&:focus-visible': {
         outlineWidth: 2,
         outlineStyle: 'solid',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       }
     },
     [classAddButton]: {
@@ -18661,7 +19541,7 @@ const getLegacyTabEmotionStyles = (clsPrefix, theme) => {
       '&:focus-visible': {
         outlineWidth: 2,
         outlineStyle: 'solid',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       },
       '& > .anticon': {
         fontSize: 16
@@ -18930,7 +19810,7 @@ const getToastRootStyle = (theme, classNamePrefix, useNewShadows) => {
       padding: 12,
       columnGap: 4,
       boxShadow: useNewShadows ? theme.shadows.lg : theme.general.shadowLow,
-      borderRadius: theme.general.borderRadiusBase,
+      borderRadius: theme.borders.borderRadiusSm,
       lineHeight: '20px',
       gridTemplateRows: '[header] auto [content] auto',
       gridTemplateColumns: '[icon] auto [content] 1fr [close] auto',
@@ -18982,7 +19862,7 @@ const Root$2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
     children,
     severity = 'info',
     componentId,
-    analyticsEvents = [],
+    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnView],
     ...props
   } = _ref;
   const {
@@ -18996,6 +19876,7 @@ const Root$2 = /*#__PURE__*/forwardRef(function (_ref, ref) {
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Notification,
     componentId,
+    componentSubType: DesignSystemEventProviderComponentSubTypeMap[severity],
     analyticsEvents: memoizedAnalyticsEvents,
     shouldStartInteraction: false
   });
@@ -19175,121 +20056,93 @@ function getTagEmotionStyles(theme) {
   let color = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'default';
   let clickable = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   let closable = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-  let useNewTagColors = arguments.length > 4 ? arguments[4] : undefined;
   let textColor = theme.colors.tagText;
   let backgroundColor = theme.colors[oldTagColorsMap[color]];
   let iconColor = '';
   let outlineColor = theme.colors.actionDefaultBorderFocus;
-  if (useNewTagColors) {
-    const capitalizedColor = color.charAt(0).toUpperCase() + color.slice(1);
-    textColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagText${capitalizedColor}`];
-    backgroundColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagBackground${capitalizedColor}`];
-    iconColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagIcon${capitalizedColor}`];
-    if (color === 'charcoal') {
-      outlineColor = theme.colors.white;
-    }
-  }
-  let iconHover = theme.colors.tagIconHover;
-  let iconPress = theme.colors.tagIconPress;
-  let tagHover = theme.colors.tagHover;
-  let tagPress = theme.colors.tagPress;
-
-  // Because the default tag background color changes depending on system theme, so do its other variables.
-  if (color === 'default' && !useNewTagColors) {
-    textColor = theme.colors.textPrimary;
-    iconHover = theme.colors.actionTertiaryTextHover;
-    iconPress = theme.colors.actionTertiaryTextPress;
-  }
-
-  // Because lemon is a light yellow, all its variables pull from the light mode palette, regardless of system theme.
-  if (color === 'lemon' && !useNewTagColors) {
-    textColor = lightColorList.textPrimary;
-    iconHover = lightColorList.actionTertiaryTextHover;
-    iconPress = lightColorList.actionTertiaryTextPress;
-    tagHover = lightColorList.actionTertiaryBackgroundHover;
-    tagPress = lightColorList.actionTertiaryBackgroundPress;
+  const capitalizedColor = color.charAt(0).toUpperCase() + color.slice(1);
+  textColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagText${capitalizedColor}`];
+  backgroundColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagBackground${capitalizedColor}`];
+  iconColor = theme.DU_BOIS_INTERNAL_ONLY.colors[`tagIcon${capitalizedColor}`];
+  if (color === 'charcoal') {
+    outlineColor = theme.colors.white;
   }
+  const iconHover = theme.colors.tagIconHover;
+  const iconPress = theme.colors.tagIconPress;
   return {
     wrapper: {
       backgroundColor: backgroundColor,
       display: 'inline-flex',
       alignItems: 'center',
       marginRight: theme.spacing.sm,
-      borderRadius: theme.legacyBorders.borderRadiusMd
+      borderRadius: theme.borders.borderRadiusSm
     },
     tag: {
       border: 'none',
       color: textColor,
-      padding: useNewTagColors ? '' : '2px 4px',
-      backgroundColor: useNewTagColors ? 'transparent' : backgroundColor,
-      borderRadius: theme.legacyBorders.borderRadiusMd,
+      padding: '',
+      backgroundColor: 'transparent',
+      borderRadius: theme.borders.borderRadiusSm,
       marginRight: theme.spacing.sm,
       display: 'inline-block',
       cursor: clickable ? 'pointer' : 'default',
-      ...(useNewTagColors && {
-        ...(closable && {
-          borderTopRightRadius: 0,
-          borderBottomRightRadius: 0
-        }),
-        ...(clickable && {
-          '&:hover': {
-            '& > div': {
-              backgroundColor: theme.colors.actionDefaultBackgroundHover
-            }
-          },
-          '&:active': {
-            '& > div': {
-              backgroundColor: theme.colors.actionDefaultBackgroundPress
-            }
+      ...(closable && {
+        borderTopRightRadius: 0,
+        borderBottomRightRadius: 0
+      }),
+      ...(clickable && {
+        '&:hover': {
+          '& > div': {
+            backgroundColor: theme.colors.actionDefaultBackgroundHover
           }
-        })
+        },
+        '&:active': {
+          '& > div': {
+            backgroundColor: theme.colors.actionDefaultBackgroundPress
+          }
+        }
       })
     },
     content: {
       display: 'flex',
       alignItems: 'center',
-      ...(useNewTagColors && {
-        height: theme.typography.lineHeightBase
-      })
+      minWidth: 0,
+      height: theme.typography.lineHeightBase
     },
     close: {
-      height: useNewTagColors ? theme.typography.lineHeightBase : theme.general.iconFontSize,
-      width: useNewTagColors ? theme.typography.lineHeightBase : theme.general.iconFontSize,
+      height: theme.typography.lineHeightBase,
+      width: theme.typography.lineHeightBase,
       lineHeight: `${theme.general.iconFontSize}px`,
       padding: 0,
       color: textColor,
       fontSize: theme.general.iconFontSize,
-      borderTopRightRadius: theme.legacyBorders.borderRadiusMd,
-      borderBottomRightRadius: theme.legacyBorders.borderRadiusMd,
+      borderTopRightRadius: theme.borders.borderRadiusSm,
+      borderBottomRightRadius: theme.borders.borderRadiusSm,
       border: 'none',
       background: 'none',
       cursor: 'pointer',
       marginLeft: theme.spacing.xs,
-      ...(useNewTagColors ? {
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        margin: 0
-      } : {
-        marginRight: -theme.spacing.xs,
-        margin: '-2px -4px -2px 4px'
-      }),
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      margin: 0,
       '&:hover': {
-        backgroundColor: useNewTagColors ? theme.colors.actionDefaultBackgroundHover : tagHover,
+        backgroundColor: theme.colors.actionDefaultBackgroundHover,
         color: iconHover
       },
       '&:active': {
-        backgroundColor: useNewTagColors ? theme.colors.actionDefaultBackgroundPress : tagPress,
+        backgroundColor: theme.colors.actionDefaultBackgroundPress,
         color: iconPress
       },
       '&:focus-visible': {
         outlineStyle: 'solid',
         outlineWidth: 1,
-        outlineOffset: useNewTagColors ? -2 : 1,
+        outlineOffset: -2,
         outlineColor
       },
       '.anticon': {
-        verticalAlign: 0
+        verticalAlign: 0,
+        fontSize: 12
       }
     },
     text: {
@@ -19308,8 +20161,11 @@ function getTagEmotionStyles(theme) {
       height: theme.typography.lineHeightBase,
       display: 'inline-flex',
       alignItems: 'center',
-      borderTopLeftRadius: theme.legacyBorders.borderRadiusMd,
-      borderBottomLeftRadius: theme.legacyBorders.borderRadiusMd,
+      borderTopLeftRadius: theme.borders.borderRadiusSm,
+      borderBottomLeftRadius: theme.borders.borderRadiusSm,
+      '& > span': {
+        fontSize: 12
+      },
       '& + div': {
         borderTopLeftRadius: 0,
         borderBottomLeftRadius: 0,
@@ -19325,7 +20181,8 @@ function getTagEmotionStyles(theme) {
       height: theme.typography.lineHeightBase,
       display: 'inline-flex',
       alignItems: 'center',
-      borderRadius: theme.legacyBorders.borderRadiusMd
+      borderRadius: theme.borders.borderRadiusSm,
+      minWidth: 0
     }
   };
 }
@@ -19340,15 +20197,15 @@ const Tag = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     onClose,
     role = 'status',
     closeButtonProps,
-    analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnClick],
+    analyticsEvents,
     componentId,
     icon,
     onClick,
     ...attributes
   } = props;
+  const emitOnView = safex('databricks.fe.observability.defaultComponentView.tag', false);
   const isClickable = Boolean(props.onClick);
-  const useNewTagColors = safex('databricks.fe.designsystem.useNewTagColors', false);
-  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents !== null && analyticsEvents !== void 0 ? analyticsEvents : emitOnView ? [DesignSystemEventProviderAnalyticsEventTypes.OnClick, DesignSystemEventProviderAnalyticsEventTypes.OnView] : [DesignSystemEventProviderAnalyticsEventTypes.OnClick], [analyticsEvents, emitOnView]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Tag,
     componentId,
@@ -19360,9 +20217,10 @@ const Tag = /*#__PURE__*/forwardRef((props, forwardedRef) => {
     onView: eventContext.onView
   });
   const mergedRef = useMergeRefs([elementRef, forwardedRef]);
+  const closeButtonComponentId = componentId ? `${componentId}.close` : undefined;
   const closeButtonEventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.Button,
-    componentId: componentId ? `${componentId}.close` : undefined,
+    componentId: closeButtonComponentId,
     analyticsEvents: [DesignSystemEventProviderAnalyticsEventTypes.OnClick]
   });
   const handleClick = useCallback(e => {
@@ -19378,18 +20236,20 @@ const Tag = /*#__PURE__*/forwardRef((props, forwardedRef) => {
       onClose();
     }
   }, [closeButtonEventContext, onClose]);
-  const styles = getTagEmotionStyles(theme, color, isClickable, closable, useNewTagColors);
-  return useNewTagColors ? jsxs("div", {
+  const styles = getTagEmotionStyles(theme, color, isClickable, closable);
+  return jsxs("div", {
     ref: mergedRef,
     role: role,
     onClick: handleClick,
     css: [styles.wrapper, process.env.NODE_ENV === "production" ? "" : ";label:Tag;"],
     ...attributes,
     ...addDebugOutlineIfEnabled(),
+    ...eventContext.dataComponentProps,
     // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
     tabIndex: isClickable ? 0 : -1,
     children: [jsxs("div", {
       css: [styles.tag, styles.content, styles.text, "margin-right:0;" + (process.env.NODE_ENV === "production" ? "" : ";label:Tag;")],
+      ...eventContext.dataComponentProps,
       children: [icon && jsx("div", {
         css: [styles.icon, process.env.NODE_ENV === "production" ? "" : ";label:Tag;"],
         children: icon
@@ -19406,37 +20266,13 @@ const Tag = /*#__PURE__*/forwardRef((props, forwardedRef) => {
         e.stopPropagation();
       },
       ...closeButtonProps,
+      ...closeButtonEventContext.dataComponentProps,
       children: jsx(CloseIcon, {
         css: /*#__PURE__*/css({
           fontSize: theme.general.iconFontSize - 4
         }, process.env.NODE_ENV === "production" ? "" : ";label:Tag;")
       })
     })]
-  }) : jsx("div", {
-    ref: mergedRef,
-    role: role,
-    ...attributes,
-    onClick: handleClick,
-    css: styles.tag,
-    ...addDebugOutlineIfEnabled(),
-    children: jsxs("div", {
-      css: [styles.content, styles.text, process.env.NODE_ENV === "production" ? "" : ";label:Tag;"],
-      children: [children, closable && jsx("button", {
-        css: styles.close,
-        tabIndex: 0,
-        onClick: handleCloseClick,
-        onMouseDown: e => {
-          // Keeps dropdowns of any underlying select from opening.
-          e.stopPropagation();
-        },
-        ...closeButtonProps,
-        children: jsx(CloseIcon, {
-          css: /*#__PURE__*/css({
-            fontSize: theme.general.iconFontSize - 4
-          }, process.env.NODE_ENV === "production" ? "" : ";label:Tag;")
-        })
-      })]
-    })
   });
 });
 
@@ -19517,6 +20353,324 @@ const PageWrapper = _ref => {
   });
 };
 
+const PreviewCard = _ref => {
+  let {
+    icon,
+    title,
+    subtitle,
+    titleActions,
+    children,
+    startActions,
+    endActions,
+    image,
+    fullBleedImage = true,
+    onClick,
+    size = 'default',
+    dangerouslyAppendEmotionCSS,
+    componentId,
+    analyticsEvents = [],
+    disabled,
+    selected,
+    href,
+    target,
+    ...props
+  } = _ref;
+  const styles = usePreviewCardStyles({
+    onClick,
+    size,
+    disabled,
+    fullBleedImage
+  });
+  const tabIndex = onClick && !href ? 0 : undefined;
+  const role = onClick && !href ? 'button' : undefined;
+  const showFooter = startActions || endActions;
+  const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
+  const eventContext = useDesignSystemEventComponentCallbacks({
+    componentType: DesignSystemEventProviderComponentTypes.PreviewCard,
+    componentId,
+    analyticsEvents: memoizedAnalyticsEvents
+  });
+  const onClickWrapper = useCallback(e => {
+    if (onClick) {
+      eventContext.onClick(e);
+      onClick(e);
+    }
+  }, [eventContext, onClick]);
+  const content = jsxs("div", {
+    ...addDebugOutlineIfEnabled(),
+    css: [styles['container'], dangerouslyAppendEmotionCSS, process.env.NODE_ENV === "production" ? "" : ";label:content;"],
+    tabIndex: tabIndex,
+    onClick: onClickWrapper,
+    onKeyDown: e => {
+      if (!onClick || disabled) {
+        return;
+      }
+      if (e.key === 'Enter' || e.key === ' ') {
+        e.preventDefault();
+        onClickWrapper(e);
+      }
+    },
+    role: role,
+    "aria-disabled": disabled,
+    "aria-pressed": selected,
+    ...props,
+    children: [image && jsx("div", {
+      css: styles['image'],
+      children: image
+    }), jsxs("div", {
+      css: styles['header'],
+      children: [icon && jsx("div", {
+        children: icon
+      }), jsxs("div", {
+        css: styles['titleWrapper'],
+        children: [title && jsx("div", {
+          css: styles['title'],
+          children: title
+        }), subtitle && jsx("div", {
+          css: styles['subTitle'],
+          children: subtitle
+        })]
+      }), titleActions && jsx("div", {
+        children: titleActions
+      })]
+    }), children && jsx("div", {
+      css: styles['childrenWrapper'],
+      children: children
+    }), showFooter && jsxs("div", {
+      css: styles['footer'],
+      children: [jsx("div", {
+        css: styles['action'],
+        children: startActions
+      }), jsx("div", {
+        css: styles['action'],
+        children: endActions
+      })]
+    })]
+  });
+  if (href) {
+    return jsx("a", {
+      href: href,
+      target: target,
+      style: {
+        textDecoration: 'none'
+      },
+      children: content
+    });
+  }
+  return content;
+};
+const usePreviewCardStyles = _ref2 => {
+  let {
+    onClick,
+    size,
+    disabled,
+    fullBleedImage
+  } = _ref2;
+  const {
+    theme
+  } = useDesignSystemTheme();
+  const {
+    useNewShadows
+  } = useDesignSystemSafexFlags();
+  const isInteractive = onClick !== undefined;
+  const paddingSize = size === 'large' ? theme.spacing.lg : theme.spacing.md;
+  return {
+    container: {
+      overflow: 'hidden',
+      borderRadius: theme.borders.borderRadiusMd,
+      border: `1px solid ${theme.colors.border}`,
+      padding: paddingSize,
+      color: theme.colors.textSecondary,
+      display: 'flex',
+      flexDirection: 'column',
+      justifyContent: 'space-between',
+      gap: size === 'large' ? theme.spacing.md : theme.spacing.sm,
+      ...(useNewShadows ? {
+        boxShadow: theme.shadows.sm
+      } : {}),
+      cursor: isInteractive ? 'pointer' : 'default',
+      ...(isInteractive && {
+        '&[aria-disabled="true"]': {
+          pointerEvents: 'none',
+          backgroundColor: theme.colors.actionDisabledBackground,
+          borderColor: theme.colors.actionDisabledBorder,
+          color: theme.colors.actionDisabledText
+        },
+        '&:hover, &:focus-within': {
+          boxShadow: useNewShadows ? theme.shadows.md : theme.general.shadowLow
+        },
+        '&:active': {
+          background: theme.colors.actionTertiaryBackgroundPress,
+          borderColor: theme.colors.actionDefaultBorderHover,
+          boxShadow: useNewShadows ? theme.shadows.md : theme.general.shadowLow
+        },
+        '&:focus, &[aria-pressed="true"]': {
+          outlineColor: theme.colors.actionDefaultBorderFocus,
+          outlineWidth: 2,
+          outlineOffset: -2,
+          outlineStyle: 'solid',
+          boxShadow: useNewShadows ? theme.shadows.md : theme.general.shadowLow,
+          borderColor: theme.colors.actionDefaultBorderHover
+        },
+        '&:active:not(:focus):not(:focus-within)': {
+          background: 'transparent',
+          borderColor: theme.colors.border
+        }
+      })
+    },
+    image: {
+      margin: fullBleedImage ? `-${paddingSize}px -${paddingSize}px 0` : 0,
+      '& > *': {
+        borderRadius: fullBleedImage ? 0 : theme.borders.borderRadiusSm
+      }
+    },
+    header: {
+      display: 'flex',
+      alignItems: 'center',
+      gap: theme.spacing.sm
+    },
+    title: {
+      fontWeight: theme.typography.typographyBoldFontWeight,
+      color: disabled ? theme.colors.actionDisabledText : theme.colors.textPrimary,
+      lineHeight: theme.typography.lineHeightSm
+    },
+    subTitle: {
+      lineHeight: theme.typography.lineHeightSm
+    },
+    titleWrapper: {
+      flexGrow: 1,
+      overflow: 'hidden'
+    },
+    childrenWrapper: {
+      flexGrow: 1
+    },
+    footer: {
+      display: 'flex',
+      justifyContent: 'space-between',
+      alignItems: 'center',
+      flexWrap: 'wrap'
+    },
+    action: {
+      overflow: 'hidden',
+      // to ensure focus ring is rendered
+      margin: theme.spacing.md * -1,
+      padding: theme.spacing.md
+    }
+  };
+};
+
+const getRadioTileStyles = (theme, classNamePrefix, maxWidth) => {
+  const radioWrapper = `.${classNamePrefix}-radio-wrapper`;
+  return /*#__PURE__*/css({
+    '&&': {
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      border: `1px solid ${theme.colors.actionDefaultBorderDefault}`,
+      padding: theme.spacing.md,
+      gap: theme.spacing.xs,
+      borderRadius: theme.borders.borderRadiusSm,
+      background: 'transparent',
+      cursor: 'pointer',
+      ...(maxWidth && {
+        maxWidth
+      }),
+      // Label, radio and icon container
+      '& > div:first-of-type': {
+        width: '100%',
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        gap: theme.spacing.sm
+      },
+      // Description container
+      '& > div:nth-of-type(2)': {
+        alignSelf: 'flex-start',
+        textAlign: 'left',
+        color: theme.colors.textSecondary,
+        fontSize: theme.typography.fontSizeSm
+      },
+      '&:hover': {
+        backgroundColor: theme.colors.actionDefaultBackgroundHover,
+        borderColor: theme.colors.actionDefaultBorderHover
+      },
+      '&:disabled': {
+        borderColor: theme.colors.actionDisabledBorder,
+        backgroundColor: 'transparent',
+        cursor: 'not-allowed',
+        '& > div:nth-of-type(2)': {
+          color: theme.colors.actionDisabledText
+        }
+      }
+    },
+    [radioWrapper]: {
+      display: 'flex',
+      flexDirection: 'row-reverse',
+      justifyContent: 'space-between',
+      flex: 1,
+      margin: 0,
+      '& > span': {
+        padding: 0
+      },
+      '::after': {
+        display: 'none'
+      }
+    }
+  }, process.env.NODE_ENV === "production" ? "" : ";label:getRadioTileStyles;");
+};
+const RadioTile = props => {
+  const {
+    description,
+    icon,
+    maxWidth,
+    checked,
+    defaultChecked,
+    onChange,
+    ...rest
+  } = props;
+  const {
+    theme,
+    classNamePrefix
+  } = useDesignSystemTheme();
+  const {
+    value: groupValue,
+    onChange: groupOnChange
+  } = useRadioGroupContext();
+  return jsxs("button", {
+    role: "radio",
+    "aria-checked": groupValue === props.value,
+    onClick: () => {
+      if (props.disabled) {
+        return;
+      }
+      onChange === null || onChange === void 0 || onChange(props.value);
+      groupOnChange === null || groupOnChange === void 0 || groupOnChange({
+        target: {
+          value: props.value
+        }
+      });
+    },
+    tabIndex: 0,
+    className: `${classNamePrefix}-radio-tile`,
+    css: getRadioTileStyles(theme, classNamePrefix, maxWidth),
+    disabled: props.disabled,
+    children: [jsxs("div", {
+      children: [icon ? jsx("span", {
+        css: /*#__PURE__*/css({
+          color: props.disabled ? theme.colors.actionDisabledText : theme.colors.textSecondary
+        }, process.env.NODE_ENV === "production" ? "" : ";label:RadioTile;"),
+        children: icon
+      }) : null, jsx(Radio, {
+        __INTERNAL_DISABLE_RADIO_ROLE: true,
+        ...rest,
+        tabIndex: -1
+      })]
+    }), description ? jsx("div", {
+      children: description
+    }) : null]
+  });
+};
+
 const STATUS_TO_ICON = {
   online: _ref => {
     let {
@@ -19674,15 +20828,23 @@ function getSegmentedControlButtonEmotionStyles(clsPrefix, theme, size) {
         whiteSpace: 'nowrap',
         minWidth: size === 'small' ? 58 : 68 // Don't allow the button to shrink and truncate below 3 characters
       }),
+      '&:first-of-type': {
+        borderTopLeftRadius: theme.borders.borderRadiusSm,
+        borderBottomLeftRadius: theme.borders.borderRadiusSm
+      },
+      '&:last-of-type': {
+        borderTopRightRadius: theme.borders.borderRadiusSm,
+        borderBottomRightRadius: theme.borders.borderRadiusSm
+      },
       ...(spaced ? {
         borderWidth: 1,
-        borderRadius: theme.general.borderRadiusBase
+        borderRadius: theme.borders.borderRadiusSm
       } : {}),
       '&:focus-within': {
         outlineStyle: 'solid',
         outlineWidth: '2px',
         outlineOffset: '-2px',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       },
       ...(truncateButtons && {
         'span:last-of-type': {
@@ -19733,7 +20895,8 @@ function getSegmentedControlButtonEmotionStyles(clsPrefix, theme, size) {
 }
 const SegmentedControlGroupContext = /*#__PURE__*/createContext({
   size: 'middle',
-  spaced: false
+  spaced: false,
+  dontTruncate: false
 });
 const SegmentedControlButton = /*#__PURE__*/forwardRef(function SegmentedControlButton(_ref, ref) {
   let {
@@ -19746,9 +20909,10 @@ const SegmentedControlButton = /*#__PURE__*/forwardRef(function SegmentedControl
   } = useDesignSystemTheme();
   const {
     size,
-    spaced
+    spaced,
+    dontTruncate
   } = useContext(SegmentedControlGroupContext);
-  const truncateButtons = safex('databricks.fe.designsystem.truncateSegmentedControlText', false);
+  const truncateButtons = safex('databricks.fe.designsystem.truncateSegmentedControlText', false) && !dontTruncate;
   const {
     useNewShadows
   } = useDesignSystemSafexFlags();
@@ -19790,12 +20954,13 @@ const SegmentedControlGroup = /*#__PURE__*/forwardRef(function SegmentedControlG
     componentId,
     analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
     valueHasNoPii,
+    dontTruncate,
     ...props
   } = _ref2;
   const {
     classNamePrefix
   } = useDesignSystemTheme();
-  const truncateButtons = safex('databricks.fe.designsystem.truncateSegmentedControlText', false);
+  const truncateButtons = safex('databricks.fe.designsystem.truncateSegmentedControlText', false) && !dontTruncate;
   const memoizedAnalyticsEvents = useMemo(() => analyticsEvents, [analyticsEvents]);
   const eventContext = useDesignSystemEventComponentCallbacks({
     componentType: DesignSystemEventProviderComponentTypes.SegmentedControlGroup,
@@ -19811,7 +20976,8 @@ const SegmentedControlGroup = /*#__PURE__*/forwardRef(function SegmentedControlG
     children: jsx(SegmentedControlGroupContext.Provider, {
       value: {
         size,
-        spaced
+        spaced,
+        dontTruncate
       },
       children: jsx(Radio$1.Group, {
         ...addDebugOutlineIfEnabled(),
@@ -19819,7 +20985,8 @@ const SegmentedControlGroup = /*#__PURE__*/forwardRef(function SegmentedControlG
         css: getSegmentedControlGroupEmotionStyles(classNamePrefix, spaced, truncateButtons),
         onChange: onChangeWrapper,
         ...dangerouslySetAntdProps,
-        ref: ref
+        ref: ref,
+        ...eventContext.dataComponentProps
       })
     })
   });
@@ -19850,7 +21017,7 @@ const getTrackStyles = theme => {
     backgroundColor: theme.colors.grey100,
     position: 'relative',
     flexGrow: 1,
-    borderRadius: 9999,
+    borderRadius: theme.borders.borderRadiusFull,
     '&[data-orientation="vertical"]': {
       width: 3
     },
@@ -19873,7 +21040,7 @@ const getRangeStyles = theme => {
   return /*#__PURE__*/css({
     backgroundColor: theme.colors.primary,
     position: 'absolute',
-    borderRadius: 9999,
+    borderRadius: theme.borders.borderRadiusFull,
     height: '100%',
     '&[data-disabled]': {
       backgroundColor: theme.colors.grey100
@@ -19897,7 +21064,7 @@ const getThumbStyles = (theme, useNewShadows) => {
     height: 20,
     backgroundColor: theme.colors.actionPrimaryBackgroundDefault,
     boxShadow: useNewShadows ? theme.shadows.xs : `0 2px 4px 0 ${theme.colors.grey400}`,
-    borderRadius: 10,
+    borderRadius: theme.borders.borderRadiusFull,
     outline: 'none',
     '&:hover': {
       backgroundColor: theme.colors.actionPrimaryBackgroundHover
@@ -19920,6 +21087,7 @@ const Thumb = /*#__PURE__*/forwardRef((props, ref) => {
   } = useDesignSystemSafexFlags();
   return jsx(RadixSlider.Thumb, {
     css: getThumbStyles(theme, useNewShadows),
+    "aria-label": "Slider thumb",
     ...props,
     ref: ref
   });
@@ -19939,6 +21107,9 @@ const DropdownButton = props => {
     getPopupContainer: getContextPopupContainer,
     getPrefixCls
   } = useDesignSystemContext();
+  const {
+    useNewBorderRadii
+  } = useDesignSystemSafexFlags();
   const {
     type,
     danger,
@@ -20007,6 +21178,10 @@ const DropdownButton = props => {
     title: title,
     icon: children && leftButtonIcon ? leftButtonIcon : undefined,
     "aria-label": ariaLabel,
+    css: useNewBorderRadii !== null && useNewBorderRadii !== void 0 ? useNewBorderRadii : {
+      borderTopRightRadius: '0 !important',
+      borderBottomRightRadius: '0 !important'
+    },
     children: [leftButtonIcon && !children ? leftButtonIcon : undefined, children]
   });
   const rightButton = jsx(Button, {
@@ -20015,6 +21190,10 @@ const DropdownButton = props => {
     danger: danger,
     disabled: disabled,
     "aria-label": menuButtonLabel,
+    css: useNewBorderRadii !== null && useNewBorderRadii !== void 0 ? useNewBorderRadii : {
+      borderTopLeftRadius: '0 !important',
+      borderBottomLeftRadius: '0 !important'
+    },
     children: icon ? icon : jsx(ChevronDownIcon, {})
   });
   const [leftButtonToRender, rightButtonToRender] = buttonsRender([leftButton, rightButton]);
@@ -20027,6 +21206,7 @@ const DropdownButton = props => {
       children: rightButtonToRender
     }) : jsxs(Root$7, {
       ...dropdownMenuRootProps,
+      itemHtmlType: htmlType === 'submit' ? 'submit' : undefined,
       children: [jsx(Trigger$3, {
         disabled: disabled,
         asChild: true,
@@ -20040,7 +21220,7 @@ const DropdownButton = props => {
 
 function _EMOTION_STRINGIFIED_CSS_ERROR__$3() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 const BUTTON_HORIZONTAL_PADDING = 12;
-function getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows) {
+function getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows, useNewBorderRadii) {
   const classDefault = `.${classNamePrefix}-btn`;
   const classPrimary = `.${classNamePrefix}-btn-primary`;
   const classDropdownTrigger = `.${classNamePrefix}-dropdown-trigger`;
@@ -20055,7 +21235,7 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows) {
         outlineStyle: 'solid',
         outlineWidth: '2px',
         outlineOffset: '-2px',
-        outlineColor: theme.colors.primary
+        outlineColor: theme.colors.actionDefaultBorderFocus
       },
       '.anticon, &:focus-visible .anticon': {
         color: theme.colors.textSecondary
@@ -20067,6 +21247,12 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows) {
         color: theme.colors.actionDefaultIconPress
       }
     },
+    ...(useNewBorderRadii && {
+      [`${classDefault}:first-of-type`]: {
+        borderTopRightRadius: '0px !important',
+        borderBottomRightRadius: '0px !important'
+      }
+    }),
     [classPrimary]: {
       ...getPrimaryStyles(theme),
       ...(useNewShadows && {
@@ -20126,7 +21312,11 @@ function getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows) {
     },
     [`${classDefault}:not(:first-of-type)`]: {
       width: theme.general.heightSm,
-      padding: '3px !important'
+      padding: '3px !important',
+      ...(useNewBorderRadii && {
+        borderTopLeftRadius: '0px !important',
+        borderBottomLeftRadius: '0px !important'
+      })
     },
     ...getAnimationCss(theme.options.enableAnimation)
   };
@@ -20147,7 +21337,8 @@ const SplitButton = props => {
     classNamePrefix
   } = useDesignSystemTheme();
   const {
-    useNewShadows
+    useNewShadows,
+    useNewBorderRadii
   } = useDesignSystemSafexFlags();
   const {
     children,
@@ -20191,7 +21382,7 @@ const SplitButton = props => {
         ...dropdownButtonProps,
         overlay: deprecatedMenu,
         trigger: ['click'],
-        css: getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows),
+        css: getSplitButtonEmotionStyles(classNamePrefix, theme, useNewShadows, useNewBorderRadii),
         icon: jsx(ChevronDownIcon, {
           css: /*#__PURE__*/css({
             fontSize: theme.general.iconFontSize
@@ -20386,7 +21577,7 @@ const TableHeaderResizeHandle = /*#__PURE__*/forwardRef(function TableHeaderResi
   if (!isHeader) {
     throw new Error('`TableHeaderResizeHandle` must be used within a `TableRow` with `isHeader` set to true.');
   }
-  const [isPopoverOpen, setIsPopoverOpen] = useState(true);
+  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
   const dragStartPosRef = useRef(null);
   const initialEventRef = useRef(null);
   const initialRenderRef = useRef(true);
@@ -20440,7 +21631,8 @@ const TableHeaderResizeHandle = /*#__PURE__*/forwardRef(function TableHeaderResi
     onClick: handleClick,
     css: tableStyles.resizeHandleContainer,
     style: style,
-    role: "separator",
+    role: "button",
+    "aria-label": "Resize Column",
     children: jsx("div", {
       css: tableStyles.resizeHandle
     })
@@ -20510,18 +21702,22 @@ const TableHeader = /*#__PURE__*/forwardRef(function TableHeader(_ref2, ref) {
     onToggleSort,
     style,
     className,
-    resizable,
-    resizeHandler,
     isResizing = false,
     align = 'left',
     wrapContent = true,
-    hasAdjustableWidthHeader,
-    increaseWidthHandler,
-    decreaseWidthHandler,
+    column,
+    header,
+    setColumnSizing,
     componentId,
     analyticsEvents = [DesignSystemEventProviderAnalyticsEventTypes.OnValueChange],
+    'aria-label': ariaLabel,
     ...rest
   } = _ref2;
+  // Pulling props from the column and header props with deprecated fallbacks.
+  // Doing this to avoid breaking changes + have a cleaner mechanism for testing removal of deprecated props.
+  const resizable = (column === null || column === void 0 ? void 0 : column.getCanResize()) || rest.resizable || false;
+  const resizeHandler = (header === null || header === void 0 ? void 0 : header.getResizeHandler()) || rest.resizeHandler;
+  const supportsColumnPopover = column && header && setColumnSizing;
   const {
     size,
     grid
@@ -20575,11 +21771,35 @@ const TableHeader = /*#__PURE__*/forwardRef(function TableHeader(_ref2, ref) {
     bold: true,
     children: children
   }) : children;
-  const resizeHandle = resizable ? jsx(TableHeaderResizeHandle, {
+  const getColumnResizeHandler = useCallback(newSize => () => {
+    if (column && setColumnSizing) {
+      setColumnSizing(old => ({
+        ...old,
+        [column.id]: newSize
+      }));
+    }
+  }, [column, setColumnSizing]);
+  const increaseWidthHandler = useCallback(() => {
+    if (column && setColumnSizing) {
+      const currentSize = column.getSize();
+      getColumnResizeHandler(currentSize + 10)();
+    }
+  }, [column, setColumnSizing, getColumnResizeHandler]);
+  const decreaseWidthHandler = useCallback(() => {
+    if (column && setColumnSizing) {
+      const currentSize = column.getSize();
+      getColumnResizeHandler(currentSize - 10)();
+    }
+  }, [column, setColumnSizing, getColumnResizeHandler]);
+  const renderResizeHandle = resizable && resizeHandler ? jsx(TableHeaderResizeHandle, {
+    style: {
+      height: size === 'default' ? '20px' : '16px'
+    },
     resizeHandler: resizeHandler,
-    increaseWidthHandler: increaseWidthHandler,
-    decreaseWidthHandler: decreaseWidthHandler
+    increaseWidthHandler: supportsColumnPopover ? increaseWidthHandler : undefined,
+    decreaseWidthHandler: supportsColumnPopover ? decreaseWidthHandler : undefined
   }) : null;
+  const isSortButtonVisible = sortable && !isResizing;
   return jsxs("div", {
     ...rest,
     ref: ref
@@ -20596,7 +21816,9 @@ const TableHeader = /*#__PURE__*/forwardRef(function TableHeader(_ref2, ref) {
       textAlign: align,
       ...style
     },
-    children: [sortable && !isResizing ? jsxs("div", {
+    "aria-label": isSortButtonVisible ? undefined : ariaLabel,
+    ...eventContext.dataComponentProps,
+    children: [isSortButtonVisible ? jsxs("div", {
       css: [tableStyles.headerButtonTarget, process.env.NODE_ENV === "production" ? "" : ";label:TableHeader;"],
       role: "button",
       tabIndex: 0,
@@ -20607,6 +21829,7 @@ const TableHeader = /*#__PURE__*/forwardRef(function TableHeader(_ref2, ref) {
           return onToggleSort === null || onToggleSort === void 0 ? void 0 : onToggleSort(event);
         }
       },
+      "aria-label": isSortButtonVisible ? ariaLabel : undefined,
       children: [sortIconOnLeft ? jsx("span", {
         className: "table-header-icon-container",
         css: [tableStyles.sortHeaderIconOnLeft, process.env.NODE_ENV === "production" ? "" : ";label:TableHeader;"],
@@ -20616,7 +21839,7 @@ const TableHeader = /*#__PURE__*/forwardRef(function TableHeader(_ref2, ref) {
         css: [tableStyles.sortHeaderIconOnRight, process.env.NODE_ENV === "production" ? "" : ";label:TableHeader;"],
         children: sortIcon
       }) : null]
-    }) : content, resizeHandle]
+    }) : content, renderResizeHandle]
   });
 });
 
@@ -20645,6 +21868,9 @@ const TableRowSelectCell = /*#__PURE__*/forwardRef(function TableRowSelectCell(_
     analyticsEvents,
     ...rest
   } = _ref;
+  const {
+    theme
+  } = useDesignSystemTheme();
   const {
     isHeader
   } = useContext(TableRowContext);
@@ -20662,7 +21888,8 @@ const TableRowSelectCell = /*#__PURE__*/forwardRef(function TableRowSelectCell(_
     ref: ref,
     css: tableStyles.checkboxCell,
     style: {
-      ['--row-checkbox-opacity']: someRowsSelected ? 1 : 0
+      ['--row-checkbox-opacity']: someRowsSelected ? 1 : 0,
+      zIndex: theme.options.zIndexBase
     },
     role: isHeader ? 'columnheader' : 'cell'
     // TODO: Ideally we shouldn't need to specify this `className`, but it allows for row-hovering to reveal
@@ -20682,7 +21909,10 @@ const TableRowSelectCell = /*#__PURE__*/forwardRef(function TableRowSelectCell(_
 
 const TabsRootContext = /*#__PURE__*/React__default.createContext({
   activeValue: undefined,
-  componentId: 'design_system.tabs.default_component_id'
+  dataComponentProps: {
+    'data-component-id': 'design_system.tabs.default_component_id',
+    'data-component-type': DesignSystemEventProviderComponentTypes.Tabs
+  }
 });
 const TabsListContext = /*#__PURE__*/React__default.createContext({
   viewportRef: {
@@ -20721,7 +21951,7 @@ const Root = /*#__PURE__*/React__default.forwardRef((_ref, forwardedRef) => {
   return jsx(TabsRootContext.Provider, {
     value: {
       activeValue: isControlled ? value : uncontrolledActiveValue,
-      componentId
+      dataComponentProps: eventContext.dataComponentProps
     },
     children: jsx(RadixTabs.Root, {
       value: value,
@@ -20736,6 +21966,7 @@ const List = /*#__PURE__*/React__default.forwardRef((_ref2, forwardedRef) => {
   let {
     addButtonProps,
     scrollAreaViewportCss,
+    tabListCss,
     children,
     dangerouslyAppendEmotionCSS,
     shadowScrollStylesBackgroundColor,
@@ -20745,7 +21976,7 @@ const List = /*#__PURE__*/React__default.forwardRef((_ref2, forwardedRef) => {
   } = _ref2;
   const viewportRef = React__default.useRef(null);
   const {
-    componentId
+    dataComponentProps
   } = React__default.useContext(TabsRootContext);
   const css = useListStyles(shadowScrollStylesBackgroundColor, scrollbarHeight);
   React__default.useEffect(() => {
@@ -20766,9 +21997,10 @@ const List = /*#__PURE__*/React__default.forwardRef((_ref2, forwardedRef) => {
           css: [css['viewport'], scrollAreaViewportCss, process.env.NODE_ENV === "production" ? "" : ";label:List;"],
           ref: viewportRef,
           children: jsx(RadixTabs.List, {
-            css: css['list'],
+            css: [css['list'], tabListCss, process.env.NODE_ENV === "production" ? "" : ";label:List;"],
             ...props,
             ref: forwardedRef,
+            ...dataComponentProps,
             children: children
           })
         }), jsx(ScrollArea.Scrollbar, {
@@ -20786,7 +22018,7 @@ const List = /*#__PURE__*/React__default.forwardRef((_ref2, forwardedRef) => {
           "aria-label": "Add tab",
           css: css['addButton'],
           onClick: addButtonProps.onClick,
-          componentId: `${componentId}.add_tab`,
+          componentId: `${dataComponentProps['data-component-id']}.add_tab`,
           className: addButtonProps.className
         })
       })]
@@ -20805,8 +22037,9 @@ const Trigger = /*#__PURE__*/React__default.forwardRef((_ref3, forwardedRef) =>
   const mergedRef = useMergeRefs([forwardedRef, triggerRef]);
   const {
     activeValue,
-    componentId
+    dataComponentProps
   } = React__default.useContext(TabsRootContext);
+  const componentId = dataComponentProps['data-component-id'];
   const {
     viewportRef
   } = React__default.useContext(TabsListContext);
@@ -20897,7 +22130,10 @@ const Content = /*#__PURE__*/React__default.forwardRef((_ref4, forwardedRef) =>
   let {
     ...props
   } = _ref4;
-  const css = useContentStyles();
+  const {
+    theme
+  } = useDesignSystemTheme();
+  const css = useContentStyles(theme);
   return jsx(RadixTabs.Content, {
     css: css,
     ...props,
@@ -20938,7 +22174,7 @@ const useListStyles = (shadowScrollStylesBackgroundColor, scrollbarHeight) => {
       '&:hover': {
         background: theme.isDarkMode ? 'rgba(255, 255, 255, 0.3)' : 'rgba(17, 23, 28, 0.3)'
       },
-      borderRadius: theme.legacyBorders.borderRadiusMd,
+      borderRadius: theme.borders.borderRadiusSm,
       position: 'relative'
     },
     addButtonContainer: {
@@ -21014,9 +22250,10 @@ const useTriggerStyles = isClosable => {
     }
   };
 };
-const useContentStyles = () => {
+const useContentStyles = theme => {
   // This is needed so force mounted content is not displayed when the tab is inactive
   return {
+    color: theme.colors.textPrimary,
     '&[data-state="inactive"]': {
       display: 'none'
     }
@@ -21042,7 +22279,7 @@ const getStyles = (theme, size, onlyIcon, useNewShadows) => {
       boxShadow: theme.shadows.xs
     }),
     border: `1px solid ${theme.colors.actionDefaultBorderDefault}`,
-    borderRadius: theme.general.borderRadiusBase,
+    borderRadius: theme.borders.borderRadiusSm,
     backgroundColor: 'transparent',
     color: theme.colors.actionDefaultTextDefault,
     height: theme.general.heightSm,
@@ -21177,6 +22414,7 @@ const ToggleButton = /*#__PURE__*/forwardRef((_ref, ref) => {
     pressed: isPressed,
     onPressedChange: handleOnPressedChange,
     ref: ref,
+    ...eventContext.dataComponentProps,
     children: [jsx("span", {
       className: "togglebutton-icon-wrapper",
       style: {
@@ -21453,7 +22691,7 @@ function getTreeEmotionStyles(clsPrefix, theme, size) {
       backgroundColor: 'transparent',
       outlineWidth: 2,
       outlineOffset: 1,
-      outlineColor: theme.colors.primary,
+      outlineColor: theme.colors.actionDefaultBorderFocus,
       outlineStyle: 'solid'
     },
     [classCheckbox]: {
@@ -21559,5 +22797,5 @@ const Tree = /*#__PURE__*/forwardRef(function Tree(_ref, ref) {
   });
 });
 
-export { AccessibleContainer, Accordion, AccordionPanel, Alert, AlignCenterIcon, AlignLeftIcon, AlignRightIcon, AppIcon, ApplyDesignSystemContextOverrides, ApplyGlobalStyles, ArrowDownDotIcon, ArrowDownIcon, ArrowInIcon, ArrowLeftIcon, ArrowOverIcon, ArrowRightIcon, ArrowUpDotIcon, ArrowUpIcon, ArrowsUpDownIcon, AssistantAvatar, AssistantIcon, AtIcon, AutoComplete, Avatar, AvatarGroup, AzHorizontalIcon, AzVerticalIcon, BadgeCodeIcon, BadgeCodeOffIcon, BarChartIcon, BarGroupedIcon, BarStackedIcon, BarStackedPercentageIcon, BarsAscendingHorizontalIcon, BarsAscendingVerticalIcon, BarsDescendingHorizontalIcon, BarsDescendingVerticalIcon, BeakerIcon, BinaryIcon, BlockQuoteIcon, BoldIcon, BookIcon, BookmarkFillIcon, BookmarkIcon, BooksIcon, BracketsCurlyIcon, BracketsSquareIcon, BracketsXIcon, BranchIcon, Breadcrumb, BriefcaseFillIcon, BriefcaseIcon, BugIcon, Button, CalendarClockIcon, CalendarEventIcon, CalendarIcon, CalendarRangeIcon, Card, CaretDownSquareIcon, CaretUpSquareIcon, CatalogCloudIcon, CatalogGearIcon, CatalogHIcon, CatalogHomeIcon, CatalogIcon, CatalogOffIcon, CatalogSharedIcon, CellsSquareIcon, ChainIcon, ChartLineIcon, CheckCircleBadgeIcon, CheckCircleFillIcon, CheckCircleIcon, CheckIcon, CheckLineIcon, CheckSmallIcon, Checkbox, CheckboxIcon, ChecklistIcon, ChevronDoubleDownIcon, ChevronDoubleLeftIcon, ChevronDoubleRightIcon, ChevronDoubleUpIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleIcon, CircleOffIcon, CircleOutlineIcon, ClipboardIcon, ClockKeyIcon, CloseIcon, CloseSmallIcon, CloudDatabaseIcon, CloudDownloadIcon, CloudIcon, CloudKeyIcon, CloudModelIcon, CloudOffIcon, CloudUploadIcon, CodeIcon, Col, ColorFillIcon, ColumnIcon, ColumnsIcon, CommandIcon, CommandPaletteIcon, ConnectIcon, ContextMenu$1 as ContextMenu, CopyIcon, CreditCardIcon, CursorIcon, CursorPagination, CursorTypeIcon, CustomAppIcon, DBAssistantAvatar, DIcon, DU_BOIS_ENABLE_ANIMATION_CLASSNAME, DagIcon, DangerFillIcon, DangerIcon, DashIcon, DashboardIcon, DataIcon, DatabaseIcon, DecimalIcon, DesignSystemAntDConfigProvider, DesignSystemEventProviderAnalyticsEventTypes, DesignSystemEventProviderComponentTypes, DesignSystemEventSuppressInteractionProviderContext, DesignSystemEventSuppressInteractionTrueContextValue, DialogCombobox, DialogComboboxAddButton, DialogComboboxContent, DialogComboboxCountBadge, DialogComboboxCustomButtonTriggerWrapper, EmptyResults as DialogComboboxEmpty, DialogComboboxFooter, DialogComboboxHintRow, DialogComboboxOptionControlledList, DialogComboboxOptionList, DialogComboboxOptionListCheckboxItem, DialogComboboxOptionListSearch, DialogComboboxOptionListSelectItem, DialogComboboxSectionHeader, DialogComboboxSeparator, DialogComboboxTrigger, DotsCircleIcon, DownloadIcon, DragIcon, Drawer, Dropdown, DropdownMenu, DuboisDatePicker, Empty, ErdIcon, ExpandLessIcon, ExpandMoreIcon, FaceFrownIcon, FaceNeutralIcon, FaceSmileIcon, FileCodeIcon, FileDocumentIcon, FileIcon, FileImageIcon, FileLockIcon, FileModelIcon, FilterIcon, FlagPointerIcon, FloatIcon, FolderBranchFillIcon, FolderBranchIcon, FolderCloudFilledIcon, FolderCloudIcon, FolderFillIcon, FolderIcon, FontIcon, ForkIcon, FormUI, FullscreenExitIcon, FullscreenIcon, FunctionIcon, GearFillIcon, GearIcon, GenericSkeleton, GiftIcon, GitCommitIcon, GlobeIcon, GridDashIcon, GridIcon, H1Icon, H2Icon, H3Icon, Header$1 as Header, HistoryIcon, HomeIcon, HoverCard, Icon, ImageIcon, IndentDecreaseIcon, IndentIncreaseIcon, InfinityIcon, InfoBookIcon, InfoFillIcon, InfoIcon, InfoPopover, InfoTooltip, IngestionIcon, Input, ItalicIcon, KeyIcon, KeyboardIcon, LayerGraphIcon, LayerIcon, Layout, LeafIcon, LegacyDatePicker, LegacyForm, LegacyFormDubois, LegacyInfoTooltip, LegacyOptGroup, LegacyOption, LegacyPopover, LegacySelect, LegacySelectOptGroup, LegacySelectOption, LegacySkeleton, LegacyTabPane, LegacyTable, LegacyTabs, LegacyTooltip, LettersIcon, LettersNumbersIcon, LibrariesIcon, LightbulbIcon, LightningIcon, LinkIcon, LinkOffIcon, ListBorderIcon, ListClearIcon, ListIcon, LoadingIcon, LoadingState, LockFillIcon, LockIcon, LockShareIcon, LockUnlockedIcon, LoopIcon, MIcon, MailIcon, MeasureIcon, Menu, MenuIcon, MetricViewIcon, MinusCircleFillIcon, MinusCircleIcon, MinusSquareIcon, ModelsIcon, NavigationMenu, NoIcon, NotebookIcon, Notification, NotificationIcon, NotificationOffIcon, NumbersIcon, OfficeIcon, Overflow, OverflowIcon, PageBottomIcon, PageFirstIcon, PageLastIcon, PageTopIcon, PageWrapper, Pagination, PanelDockedIcon, PanelFloatingIcon, PaperclipIcon, ParagraphSkeleton, PauseIcon, PencilIcon, PencilSparkleIcon, PieChartIcon, PinCancelIcon, PinFillIcon, PinIcon, PipelineIcon, PlayCircleFillIcon, PlayCircleIcon, PlayIcon, PlugIcon, PlusCircleFillIcon, PlusCircleIcon, PlusIcon, PlusMinusSquareIcon, PlusSquareIcon, QueryEditorIcon, QueryIcon, QuestionMarkFillIcon, QuestionMarkIcon, RHFControlledComponents, ROW_GUTTER_SIZE, Radio, RadioIcon, ReaderModeIcon, RedoIcon, RefreshIcon, ReplyIcon, ResizeIcon, ResourceStatusIndicator, RestoreAntDDefaultClsPrefix, RobotIcon, RocketIcon, Row, RunningIcon, SaveClockIcon, SaveIcon, SchemaIcon, SchoolIcon, SearchDataIcon, SearchIcon, SegmentedControlButton, SegmentedControlGroup, Select, SelectContent, SelectOption, SelectOptionGroup, SelectTrigger, SendIcon, ShareIcon, ShieldCheckIcon, ShieldIcon, ShieldOffIcon, ShortcutIcon, SidebarAutoIcon, SidebarCollapseIcon, SidebarExpandIcon, SidebarIcon, SimpleSelect, SimpleSelectOption, SimpleSelectOptionGroup, SlashSquareIcon, Slider, SlidersIcon, SortAscendingIcon, SortDescendingIcon, SortUnsortedIcon, Space, Spacer, SparkleDoubleFillIcon, SparkleDoubleIcon, SparkleFillIcon, SparkleIcon, SparkleRectangleIcon, SpeechBubbleIcon, SpeechBubblePlusIcon, SpeechBubbleQuestionMarkIcon, SpeechBubbleStarIcon, Spinner, SplitButton, StarFillIcon, StarIcon, Steps, StopCircleFillIcon, StopCircleIcon, StopIcon, StorefrontIcon, StreamIcon, StrikeThroughIcon, Switch, SyncIcon, Table, TableCell, TableContext, TableFilterInput, TableFilterLayout, TableGlassesIcon, TableGlobeIcon, TableHeader, TableIcon, TableLightningIcon, TableModelIcon, TableOnlineViewIcon, TableRow, TableRowAction, TableRowActionHeader, TableRowContext, TableRowMenuContainer, TableRowSelectCell, TableSkeleton, TableSkeletonRows, TableStreamIcon, TableVectorIcon, TableViewIcon, Tabs, Tag, TagIcon, TargetIcon, TerminalIcon, TextBoxIcon, TextUnderlineIcon, ThumbsDownIcon, ThumbsUpIcon, TitleSkeleton, ToggleButton, Tooltip$1 as Tooltip, TrashIcon, Tree, TreeIcon, TypeaheadComboboxAddButton, TypeaheadComboboxCheckboxItem, TypeaheadComboboxFooter, TypeaheadComboboxInput, TypeaheadComboboxMenu, TypeaheadComboboxMenuItem, TypeaheadComboboxMultiSelectInput, TypeaheadComboboxMultiSelectStateChangeTypes, TypeaheadComboboxRoot, TypeaheadComboboxSectionHeader, TypeaheadComboboxSelectedItem, TypeaheadComboboxSeparator, TypeaheadComboboxStateChangeTypes, TypeaheadComboboxToggleButton, Typography, UnderlineIcon, UndoIcon, UploadIcon, UsbIcon, UserBadgeIcon, UserCircleIcon, UserGroupIcon, UserIcon, UserSparkleIcon, VisibleIcon, VisibleOffIcon, WarningFillIcon, WarningIcon, WorkflowCodeIcon, WorkflowsIcon, WorkspacesIcon, WrenchIcon, WrenchSparkleIcon, XCircleFillIcon, XCircleIcon, ZaHorizontalIcon, ZaVerticalIcon, ZoomInIcon, ZoomMarqueeSelection, ZoomOutIcon, __INTERNAL_DO_NOT_USE__FormItem, __INTERNAL_DO_NOT_USE__Group, __INTERNAL_DO_NOT_USE__HorizontalGroup, __INTERNAL_DO_NOT_USE__VerticalGroup, dialogComboboxLookAheadKeyDown, findClosestOptionSibling, findHighlightedOption, getAnimationCss, getComboboxOptionItemWrapperStyles, getComboboxOptionLabelStyles, getContentOptions, getDarkModePortalStyles, getDialogComboboxOptionLabelWidth, getGlobalStyles, getKeyboardNavigationFunctions, getLegacyTabEmotionStyles, getPaginationEmotionStyles, getRadioStyles, getShadowScrollStyles, getValidationStateColor, getWrapperStyle, highlightFirstNonDisabledOption, highlightOption, importantify, useComboboxState, useDesignSystemEventComponentCallbacks, useDesignSystemFlags, useDesignSystemSafexFlags, useDesignSystemTheme, useLegacyNotification, useModalContext, useMultipleSelectionState, useNotifyOnFirstView, useThemedStyles, useTypeaheadComboboxContext, visuallyHidden, withNotifications };
+export { AccessibleContainer, Accordion, AccordionPanel, Alert, AlignCenterIcon, AlignLeftIcon, AlignRightIcon, AppIcon, ApplyDesignSystemContextOverrides, ApplyGlobalStyles, ArrowDownDotIcon, ArrowDownIcon, ArrowInIcon, ArrowLeftIcon, ArrowOverIcon, ArrowRightIcon, ArrowUpDotIcon, ArrowUpIcon, ArrowsUpDownIcon, AssistantAvatar, AssistantIcon, AtIcon, AutoComplete, Avatar, AvatarGroup, AzHorizontalIcon, AzVerticalIcon, BadgeCodeIcon, BadgeCodeOffIcon, BarChartIcon, BarGroupedIcon, BarStackedIcon, BarStackedPercentageIcon, BarsAscendingHorizontalIcon, BarsAscendingVerticalIcon, BarsDescendingHorizontalIcon, BarsDescendingVerticalIcon, BeakerIcon, BinaryIcon, BlockQuoteIcon, BoldIcon, BookIcon, BookmarkFillIcon, BookmarkIcon, BooksIcon, BracketsCurlyIcon, BracketsSquareIcon, BracketsXIcon, BranchIcon, Breadcrumb, BriefcaseFillIcon, BriefcaseIcon, BugIcon, Button, CalendarClockIcon, CalendarEventIcon, CalendarIcon, CalendarRangeIcon, Card, CaretDownSquareIcon, CaretUpSquareIcon, CatalogCloudIcon, CatalogGearIcon, CatalogHIcon, CatalogHomeIcon, CatalogIcon, CatalogOffIcon, CatalogSharedIcon, CellsSquareIcon, ChainIcon, ChartLineIcon, CheckCircleBadgeIcon, CheckCircleFillIcon, CheckCircleIcon, CheckIcon, CheckLineIcon, CheckSmallIcon, Checkbox, CheckboxIcon, ChecklistIcon, ChevronDoubleDownIcon, ChevronDoubleLeftIcon, ChevronDoubleRightIcon, ChevronDoubleUpIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleIcon, CircleOffIcon, CircleOutlineIcon, ClipboardIcon, ClockKeyIcon, CloseIcon, CloseSmallIcon, CloudDatabaseIcon, CloudDownloadIcon, CloudIcon, CloudKeyIcon, CloudModelIcon, CloudOffIcon, CloudUploadIcon, CodeIcon, Col, ColorFillIcon, ColumnIcon, ColumnsIcon, CommandIcon, CommandPaletteIcon, ComponentFinderContext, ConnectIcon, ContextMenu$1 as ContextMenu, CopyIcon, CreditCardIcon, CursorIcon, CursorPagination, CursorTypeIcon, CustomAppIcon, DBAssistantAvatar, DIcon, DU_BOIS_ENABLE_ANIMATION_CLASSNAME, DagHorizontalIcon, DagIcon, DagVerticalIcon, DangerFillIcon, DangerIcon, DashIcon, DashboardIcon, DataIcon, DatabaseIcon, DecimalIcon, DesignSystemAntDConfigProvider, DesignSystemEventProviderAnalyticsEventTypes, DesignSystemEventProviderComponentSubTypeMap, DesignSystemEventProviderComponentTypes, DesignSystemEventSuppressInteractionProviderContext, DesignSystemEventSuppressInteractionTrueContextValue, DialogCombobox, DialogComboboxAddButton, DialogComboboxContent, DialogComboboxCountBadge, DialogComboboxCustomButtonTriggerWrapper, EmptyResults as DialogComboboxEmpty, DialogComboboxFooter, DialogComboboxHintRow, DialogComboboxOptionControlledList, DialogComboboxOptionList, DialogComboboxOptionListCheckboxItem, DialogComboboxOptionListSearch, DialogComboboxOptionListSelectItem, DialogComboboxSectionHeader, DialogComboboxSeparator, DialogComboboxTrigger, DotsCircleIcon, DownloadIcon, DragIcon, Drawer, Dropdown, DropdownMenu, DuboisDatePicker, Empty, ErdIcon, ExpandLessIcon, ExpandMoreIcon, FaceFrownIcon, FaceNeutralIcon, FaceSmileIcon, FileCodeIcon, FileDocumentIcon, FileIcon, FileImageIcon, FileLockIcon, FileModelIcon, FileNewIcon, FilePipelineIcon, FilterIcon, FlagPointerIcon, FloatIcon, FolderBranchFillIcon, FolderBranchIcon, FolderCloudFilledIcon, FolderCloudIcon, FolderCubeIcon, FolderFillIcon, FolderIcon, FolderNewIcon, FolderOpenIcon, FolderOpenPipelineIcon, FolderOutlinePipelineIcon, FolderSolidPipelineIcon, FontIcon, ForkIcon, FormUI, FullscreenExitIcon, FullscreenIcon, FunctionIcon, GearFillIcon, GearIcon, GenericSkeleton, GiftIcon, GitCommitIcon, GlobeIcon, GridDashIcon, GridIcon, H1Icon, H2Icon, H3Icon, Header$1 as Header, HistoryIcon, HomeIcon, HoverCard, Icon, ImageIcon, IndentDecreaseIcon, IndentIncreaseIcon, InfinityIcon, InfoBookIcon, InfoFillIcon, InfoIcon, InfoPopover, InfoTooltip, IngestionIcon, Input, ItalicIcon, KeyIcon, KeyboardIcon, LayerGraphIcon, LayerIcon, Layout, LeafIcon, LegacyDatePicker, LegacyForm, LegacyFormDubois, LegacyInfoTooltip, LegacyOptGroup, LegacyOption, LegacyPopover, LegacySelect, LegacySelectOptGroup, LegacySelectOption, LegacySkeleton, LegacyTabPane, LegacyTable, LegacyTabs, LegacyTooltip, LettersIcon, LettersNumbersIcon, LibrariesIcon, LightbulbIcon, LightningIcon, LinkIcon, LinkOffIcon, ListBorderIcon, ListClearIcon, ListIcon, LoadingIcon, LoadingState, LockFillIcon, LockIcon, LockShareIcon, LockUnlockedIcon, LoopIcon, MIcon, MailIcon, MapIcon, MeasureIcon, Menu, MenuIcon, MinusCircleFillIcon, MinusCircleIcon, MinusSquareIcon, Modal, ModelsIcon, NavigationMenu, NoIcon, NotebookIcon, NotebookPipelineIcon, Notification, NotificationIcon, NotificationOffIcon, NumbersIcon, OfficeIcon, Overflow, OverflowIcon, PageBottomIcon, PageFirstIcon, PageLastIcon, PageTopIcon, PageWrapper, Pagination, PanelDockedIcon, PanelFloatingIcon, PaperclipIcon, ParagraphSkeleton, PauseIcon, PencilIcon, PencilSparkleIcon, PieChartIcon, PinCancelIcon, PinFillIcon, PinIcon, PipelineCodeIcon, PipelineIcon, PlayCircleFillIcon, PlayCircleIcon, PlayIcon, PlugIcon, PlusCircleFillIcon, PlusCircleIcon, PlusIcon, PlusMinusSquareIcon, PlusSquareIcon, PreviewCard, QueryEditorIcon, QueryIcon, QuestionMarkFillIcon, QuestionMarkIcon, RHFControlledComponents, ROW_GUTTER_SIZE, Radio, RadioIcon, RadioTile, ReaderModeIcon, RedoIcon, RefreshIcon, ReplyIcon, ResizeIcon, ResourceStatusIndicator, RestoreAntDDefaultClsPrefix, RobotIcon, RocketIcon, Row, RunningIcon, SaveClockIcon, SaveIcon, SchemaIcon, SchoolIcon, SearchDataIcon, SearchIcon, SegmentedControlButton, SegmentedControlGroup, Select, SelectContent, SelectOption, SelectOptionGroup, SelectTrigger, SendIcon, ShareIcon, ShieldCheckIcon, ShieldIcon, ShieldOffIcon, ShortcutIcon, SidebarAutoIcon, SidebarCollapseIcon, SidebarExpandIcon, SidebarIcon, SimpleSelect, SimpleSelectOption, SimpleSelectOptionGroup, SlashSquareIcon, Slider, SlidersIcon, SortAscendingIcon, SortDescendingIcon, SortUnsortedIcon, Space, Spacer, SparkleDoubleFillIcon, SparkleDoubleIcon, SparkleFillIcon, SparkleIcon, SparkleRectangleIcon, SpeechBubbleIcon, SpeechBubblePlusIcon, SpeechBubbleQuestionMarkFillIcon, SpeechBubbleQuestionMarkIcon, SpeechBubbleStarIcon, Spinner, SplitButton, StarFillIcon, StarIcon, Steps, StopCircleFillIcon, StopCircleIcon, StopIcon, StorefrontIcon, StreamIcon, StrikeThroughIcon, Switch, SyncIcon, Table, TableCell, TableContext, TableFilterInput, TableFilterLayout, TableGlassesIcon, TableGlobeIcon, TableHeader, TableIcon, TableLightningIcon, TableMeasureIcon, TableModelIcon, TableRow, TableRowAction, TableRowActionHeader, TableRowContext, TableRowMenuContainer, TableRowSelectCell, TableSkeleton, TableSkeletonRows, TableStreamIcon, TableVectorIcon, TableViewIcon, Tabs, Tag, TagIcon, TargetIcon, TerminalIcon, TextBoxIcon, TextUnderlineIcon, ThumbsDownIcon, ThumbsUpIcon, TitleSkeleton, ToggleButton, Tooltip$1 as Tooltip, TrashIcon, Tree, TreeIcon, TypeaheadComboboxAddButton, TypeaheadComboboxCheckboxItem, TypeaheadComboboxFooter, TypeaheadComboboxInput, TypeaheadComboboxMenu, TypeaheadComboboxMenuItem, TypeaheadComboboxMultiSelectInput, TypeaheadComboboxMultiSelectStateChangeTypes, TypeaheadComboboxRoot, TypeaheadComboboxSectionHeader, TypeaheadComboboxSelectedItem, TypeaheadComboboxSeparator, TypeaheadComboboxStateChangeTypes, TypeaheadComboboxToggleButton, Typography, UnderlineIcon, UndoIcon, UploadIcon, UsbIcon, UserBadgeIcon, UserCircleIcon, UserGroupIcon, UserIcon, UserKeyIconIcon, UserSparkleIcon, VisibleIcon, VisibleOffIcon, WarningFillIcon, WarningIcon, WorkflowCodeIcon, WorkflowsIcon, WorkspacesIcon, WrenchIcon, WrenchSparkleIcon, XCircleFillIcon, XCircleIcon, ZaHorizontalIcon, ZaVerticalIcon, ZoomInIcon, ZoomMarqueeSelection, ZoomOutIcon, ZoomToFitIcon, __INTERNAL_DO_NOT_USE__FormItem, __INTERNAL_DO_NOT_USE__Group, __INTERNAL_DO_NOT_USE__HorizontalGroup, __INTERNAL_DO_NOT_USE__VerticalGroup, dialogComboboxLookAheadKeyDown, findClosestOptionSibling, findHighlightedOption, getAnimationCss, getComboboxOptionItemWrapperStyles, getComboboxOptionLabelStyles, getContentOptions, getDarkModePortalStyles, getDialogComboboxOptionLabelWidth, getGlobalStyles, getKeyboardNavigationFunctions, getLegacyTabEmotionStyles, getPaginationEmotionStyles, getRadioStyles, getShadowScrollStyles, getValidationStateColor, getWrapperStyle, highlightFirstNonDisabledOption, highlightOption, importantify, useComboboxState, useComponentFinderContext, useDesignSystemEventComponentCallbacks, useDesignSystemFlags, useDesignSystemSafexFlags, useDesignSystemTheme, useLegacyNotification, useModalContext, useMultipleSelectionState, useNotifyOnFirstView, useRadioGroupContext, useThemedStyles, useTypeaheadComboboxContext, visuallyHidden, withNotifications };
 //# sourceMappingURL=index.js.map