@cwellt_software/cwellt-reactjs-lib 1.3.2 → 1.3.3

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import React__default, { HTMLProps, PropsWithChildren, FC, ReactNode, CSSProperties, ReactElement, HTMLAttributes, DetailedHTMLProps, TextareaHTMLAttributes, InputHTMLAttributes, SelectHTMLAttributes, Component, ComponentType } from 'react';
 import * as CSS from 'csstype';
+import { DayPickerLocale } from 'react-day-picker/locale';
 import { Matcher } from 'react-day-picker';
 
 declare class CwSelectList {
@@ -718,6 +719,7 @@ interface CwTableProps<T = any> {
     loading?: boolean;
     scrollHeight?: number | string;
     stickyHeader?: boolean;
+    pageLabel?: string;
     rowSelection?: {
         selectedRowKeys?: T[keyof T][];
         onChange?: (selectedKeys: T[keyof T][], selectedRows: T[]) => void;
@@ -793,7 +795,7 @@ interface CwTableProps<T = any> {
  *
  * @returns React component
  */
-declare function CwTable<T = any>({ columns, data, pagination, pageSizeOptions, expandedRowRender, onExpand, className, classNameRow, style, classNameContainer, id, textNoData, rowKey, loading, scrollHeight, stickyHeader, rowSelection }: Readonly<CwTableProps<T>>): react_jsx_runtime.JSX.Element;
+declare function CwTable<T = any>({ columns, data, pagination, pageSizeOptions, expandedRowRender, onExpand, className, classNameRow, style, classNameContainer, id, textNoData, rowKey, loading, scrollHeight, stickyHeader, pageLabel, rowSelection }: Readonly<CwTableProps<T>>): react_jsx_runtime.JSX.Element;
 
 interface SortableColumn<T = any> {
     /** Header label */
@@ -1356,6 +1358,21 @@ interface CwFileUploadProps {
 }
 declare function CwFileUpload(fileUploadProps: React__default.PropsWithChildren<CwFileUploadProps>): react_jsx_runtime.JSX.Element;
 
+interface CwFileUploadMultipleLabels {
+    uploadDisabled: string;
+    clickToUpload: string;
+    acceptedFiles: (accept: string) => string;
+    singleFileOnly: string;
+    allTypesAccepted: string;
+    changeFile: string;
+    clearAll: string;
+    addMoreFiles: string;
+    filesSelected: (count: number) => string;
+    fileTooLarge: (name: string, maxSize: number) => string;
+    invalidFormat: (name: string, accepted: string) => string;
+    invalidMimeType: (name: string, types: string) => string;
+    alreadySelected: (name: string) => string;
+}
 interface CwFileUploadMultipleProps {
     name?: string;
     accept?: string;
@@ -1367,6 +1384,7 @@ interface CwFileUploadMultipleProps {
     className?: string;
     disabled?: boolean;
     initialFileName?: string;
+    labels?: Partial<CwFileUploadMultipleLabels>;
 }
 declare function CwFileUploadMultiple(fileUploadProps: React__default.PropsWithChildren<CwFileUploadMultipleProps>): react_jsx_runtime.JSX.Element;
 
@@ -2115,6 +2133,12 @@ interface CwMultiFilterProps {
     allTags: Set<ICwMultiFilterTag>;
     /** Selected tags/filters passed as props */
     selectedTags: Set<CwMultiFilterTagProps>;
+    /** Placeholder text for the search input */
+    placeholder?: string;
+    /** Label for the "All categories" button */
+    allCategoriesLabel?: string;
+    /** Additional CSS class for the container */
+    className?: string;
     style?: React__default.CSSProperties;
 }
 /**
@@ -2440,8 +2464,15 @@ interface CwDatePickerProps {
     /** Number of months to display (default: 1) */
     numberOfMonths?: number;
     showTodayButton?: boolean;
+    locale?: DayPickerLocale;
+    todayLabel?: string;
+    /** Feedback messages shown below the input; accepts a single message or an array for multiple
+     * @example feedback={{ type: "danger", message: "This field is required" }}
+     * @example feedback={[{ type: "neutral", message: "Select a departure date" }, { type: "warning", message: "Date is in the past" }]}
+     */
+    feedback?: CwInputFeedback | CwInputFeedback[];
 }
-declare function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabledMatcher, defaultMonth, labelProps, alignProps, placeholder, displayFormat, disabled, required, className, showClear, popupPosition, numberOfMonths, showTodayButton, }: Readonly<CwDatePickerProps>): react_jsx_runtime.JSX.Element;
+declare function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabledMatcher, defaultMonth, labelProps, alignProps, placeholder, displayFormat, disabled, required, className, showClear, popupPosition, numberOfMonths, showTodayButton, locale, todayLabel, feedback, }: Readonly<CwDatePickerProps>): react_jsx_runtime.JSX.Element;
 
 interface DateRangePreset {
     key: string;
@@ -2554,10 +2585,14 @@ interface CwDateTimePickerProps {
     numberOfMonths?: number;
     /** Show "Now" button to select current date and time */
     showNowButton?: boolean;
+    /** Label for the "Now" button */
+    nowLabel?: string;
+    /** Locale for date formatting and calendar strings (default: enGB) */
+    locale?: DayPickerLocale;
     /** Numeric timezone offset in hours (e.g., 1, 5.5, -3) */
     timezoneOffset?: number;
 }
-declare function CwDateTimePicker({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval, minTime, maxTime, labelProps, alignProps, datePlaceholder, timePlaceholder, disabled, required, className, showClear, popupPosition, numberOfMonths, showNowButton, timezoneOffset, }: Readonly<CwDateTimePickerProps>): react_jsx_runtime.JSX.Element;
+declare function CwDateTimePicker({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval, minTime, maxTime, labelProps, alignProps, datePlaceholder, timePlaceholder, disabled, required, className, showClear, popupPosition, numberOfMonths, showNowButton, nowLabel, locale, timezoneOffset, }: Readonly<CwDateTimePickerProps>): react_jsx_runtime.JSX.Element;
 
 type DateMatcher = Matcher;
 interface CwDateTimePickerCompactProps {
@@ -2598,8 +2633,14 @@ interface CwDateTimePickerCompactProps {
     /** Number of months to display (default: 1) */
     numberOfMonths?: number;
     showTodayButton?: boolean;
-}
-declare function CwDateTimePickerCompact({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval, minTime, maxTime, labelProps, alignProps, placeholder, disabled, required, className, showClear, popupPosition, numberOfMonths, showTodayButton, }: Readonly<CwDateTimePickerCompactProps>): react_jsx_runtime.JSX.Element;
+    /** Label for the "Now" button */
+    nowLabel?: string;
+    /** Label for the time column header */
+    timeLabel?: string;
+    /** Locale for date formatting and calendar strings (default: enGB) */
+    locale?: DayPickerLocale;
+}
+declare function CwDateTimePickerCompact({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval, minTime, maxTime, labelProps, alignProps, placeholder, disabled, required, className, showClear, popupPosition, numberOfMonths, showTodayButton, nowLabel, timeLabel, locale, }: Readonly<CwDateTimePickerCompactProps>): react_jsx_runtime.JSX.Element;
 
 interface CwTimePickerProps {
     /** Current selected time in format "HH:mm" (24h format) */

package/dist/index.es.js

@@ -105,36 +105,60 @@ function getHSLColor(color, alpha = 1) {
     const hsl = colorToHSL(color);
     return `hsla(${hsl.h}, ${hsl.s}%, ${hsl.l}%, ${alpha})`;
 }
+function hslToLinearRgb(h, s, l) {
+    const sNorm = s / 100;
+    const lNorm = l / 100;
+    const a = sNorm * Math.min(lNorm, 1 - lNorm);
+    const f = (n) => {
+        const k = (n + h / 30) % 12;
+        return lNorm - a * Math.max(-1, Math.min(k - 3, Math.min(9 - k, 1)));
+    };
+    return [f(0), f(8), f(4)];
+}
+function srgbLuminance(r, g, b) {
+    const lin = (c) => c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+    return 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);
+}
+function wcagContrastRatio(lum1, lum2) {
+    const lighter = Math.max(lum1, lum2);
+    const darker = Math.min(lum1, lum2);
+    return (lighter + 0.05) / (darker + 0.05);
+}
 function getContrastColor(color) {
-    if (color === null) {
+    if (color === null)
         return '#000000';
-    }
     const hsl = colorToHSL(color);
-    // Saturated greenyellow and cyan tones need lower luminance threshold (40-35)
-    // Saturated mediumblue and blueviolet tones need higher luminance threshold (55-60)
-    // Saturated orangered tones need lower luminance threshold (45)
-    const isYellowGreen = (hsl.h >= 45 && hsl.h <= 180);
-    const isBlueViolet = (hsl.h >= 210 && hsl.h <= 300);
-    const isRedOrange = (hsl.h >= 0 && hsl.h <= 30) || (hsl.h >= 330 && hsl.h <= 360);
-    let threshold = 50;
-    if (isYellowGreen) {
-        threshold = 40;
-        if (hsl.s >= 70) {
-            threshold = 35;
-        }
-    }
-    else if (isBlueViolet) {
-        threshold = 55;
-        if (hsl.s >= 70) {
-            threshold = 60;
-        }
-    }
-    else if (isRedOrange && hsl.s >= 80) {
-        threshold = 45;
-    }
-    const contrastL = hsl.l >= threshold ? 20 : 90;
     const contrastS = Math.min(hsl.s, 90);
-    return `hsl(${hsl.h}, ${contrastS}%, ${contrastL}%)`;
+    const bgRgb = hslToLinearRgb(hsl.h, hsl.s, hsl.l);
+    const bgLum = srgbLuminance(...bgRgb);
+    const darkL = 15;
+    const lightL = 90;
+    const darkLum = srgbLuminance(...hslToLinearRgb(hsl.h, contrastS, darkL));
+    const lightLum = srgbLuminance(...hslToLinearRgb(hsl.h, contrastS, lightL));
+    const darkRatio = wcagContrastRatio(bgLum, darkLum);
+    const lightRatio = wcagContrastRatio(bgLum, lightLum);
+    // On saturated backgrounds, dark-tinted text blends visually with the
+    // vibrant color even when math says it has better contrast.
+    // Prefer light text unless dark has an overwhelmingly higher ratio.
+    const saturatedBias = hsl.s >= 30 && bgLum < 0.4;
+    // Mid-grays (#777–#999): dark text "sinks" into the background while
+    // white text pops, even though dark wins on WCAG ratio.
+    const midGrayBias = hsl.s < 15 && bgLum >= 0.18 && bgLum <= 0.35;
+    const goLight = saturatedBias
+        ? darkRatio < lightRatio * 3
+        : midGrayBias || lightRatio >= darkRatio;
+    let targetL = goLight ? lightL : darkL;
+    let bestRatio = goLight ? lightRatio : darkRatio;
+    if (bestRatio < 4.5) {
+        const step = goLight ? 5 : -5;
+        const limit = goLight ? 95 : 0;
+        while (bestRatio < 4.5 && targetL !== limit) {
+            targetL = goLight ? Math.min(targetL + step, limit) : Math.max(targetL + step, limit);
+            const candidateLum = srgbLuminance(...hslToLinearRgb(hsl.h, contrastS, targetL));
+            bestRatio = wcagContrastRatio(bgLum, candidateLum);
+        }
+    }
+    return `hsl(${hsl.h}, ${contrastS}%, ${targetL}%)`;
 }
 
 const SVG_ICONS = {
@@ -1844,7 +1868,7 @@ function CwAccordionContainer(CwelltAccordionContainerProps) {
  *
  * @returns React component
  */
-function CwTable({ columns, data, pagination = false, pageSizeOptions = [5, 10, 20, 50], expandedRowRender, onExpand, className, classNameRow, style, classNameContainer, id, textNoData = "No data available at the moment", rowKey = "key", loading = false, scrollHeight, stickyHeader = false, rowSelection }) {
+function CwTable({ columns, data, pagination = false, pageSizeOptions = [5, 10, 20, 50], expandedRowRender, onExpand, className, classNameRow, style, classNameContainer, id, textNoData = "No data available at the moment", rowKey = "key", loading = false, scrollHeight, stickyHeader = false, pageLabel = "page", rowSelection }) {
     const [currentPage, setCurrentPage] = useState(1);
     const [expandedRowKey, setExpandedRowKey] = useState(null);
     const [sortConfig, setSortConfig] = useState({
@@ -2029,16 +2053,16 @@ function CwTable({ columns, data, pagination = false, pageSizeOptions = [5, 10,
                                                             ? "sortable"
                                                             : sortConfig.direction === "asc"
                                                                 ? "sortable-asc"
-                                                                : "sortable-desc" }))] }), jsx("span", { onMouseDown: (e) => startResize(e, col.key), className: "th-column-resizer" })] }, col.key)))] }) }), jsx("tbody", { children: renderTableBody() })] }) }), pagination && data.length > pageSizeOptions[0] && (jsxs("footer", { className: "cw-table-pagination", children: [jsx("button", { onClick: () => handlePageChange(1), disabled: currentPage === 1 || totalPages === 1, className: "cw-button-icon cwi-chevron-left-double", title: "First" }), jsx("button", { onClick: () => handlePageChange(currentPage - 1), disabled: currentPage === 1 || totalPages === 1, className: "cw-button-icon cwi-chevron-left", title: "Previous" }), jsx("input", { type: "text", inputMode: "numeric", value: currentPage, onChange: (e) => {
-                            const value = parseInt(e.target.value, 10);
-                            if (!isNaN(value))
-                                handlePageChange(value);
-                        }, onBlur: (e) => {
-                            const value = parseInt(e.target.value, 10);
-                            if (isNaN(value) || value < 1 || value > totalPages) {
-                                handlePageChange(1);
-                            }
-                        }, min: 1, max: totalPages }), jsxs("span", { children: ["of ", totalPages] }), jsx("button", { onClick: () => handlePageChange(currentPage + 1), disabled: currentPage === totalPages || totalPages === 1, className: "cw-button-icon cwi-chevron-right", title: "Next" }), jsx("button", { onClick: () => handlePageChange(totalPages), disabled: currentPage === totalPages || totalPages === 1, className: "cw-button-icon cwi-chevron-right-double", title: "Last" }), jsx("select", { value: localItemsPerPage, onChange: handleItemsPerPageChange, children: pageSizeOptions.map(size => (jsxs("option", { value: size, children: [size, " / page"] }, size))) })] }))] }));
+                                                                : "sortable-desc" }))] }), jsx("span", { onMouseDown: (e) => startResize(e, col.key), className: "th-column-resizer" })] }, col.key)))] }) }), jsx("tbody", { children: renderTableBody() })] }) }), pagination && data.length > pageSizeOptions[0] && (jsxs("footer", { className: "cw-table-pagination", children: [jsxs("div", { className: "cw-table-pagination-size", children: [jsx(CwIcon, { iconId: "list" }), jsx("select", { value: localItemsPerPage, onChange: handleItemsPerPageChange, children: pageSizeOptions.map(size => (jsx("option", { value: size, children: pageLabel ? `${size} / ${pageLabel}` : size }, size))) })] }), jsxs("div", { className: "cw-table-pagination-nav", children: [jsx(CwButton, { onClick: () => handlePageChange(1), disabled: currentPage === 1 || totalPages === 1, variant: "icon", icon: "chevron-left-double" }), jsx(CwButton, { onClick: () => handlePageChange(currentPage - 1), disabled: currentPage === 1 || totalPages === 1, variant: "icon", icon: "chevron-left" }), jsx("input", { type: "text", inputMode: "numeric", value: currentPage, onChange: (e) => {
+                                    const value = parseInt(e.target.value, 10);
+                                    if (!isNaN(value))
+                                        handlePageChange(value);
+                                }, onBlur: (e) => {
+                                    const value = parseInt(e.target.value, 10);
+                                    if (isNaN(value) || value < 1 || value > totalPages) {
+                                        handlePageChange(1);
+                                    }
+                                }, min: 1, max: totalPages }), jsx("span", { children: "/" }), jsx("span", { children: totalPages }), jsx(CwButton, { onClick: () => handlePageChange(currentPage + 1), disabled: currentPage === totalPages || totalPages === 1, variant: "icon", icon: "chevron-right" }), jsx(CwButton, { onClick: () => handlePageChange(totalPages), disabled: currentPage === totalPages || totalPages === 1, variant: "icon", icon: "chevron-right-double" })] })] }))] }));
 }
 
 var styles$i = {"dropIndicator":"cw-sortable-table-module__dropIndicator__ov-Jz","dragging":"cw-sortable-table-module__dragging__MrLrz","skeletonRow":"cw-sortable-table-module__skeletonRow__vyD0M","skeleton":"cw-sortable-table-module__skeleton__QGXAD","saveBar":"cw-sortable-table-module__saveBar__3OdoZ cw-flex-row cw-align-center-center cw-gap-small"};
