@beweco/aurora-ui 0.1.7 → 0.1.9

package/dist/index.cjs.js

@@ -135,10 +135,11 @@ var Input = function (_a) {
     return (jsxRuntime.jsx(react.Input, __assign({}, props, { id: inputId, label: label, labelPlacement: "outside", placeholder: placeholder, variant: variant, size: size, radius: radius, classNames: {
             label: "text-default-600 text-tiny group-data-[filled=true]:text-default-600",
             inputWrapper: "focus-within:!border-primary-500",
+            errorMessage: "text-left",
         } })));
 };
 
-var defaultTranslations$6 = {
+var defaultTranslations$7 = {
     addHolidayTitle: "Add holiday",
     dayOption: "Day",
     dateRangeOption: "Date range",
@@ -162,7 +163,7 @@ var INITIAL_HOLIDAY_STATE = {
  */
 var AddHolidayForm = function (_a) {
     var onAddHoliday = _a.onAddHoliday, translations = _a.translations, className = _a.className, radioGroupProps = _a.radioGroupProps, dateRangePickerProps = _a.dateRangePickerProps, buttonProps = _a.buttonProps;
-    var t = __assign(__assign({}, defaultTranslations$6), translations);
+    var t = __assign(__assign({}, defaultTranslations$7), translations);
     var _b = React.useState(INITIAL_HOLIDAY_STATE), newHoliday = _b[0], setNewHoliday = _b[1];
     /**
      * A boolean flag that determines if a date has been set.
@@ -224,15 +225,15 @@ var AddHolidayForm = function (_a) {
 
 var H2 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsxRuntime.jsx("h2", __assign({ className: react.cn("text-lg font-medium", className) }, props, { children: children })));
+    return (jsxRuntime.jsx("h2", __assign({ className: react.cn("text-lg font-semibold", className) }, props, { children: children })));
 };
 
 var P = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsxRuntime.jsx("p", __assign({ className: react.cn("text-sm text-default-500", className) }, props, { children: children })));
+    return (jsxRuntime.jsx("p", __assign({ className: react.cn("text-sm text-default-500 font-normal", className) }, props, { children: children })));
 };
 
-var defaultTranslations$5 = {
+var defaultTranslations$6 = {
     title: "Analytics",
     description: "Monthly growth of your metrics during the selected period",
     viewDetails: "View Details",
@@ -286,7 +287,7 @@ var formatMonth = function (month) {
 var AnalyticsCard = function (_a) {
     var _b, _c;
     var data = _a.data, _d = _a.showTimePeriods, showTimePeriods = _d === void 0 ? true : _d, _e = _a.showDropdownMenu, showDropdownMenu = _e === void 0 ? true : _e, _f = _a.showMetricCards, showMetricCards = _f === void 0 ? true : _f, onChartChange = _a.onChartChange, onMenuAction = _a.onMenuAction, onTimePeriodChange = _a.onTimePeriodChange, _g = _a.translations, translations = _g === void 0 ? {} : _g, props = __rest(_a, ["data", "showTimePeriods", "showDropdownMenu", "showMetricCards", "onChartChange", "onMenuAction", "onTimePeriodChange", "translations"]);
-    var t = __assign(__assign({}, defaultTranslations$5), translations);
+    var t = __assign(__assign({}, defaultTranslations$6), translations);
     var _h = React.useState((_c = (_b = data[0]) === null || _b === void 0 ? void 0 : _b.key) !== null && _c !== void 0 ? _c : ""), activeChart = _h[0], setActiveChart = _h[1];
     var activeChartData = React.useMemo(function () {
         var _a;
@@ -919,6 +920,62 @@ var ColorSelector = function (_a) {
                     : "border-gray-200 hover:scale-105"), style: { backgroundColor: color.color }, title: color.label }) }, color.value)); }) }));
 };
 
+// Traducciones por defecto en español
+var defaultTranslations$5 = {
+    dayOption: "Día específico",
+    dateRangeOption: "Rango de fechas",
+    selectDateAriaLabel: "Seleccionar fecha",
+    selectDateRangeAriaLabel: "Seleccionar rango de fechas",
+};
+/**
+ * DateSelector - Componente para seleccionar fechas individuales o rangos de fechas
+ * basado en HeroUI siguiendo las reglas de diseño BeweOS.
+ * Maneja su propio estado interno de manera autónoma.
+ */
+var DateSelector = function (_a) {
+    var _b = _a.initialType, initialType = _b === void 0 ? exports.HolidayType.SingleDay : _b, initialDate = _a.initialDate, initialDateRange = _a.initialDateRange, onChange = _a.onChange, _c = _a.translations, translations = _c === void 0 ? {} : _c, radioGroupProps = _a.radioGroupProps, radioItemProps = _a.radioItemProps, datePickerProps = _a.datePickerProps, dateRangePickerProps = _a.dateRangePickerProps, _d = _a.className, className = _d === void 0 ? "" : _d;
+    // Estado interno del componente
+    var _e = React.useState(initialType), type = _e[0], setType = _e[1];
+    var _f = React.useState(initialDate || null), date = _f[0], setDate = _f[1];
+    var _g = React.useState(initialDateRange || null), dateRange = _g[0], setDateRange = _g[1];
+    // Combinar traducciones por defecto con las proporcionadas
+    var t = __assign(__assign({}, defaultTranslations$5), translations);
+    var handleTypeChange = function (value) {
+        var newType = value;
+        setType(newType);
+        // Limpiar valores cuando cambia el tipo
+        if (newType === exports.HolidayType.SingleDay) {
+            setDateRange(null);
+        }
+        else {
+            setDate(null);
+        }
+        // Notificar cambio
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: newType,
+            date: newType === exports.HolidayType.SingleDay ? date : null,
+            dateRange: newType === exports.HolidayType.DateRange ? dateRange : null,
+        });
+    };
+    var handleDateChange = function (selectedDate) {
+        setDate(selectedDate);
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: type,
+            date: selectedDate,
+            dateRange: null,
+        });
+    };
+    var handleDateRangeChange = function (range) {
+        setDateRange(range);
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: type,
+            date: null,
+            dateRange: range,
+        });
+    };
+    return (jsxRuntime.jsxs("div", { className: "w-full flex flex-wrap xs:gap-5 justify-between items-center ".concat(className), children: [jsxRuntime.jsxs(react.RadioGroup, __assign({ color: "primary", orientation: "horizontal", size: "sm", value: type, onValueChange: handleTypeChange }, radioGroupProps, { children: [jsxRuntime.jsx(react.Radio, __assign({ value: exports.HolidayType.SingleDay }, radioItemProps, { children: t.dayOption })), jsxRuntime.jsx(react.Radio, __assign({ value: exports.HolidayType.DateRange }, radioItemProps, { children: t.dateRangeOption }))] })), type === exports.HolidayType.DateRange ? (jsxRuntime.jsx(react.DateRangePicker, __assign({ className: "xs:w-full md:flex-1 md:max-w-xs", value: dateRange || null, onChange: handleDateRangeChange, "aria-label": t.selectDateRangeAriaLabel, endContent: jsxRuntime.jsx(IconComponent, { icon: "solar:calendar-outline" }) }, dateRangePickerProps))) : (jsxRuntime.jsx(react.DatePicker, __assign({ className: "xs:w-full md:flex-1 md:max-w-40", value: date || null, onChange: handleDateChange, endContent: jsxRuntime.jsx(IconComponent, { icon: "solar:calendar-outline" }), "aria-label": t.selectDateAriaLabel }, datePickerProps)))] }));
+};
+
 var H1 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     return (jsxRuntime.jsx("h1", __assign({ className: react.cn("text-xl font-bold", className) }, props, { children: children })));
