@cwellt_software/cwellt-reactjs-lib 1.0.8 → 1.0.9

package/dist/components/control/input/file/CwFileUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CwFileUpload.d.ts","sourceRoot":"","sources":["../../../../../src/components/control/input/file/CwFileUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,UAAU,QAAQ;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,iBAAiB;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,gBAAgB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,2CA2EvF"}
+{"version":3,"file":"CwFileUpload.d.ts","sourceRoot":"","sources":["../../../../../src/components/control/input/file/CwFileUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,UAAU,QAAQ;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,iBAAiB;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,gBAAgB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,2CAmFvF"}

package/dist/components/control/input/file/CwFileUploadMultiple.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+interface CwFileUploadMultipleProps {
+    name?: string;
+    accept?: string;
+    multiple?: boolean;
+    maxFileSize?: number;
+    allowedTypes?: string[];
+    onSelect?: (files: FileList | null) => void;
+    onError?: (error: string) => void;
+    className?: string;
+    disabled?: boolean;
+}
+export declare function CwFileUploadMultiple(fileUploadProps: React.PropsWithChildren<CwFileUploadMultipleProps>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=CwFileUploadMultiple.d.ts.map

package/dist/components/control/input/file/CwFileUploadMultiple.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CwFileUploadMultiple.d.ts","sourceRoot":"","sources":["../../../../../src/components/control/input/file/CwFileUploadMultiple.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAK7D,UAAU,yBAAyB;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,wBAAgB,oBAAoB,CAAC,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,yBAAyB,CAAC,2CAyRvG"}

package/dist/index.cjs.js

@@ -423,7 +423,7 @@ function CwLoadingSmall(CwelltLoadingAppointements) {
         jsxRuntime.jsx("div", {})) }));
 }
 
-var styles$d = {"cw-generic-tooltip-content":"cw-generic-tooltip-module_cw-generic-tooltip-content__la-Si"};
+var styles$e = {"cw-generic-tooltip-content":"cw-generic-tooltip-module_cw-generic-tooltip-content__la-Si"};
 
 // Constants moved outside to prevent recreation
 const margin = 16;
