@cwellt_software/cwellt-reactjs-lib 1.4.6 → 1.4.8

package/dist/index.d.ts

@@ -624,7 +624,7 @@ interface CwCardProps {
     title?: ReactNode;
     /*** Card subtitle content **/
     subtitle?: ReactNode;
-    /*** Card header alignment **/
+    /** @deprecated Use layout.align instead ("left" → "start", "center" → "center") **/
     alignment?: "center" | "left";
     /*** Main content of the card **/
     children: ReactNode;
@@ -652,8 +652,10 @@ interface CwCardProps {
     chips?: CardChip[];
     /*** Variant design **/
     variant?: "border" | "shadow";
-    /*** Flex direction **/
+    /** @deprecated Use layout.direction instead **/
     direction?: "column" | "row";
+    /** Card layout: direction controls card flex direction; align controls header content alignment **/
+    layout?: CwLayoutProps;
 }
 /**
 * CwCard - A simple card component for displaying content in a contained format
@@ -701,8 +703,10 @@ interface CwCardListProps<T> extends React__default.HTMLAttributes<HTMLDivElemen
     sortOptions?: SortOption<T>[];
     /** Default sort key */
     defaultSortKey?: string;
+    /** Extracts a stable unique key from each item to avoid index-based reconciliation bugs */
+    keyExtractor?: (item: T, index: number) => string | number;
 }