@@ -926,12 +983,12 @@ var H1 = function (_a) {
 
 var H3 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsxRuntime.jsx("h3", __assign({ className: react.cn("text-base font-medium mb-1", className) }, props, { children: children })));
+    return (jsxRuntime.jsx("h3", __assign({ className: react.cn("text-base font-medium", className) }, props, { children: children })));
 };
 
 var H4 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsxRuntime.jsx("h4", __assign({ className: react.cn("text-sm font-medium mb-1", className) }, props, { children: children })));
+    return (jsxRuntime.jsx("h4", __assign({ className: react.cn("text-sm font-medium ", className) }, props, { children: children })));
 };
 
 var ConfigMenu = function (_a) {
@@ -1330,7 +1387,7 @@ var MultiStepSidebar = React.forwardRef(function (_a, ref) {
             onClose === null || onClose === void 0 ? void 0 : onClose();
         }
     };
-    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.cn("flex h-full w-full max-w-4xl rounded-lg bg-background shadow-lg lg:h-auto", className) }, props, { children: [jsxRuntime.jsx("div", { className: "hidden w-1/3 flex-col items-center gap-y-8 p-8 lg:flex", children: jsxRuntime.jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage }) }), jsxRuntime.jsxs("div", { className: "relative flex h-auto w-full flex-col items-center gap-4 md:p-4 lg:w-2/3", children: [jsxRuntime.jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsxRuntime.jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsxRuntime.jsx("div", { className: "pt-9 w-10/12 lg:hidden", children: jsxRuntime.jsx("div", { className: "flex justify-center", children: jsxRuntime.jsx(StepIndicator, { className: react.cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsxRuntime.jsx("div", { className: "h-full w-full p-4 sm:max-w-md md:max-w-lg", children: children })] })] })) }));
+    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.cn("flex h-full w-full max-w-4xl rounded-lg bg-background shadow-lg lg:h-auto", className) }, props, { children: [jsxRuntime.jsx("div", { className: "hidden w-1/3 flex-col items-center justify-center gap-y-8 p-8 md:flex", children: jsxRuntime.jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage }) }), jsxRuntime.jsxs("div", { className: "relative flex h-auto justify-between w-full flex-col items-center gap-4 md:p-4 lg:w-2/3", children: [jsxRuntime.jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsxRuntime.jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsxRuntime.jsx("div", { className: "pt-9 w-10/12 md:hidden", children: jsxRuntime.jsx("div", { className: "flex  w-full justify-center", children: jsxRuntime.jsx(StepIndicator, { className: react.cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsxRuntime.jsx("div", { className: " flex flex-col h-full w-full justify-between p-4 sm:max-w-md md:max-w-lg", children: children })] })] })) }));
 });
 MultiStepSidebar.displayName = "MultiStepSidebar";
 
@@ -1340,47 +1397,31 @@ var MultistepNavigationButtons = function (_a) {
     // 	backButtonProps || {};
     var _b = nextButtonProps || {}, nextButtonChildren = _b.children, restNextButtonProps = __rest(_b, ["children"]);
     var _c = cancelButtonProps || {}, cancelButtonChildren = _c.children, restCancelButtonProps = __rest(_c, ["children"]);
-    return (jsxRuntime.jsx("div", { className: react.cn("flex w-full flex-col-reverse gap-2 pt-4 sm:flex-row sm:justify-between md:justify-end", className), children: jsxRuntime.jsxs("div", { className: "flex w-full flex-col-reverse gap-2 sm:w-auto sm:flex-row", children: [jsxRuntime.jsx(react.Button, __assign({ className: "w-full sm:w-auto", color: "primary", variant: "flat" }, restCancelButtonProps, { children: cancelButtonChildren || "Cancel" })), jsxRuntime.jsx(react.Button, __assign({ className: "w-full sm:w-auto", color: "primary" }, restNextButtonProps, { children: nextButtonChildren || "Next" }))] }) }));
+    return (jsxRuntime.jsx("div", { className: react.cn("flex w-full flex-col-reverse gap-2 pt-4 sm:flex-row sm:justify-between md:justify-end", className), children: jsxRuntime.jsxs("div", { className: "flex w-full flex-col-reverse gap-2 md:w-auto md:flex-row", children: [jsxRuntime.jsx(react.Button, __assign({ className: "w-full md:w-auto", color: "default", variant: "flat" }, restCancelButtonProps, { children: cancelButtonChildren || "Cancel" })), jsxRuntime.jsx(react.Button, __assign({ className: "w-full md:w-auto", color: "primary" }, restNextButtonProps, { children: nextButtonChildren || "Next" }))] }) }));
 };
 
