@innovaccer/design-system 4.30.0 → 4.30.2

package/css/dist/mds-scoped.css

@@ -349,7 +349,7 @@
     opacity: 0;
   }
 }
-@scope ([data-mds-root], body > .Overlay-wrapper:has([data-layer]), body > [data-test='DesignSystem-Popover'], body > [data-test='DesignSystem-Backdrop'], body > .Listbox-item--draggable) {
+@scope ([data-mds-root], body > .Overlay-wrapper:has([data-layer]), body > [data-test='DesignSystem-Popover'], body > [data-floating-ui-portal], body > [data-test='DesignSystem-Backdrop'], body > .Listbox-item--draggable) {
 /* Source: src/tokens/index.css */
 /**** Color Primitives ****/
 :scope {
@@ -1275,6 +1275,7 @@
 /* Label */
 .Label, :scope.Label {
   display: inline-flex;
+  position: relative;
 }
 .Label--small, :scope.Label--small {
   font-size: var(--font-size-s);
@@ -9602,6 +9603,7 @@
 
 .Select-trigger--disabled, :scope.Select-trigger--disabled {
   pointer-events: none;
+  color: var(--text-disabled);
 }
 
 .Select-trigger-control, :scope.Select-trigger-control {

package/css/scripts/portal-roots.cjs

@@ -34,6 +34,17 @@ const PORTAL_ROOT_SELECTORS = [
   'body > .Overlay-wrapper:has([data-layer])',
   /** Popover and everything built on it: Tooltip, Dropdown, Menu, DateRangePicker, … */
   "body > [data-test='DesignSystem-Popover']",
+  /**
+   * `PopperWrapper` now renders through `@floating-ui/react`'s `FloatingPortal`, which
+   * inserts its own `<div data-floating-ui-portal>` directly under `body` and nests the
+   * `data-test='DesignSystem-Popover'` element one level inside *that* — so the selector
+   * above no longer matches a direct child of `body` for any Popover-built component
+   * (Tooltip, Dropdown, Menu, Select, DateRangePicker, AvatarGroup, …). This selector
+   * targets the actual direct child instead. `data-floating-ui-portal` is set
+   * unconditionally by the library itself, so it doesn't depend on a component's
+   * (now overridable via a `dataTest` prop) `data-test` value.
+   */
+  'body > [data-floating-ui-portal]',
   /** Backdrop, including the one Modal/Sidesheet render. */
   "body > [data-test='DesignSystem-Backdrop']",
   /**

package/css/src/components/label.module.css

@@ -1,6 +1,7 @@
 /* Label */
 .Label {
   display: inline-flex;
+  position: relative;
 }
 .Label--small {
   font-size: var(--font-size-s);

package/css/src/components/select.module.css

@@ -32,6 +32,7 @@
 
 .Select-trigger--disabled {
   pointer-events: none;
+  color: var(--text-disabled);
 }
 
 .Select-trigger-control {