-declare function CwCardList<T>({ items, renderCard, pageSize, layout, defaultCardWidth, cardGap, isLoading, emptyState, sortOptions, defaultSortKey, ...htmlProps }: CwCardListProps<T>): react_jsx_runtime.JSX.Element;
+declare function CwCardList<T>({ items, renderCard, pageSize, layout, defaultCardWidth, cardGap, isLoading, emptyState, sortOptions, defaultSortKey, keyExtractor, ...htmlProps }: CwCardListProps<T>): react_jsx_runtime.JSX.Element;
 
 interface CwAccordionContainerProps {
     children?: any;
@@ -3274,21 +3278,22 @@ interface PinRowHeaderProps extends RowHeaderDm {
 }
 declare const PinRowHeader: FC<RowHeaderProps<PinRowHeaderProps>>;
 
-interface SuperSchedulerProps {
+interface SuperSchedulerProps<T extends PinRowHeaderProps> {
     id: string;
     state: SchedulerState;
     header: SchedulerHeaderContent;
-    rows: PinRowHeaderProps[];
+    rows: T[];
+    headerColumnComp: React.ComponentType<RowHeaderProps<T>>;
     events: SchedulerEventDm[];
     backgroundEvents: BackgroundEventDm[];
     indicatorRows?: IndicatorRowDm[];
     contextMenuItems: MenuOption[];
-    pinnedOrderCategory?: OrderCategory<PinRowHeaderProps>[];
-    unPinnedOrderCategory?: OrderCategory<PinRowHeaderProps>[];
+    pinnedOrderCategory?: OrderCategory<T>[];
+    unPinnedOrderCategory?: OrderCategory<T>[];
     onEvent: OnEvent;
     rowHeightRem?: number;
 }
-declare const SuperScheduler: FC<SuperSchedulerProps>;
+declare const SuperScheduler: <T extends PinRowHeaderProps>({ id, state, header, rows, events, headerColumnComp, pinnedOrderCategory, unPinnedOrderCategory, backgroundEvents, indicatorRows, contextMenuItems, onEvent, rowHeightRem }: SuperSchedulerProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare class OnPinRow implements UiEvent {
     readonly id: string;

package/dist/index.es.js

@@ -1737,7 +1737,9 @@ var styles$n = {"card":"cw-card-module__card__HJUT0","clickable":"cw-card-module
 *   <p>This is the main content of the card.</p>
 * </CwCard>
 **/
-const CwCard = ({ id, title, subtitle, alignment = 'center', children, footer, onEdit, onDelete, extraActions, className = '', clickable = false, onClick, isLoading = false, disabled = false, style, chips = [], variant = "border", direction = "column", }) => {
+const CwCard = ({ id, title, subtitle, alignment = 'center', children, footer, onEdit, onDelete, extraActions, className = '', clickable = false, onClick, isLoading = false, disabled = false, style, chips = [], variant = "border", direction = "column", layout, }) => {
+    const resolvedDirection = layout?.direction ?? direction;
+    const resolvedAlign = layout?.align ?? (alignment === 'left' ? 'start' : 'center');
     // Construct class names using CSS modules
     const cardClassNames = [
         'cw-card',
@@ -1756,23 +1758,77 @@ const CwCard = ({ id, title, subtitle, alignment = 'center', children, footer, o
     // Determine if actions should be rendered
     const hasActions = onEdit || onDelete || extraActions;
     // Determine if header should be rendered
-    const hasHeader = title || subtitle || (hasActions && direction === "column");
+    const hasHeader = title || subtitle || (hasActions && resolvedDirection === "column");
     // Determine if chips should be rendered
     const hasChips = chips.length > 0;
     // Determine if footer should be rendered
-    const hasFooter = hasChips || footer || (hasActions && direction === "row");
+    const hasFooter = hasChips || footer || (hasActions && resolvedDirection === "row");
     // Actions component to reuse
     const ActionsComponent = hasActions && !disabled ? (jsxs("div", { className: styles$n.actions, children: [extraActions ?? null, onEdit && jsx(CwButton, { variant: "icon", icon: "edit", onClick: onEdit }), onDelete && jsx(CwButton, { variant: "icon", icon: "delete", color: "danger", onClick: onDelete })] })) : null;
     return (jsxs("div", { ...(id && { id }), className: cardClassNames, ...(style && { style }), ...(clickable && {
             role: 'button',
             tabIndex: 0,
             onClick: handleClick,
-        }), "data-variant": variant, "data-direction": direction, children: [hasHeader && (jsxs("header", { children: [(title || subtitle) && (jsxs("div", { className: styles$n.headerContent, "data-alignment": alignment, children: [title && jsx("h5", { children: title }), subtitle && jsx("strong", { children: subtitle })] })), direction === "column" && ActionsComponent] })), jsx("div", { className: styles$n.content, children: children }), hasFooter && (jsxs("footer", { children: [hasChips && (jsx("div", { className: styles$n.footerTags, children: chips.map((chip, index) => (jsx(CwChip, { label: chip.label, colorScheme: chip.colorScheme, className: styles$n.chip, ...(chip.customColor && { customColor: chip.customColor }), ...(chip.variant && { variant: chip.variant }), ...(chip.icon && { icon: chip.icon }) }, index))) })), footer && (jsx("div", { className: styles$n.footerContent, children: footer }))] })), direction === "row" && ActionsComponent, isLoading && (jsx("div", { className: styles$n.loadingOverlay, children: jsx(CwLoading, { isLoading: isLoading, size: "small" }) }))] }));
+        }), "data-variant": variant, "data-direction": resolvedDirection, children: [hasHeader && (jsxs("header", { children: [(title || subtitle) && (jsxs("div", { className: styles$n.headerContent, "data-align": resolvedAlign, children: [title && jsx("h5", { children: title }), subtitle && jsx("strong", { children: subtitle })] })), resolvedDirection === "column" && ActionsComponent] })), jsx("div", { className: styles$n.content, children: children }), hasFooter && (jsxs("footer", { children: [hasChips && (jsx("div", { className: styles$n.footerTags, children: chips.map((chip, index) => (jsx(CwChip, { label: chip.label, colorScheme: chip.colorScheme, className: styles$n.chip, ...(chip.customColor && { customColor: chip.customColor }), ...(chip.variant && { variant: chip.variant }), ...(chip.icon && { icon: chip.icon }) }, index))) })), footer && (jsx("div", { className: styles$n.footerContent, children: footer }))] })), resolvedDirection === "row" && ActionsComponent, isLoading && (jsx("div", { className: styles$n.loadingOverlay, children: jsx(CwLoading, { isLoading: isLoading, size: "small" }) }))] }));
 };
 
-var styles$m = {"cardContainer":"cw-card-list-module__cardContainer__l3YEh","pagination":"cw-card-list-module__pagination__5Ay78","pageInfo":"cw-card-list-module__pageInfo__uiMel","loading":"cw-card-list-module__loading__cYpND","emptyState":"cw-card-list-module__emptyState__RlqiS","sortControls":"cw-card-list-module__sortControls__mWgZA"};
+var styles$m = {"cardContainer":"cw-card-list-module__cardContainer__l3YEh","pagination":"cw-card-list-module__pagination__5Ay78","pageInfo":"cw-card-list-module__pageInfo__uiMel","loading":"cw-card-list-module__loading__cYpND","emptyState":"cw-card-list-module__emptyState__RlqiS"};
 
-function CwCardList({ items, renderCard, pageSize = 10, layout = 'grid', defaultCardWidth = 320, cardGap = 16, isLoading = false, emptyState, sortOptions = [], defaultSortKey, ...htmlProps }) {
+/**
+ * Option to display in the CwSelect
+ * @remarks
+ * Must be child of CwSelect
+ * @example
+ * <CwSelect>
+ *   <CwOption>A</CwOption>
+ *   <CwOption color="#4a90d9">Blue option</CwOption>
+ *   <CwOption>C</CwOption>
+ * </CwSelect>
+ */
+function CwOption(props) {
+    const { text, color, style, ...optionProps } = props;
+    const mergedStyle = color
+        ? { ...style, backgroundColor: color, color: getContrastColor(color) }
+        : style;
+    return (jsx("option", { className: "cw-option", style: mergedStyle, ...optionProps, children: optionProps.children ?? text }));
+}
+
+/**
+ * Input for selecting an option from a list
+ * @remarks
+ * ```txt
+ * CwIcon  CwLabel     CwSelect        CwButton
+ *  ↑      ↑           ↑               ↑
+ *              ╭────────────────────╮╭════╮
+ *  ⌂   Cat:    │  Choose a cat   ╲╱ │║ Ok ║
+ *              ╰────────────────────╯╰════╯
+ *              │ Orange             │ ← CwOption
+ *              ├────────────────────┤
+ *              │ Black              │ ← CwOption
+ *              ├────────────────────┤
+ *              │ White              │ ← CwOption
+ *              ╰────────────────────╯
+ * ```
+ * @example
+ * <CwSelect name="cat" iconProps={{iconId:"pet"}} labelProps={{children:"Cat:"}}>
+ *   <CwOption value="" > - Choose a cat - </CwOption>
+ *   <CwOption value="o" >Orange</CwOption>
+ *   <CwOption value="b" >Black</CwOption>
+ *   <CwOption value="w" >White</CwOption>
+ * </CwSelect>
+ */
+function CwSelect(props) {
+    const { alignProps, labelProps, buttonProps, iconProps, placeholder, feedback, 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)))] }));
+}
+
+function CwCardList({ items, renderCard, pageSize = 10, layout = 'grid', defaultCardWidth = 320, cardGap = 16, isLoading = false, emptyState, sortOptions = [], defaultSortKey, keyExtractor, ...htmlProps }) {
     const [currentPage, setCurrentPage] = useState(1);
     const [sortKey, setSortKey] = useState(defaultSortKey || sortOptions[0]?.key || '');
     const [sortDirection, setSortDirection] = useState('asc');
@@ -1804,7 +1860,12 @@ function CwCardList({ items, renderCard, pageSize = 10, layout = 'grid', default
         '--card-width': `${defaultCardWidth}px`,
         '--card-gap': `${cardGap}px`
     };
-    return (jsxs("div", { ...htmlProps, children: [sortOptions.length > 0 && (jsxs("div", { className: styles$m.sortControls, children: [jsx("label", { htmlFor: "cardlist-sort-select", children: "Sort by:" }), jsx("select", { id: "cardlist-sort-select", value: sortKey, onChange: (e) => handleSortChange(e.target.value), className: styles$m.sortSelect, children: sortOptions.map(option => (jsx("option", { value: option.key, children: option.label }, option.key))) }), jsx("button", { onClick: () => setSortDirection(prev => prev === 'asc' ? 'desc' : 'asc'), className: `cw-button-icon ${sortDirection === 'asc' ? 'cwi-arrow-up' : 'cwi-arrow-down'}`, title: `Sort ${sortDirection === 'asc' ? 'descending' : 'ascending'}` })] })), isLoading ? (jsx("div", { className: styles$m.loading, children: jsx(CwLoading, { isLoading: isLoading }) })) : sortedItems.length === 0 ? (jsx("div", { className: styles$m.emptyState, children: emptyState || jsx("p", { children: "No items to display" }) })) : (jsxs(Fragment, { children: [jsx("div", { className: `${styles$m.cardContainer}`, "data-layout": layout, style: gridStyle, children: visibleItems.map((item, index) => (jsx("div", { className: styles$m.cardWrapper, children: renderCard(item, index) }, index))) }), totalPages > 1 && (jsxs("div", { className: styles$m.pagination, children: [jsx("button", { disabled: currentPage === 1, onClick: () => setCurrentPage(p => Math.max(1, p - 1)), className: "cw-button-icon cwi-chevron-left" }), jsxs("span", { className: styles$m.pageInfo, children: [currentPage, " of ", totalPages] }), jsx("button", { disabled: currentPage === totalPages, onClick: () => setCurrentPage(p => Math.min(totalPages, p + 1)), className: "cw-button-icon cwi-chevron-right" })] }))] }))] }));
+    return (jsxs("div", { ...htmlProps, children: [sortOptions.length > 0 && (jsx("header", { className: "cw-flex-row cw-align-right-center cw-margin-bottom-small", children: jsx(CwSelect, { labelProps: { text: 'Sort by:', labelWidth: "4rem" }, alignProps: { alignItems: 'center' }, buttonProps: {
+                        variant: 'icon',
+                        icon: sortDirection === 'asc' ? 'arrow-up' : 'arrow-down',
+                        onClick: () => setSortDirection(prev => prev === 'asc' ? 'desc' : 'asc'),
+                        title: `Sort ${sortDirection === 'asc' ? 'descending' : 'ascending'}`,
+                    }, value: sortKey, onChange: (e) => handleSortChange(e.target.value), children: sortOptions.map(option => (jsx(CwOption, { value: option.key, children: option.label }, option.key))) }) })), isLoading ? (jsx("div", { className: styles$m.loading, children: jsx(CwLoading, { isLoading: isLoading }) })) : sortedItems.length === 0 ? (jsx("div", { className: styles$m.emptyState, children: emptyState || jsx("p", { children: "No items to display" }) })) : (jsxs(Fragment, { children: [jsx("div", { className: `${styles$m.cardContainer}`, "data-layout": layout, style: gridStyle, children: visibleItems.map((item, index) => (jsx(React__default.Fragment, { children: renderCard(item, index) }, keyExtractor ? keyExtractor(item, index) : index))) }), totalPages > 1 && (jsxs("div", { className: styles$m.pagination, children: [jsx(CwButton, { variant: "icon", icon: "chevron-left", disabled: currentPage === 1, onClick: () => setCurrentPage(p => Math.max(1, p - 1)) }), jsxs("span", { className: styles$m.pageInfo, children: [currentPage, " / ", totalPages] }), jsx(CwButton, { variant: "icon", icon: "chevron-right", disabled: currentPage === totalPages, onClick: () => setCurrentPage(p => Math.min(totalPages, p + 1)) })] }))] }))] }));
 }
 
 var styles$l = {"cw-accordion":"cw-accordion-module__cw-accordion__ErvlW","cw-accordion-body":"cw-accordion-module__cw-accordion-body__xlI8b"};
@@ -4237,60 +4298,6 @@ function CwToggle(props) {
                     type: "checkbox", ...inputProps })] }) }));
 }
 
