@cwellt_software/cwellt-reactjs-lib 1.4.8 → 1.4.10

package/dist/index.es.js

@@ -1621,48 +1621,6 @@ const CwModalHover = ({ children, hovereable, onFirstOpened, ...dialogProps }) =
                 }, children: children })] }));
 };
 
-class CwDialogManager {
-    static openDialogs = new Map();
-    static OpenDialog(id, props) {
-        if (!CwDialogManager.openDialogs.has(id)) {
-            const container = document.createElement("div");
-            document.body.appendChild(container);
-            const root = createRoot(container);
-            root.render(jsx(CwDialog, { ...props }));
-            CwDialogManager.openDialogs.set(id, { props, container });
-        }
-    }
-    static CloseDialog(id) {
-        const dialog = CwDialogManager.openDialogs.get(id);
-        if (dialog) {
-            const root = createRoot(dialog.container);
-            root.unmount();
-            dialog.container.remove();
-            CwDialogManager.openDialogs.delete(id);
-        }
-    }
-    static CloseAllDialogs() {
-        CwDialogManager.openDialogs.forEach((_dialog, id) => {
-            CwDialogManager.CloseDialog(id);
-        });
-    }
-    static CloseLastDialog() {
-        const lastDialogId = Array.from(CwDialogManager.openDialogs.keys()).pop();
-        if (lastDialogId) {
-            CwDialogManager.CloseDialog(lastDialogId);
-        }
-    }
-    static CloseFirstDialog() {
-        const firstDialogId = Array.from(CwDialogManager.openDialogs.keys())[0];
-        if (firstDialogId) {
-            CwDialogManager.CloseDialog(firstDialogId);
-        }
-    }
-    static GetOpenDialogCount() {
-        return CwDialogManager.openDialogs.size;
-    }
-}
-
 /**
  * General purpose aligner flex container, useful for column or row view.
  * @remarks
@@ -1818,14 +1776,16 @@ function CwOption(props) {
  * </CwSelect>
  */
 function CwSelect(props) {
-    const { alignProps, labelProps, buttonProps, iconProps, placeholder, feedback, children, style, className, ...selectProps } = props;
+    const { alignProps, labelProps, buttonProps, iconProps, placeholder, feedback, handleChange, children, style, className, ...selectProps } = props;
     const feedbackMessages = feedback
         ? Array.isArray(feedback) ? feedback : [feedback]
         : [];
     const flexDirection = alignProps?.flexDirection ?? "row";
     const dataDirection = { 'data-direction': flexDirection };
     const { backgroundColor, color: textColor, ...wrapperStyle } = style ?? {};
-    return (jsxs("div", { className: `cw-select${className ? ` ${className}` : ''}`, ...dataDirection, style: wrapperStyle, children: [jsxs(CwAlign, { ...alignProps, itemProp: selectProps.required === true ? "required" : "", children: [labelProps && (jsxs(CwLabel, { ...labelProps, children: [iconProps && jsx(CwIcon, { ...iconProps }), labelProps.text] })), jsxs("div", { className: "cw-flex-row cw-gap-small cw-flex-grow", children: [jsxs("select", { ...selectProps, style: backgroundColor ? { backgroundColor, color: textColor } : undefined, children: [placeholder && jsx(CwOption, { value: "", children: placeholder }), children] }), buttonProps && jsx(CwButton, { ...buttonProps })] })] }), feedbackMessages.map((feedbackItem, index) => (jsx("p", { className: "cw-input-info", "data-color": feedbackItem.type, children: feedbackItem.message }, index)))] }));
+    return (jsxs("div", { className: `cw-select${className ? ` ${className}` : ''}`, ...dataDirection, style: wrapperStyle, children: [jsxs(CwAlign, { ...alignProps, itemProp: selectProps.required === true ? "required" : "", children: [labelProps && (jsxs(CwLabel, { ...labelProps, children: [iconProps && jsx(CwIcon, { ...iconProps }), labelProps.text] })), jsxs("div", { className: "cw-flex-row cw-gap-small cw-flex-grow", children: [jsxs("select", { ...selectProps, style: backgroundColor ? { backgroundColor, color: textColor } : undefined, onChange: handleChange
+                                    ? (e) => { handleChange(e.currentTarget.value); selectProps.onChange?.(e); }
+                                    : selectProps.onChange, children: [placeholder && jsx(CwOption, { value: "", children: placeholder }), children] }), buttonProps && jsx(CwButton, { ...buttonProps })] })] }), feedbackMessages.map((feedbackItem, index) => (jsx("p", { className: "cw-input-info", "data-color": feedbackItem.type, children: feedbackItem.message }, index)))] }));
 }
 
 function CwCardList({ items, renderCard, pageSize = 10, layout = 'grid', defaultCardWidth = 320, cardGap = 16, isLoading = false, emptyState, sortOptions = [], defaultSortKey, keyExtractor, ...htmlProps }) {
@@ -3522,237 +3482,6 @@ function CwTextArea(props) {
     return (jsxs("div", { className: "cw-text-area", ...dataDirection, style: style, children: [jsxs(CwAlign, { ...alignProps, children: [labelProps && (jsxs(CwLabel, { ...labelProps, children: [iconProps && jsx(CwIcon, { ...iconProps }), labelProps.text] })), jsx("textarea", { ...textareaProps, itemProp: textareaProps.required === true ? "required" : "", style: { resize: resize } }), buttonProps && jsx(CwButton, { ...buttonProps })] }), feedbackMessages.map((feedbackItem, index) => (jsx("p", { className: "cw-input-info", "data-color": feedbackItem.type, children: feedbackItem.message }, index)))] }));
 }
 
-/**
- * Input for entering a string of text.
- * @remarks
- * ```txt
- * CwIcon  CwLabel  input type=date    CwButton
- *  ↑      ↑           ↑               ↑
- *               ╭────────────────────╮╭════╮
- *  ⌂  Birthdate │ 0000 / 00 / 00     │║ Ok ║
- *               ╰────────────────────╯╰════╯
- * ```
- * @example
- * ```tsx
- * <CwInputDate
- *   iconProps={{ iconId: "Birthdate" }}
- *   labelProps={{ children: "Name", width: "100px" }}
- *   buttonProps={{ children: "Ok", onClick:()=>{alert("happy happy joy joy")} }}
- * />
- * ```
- */
-function CwInputDate(props) {
-    const { alignProps, buttonProps, iconProps, labelProps, ...inputProps } = props;
-    inputProps.max = inputProps.max ?? "9999-01-01";
-    return (jsx("div", { className: "cw-input-date", children: jsxs(CwAlign, { ...alignProps, itemProp: inputProps.required === true ? "required" : "", children: [labelProps && (jsxs(CwLabel, { ...labelProps, children: [iconProps && jsx(CwIcon, { ...iconProps }), labelProps.text] })), jsx("input", { type: "date", ...inputProps }), buttonProps && jsx(CwButton, { ...buttonProps })] }) }));
-}
-
-var classes = {"datePicker":"cw-input-date-picker-module__datePicker__jogOq","input":"cw-input-date-picker-module__input__uQshH","calendar":"cw-input-date-picker-module__calendar__q39ic","calendarHeader":"cw-input-date-picker-module__calendarHeader__1btPK","arrowButton":"cw-input-date-picker-module__arrowButton__23tNc","calendarTitle":"cw-input-date-picker-module__calendarTitle__oOODw","calendarBody":"cw-input-date-picker-module__calendarBody__-711a","calendarDay":"cw-input-date-picker-module__calendarDay__z-Mmv","selected":"cw-input-date-picker-module__selected__XQgR7","todayButton":"cw-input-date-picker-module__todayButton__oYamC","emptyDay":"cw-input-date-picker-module__emptyDay__lbI5B"};
-
-/**
- * Converts a Date or ISO string to a Temporal.PlainDate.
- */
-function toPlainDate$1(dateString) {
-    if (dateString instanceof Date) {
-        return Temporal.PlainDate.from({
-            year: dateString.getFullYear(),
-            month: dateString.getMonth() + 1,
-            day: dateString.getDate(),
-        });
-    }
-    // ISO "YYYY-MM-DD" → direct parse
-    return Temporal.PlainDate.from(dateString);
-}
-/**
- * Formats a date as DD.MM.YYYY (German locale).
- */
-function toGermanDate(dateString) {
-    const pd = toPlainDate$1(dateString);
-    const day = String(pd.day).padStart(2, "0");
-    const month = String(pd.month).padStart(2, "0");
-    return `${day}.${month}.${pd.year}`;
-}
-/**
- * Formats a date as YYYY-MM-DD (ISO).
- */
-function toISODate(dateString) {
-    return toPlainDate$1(dateString).toString();
-}
-/**
- * Validates whether a string is a valid DD.MM.YYYY date.
- */
-function isValidGermanDate(textDate) {
-    return parseGermanDate(textDate) !== null;
-}
-/**
- * Converts a DD.MM.YYYY string to YYYY-MM-DD, or null if invalid.
- */
-function germanDateToISO(textDate) {
-    const pd = parseGermanDate(textDate);
-    return pd ? pd.toString() : null;
-}
-/**
- * Converts a DD.MM.YYYY string to a Date object, or null if invalid.
- */
-function germanDateToDate(textDate) {
-    const pd = parseGermanDate(textDate);
-    if (!pd)
-        return null;
-    return new Date(pd.year, pd.month - 1, pd.day);
-}
-/**
- * Returns the number of days in the month and the Monday-based
- * weekday offset (0 = Monday) for the 1st of the month.
- */
-function computeCalendarGrid(internalDate) {
-    const pd = Temporal.PlainDate.from({
-        year: internalDate.getFullYear(),
-        month: internalDate.getMonth() + 1,
-        day: 1,
-    });
-    const daysInMonth = pd.daysInMonth;
-    const startDay = pd.dayOfWeek - 1; // Temporal: 1=Mon … 7=Sun → 0-based Mon
-    return { daysInMonth, startDay };
-}
-/**
- * Returns true when the given day in the internalDate's month/year
- * matches the selected ISO value string.
- */
-function isSelectedDay(internalDate, day, value) {
-    const pd = Temporal.PlainDate.from({
-        year: internalDate.getFullYear(),
-        month: internalDate.getMonth() + 1,
-        day,
-    });
-    return pd.toString() === value;
-}
-/**
- * Returns a new Date set to the 1st of the month offset by `direction` months.
- */
-function computeNextMonthDate(currentDate, direction) {
-    const pd = Temporal.PlainDate.from({
-        year: currentDate.getFullYear(),
-        month: currentDate.getMonth() + 1,
-        day: 1,
-    });
-    const moved = pd.add({ months: direction });
-    return new Date(moved.year, moved.month - 1, moved.day);
-}
-// ── internal helper ────────────────────────────────────────────────────
-/**
- * Strictly parses a DD.MM.YYYY string into a Temporal.PlainDate, or null.
- */
-function parseGermanDate(text) {
-    const match = /^(\d{2})\.(\d{2})\.(\d{4})$/.exec(text);
-    if (!match)
-        return null;
-    const day = Number(match[1]);
-    const month = Number(match[2]);
-    const year = Number(match[3]);
-    try {
-        return Temporal.PlainDate.from({ year, month, day }, { overflow: "reject" });
-    }
-    catch {
-        return null;
-    }
-}
-
-const CwInputDatePicker = ({ value, onChange }) => {
-    const [isCalendarOpen, setIsCalendarOpen] = useState(false);
-    const [internalDate, setInternalDate] = useState(new Date(value || new Date().toISOString()));
-    const [textDate, setTextDate] = useState(toGermanDate(value));
-    const inputRef = useRef(null);
-    const calendarRef = useRef(null);
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (calendarRef.current &&
-                !calendarRef.current.contains(event.target) &&
-                inputRef.current &&
-                !inputRef.current.contains(event.target)) {
-                setIsCalendarOpen(false);
-            }
-        };
-        document.addEventListener("mousedown", handleClickOutside);
-        return () => {
-            document.removeEventListener("mousedown", handleClickOutside);
-        };
-    }, []);
-    useEffect(() => {
-        setTextDate(toGermanDate(value));
-    }, [value]);
-    const submitInput = () => {
-        if (isValidGermanDate(textDate)) {
-            const newDateString = germanDateToISO(textDate);
-            const newDate = germanDateToDate(textDate);
-            if (newDateString && newDate) {
-                if (newDateString !== value) {
-                    setInternalDate(newDate);
-                    onChange?.(newDateString);
-                }
-                setIsCalendarOpen(false);
-                return true;
-            }
-            else {
-                console.error("Invalid date format");
-                return false;
-            }
-        }
-        else {
-            setTextDate(toGermanDate(new Date(value)));
-            return false;
-        }
-    };
-    const handleClickToday = () => {
-        const today = toISODate(new Date());
-        const currentDate = value;
-        if (currentDate != today) {
-            setTextDate(toGermanDate(today));
-            setInternalDate(new Date(today));
-            onChange?.(today);
-        }
-        setIsCalendarOpen(false);
-    };
-    const handleClickDay = (day) => {
-        const newDate = new Date(internalDate.getFullYear(), internalDate.getMonth(), day);
-        const newDateString = toISODate(newDate);
-        if (newDateString !== value) {
-            setTextDate(toGermanDate(newDate));
-            setInternalDate(newDate);
-            onChange?.(newDateString);
-        }
-        setIsCalendarOpen(false);
-    };
-    const handleClickMonthArrow = (direction) => {
-        setInternalDate(prevDate => computeNextMonthDate(prevDate, direction));
-    };
-    const handlePressEnter = (event) => {
-        if (event.key === "Enter" && submitInput()) {
-            event.currentTarget.blur();
-        }
-    };
-    const handleBlurInput = (event) => {
-        if (value != toISODate(internalDate) && submitInput()) {
-            event.currentTarget?.blur();
-        }
-    };
-    const generateCalendarDays = () => {
-        const { daysInMonth, startDay } = computeCalendarGrid(internalDate);
-        const calendarDays = new Array;
-        for (let i = 0; i < startDay; i++) {
-            calendarDays.push(jsx("div", { className: classes.emptyDay }, `empty-${i}`));
-        }
-        for (let day = 1; day <= daysInMonth; day++) {
-            const selected = isSelectedDay(internalDate, day, value);
-            calendarDays.push(jsx("div", { className: `${classes.calendarDay}${selected ? ` ${classes.selected}` : ""}`, onClick: () => handleClickDay(day), children: day }, day));
-        }
-        return calendarDays;
-    };
-    return (jsxs("div", { className: classes.datePicker, children: [jsx("input", { type: "text", value: textDate, onChange: e => setTextDate(e.currentTarget.value), onFocus: () => {
-                    setInternalDate(new Date(value));
-                    setIsCalendarOpen(true);
-                }, onBlur: handleBlurInput, onKeyDown: handlePressEnter, "data-valid": isValidGermanDate(textDate), ref: inputRef, className: classes.input }), isCalendarOpen && (jsxs("div", { className: classes.calendar, ref: calendarRef, children: [jsxs("div", { className: classes.calendarHeader, children: [jsx("button", { className: classes.arrowButton, onClick: () => handleClickMonthArrow(-1), children: "<" }), jsxs("span", { className: classes.calendarTitle, children: [internalDate.toLocaleString("default", { month: "long" }), " ", internalDate.getFullYear()] }), jsx("button", { className: classes.arrowButton, onClick: () => handleClickMonthArrow(1), children: ">" })] }), jsx("div", { className: classes.calendarBody, children: generateCalendarDays() }), jsx("button", { className: classes.todayButton, onClick: handleClickToday, children: "Today" })] }))] }));
-};
-
 /**
  * Input for entering a string of text.
  * @remarks
@@ -4356,8 +4085,9 @@ function useDropdownPortal({ anchorRef, isOpen, onClose, positionStrategy = defa
         zIndex: 1000,
         right: "auto",
         marginLeft: 0,
+        visibility: "hidden",
     });
-    const reposition = useCallback(() => {
+    const reposition = useCallback((visibility = "visible") => {
         const anchor = anchorRef.current;
         if (!anchor)
             return;
@@ -4372,15 +4102,18 @@ function useDropdownPortal({ anchorRef, isOpen, onClose, positionStrategy = defa
             zIndex: 1000,
             right: "auto",
             marginLeft: 0,
+            visibility,
         });
     }, [anchorRef, positionStrategy]);
-    // Reposition when opened; re-measure after first paint to get real panel size
+    // Reposition when opened. First pass is hidden (panel not yet measured), second
+    // pass fires in a RAF with the real panel size and reveals the panel — preventing
+    // the one-frame flicker at top:0/left:0 or at the wrong position.
     useEffect(() => {
         if (!isOpen)
             return;
-        reposition();
-        const raf = requestAnimationFrame(reposition);
-        const handleUpdate = () => reposition();
+        reposition("hidden");
+        const raf = requestAnimationFrame(() => reposition("visible"));
+        const handleUpdate = () => reposition("visible");
         window.addEventListener("resize", handleUpdate);
         // Capture phase catches scroll on all scrollable ancestors
         window.addEventListener("scroll", handleUpdate, true);
@@ -4574,18 +4307,50 @@ var styles$a = {"container":"cw-popover-button-module__container__YSWQU","panel"
 function CwPopoverButton({ children, panelWidth = "auto", placement = "bottom-start", panelClassName, ...buttonProps }) {
     const containerRef = useRef(null);
     const panelRef = useRef(null);
+    const isOpenRef = useRef(false);
+    const lastToggleClosedAtRef = useRef(0);
+    const RECENT_CLOSE_MS = 200;
     const panelCallbackRef = useCallback((node) => {
         panelRef.current = node;
         node?.setAttribute("popover", "auto");
     }, []);
+    // Sync isOpenRef with the native popover toggle event so we know the real
+    // open state at the moment handleClick fires (light-dismiss closes on pointerdown,
+    // before the click event, so we can't rely on a React state for this).
+    useEffect(() => {
+        const panel = panelRef.current;
+        if (!panel)
+            return;
+        const handler = (e) => {
+            const newState = e.newState;
+            isOpenRef.current = newState === "open";
+            if (newState === "closed") {
+                lastToggleClosedAtRef.current = Date.now();
+            }
+        };
+        panel.addEventListener("toggle", handler);
+        return () => panel.removeEventListener("toggle", handler);
+    }, []);
     const handleClick = useCallback(() => {
         const panel = panelRef.current;
         const container = containerRef.current;
         if (!panel || !container)
             return;
+        // Light-dismiss already closed the panel on pointerdown — don't reopen.
+        if (isOpenRef.current)
+            return;
+        if (Date.now() - lastToggleClosedAtRef.current < RECENT_CLOSE_MS)
+            return;
         const rect = container.getBoundingClientRect();
         panel.style.top = `${rect.bottom + 4}px`;
-        if (placement === "bottom-start") {
+        // Prefer the requested placement, but flip if the panel would overflow the viewport.
+        const panelWidth = panel.offsetWidth || 240;
+        const spaceOnRight = window.innerWidth - rect.left;
+        const spaceOnLeft = rect.right;
+        const effectivePlacement = placement === "bottom-end" && spaceOnLeft < panelWidth ? "bottom-start" :
+            placement === "bottom-start" && spaceOnRight < panelWidth ? "bottom-end" :
+                placement;
+        if (effectivePlacement === "bottom-start") {
             panel.style.left = `${rect.left}px`;
             panel.style.right = "auto";
         }
@@ -4593,7 +4358,7 @@ function CwPopoverButton({ children, panelWidth = "auto", placement = "bottom-st
             panel.style.right = `${window.innerWidth - rect.right}px`;
             panel.style.left = "auto";
         }
-        panel.togglePopover();
+        panel.showPopover();
     }, [placement]);
     return (jsxs("div", { ref: containerRef, className: styles$a.container, children: [jsx(CwButton, { ...buttonProps, onClick: handleClick }), jsx("div", { ref: panelCallbackRef, className: `${styles$a.panel}${panelClassName ? ` ${panelClassName}` : ""}`, style: { width: panelWidth }, children: children })] }));
 }
@@ -5480,25 +5245,41 @@ const CwContextMenu = ({ children, options, offset = DEFAULT_OFFSET, onSelect })
 };
 
 /**
- * Save button wrapper
+ * Save button wrapper  (6 uses pending delete)
  * @deprecated Use <CwButton variant="icon" icon="save" onClick={...} /> instead
  */
 function CwBtnSave({ cw_btnOnclick, cw_btn_disabled, onClick, disabled, ...rest }) {
-    return (jsx(CwButton, { ...rest, variant: "icon", icon: "save", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled }));
+    return (jsx(CwButton, { ...rest, variant: "icon", icon: "save", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled, title: "Save" }));
 }
 /**
- * Edit button wrapper
+ * Edit button wrapper  (5 uses pending delete)
  * @deprecated Use <CwButton variant="icon" icon="edit" onClick={...} /> instead
  */
 function CwBtnEdit({ cw_btnOnclick, cw_btn_disabled, onClick, disabled, ...rest }) {
-    return (jsx(CwButton, { ...rest, variant: "icon", icon: "edit", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled }));
+    return (jsx(CwButton, { ...rest, variant: "icon", icon: "edit", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled, title: "Edit" }));
 }
 /**
- * Delete button wrapper
+ * Delete button wrapper (4 uses pending delete)
  * @deprecated Use <CwButton variant="icon" icon="delete" color="danger" onClick={...} /> instead
  */
 function CwBtnDelete({ cw_btnOnclick, cw_btn_disabled, onClick, disabled, ...rest }) {
-    return (jsx(CwButton, { ...rest, variant: "icon", icon: "delete", color: "danger", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled }));
+    return (jsx(CwButton, { ...rest, variant: "icon", icon: "delete", color: "danger", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled, title: "Delete" }));
+}
+/**
+ * Approve button wrapper.
+ * DO NOT DELETE — used by Operon (lib pinned at ^1.0.9, currently dormant).
+ * @deprecated Use <CwButton variant="icon" icon="check-circle" onClick={...} /> instead
+ */
+function CwBtnApprove({ cw_btnOnclick, cw_btn_disabled, onClick, disabled, ...rest }) {
+    return (jsx(CwButton, { ...rest, variant: "icon", icon: "check-circle", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled, title: "Approve" }));
+}
+/**
+ * Cancel button wrapper.
+ * DO NOT DELETE — used by Operon (lib pinned at ^1.0.9, currently dormant).
+ * @deprecated Use <CwButton variant="icon" icon="cancel" color="danger" onClick={...} /> instead
+ */
+function CwBtnCancel({ cw_btnOnclick, cw_btn_disabled, onClick, disabled, ...rest }) {
+    return (jsx(CwButton, { ...rest, variant: "icon", icon: "cancel", color: "danger", onClick: onClick ?? cw_btnOnclick, disabled: disabled ?? cw_btn_disabled, title: "Cancel" }));
 }
 
 var styles$4 = {"pickerWrapper":"cw-pickers-base-module__pickerWrapper__Fb9Zo","pickerIcons":"cw-pickers-base-module__pickerIcons__dyd2-","pickerPopup":"cw-pickers-base-module__pickerPopup__dkxJo"};