-var variants = {
-    enter: function (direction) { return ({
-        y: direction > 0 ? 30 : -30,
-        opacity: 0,
-    }); },
-    center: {
-        zIndex: 1,
-        y: 0,
-        opacity: 1,
-    },
-    exit: function (direction) { return ({
-        zIndex: 0,
-        y: direction < 0 ? 30 : -30,
-        opacity: 0,
-    }); },
-};
 var MultiStepWizard = function (_a) {
-    var isOpen = _a.isOpen, steps = _a.steps, translations = _a.translations, onClose = _a.onClose;
-    var _b = React.useState([0, 0]), _c = _b[0], page = _c[0], direction = _c[1], setPage = _b[1];
+    var isOpen = _a.isOpen, steps = _a.steps, translations = _a.translations, onClose = _a.onClose, onComplete = _a.onComplete, completeButtonText = _a.completeButtonText;
+    var _b = React.useState(0), page = _b[0], setPage = _b[1];
     React.useEffect(function () {
         if (isOpen) {
-            setPage([0, 0]);
+            setPage(0);
         }
     }, [isOpen]);
     var t = __assign({
         continue: "Continue",
         goBack: "Back",
         cancel: "Cancel",
-        signUp: "Sign Up for Free",
-        goToPayment: "Go to Payment",
+        next: "Next",
+        complete: "Complete",
     }, translations);
     var paginate = React.useCallback(function (newDirection) {
         setPage(function (prev) {
-            var nextPage = prev[0] + newDirection;
+            var nextPage = prev + newDirection;
             if (nextPage < 0 || nextPage > steps.length - 1) {
                 return prev;
             }
-            return [nextPage, newDirection];
+            return nextPage;
         });
     }, [steps]);
     var onChangePage = React.useCallback(function (newPage) {
@@ -1388,8 +1429,7 @@ var MultiStepWizard = function (_a) {
             if (newPage < 0 || newPage > steps.length - 1) {
                 return prev;
             }
-            var currentPage = prev[0];
-            return [newPage, newPage > currentPage ? 1 : -1];
+            return newPage;
         });
     }, [steps]);
     var onBack = React.useCallback(function () {
@@ -1398,33 +1438,45 @@ var MultiStepWizard = function (_a) {
     var onNext = React.useCallback(function () {
         paginate(1);
     }, [paginate]);
+    // Determinar el texto del botón según el paso
+    var getButtonText = function () {
+        if (page === 0) {
+            return t.next;
+        }
+        if (page === steps.length - 1) {
+            return completeButtonText || t.complete;
+        }
+        return t.continue;
+    };
+    // Determinar la acción del botón según el paso
+    var handleNextAction = function () {
+        if (page === steps.length - 1) {
+            // Último paso: ejecutar acción de completado
+            onComplete === null || onComplete === void 0 ? void 0 : onComplete();
+        }
+        else {
+            // Otros pasos: continuar al siguiente
+            onNext();
+        }
+    };
     var content = React.useMemo(function () {
-        return (jsxRuntime.jsx(framerMotion.LazyMotion, { features: framerMotion.domAnimation, children: jsxRuntime.jsx(framerMotion.m.div, { animate: "center", className: "col-span-12", custom: direction, exit: "exit", initial: "exit", transition: {
-                    y: {
-                        ease: "backOut",
-                        duration: 0.35,
-                    },
-                    opacity: { duration: 0.4 },
-                }, variants: variants, children: steps[page].content }, page) }));
-    }, [page, steps, direction]);
+        return (jsxRuntime.jsx("div", { className: "col-span-12", children: steps[page].content }, page));
+    }, [page, steps]);
     if (!isOpen) {
         return null;
     }
-    return (jsxRuntime.jsxs(MultiStepSidebar, { currentPage: page, goBackTranslation: t.goBack, steps: steps, onBack: onBack, onChangePage: onChangePage, onClose: onClose, onNext: onNext, children: [jsxRuntime.jsx(Button, { className: "w-fit text-default-600 mb-6", color: "default", variant: "light", onPress: onBack, isDisabled: page === 0, startContent: jsxRuntime.jsx(IconComponent, { className: "text-default-500", icon: "material-symbols:arrow-back-rounded", size: "sm" }), children: t.goBack || "Back" }), jsxRuntime.jsxs("div", { className: "relative flex h-fit w-full flex-col pt-6 text-center lg:h-full lg:justify-center lg:pt-0", children: [content, jsxRuntime.jsx(MultistepNavigationButtons, { backButtonProps: {
-                            isDisabled: page === 0,
-                            onPress: onBack,
-                            children: t.goBack,
-                        }, cancelButtonProps: {
-                            onPress: onClose,
-                            children: t.cancel,
-                        }, nextButtonProps: {
-                            children: page === 0
-                                ? t.signUp
-                                : page === steps.length - 1
-                                    ? t.goToPayment
-                                    : t.continue,
-                            onPress: onNext,
-                        } })] })] }));
+    return (jsxRuntime.jsxs(MultiStepSidebar, { currentPage: page, goBackTranslation: t.goBack, steps: steps, onBack: onBack, onChangePage: onChangePage, onClose: onClose, onNext: onNext, children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Button, { className: "w-fit text-default-600 mb-6", color: "default", variant: "light", onPress: onBack, isDisabled: page === 0, startContent: jsxRuntime.jsx(IconComponent, { className: "text-default-500", icon: "material-symbols:arrow-back-rounded", size: "sm" }), children: t.goBack || "Back" }), jsxRuntime.jsx("div", { className: "relative flex h-fit w-full flex-col text-center lg:justify-center lg:pt-0", children: content })] }), jsxRuntime.jsx(MultistepNavigationButtons, { backButtonProps: {
+                    isDisabled: page === 0,
+                    onPress: onBack,
+                    children: t.goBack,
+                }, cancelButtonProps: {
+                    onPress: onClose,
+                    children: t.cancel,
+                }, nextButtonProps: {
+                    children: getButtonText(),
+                    onPress: handleNextAction,
+                    isDisabled: steps[page].isStepValid === false,
+                } })] }));
 };
 
 var Pagination = function (_a) {
@@ -1550,7 +1602,7 @@ var Phone = function (_a) {
             onChange({ countryCode: selectedCountry.code, phoneNumber: val });
         }
     };