-/**
- * Option to display in the CwSelect
- * @remarks
- * Must be child of CwSelect
- * @example
- * <CwSelect>
- *   <CwOption>A</CwOption>
- *   <CwOption color="#4a90d9">Blue option</CwOption>
- *   <CwOption>C</CwOption>
- * </CwSelect>
- */
-function CwOption(props) {
-    const { text, color, style, ...optionProps } = props;
-    const mergedStyle = color
-        ? { ...style, backgroundColor: color, color: getContrastColor(color) }
-        : style;
-    return (jsx("option", { className: "cw-option", style: mergedStyle, ...optionProps, children: optionProps.children ?? text }));
-}
-
-/**
- * Input for selecting an option from a list
- * @remarks
- * ```txt
- * CwIcon  CwLabel     CwSelect        CwButton
- *  ↑      ↑           ↑               ↑
- *              ╭────────────────────╮╭════╮
- *  ⌂   Cat:    │  Choose a cat   ╲╱ │║ Ok ║
- *              ╰────────────────────╯╰════╯
- *              │ Orange             │ ← CwOption
- *              ├────────────────────┤
- *              │ Black              │ ← CwOption
- *              ├────────────────────┤
- *              │ White              │ ← CwOption
- *              ╰────────────────────╯
- * ```
- * @example
- * <CwSelect name="cat" iconProps={{iconId:"pet"}} labelProps={{children:"Cat:"}}>
- *   <CwOption value="" > - Choose a cat - </CwOption>
- *   <CwOption value="o" >Orange</CwOption>
- *   <CwOption value="b" >Black</CwOption>
- *   <CwOption value="w" >White</CwOption>
- * </CwSelect>
- */
-function CwSelect(props) {
-    const { alignProps, labelProps, buttonProps, iconProps, placeholder, feedback, 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)))] }));
-}
-
 // ─── Default strategy: below anchor, match width, flip above if needed ────────
 function defaultPositionStrategy(anchorRect, panelRect) {
     const panelH = panelRect?.height ?? 200;
@@ -4764,7 +4771,6 @@ var styles$8 = {"cw-multi-filter-catalog-container":"cw-multi-filter-module__cw-
  * @returns Set the `onChange` callback to a function to check for changes in the selected filters
  */
 const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeholder = "Write to filter", allCategoriesLabel = "ALL CATEGORIES", className, style }) => {
-    const [filteredTags, setFilteredTags] = useState(new Set());
     const [inputTextValue, setInputTextValue] = useState("");
     const [isPanelOpen, setIsPanelOpen] = useState(false);
     const [selectedCategory, setSelectedCategory] = useState("All");
@@ -4774,7 +4780,7 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
     const { panelRef, panelStyle, renderPanel } = useDropdownPortal({
         anchorRef: wrapperRef,
         isOpen: isPanelOpen,
-        onClose: () => { setIsPanelOpen(false); setFilteredTags(getUnselectedAll()); setSelectedCategory("All"); setInputTextValue(""); },
+        onClose: () => { setIsPanelOpen(false); setSelectedCategory("All"); setInputTextValue(""); },
     });
     useEffect(() => {
         // Outside-click is now handled by useDropdownPortal
@@ -4788,10 +4794,19 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
         });
         return categoriesMap;
     };