@@ -2795,10 +2819,26 @@ function CwFileUpload(fileUploadProps) {
 
 var styles$e = {"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"};
 
+const DEFAULT_LABELS = {
+    uploadDisabled: 'Upload disabled',
+    clickToUpload: 'Click to upload or drag and drop',
+    acceptedFiles: (accept) => `Accepted files: ${accept}`,
+    singleFileOnly: '(Single file only)',
+    allTypesAccepted: 'All file types accepted',
+    changeFile: 'Change File',
+    clearAll: 'Clear all',
+    addMoreFiles: 'Add More Files',
+    filesSelected: (count) => `${count} file${count !== 1 ? 's' : ''} selected`,
+    fileTooLarge: (name, maxSize) => `File "${name}" is too large. Maximum size allowed is ${maxSize}MB.`,
+    invalidFormat: (name, accepted) => `File "${name}" has an invalid format. Allowed formats: ${accepted}`,
+    invalidMimeType: (name, types) => `File "${name}" has an invalid MIME type. Allowed types: ${types}`,
+    alreadySelected: (name) => `File "${name}" is already selected.`,
+};
 function CwFileUploadMultiple(fileUploadProps) {
     const fileInputRef = useRef(null);
     const [selectedFiles, setSelectedFiles] = useState([]);
     const [existingFile, setExistingFile] = useState(fileUploadProps.initialFileName);
+    const labels = { ...DEFAULT_LABELS, ...fileUploadProps.labels };
     React__default.useEffect(() => {
         setExistingFile(fileUploadProps.initialFileName);
     }, [fileUploadProps.initialFileName]);
@@ -2812,7 +2852,7 @@ function CwFileUploadMultiple(fileUploadProps) {
             if (fileSizeInMB > fileUploadProps.maxFileSize) {
                 return {
                     isValid: false,
-                    error: `File "${file.name}" is too large. Maximum size allowed is ${fileUploadProps.maxFileSize}MB.`
+                    error: labels.fileTooLarge(file.name, fileUploadProps.maxFileSize)
                 };
             }
         }
@@ -2829,7 +2869,7 @@ function CwFileUploadMultiple(fileUploadProps) {
             if (!isExtensionValid) {
                 return {
                     isValid: false,
-                    error: `File "${file.name}" has an invalid format. Allowed formats: ${fileUploadProps.accept}`
+                    error: labels.invalidFormat(file.name, fileUploadProps.accept)
                 };
             }
         }
@@ -2839,7 +2879,7 @@ function CwFileUploadMultiple(fileUploadProps) {
             if (!isMimeTypeValid) {
                 return {
                     isValid: false,
-                    error: `File "${file.name}" has an invalid MIME type. Allowed types: ${fileUploadProps.allowedTypes.join(', ')}`
+                    error: labels.invalidMimeType(file.name, fileUploadProps.allowedTypes.join(', '))
                 };
             }
         }
@@ -2853,7 +2893,7 @@ function CwFileUploadMultiple(fileUploadProps) {
             // 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.`);
+                errors.push(labels.alreadySelected(file.name));
                 continue;
             }
             const validation = validateFile(file);
@@ -2944,12 +2984,12 @@ function CwFileUploadMultiple(fileUploadProps) {
             }
         }
     };