-    return (jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 w-full relative", id: id, children: [finalLabel && (jsxRuntime.jsxs("label", { htmlFor: "phone-input-".concat(name), className: "text-tiny text-default-500 mb-1", children: [finalLabel, " ", required && jsxRuntime.jsx("span", { className: "text-danger-500", children: "*" })] })), jsxRuntime.jsxs("div", { className: "flex items-center w-full min-h-[56px]  transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500 dark:focus-within:border-primary-500 ".concat(error ? "border-danger-500 " : "border-default-200").concat(disabled ? "opacity-60" : ""), children: [jsxRuntime.jsx("div", { className: "relative ml-2", ref: dropdownRef, children: jsxRuntime.jsxs("button", { type: "button", className: "flex items-center gap-1 px-4 h-10 rounded-xl  bg-default-100  focus:outline-none transition-colors", onClick: function () { return setIsDropdownOpen(function (v) { return !v; }); }, disabled: disabled, tabIndex: 0, "aria-label": t.selectCountryAriaLabel, children: [jsxRuntime.jsx("span", { className: "text-lg", children: selectedCountry.flag }), jsxRuntime.jsx("span", { className: "text-xs text-default-500", children: selectedCountry.code }), jsxRuntime.jsxs("svg", { className: "w-4 h-4 text-default-500 ml-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", role: "img", "aria-label": t.expandListAriaLabel, children: [jsxRuntime.jsx("title", { children: t.expandListAriaLabel }), jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })] })] }) }), jsxRuntime.jsx(react.Input, { type: "tel", className: "flex-1 border-none bg-transparent text-default-500  placeholder-default-500 px-2", placeholder: t.placeholder, value: inputValue, onChange: handleInputChange, onBlur: onBlur, disabled: disabled, name: name, autoComplete: "tel", id: "phone-input-".concat(name) })] }), error && errorText && (jsxRuntime.jsx("span", { className: "text-xs text-danger-500 mt-1", children: errorText })), isDropdownOpen &&
+    return (jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 w-full relative", id: id, children: [finalLabel && (jsxRuntime.jsxs("label", { htmlFor: "phone-input-".concat(name), className: "text-tiny text-default-500 mb-1 text-left", children: [finalLabel, " ", required && jsxRuntime.jsx("span", { className: "text-danger-500", children: "*" })] })), jsxRuntime.jsxs("div", { className: "flex items-center w-full min-h-[56px]  transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500  ".concat(error ? "!border-danger-500 " : "border-default-200").concat(disabled ? "opacity-60" : ""), children: [jsxRuntime.jsx("div", { className: "relative ml-2", ref: dropdownRef, children: jsxRuntime.jsxs("button", { type: "button", className: "flex items-center gap-1 px-4 h-10 rounded-xl  bg-default-100  focus:outline-none transition-colors", onClick: function () { return setIsDropdownOpen(function (v) { return !v; }); }, disabled: disabled, tabIndex: 0, "aria-label": t.selectCountryAriaLabel, children: [jsxRuntime.jsx("span", { className: "text-lg", children: selectedCountry.flag }), jsxRuntime.jsx("span", { className: "text-xs text-default-500", children: selectedCountry.code }), jsxRuntime.jsxs("svg", { className: "w-4 h-4 text-default-500 ml-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", role: "img", "aria-label": t.expandListAriaLabel, children: [jsxRuntime.jsx("title", { children: t.expandListAriaLabel }), jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })] })] }) }), jsxRuntime.jsx(react.Input, { type: "tel", className: "flex-1 border-none bg-transparent text-default-500  placeholder-default-500 px-2", placeholder: t.placeholder, value: inputValue, onChange: handleInputChange, onBlur: onBlur, disabled: disabled, name: name, autoComplete: "tel", id: "phone-input-".concat(name) })] }), error && errorText && (jsxRuntime.jsx("span", { className: " text-left text-xs text-danger-500 mt-1", children: errorText })), isDropdownOpen &&
                 reactDom.createPortal(jsxRuntime.jsxs("div", { ref: portalDropdownRef, style: dropdownPosition, className: "bg-content1 border border-default-200 rounded-lg shadow-lg z-50", children: [jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsx("input", { type: "text", className: "w-full px-3 py-2 text-sm bg-default-100 border-medium border-default-200 text-default-500 rounded-lg focus:outline-none focus:border-primary-500", placeholder: t.searchPlaceholder, onChange: function (e) {
                                     var searchTerm = e.target.value.toLowerCase();
                                     var filtered = uniqueCountries.filter(function (country) {
@@ -2718,6 +2770,7 @@ exports.Card = Card;
 exports.ColorSelector = ColorSelector;
 exports.DatePicker = DatePicker;
 exports.DateRangePicker = DateRangePicker;
+exports.DateSelector = DateSelector;
 exports.GlobalToast = GlobalToast;
 exports.H1 = H1;
 exports.H2 = H2;

package/dist/index.esm.js

@@ -134,10 +134,11 @@ var Input = function (_a) {
     return (jsx(Input$1, __assign({}, props, { id: inputId, label: label, labelPlacement: "outside", placeholder: placeholder, variant: variant, size: size, radius: radius, classNames: {
             label: "text-default-600 text-tiny group-data-[filled=true]:text-default-600",
             inputWrapper: "focus-within:!border-primary-500",
+            errorMessage: "text-left",
         } })));
 };
 
-var defaultTranslations$6 = {
+var defaultTranslations$7 = {
     addHolidayTitle: "Add holiday",
     dayOption: "Day",
     dateRangeOption: "Date range",
@@ -161,7 +162,7 @@ var INITIAL_HOLIDAY_STATE = {
  */
 var AddHolidayForm = function (_a) {
     var onAddHoliday = _a.onAddHoliday, translations = _a.translations, className = _a.className, radioGroupProps = _a.radioGroupProps, dateRangePickerProps = _a.dateRangePickerProps, buttonProps = _a.buttonProps;
-    var t = __assign(__assign({}, defaultTranslations$6), translations);
+    var t = __assign(__assign({}, defaultTranslations$7), translations);
     var _b = useState(INITIAL_HOLIDAY_STATE), newHoliday = _b[0], setNewHoliday = _b[1];
     /**
      * A boolean flag that determines if a date has been set.
@@ -223,15 +224,15 @@ var AddHolidayForm = function (_a) {
 
 var H2 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsx("h2", __assign({ className: cn("text-lg font-medium", className) }, props, { children: children })));
+    return (jsx("h2", __assign({ className: cn("text-lg font-semibold", className) }, props, { children: children })));
 };
 
 var P = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsx("p", __assign({ className: cn("text-sm text-default-500", className) }, props, { children: children })));
+    return (jsx("p", __assign({ className: cn("text-sm text-default-500 font-normal", className) }, props, { children: children })));
 };
 
-var defaultTranslations$5 = {
+var defaultTranslations$6 = {
     title: "Analytics",
     description: "Monthly growth of your metrics during the selected period",
     viewDetails: "View Details",
@@ -285,7 +286,7 @@ var formatMonth = function (month) {
 var AnalyticsCard = function (_a) {
     var _b, _c;
     var data = _a.data, _d = _a.showTimePeriods, showTimePeriods = _d === void 0 ? true : _d, _e = _a.showDropdownMenu, showDropdownMenu = _e === void 0 ? true : _e, _f = _a.showMetricCards, showMetricCards = _f === void 0 ? true : _f, onChartChange = _a.onChartChange, onMenuAction = _a.onMenuAction, onTimePeriodChange = _a.onTimePeriodChange, _g = _a.translations, translations = _g === void 0 ? {} : _g, props = __rest(_a, ["data", "showTimePeriods", "showDropdownMenu", "showMetricCards", "onChartChange", "onMenuAction", "onTimePeriodChange", "translations"]);
-    var t = __assign(__assign({}, defaultTranslations$5), translations);
+    var t = __assign(__assign({}, defaultTranslations$6), translations);
     var _h = useState((_c = (_b = data[0]) === null || _b === void 0 ? void 0 : _b.key) !== null && _c !== void 0 ? _c : ""), activeChart = _h[0], setActiveChart = _h[1];
     var activeChartData = useMemo(function () {
         var _a;
@@ -918,6 +919,62 @@ var ColorSelector = function (_a) {
                     : "border-gray-200 hover:scale-105"), style: { backgroundColor: color.color }, title: color.label }) }, color.value)); }) }));
 };
 
+// Traducciones por defecto en español
+var defaultTranslations$5 = {
+    dayOption: "Día específico",
+    dateRangeOption: "Rango de fechas",
+    selectDateAriaLabel: "Seleccionar fecha",
+    selectDateRangeAriaLabel: "Seleccionar rango de fechas",
+};
+/**
+ * DateSelector - Componente para seleccionar fechas individuales o rangos de fechas
+ * basado en HeroUI siguiendo las reglas de diseño BeweOS.
+ * Maneja su propio estado interno de manera autónoma.
+ */
+var DateSelector = function (_a) {
+    var _b = _a.initialType, initialType = _b === void 0 ? HolidayType.SingleDay : _b, initialDate = _a.initialDate, initialDateRange = _a.initialDateRange, onChange = _a.onChange, _c = _a.translations, translations = _c === void 0 ? {} : _c, radioGroupProps = _a.radioGroupProps, radioItemProps = _a.radioItemProps, datePickerProps = _a.datePickerProps, dateRangePickerProps = _a.dateRangePickerProps, _d = _a.className, className = _d === void 0 ? "" : _d;
+    // Estado interno del componente
+    var _e = React.useState(initialType), type = _e[0], setType = _e[1];
+    var _f = React.useState(initialDate || null), date = _f[0], setDate = _f[1];
+    var _g = React.useState(initialDateRange || null), dateRange = _g[0], setDateRange = _g[1];
+    // Combinar traducciones por defecto con las proporcionadas
+    var t = __assign(__assign({}, defaultTranslations$5), translations);
+    var handleTypeChange = function (value) {
+        var newType = value;
+        setType(newType);
+        // Limpiar valores cuando cambia el tipo
+        if (newType === HolidayType.SingleDay) {
+            setDateRange(null);
+        }
+        else {
+            setDate(null);
+        }
+        // Notificar cambio
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: newType,
+            date: newType === HolidayType.SingleDay ? date : null,
+            dateRange: newType === HolidayType.DateRange ? dateRange : null,
+        });
+    };
+    var handleDateChange = function (selectedDate) {
+        setDate(selectedDate);
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: type,
+            date: selectedDate,
+            dateRange: null,
+        });
+    };
+    var handleDateRangeChange = function (range) {
+        setDateRange(range);
+        onChange === null || onChange === void 0 ? void 0 : onChange({
+            type: type,
+            date: null,
+            dateRange: range,
+        });
+    };
+    return (jsxs("div", { className: "w-full flex flex-wrap xs:gap-5 justify-between items-center ".concat(className), children: [jsxs(RadioGroup, __assign({ color: "primary", orientation: "horizontal", size: "sm", value: type, onValueChange: handleTypeChange }, radioGroupProps, { children: [jsx(Radio, __assign({ value: HolidayType.SingleDay }, radioItemProps, { children: t.dayOption })), jsx(Radio, __assign({ value: HolidayType.DateRange }, radioItemProps, { children: t.dateRangeOption }))] })), type === HolidayType.DateRange ? (jsx(DateRangePicker$1, __assign({ className: "xs:w-full md:flex-1 md:max-w-xs", value: dateRange || null, onChange: handleDateRangeChange, "aria-label": t.selectDateRangeAriaLabel, endContent: jsx(IconComponent, { icon: "solar:calendar-outline" }) }, dateRangePickerProps))) : (jsx(DatePicker$1, __assign({ className: "xs:w-full md:flex-1 md:max-w-40", value: date || null, onChange: handleDateChange, endContent: jsx(IconComponent, { icon: "solar:calendar-outline" }), "aria-label": t.selectDateAriaLabel }, datePickerProps)))] }));
+};
+
 var H1 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     return (jsx("h1", __assign({ className: cn("text-xl font-bold", className) }, props, { children: children })));
@@ -925,12 +982,12 @@ var H1 = function (_a) {
 
 var H3 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsx("h3", __assign({ className: cn("text-base font-medium mb-1", className) }, props, { children: children })));
+    return (jsx("h3", __assign({ className: cn("text-base font-medium", className) }, props, { children: children })));
 };
 
 var H4 = function (_a) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
-    return (jsx("h4", __assign({ className: cn("text-sm font-medium mb-1", className) }, props, { children: children })));
+    return (jsx("h4", __assign({ className: cn("text-sm font-medium ", className) }, props, { children: children })));
 };
 
 var ConfigMenu = function (_a) {
@@ -1329,7 +1386,7 @@ var MultiStepSidebar = React.forwardRef(function (_a, ref) {
             onClose === null || onClose === void 0 ? void 0 : onClose();
         }
     };
-    return (jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxs("div", __assign({ ref: ref, className: cn("flex h-full w-full max-w-4xl rounded-lg bg-background shadow-lg lg:h-auto", className) }, props, { children: [jsx("div", { className: "hidden w-1/3 flex-col items-center gap-y-8 p-8 lg:flex", children: jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage }) }), jsxs("div", { className: "relative flex h-auto w-full flex-col items-center gap-4 md:p-4 lg:w-2/3", children: [jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsx("div", { className: "pt-9 w-10/12 lg:hidden", children: jsx("div", { className: "flex justify-center", children: jsx(StepIndicator, { className: cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsx("div", { className: "h-full w-full p-4 sm:max-w-md md:max-w-lg", children: children })] })] })) }));
+    return (jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxs("div", __assign({ ref: ref, className: cn("flex h-full w-full max-w-4xl rounded-lg bg-background shadow-lg lg:h-auto", className) }, props, { children: [jsx("div", { className: "hidden w-1/3 flex-col items-center justify-center gap-y-8 p-8 md:flex", children: jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage }) }), jsxs("div", { className: "relative flex h-auto justify-between w-full flex-col items-center gap-4 md:p-4 lg:w-2/3", children: [jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsx("div", { className: "pt-9 w-10/12 md:hidden", children: jsx("div", { className: "flex  w-full justify-center", children: jsx(StepIndicator, { className: cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsx("div", { className: " flex flex-col h-full w-full justify-between p-4 sm:max-w-md md:max-w-lg", children: children })] })] })) }));
 });
 MultiStepSidebar.displayName = "MultiStepSidebar";
 
@@ -1339,47 +1396,31 @@ var MultistepNavigationButtons = function (_a) {
     // 	backButtonProps || {};
     var _b = nextButtonProps || {}, nextButtonChildren = _b.children, restNextButtonProps = __rest(_b, ["children"]);
     var _c = cancelButtonProps || {}, cancelButtonChildren = _c.children, restCancelButtonProps = __rest(_c, ["children"]);
-    return (jsx("div", { className: cn("flex w-full flex-col-reverse gap-2 pt-4 sm:flex-row sm:justify-between md:justify-end", className), children: jsxs("div", { className: "flex w-full flex-col-reverse gap-2 sm:w-auto sm:flex-row", children: [jsx(Button$1, __assign({ className: "w-full sm:w-auto", color: "primary", variant: "flat" }, restCancelButtonProps, { children: cancelButtonChildren || "Cancel" })), jsx(Button$1, __assign({ className: "w-full sm:w-auto", color: "primary" }, restNextButtonProps, { children: nextButtonChildren || "Next" }))] }) }));
+    return (jsx("div", { className: cn("flex w-full flex-col-reverse gap-2 pt-4 sm:flex-row sm:justify-between md:justify-end", className), children: jsxs("div", { className: "flex w-full flex-col-reverse gap-2 md:w-auto md:flex-row", children: [jsx(Button$1, __assign({ className: "w-full md:w-auto", color: "default", variant: "flat" }, restCancelButtonProps, { children: cancelButtonChildren || "Cancel" })), jsx(Button$1, __assign({ className: "w-full md:w-auto", color: "primary" }, restNextButtonProps, { children: nextButtonChildren || "Next" }))] }) }));
 };
 
-var variants = {
-    enter: function (direction) { return ({
-        y: direction > 0 ? 30 : -30,
-        opacity: 0,
-    }); },
-    center: {
-        zIndex: 1,
-        y: 0,
-        opacity: 1,
-    },
-    exit: function (direction) { return ({
-        zIndex: 0,
-        y: direction < 0 ? 30 : -30,
-        opacity: 0,
-    }); },
-};
 var MultiStepWizard = function (_a) {
-    var isOpen = _a.isOpen, steps = _a.steps, translations = _a.translations, onClose = _a.onClose;
-    var _b = React.useState([0, 0]), _c = _b[0], page = _c[0], direction = _c[1], setPage = _b[1];
+    var isOpen = _a.isOpen, steps = _a.steps, translations = _a.translations, onClose = _a.onClose, onComplete = _a.onComplete, completeButtonText = _a.completeButtonText;
+    var _b = React.useState(0), page = _b[0], setPage = _b[1];
     React.useEffect(function () {
         if (isOpen) {
-            setPage([0, 0]);
+            setPage(0);
         }
     }, [isOpen]);
     var t = __assign({
         continue: "Continue",
         goBack: "Back",
         cancel: "Cancel",
-        signUp: "Sign Up for Free",
-        goToPayment: "Go to Payment",
+        next: "Next",
+        complete: "Complete",
     }, translations);
     var paginate = React.useCallback(function (newDirection) {
         setPage(function (prev) {
-            var nextPage = prev[0] + newDirection;
+            var nextPage = prev + newDirection;
             if (nextPage < 0 || nextPage > steps.length - 1) {
                 return prev;
             }
-            return [nextPage, newDirection];
+            return nextPage;
         });
     }, [steps]);
     var onChangePage = React.useCallback(function (newPage) {
@@ -1387,8 +1428,7 @@ var MultiStepWizard = function (_a) {
             if (newPage < 0 || newPage > steps.length - 1) {
                 return prev;
             }
-            var currentPage = prev[0];
-            return [newPage, newPage > currentPage ? 1 : -1];
+            return newPage;
         });
     }, [steps]);
     var onBack = React.useCallback(function () {
@@ -1397,33 +1437,45 @@ var MultiStepWizard = function (_a) {
     var onNext = React.useCallback(function () {
         paginate(1);
     }, [paginate]);
+    // Determinar el texto del botón según el paso
+    var getButtonText = function () {
+        if (page === 0) {
+            return t.next;
+        }
+        if (page === steps.length - 1) {
+            return completeButtonText || t.complete;
+        }
+        return t.continue;
+    };
+    // Determinar la acción del botón según el paso
+    var handleNextAction = function () {
+        if (page === steps.length - 1) {
+            // Último paso: ejecutar acción de completado
+            onComplete === null || onComplete === void 0 ? void 0 : onComplete();
+        }
+        else {
+            // Otros pasos: continuar al siguiente
+            onNext();
+        }
+    };
     var content = React.useMemo(function () {
-        return (jsx(LazyMotion, { features: domAnimation, children: jsx(m.div, { animate: "center", className: "col-span-12", custom: direction, exit: "exit", initial: "exit", transition: {
-                    y: {
-                        ease: "backOut",
-                        duration: 0.35,
-                    },
-                    opacity: { duration: 0.4 },
-                }, variants: variants, children: steps[page].content }, page) }));
-    }, [page, steps, direction]);
+        return (jsx("div", { className: "col-span-12", children: steps[page].content }, page));
+    }, [page, steps]);
     if (!isOpen) {
         return null;
     }
-    return (jsxs(MultiStepSidebar, { currentPage: page, goBackTranslation: t.goBack, steps: steps, onBack: onBack, onChangePage: onChangePage, onClose: onClose, onNext: onNext, children: [jsx(Button, { className: "w-fit text-default-600 mb-6", color: "default", variant: "light", onPress: onBack, isDisabled: page === 0, startContent: jsx(IconComponent, { className: "text-default-500", icon: "material-symbols:arrow-back-rounded", size: "sm" }), children: t.goBack || "Back" }), jsxs("div", { className: "relative flex h-fit w-full flex-col pt-6 text-center lg:h-full lg:justify-center lg:pt-0", children: [content, jsx(MultistepNavigationButtons, { backButtonProps: {
-                            isDisabled: page === 0,
-                            onPress: onBack,
-                            children: t.goBack,
-                        }, cancelButtonProps: {
-                            onPress: onClose,
-                            children: t.cancel,
-                        }, nextButtonProps: {
-                            children: page === 0
-                                ? t.signUp
-                                : page === steps.length - 1
-                                    ? t.goToPayment
-                                    : t.continue,
-                            onPress: onNext,
-                        } })] })] }));
+    return (jsxs(MultiStepSidebar, { currentPage: page, goBackTranslation: t.goBack, steps: steps, onBack: onBack, onChangePage: onChangePage, onClose: onClose, onNext: onNext, children: [jsxs("div", { children: [jsx(Button, { className: "w-fit text-default-600 mb-6", color: "default", variant: "light", onPress: onBack, isDisabled: page === 0, startContent: jsx(IconComponent, { className: "text-default-500", icon: "material-symbols:arrow-back-rounded", size: "sm" }), children: t.goBack || "Back" }), jsx("div", { className: "relative flex h-fit w-full flex-col text-center lg:justify-center lg:pt-0", children: content })] }), jsx(MultistepNavigationButtons, { backButtonProps: {
+                    isDisabled: page === 0,
+                    onPress: onBack,
+                    children: t.goBack,
+                }, cancelButtonProps: {
+                    onPress: onClose,
+                    children: t.cancel,
+                }, nextButtonProps: {
+                    children: getButtonText(),
+                    onPress: handleNextAction,
+                    isDisabled: steps[page].isStepValid === false,
+                } })] }));
 };
 
 var Pagination = function (_a) {
@@ -1549,7 +1601,7 @@ var Phone = function (_a) {
             onChange({ countryCode: selectedCountry.code, phoneNumber: val });
         }
     };
-    return (jsxs("div", { className: "flex flex-col gap-1 w-full relative", id: id, children: [finalLabel && (jsxs("label", { htmlFor: "phone-input-".concat(name), className: "text-tiny text-default-500 mb-1", children: [finalLabel, " ", required && jsx("span", { className: "text-danger-500", children: "*" })] })), jsxs("div", { className: "flex items-center w-full min-h-[56px]  transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500 dark:focus-within:border-primary-500 ".concat(error ? "border-danger-500 " : "border-default-200").concat(disabled ? "opacity-60" : ""), children: [jsx("div", { className: "relative ml-2", ref: dropdownRef, children: jsxs("button", { type: "button", className: "flex items-center gap-1 px-4 h-10 rounded-xl  bg-default-100  focus:outline-none transition-colors", onClick: function () { return setIsDropdownOpen(function (v) { return !v; }); }, disabled: disabled, tabIndex: 0, "aria-label": t.selectCountryAriaLabel, children: [jsx("span", { className: "text-lg", children: selectedCountry.flag }), jsx("span", { className: "text-xs text-default-500", children: selectedCountry.code }), jsxs("svg", { className: "w-4 h-4 text-default-500 ml-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", role: "img", "aria-label": t.expandListAriaLabel, children: [jsx("title", { children: t.expandListAriaLabel }), jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })] })] }) }), jsx(Input$1, { type: "tel", className: "flex-1 border-none bg-transparent text-default-500  placeholder-default-500 px-2", placeholder: t.placeholder, value: inputValue, onChange: handleInputChange, onBlur: onBlur, disabled: disabled, name: name, autoComplete: "tel", id: "phone-input-".concat(name) })] }), error && errorText && (jsx("span", { className: "text-xs text-danger-500 mt-1", children: errorText })), isDropdownOpen &&
+    return (jsxs("div", { className: "flex flex-col gap-1 w-full relative", id: id, children: [finalLabel && (jsxs("label", { htmlFor: "phone-input-".concat(name), className: "text-tiny text-default-500 mb-1 text-left", children: [finalLabel, " ", required && jsx("span", { className: "text-danger-500", children: "*" })] })), jsxs("div", { className: "flex items-center w-full min-h-[56px]  transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500  ".concat(error ? "!border-danger-500 " : "border-default-200").concat(disabled ? "opacity-60" : ""), children: [jsx("div", { className: "relative ml-2", ref: dropdownRef, children: jsxs("button", { type: "button", className: "flex items-center gap-1 px-4 h-10 rounded-xl  bg-default-100  focus:outline-none transition-colors", onClick: function () { return setIsDropdownOpen(function (v) { return !v; }); }, disabled: disabled, tabIndex: 0, "aria-label": t.selectCountryAriaLabel, children: [jsx("span", { className: "text-lg", children: selectedCountry.flag }), jsx("span", { className: "text-xs text-default-500", children: selectedCountry.code }), jsxs("svg", { className: "w-4 h-4 text-default-500 ml-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", role: "img", "aria-label": t.expandListAriaLabel, children: [jsx("title", { children: t.expandListAriaLabel }), jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })] })] }) }), jsx(Input$1, { type: "tel", className: "flex-1 border-none bg-transparent text-default-500  placeholder-default-500 px-2", placeholder: t.placeholder, value: inputValue, onChange: handleInputChange, onBlur: onBlur, disabled: disabled, name: name, autoComplete: "tel", id: "phone-input-".concat(name) })] }), error && errorText && (jsx("span", { className: " text-left text-xs text-danger-500 mt-1", children: errorText })), isDropdownOpen &&
                 createPortal(jsxs("div", { ref: portalDropdownRef, style: dropdownPosition, className: "bg-content1 border border-default-200 rounded-lg shadow-lg z-50", children: [jsx("div", { className: "p-2", children: jsx("input", { type: "text", className: "w-full px-3 py-2 text-sm bg-default-100 border-medium border-default-200 text-default-500 rounded-lg focus:outline-none focus:border-primary-500", placeholder: t.searchPlaceholder, onChange: function (e) {
                                     var searchTerm = e.target.value.toLowerCase();
                                     var filtered = uniqueCountries.filter(function (country) {
@@ -2707,4 +2759,4 @@ var AuraToastProvider = function (_a) {
     return (jsx(ToastContext.Provider, { value: { toast: toast, showToast: showToast, hideToast: hideToast }, children: children }));
 };
 
-export { AddHolidayForm, AnalyticsCard, AuraTable, AuraToastProvider, AutoComplete, Button, Card, ColorSelector, DatePicker, DateRangePicker, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, Input, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, P, Pagination, Phone, PromotionalBanner, RowSteps, ScheduleRow, Select, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, sizeMap, themeColors, useAuraToast, useThemeContext };
+export { AddHolidayForm, AnalyticsCard, AuraTable, AuraToastProvider, AutoComplete, Button, Card, ColorSelector, DatePicker, DateRangePicker, DateSelector, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, Input, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, P, Pagination, Phone, PromotionalBanner, RowSteps, ScheduleRow, Select, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, sizeMap, themeColors, useAuraToast, useThemeContext };

package/dist/types/components/date-selector/DateSelector.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { DateSelectorProps } from "./DateSelector.types";
+/**
+ * DateSelector - Componente para seleccionar fechas individuales o rangos de fechas
+ * basado en HeroUI siguiendo las reglas de diseño BeweOS.
+ * Maneja su propio estado interno de manera autónoma.
+ */
+export declare const DateSelector: React.FC<DateSelectorProps>;
+//# sourceMappingURL=DateSelector.d.ts.map

package/dist/types/components/date-selector/DateSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/date-selector/DateSelector.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAU9D;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmGpD,CAAC"}