-    const getUnselectedAll = (excluded = selectedTags) => new Set(Array.from(allTags).filter(tag => !Array.from(excluded).some(t => t.ID === tag.ID)));
+    const displayTags = useMemo(() => {
+        let tags = Array.from(allTags);
+        if (selectedCategory !== "All") {
+            tags = tags.filter(t => t.Category === selectedCategory);
+        }
+        if (inputTextValue.trim() !== "") {
+            const input = inputTextValue.trim().replaceAll(" ", "").toLowerCase();
+            tags = tags.filter(t => t.Name.replaceAll(" ", "").toLowerCase().includes(input));
+        }
+        return tags;
+    }, [allTags, selectedCategory, inputTextValue]);
     const handleClickCategory = (category) => {
         setSelectedCategory(category);
-        setFilteredTags(category !== "All" ? (categoriesMappedToTags().get(category) ?? new Set()) : getUnselectedAll());
     };
     const rgbAString = (r, g, b) => {
         return `rgb(${r}, ${g}, ${b})`;
@@ -4815,36 +4830,15 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
     const handleInputText = (input) => {
         if (selectedCategory !== "All")
             setSelectedCategory("All");
-        input = input.trimStart();
-        setInputTextValue(input);
-        if (input !== "") {
-            const newFilterTags = Array.from(allTags).filter(tag => !Array.from(selectedTags).some(t => t.ID === tag.ID) &&
-                tag.Name.replaceAll(" ", "").toLowerCase().includes(input.replaceAll(" ", "").toLowerCase()));
-            setFilteredTags(new Set(newFilterTags));
-        }
-        else {
-            setFilteredTags(getUnselectedAll());
-        }
+        setInputTextValue(input.trimStart());
     };
     const addTag = (newTag) => {
-        newTag.Selected = true;
-        newTag.Removable = true;
-        newTag.Selectable = false;
         if (selectedTags.has(newTag) || Array.from(selectedTags).some(t => t.ID === newTag.ID)) {
             return;
         }
-        else {
-            const updatedTags = new Set(selectedTags).add(newTag);
-            onChangeSelectedTags(updatedTags);
-            setInputTextValue("");
-            setFilteredTags(selectedCategory === "All" ? getUnselectedAll(updatedTags) : prev => {
-                const next = new Set(prev);
-                const toRemove = Array.from(next).find(t => t.ID === newTag.ID);
-                if (toRemove)
-                    next.delete(toRemove);
-                return next;
-            });
-        }
+        const updatedTags = new Set(selectedTags).add(newTag);
+        onChangeSelectedTags(updatedTags);
+        setInputTextValue("");
     };
     const removeTag = (id) => {
         const updatedTags = new Set(selectedTags);
@@ -4857,11 +4851,6 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
         }
         onChangeSelectedTags(updatedTags);
     };