@@ -5745,7 +5526,7 @@ function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabl
                                         } }), showTodayButton && (jsx("footer", { className: "cw-flex-row cw-align-right-center", children: jsx(CwButton, { type: "button", variant: "outline", onClick: handleTodayClick, text: todayLabel }) }))] }))] })] }), feedbackMessages.map((feedbackItem, index) => (jsx("p", { className: "cw-input-info", "data-color": feedbackItem.type, children: feedbackItem.message }, index)))] }));
 }
 
-var rangeStyles = {"rangeWrapper":"cw-range-picker-module__rangeWrapper__1nIVs","rangePopup":"cw-range-picker-module__rangePopup__E5jd1","presetList":"cw-range-picker-module__presetList__INiLo"};
+var rangeStyles = {"rangeWrapper":"cw-range-picker-module__rangeWrapper__1nIVs","rangePopup":"cw-range-picker-module__rangePopup__E5jd1","rangeCalendarRow":"cw-range-picker-module__rangeCalendarRow__VTxi0","presetList":"cw-range-picker-module__presetList__INiLo","rangeError":"cw-range-picker-module__rangeError__qHMdi"};
 
 const PRESET_LIBRARY = {
     // === PAST DAYS ===
@@ -6020,6 +5801,7 @@ function CwDateRangePicker({ value, onChange, minDate, maxDate, disabledDates, d
     const [isOpen, setIsOpen] = useState(false);
     const [inputFromValue, setInputFromValue] = useState("");
     const [inputToValue, setInputToValue] = useState("");
+    const [rangeErrorMessage, setRangeErrorMessage] = useState(null);
     const [focusedInput, setFocusedInput] = useState();
     const containerRef = useRef(null);
     const wrapperRef = useRef(null);
@@ -6144,21 +5926,27 @@ function CwDateRangePicker({ value, onChange, minDate, maxDate, disabledDates, d
             }
         }
     }, [value, displayFormat]);
-    const handleRangeSelect = useCallback((range, // El rango sugerido por react-day-picker
-    selectedDay) => {
+    const handleRangeSelect = useCallback((range, selectedDay) => {
         let newRange;
         if (focusedInput === 'from') {
             newRange = { from: selectedDay, to: value?.to };
             if (newRange.to && selectedDay > newRange.to) {
                 newRange.to = undefined;
                 setFocusedInput('to');
+                setRangeErrorMessage(null);
             }
             else if (newRange.to) {
+                if (!validateRange(newRange.from, newRange.to)) {
+                    setRangeErrorMessage(maxRangeDays ? `Range cannot exceed ${maxRangeDays} days` : "Invalid date range");
+                    return;
+                }
+                setRangeErrorMessage(null);
                 setIsOpen(false);
                 setFocusedInput(undefined);
             }
             else {
                 setFocusedInput('to');
+                setRangeErrorMessage(null);
             }
         }
         else if (focusedInput === 'to') {
@@ -6166,13 +5954,20 @@ function CwDateRangePicker({ value, onChange, minDate, maxDate, disabledDates, d
             if (newRange.from && selectedDay < newRange.from) {
                 newRange.from = undefined;
                 setFocusedInput('from');
+                setRangeErrorMessage(null);
             }
             else if (newRange.from) {
+                if (!validateRange(newRange.from, newRange.to)) {
+                    setRangeErrorMessage(maxRangeDays ? `Range cannot exceed ${maxRangeDays} days` : "Invalid date range");
+                    return;
+                }
+                setRangeErrorMessage(null);
                 setIsOpen(false);
                 setFocusedInput(undefined);
             }
             else {
                 setFocusedInput('from');
+                setRangeErrorMessage(null);
             }
         }
         else {
@@ -6182,20 +5977,23 @@ function CwDateRangePicker({ value, onChange, minDate, maxDate, disabledDates, d
             }
             newRange = { from: range.from, to: range.to };
             if (range.from && range.to) {
+                if (!validateRange(newRange.from, newRange.to)) {
+                    setRangeErrorMessage(maxRangeDays ? `Range cannot exceed ${maxRangeDays} days` : "Invalid date range");
+                    return;
+                }
+                setRangeErrorMessage(null);
                 setIsOpen(false);
                 setFocusedInput(undefined);
             }
             else if (range.from) {
                 setFocusedInput('to');
+                setRangeErrorMessage(null);
             }
             else {
                 setFocusedInput('from');
+                setRangeErrorMessage(null);
             }
         }
-        // Validate range before sending
-        if (newRange.from && newRange.to && !validateRange(newRange.from, newRange.to)) {
-            return;
-        }
         onChange(newRange);
     }, [onChange, validateRange, value, focusedInput]);
     const handleClearFrom = useCallback((e) => {
@@ -6364,11 +6162,11 @@ function CwDateRangePicker({ value, onChange, minDate, maxDate, disabledDates, d
         }
         return undefined;
     }, [value]);
-    return (jsx("div", { ref: containerRef, className: `cw-rangepicker ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: rangeStyles.rangeWrapper, children: [jsxs("div", { className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputFromRef, type: "text", value: inputFromValue, placeholder: placeholderFrom, onChange: handleInputFromChange, onBlur: () => handleInputBlur('from'), onClick: handleInputFromClick, onKeyDown: (e) => handleInputKeyDown(e, 'from'), disabled: disabled, required: required, "data-focused": focusedInput === 'from' }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value?.from && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClearFrom, tabIndex: -1, "aria-label": "Clear from date" })) : (jsx(CwIcon, { iconId: "calendar" })) })] }), jsx(CwIcon, { iconId: "arrow-right", size: "medium" }), jsxs("div", { className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputToRef, type: "text", value: inputToValue, placeholder: placeholderTo, onChange: handleInputToChange, onBlur: () => handleInputBlur('to'), onClick: handleInputToClick, onKeyDown: (e) => handleInputKeyDown(e, 'to'), disabled: disabled, required: required, "data-focused": focusedInput === 'to' }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value?.to && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClearTo, tabIndex: -1, "aria-label": "Clear to date" })) : (jsx(CwIcon, { iconId: "calendar" })) })] }), renderPopup(jsxs("div", { ref: popupRef, className: `${styles$4.pickerPopup} ${rangeStyles.rangePopup}`, style: popupStyle, children: [showPresets && presetsToRender.length > 0 && (jsx("div", { className: rangeStyles.presetList, children: presetsToRender.map((preset) => (jsx("button", { type: "button", onClick: (e) => handlePresetClick(preset, e), children: preset.label }, preset.key))) })), jsx(DayPicker, { mode: "range", selected: selectedRange, onSelect: handleRangeSelect, disabled: disabledDays, numberOfMonths: numberOfMonths, defaultMonth: defaultMonth || value?.from || undefined, modifiers: {
-                                        today: new Date(),
-                                    }, modifiersClassNames: {
-                                        today: "rdp-day-today",
-                                    } })] }))] })] }) }));
+    return (jsx("div", { ref: containerRef, className: `cw-rangepicker ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: rangeStyles.rangeWrapper, children: [jsxs("div", { className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputFromRef, type: "text", value: inputFromValue, placeholder: placeholderFrom, onChange: handleInputFromChange, onBlur: () => handleInputBlur('from'), onClick: handleInputFromClick, onKeyDown: (e) => handleInputKeyDown(e, 'from'), disabled: disabled, required: required, "data-focused": focusedInput === 'from' }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value?.from && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClearFrom, tabIndex: -1, "aria-label": "Clear from date" })) : (jsx(CwIcon, { iconId: "calendar" })) })] }), jsx(CwIcon, { iconId: "arrow-right", size: "medium" }), jsxs("div", { className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputToRef, type: "text", value: inputToValue, placeholder: placeholderTo, onChange: handleInputToChange, onBlur: () => handleInputBlur('to'), onClick: handleInputToClick, onKeyDown: (e) => handleInputKeyDown(e, 'to'), disabled: disabled, required: required, "data-focused": focusedInput === 'to' }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value?.to && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClearTo, tabIndex: -1, "aria-label": "Clear to date" })) : (jsx(CwIcon, { iconId: "calendar" })) })] }), renderPopup(jsxs("div", { ref: popupRef, className: `${styles$4.pickerPopup} ${rangeStyles.rangePopup}`, style: popupStyle, children: [jsxs("div", { className: rangeStyles.rangeCalendarRow, children: [showPresets && presetsToRender.length > 0 && (jsx("div", { className: rangeStyles.presetList, children: presetsToRender.map((preset) => (jsx("button", { type: "button", onClick: (e) => handlePresetClick(preset, e), children: preset.label }, preset.key))) })), jsx(DayPicker, { mode: "range", selected: selectedRange, onSelect: handleRangeSelect, disabled: disabledDays, numberOfMonths: numberOfMonths, defaultMonth: defaultMonth || value?.from || undefined, modifiers: {
+                                                today: new Date(),
+                                            }, modifiersClassNames: {
+                                                today: "rdp-day-today",
+                                            } })] }), jsx("div", { role: "alert", "aria-live": "polite", className: rangeStyles.rangeError, children: rangeErrorMessage })] }))] })] }) }));
 }
 
 var timeStyles = {"timePickerPopup":"cw-time-picker-module__timePickerPopup__BN63t","timePickerList":"cw-time-picker-module__timePickerList__E88pr","selected":"cw-time-picker-module__selected__qVnfL","hasIcons":"cw-time-picker-module__hasIcons__ZiGUf","notIcons":"cw-time-picker-module__notIcons__3icu1"};
