@tedi-design-system/react 19.1.0-rc.2 → 19.1.0-rc.3

package/src/tedi/components/overlays/dropdown/dropdown.es.js

@@ -1,121 +1,129 @@
-import { jsxs as U, jsx as f } from "react/jsx-runtime";
-import { useFloatingNodeId as $, useFloating as H, useInteractions as q, useClick as z, useRole as G, useDismiss as J, useListNavigation as K, FloatingPortal as Q, FloatingFocusManager as V } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
-import X from "../../../../../external/classnames/index.es.js";
+import { jsxs as A, jsx as d } from "react/jsx-runtime";
+import { useFloatingNodeId as U, useFloating as q, useInteractions as z, useClick as G, useRole as J, useDismiss as K, useListNavigation as Q, FloatingPortal as V, FloatingFocusManager as X } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import Y from "../../../../../external/classnames/index.es.js";
 import e from "react";
-import x from "./dropdown.module.scss.es.js";
-import { DropdownContent as Y } from "./dropdown-content/dropdown-content.es.js";
-import { DropdownContext as Z } from "./dropdown-context.es.js";
-import { resolveDropdownWidth as ee } from "./dropdown-helpers.es.js";
-import { DropdownItem as te } from "./dropdown-item/dropdown-item.es.js";
-import { DropdownSeparator as oe } from "./dropdown-separator/dropdown-separator.es.js";
-import { DropdownTrigger as ne } from "./dropdown-trigger/dropdown-trigger.es.js";
-import { useBreakpointProps as re } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import { useLabels as ie } from "../../../providers/label-provider/use-labels.es.js";
-import { autoUpdate as se } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
-import { offset as ae, flip as le, shift as de } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
-const ce = 4, l = (p) => {
-  var I;
-  const { getCurrentBreakpointProps: C } = re(p.defaultServerBreakpoint), {
-    children: F,
-    modal: g = !1,
+import v from "./dropdown.module.scss.es.js";
+import { DropdownContent as Z } from "./dropdown-content/dropdown-content.es.js";
+import { DropdownContext as ee } from "./dropdown-context.es.js";
+import { resolveDropdownWidth as te } from "./dropdown-helpers.es.js";
+import { DropdownItem as oe } from "./dropdown-item/dropdown-item.es.js";
+import { DropdownSeparator as ne } from "./dropdown-separator/dropdown-separator.es.js";
+import { DropdownTrigger as re } from "./dropdown-trigger/dropdown-trigger.es.js";
+import { useBreakpointProps as ie } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useLabels as se } from "../../../providers/label-provider/use-labels.es.js";
+import { autoUpdate as ae } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
+import { offset as le, flip as de, shift as ce } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
+const me = 4, c = (h) => {
+  var O;
+  const { getCurrentBreakpointProps: F } = ie(h.defaultServerBreakpoint), {
+    children: N,
+    modal: w = !1,
     divided: R = !1,
-    width: N = "auto",
-    variant: d = "default",
-    open: c,
+    width: y = "auto",
+    variant: m = "default",
+    open: p,
     defaultOpen: P = !1,
     onOpenChange: s,
     defaultActiveIndex: o,
     placement: u = "bottom-start",
+    maxHeight: a,
     className: S
-  } = C(p), { getLabel: k } = ie(), y = $(), v = e.useRef([]), [a, m] = e.useState(o ?? null), [w, B] = e.useState(null), [b, W] = e.useState(P), t = c ?? b;
+  } = F(h), { getLabel: b } = se(), k = U(), x = e.useRef([]), [l, f] = e.useState(o ?? null), [g, B] = e.useState(null), [_, W] = e.useState(P), t = p ?? _;
   e.useEffect(() => {
-    t || m(o ?? null);
+    t || f(o ?? null);
   }, [t, o]);
-  const h = e.useCallback(
+  const D = e.useCallback(
     (i) => {
-      c === void 0 && W(i), s == null || s(i);
+      p === void 0 && W(i), s == null || s(i);
     },
-    [c, s]
-  ), E = H({
-    nodeId: y,
+    [p, s]
+  ), E = q({
+    nodeId: k,
     open: t,
     placement: u,
-    onOpenChange: h,
-    middleware: [ae(ce), le(), de()],
-    whileElementsMounted: se
-  }), { context: n, refs: r, x: L, y: M, strategy: T } = E, D = q([
-    z(n),
-    G(n, { role: "menu" }),
-    J(n),
-    K(n, {
-      listRef: v,
-      activeIndex: a,
-      onNavigate: m,
+    onOpenChange: D,
+    middleware: [le(me), de(), ce()],
+    whileElementsMounted: ae
+  }), { context: n, refs: r, x: H, y: L, strategy: M } = E, I = z([
+    G(n),
+    J(n, { role: "menu" }),
+    K(n),
+    Q(n, {
+      listRef: x,
+      activeIndex: l,
+      onNavigate: f,
       loop: !0,
       selectedIndex: o ?? null,
       focusItemOnOpen: o !== null ? !0 : "auto"
     })
-  ]), _ = {
+  ]), T = {
     open: t,
-    setOpen: h,
+    setOpen: D,
     refs: r,
-    listItemsRef: v,
-    activeIndex: a,
-    setActiveIndex: m,
+    listItemsRef: x,
+    activeIndex: l,
+    setActiveIndex: f,
     placement: u,
-    content: w,
+    content: g,
     setContent: B,
     divided: R,
-    variant: d,
-    ...D
-  }, j = (I = r.reference.current) == null ? void 0 : I.getBoundingClientRect().width, A = e.useMemo(() => {
+    variant: m,
+    ...I
+  }, $ = (O = r.reference.current) == null ? void 0 : O.getBoundingClientRect().width, j = e.useMemo(() => {
     const i = r.reference.current;
     if (!i) return;
-    const O = i.offsetParent;
-    if (O)
-      return O.getBoundingClientRect().width;
+    const C = i.offsetParent;
+    if (C)
+      return C.getBoundingClientRect().width;
   }, [r.reference.current]);
-  return /* @__PURE__ */ U(Z.Provider, { value: _, children: [
-    F,
-    /* @__PURE__ */ f(Q, { children: t && /* @__PURE__ */ f(
-      V,
+  return /* @__PURE__ */ A(ee.Provider, { value: T, children: [
+    N,
+    /* @__PURE__ */ d(V, { children: t && /* @__PURE__ */ d(
+      X,
       {
         context: n,
-        modal: g,
-        visuallyHiddenDismiss: g ? k("close") : !1,
-        children: /* @__PURE__ */ f(
+        modal: w,
+        visuallyHiddenDismiss: w ? b("close") : !1,
+        children: /* @__PURE__ */ d(
           "div",
           {
-            ...D.getFloatingProps({
+            ...I.getFloatingProps({
               ref: r.setFloating,
-              className: X(
-                x["tedi-dropdown"],
-                { [x[`tedi-dropdown--${d}`]]: d === "tree" },
+              className: Y(
+                v["tedi-dropdown"],
+                { [v[`tedi-dropdown--${m}`]]: m === "tree" },
                 S
               ),
               style: {
-                position: T,
-                left: L ?? 0,
-                top: M ?? 0,
-                width: ee(N, j, A)
+                position: M,
+                left: H ?? 0,
+                top: L ?? 0,
+                width: te(y, $, j)
               },
               role: "menu",
               "aria-orientation": "vertical",
-              "aria-activedescendant": a !== null ? `dropdown-item-${a}` : void 0
+              "aria-activedescendant": l !== null ? `dropdown-item-${l}` : void 0
             }),
             "data-placement": u,
             "data-state": t ? "open" : "closed",
-            children: w
+            children: a !== void 0 ? /* @__PURE__ */ d(
+              "div",
+              {
+                className: v["tedi-dropdown__scroll"],
+                style: { maxHeight: typeof a == "number" ? `${a}px` : a },
+                children: g
+              }
+            ) : g
           }
         )
       }
     ) })
   ] });
 };
-l.Trigger = ne;
-l.Content = Y;
-l.Item = te;
-l.Separator = oe;
+c.Trigger = re;
+c.Content = Z;
+c.Item = oe;
+c.Separator = ne;
 export {
-  l as Dropdown
+  c as Dropdown
 };

package/src/tedi/components/overlays/dropdown/dropdown.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-dropdown":"tedi-dropdown-0246d37c","tedi-dropdown--tree":"tedi-dropdown--tree-c13f70ee","tedi-dropdown__item":"tedi-dropdown__item-fa7ee478"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-dropdown":"tedi-dropdown-0246d37c","tedi-dropdown__scroll":"tedi-dropdown__scroll-c7d1c849","tedi-dropdown--tree":"tedi-dropdown--tree-c13f70ee","tedi-dropdown__item":"tedi-dropdown__item-fa7ee478"};exports.default=e;

package/src/tedi/components/overlays/dropdown/dropdown.module.scss.es.js

@@ -1,5 +1,6 @@
 const d = {
   "tedi-dropdown": "tedi-dropdown-0246d37c",
+  "tedi-dropdown__scroll": "tedi-dropdown__scroll-c7d1c849",
   "tedi-dropdown--tree": "tedi-dropdown--tree-c13f70ee",
   "tedi-dropdown__item": "tedi-dropdown__item-fa7ee478"
 };