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

package/src/tedi/components/form/time-field/time-field.es.js

@@ -1,67 +1,68 @@
-import { jsxs as q, jsx as i, Fragment as me } from "react/jsx-runtime";
-import { useFloating as ue, useClick as pe, useDismiss as ge, useRole as he, useInteractions as ke, FloatingPortal as ve, FloatingFocusManager as be } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
-import y from "../../../../../external/classnames/index.es.js";
-import Ce, { useState as N, useEffect as z } from "react";
-import { TextField as A } from "../textfield/textfield.es.js";
-import { TimePicker as xe } from "../time-picker/time-picker.es.js";
+import { jsxs as G, jsx as i, Fragment as xe } from "react/jsx-runtime";
+import { useFloating as ve, useClick as Ce, useDismiss as _e, useRole as Fe, useInteractions as Pe, FloatingPortal as Ie, FloatingFocusManager as Te } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import O from "../../../../../external/classnames/index.es.js";
+import we, { useState as M, useEffect as H } from "react";
+import { TextField as J } from "../textfield/textfield.es.js";
+import { TimePicker as Be } from "../time-picker/time-picker.es.js";
 import d from "./time-field.module.scss.es.js";
-import { normalizeTime as _e, TIMEPICKER_OFFSET as Fe } from "./time-field-helpers.es.js";
-import { TimePickerModal as Pe } from "./time-picker-modal/time-picker-modal.es.js";
-import { useBreakpointProps as Te } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import we, { isBreakpointBelow as Ie } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { Dropdown as b } from "../../overlays/dropdown/dropdown.es.js";
-import { autoUpdate as ye } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
-import { offset as Ne, flip as Be, shift as Oe } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
-const Me = (C) => {
-  const { getCurrentBreakpointProps: K } = Te(C.defaultServerBreakpoint), {
-    id: G,
-    label: H,
-    value: c,
-    defaultValue: J,
-    onChange: x,
-    readOnly: h = !1,
-    disabled: s = !1,
-    required: L,
-    placeholder: Q,
+import { normalizeTime as ye, TIMEPICKER_OFFSET as Ne } from "./time-field-helpers.es.js";
+import { TimePickerModal as Oe } from "./time-picker-modal/time-picker-modal.es.js";
+import { useBreakpointProps as Me } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useLabels as Re } from "../../../providers/label-provider/use-labels.es.js";
+import Ve, { isBreakpointBelow as Ee } from "../../../helpers/hooks/use-breakpoint.es.js";
+import { Dropdown as v } from "../../overlays/dropdown/dropdown.es.js";
+import { autoUpdate as Ue } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
+import { offset as De, flip as Se, shift as je } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
+const Le = (C) => {
+  const { getCurrentBreakpointProps: Q } = Me(C.defaultServerBreakpoint), { getLabel: W } = Re(), {
+    id: X,
+    label: Y,
+    value: m,
+    defaultValue: Z,
+    onChange: _,
+    readOnly: k = !1,
+    disabled: l = !1,
+    required: $,
+    placeholder: ee,
     inputProps: t,
-    stepMinutes: B = 1,
-    className: O,
-    availableTimes: a,
-    modal: _ = !1,
-    modalProps: W
+    stepMinutes: R = 1,
+    className: V,
+    availableTimes: s,
+    modal: F = !1,
+    modalProps: te
   } = C, {
-    useNativePicker: X = !1,
-    timePickerTrigger: M = "button",
-    showPicker: o = !0,
-    availableTimesVariant: F = "grid-buttons",
-    clearable: Y = !0
-  } = K(C), R = c !== void 0, [Z, V] = N(c ?? J ?? ""), f = R ? c : Z, [P, T] = N(!1), [$, E] = N(!1), m = M === "input", l = X, ee = we(), u = !l && o && !h && !s && (_ === !0 || typeof _ == "string" && Ie(ee, _)), te = ue({
-    open: P,
-    onOpenChange: T,
-    placement: m ? "bottom-start" : "bottom-end",
-    middleware: [Ne(Fe), Be(), Oe()],
-    whileElementsMounted: ye
-  }), { refs: w, context: k, x: ie, y: oe, strategy: ne } = te, re = pe(k), le = ge(k), se = he(k, { role: "listbox" }), U = o && m && !h && !s && !l && !u, D = ke([...U ? [re] : [], le, se]), p = (e) => {
-    const n = e.trim();
-    R || V(n), x == null || x(n);
-  }, ae = (e) => {
-    var v;
-    const n = e.target.value ?? "";
-    (v = t == null ? void 0 : t.onBlur) == null || v.call(t, e);
-    const r = _e(n);
-    r !== null && r !== n && p(r);
+    useNativePicker: ie = !1,
+    timePickerTrigger: P = "button",
+    showPicker: n = !0,
+    availableTimesVariant: I = "grid-buttons",
+    clearable: oe = !0
+  } = Q(C), E = m !== void 0, [ne, U] = M(m ?? Z ?? ""), f = E ? m : ne, [T, w] = M(!1), [D, S] = M(!1), u = P === "input", o = ie, re = Ve(), c = !o && n && !k && !l && (F === !0 || typeof F == "string" && Ee(re, F)), ae = ve({
+    open: T,
+    onOpenChange: w,
+    placement: u ? "bottom-start" : "bottom-end",
+    middleware: [De(Ne), Se(), je()],
+    whileElementsMounted: Ue
+  }), { refs: B, context: b, x: le, y: se, strategy: ce } = ae, de = Ce(b), me = _e(b), ue = Fe(b, { role: "listbox" }), j = n && u && !k && !l && !o && !c, L = Pe([...j ? [de] : [], me, ue]), p = (e) => {
+    const r = e.trim();
+    E || U(r), _ == null || _(r);
+  }, fe = (e) => {
+    var x;
+    const r = e.target.value ?? "";
+    (x = t == null ? void 0 : t.onBlur) == null || x.call(t, e);
+    const a = ye(r);
+    a !== null && a !== r && p(a);
   };
-  z(() => {
-    c !== void 0 && V(c);
-  }, [c]);
-  const g = Ce.useRef(null);
-  z(() => {
+  H(() => {
+    m !== void 0 && U(m);
+  }, [m]);
+  const g = we.useRef(null);
+  H(() => {
     var e;
-    (e = g.current) != null && e.inner && w.setReference(g.current.inner);
-  }, [w]);
-  const de = () => {
-    var n;
-    const e = (n = g.current) == null ? void 0 : n.input;
+    (e = g.current) != null && e.inner && B.setReference(g.current.inner);
+  }, [B]);
+  const pe = () => {
+    var r;
+    const e = (r = g.current) == null ? void 0 : r.input;
     if (e) {
       if (typeof e.showPicker == "function") {
         e.showPicker();
@@ -69,108 +70,109 @@ const Me = (C) => {
       }
       e.focus();
     }
-  }, ce = () => T((e) => !e), S = () => E(!0), fe = () => {
-    !o || s || (l ? de() : u ? S() : M === "button" && ce());
-  }, j = u && m && !h ? () => {
-    S();
-  } : void 0, I = {
+  }, ge = () => w((e) => !e), q = () => S(!0), he = () => {
+    !n || l || (o ? pe() : c ? q() : P === "button" && ge());
+  }, z = c && u && !k ? () => {
+    q();
+  } : void 0, y = !o && n && !l && I === "dropdown" && !!(s != null && s.length), A = c ? "dialog" : "listbox", K = c ? D : T, ke = n && !o && !y && (P === "button" || c), be = n && u && !o && !y, N = {
     ...t,
-    id: G,
-    label: H,
+    id: X,
+    label: Y,
     value: f,
-    placeholder: Q,
-    readOnly: h || !l && m,
-    disabled: s || (t == null ? void 0 : t.disabled),
-    icon: o ? "schedule" : { name: "schedule", color: "inherit" },
-    isClearable: Y,
-    required: L,
-    onIconClick: o ? fe : void 0,
+    placeholder: ee,
+    readOnly: k || !o && u,
+    disabled: l || (t == null ? void 0 : t.disabled),
+    icon: n ? "schedule" : { name: "schedule", color: "inherit" },
+    isClearable: oe,
+    required: $,
+    onIconClick: n ? he : void 0,
+    iconButtonProps: {
+      "aria-label": W("time-field.open-picker"),
+      ...ke && { "aria-haspopup": A, "aria-expanded": K },
+      ...t == null ? void 0 : t.iconButtonProps
+    },
     onChange: p,
-    onBlur: ae,
-    className: y(
+    onBlur: fe,
+    className: O(
       d["tedi-time-field__textfield"],
-      { [d["tedi-time-field__icon--disabled"]]: !o || s },
-      { [d["tedi-time-field__textfield--disabled"]]: s || (t == null ? void 0 : t.disabled) },
-      { [d["tedi-time-field--native"]]: l }
+      { [d["tedi-time-field__icon--disabled"]]: !n || l },
+      { [d["tedi-time-field__textfield--disabled"]]: l || (t == null ? void 0 : t.disabled) },
+      { [d["tedi-time-field--native"]]: o }
     ),
     input: {
       ...t == null ? void 0 : t.input,
-      ...l && { type: "time" },
-      ...j && { onClick: j }
+      ...o && { type: "time" },
+      ...z && { onClick: z },
+      ...be && { role: "combobox", "aria-haspopup": A, "aria-expanded": K }
     }
   };
-  if (!l && o && !s && F === "dropdown" && !!(a != null && a.length)) {
-    const e = a.indexOf(f), n = e >= 0 ? e : 0;
-    return /* @__PURE__ */ q(b, { width: "trigger", defaultActiveIndex: n, children: [
-      /* @__PURE__ */ i(b.Trigger, { children: /* @__PURE__ */ i(
+  if (y) {
+    const e = s.indexOf(f), r = e >= 0 ? e : 0;
+    return /* @__PURE__ */ G(v, { width: "trigger", defaultActiveIndex: r, children: [
+      /* @__PURE__ */ i(v.Trigger, { children: /* @__PURE__ */ i(
         "div",
         {
-          className: y(d["tedi-time-field__container"], O, {
-            [d["tedi-time-field__container--native"]]: l
+          role: "combobox",
+          className: O(d["tedi-time-field__container"], V, {
+            [d["tedi-time-field__container--native"]]: o
           }),
           children: /* @__PURE__ */ i(
-            A,
+            J,
             {
               ref: g,
-              ...I,
+              ...N,
               input: {
-                ...I.input,
-                ...!m && {
-                  onClick: (r) => r.stopPropagation()
+                ...N.input,
+                ...!u && {
+                  onClick: (a) => a.stopPropagation()
                 }
               }
             }
           )
         }
       ) }),
-      /* @__PURE__ */ i(b.Content, { children: a.map((r, v) => /* @__PURE__ */ i(b.Item, { index: v, active: r === f, onClick: () => p(r), children: r }, r)) })
+      /* @__PURE__ */ i(v.Content, { children: s.map((a, x) => /* @__PURE__ */ i(v.Item, { index: x, active: a === f, onClick: () => p(a), children: a }, a)) })
     ] });
   }
-  return /* @__PURE__ */ q(me, { children: [
-    /* @__PURE__ */ i(
-      "div",
-      {
-        className: y(d["tedi-time-field__container"], O),
-        ...U ? D.getReferenceProps() : {},
-        "aria-haspopup": o ? "listbox" : void 0,
-        tabIndex: -1,
-        children: /* @__PURE__ */ i(A, { ref: g, "aria-expanded": o ? P : void 0, ...I })
-      }
-    ),
-    u && /* @__PURE__ */ i(
-      Pe,
+  const h = {
+    ...j ? L.getReferenceProps() : {}
+  };
+  return delete h.role, delete h["aria-haspopup"], delete h["aria-expanded"], delete h["aria-controls"], /* @__PURE__ */ G(xe, { children: [
+    /* @__PURE__ */ i("div", { className: O(d["tedi-time-field__container"], V), ...h, tabIndex: -1, children: /* @__PURE__ */ i(J, { ref: g, ...N }) }),
+    c && /* @__PURE__ */ i(
+      Oe,
       {
-        open: $,
-        onOpenChange: E,
+        open: D,
+        onOpenChange: S,
         value: f,
         onConfirm: p,
-        stepMinutes: B,
-        availableTimes: a,
-        gridVariant: F === "grid-radio" ? "radio" : "button",
-        modalProps: W
+        stepMinutes: R,
+        availableTimes: s,
+        gridVariant: I === "grid-radio" ? "radio" : "button",
+        modalProps: te
       }
     ),
-    !l && o && !s && !u && /* @__PURE__ */ i(ve, { children: P && /* @__PURE__ */ i(be, { context: k, modal: !1, initialFocus: -1, children: /* @__PURE__ */ i(
+    !o && n && !l && !c && /* @__PURE__ */ i(Ie, { children: T && /* @__PURE__ */ i(Te, { context: b, modal: !1, initialFocus: -1, children: /* @__PURE__ */ i(
       "div",
       {
-        ref: w.setFloating,
-        ...D.getFloatingProps({
+        ref: B.setFloating,
+        ...L.getFloatingProps({
           style: {
-            position: ne,
-            top: oe ?? 0,
-            left: ie ?? 0
+            position: ce,
+            top: se ?? 0,
+            left: le ?? 0
           }
         }),
         children: /* @__PURE__ */ i(
-          xe,
+          Be,
           {
             value: f,
-            stepMinutes: B,
-            availableTimes: a,
+            stepMinutes: R,
+            availableTimes: s,
             onChange: (e) => {
-              p(e), a && T(!1);
+              p(e), s && w(!1);
             },
-            gridVariant: F === "grid-radio" ? "radio" : "button",
+            gridVariant: I === "grid-radio" ? "radio" : "button",
             className: d["tedi-time-field__picker-wrapper"]
           }
         )
@@ -178,7 +180,7 @@ const Me = (C) => {
     ) }) })
   ] });
 };
-Me.displayName = "TimeField";
+Le.displayName = "TimeField";
 export {
-  Me as TimeField
+  Le as TimeField
 };

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

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

package/src/tedi/components/overlays/dropdown/dropdown.d.ts

@@ -34,6 +34,14 @@ type DropdownBreakpointProps = {
      * @default 'default'
      */
     variant?: 'default' | 'tree';
+    /**
+     * Restricts the height of the dropdown's scrollable body. When the content is taller,
+     * the body scrolls vertically while any sticky regions (e.g. a Filter search / clear) stay pinned.
+     * - `number` – fixed max height in pixels
+     * - `string` – any valid CSS length (e.g. `'20rem'`, `'50vh'`)
+     * @default undefined (no restriction)
+     */
+    maxHeight?: number | string;
 };
 export interface DropdownProps extends BreakpointSupport<DropdownBreakpointProps> {
     /**

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"
 };