-    useEffect(() => {
-        // force to load all tags on first render
-        if (selectedCategory === "All" && filteredTags.size === 0)
-            setFilteredTags(new Set());
-    }, [allTags]);
     const handleDivClick = () => {
         if (inputRef !== null) {
             inputRef.current?.focus();
@@ -4873,9 +4862,9 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
                                     switch (e.key) {
                                         case "Enter":
                                         case "Tab": {
-                                            if (inputTextValue.trim().length > 0 && filteredTags.size > 0) {
+                                            if (inputTextValue.trim().length > 0 && displayTags.length > 0) {
                                                 const input = inputTextValue.trim().toLowerCase();
-                                                const tagsArr = Array.from(filteredTags);
+                                                const tagsArr = displayTags;
                                                 let foundTag = tagsArr.find(tag => tag.Name.trim().toLowerCase() === input);
                                                 if (!foundTag) {
                                                     foundTag = tagsArr.find(tag => tag.Name.trim().toLowerCase().startsWith(input));
@@ -4899,7 +4888,7 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, placeh
                                 } })] }), selectedTags.size > 0 && (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onMouseDown: e => e.preventDefault(), onClick: (e) => { e.stopPropagation(); onChangeSelectedTags(new Set()); setIsPanelOpen(false); }, tabIndex: -1, "aria-label": "Clear all" }))] }), renderPanel(jsxs("section", { ref: panelRef, className: styles$8["cw-multi-filter-catalog-container"], style: panelStyle, children: [jsxs("nav", { children: [jsx("button", { className: selectedCategory === "All" ? styles$8["category-selected"] : undefined, onClick: () => handleClickCategory("All"), children: allCategoriesLabel }), Array.from(categoriesMappedToTags().keys()).map(category => (jsx("button", { className: selectedCategory === category ? styles$8["category-selected"] : undefined, style: {
                                     backgroundColor: getColor(category).primary,
                                     color: getColor(category).onPrimary,
-                                }, onClick: () => handleClickCategory(category), children: category }, category)))] }), jsx("ul", { children: Array.from(filteredTags)
+                                }, onClick: () => handleClickCategory(category), children: category }, category)))] }), jsx("ul", { children: displayTags
                             .sort((a, b) => {
                             const input = inputTextValue.trim().toLowerCase();
                             const aName = a.Name.trim().toLowerCase();
@@ -9783,13 +9772,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, 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 }) => {
     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: PinRowHeader, 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 }), 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: PinRowHeader, 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 })] }));
 };
 
 /**

package/dist/src/components/control/choice/multi-filter/CwMultiFilter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CwMultiFilter.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/choice/multi-filter/CwMultiFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AAI/D,OAAO,EAAoB,qBAAqB,EAAE,KAAK,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAGpH,MAAM,WAAW,kBAAkB;IAClC,qDAAqD;IACrD,EAAE,EAAE,MAAM,CAAC;IACX,sGAAsG;IACtG,oBAAoB,EAAE,CAAC,YAAY,EAAE,GAAG,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrE,uCAAuC;IACvC,OAAO,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAChC,4CAA4C;IAC5C,YAAY,EAAE,GAAG,CAAC,qBAAqB,CAAC,CAAC;IACzC,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4CAA4C;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0IG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA4PhD,CAAC"}
+{"version":3,"file":"CwMultiFilter.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/choice/multi-filter/CwMultiFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAwC,MAAM,OAAO,CAAC;AAIxE,OAAO,EAAoB,qBAAqB,EAAE,KAAK,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAGpH,MAAM,WAAW,kBAAkB;IAClC,qDAAqD;IACrD,EAAE,EAAE,MAAM,CAAC;IACX,sGAAsG;IACtG,oBAAoB,EAAE,CAAC,YAAY,EAAE,GAAG,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrE,uCAAuC;IACvC,OAAO,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAChC,4CAA4C;IAC5C,YAAY,EAAE,GAAG,CAAC,qBAAqB,CAAC,CAAC;IACzC,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4CAA4C;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0IG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA0OhD,CAAC"}

package/dist/src/components/custom/scheduler-new/presentation/logic/getEventSizesTemporal.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Alternative to getEventSizes using Temporal.Instant and Temporal.Duration.
+ * Requires a runtime or polyfill that supports the TC39 Temporal API.
+ */
+export declare const getEventSizesTemporal: (schedulerDate: Temporal.Instant, totalDays: number, startDate: Temporal.Instant, endDate: Temporal.Instant) => {
+    left: number;
+    width: number;
+};
+//# sourceMappingURL=getEventSizesTemporal.d.ts.map