@@ -8601,7 +8399,7 @@ const BackgroundEvent = ({ value, heightRem }) => {
             position: "absolute",
             height: `${heightRem}rem`,
             pointerEvents: "auto",
-        }, children: jsx(CwGenericTooltip, { content: value.tooltip, position: "bottom", dissapearsWhenHover: true, showDelay: 200, children: jsx("div", { style: {
+        }, children: jsx(CwTooltipNew, { content: value.tooltip, position: "bottom", dissapearsWhenHover: true, showDelay: 200, children: jsx("div", { style: {
                     overflow: "hidden",
                     backgroundColor: backColor,
                     height: `${heightRem}rem`,
@@ -8761,6 +8559,7 @@ var styles$1 = {"scheduler-row-header":"scheduler-row-module__scheduler-row-head
 const DefaultRowHeader = ({ value, width, onEvent }) => {
     return (jsxs("div", { style: {
             width: width,
+            flexShrink: 0,
             // background: color,
         }, onClick: (_) => {
             onEvent(new OnClickRowHeader(value.rowId));
@@ -8779,10 +8578,10 @@ const EventSideDrag = ({ left = false, heightRem, onStartEvent }) => {
 };
 
 const MAX_EVENT_HEIGHT_REM = 1.5;
-const SchedulerEvent = ({ value, heightRem, onEvent }) => {
+const SchedulerEvent = ({ value, heightRem, onEvent, maxEventHeightRem }) => {
     const [isOnDrag, setIsOnDrag] = useState(false);
     const [isContextMenuOpen, setIsContextMenuOpen] = useState(false);
-    const effectiveHeight = Math.min(heightRem, MAX_EVENT_HEIGHT_REM);
+    const effectiveHeight = Math.min(heightRem, maxEventHeightRem ?? MAX_EVENT_HEIGHT_REM);
     const topOffsetRem = (heightRem - effectiveHeight) / 2;
     const topOffsetPx = Math.round(topOffsetRem * 16) + 1;
     // Calculate colors of the event
@@ -8814,78 +8613,86 @@ const SchedulerEvent = ({ value, heightRem, onEvent }) => {
         e.preventDefault();
         onEvent(new OnDoubleClickEvent(value.id));
     });
-    return (jsx(CwAnchoredMenu, { open: isContextMenuOpen, onOpenChange: setIsContextMenuOpen, onContextMenu: (e) => {
-            e.stopPropagation();
-            // 	onEvent(new OnRightClickEvent(value.id));
-        }, placement: "bottom", options: value.contextMenuItems ?? [], onSelect: (key) => {
-            onEvent(new OnClickContextMenu(value.id, key));
-        }, children: jsx("div", { style: {
-                top: `${topOffsetPx}px`,
-                left: `${value.left}%`,
-                width: `${value.width}%`,
-                minWidth: "5px",
-                position: "absolute",
-                zIndex: isOnDrag ? 999 : undefined,
-                contentVisibility: "auto",
-                pointerEvents: "auto",
-            }, onClick: handleClick, onDoubleClick: handleDoubleClick, draggable: value.isDraggable, onMouseDown: (_) => {
-                if (value.isDraggable)
-                    setIsOnDrag(true);
-            }, onMouseLeave: (_) => {
-                if (value.isDraggable)
-                    setIsOnDrag(false);
-            }, onDragStart: (_) => {
-                if (value.isDraggable)
-                    onEvent(new OnDragEvent(value.id, value.rowId));
-            }, onDragEnd: (_) => {
-                if (value.isDraggable)
-                    setIsOnDrag(false);
-            }, children: jsx(CwTooltipNew, { content: value.tooltip, position: "bottom", hide: isOnDrag, showDelay: 200, children: jsxs("div", { style: {
-                        border: value.selected ? "2px solid black" : "none",
-                        backgroundColor: backColor,
-                        height: `calc(${effectiveHeight}rem - 4px)`,
-                        opacity: eventTransparent ? 0.5 : 1,
-                        ...value.style,
-                    }, className: styles$2["scheduler-event"], children: [jsxs("div", { style: {
-                                display: "flex",
-                                flexDirection: "row",
-                                alignItems: "stretch",
-                                width: "100%",
-                                padding: "0 2px",
-                                cursor: value.isDraggable ? "pointer" : "default",
-                                // height: `calc(${effectiveHeight}rem - 8px)`,
-                                height: "100%",
-                            }, children: [value.isResizable && (jsx(EventSideDrag, { left: true, heightRem: effectiveHeight * 0.7, onStartEvent: () => {
-                                        onEvent(new OnLeftDragStart(value.id));
-                                    } })), jsxs("div", { className: styles$2["scheduler-event-container"], children: [jsx("div", { style: {
-                                                display: "flex",
-                                                flexDirection: "row",
-                                                alignItems: "center",
-                                                whiteSpace: "nowrap",
-                                                color: textColor,
-                                            }, children: value.icons }), jsx("span", { style: {
-                                                padding: "0.1rem",
-                                                color: textColor,
-                                                display: "flex",
-                                                flex: 1,
-                                                alignItems: "center",
-                                                width: "100%",
-                                            }, children: value.rectangleColors && value.rectangleColors.length > 0 ? (jsx("div", { style: {
-                                                    display: "flex",
-                                                    width: "100%",
-                                                }, children: value.rectangleColors.map((item, i) => (jsx("div", { className: "cwellt_rectangle_indicator", style: {
-                                                        backgroundColor: item,
+    return (jsxs(Fragment, { children: [value.topLabel && (jsx("div", { style: {
+                    position: "absolute",
+                    top: 0,
+                    left: `${value.left}%`,
+                    width: `${value.width}%`,
+                    height: `${topOffsetPx}px`,
+                    pointerEvents: "none",
+                    contentVisibility: "auto",
+                }, children: value.topLabel })), jsx(CwAnchoredMenu, { open: isContextMenuOpen, onOpenChange: setIsContextMenuOpen, onContextMenu: (e) => {
+                    e.stopPropagation();
+                    // 	onEvent(new OnRightClickEvent(value.id));
+                }, placement: "bottom", options: value.contextMenuItems ?? [], onSelect: (key) => {
+                    onEvent(new OnClickContextMenu(value.id, key));
+                }, children: jsx("div", { style: {
+                        top: `${topOffsetPx}px`,
+                        left: `${value.left}%`,
+                        width: `${value.width}%`,
+                        minWidth: "5px",
+                        position: "absolute",
+                        zIndex: isOnDrag ? 999 : undefined,
+                        contentVisibility: "auto",
+                        pointerEvents: "auto",
+                    }, onClick: handleClick, onDoubleClick: handleDoubleClick, draggable: value.isDraggable, onMouseDown: (_) => {
+                        if (value.isDraggable)
+                            setIsOnDrag(true);
+                    }, onMouseLeave: (_) => {
+                        if (value.isDraggable)
+                            setIsOnDrag(false);
+                    }, onDragStart: (_) => {
+                        if (value.isDraggable)
+                            onEvent(new OnDragEvent(value.id, value.rowId));
+                    }, onDragEnd: (_) => {
+                        if (value.isDraggable)
+                            setIsOnDrag(false);
+                    }, children: jsx(CwTooltipNew, { content: value.tooltip, position: "bottom", hide: isOnDrag, showDelay: 200, children: jsxs("div", { style: {
+                                border: value.selected ? "2px solid black" : "none",
+                                backgroundColor: backColor,
+                                height: `calc(${effectiveHeight}rem - 4px)`,
+                                opacity: eventTransparent ? 0.5 : 1,
+                                ...value.style,
+                            }, className: styles$2["scheduler-event"], children: [jsxs("div", { style: {
+                                        display: "flex",
+                                        flexDirection: "row",
+                                        alignItems: "stretch",
+                                        width: "100%",
+                                        padding: "0 2px",
+                                        cursor: value.isDraggable ? "pointer" : "default",
+                                        // height: `calc(${effectiveHeight}rem - 8px)`,
+                                        height: "100%",
+                                    }, children: [value.isResizable && (jsx(EventSideDrag, { left: true, heightRem: effectiveHeight * 0.7, onStartEvent: () => {
+                                                onEvent(new OnLeftDragStart(value.id));
+                                            } })), jsxs("div", { className: styles$2["scheduler-event-container"], children: [jsx("div", { style: {
+                                                        display: "flex",
+                                                        flexDirection: "row",
+                                                        alignItems: "center",
+                                                        whiteSpace: "nowrap",
+                                                        color: textColor,
+                                                    }, children: value.icons }), jsx("span", { style: {
+                                                        padding: "0.1rem",
+                                                        color: textColor,
+                                                        display: "flex",
                                                         flex: 1,
-                                                        height: "8px",
-                                                        margin: 0,
-                                                        padding: 0,
-                                                    } }, value.id + "_" + i))) })) : (value.name) })] }), value.isResizable && (jsx(EventSideDrag, { heightRem: effectiveHeight * 0.7, onStartEvent: () => {
-                                        onEvent(new OnRightDragStart(value.id));
-                                    } }))] }), value.primaryTimeMarkerColor && (jsx("div", { className: styles$2["time-marker"], style: {
-                                backgroundColor: value.primaryTimeMarkerColor,
-                            } })), value.secondaryTimeMarkerColor && (jsx("div", { className: styles$2["time-marker"], style: {
-                                backgroundColor: value.secondaryTimeMarkerColor,
-                            } }))] }) }) }, value.id) }));
+                                                        alignItems: "center",
+                                                        width: "100%",
+                                                    }, children: value.rectangleColors && value.rectangleColors.length > 0 ? (jsx("div", { style: {
+                                                            display: "flex",
+                                                            width: "100%",
+                                                        }, children: value.rectangleColors.map((item, i) => (jsx("div", { className: "cwellt_rectangle_indicator", style: {
+                                                                backgroundColor: item,
+                                                                flex: 1,
+                                                                height: "8px",
+                                                                margin: 0,
+                                                                padding: 0,
+                                                            } }, value.id + "_" + i))) })) : (value.name) })] }), value.isResizable && (jsx(EventSideDrag, { heightRem: effectiveHeight * 0.7, onStartEvent: () => {
+                                                onEvent(new OnRightDragStart(value.id));
+                                            } }))] }), value.primaryTimeMarkerColor && (jsx("div", { className: styles$2["time-marker"], style: {
+                                        backgroundColor: value.primaryTimeMarkerColor,
+                                    } })), value.secondaryTimeMarkerColor && (jsx("div", { className: styles$2["time-marker"], style: {
+                                        backgroundColor: value.secondaryTimeMarkerColor,
+                                    } }))] }) }) }, value.id) })] }));
 };
 
 const SchedulerRow = memo((props) => {
@@ -8947,7 +8754,7 @@ const SchedulerRow = memo((props) => {
                                     position: "relative",
                                     height: props.rowHeightInRem + "rem",
                                     pointerEvents: "none"
-                                }, children: internalRow.map((event) => (jsx(EventComp, { value: event, heightRem: props.rowHeightInRem, onEvent: onEvent }, event.id))) }, index));
+                                }, children: internalRow.map((event) => (jsx(EventComp, { value: event, heightRem: props.rowHeightInRem, onEvent: onEvent, maxEventHeightRem: props.maxEventHeightRem }, event.id))) }, index));
                         }), indicatorRows.length > 0 && (jsx(IndicatorRow, { indicators: indicatorRows, selectedDate: selectedDate, visibleDays: visibleDays })), !(timeLinePercentage < 0 || timeLinePercentage > 100) && (jsx(TimeLine, { color: "red", left: `${timeLinePercentage}%`, top: "0px", height: `100%` }))] }) })] }));
 }, (prevProps, nextProps) => {
     // This memo is necessary to prevent re-render all the rows when a user makes drag and drop
@@ -9234,7 +9041,7 @@ const RowContent = React__default.memo(function RowContent(props) {
     return (jsx("div", { style: {
             ...props.style,
             backgroundColor: props.rowColor
-        }, children: jsx(SchedulerRow, { events: props.events, backgroundEvents: props.backgroundEvents, indicatorRows: props.indicatorRows, rowHeader: header, EventComp: props.EventComp, BackgroundEventComp: props.BackgroundEventComp, RowTitleComp: props.RowTitleComp, weekendLines: props.weekendLines, divisionLines: props.divisionLines, timeLinePercentage: props.timeLinePercentage, rowHeightInRem: props.rowHeightRem, onEvent: props.onEvent, contextMenuItems: props.contextMenuItems, visibleDays: props.visibleDays, selectedDate: props.selectedDate }) }, props.row.rowId));
+        }, children: jsx(SchedulerRow, { events: props.events, backgroundEvents: props.backgroundEvents, indicatorRows: props.indicatorRows, rowHeader: header, EventComp: props.EventComp, BackgroundEventComp: props.BackgroundEventComp, RowTitleComp: props.RowTitleComp, weekendLines: props.weekendLines, divisionLines: props.divisionLines, timeLinePercentage: props.timeLinePercentage, rowHeightInRem: props.rowHeightRem, maxEventHeightRem: props.maxEventHeightRem, onEvent: props.onEvent, contextMenuItems: props.contextMenuItems, visibleDays: props.visibleDays, selectedDate: props.selectedDate }) }, props.row.rowId));
 });
 // Outer (unmemoised) row: looks up per-row buckets from the shared `data`
 // object and forwards them as flat props to `RowContent`. Because the