-    return (jsxs("div", { className: `${styles$e.fileUploadContainer} ${fileUploadProps.className}`, children: [jsx("input", { ref: fileInputRef, type: "file", name: fileUploadProps.name, accept: fileUploadProps.accept, multiple: fileUploadProps.multiple, onChange: handleFileSelectInternal, disabled: fileUploadProps.disabled, "aria-label": "files", className: styles$e.hiddenInput }), selectedFiles.length === 0 && !existingFile ? (jsxs("div", { className: `${styles$e.uploadArea} ${fileUploadProps.disabled ? styles$e.uploadAreaDisabled : ''}`, onDragOver: handleDragOver, onDrop: handleDrop, onClick: !fileUploadProps.disabled ? handleButtonClick : undefined, children: [jsx(CwIcon, { iconId: "upload" }), jsx("p", { className: `${styles$e.uploadTitle}`, children: fileUploadProps.disabled ? 'Upload disabled' : 'Click to upload or drag and drop' }), jsxs("p", { className: `${styles$e.uploadSubtitle}`, children: [fileUploadProps.accept ? `Accepted files: ${fileUploadProps.accept}` : 'All file types accepted', !fileUploadProps.multiple && ' (Single file only)'] })] })) : selectedFiles.length === 0 && existingFile ? (jsxs("div", { className: styles$e.filesContainer, children: [jsxs("div", { className: styles$e.fileItem, children: [jsxs("div", { className: styles$e.fileIcon, children: [jsx(CwIcon, { iconId: "page" }), jsx("span", { className: styles$e.fileExtension, children: getFileExtension(existingFile) })] }), jsx("div", { className: styles$e.fileInfo, children: jsx("p", { className: styles$e.fileName, children: existingFile }) }), jsx(CwButton, { variant: "icon", icon: "close", color: "neutral", onClick: () => {
+    return (jsxs("div", { className: `${styles$e.fileUploadContainer} ${fileUploadProps.className}`, children: [jsx("input", { ref: fileInputRef, type: "file", name: fileUploadProps.name, accept: fileUploadProps.accept, multiple: fileUploadProps.multiple, onChange: handleFileSelectInternal, disabled: fileUploadProps.disabled, "aria-label": "files", className: styles$e.hiddenInput }), selectedFiles.length === 0 && !existingFile ? (jsxs("div", { className: `${styles$e.uploadArea} ${fileUploadProps.disabled ? styles$e.uploadAreaDisabled : ''}`, onDragOver: handleDragOver, onDrop: handleDrop, onClick: !fileUploadProps.disabled ? handleButtonClick : undefined, children: [jsx(CwIcon, { iconId: "upload" }), jsx("p", { className: `${styles$e.uploadTitle}`, children: fileUploadProps.disabled ? labels.uploadDisabled : labels.clickToUpload }), jsxs("p", { className: `${styles$e.uploadSubtitle}`, children: [fileUploadProps.accept ? labels.acceptedFiles(fileUploadProps.accept) : labels.allTypesAccepted, !fileUploadProps.multiple && ` ${labels.singleFileOnly}`] })] })) : selectedFiles.length === 0 && existingFile ? (jsxs("div", { className: styles$e.filesContainer, children: [jsxs("div", { className: styles$e.fileItem, children: [jsxs("div", { className: styles$e.fileIcon, children: [jsx(CwIcon, { iconId: "page" }), jsx("span", { className: styles$e.fileExtension, children: getFileExtension(existingFile) })] }), jsx("div", { className: styles$e.fileInfo, children: jsx("p", { className: styles$e.fileName, children: existingFile }) }), jsx(CwButton, { variant: "icon", icon: "close", color: "neutral", onClick: () => {
                                     setExistingFile(undefined);
                                     if (fileUploadProps.onSelect) {
                                         fileUploadProps.onSelect(null);
                                     }
-                                }, disabled: fileUploadProps.disabled, className: styles$e.smallButton })] }), jsx(CwButton, { text: "Change File", icon: "refresh", onClick: handleButtonClick, disabled: fileUploadProps.disabled })] })) : (jsxs("div", { className: styles$e.filesContainer, children: [jsxs("div", { className: "cw-flex-row cw-align-between-center", children: [jsxs("small", { className: styles$e.filesCount, children: [selectedFiles.length, " file", selectedFiles.length !== 1 ? 's' : '', " selected"] }), jsx(CwButton, { onClick: removeAllFiles, disabled: fileUploadProps.disabled, color: "danger", variant: "outline", icon: "delete", text: "Clear all" })] }), selectedFiles.map((file, index) => (jsxs("div", { className: styles$e.fileItem, children: [jsxs("div", { className: styles$e.fileIcon, children: [jsx(CwIcon, { iconId: "page" }), jsx("span", { className: styles$e.fileExtension, children: getFileExtension(file.name) })] }), jsxs("div", { className: styles$e.fileInfo, children: [jsx("p", { className: styles$e.fileName, children: file.name }), jsxs("p", { className: styles$e.fileSize, children: [(file.size / 1024).toFixed(1), " KB"] })] }), jsx(CwButton, { variant: "icon", icon: "close", color: "neutral", onClick: () => removeFile(index), className: styles$e.smallButton })] }, index))), fileUploadProps.multiple && (jsx(CwButton, { text: "Add More Files", icon: "plus", variant: "outline", onClick: handleButtonClick, disabled: fileUploadProps.disabled })), !fileUploadProps.multiple && (jsx(CwButton, { text: "Change File", icon: "refresh", onClick: handleButtonClick, disabled: fileUploadProps.disabled }))] }))] }));
+                                }, disabled: fileUploadProps.disabled, className: styles$e.smallButton })] }), jsx(CwButton, { text: labels.changeFile, icon: "refresh", onClick: handleButtonClick, disabled: fileUploadProps.disabled })] })) : (jsxs("div", { className: styles$e.filesContainer, children: [jsxs("div", { className: "cw-flex-row cw-align-between-center", children: [jsx("small", { className: styles$e.filesCount, children: labels.filesSelected(selectedFiles.length) }), jsx(CwButton, { onClick: removeAllFiles, disabled: fileUploadProps.disabled, color: "danger", variant: "outline", icon: "delete", text: labels.clearAll })] }), selectedFiles.map((file, index) => (jsxs("div", { className: styles$e.fileItem, children: [jsxs("div", { className: styles$e.fileIcon, children: [jsx(CwIcon, { iconId: "page" }), jsx("span", { className: styles$e.fileExtension, children: getFileExtension(file.name) })] }), jsxs("div", { className: styles$e.fileInfo, children: [jsx("p", { className: styles$e.fileName, children: file.name }), jsxs("p", { className: styles$e.fileSize, children: [(file.size / 1024).toFixed(1), " KB"] })] }), jsx(CwButton, { variant: "icon", icon: "close", color: "neutral", onClick: () => removeFile(index), className: styles$e.smallButton })] }, index))), fileUploadProps.multiple && (jsx(CwButton, { text: labels.addMoreFiles, icon: "plus", variant: "outline", onClick: handleButtonClick, disabled: fileUploadProps.disabled })), !fileUploadProps.multiple && (jsx(CwButton, { text: labels.changeFile, icon: "refresh", onClick: handleButtonClick, disabled: fileUploadProps.disabled }))] }))] }));
 }
 
 function CwInput(CwInputProps) {
@@ -4309,7 +4349,7 @@ const CwMultiFilterTag = props => {
             } : undefined }) }));
 };
 