package/dist/src/components/custom/scheduler-new/presentation/logic/getEventSizesTemporal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getEventSizesTemporal.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getEventSizesTemporal.ts"],"names":[],"mappings":"AAAA;;;GAGG;AA0BH,eAAO,MAAM,qBAAqB,GACjC,eAAe,QAAQ,CAAC,OAAO,EAC/B,WAAW,MAAM,EACjB,WAAW,QAAQ,CAAC,OAAO,EAC3B,SAAS,QAAQ,CAAC,OAAO;;;CA8BzB,CAAC"}

package/dist/src/components/custom/super-scheduler/SuperScheduler.d.ts

@@ -1,4 +1,3 @@
-import { FC } from "react";
 import { OnEvent } from "../../../common/functions/dsl/UiEventDSL";
 import type { MenuOption } from "../../control/action/contextmenu/CwAnchoredMenu";
 import { SchedulerHeaderContent } from "../scheduler-new/presentation/components/header/SchedulerHeaderState";
@@ -8,21 +7,22 @@ import type { IndicatorRowDm } from "../scheduler-new/presentation/components/ro
 import { OrderCategory } from "../scheduler-new/presentation/NewScheduler";
 import { SchedulerState } from "../scheduler-new/presentation/state/ui/SchedulerState";
 import { PinRowHeaderProps } from "./PinRowHeader";