@@ -9245,7 +9052,7 @@ const Row = ({ index, style, data }) => {
     const rowColor = data.groupRowColors
         ? Math.floor(index / 2) % 2 === 0 ? data.evenColor : data.oddColor
         : index % 2 === 0 ? data.evenColor : data.oddColor;
-    return (jsx(RowContent, { style: style, row: row, rowColor: rowColor, events: data.eventsByRow.get(row.rowId) ?? EMPTY_EVENTS, backgroundEvents: data.backgroundEventsByRow.get(row.rowId) ?? EMPTY_BG_EVENTS, indicatorRows: data.indicatorRowsByRow.get(row.rowId) ?? EMPTY_INDICATORS, EventComp: data.EventComp, BackgroundEventComp: data.BackgroundEventComp, RowTitleComp: data.RowTitleComp, rowHeaderWidth: data.rowHeaderWidth, rowHeightRem: row.rowHeightRem ?? data.rowHeightRem, weekendLines: data.weekendLines, divisionLines: data.divisionLines, timeLinePercentage: data.timeLinePercentage, selectedDate: data.selectedDate, visibleDays: data.visibleDays, contextMenuItems: data.contextMenuItems, onEvent: data.onEvent }));
+    return (jsx(RowContent, { style: style, row: row, rowColor: rowColor, events: data.eventsByRow.get(row.rowId) ?? EMPTY_EVENTS, backgroundEvents: data.backgroundEventsByRow.get(row.rowId) ?? EMPTY_BG_EVENTS, indicatorRows: data.indicatorRowsByRow.get(row.rowId) ?? EMPTY_INDICATORS, EventComp: data.EventComp, BackgroundEventComp: data.BackgroundEventComp, RowTitleComp: data.RowTitleComp, rowHeaderWidth: data.rowHeaderWidth, rowHeightRem: row.rowHeightRem ?? data.rowHeightRem, maxEventHeightRem: data.maxEventHeightRem, weekendLines: data.weekendLines, divisionLines: data.divisionLines, timeLinePercentage: data.timeLinePercentage, selectedDate: data.selectedDate, visibleDays: data.visibleDays, contextMenuItems: data.contextMenuItems, onEvent: data.onEvent }));
 };
 // Bucket items by rowId, but reuse previous bucket arrays whenever a row's
 // contents have not changed. Keeping bucket references stable is essential