@@ -534,12 +534,12 @@ const CwGenericTooltip = ({ children, content = null, position = defaultPosition
     const { setTooltipTimeout, clearTooltipTimeout } = useTooltipDelay(() => {
         setIsVisible(true);
     }, showDelay);
-    const { position: tooltipPosition, actualPosition } = useTooltipPosition(isVisible, containerRef, position, styles$d["cw-generic-tooltip-content"]);
+    const { position: tooltipPosition, actualPosition } = useTooltipPosition(isVisible, containerRef, position, styles$e["cw-generic-tooltip-content"]);
     // Memoize tooltip content creation
     const tooltipContent = React.useMemo(() => {
         if (hide || !isVisible || !content)
             return null;
-        return reactDom.createPortal(jsxRuntime.jsx("div", { className: styles$d["cw-generic-tooltip-content"], "data-position": actualPosition, "data-visible": isVisible, style: {
+        return reactDom.createPortal(jsxRuntime.jsx("div", { className: styles$e["cw-generic-tooltip-content"], "data-position": actualPosition, "data-visible": isVisible, style: {
                 position: 'fixed',
                 top: `${tooltipPosition.top}px`,
                 left: `${tooltipPosition.left}px`,
@@ -554,7 +554,7 @@ const CwGenericTooltip = ({ children, content = null, position = defaultPosition
         clearTooltipTimeout();
         setIsVisible(false);
     }, [clearTooltipTimeout]);
-    return (jsxRuntime.jsxs("div", { ref: containerRef, className: styles$d["cw-generic-tooltip"], onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style: overlayStyle, children: [tooltipContent, children] }));
+    return (jsxRuntime.jsxs("div", { ref: containerRef, className: styles$e["cw-generic-tooltip"], onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style: overlayStyle, children: [tooltipContent, children] }));
 };
 
 // Reference for draggable modal
@@ -673,7 +673,7 @@ class CwModalIframe extends React__namespace.Component {
     }
 }
 
-var styles$c = {"cw-dialog-main":"cw-dialog-module_cw-dialog-main__cHxHt","cw-dialog-button-close":"cw-dialog-module_cw-dialog-button-close__9GRd8"};
+var styles$d = {"cw-dialog-main":"cw-dialog-module_cw-dialog-main__cHxHt","cw-dialog-button-close":"cw-dialog-module_cw-dialog-button-close__9GRd8"};
 
 // Helper function to parse size values
 const parseSize = (size) => {
@@ -866,7 +866,7 @@ const CwDialog = props => {
             onClose();
         }
     }, [onClose]);
-    const header = React.useMemo(() => (jsxRuntime.jsxs("header", { onMouseDown: handleMouseDown, children: [jsxRuntime.jsx("span", { children: headline }), customHeader || (jsxRuntime.jsx("button", { className: styles$c["cw-dialog-button-close"], onClick: onClose }))] })), [handleMouseDown, headline, customHeader, onClose]);
+    const header = React.useMemo(() => (jsxRuntime.jsxs("header", { onMouseDown: handleMouseDown, children: [jsxRuntime.jsx("span", { children: headline }), customHeader || (jsxRuntime.jsx("button", { className: styles$d["cw-dialog-button-close"], onClick: onClose }))] })), [handleMouseDown, headline, customHeader, onClose]);
     const content = React.useMemo(() => (jsxRuntime.jsx("section", { children: children })), [children]);
     const footer = React.useMemo(() => (jsxRuntime.jsx("footer", { children: customFooter || (jsxRuntime.jsx("button", { className: "cw-button-icon cwi-save", onClick: onSave })) })), [customFooter, onSave]);
     const resizeHandles = React.useMemo(() => size.autoHeight
@@ -895,7 +895,7 @@ const CwDialog = props => {
             : `${convertFromPx(size.height, size.heightUnit)}${size.heightUnit}`;
         return { displayWidth, displayHeight };
     }, [size.width, size.height, size.widthUnit, size.heightUnit, size.autoHeight]);
-    return (open && (jsxRuntime.jsx("div", { "data-has-scrim": hasScrim, className: styles$c["cw-dialog-main"], onClick: handleScrimClick, children: jsxRuntime.jsxs("dialog", { ...domProps, ref: dialogRef, style: {
+    return (open && (jsxRuntime.jsx("div", { "data-has-scrim": hasScrim, className: styles$d["cw-dialog-main"], onClick: handleScrimClick, children: jsxRuntime.jsxs("dialog", { ...domProps, ref: dialogRef, style: {
                 left: `${position.x}px`,
                 top: `${position.y}px`,
                 width: displayDimensions.displayWidth,
@@ -1058,7 +1058,7 @@ function CwButton({ text, variant = 'solid', color = 'primary', className = '',
     return (jsxRuntime.jsx("button", { type: "button", className: buttonClass, ...buttonProps, "data-color": color, children: variant === 'icon' ? null : (children ?? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon && jsxRuntime.jsx("span", { className: `cwi-icons cwi-${icon}` }), text && jsxRuntime.jsx("strong", { children: text })] }))) }));
 }
 
-var styles$b = {"card":"cw-card-module_card__HJUT0","clickable":"cw-card-module_clickable__Y-V3X","disabled":"cw-card-module_disabled__0wHh1","loading":"cw-card-module_loading__-fzlx","content":"cw-card-module_content__ma9qy","headerContent":"cw-card-module_headerContent__x4Jfl","footerTags":"cw-card-module_footerTags__80sSW","loadingOverlay":"cw-card-module_loadingOverlay__8-zVV"};
+var styles$c = {"card":"cw-card-module_card__HJUT0","clickable":"cw-card-module_clickable__Y-V3X","disabled":"cw-card-module_disabled__0wHh1","loading":"cw-card-module_loading__-fzlx","content":"cw-card-module_content__ma9qy","headerContent":"cw-card-module_headerContent__x4Jfl","footerTags":"cw-card-module_footerTags__80sSW","loadingOverlay":"cw-card-module_loadingOverlay__8-zVV"};
 
 /**
 * CwCard - A simple card component for displaying content in a contained format
@@ -1082,11 +1082,11 @@ const CwCard = ({ id, title, subtitle, alignment = 'center', children, footer, o
     // Construct class names using CSS modules
     const cardClassNames = [
         'cw-card',
-        styles$b.card,
+        styles$c.card,
         className,
-        clickable ? styles$b.clickable : '',
-        disabled ? styles$b.disabled : '',
-        isLoading ? styles$b.loading : '',
+        clickable ? styles$c.clickable : '',
+        disabled ? styles$c.disabled : '',
+        isLoading ? styles$c.loading : '',
     ].filter(Boolean).join(' ');
     // Handle click event when card is clickable
     const handleClick = () => {
@@ -1103,15 +1103,15 @@ const CwCard = ({ id, title, subtitle, alignment = 'center', children, footer, o
     // Determine if footer should be rendered
     const hasFooter = hasChips || footer || (hasActions && direction === "row");
     // Actions component to reuse
-    const ActionsComponent = hasActions && !disabled ? (jsxRuntime.jsxs("div", { className: styles$b.actions, children: [extraActions ?? null, onEdit && jsxRuntime.jsx(CwButton, { variant: "icon", icon: "edit", onClick: onEdit }), onDelete && jsxRuntime.jsx(CwButton, { variant: "icon", icon: "delete", color: "danger", onClick: onDelete })] })) : null;
+    const ActionsComponent = hasActions && !disabled ? (jsxRuntime.jsxs("div", { className: styles$c.actions, children: [extraActions ?? null, onEdit && jsxRuntime.jsx(CwButton, { variant: "icon", icon: "edit", onClick: onEdit }), onDelete && jsxRuntime.jsx(CwButton, { variant: "icon", icon: "delete", color: "danger", onClick: onDelete })] })) : null;
     return (jsxRuntime.jsxs("div", { ...(id && { id }), className: cardClassNames, ...(style && { style }), ...(clickable && {
             role: 'button',
             tabIndex: 0,
             onClick: handleClick,
-        }), "data-variant": variant, "data-direction": direction, children: [hasHeader && (jsxRuntime.jsxs("header", { children: [(title || subtitle) && (jsxRuntime.jsxs("div", { className: styles$b.headerContent, "data-alignment": alignment, children: [title && jsxRuntime.jsx("h5", { children: title }), subtitle && jsxRuntime.jsx("strong", { children: subtitle })] })), direction === "column" && ActionsComponent] })), jsxRuntime.jsx("div", { className: styles$b.content, children: children }), hasFooter && (jsxRuntime.jsxs("footer", { children: [hasChips && (jsxRuntime.jsx("div", { className: styles$b.footerTags, children: chips.map((chip, index) => (jsxRuntime.jsx(CwChip, { label: chip.label, colorScheme: chip.colorScheme, className: styles$b.chip, ...(chip.customColor && { customColor: chip.customColor }), ...(chip.variant && { variant: chip.variant }), ...(chip.icon && { icon: chip.icon }) }, index))) })), footer && (jsxRuntime.jsx("div", { className: styles$b.footerContent, children: footer }))] })), direction === "row" && ActionsComponent, isLoading && (jsxRuntime.jsx("div", { className: styles$b.loadingOverlay, children: jsxRuntime.jsx(CwLoading, { isLoading: isLoading, size: "small" }) }))] }));
+        }), "data-variant": variant, "data-direction": direction, children: [hasHeader && (jsxRuntime.jsxs("header", { children: [(title || subtitle) && (jsxRuntime.jsxs("div", { className: styles$c.headerContent, "data-alignment": alignment, children: [title && jsxRuntime.jsx("h5", { children: title }), subtitle && jsxRuntime.jsx("strong", { children: subtitle })] })), direction === "column" && ActionsComponent] })), jsxRuntime.jsx("div", { className: styles$c.content, children: children }), hasFooter && (jsxRuntime.jsxs("footer", { children: [hasChips && (jsxRuntime.jsx("div", { className: styles$c.footerTags, children: chips.map((chip, index) => (jsxRuntime.jsx(CwChip, { label: chip.label, colorScheme: chip.colorScheme, className: styles$c.chip, ...(chip.customColor && { customColor: chip.customColor }), ...(chip.variant && { variant: chip.variant }), ...(chip.icon && { icon: chip.icon }) }, index))) })), footer && (jsxRuntime.jsx("div", { className: styles$c.footerContent, children: footer }))] })), direction === "row" && ActionsComponent, isLoading && (jsxRuntime.jsx("div", { className: styles$c.loadingOverlay, children: jsxRuntime.jsx(CwLoading, { isLoading: isLoading, size: "small" }) }))] }));
 };
 
-var styles$a = {"cardContainer":"cw-card-list-module_cardContainer__l3YEh","pagination":"cw-card-list-module_pagination__5Ay78","pageInfo":"cw-card-list-module_pageInfo__uiMel","emptyState":"cw-card-list-module_emptyState__RlqiS","sortControls":"cw-card-list-module_sortControls__mWgZA"};
+var styles$b = {"cardContainer":"cw-card-list-module_cardContainer__l3YEh","pagination":"cw-card-list-module_pagination__5Ay78","pageInfo":"cw-card-list-module_pageInfo__uiMel","emptyState":"cw-card-list-module_emptyState__RlqiS","sortControls":"cw-card-list-module_sortControls__mWgZA"};
 
 function CwCardList({ items, renderCard, pageSize = 10, className = '', layout = 'grid', defaultCardWidth = 320, cardGap = 16, isLoading = false, emptyState, sortOptions = [], defaultSortKey }) {
     const [currentPage, setCurrentPage] = React.useState(1);
@@ -1145,10 +1145,10 @@ function CwCardList({ items, renderCard, pageSize = 10, className = '', layout =
         '--card-width': `${defaultCardWidth}px`,
         '--card-gap': `${cardGap}px`
     };
-    return (jsxRuntime.jsxs("div", { className: `${className}`, children: [sortOptions.length > 0 && (jsxRuntime.jsxs("div", { className: styles$a.sortControls, children: [jsxRuntime.jsx("label", { htmlFor: "cardlist-sort-select", children: "Sort by:" }), jsxRuntime.jsx("select", { id: "cardlist-sort-select", value: sortKey, onChange: (e) => handleSortChange(e.target.value), className: styles$a.sortSelect, children: sortOptions.map(option => (jsxRuntime.jsx("option", { value: option.key, children: option.label }, option.key))) }), jsxRuntime.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 ? (jsxRuntime.jsx("div", { className: styles$a.loading, children: jsxRuntime.jsx(CwLoading, { isLoading: isLoading }) })) : sortedItems.length === 0 ? (jsxRuntime.jsx("div", { className: styles$a.emptyState, children: emptyState || jsxRuntime.jsx("p", { children: "No items to display" }) })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: `${styles$a.cardContainer}`, "data-layout": layout, style: gridStyle, children: visibleItems.map((item, index) => (jsxRuntime.jsx("div", { className: styles$a.cardWrapper, children: renderCard(item, index) }, index))) }), totalPages > 1 && (jsxRuntime.jsxs("div", { className: styles$a.pagination, children: [jsxRuntime.jsx("button", { disabled: currentPage === 1, onClick: () => setCurrentPage(p => Math.max(1, p - 1)), className: "cw-button-icon cwi-chevron-left" }), jsxRuntime.jsxs("span", { className: styles$a.pageInfo, children: [currentPage, " of ", totalPages] }), jsxRuntime.jsx("button", { disabled: currentPage === totalPages, onClick: () => setCurrentPage(p => Math.min(totalPages, p + 1)), className: "cw-button-icon cwi-chevron-right" })] }))] }))] }));
+    return (jsxRuntime.jsxs("div", { className: `${className}`, children: [sortOptions.length > 0 && (jsxRuntime.jsxs("div", { className: styles$b.sortControls, children: [jsxRuntime.jsx("label", { htmlFor: "cardlist-sort-select", children: "Sort by:" }), jsxRuntime.jsx("select", { id: "cardlist-sort-select", value: sortKey, onChange: (e) => handleSortChange(e.target.value), className: styles$b.sortSelect, children: sortOptions.map(option => (jsxRuntime.jsx("option", { value: option.key, children: option.label }, option.key))) }), jsxRuntime.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 ? (jsxRuntime.jsx("div", { className: styles$b.loading, children: jsxRuntime.jsx(CwLoading, { isLoading: isLoading }) })) : sortedItems.length === 0 ? (jsxRuntime.jsx("div", { className: styles$b.emptyState, children: emptyState || jsxRuntime.jsx("p", { children: "No items to display" }) })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: `${styles$b.cardContainer}`, "data-layout": layout, style: gridStyle, children: visibleItems.map((item, index) => (jsxRuntime.jsx("div", { className: styles$b.cardWrapper, children: renderCard(item, index) }, index))) }), totalPages > 1 && (jsxRuntime.jsxs("div", { className: styles$b.pagination, children: [jsxRuntime.jsx("button", { disabled: currentPage === 1, onClick: () => setCurrentPage(p => Math.max(1, p - 1)), className: "cw-button-icon cwi-chevron-left" }), jsxRuntime.jsxs("span", { className: styles$b.pageInfo, children: [currentPage, " of ", totalPages] }), jsxRuntime.jsx("button", { disabled: currentPage === totalPages, onClick: () => setCurrentPage(p => Math.min(totalPages, p + 1)), className: "cw-button-icon cwi-chevron-right" })] }))] }))] }));
 }
 
-var styles$9 = {"cw-accordion":"cw-accordion-module_cw-accordion__ErvlW","cw-accordion-body":"cw-accordion-module_cw-accordion-body__xlI8b"};
+var styles$a = {"cw-accordion":"cw-accordion-module_cw-accordion__ErvlW","cw-accordion-body":"cw-accordion-module_cw-accordion-body__xlI8b"};
 
 /**
  *
@@ -1165,7 +1165,7 @@ function CwAccordionContainer(CwelltAccordionContainerProps) {
         setVisible_accordionBody(!isVisible_accordionBody);
     };
     // #endregion
-    return (jsxRuntime.jsxs("div", { className: styles$9["cw-accordion"], style: CwelltAccordionContainerProps.style, "data-open": isVisible_accordionBody, children: [jsxRuntime.jsxs("header", { onClick: () => showAccordionBody(), children: [jsxRuntime.jsx("div", { children: CwelltAccordionContainerProps.desc_text }), jsxRuntime.jsx("button", { className: "cw-button-icon" })] }), jsxRuntime.jsx("div", { className: styles$9["cw-accordion-body"], children: CwelltAccordionContainerProps.children })] }));
+    return (jsxRuntime.jsxs("div", { className: styles$a["cw-accordion"], style: CwelltAccordionContainerProps.style, "data-open": isVisible_accordionBody, children: [jsxRuntime.jsxs("header", { onClick: () => showAccordionBody(), children: [jsxRuntime.jsx("div", { children: CwelltAccordionContainerProps.desc_text }), jsxRuntime.jsx("button", { className: "cw-button-icon" })] }), jsxRuntime.jsx("div", { className: styles$a["cw-accordion-body"], children: CwelltAccordionContainerProps.children })] }));
 }
 
 /**
@@ -1370,7 +1370,7 @@ function CwTable({ columns, data, pagination = false, pageSizeOptions = [5, 10,
                         } }), "of ", totalPages, jsxRuntime.jsx("button", { onClick: () => handlePageChange(currentPage + 1), disabled: currentPage === totalPages || totalPages === 1, className: "cw-button-icon cwi-chevron-right", title: "Next" }), jsxRuntime.jsx("button", { onClick: () => handlePageChange(totalPages), disabled: currentPage === totalPages || totalPages === 1, className: "cw-button-icon cwi-chevron-right-double", title: "Last" }), jsxRuntime.jsx("select", { value: localItemsPerPage, onChange: handleItemsPerPageChange, style: { marginLeft: "1rem" }, children: pageSizeOptions.map(size => (jsxRuntime.jsxs("option", { value: size, children: [size, " / page"] }, size))) })] }))] }));
 }
 
-var styles$8 = {"cw-tabs":"cw-tabs-module_cw-tabs__1pmji","cw-tabs-content":"cw-tabs-module_cw-tabs-content__HTp8d"};
+var styles$9 = {"cw-tabs":"cw-tabs-module_cw-tabs__1pmji","cw-tabs-content":"cw-tabs-module_cw-tabs-content__HTp8d"};
 
 const TabIcon = ({ icon }) => {
     if (!icon)
@@ -1420,7 +1420,7 @@ function CwTabs(CwTabsProps) {
     const tabsListStyle = position === 'left' && CwTabsProps.tabsListWidth
         ? { minWidth: CwTabsProps.tabsListWidth }
         : undefined;
-    return (jsxRuntime.jsxs("div", { id: CwTabsProps.id, className: styles$8['cw-tabs'], style: CwTabsProps.style, "data-tabs-position": position, children: [jsxRuntime.jsx("ul", { style: tabsListStyle, children: CwTabsProps.tabs.map(tab => (jsxRuntime.jsxs("li", { className: `${tab.key === activeTab ? "cw-tab-active" : ""}`, onClick: () => handleTabClick(tab), "data-active": tab.key === activeTab, children: [jsxRuntime.jsx(TabIcon, { icon: tab.icon }), tab.title] }, tab.key))) }), jsxRuntime.jsx("div", { className: styles$8['cw-tabs-content'], children: activeTab !== null && CwTabsProps.tabs.find(tab => tab.key === activeTab)?.content })] }));
+    return (jsxRuntime.jsxs("div", { id: CwTabsProps.id, className: styles$9['cw-tabs'], style: CwTabsProps.style, "data-tabs-position": position, children: [jsxRuntime.jsx("ul", { style: tabsListStyle, children: CwTabsProps.tabs.map(tab => (jsxRuntime.jsxs("li", { className: `${tab.key === activeTab ? "cw-tab-active" : ""}`, onClick: () => handleTabClick(tab), "data-active": tab.key === activeTab, children: [jsxRuntime.jsx(TabIcon, { icon: tab.icon }), tab.title] }, tab.key))) }), jsxRuntime.jsx("div", { className: styles$9['cw-tabs-content'], children: activeTab !== null && CwTabsProps.tabs.find(tab => tab.key === activeTab)?.content })] }));
 }
 
 /**
@@ -1538,7 +1538,7 @@ const CwTableGrouped = props => {
 function CwFileUpload(fileUploadProps) {
     const [previewURL, setPreviewURL] = React.useState("");
     const [error, setError] = React.useState(null);
-    const [selectedFileName, setSelectedFileName] = React.useState("");
+    const [_selectedFileName, setSelectedFileName] = React.useState("");
     const [_currentHexContent, setCurrentHexContent] = React.useState("");
     React.useEffect(() => {
         // If there is hexadecimal preview content, set the Preview URL
@@ -1550,36 +1550,185 @@ function CwFileUpload(fileUploadProps) {
         const file = event.target.files?.[0];
         setSelectedFileName(file?.name ?? "");
         if (file) {
-            if (!file.type.startsWith(fileUploadProps.accept)) {
+            const allowedExts = fileUploadProps.accept.split(',').map(ext => ext.trim().replace('.', '').toLowerCase());
+            const fileExt = file.name.split('.').pop()?.toLowerCase() ?? "";
+            if (!allowedExts.includes(fileExt)) {
                 setError(`Invalid file type. Only ${fileUploadProps.acceptString} files are allowed.`);
                 setPreviewURL("");
+                return;
             }
-            else {
-                setError(null);
-                const reader = new FileReader();
-                reader.onloadend = () => {
-                    if (typeof reader.result === "string") {
-                        const hexContent = arrayBufferToHex(reader.result);
-                        setCurrentHexContent(hexContent);
-                        setPreviewURL(reader.result);
-                        setCurrentHexContent(arrayBufferToHex(reader.result));
-                        // Llama a la función para guardar el contenido hexadecimal
-                        fileUploadProps.onSaveHexContent(arrayBufferToHex(reader.result));
-                    }
+            setError(null);
+            const reader = new FileReader();
+            reader.onloadend = () => {
+                if (typeof reader.result === "string") {
+                    const hexContent = arrayBufferToHex(reader.result);
+                    setCurrentHexContent(hexContent);
+                    setPreviewURL(reader.result);
+                    setCurrentHexContent(arrayBufferToHex(reader.result));
+                    // Call function to store hexadecimal content
+                    fileUploadProps.onSaveHexContent(arrayBufferToHex(reader.result));
+                }
+            };
+            reader.readAsDataURL(file);
+        }
+    };
+    // Function to convert the image buffer into hexadecimal content
+    const arrayBufferToHex = (dataUrl) => {
+        // Decodes the base64 of the URL data
+        const base64 = dataUrl.split(",")[1];
+        const binary = atob(base64);
+        let hex = "";
+        for (let i = 0; i < binary.length; i++) {
+            hex += binary.charCodeAt(i).toString(16).padStart(2, "0");
+        }
+        return hex;
+    };
+    return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs("div", { className: "row", children: [jsxRuntime.jsx("input", { className: "cw-button", type: "file", accept: fileUploadProps.accept, readOnly: true, placeholder: "No file selected...", onChange: handleFileChange }), previewURL && (jsxRuntime.jsx("div", { className: "row", children: jsxRuntime.jsx("img", { src: previewURL, alt: "Preview", style: { maxWidth: "200px", maxHeight: "200px" } }) }))] }), error && jsxRuntime.jsx("div", { className: "row error", children: error }), jsxRuntime.jsx("div", { className: "row", children: jsxRuntime.jsxs("label", { children: ["Please note: File/image has to be in ", fileUploadProps.acceptString, " format", fileUploadProps.sizeString && `, ${fileUploadProps.sizeString}`] }) })] }));
+}
+
+var styles$8 = {"fileUploadContainer":"cw-file-upload-multiple-module_fileUploadContainer__liEc1","hiddenInput":"cw-file-upload-multiple-module_hiddenInput__TZBBI","uploadArea":"cw-file-upload-multiple-module_uploadArea__DdOhs","uploadAreaDisabled":"cw-file-upload-multiple-module_uploadAreaDisabled__VWeFX","uploadTitle":"cw-file-upload-multiple-module_uploadTitle__gjRk8","uploadSubtitle":"cw-file-upload-multiple-module_uploadSubtitle__Z0S5t","filesContainer":"cw-file-upload-multiple-module_filesContainer__g44PY","fileItem":"cw-file-upload-multiple-module_fileItem__w27Dg","fileIcon":"cw-file-upload-multiple-module_fileIcon__iJJUX","fileExtension":"cw-file-upload-multiple-module_fileExtension__vOuHv","fileInfo":"cw-file-upload-multiple-module_fileInfo__R5ZTv","fileName":"cw-file-upload-multiple-module_fileName__DjepK","fileSize":"cw-file-upload-multiple-module_fileSize__b8GSm","smallButton":"cw-file-upload-multiple-module_smallButton__siUAh"};
+
+function CwFileUploadMultiple(fileUploadProps) {
+    const fileInputRef = React.useRef(null);
+    const [selectedFiles, setSelectedFiles] = React.useState([]);
+    const getFileExtension = (filename) => {
+        return filename.split('.').pop()?.toUpperCase() || '';
+    };
+    const validateFile = (file) => {
+        // Validate the size of the file
+        if (fileUploadProps.maxFileSize) {
+            const fileSizeInMB = file.size / (1024 * 1024);
+            if (fileSizeInMB > fileUploadProps.maxFileSize) {
+                return {
+                    isValid: false,
+                    error: `File "${file.name}" is too large. Maximum size allowed is ${fileUploadProps.maxFileSize}MB.`
+                };
+            }
+        }
+        // Validate file type by extension (based in accept)
+        if (fileUploadProps.accept) {
+            const acceptedExtensions = fileUploadProps.accept.split(',').map(ext => ext.trim().toLowerCase());
+            const fileExtension = '.' + file.name.split('.').pop()?.toLowerCase();
+            const isExtensionValid = acceptedExtensions.some(ext => {
+                if (ext.startsWith('.')) {
+                    return ext === fileExtension;
+                }
+                return false;
+            });
+            if (!isExtensionValid) {
+                return {
+                    isValid: false,
+                    error: `File "${file.name}" has an invalid format. Allowed formats: ${fileUploadProps.accept}`
                 };
-                reader.readAsDataURL(file);
             }
         }
+        // Validate MIME type if specified
+        if (fileUploadProps.allowedTypes && fileUploadProps.allowedTypes.length > 0) {
+            const isMimeTypeValid = fileUploadProps.allowedTypes.includes(file.type);
+            if (!isMimeTypeValid) {
+                return {
+                    isValid: false,
+                    error: `File "${file.name}" has an invalid MIME type. Allowed types: ${fileUploadProps.allowedTypes.join(', ')}`
+                };
+            }
+        }
+        return { isValid: true };
+    };
+    const processFiles = (files, existingFiles = []) => {
+        const fileArray = Array.from(files);
+        const validFiles = [...existingFiles]; // Start with existing files
+        const errors = [];
+        for (const file of fileArray) {
+            // Check if the file already exists (by name and size)
+            const isDuplicate = existingFiles.some(existingFile => existingFile.name === file.name && existingFile.size === file.size);
+            if (isDuplicate) {
+                errors.push(`File "${file.name}" is already selected.`);
+                continue;
+            }
+            const validation = validateFile(file);
+            if (!validation.isValid) {
+                errors.push(validation.error);
+                continue;
+            }
+            validFiles.push(file);
+        }
+        // Show errors if any
+        if (errors.length > 0) {
+            if (fileUploadProps.onError) {
+                fileUploadProps.onError(errors.join('\n'));
+            }
+            else {
+                console.error(errors.join('\n'));
+                alert(errors.join('\n')); // Fallback if there is no onError
+            }
+        }
+        // If not multiple, only take the first valid file (replace)
+        if (!fileUploadProps.multiple && validFiles.length > 1) {
+            return [validFiles[validFiles.length - 1]]; // Take the last file added
+        }
+        return validFiles;
     };
-    // Function to convert the image buffer into hexadecimal content
-    const arrayBufferToHex = (buffer) => {
-        const bytes = new Uint8Array(buffer.length);
-        for (let i = 0; i < buffer.length; i++) {
-            bytes[i] = buffer.charCodeAt(i);
+    const updateFileInput = (files) => {
+        // Create FileList with all files
+        const dataTransfer = new DataTransfer();
+        files.forEach(file => dataTransfer.items.add(file));
+        if (fileInputRef.current) {
+            fileInputRef.current.files = dataTransfer.files;
+        }
+        if (fileUploadProps.onSelect) {
+            fileUploadProps.onSelect(dataTransfer.files);
+        }
+    };
+    const handleFileSelect = (event) => {
+        const files = event.target.files;
+        if (files && files.length > 0) {
+            const updatedFiles = processFiles(files, selectedFiles);
+            if (updatedFiles.length > selectedFiles.length || !fileUploadProps.multiple) {
+                setSelectedFiles(updatedFiles);
+                updateFileInput(updatedFiles);
+            }
+            else {
+                // Clear input if no new valid files were added
+                if (fileInputRef.current) {
+                    fileInputRef.current.value = '';
+                }
+            }
+        }
+    };
+    const removeFile = (indexToRemove) => {
+        const newFiles = selectedFiles.filter((_, index) => index !== indexToRemove);
+        setSelectedFiles(newFiles);
+        updateFileInput(newFiles);
+    };
+    const removeAllFiles = () => {
+        setSelectedFiles([]);
+        if (fileInputRef.current) {
+            fileInputRef.current.value = '';
+        }
+        if (fileUploadProps.onSelect) {
+            fileUploadProps.onSelect(null);
+        }
+    };
+    const handleButtonClick = () => {
+        fileInputRef.current?.click();
+    };
+    const handleDragOver = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+    };
+    const handleDrop = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        const files = event.dataTransfer.files;
+        if (files && files.length > 0) {
+            const updatedFiles = processFiles(files, selectedFiles);
+            if (updatedFiles.length > selectedFiles.length || !fileUploadProps.multiple) {
+                setSelectedFiles(updatedFiles);
+                updateFileInput(updatedFiles);
+            }
         }
-        return globalThis.Buffer.from(bytes).toString("hex");
     };
-    return (jsxRuntime.jsxs("div", { children: [previewURL && (jsxRuntime.jsx("div", { className: "row", children: jsxRuntime.jsx("img", { src: previewURL, alt: "Preview", style: { maxWidth: "200px", maxHeight: "200px" } }) })), jsxRuntime.jsx("div", { className: "row", children: jsxRuntime.jsx("input", { type: "file", accept: fileUploadProps.accept, value: selectedFileName, readOnly: true, placeholder: "No file selected...", onChange: handleFileChange }) }), error && jsxRuntime.jsx("div", { className: "row error", children: error }), jsxRuntime.jsx("div", { className: "row", children: jsxRuntime.jsxs("label", { children: ["Please note: File/image has to be in ", fileUploadProps.acceptString, " format", fileUploadProps.sizeString && `, ${fileUploadProps.sizeString}`] }) })] }));
+    return (jsxRuntime.jsxs("div", { className: `${styles$8.fileUploadContainer} ${fileUploadProps.className}`, children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", name: fileUploadProps.name, accept: fileUploadProps.accept, multiple: fileUploadProps.multiple, onChange: handleFileSelect, disabled: fileUploadProps.disabled, "aria-label": "files", className: styles$8.hiddenInput }), selectedFiles.length === 0 ? (jsxRuntime.jsxs("div", { className: `${styles$8.uploadArea} ${fileUploadProps.disabled ? styles$8.uploadAreaDisabled : ''}`, onDragOver: handleDragOver, onDrop: handleDrop, onClick: !fileUploadProps.disabled ? handleButtonClick : undefined, children: [jsxRuntime.jsx(CwIcon, { iconId: "upload" }), jsxRuntime.jsx("p", { className: `${styles$8.uploadTitle}`, children: fileUploadProps.disabled ? 'Upload disabled' : 'Click to upload or drag and drop' }), jsxRuntime.jsxs("p", { className: `${styles$8.uploadSubtitle}`, children: [fileUploadProps.accept ? `Accepted files: ${fileUploadProps.accept}` : 'All file types accepted', !fileUploadProps.multiple && ' (Single file only)'] })] })) : (jsxRuntime.jsxs("div", { className: styles$8.filesContainer, children: [jsxRuntime.jsxs("div", { className: "cw-flex-row cw-align-between-center", children: [jsxRuntime.jsxs("small", { className: styles$8.filesCount, children: [selectedFiles.length, " file", selectedFiles.length !== 1 ? 's' : '', " selected"] }), jsxRuntime.jsx(CwButton, { onClick: removeAllFiles, disabled: fileUploadProps.disabled, color: "danger", variant: "outline", icon: "delete", text: "Clear all" })] }), selectedFiles.map((file, index) => (jsxRuntime.jsxs("div", { className: styles$8.fileItem, children: [jsxRuntime.jsxs("div", { className: styles$8.fileIcon, children: [jsxRuntime.jsx(CwIcon, { iconId: "page" }), jsxRuntime.jsx("span", { className: styles$8.fileExtension, children: getFileExtension(file.name) })] }), jsxRuntime.jsxs("div", { className: styles$8.fileInfo, children: [jsxRuntime.jsx("p", { className: styles$8.fileName, children: file.name }), jsxRuntime.jsxs("p", { className: styles$8.fileSize, children: [(file.size / 1024).toFixed(1), " KB"] })] }), jsxRuntime.jsx(CwButton, { variant: "icon", icon: "close", color: "neutral", onClick: () => removeFile(index), className: styles$8.smallButton })] }, index))), fileUploadProps.multiple && (jsxRuntime.jsx(CwButton, { text: "Add More Files", icon: "plus", variant: "outline", onClick: handleButtonClick, disabled: fileUploadProps.disabled })), !fileUploadProps.multiple && (jsxRuntime.jsx(CwButton, { text: "Change File", icon: "refresh", onClick: handleButtonClick, disabled: fileUploadProps.disabled }))] }))] }));
 }
 
 function CwInput(CwInputProps) {
@@ -7543,6 +7692,7 @@ exports.CwDropdownFilter = CwDropdownFilter;
 exports.CwDropdownNavigation = CwDropdownNavigation;
 exports.CwExpandable = CwExpandable;
 exports.CwFileUpload = CwFileUpload;
+exports.CwFileUploadMultiple = CwFileUploadMultiple;
 exports.CwFindAirport = CwFindAirport;
 exports.CwFloatingButton = CwFloatingButton;
 exports.CwGenericTooltip = CwGenericTooltip;