-var styles$7 = {"cw-multi-filter-catalog-container":"cw-multi-filter-module__cw-multi-filter-catalog-container__S3nsq","cw-multi-filter":"cw-multi-filter-module__cw-multi-filter__zipBK","cw-multi-filter-search":"cw-multi-filter-module__cw-multi-filter-search__eyHr0"};
+var styles$7 = {"cw-multi-filter-catalog-container":"cw-multi-filter-module__cw-multi-filter-catalog-container__S3nsq","cw-multi-filter":"cw-multi-filter-module__cw-multi-filter__zipBK","category-selected":"cw-multi-filter-module__category-selected__eYbes","cw-multi-filter-search":"cw-multi-filter-module__cw-multi-filter-search__eyHr0"};
 
 /**
  * A multiple filter selector, a MULTI-SELECT even. Allows users to select and filter items based on tags.
@@ -4450,7 +4490,7 @@ var styles$7 = {"cw-multi-filter-catalog-container":"cw-multi-filter-module__cw-
  * @param {CwMultiFilterProps} props
  * @returns Set the `onChange` callback to a function to check for changes in the selected filters
  */
-const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, style }) => {
+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);
@@ -4552,9 +4592,9 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, style
             inputRef.current?.focus();
         }
     };
-    return (jsxs("form", { ref: componentRef, id: id, className: styles$7["cw-multi-filter"], style: style, onSubmit: (e) => {
+    return (jsxs("form", { ref: componentRef, id: id, className: `${styles$7["cw-multi-filter"]}${className ? ` ${className}` : ""}`, style: style, onSubmit: (e) => {
             e.preventDefault();
-        }, children: [jsxs("div", { onClick: handleDivClick, className: styles$7["cw-multi-filter-search"], style: isPanelOpen ? { outline: "1px solid var(--cw-color-primary)", outlineOffset: "-2px" } : {}, children: [jsxs("ul", { id: id + "_selected_filters", children: [Array.from(selectedTags).map(tag => (createElement(CwMultiFilterTag, { ...tag, key: tag.ID, Selectable: false, Removable: true, OnRemove: () => removeTag(tag.ID) }))), jsx("input", { type: "text", id: id + "_input", ref: inputRef, value: inputTextValue, spellCheck: false, onFocus: () => setIsPanelOpen(true), onChange: e => handleInputText(e.target.value), autoComplete: "off", placeholder: "Write to filter", onKeyDown: e => {
+        }, children: [jsxs("div", { onClick: handleDivClick, className: styles$7["cw-multi-filter-search"], style: isPanelOpen ? { outline: "1px solid var(--cw-color-primary)", outlineOffset: "-2px" } : {}, children: [jsxs("ul", { id: id + "_selected_filters", children: [Array.from(selectedTags).map(tag => (createElement(CwMultiFilterTag, { ...tag, key: tag.ID, Selectable: false, Removable: true, OnRemove: () => removeTag(tag.ID) }))), jsx("input", { type: "text", id: id + "_input", ref: inputRef, value: inputTextValue, spellCheck: false, onFocus: () => setIsPanelOpen(true), onChange: e => handleInputText(e.target.value), autoComplete: "off", placeholder: placeholder, onKeyDown: e => {
                                     switch (e.key) {
                                         case "Enter":
                                         case "Tab": {
@@ -4584,15 +4624,7 @@ const CwMultiFilter = ({ allTags, id, onChangeSelectedTags, selectedTags, style
                                 } })] }), selectedTags.size > 0 ? (jsx("input", { type: "reset", value: "\u00D7", onClick: e => {
                             e.preventDefault();
                             onChangeSelectedTags(new Set());
-                        } })) : null] }), jsxs("section", { className: styles$7["cw-multi-filter-catalog-container"], "data-display-none": !isPanelOpen, children: [jsxs("nav", { children: [jsx("button", { style: selectedCategory === "All"
-                                    ? {
-                                        backgroundColor: "var(--cw-color-primary-container)",
-                                        color: "var(--cw-color-primary)",
-                                        outline: "2px solid var(--cw-color-primary)",
-                                        outlineOffset: "-2px",
-                                        fontWeight: 400
-                                    }
-                                    : {}, onClick: () => handleClickCategory("All"), children: "SEARCH IN ALL CATEGORIES" }), Array.from(categoriesMappedToTags().keys()).map(category => (jsx("button", { style: selectedCategory === category
+                        } })) : null] }), jsxs("section", { className: styles$7["cw-multi-filter-catalog-container"], "data-display-none": !isPanelOpen, children: [jsxs("nav", { children: [jsx("button", { className: selectedCategory === "All" ? styles$7["category-selected"] : undefined, onClick: () => handleClickCategory("All"), children: allCategoriesLabel }), Array.from(categoriesMappedToTags().keys()).map(category => (jsx("button", { style: selectedCategory === category
                                     ? {
                                         backgroundColor: getColor(category).primary,
                                         color: getColor(category).onPrimary,
@@ -5142,10 +5174,13 @@ function usePickerPopup({ anchorRef, isOpen, onClose, position = "left-bottom" }
     return { popupRef, popupStyle: style, renderPopup };
 }
 
-function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabledMatcher, defaultMonth, labelProps, alignProps, placeholder = "Select a date", displayFormat = "dd.MM.yyyy", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showTodayButton = false, }) {
+function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabledMatcher, defaultMonth, labelProps, alignProps, placeholder = "Select a date", displayFormat = "dd.MM.yyyy", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showTodayButton = false, locale = enGB, todayLabel = "Today", feedback, }) {
     const [isOpen, setIsOpen] = useState(false);
     const [inputValue, setInputValue] = useState("");
     const containerRef = useRef(null);
+    const feedbackMessages = feedback
+        ? Array.isArray(feedback) ? feedback : [feedback]
+        : [];
     const wrapperRef = useRef(null);
     const inputRef = useRef(null);
     const prevValueRef = useRef(undefined);
@@ -5313,11 +5348,11 @@ function CwDatePicker({ value, onChange, minDate, maxDate, disabledDates, disabl
         ...(maxDate ? [{ after: maxDate }] : []),
         ...(disabledMatcher ? [disabledMatcher] : []),
     ], [disabledDates, minDate, maxDate, disabledMatcher]);
-    return (jsx("div", { ref: containerRef, className: `cw-datepicker ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputRef, type: "text", value: inputValue, placeholder: placeholder, onChange: handleInputChange, onBlur: handleInputBlur, onClick: handleInputClick, onKeyDown: handleInputKeyDown, disabled: disabled, required: required }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClear, tabIndex: -1, "aria-label": "Clear date" })) : (jsx(CwIcon, { iconId: "calendar" })) }), renderPopup(jsxs("div", { ref: popupRef, className: styles$4.pickerPopup, style: popupStyle, children: [jsx(DayPicker, { mode: "single", selected: value || undefined, defaultMonth: defaultMonth || value || undefined, onSelect: handleDaySelect, disabled: disabledDays, numberOfMonths: numberOfMonths, modifiers: {
-                                        today: new Date(),
-                                    }, modifiersClassNames: {
-                                        today: "rdp-day-today",
-                                    } }), showTodayButton && (jsx("footer", { className: "cw-flex-row cw-align-right-center", children: jsx(CwButton, { type: "button", variant: "outline", onClick: handleTodayClick, text: "Today" }) }))] }))] })] }) }));
+    return (jsxs("div", { ref: containerRef, className: `cw-datepicker ${className || ""}`, children: [jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputRef, type: "text", value: inputValue, placeholder: placeholder, onChange: handleInputChange, onBlur: handleInputBlur, onClick: handleInputClick, onKeyDown: handleInputKeyDown, disabled: disabled, required: required }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClear, tabIndex: -1, "aria-label": "Clear date" })) : (jsx(CwIcon, { iconId: "calendar" })) }), renderPopup(jsxs("div", { ref: popupRef, className: styles$4.pickerPopup, style: popupStyle, children: [jsx(DayPicker, { mode: "single", selected: value || undefined, defaultMonth: defaultMonth || value || undefined, onSelect: handleDaySelect, disabled: disabledDays, numberOfMonths: numberOfMonths, locale: locale, modifiers: {
+                                            today: new Date(),
+                                        }, modifiersClassNames: {
+                                            today: "rdp-day-today",
+                                        } }), 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"};
@@ -6165,7 +6200,7 @@ function combineDateTimeInOffset(date, hours, minutes, timezoneOffset) {
     return new Date(zdt.epochMilliseconds);
 }
 
-function CwDateTimePicker({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval = 15, minTime, maxTime, labelProps, alignProps, datePlaceholder = "dd.MM.yyyy", timePlaceholder = "HH:mm", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showNowButton = false, timezoneOffset, }) {
+function CwDateTimePicker({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval = 15, minTime, maxTime, labelProps, alignProps, datePlaceholder = "dd.MM.yyyy", timePlaceholder = "HH:mm", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showNowButton = false, nowLabel = "Now", locale = enGB, timezoneOffset, }) {
     // ========================================
     // PROPS NORMALIZATION
     // ========================================
@@ -6405,12 +6440,12 @@ function CwDateTimePicker({ value, onChange, minDateTime, maxDateTime, disabledD
     const displayMaxDate = useMemo(() => normalizedMaxDateTime && timezoneOffset !== undefined
         ? getDateInOffset(normalizedMaxDateTime, timezoneOffset)
         : normalizedMaxDateTime, [normalizedMaxDateTime, timezoneOffset]);
-    return jsx("div", { className: `cw-datetimepicker cw-datetimepicker-separate ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { className: "cw-flex-row cw-align-left-center cw-gap-small", children: [jsx(CwDatePicker, { value: selectedDate, onChange: handleDateChange, minDate: displayMinDate, maxDate: displayMaxDate, disabledDates: disabledDates, disabledMatcher: disabledMatcher, placeholder: datePlaceholder, disabled: disabled, required: required, showClear: showClear, numberOfMonths: numberOfMonths, popupPosition: popupPosition }), jsx(CwTimePicker, { value: selectedTime, onChange: handleTimeChange, interval: timeInterval, minTime: timeRestrictions.minTime, maxTime: timeRestrictions.maxTime, placeholder: timePlaceholder, disabled: disabled, required: required, showClear: showClear, popupPosition: popupPosition }), showNowButton && (jsx(CwButton, { type: "button", variant: "outline", onClick: handleNowClick, disabled: disabled, title: "Set to current date and time", text: "Now" }))] })] }) });
+    return jsx("div", { className: `cw-datetimepicker cw-datetimepicker-separate ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { className: "cw-flex-row cw-align-left-center cw-gap-small", children: [jsx(CwDatePicker, { value: selectedDate, onChange: handleDateChange, minDate: displayMinDate, maxDate: displayMaxDate, disabledDates: disabledDates, disabledMatcher: disabledMatcher, placeholder: datePlaceholder, disabled: disabled, required: required, showClear: showClear, numberOfMonths: numberOfMonths, popupPosition: popupPosition, locale: locale }), jsx(CwTimePicker, { value: selectedTime, onChange: handleTimeChange, interval: timeInterval, minTime: timeRestrictions.minTime, maxTime: timeRestrictions.maxTime, placeholder: timePlaceholder, disabled: disabled, required: required, showClear: showClear, popupPosition: popupPosition }), showNowButton && (jsx(CwButton, { type: "button", variant: "outline", onClick: handleNowClick, disabled: disabled, text: nowLabel }))] })] }) });
 }
 
 var compactStyles = {"compactPopup":"cw-datetime-compact-module__compactPopup__GiuNY","calendarWrapper":"cw-datetime-compact-module__calendarWrapper__P4Nlq","timeWrapper":"cw-datetime-compact-module__timeWrapper__uMe-A","compactTimeList":"cw-datetime-compact-module__compactTimeList__MzSQT"};
 
-function CwDateTimePickerCompact({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval = 15, minTime, maxTime, labelProps, alignProps, placeholder = "dd.mm.yyyy HH:mm", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showTodayButton = false, }) {
+function CwDateTimePickerCompact({ value, onChange, minDateTime, maxDateTime, disabledDates, disabledMatcher, timeInterval = 15, minTime, maxTime, labelProps, alignProps, placeholder = "dd.mm.yyyy HH:mm", disabled, required, className, showClear = true, popupPosition = "left-bottom", numberOfMonths = 1, showTodayButton = false, nowLabel = "Now", timeLabel = "Time", locale = enGB, }) {
     const [isOpen, setIsOpen] = useState(false);
     const [inputValue, setInputValue] = useState("");
     const [selectedDate, setSelectedDate] = useState(value);
@@ -6641,11 +6676,11 @@ function CwDateTimePickerCompact({ value, onChange, minDateTime, maxDateTime, di
         ...(maxDateTime ? [{ after: maxDateTime }] : []),
         ...(disabledMatcher ? [disabledMatcher] : []),
     ], [disabledDates, minDateTime, maxDateTime, disabledMatcher]);
-    return (jsx("div", { ref: containerRef, className: `cw-datetimepicker ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputRef, type: "text", value: inputValue, placeholder: placeholder, onChange: handleInputChange, onBlur: handleInputBlur, onClick: handleInputClick, onKeyDown: handleInputKeyDown, disabled: disabled, required: required, maxLength: 16, style: { width: "24ch" } }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClear, tabIndex: -1, "aria-label": "Clear datetime" })) : (jsx(CwIcon, { iconId: "calendar-time" })) }), renderPopup(jsxs("div", { ref: popupRef, className: `${styles$4.pickerPopup} ${compactStyles.compactPopup}`, style: popupStyle, children: [jsxs("div", { className: compactStyles.calendarWrapper, children: [jsx(DayPicker, { mode: "single", selected: selectedDate, onSelect: handleDaySelect, defaultMonth: selectedDate, disabled: disabledDays, numberOfMonths: numberOfMonths, modifiers: {
+    return (jsx("div", { ref: containerRef, className: `cw-datetimepicker ${className || ""}`, children: jsxs(CwAlign, { ...alignProps, itemProp: required ? "required" : "", children: [labelProps && (jsx(CwLabel, { ...labelProps, children: labelProps.text })), jsxs("div", { ref: wrapperRef, className: styles$4.pickerWrapper, children: [jsx("input", { ref: inputRef, type: "text", value: inputValue, placeholder: placeholder, onChange: handleInputChange, onBlur: handleInputBlur, onClick: handleInputClick, onKeyDown: handleInputKeyDown, disabled: disabled, required: required, maxLength: 16 }), jsx("div", { className: styles$4.pickerIcons, children: showClear && value && !disabled ? (jsx(CwButton, { type: "button", variant: "icon", color: "neutral", icon: "close", onClick: handleClear, tabIndex: -1, "aria-label": "Clear datetime" })) : (jsx(CwIcon, { iconId: "calendar-time" })) }), renderPopup(jsxs("div", { ref: popupRef, className: `${styles$4.pickerPopup} ${compactStyles.compactPopup}`, style: popupStyle, children: [jsxs("div", { className: compactStyles.calendarWrapper, children: [jsx(DayPicker, { mode: "single", selected: selectedDate, onSelect: handleDaySelect, defaultMonth: selectedDate, disabled: disabledDays, numberOfMonths: numberOfMonths, locale: locale, modifiers: {
                                                 today: new Date(),
                                             }, modifiersClassNames: {
                                                 today: "rdp-day-today",
-                                            } }), showTodayButton && (jsx("footer", { className: "cw-flex-row cw-align-center-center", children: jsx(CwButton, { type: "button", variant: "outline", icon: "check-big", onClick: handleNowClick, text: "Now" }) }))] }), jsxs("div", { className: compactStyles.timeWrapper, children: [jsxs("header", { children: [jsx(CwIcon, { iconId: "clock", size: "medium" }), jsx("span", { children: "Time" })] }), jsx("div", { ref: timeListRef, className: `${timeStyles.timePickerList} ${compactStyles.compactTimeList}`, children: timeOptions.map((time) => {
+                                            } }), showTodayButton && (jsx("footer", { className: "cw-flex-row cw-align-center-center", children: jsx(CwButton, { type: "button", variant: "outline", icon: "check-big", onClick: handleNowClick, text: nowLabel }) }))] }), jsxs("div", { className: compactStyles.timeWrapper, children: [jsxs("header", { children: [jsx(CwIcon, { iconId: "clock", size: "medium" }), jsx("span", { children: timeLabel })] }), jsx("div", { ref: timeListRef, className: `${timeStyles.timePickerList} ${compactStyles.compactTimeList}`, children: timeOptions.map((time) => {
                                                 const isSelected = time === selectedTime;
                                                 return (jsx("button", { type: "button", className: isSelected ? timeStyles.selected : "", onClick: () => handleTimeSelect(time), children: time }, time));
                                             }) })] })] }))] })] }) }));

package/dist/playground/main.d.ts

@@ -0,0 +1,4 @@
+import '../dist/index.css';
+import "../src/common/styles/cw-global.css";
+export declare const App: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=main.d.ts.map

package/dist/playground/main.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../playground/main.tsx"],"names":[],"mappings":"AAEA,OAAO,mBAAmB,CAAC;AAG3B,OAAO,oCAAoC,CAAA;AAI3C,eAAO,MAAM,GAAG,+CAWf,CAAC"}

package/dist/src/common/functions/colorManipulation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colorManipulation.d.ts","sourceRoot":"","sources":["../../../../src/common/functions/colorManipulation.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,MAAM,CAAC;AAwCzB,wBAAgB,UAAU,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAOpD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,GAAE,MAAU,GAAG,MAAM,CAGxE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAoC1D"}
+{"version":3,"file":"colorManipulation.d.ts","sourceRoot":"","sources":["../../../../src/common/functions/colorManipulation.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,MAAM,CAAC;AAwCzB,wBAAgB,UAAU,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAOpD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,GAAE,MAAU,GAAG,MAAM,CAGxE;AA0BD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CA2C1D"}

package/dist/src/components/control/action/button/CwPopoverButton.d.ts

@@ -0,0 +1,33 @@
+import React from "react";
+import { type CwButtonProps } from "./CwButton";
+export interface CwPopoverButtonProps extends Omit<CwButtonProps, "onClick" | "children"> {
+    /** Content rendered inside the floating panel */
+    children: React.ReactNode;
+    /** Panel width — CSS value (e.g. "auto", "16rem"). @default "auto" */
+    panelWidth?: string;
+    /** Horizontal alignment relative to the button. @default "bottom-start" */
+    placement?: "bottom-start" | "bottom-end";
+    /** Additional CSS class for the panel */
+    panelClassName?: string;
+}
+/**
+ * Button that toggles a floating panel with arbitrary children.
+ * Closes on click-outside or Escape.
+ *
+ * Designed as a composable primitive:
+ * - Column picker: put `<CwCheckboxGroup>` inside
+ * - Options menu: put toggles / links inside
+ * - Future CwTable integration: use internally for column visibility
+ *
+ * @example
+ * <CwPopoverButton text="Columns" icon="table" variant="outline">
+ *     <CwCheckboxGroup options={opts} value={val} onChange={setVal} />
+ * </CwPopoverButton>
+ *
+ * @example
+ * <CwPopoverButton text="Options" icon="options" variant="outline" placement="bottom-end">
+ *     <CwToggle labelText="Show assigned" checked={v} onChange={setV} />
+ * </CwPopoverButton>
+ */
+export declare function CwPopoverButton({ children, panelWidth, placement, panelClassName, ...buttonProps }: CwPopoverButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CwPopoverButton.d.ts.map

package/dist/src/components/control/action/button/CwPopoverButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CwPopoverButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/action/button/CwPopoverButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAG1D,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,UAAU,CAAC;IACxF,iDAAiD;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,sEAAsE;IACtE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,cAAc,GAAG,YAAY,CAAC;IAC1C,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,eAAe,CAAC,EAC/B,QAAQ,EACR,UAAmB,EACnB,SAA0B,EAC1B,cAAc,EACd,GAAG,WAAW,EACd,EAAE,oBAAoB,2CA0CtB"}

package/dist/src/components/control/action/contextual-menu/CwContextualMenu.d.ts

@@ -0,0 +1,29 @@
+import * as React from "react";
+export interface CwContextualMenuProps {
+    children?: any;
+    handleContextMenu?: any;
+    onClick?: any;
+    dataSourceContextMenu?: Array<CwDataItemsListProps>;
+    dataSourceContextMenu_schd?: Array<CwDataItemsListSchdProps>;
+}
+export interface CwDataItemsListProps {
+    idDataItem?: string | number | any;
+    dataItemContent?: string | any;
+    style?: React.CSSProperties;
+    styleDataItem?: React.CSSProperties;
+}
+export interface CwDataItemsListSchdProps {
+    key?: string;
+    text?: string;
+    icon?: string;
+    color?: string;
+}
+export interface CwBoxItemsProps {
+    id?: any;
+    children?: any;
+    style?: React.CSSProperties;
+    styleDataItem?: React.CSSProperties;
+}
+export declare function CwDataItem(cwBoxItemsProps: React.PropsWithChildren<CwBoxItemsProps>): import("react/jsx-runtime").JSX.Element;
+export declare function CwContextualMenu(CwelltRightClickProps: React.PropsWithChildren<CwContextualMenuProps>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CwContextualMenu.d.ts.map

package/dist/src/components/control/action/contextual-menu/CwContextualMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CwContextualMenu.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/action/contextual-menu/CwContextualMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,qBAAqB;IACrC,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,OAAO,CAAC,EAAE,GAAG,CAAC;IAEd,qBAAqB,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,CAAC;IAEpD,0BAA0B,CAAC,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC;CAC7D;AAGD,MAAM,WAAW,oBAAoB;IAEpC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC;IAEnC,eAAe,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAE/B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAGD,MAAM,WAAW,wBAAwB;IACxC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe;IAC/B,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACpC;AAED,wBAAgB,UAAU,CAAC,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,2CAQnF;AAED,wBAAgB,gBAAgB,CAAC,qBAAqB,EAAE,KAAK,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,2CAyFrG"}

package/dist/src/components/control/action/tooltip-dialog/CwTooltipDialog.d.ts

@@ -0,0 +1,19 @@
+import React, { HTMLAttributes } from "react";
+import { CwButton } from "../../../../components/control/action/button/CwButton";
+export declare enum CwTooltipDialogType {
+    warn = "exclamation-triangle",
+    error = "times-circle",
+    info = "info-circle"
+}
+export interface CwTooltipDialogProps extends HTMLAttributes<HTMLDivElement> {
+    text: string;
+    buttons: (typeof CwButton)[];
+    getIsOpen: boolean;
+    setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    _onClose?: () => void;
+    _type?: CwTooltipDialogType;
+    _width?: number;
+    _height?: number;
+}
+export default function CwTooltipDialog(props: React.PropsWithChildren<CwTooltipDialogProps>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CwTooltipDialog.d.ts.map

package/dist/src/components/control/action/tooltip-dialog/CwTooltipDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CwTooltipDialog.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/action/tooltip-dialog/CwTooltipDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,uDAAuD,CAAC;AAGjF,oBAAY,mBAAmB;IAC9B,IAAI,yBAAyB;IAC7B,KAAK,iBAAiB;IACtB,IAAI,gBAAgB;CACpB;AAED,MAAM,WAAW,oBAAqB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,OAAO,QAAQ,CAAC,EAAE,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,2CAY3F"}

package/dist/src/components/control/choice/deprecated/CwDropdown.d.ts

@@ -0,0 +1,19 @@
+import React, { type HTMLProps } from "react";
+import { CwSelectList } from "../../../../common/classes/CwSelectList";
+export interface CwDropdownProps extends HTMLProps<HTMLDivElement> {
+    selectList: Array<CwSelectList>;
+    labelName: string;
+    labelPosition?: string;
+    labelClassName?: string;
+    handleChange?: (value: any) => void;
+    placeholder?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    styleSelect?: React.CSSProperties;
+    styleOption?: React.CSSProperties;
+    disabled?: boolean;
+    error?: boolean;
+    defaultSelected?: any;
+}
+export declare function CwDropdown(optionsProps: React.PropsWithChildren<CwDropdownProps>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CwDropdown.d.ts.map

package/dist/src/components/control/choice/deprecated/CwDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CwDropdown.d.ts","sourceRoot":"","sources":["../../../../../../src/components/control/choice/deprecated/CwDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAEvE,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,UAAU,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAClC,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,GAAG,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,2CAsEhF"}