@@ -9275,7 +9082,7 @@ const groupByRowIdStable = (items, prev) => {
     return next;
 };
 const Scheduler = (props) => {
-    const { header: headerContent, id, events: eventsState, backgroundEvents, indicatorRows: allIndicatorRows = [], contextMenuItems, EventComp, RowTitleComp, orderCategories = ["title"], useOrderCategory, onEvent, groupRowColors, rowHeaderWidth = 180, rowHeightRem = 1.75, } = props;
+    const { header: headerContent, id, events: eventsState, backgroundEvents, indicatorRows: allIndicatorRows = [], contextMenuItems, EventComp, RowTitleComp, orderCategories = ["title"], useOrderCategory, onEvent, groupRowColors, rowHeaderWidth = 180, rowHeightRem = 1.75, maxEventHeightRem, } = props;
     const BackgroundEventComp = props.BackgroundEventComp ?? BackgroundEvent;
     const [constraintElement, setConstraintElement] = useState(null);
     const rows = useOrderCategory === false
@@ -9359,6 +9166,7 @@ const Scheduler = (props) => {
         RowTitleComp: RowTitleComp,
         rowHeaderWidth,
         rowHeightRem,
+        maxEventHeightRem,
         weekendLines: weekendsLines,
         divisionLines,
         timeLinePercentage,
@@ -9379,6 +9187,7 @@ const Scheduler = (props) => {
         RowTitleComp,
         rowHeaderWidth,
         rowHeightRem,
+        maxEventHeightRem,
         weekendsLines,
         divisionLines,
         timeLinePercentage,
@@ -9759,6 +9568,7 @@ const PinRowHeader = ({ value, width, onEvent }) => {
             onEvent(new OnClickContextMenu(value.rowId, key));
         }, children: jsx(CwTooltipNew, { content: value.tooltip, position: "right", dissapearsWhenHover: true, children: jsxs("div", { style: {
                     width: width,
+                    flexShrink: 0,
                     height: "100%",
                     background: highlightColor
                 }, className: styles["super-scheduler-row-header"], children: [jsx("button", { className: "cw-button-icon cwi-pin", "data-pinned": value.isPinned, onClick: (_) => {
@@ -9772,13 +9582,13 @@ const PinRowHeader = ({ value, width, onEvent }) => {
                                         jsxs("span", { className: styles["scheduler-crewmember-functions"], children: ["(", value.title3, ")"] }), value.subtitle2 && jsxs("span", { children: ["-", value.subtitle2] })] })] }), isLoading ? jsx("span", { className: "cwi-icons cwi-spinner" }) : undefined] }) }, value.rowId) }, value.rowId);
 };
 