-export interface SuperSchedulerProps {
+import { RowHeaderProps } from "../scheduler-new/presentation/components/row/DefaultRowHeader";
+export interface SuperSchedulerProps<T extends PinRowHeaderProps> {
     id: string;
     state: SchedulerState;
     header: SchedulerHeaderContent;
-    rows: PinRowHeaderProps[];
+    rows: T[];
+    headerColumnComp: React.ComponentType<RowHeaderProps<T>>;
     events: SchedulerEventDm[];
     backgroundEvents: BackgroundEventDm[];
     indicatorRows?: IndicatorRowDm[];
     contextMenuItems: MenuOption[];
-    pinnedOrderCategory?: OrderCategory<PinRowHeaderProps>[];
-    unPinnedOrderCategory?: OrderCategory<PinRowHeaderProps>[];
+    pinnedOrderCategory?: OrderCategory<T>[];
+    unPinnedOrderCategory?: OrderCategory<T>[];
     onEvent: OnEvent;
     rowHeightRem?: number;
 }
-export declare const SuperScheduler: FC<SuperSchedulerProps>;
+export declare const SuperScheduler: <T extends PinRowHeaderProps>({ id, state, header, rows, events, headerColumnComp, pinnedOrderCategory, unPinnedOrderCategory, backgroundEvents, indicatorRows, contextMenuItems, onEvent, rowHeightRem }: SuperSchedulerProps<T>) => import("react/jsx-runtime").JSX.Element;
 export declare const _preview: () => import("react/jsx-runtime").JSX.Element;
-export default SuperScheduler;
 //# sourceMappingURL=SuperScheduler.d.ts.map

package/dist/src/components/custom/super-scheduler/SuperScheduler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SuperScheduler.d.ts","sourceRoot":"","sources":["../../../../../src/components/custom/super-scheduler/SuperScheduler.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3B,OAAO,EAAE,OAAO,EAAE,MAAM,0CAA0C,CAAC;AAEnE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iDAAiD,CAAC;AAClF,OAAO,EAAE,sBAAsB,EAAE,MAAM,sEAAsE,CAAC;AAC9G,OAAO,EAAE,iBAAiB,EAAE,MAAM,8DAA8D,CAAC;AACjG,OAAO,EAAkB,gBAAgB,EAAE,MAAM,oDAAoD,CAAC;AACtG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2DAA2D,CAAC;AAChG,OAAO,EAAE,aAAa,EAAa,MAAM,4CAA4C,CAAC;AACtF,OAAO,EAAE,cAAc,EAAE,MAAM,uDAAuD,CAAC;AACvF,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIjE,MAAM,WAAW,mBAAmB;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,sBAAsB,CAAC;IAC/B,IAAI,EAAE,iBAAiB,EAAE,CAAC;IAC1B,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,gBAAgB,EAAE,iBAAiB,EAAE,CAAC;IACtC,aAAa,CAAC,EAAE,cAAc,EAAE,CAAC;IACjC,gBAAgB,EAAE,UAAU,EAAE,CAAC;IAC/B,mBAAmB,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,EAAE,CAAC;IACzD,qBAAqB,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,EAAE,CAAC;IAC3D,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAmElD,CAAC;AAEF,eAAO,MAAM,QAAQ,+CAyBpB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"SuperScheduler.d.ts","sourceRoot":"","sources":["../../../../../src/components/custom/super-scheduler/SuperScheduler.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,EAAC,MAAM,0CAA0C,CAAC;AAEjE,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,iDAAiD,CAAC;AAChF,OAAO,EAAC,sBAAsB,EAAC,MAAM,sEAAsE,CAAC;AAC5G,OAAO,EAAC,iBAAiB,EAAC,MAAM,8DAA8D,CAAC;AAC/F,OAAO,EAAiB,gBAAgB,EAAC,MAAM,oDAAoD,CAAC;AACpG,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,2DAA2D,CAAC;AAC9F,OAAO,EAAC,aAAa,EAAY,MAAM,4CAA4C,CAAC;AACpF,OAAO,EAAC,cAAc,EAAC,MAAM,uDAAuD,CAAC;AACrF,OAAO,EAAe,iBAAiB,EAAC,MAAM,gBAAgB,CAAC;AAG/D,OAAO,EAAC,cAAc,EAAC,MAAM,+DAA+D,CAAC;AAE7F,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,iBAAiB;IAC/D,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,sBAAsB,CAAC;IAC/B,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,gBAAgB,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAA;IACxD,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,gBAAgB,EAAE,iBAAiB,EAAE,CAAC;IACtC,aAAa,CAAC,EAAE,cAAc,EAAE,CAAC;IACjC,gBAAgB,EAAE,UAAU,EAAE,CAAC;IAC/B,mBAAmB,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IACzC,qBAAqB,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3C,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,iBAAiB,EAAG,6KAc3D,mBAAmB,CAAC,CAAC,CAAC,4CAsDvB,CAAC;AAEF,eAAO,MAAM,QAAQ,+CA0BpB,CAAC"}

package/dist/src/components/layout/card/CwCard.d.ts

@@ -1,5 +1,6 @@
 import React, { ReactNode } from 'react';
 import { CwChipProps } from '../../display/text/tag/CwChip';
+import { CwLayoutProps } from '../../../common/interfaces/CwLayoutProps';
 export type CardChip = Omit<CwChipProps, 'closable' | 'onClose' | 'className' | 'style'>;
 export interface CwCardProps {
     /*** Unique identifier for the card **/
@@ -8,7 +9,7 @@ export interface CwCardProps {
     title?: ReactNode;
     /*** Card subtitle content **/
     subtitle?: ReactNode;
-    /*** Card header alignment **/
+    /** @deprecated Use layout.align instead ("left" → "start", "center" → "center") **/
     alignment?: "center" | "left";
     /*** Main content of the card **/
     children: ReactNode;
@@ -36,8 +37,10 @@ export interface CwCardProps {
     chips?: CardChip[];
     /*** Variant design **/
     variant?: "border" | "shadow";
-    /*** Flex direction **/
+    /** @deprecated Use layout.direction instead **/
     direction?: "column" | "row";
+    /** Card layout: direction controls card flex direction; align controls header content alignment **/
+    layout?: CwLayoutProps;
 }
 /**
 * CwCard - A simple card component for displaying content in a contained format

package/dist/src/components/layout/card/CwCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CwCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/card/CwCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,EAAU,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAIpE,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,CAAC,CAAC;AAEzF,MAAM,WAAW,WAAW;IAC3B,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2BAA2B;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC9B,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6EAA6E;IAC7E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,iFAAiF;IACjF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,6DAA6D;IAC7D,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yDAAyD;IACzD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,kDAAkD;IAClD,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,uBAAuB;IACvB,OAAO,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC9B,uBAAuB;IACvB,SAAS,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAwHxC,CAAC"}
+{"version":3,"file":"CwCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/card/CwCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,EAAU,WAAW,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAIzE,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,CAAC,CAAC;AAEzF,MAAM,WAAW,WAAW;IAC3B,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2BAA2B;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oFAAoF;IACpF,SAAS,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC9B,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6EAA6E;IAC7E,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,iFAAiF;IACjF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,6DAA6D;IAC7D,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yDAAyD;IACzD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,kDAAkD;IAClD,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,uBAAuB;IACvB,OAAO,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC9B,gDAAgD;IAChD,SAAS,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IAC7B,oGAAoG;IACpG,MAAM,CAAC,EAAE,aAAa,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA2HxC,CAAC"}

package/dist/src/components/layout/card/CwCardList.d.ts

@@ -25,6 +25,8 @@ export interface CwCardListProps<T> extends React.HTMLAttributes<HTMLDivElement>
     sortOptions?: SortOption<T>[];
     /** Default sort key */
     defaultSortKey?: string;
+    /** Extracts a stable unique key from each item to avoid index-based reconciliation bugs */
+    keyExtractor?: (item: T, index: number) => string | number;
 }
-export declare function CwCardList<T>({ items, renderCard, pageSize, layout, defaultCardWidth, cardGap, isLoading, emptyState, sortOptions, defaultSortKey, ...htmlProps }: CwCardListProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function CwCardList<T>({ items, renderCard, pageSize, layout, defaultCardWidth, cardGap, isLoading, emptyState, sortOptions, defaultSortKey, keyExtractor, ...htmlProps }: CwCardListProps<T>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=CwCardList.d.ts.map

package/dist/src/components/layout/card/CwCardList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CwCardList.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/card/CwCardList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAI5D,MAAM,WAAW,UAAU,CAAC,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,8CAA8C;IAC9C,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,mDAAmD;IACnD,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAClD,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oBAAoB;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9B,uBAAuB;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,EAC7B,KAAK,EACL,UAAU,EACV,QAAa,EACb,MAAe,EACf,gBAAsB,EACtB,OAAY,EACZ,SAAiB,EACjB,UAAU,EACV,WAAgB,EAChB,cAAc,EACd,GAAG,SAAS,EACZ,EAAE,eAAe,CAAC,CAAC,CAAC,2CAsGpB"}
+{"version":3,"file":"CwCardList.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/card/CwCardList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAO5D,MAAM,WAAW,UAAU,CAAC,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,eAAe,CAAC,CAAC,CAAE,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,8CAA8C;IAC9C,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,mDAAmD;IACnD,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAClD,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oBAAoB;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9B,uBAAuB;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,2FAA2F;IAC3F,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC;CAC3D;AAED,wBAAgB,UAAU,CAAC,CAAC,EAAE,EAC7B,KAAK,EACL,UAAU,EACV,QAAa,EACb,MAAe,EACf,gBAAsB,EACtB,OAAY,EACZ,SAAiB,EACjB,UAAU,EACV,WAAgB,EAChB,cAAc,EACd,YAAY,EACZ,GAAG,SAAS,EACZ,EAAE,eAAe,CAAC,CAAC,CAAC,2CAwGpB"}

package/dist/src/playground/pages/CardListPage.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const CardListPage: React.FC;
+//# sourceMappingURL=CardListPage.d.ts.map

package/dist/src/playground/pages/CardListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardListPage.d.ts","sourceRoot":"","sources":["../../../../src/playground/pages/CardListPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmE1B,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAuEhC,CAAC"}

package/dist/test/components/custom/new-scheduler/presentation/logic/getEventSizesTemporal.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=getEventSizesTemporal.test.d.ts.map

package/dist/test/components/custom/new-scheduler/presentation/logic/getEventSizesTemporal.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getEventSizesTemporal.test.d.ts","sourceRoot":"","sources":["../../../../../../../test/components/custom/new-scheduler/presentation/logic/getEventSizesTemporal.test.ts"],"names":[],"mappings":""}

package/dist/test/vitest.setup.d.ts

@@ -1,2 +1,3 @@
 import '@testing-library/jest-dom/vitest';
+import 'temporal-polyfill/global';
 //# sourceMappingURL=vitest.setup.d.ts.map

package/dist/test/vitest.setup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vitest.setup.d.ts","sourceRoot":"","sources":["../../test/vitest.setup.ts"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC"}
+{"version":3,"file":"vitest.setup.d.ts","sourceRoot":"","sources":["../../test/vitest.setup.ts"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,0BAA0B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cwellt_software/cwellt-reactjs-lib",
-	"version": "1.4.6",
+	"version": "1.4.8",
 	"type": "module",
 	"files": [
 		"dist"
@@ -34,7 +34,6 @@
 		"react-dom": "^18.3.1"
 	},
 	"devDependencies": {
-		"globals": "^15.12.0",
 		"@rollup/plugin-typescript": "12.3.0",
 		"@testing-library/jest-dom": "^6.6.3",
 		"@testing-library/react": "^16.1.0",
@@ -51,6 +50,7 @@
 		"csstype": "^3.2.3",
 		"eslint": "^9.14.0",
 		"eslint-plugin-react": "^7.37.2",
+		"globals": "^15.12.0",
 		"postcss": "^8.4.49",
 		"postcss-import": "^16.1.0",
 		"postcss-modules": "^6.0.1",
@@ -64,14 +64,15 @@
 		"typescript-eslint": "^8.56.0",
 		"typescript-plugin-css-modules": "^5.1.0",
 		"vite": "^7.1.8",
-		"vitest": "^3.1.1"
+		"vitest": "^4.1.8"
 	},
 	"dependencies": {
-		"react-draggable": "^4.4.6",
-		"react-window": "^1.8.11",
 		"@react-buddy/ide-toolbox": "^2.4.0",
 		"date-fns": "^2.30.0",
-		"react-day-picker": "^9.0.0"
+		"react-day-picker": "^9.0.0",
+		"react-draggable": "^4.4.6",
+		"react-window": "^1.8.11",
+		"temporal-polyfill": "^0.3.2"
 	},
 	"overrides": {
 		"postcss-url": {