@databricks/design-system 2.0.6 → 2.0.8

package/dist/index.mitigated.css

@@ -15740,6 +15740,7 @@ span.du-bois-light-typography-ellipsis-single-line {
   --db-color-border-danger: #fbd0d8;
   --db-color-border-warning: #f8d4a5;
   --db-color-code-background: rgba(82, 82, 82, 0.08);
+  --db-color-composer-background: #ffffff;
   --db-color-overlay-overlay: rgba(0, 0, 0, 0.26);
   --db-color-progress-fill: #cbcbcb;
   --db-color-progress-fill-primary: #4299e0;
@@ -16041,6 +16042,18 @@ span.du-bois-light-typography-ellipsis-single-line {
   --db-shape-pill: 999px;
 }
 
+:where(:root), :where(.du-bois-light) {
+  /* Shape */
+  /* Mirrors the ShapeTokens host-override var used by Card; falls back to the theme radius. */
+  --db-card-border-radius: var(--info-container-border-radius, 8px);
+
+  /* Color */
+  --db-card-surface: var(--db-surface-base);
+  --db-card-text: var(--db-text-base);
+  --db-card-border: var(--db-border-base);
+  --db-card-border-hover: var(--db-border-strong);
+}
+
 :where(:root), :where(.du-bois-light) {
   /* Shape */
   /* Mirrors the ShapeTokens host-override var used by list items; falls back to the theme radius. */
@@ -16117,6 +16130,28 @@ span.du-bois-light-typography-ellipsis-single-line {
   --db-selection-toggle-transition-duration: 120ms;
 }
 
+:where(:root), :where(.du-bois-light) {
+  /* Shape */
+  --db-avatar-border-radius: var(--db-radius-sm);
+
+  /* Density */
+  --db-avatar-group-gap: var(--db-space-1);
+  --db-avatar-group-border-width: 1px;
+
+  /* Color */
+  /* No v2 token holds the secondary icon glyph yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-avatar-icon: var(--db-color-text-secondary);
+  /* No v2 token holds the default avatar surface yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-avatar-surface: var(--db-color-tag-background-default);
+  /* No v2 token holds the group divider border yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-avatar-group-border-color: var(--db-color-background-primary);
+}
+
+:where(:root), :where(.du-bois-light) {
+  /* Color */
+  /* No v2 token holds the initials/icon glyph on a colored avatar yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-avatar-text: #ffffff;
+}
 
 
 /* Component-tier tokens for the native <Button>, grouped by area (density, shape, typography, color).
@@ -16414,10 +16449,11 @@ span.du-bois-light-typography-ellipsis-single-line {
   color: var(--db-btn-text-active) !important;
 }
 .db-btn-icon-only:enabled:not(.db-btn-primary, .db-btn-tertiary, .db-btn-link, .db-btn-danger, :hover, :active)
-  > .anticon {
+  > .anticon, .db-btn-icon-only:enabled:not(.db-btn-primary, .db-btn-tertiary, .db-btn-link, .db-btn-danger, :hover, :active)
+  > .db-icon {
   color: var(--db-btn-icon-glyph);
 }
-.db-btn-icon-only.db-btn-danger:not(:hover, :active) > .anticon {
+.db-btn-icon-only.db-btn-danger:not(:hover, :active) > .anticon, .db-btn-icon-only.db-btn-danger:not(:hover, :active) > .db-icon {
   color: var(--db-btn-text);
 }
 .db-btn-icon-only.db-btn-danger:hover:not(:disabled, .db-btn-loading) {
@@ -16447,7 +16483,8 @@ span.du-bois-light-typography-ellipsis-single-line {
 .db-btn-icon-only:disabled:hover {
   background-color: transparent !important;
 }
-.db-btn:disabled > .anticon {
+.db-btn:disabled > .anticon,
+.db-btn:disabled > .db-icon {
   color: inherit !important;
 }
 
@@ -16456,17 +16493,23 @@ span.du-bois-light-typography-ellipsis-single-line {
  * so `> .anticon` targets only a real icon glyph — a non-glyph `icon` (e.g. a Spinner) keeps its own
  * sizing — and out-specifies AntD's runtime-injected global `.anticon` rule. */
 .db-btn > .anticon,
+.db-btn > .db-icon,
 .db-btn-end-icon,
-.db-btn-end-icon > .anticon {
+.db-btn-end-icon > .anticon,
+.db-btn-end-icon > .db-icon {
   display: inline-flex;
   align-items: center;
   font-size: var(--db-btn-icon-size) !important;
   line-height: 0;
 }
-.db-btn-small > .anticon .anticon {
+.db-btn-small > .anticon .anticon,
+.db-btn-small > .anticon .db-icon,
+.db-btn-small > .db-icon .anticon,
+.db-btn-small > .db-icon .db-icon {
   line-height: 0;
 }
-.db-btn > .db-btn-content > .anticon {
+.db-btn > .db-btn-content > .anticon,
+.db-btn > .db-btn-content > .db-icon {
   display: inline-flex;
   align-items: center;
   line-height: 0;
@@ -16475,7 +16518,8 @@ span.du-bois-light-typography-ellipsis-single-line {
   display: inline-flex;
   align-items: center;
 }
-.db-btn > .anticon + .db-btn-content {
+.db-btn > .anticon + .db-btn-content,
+.db-btn > .db-icon + .db-btn-content {
   margin-inline-start: var(--db-btn-gap) !important;
 }
 .db-btn-end-icon {
@@ -16484,7 +16528,7 @@ span.du-bois-light-typography-ellipsis-single-line {
 .db-btn-small .db-btn-end-icon {
   margin-inline-start: var(--db-btn-end-icon-gap-small) !important;
 }
-.db-btn-default:not(.db-btn-danger, [href], :hover, :active, :disabled) > .anticon {
+.db-btn-default:not(.db-btn-danger, [href], :hover, :active, :disabled) > .anticon, .db-btn-default:not(.db-btn-danger, [href], :hover, :active, :disabled) > .db-icon {
   color: var(--db-btn-icon-glyph);
 }
 .db-btn-default[href]:not(.db-btn-danger, :hover, :active, :disabled) .db-btn-end-icon {
@@ -16493,7 +16537,10 @@ span.du-bois-light-typography-ellipsis-single-line {
 .db-btn-default:not([href], .db-btn-danger, :hover, :active, :disabled)
   > .db-btn-content
   > .db-btn-end-icon
-  > .anticon {
+  > .anticon, .db-btn-default:not([href], .db-btn-danger, :hover, :active, :disabled)
+  > .db-btn-content
+  > .db-btn-end-icon
+  > .db-icon {
   color: var(--db-btn-icon-glyph);
 }
 
@@ -16857,6 +16904,17 @@ span.du-bois-light-typography-ellipsis-single-line {
 }
 
 
+:where(:root), :where(.du-bois-light) {
+  /* Color */
+  --db-empty-text: var(--db-text-subtle);
+  --db-empty-image-color: var(--db-text-disabled);
+
+  /* Density */
+  --db-empty-image-size: calc(var(--db-size-8) * 2);
+  --db-empty-image-spacing: var(--db-space-4);
+  --db-empty-description-spacing: var(--db-space-4);
+  --db-empty-max-width: 600px;
+}
 
 
 
@@ -16920,7 +16978,17 @@ span.du-bois-light-typography-ellipsis-single-line {
   color: var(--db-icon-color-success);
 }
 
-.db-icon-ai svg * {
+.db-icon-ai svg path,
+.db-icon-ai svg rect,
+.db-icon-ai svg circle,
+.db-icon-ai svg ellipse,
+.db-icon-ai svg line,
+.db-icon-ai svg polygon,
+.db-icon-ai svg polyline,
+.db-icon-ai svg text,
+.db-icon-ai svg tspan,
+.db-icon-ai svg textPath,
+.db-icon-ai svg use {
   fill: var(--db-icon-gradient);
 }
 
@@ -16966,6 +17034,21 @@ span.du-bois-light-typography-ellipsis-single-line {
 }
 
 
+:where(:root), :where(.du-bois-light) {
+  /* Shape */
+  --db-listbox-border-radius: var(--db-list-item-border-radius);
+  --db-listbox-focus-ring-width: var(--db-focus-ring-width);
+
+  /* Color */
+  --db-listbox-surface: var(--db-list-surface);
+  --db-listbox-empty-text: var(--db-text-subtle);
+  --db-listbox-focus-ring-color: var(--db-focus-ring-color);
+
+  /* Density */
+  --db-listbox-spacing: var(--db-space-2);
+  --db-listbox-empty-spacing-horizontal: var(--db-space-3);
+  --db-listbox-empty-spacing-vertical: calc(var(--db-space-2) * 0.75);
+}
 
 
 :where(:root), :where(.du-bois-light) {
@@ -16992,6 +17075,35 @@ span.du-bois-light-typography-ellipsis-single-line {
   --db-navigation-menu-focus-ring-width: var(--db-focus-ring-width);
 }
 
+:where(:root), :where(.du-bois-light) {
+  /* Shape */
+  --db-notification-border-radius: var(--db-popup-border-radius);
+
+  /* Density */
+  --db-notification-padding: var(--db-space-3);
+  --db-notification-column-gap: var(--db-space-1);
+  --db-notification-description-gap: var(--db-space-1);
+  --db-notification-close-offset: calc(var(--db-space-1) * 1.5);
+  --db-notification-close-size: var(--db-size-5);
+  --db-notification-viewport-padding: var(--db-space-3);
+  --db-notification-viewport-gap: var(--db-space-3);
+  --db-notification-viewport-margin: var(--db-space-6);
+  --db-notification-viewport-width: 440px;
+
+  /* Color */
+  --db-notification-surface: var(--db-popup-surface);
+  --db-notification-border: var(--db-popup-border);
+  --db-notification-text: var(--db-popup-text);
+  --db-notification-icon: var(--db-text-subtle);
+  --db-notification-icon-success: var(--db-positive-text);
+  --db-notification-icon-warning: var(--db-caution-text);
+  --db-notification-icon-error: var(--db-negative-text);
+}
+
+:where(:root), :where(.du-bois-light) {
+  /* Elevation */
+  --db-notification-shadow: var(--db-elevation-med);
+}
 
 :where(:root), :where(.du-bois-light) {
   /* Color */
@@ -17032,6 +17144,44 @@ span.du-bois-light-typography-ellipsis-single-line {
   --db-popover-shadow: var(--db-popup-elevation);
 }
 
+:where(:root), :where(.du-bois-light) {
+  /* Shape */
+  --db-preview-card-border-radius: var(--db-card-border-radius);
+  --db-preview-card-image-border-radius: var(--info-container-border-radius, 4px);
+  --db-preview-card-border-width: 1px;
+
+  /* Density */
+  --db-preview-card-padding: var(--db-space-4);
+  --db-preview-card-padding-large: var(--db-space-6);
+  --db-preview-card-gap: var(--db-space-2);
+  --db-preview-card-gap-large: var(--db-space-4);
+  --db-preview-card-action-spacing: var(--db-space-4);
+
+  /* Color */
+  --db-preview-card-text: var(--db-text-subtle);
+  --db-preview-card-title-text: var(--db-card-text);
+  --db-preview-card-border: var(--db-card-border);
+  /* No v2 token holds the active/focus border yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-preview-card-border-hover: var(--db-color-action-default-border-hover);
+  /* No v2 token holds the focus outline ring yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-preview-card-border-focus: var(--db-color-action-default-border-focus);
+  /* No v2 token holds the active surface tint yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-preview-card-surface-active: var(--db-color-action-tertiary-background-press);
+  --db-preview-card-surface-disabled: var(--db-surface-disabled);
+  /* No v2 token holds the disabled border yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-preview-card-border-disabled: var(--db-color-action-disabled-border);
+  --db-preview-card-text-disabled: var(--db-text-disabled);
+
+  /* Typography */
+  --db-preview-card-title-font-weight: var(--db-font-weight-semibold);
+}
+
+:where(:root), :where(.du-bois-light) {
+  /* Elevation */
+  --db-preview-card-shadow: var(--db-elevation-low);
+  /* No v2 elevation token holds the hover/focus shadow yet. TODO(FEINF-6505): adopt a v2 token when one lands. */
+  --db-preview-card-shadow-hover: 0px 3px 6px 0px rgba(0, 0, 0, 0.05);
+}
 
 /* Declared under the theme classes too (not just :root) so the var() chain re-resolves inside a
  * `.du-bois-dark` subtree instead of freezing at the light values. */
@@ -17532,12 +17682,17 @@ span.du-bois-light-typography-ellipsis-single-line {
   margin-inline-end: var(--db-switch-label-spacing);
 }
 
-.db-switch:has(input:disabled) {
+.db-switch:has(.db-switch-input:disabled) {
   cursor: not-allowed;
 }
 
-/* The track. `appearance: none` strips the native checkbox rendering so the input itself can be styled. */
-.db-switch input {
+/* The track. `appearance: none` strips the native checkbox rendering so the input itself can be styled.
+ * Scoped via the `.db-switch-input` class, never a bare `input`: `.db-switch .db-switch-input` is
+ * specificity (0,2,0), which out-ranks a host app's `input[type='checkbox'] { width: auto }` reset
+ * (e.g. Bootstrap, loaded in webapp). A bare `.db-switch input` (0,1,1) merely ties that reset and, losing
+ * on load order, has its `inline-size` overridden to `auto` — collapsing the track to zero width and
+ * leaving only the floating thumb. Mirrors NativeCheckbox's `.db-checkbox-input`. */
+.db-switch .db-switch-input {
   appearance: none;
   position: relative;
   flex-shrink: 0;
@@ -17556,7 +17711,7 @@ span.du-bois-light-typography-ellipsis-single-line {
 
 /* The thumb. A pseudo-element keeps the input the switch's only element, so nothing can overlay it
  * and intercept clicks. Offset left by the border width to sit flush with the track's outer edge. */
-.db-switch input::before {
+.db-switch .db-switch-input::before {
   content: '';
   position: absolute;
   top: 50%;
@@ -17573,32 +17728,32 @@ span.du-bois-light-typography-ellipsis-single-line {
 }
 
 /* `<label for>` propagates `:hover` to the input, so scope hover/press to the control, not `input:hover`. */
-.db-switch:hover input:not(:disabled):not(:checked) {
+.db-switch:hover .db-switch-input:not(:disabled):not(:checked) {
   background-color: var(--db-switch-surface-hover);
   border-color: var(--db-switch-border-hover);
 }
 
-.db-switch:active input:not(:disabled):not(:checked) {
+.db-switch:active .db-switch-input:not(:disabled):not(:checked) {
   background-color: var(--db-switch-surface-active);
   border-color: var(--db-switch-border-active);
 }
 
-.db-switch input:checked {
+.db-switch .db-switch-input:checked {
   background-color: var(--db-switch-surface-checked);
   border-color: var(--db-switch-border-checked);
 }
 
-.db-switch:hover input:checked:not(:disabled) {
+.db-switch:hover .db-switch-input:checked:not(:disabled) {
   background-color: var(--db-switch-surface-checked-hover);
   border-color: var(--db-switch-border-checked-hover);
 }
 
-.db-switch:active input:checked:not(:disabled) {
+.db-switch:active .db-switch-input:checked:not(:disabled) {
   background-color: var(--db-switch-surface-checked-active);
   border-color: var(--db-switch-border-checked-active);
 }
 
-.db-switch input:checked::before {
+.db-switch .db-switch-input:checked::before {
   transform: translateY(-50%) translateX(calc(var(--db-switch-track-width) - var(--db-switch-thumb-size)));
 }
 
@@ -17606,31 +17761,31 @@ span.du-bois-light-typography-ellipsis-single-line {
  * the ring sits flush when off and gains a 1px offset when checked.
  * TODO: width/offset are hardcoded 1px to preserve the AntD look; adopt the system 2px focus ring
  * (var(--db-focus-ring-width)) in a separate change. */
-.db-switch input:focus-visible {
+.db-switch .db-switch-input:focus-visible {
   border-color: var(--db-switch-border-focus);
   outline: 1px solid var(--db-focus-ring-color);
   outline-offset: 0;
 }
 
-.db-switch input:checked:focus-visible {
+.db-switch .db-switch-input:checked:focus-visible {
   outline-offset: 1px;
 }
 
-.db-switch input:disabled {
+.db-switch .db-switch-input:disabled {
   cursor: not-allowed;
   background-color: var(--db-switch-surface-disabled);
   border-color: var(--db-switch-border-disabled);
 }
 
 /* Disabled + on: more specific than the plain disabled rule, so it wins regardless of source order. */
-.db-switch input:checked:disabled {
+.db-switch .db-switch-input:checked:disabled {
   background-color: var(--db-switch-surface-checked-disabled);
   border-color: var(--db-switch-surface-checked-disabled);
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .db-switch input,
-  .db-switch input::before {
+  .db-switch .db-switch-input,
+  .db-switch .db-switch-input::before {
     transition: none;
   }
 }
@@ -17656,8 +17811,8 @@ span.du-bois-light-typography-ellipsis-single-line {
 }
 
 /* Target the <Label>'s class, not a bare `label` — that would also match the .db-switch root <label>. */
-.db-switch-wrapper:has(input:disabled) .du-bois-light-label,
-.db-switch-wrapper:has(input:disabled) .du-bois-dark-label {
+.db-switch-wrapper:has(.db-switch-input:disabled) .du-bois-light-label,
+.db-switch-wrapper:has(.db-switch-input:disabled) .du-bois-dark-label {
   color: var(--db-switch-text-disabled);
 }
 
@@ -17784,17 +17939,20 @@ span.du-bois-light-typography-ellipsis-single-line {
 
 
   :where(.du-bois-light-btn-icon-only) > :where(.anticon),
-  :where(.du-bois-light-btn-icon-only) > :where(.du-bois-light-btn-loading-icon) {
+  :where(.du-bois-light-btn-icon-only) > :where(.du-bois-light-btn-loading-icon),
+  :where(.du-bois-light-btn-icon-only) > :where(.db-icon) {
     font-size: 15px;
   }
 
   .du-bois-light-btn-icon-only:where(.du-bois-light-btn-lg) > .anticon,
-  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-lg) > .du-bois-light-btn-loading-icon {
+  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-lg) > .du-bois-light-btn-loading-icon,
+  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-lg) > .db-icon {
     font-size: 20px;
   }
 
   .du-bois-light-btn-icon-only:where(.du-bois-light-btn-sm) > .anticon,
-  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-sm) > .du-bois-light-btn-loading-icon {
+  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-sm) > .du-bois-light-btn-loading-icon,
+  .du-bois-light-btn-icon-only:where(.du-bois-light-btn-sm) > .db-icon {
     font-size: 13px;
   }
 
@@ -17821,7 +17979,8 @@ span.du-bois-light-typography-ellipsis-single-line {
 
 
   .du-bois-light-btn:where([disabled]) > .anticon,
-  .du-bois-light-btn:where([disabled]) > .du-bois-light-btn-loading-icon {
+  .du-bois-light-btn:where([disabled]) > .du-bois-light-btn-loading-icon,
+  .du-bois-light-btn:where([disabled]) > .db-icon {
     pointer-events: none;
   }
 
@@ -17859,13 +18018,15 @@ span.du-bois-light-typography-ellipsis-single-line {
 
 
   :where(.du-bois-light-select-multiple) .du-bois-light-select-selection-item-remove > .anticon,
-  :where(.du-bois-light-select-multiple) .du-bois-light-select-selection-item-remove > .du-bois-light-select-selection-item-remove-icon {
+  :where(.du-bois-light-select-multiple) .du-bois-light-select-selection-item-remove > .du-bois-light-select-selection-item-remove-icon,
+  :where(.du-bois-light-select-multiple) .du-bois-light-select-selection-item-remove > .db-icon {
     line-height: 1;
   }
 
 
   :where(.du-bois-light-select-arrow) > .anticon,
-  :where(.du-bois-light-select-arrow) > .du-bois-light-select-arrow-icon {
+  :where(.du-bois-light-select-arrow) > .du-bois-light-select-arrow-icon,
+  :where(.du-bois-light-select-arrow) > .db-icon {
     line-height: 1;
   }
 
@@ -17896,12 +18057,14 @@ span.du-bois-light-typography-ellipsis-single-line {
   }
 
 
-  :where(.du-bois-light-picker-suffix) > .anticon {
+  :where(.du-bois-light-picker-suffix) > .anticon,
+  :where(.du-bois-light-picker-suffix) > .db-icon {
     vertical-align: top;
   }
 
 
-  :where(.du-bois-light-picker-clear) > .anticon {
+  :where(.du-bois-light-picker-clear) > .anticon,
+  :where(.du-bois-light-picker-clear) > .db-icon {
     vertical-align: top;
   }
 
@@ -17982,7 +18145,7 @@ span.du-bois-light-typography-ellipsis-single-line {
   }
 
 
-  .du-bois-light-menu-item:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content, .du-bois-light-menu-submenu-title:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content {
+  .du-bois-light-menu-item:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content, .du-bois-light-menu-submenu-title:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content, .du-bois-light-menu-item:has(> .du-bois-light-menu-item-icon, > .db-icon) > .du-bois-light-menu-title-content, .du-bois-light-menu-submenu-title:has(> .du-bois-light-menu-item-icon, > .db-icon) > .du-bois-light-menu-title-content {
     margin-left: 10px;
     opacity: 1;
     transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
@@ -17996,12 +18159,13 @@ span.du-bois-light-typography-ellipsis-single-line {
     color: #fff;
   }
 
-  .du-bois-light-menu-dark .du-bois-light-menu-item-selected:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content {
+  .du-bois-light-menu-dark .du-bois-light-menu-item-selected:has(> .du-bois-light-menu-item-icon, > .anticon) > .du-bois-light-menu-title-content, .du-bois-light-menu-dark .du-bois-light-menu-item-selected:has(> .du-bois-light-menu-item-icon, > .db-icon) > .du-bois-light-menu-title-content {
     color: #fff;
   }
 
 
-  .du-bois-light-breadcrumb-link > .anticon:not(:last-child) {
+  .du-bois-light-breadcrumb-link > .anticon:not(:last-child),
+  .du-bois-light-breadcrumb-link > .db-icon:not(:last-child) {
     margin-inline-end: 4px;
   }
 
@@ -18032,7 +18196,8 @@ span.du-bois-light-typography-ellipsis-single-line {
   }
 
 
-  .du-bois-light-btn > .anticon {
+  .du-bois-light-btn > .anticon,
+  .du-bois-light-btn > .db-icon {
     display: inline-block;
   }
 
@@ -18047,14 +18212,17 @@ span.du-bois-light-typography-ellipsis-single-line {
   }
 
 
-  :where(.du-bois-light-tag) > .anticon:first-child {
+  :where(.du-bois-light-tag) > .anticon:first-child,
+  :where(.du-bois-light-tag) > .db-icon:first-child {
     margin-right: 7px;
   }
-  :where(.du-bois-light-tag):has(> .anticon:first-child) > .anticon:not(:first-child) {
+  :where(.du-bois-light-tag):has(> .anticon:first-child) > .anticon:not(:first-child),
+  :where(.du-bois-light-tag):has(> .db-icon:first-child) > .db-icon:not(:first-child) {
     margin-left: 7px;
   }
 
 
-  .du-bois-light-btn > .anticon:not(:first-child) {
+  .du-bois-light-btn > .anticon:not(:first-child),
+  .du-bois-light-btn > .db-icon:not(:first-child) {
     margin-left: 8px;
   }

package/dist/patterns.js

@@ -1,4 +1,4 @@
-export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, d as WizardStepNavigationProvider, u as useWizardCurrentStep, e as useWizardStepNavigation } from './WizardStepContentWrapper-6YTjeEaA.js';
+export { D as DocumentationSidebar, F as FIXED_VERTICAL_STEPPER_WIDTH, M as MAX_VERTICAL_WIZARD_CONTENT_WIDTH, W as Wizard, a as WizardControlled, b as WizardModal, c as WizardStepContentWrapper, d as WizardStepNavigationProvider, u as useWizardCurrentStep, e as useWizardStepNavigation } from './WizardStepContentWrapper-DfErft8z.js';
 import '@emotion/react/jsx-runtime';
 import 'lodash/isUndefined';
 import 'react';

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

@@ -1,10 +1,27 @@
-import type { AlertProps as AntDAlertProps } from "antd";
 import type { ButtonProps } from "../Button";
 import { DesignSystemEventProviderAnalyticsEventTypes } from "../DesignSystemEventProvider";
 import type { AnalyticsEventProps, DangerouslySetAntdProps, HTMLDataAttributes } from "../types";
-export type AlertType = NonNullable<AntDAlertProps["type"]>;
-export interface AlertProps extends Omit<AntDAlertProps, "closeText" | "showIcon" | "type" | "icon">, HTMLDataAttributes, DangerouslySetAntdProps<Partial<Pick<AntDAlertProps, "showIcon" | "icon" | "message" | "description" | "type">>>, AnalyticsEventProps<DesignSystemEventProviderAnalyticsEventTypes.OnView> {
+export type AlertType = "success" | "info" | "warning" | "error";
+export interface AlertProps extends HTMLDataAttributes, DangerouslySetAntdProps<{
+	showIcon?: boolean;
+	icon?: React.ReactNode;
+	message?: React.ReactNode;
+	description?: React.ReactNode;
+	type?: AlertType;
+}>, AnalyticsEventProps<DesignSystemEventProviderAnalyticsEventTypes.OnView> {
 	type: AlertType;
+	message: React.ReactNode;
+	description?: React.ReactNode;
+	closable?: boolean;
+	onClose?: React.MouseEventHandler<HTMLButtonElement>;
+	afterClose?: () => void;
+	role?: string;
+	style?: React.CSSProperties;
+	className?: string;
+	prefixCls?: string;
+	onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+	onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+	onClick?: React.MouseEventHandler<HTMLDivElement>;
 	closeIconLabel?: string;
 	/**
 	* @deprecated Use CEP-governed banners instead. go/banner/create go/getabanner go/banner
@@ -13,7 +30,7 @@ export interface AlertProps extends Omit<AntDAlertProps, "closeText" | "showIcon
 	/**
 	* @deprecated Please use `actions` instead.
 	*/
-	action?: AntDAlertProps["action"];
+	action?: React.ReactNode;
 	/** Array of button props to render as footer actions. All buttons will be rendered as small size. */
 	actions?: Omit<ButtonProps, "size" | "type">[];
 	/** Force actions to be rendered beneath the description. */

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

@@ -5,6 +5,7 @@ import type { WithLoadingState } from "../LoadingState/LoadingState";
 import type { AnalyticsEventPropsWithStartInteraction, HTMLDataAttributes } from "../types";
 export { SMALL_BUTTON_HEIGHT, getButtonEmotionStyles, getMemoizedButtonEmotionStyles } from "./AntDButtonInternal";
 export type ButtonSize = "middle" | "small";
+export type ButtonForceMode = "native" | "legacy-antd" | "flag";
 export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "shape" | "size">, HTMLDataAttributes, Omit<WithLoadingState, "loading">, AnalyticsEventPropsWithStartInteraction<DesignSystemEventProviderAnalyticsEventTypes.OnClick | DesignSystemEventProviderAnalyticsEventTypes.OnView> {
 	type?: "primary" | "link" | "tertiary";
 	size?: ButtonSize;
@@ -12,6 +13,6 @@ export interface ButtonProps extends Omit<AntDButtonProps, "type" | "ghost" | "s
 	dangerouslySetForceIconStyles?: boolean;
 	dangerouslyUseFocusPseudoClass?: boolean;
 	dangerouslyAppendWrapperCss?: React.CSSProperties;
-	useNativeButtonOverride?: boolean;
+	forceMode?: ButtonForceMode;
 }
 export declare const Button: ForwardRefExoticComponent<PropsWithoutRef<ButtonProps> & RefAttributes<HTMLButtonElement>>;

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

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

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

@@ -385,6 +385,7 @@ export { default as SidebarOpenIcon } from "./SidebarOpenIcon";
 export { default as SidebarSyncIcon } from "./SidebarSyncIcon";
 export { default as SlashSquareIcon } from "./SlashSquareIcon";
 export { default as SlidersIcon } from "./SlidersIcon";
+export { default as SlidesIcon } from "./SlidesIcon";
 export { default as SnippetIcon } from "./SnippetIcon";
 export { default as SortAscendingIcon } from "./SortAscendingIcon";
 export { default as SortCustomHorizontalIcon } from "./SortCustomHorizontalIcon";

package/dist-types/design-system/TypeaheadCombobox/TypeaheadComboboxControls.d.ts

@@ -1,8 +1,6 @@
 import type { UseComboboxGetToggleButtonPropsOptions } from "downshift";
 import { type DownshiftToggleButtonProps } from "./TypeaheadComboboxToggleButton";
 import type { ButtonSize } from "../Button";
-/** Height of the non-inline controls block, for callers that position it themselves. */
-export declare const TYPEAHEAD_COMBOBOX_CONTROLS_HEIGHT = 16;
 export interface TypeaheadComboboxControlsProps {
 	getDownshiftToggleButtonProps: (options?: UseComboboxGetToggleButtonPropsOptions) => DownshiftToggleButtonProps;
 	showClearSelectionButton?: boolean;

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

@@ -35,7 +35,6 @@ export * from "./LegacyPopover";
 export * from "./LegacySelect";
 export * from "./LegacySkeleton";
 export * from "./LegacyTable";
-export * from "./LegacyTooltip";
 export * from "./Listbox";
 export * from "./LoadingState";
 export * from "./Menu";

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

@@ -9,9 +9,10 @@ export type SAFEXValueType = boolean | number;
 *
 * @param flag The name of the flag to check
 * @param defaultValue The default value to return if the flag is not set
+* @param testDefault The default to use in Jest or UiTestServer tests
 * @returns
 */
-export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValue: T) => T;
+export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValue: T, testDefault?: T) => T;
 /**
 * Reads a server-side feature flag value. Delegates to `window.__debug__serverSideSafe`
 * which is set by `@databricks/web-shared` and includes full flag resolution with
@@ -21,6 +22,7 @@ export declare const safex: <T extends SAFEXValueType>(flag: string, defaultValu
 *
 * @param flag The name of the flag to check
 * @param defaultValue The default value to return if the flag is not set
+* @param testDefault The default to use in Jest or UiTestServer tests
 * @returns
 */
-export declare const serverSideSafe: <T extends SAFEXValueType>(flag: string, defaultValue: T) => T;
+export declare const serverSideSafe: <T extends SAFEXValueType>(flag: string, defaultValue: T, testDefault?: T) => T;

package/dist-types/theme/_generated/ValidSemanticColors.d.ts

@@ -63,6 +63,7 @@ export declare enum ValidSemanticColors {
 	BorderDanger = "borderDanger",
 	BorderWarning = "borderWarning",
 	CodeBackground = "codeBackground",
+	ComposerBackground = "composerBackground",
 	IconTrending = "iconTrending",
 	OverlayOverlay = "overlayOverlay",
 	ProgressFill = "progressFill",

package/dist-types/theme/generalVariables.d.ts

@@ -1,6 +1,5 @@
 declare const antdGeneralVariables: {
 	classnamePrefix: string;
-	iconfontCssPrefix: string;
 	borderRadiusBase: number;
 	borderWidth: number;
 	heightSm: number;