-const SuperScheduler = ({ id, state, header, rows, events, headerColumnComp, pinnedOrderCategory, unPinnedOrderCategory, backgroundEvents, indicatorRows = [], contextMenuItems, onEvent, rowHeightRem = 1.75 }) => {
+const SuperScheduler = ({ id, state, header, rows, events, headerColumnComp, pinnedOrderCategory, unPinnedOrderCategory, backgroundEvents, indicatorRows = [], contextMenuItems, onEvent, rowHeightRem = 1.75, rowHeaderWidth, maxEventHeightRem, }) => {
     const pinnedRows = rows.filter((it) => it.isPinned);
     const notPinnedRows = rows.filter((it) => !it.isPinned);
     const isFirstVisible = pinnedRows.length > 0;
-    return (jsxs(Fragment, { children: [isFirstVisible && (jsxs(Fragment, { children: [jsx(Scheduler, { id: `${id}-pinned`, state: state, header: header, rows: pinnedRows, events: events, backgroundEvents: backgroundEvents, indicatorRows: indicatorRows, contextMenuItems: contextMenuItems, orderCategories: pinnedOrderCategory, onEvent: onEvent, EventComp: SchedulerEvent, RowTitleComp: headerColumnComp, rowHeightRem: rowHeightRem }), jsx("div", { children: jsx(CwButton, { onClick: () => {
+    return (jsxs(Fragment, { children: [isFirstVisible && (jsxs(Fragment, { children: [jsx(Scheduler, { id: `${id}-pinned`, state: state, header: header, rows: pinnedRows, events: events, backgroundEvents: backgroundEvents, indicatorRows: indicatorRows, contextMenuItems: contextMenuItems, orderCategories: pinnedOrderCategory, onEvent: onEvent, EventComp: SchedulerEvent, RowTitleComp: headerColumnComp, rowHeightRem: rowHeightRem, rowHeaderWidth: rowHeaderWidth, maxEventHeightRem: maxEventHeightRem }), jsx("div", { children: jsx(CwButton, { onClick: () => {
                                 onEvent(new OnClearPinned());
-                            }, children: "Clear pinned" }) })] })), jsx(Scheduler, { id: `${id}-notPinned`, state: { ...state, isHeaderVisible: !isFirstVisible }, header: header, rows: notPinnedRows, events: events, backgroundEvents: backgroundEvents, indicatorRows: indicatorRows, contextMenuItems: contextMenuItems, orderCategories: unPinnedOrderCategory, onEvent: onEvent, EventComp: SchedulerEvent, RowTitleComp: headerColumnComp, rowHeightRem: rowHeightRem })] }));
+                            }, children: "Clear pinned" }) })] })), jsx(Scheduler, { id: `${id}-notPinned`, state: { ...state, isHeaderVisible: !isFirstVisible }, header: header, rows: notPinnedRows, events: events, backgroundEvents: backgroundEvents, indicatorRows: indicatorRows, contextMenuItems: contextMenuItems, orderCategories: unPinnedOrderCategory, onEvent: onEvent, EventComp: SchedulerEvent, RowTitleComp: headerColumnComp, rowHeightRem: rowHeightRem, rowHeaderWidth: rowHeaderWidth, maxEventHeightRem: maxEventHeightRem })] }));
 };
 
 /**
@@ -10215,4 +10025,4 @@ const CwFindCrewmember = ({ handleChange, placeHolder = "Search crew…", requir
         }, "data-direction": direction, children: [jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { className: "cw-search-input-wrapper", ref: wrapperRef, children: [jsx("input", { ref: inputRef, type: "text", value: inputValue, onChange: handleInputChange, onKeyDown: handleKeyDown, onFocus: handleInputFocus, placeholder: isInitialLoading ? "Loading…" : placeHolder, disabled: disabled, required: required, autoComplete: "off", "aria-expanded": showDropdown, "aria-haspopup": "listbox", role: "combobox", title: tooltipText }), (isLoading || isInitialLoading) && (jsx("div", { className: "cw-search-input-loading", children: jsx(CwIcon, { iconId: "spinner" }) })), jsx("div", { className: "cw-search-input-icons", children: inputValue && !disabled && !isInitialLoading ? (jsx(CwButton, { type: "button", onClick: handleClear, "aria-label": "Clear selected crewmember", variant: "icon", icon: "close", color: "neutral" })) : (jsx(CwIcon, { iconId: "person" })) })] })] }), renderPanel(jsx("div", { ref: panelRef, className: dropdownStyles.dropdown, style: panelStyle, role: "listbox", children: jsx("ul", { children: options.map((option, index) => (jsx("li", { className: `${dropdownStyles.option}${index === highlightedIndex ? ` ${dropdownStyles.optionFocused}` : ""}`, onClick: () => handleOptionSelect(option.value), onMouseDown: (e) => e.preventDefault(), onMouseEnter: () => setHighlightedIndex(index), role: "option", "aria-selected": index === highlightedIndex, children: option.text }, option.value))) }) }))] }));
 };
 
-export { CblDragAndDrop, CwAccordionContainer, CwAlign, CwAnchoredMenu, CwBtnDelete, CwBtnEdit, CwBtnSave, CwButton, CwCard, CwCardList, CwCheck, CwCheckbox, CwCheckboxGroup, CwChip, CwColorPicker, CwConfirmationPopup, CwContextMenu, CwDatePicker, CwDatePickerTemporal, CwDateRangePicker, CwDateTimePicker, CwDateTimePickerCompact, CwDialog, CwDialogManager, CwDigit, CwDisplayMessage, CwDropdown, CwDropdownFilter, CwExpandable, CwFileUpload, CwFileUploadMultiple, CwFindAirport, CwFindCrewmember, CwGenericTooltip, CwHeadingMain, CwHeadingSecond, CwIcon, CwImageArea, CwImageGallery, CwImageZoom, CwInput, CwInputColor, CwInputDate, CwInputDatePicker, CwInputDateText, CwInputDatetime, CwInputImage, CwInputNumber, CwInputPhone, CwInputText, CwKeyValueList, CwLabel, CwLoading, CwLoadingSmall, CwMasterDetail, CwMessage, CwMessageManager, CwMessageType, CwModal, CwModalHover, CwModalReportFunctional, CwMultiFilter, CwMultiFilterTag, CwNote, CwOption, CwPopoverButton, CwReportModal, CwScheduler, CwSearchInput, CwSelect, CwSelectList, CwSelectListItems, CwSortableList, CwSortableTable, CwSuperScheduler, CwTable, CwTableGrouped, CwTableServerSide, CwTabs, CwTagSelector, CwTextArea, CwTime, CwTimePicker, CwToggle, CwTooltipManager, CwTooltipNew, CwTreeView, CwWeekdaySelector, DefaultRowHeader, OnClearPinned, OnClickContextMenu, OnClickEvent, OnClickRowEvent, OnClickRowHeader, OnClickUtc, OnDoubleClickEvent, OnDoubleClickRowEvent, OnDragEvent, OnDropCtrlEvent, OnDropEvent, OnEndClickHeaderEvent, OnLeftDragStart, OnMultiClickEvent, OnPinRow, OnRangeClickEvent, OnRightClickEvent, OnRightClickRow, OnRightDragStart, OnStartClickHeaderEvent, OnUnpinRow, PinRowHeader, Resource, Scheduler, SchedulerEvent, SuperScheduler, TooltipConstraintContext, UiEvent, Weekdays, cblEvent, eventIsVisible, filterVisibleEvents, getDefaultDivisions, getEventSizes, itemsToMultiFilterTags, useCwMessage, useSortableList, useSortableTable, useTooltipConstraint };
+export { CblDragAndDrop, CwAccordionContainer, CwAlign, CwAnchoredMenu, CwBtnApprove, CwBtnCancel, CwBtnDelete, CwBtnEdit, CwBtnSave, CwButton, CwCard, CwCardList, CwCheck, CwCheckbox, CwCheckboxGroup, CwChip, CwColorPicker, CwConfirmationPopup, CwContextMenu, CwDatePicker, CwDatePickerTemporal, CwDateRangePicker, CwDateTimePicker, CwDateTimePickerCompact, CwDialog, CwDigit, CwDisplayMessage, CwDropdown, CwDropdownFilter, CwExpandable, CwFileUpload, CwFileUploadMultiple, CwFindAirport, CwFindCrewmember, CwGenericTooltip, CwHeadingMain, CwHeadingSecond, CwIcon, CwImageArea, CwImageGallery, CwImageZoom, CwInput, CwInputColor, CwInputDateText, CwInputDatetime, CwInputImage, CwInputNumber, CwInputPhone, CwInputText, CwKeyValueList, CwLabel, CwLoading, CwLoadingSmall, CwMasterDetail, CwMessage, CwMessageManager, CwMessageType, CwModal, CwModalHover, CwModalReportFunctional, CwMultiFilter, CwMultiFilterTag, CwNote, CwOption, CwPopoverButton, CwReportModal, CwScheduler, CwSearchInput, CwSelect, CwSelectList, CwSelectListItems, CwSortableList, CwSortableTable, CwSuperScheduler, CwTable, CwTableGrouped, CwTableServerSide, CwTabs, CwTagSelector, CwTextArea, CwTime, CwTimePicker, CwToggle, CwTooltipManager, CwTooltipNew, CwTreeView, CwWeekdaySelector, DefaultRowHeader, OnClearPinned, OnClickContextMenu, OnClickEvent, OnClickRowEvent, OnClickRowHeader, OnClickUtc, OnDoubleClickEvent, OnDoubleClickRowEvent, OnDragEvent, OnDropCtrlEvent, OnDropEvent, OnEndClickHeaderEvent, OnLeftDragStart, OnMultiClickEvent, OnPinRow, OnRangeClickEvent, OnRightClickEvent, OnRightClickRow, OnRightDragStart, OnStartClickHeaderEvent, OnUnpinRow, PinRowHeader, Resource, Scheduler, SchedulerEvent, SuperScheduler, TooltipConstraintContext, UiEvent, Weekdays, cblEvent, eventIsVisible, filterVisibleEvents, getDefaultDivisions, getEventSizes, itemsToMultiFilterTags, useCwMessage, useSortableList, useSortableTable, useTooltipConstraint };