@rolster/react-components 18.15.41 → 18.16.0

package/dist/es/index.js

@@ -1,7 +1,7 @@
 import require$$0, { useState, useRef, useEffect, createContext } from 'react';
 import { currencyFormat, itIsDefined, PartialSealed } from '@rolster/commons';
 import { dateFormatTemplate, DAY_LABELS, DateRange, normalizeMinTime, assignDayInDate, dateIsBefore, MONTH_NAMES, Month, assignYearInDate, assignMonthInDate } from '@rolster/dates';
-import { PaginationController, checkDayPicker, createDayPicker, createDayRangePicker, checkMonthPicker, createMonthPicker, monthLimitTemplate, createYearPicker, checkYearPicker, ListCollection, locationListCanTop, navigationListFromInput, navigationListFromElement, createAutocompleteStore, checkDateRange, dateOutRange, PickerListenerType } from '@rolster/components';
+import { PaginationController, verifyDayPicker, createDayPicker, createDayRangePicker, verifyMonthPicker, createMonthPicker, monthLimitTemplate, createYearPicker, verifyYearPicker, ListCollection, locationListCanTop, navigationListFromInput, navigationListFromElement, createAutocompleteStore, verifyDateRange, dateOutRange, PickerListenerEvent } from '@rolster/components';
 import ReactDOM from 'react-dom';
 import { i18n } from '@rolster/i18n';
 import { useReactControl } from '@rolster/react-forms';
@@ -1732,17 +1732,17 @@ function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxDate, mo
     const [weeks, setWeeks] = useState([]);
     const [value, setValue] = useState(formControl?.value || currentDate.getDate());
     useEffect(() => {
-        const props = createPickerProps();
-        const day = checkDayPicker(props);
-        day ? setDayValue(day) : setWeeks(createDayPicker(props));
+        const options = createPickerOptions();
+        const day = verifyDayPicker(options);
+        day ? setDayValue(day) : setWeeks(createDayPicker(options));
     }, [date, month, year, value, minDate, maxDate]);
     useEffect(() => {
-        const day = checkDayPicker(createPickerProps());
+        const day = verifyDayPicker(createPickerOptions());
         day
             ? formControl?.setValue(day)
             : setValue(formControl?.value || currentDate.getDate());
     }, [formControl?.value]);
-    function createPickerProps() {
+    function createPickerOptions() {
         return {
             date: currentDate,
             day: formControl?.value || value,
@@ -1811,17 +1811,17 @@ function RlsPickerMonth({ date, disabled: disabledPicker, formControl, maxDate,
     const [months, setMonths] = useState([]);
     const [value, setValue] = useState(formControl?.value || currentDate.getMonth());
     useEffect(() => {
-        const props = createPickerProps(); // MonthPickerProps
-        const month = checkMonthPicker(props);
-        month ? setMonthValue(month) : setMonths(createMonthPicker(props));
+        const options = createPickerOptions(); // MonthPickerProps
+        const month = verifyMonthPicker(options);
+        month ? setMonthValue(month) : setMonths(createMonthPicker(options));
     }, [date, year, value, minDate, maxDate]);
     useEffect(() => {
-        const month = checkMonthPicker(createPickerProps());
+        const month = verifyMonthPicker(createPickerOptions());
         itIsDefined(month)
             ? formControl?.setValue(month)
             : setValue(formControl?.value || currentDate.getMonth());
     }, [formControl?.value]);
-    function createPickerProps() {
+    function createPickerOptions() {
         return {
             date: currentDate,
             month: itIsDefined(formControl?.value) ? formControl?.value : value,
@@ -1901,21 +1901,21 @@ function RlsPickerYear({ date, disabled: disabledPicker, formControl, maxDate, m
     const currentDate = date || new Date();
     const [value, setValue] = useState(formControl?.value || currentDate.getFullYear());
     const [year, setYear] = useState(formControl?.value || currentDate.getFullYear());
-    const [template, setTemplate] = useState(createYearPicker(createPickerProps()));
+    const [template, setTemplate] = useState(createYearPicker(createPickerOptions()));
     useEffect(() => {
-        const props = createPickerProps(); // YearPickerProps
-        const year = checkYearPicker(props);
+        const options = createPickerOptions(); // YearPickerProps
+        const year = verifyYearPicker(options);
         year
             ? setYearValue(year)
-            : setTemplate(createYearPicker(createPickerProps()));
+            : setTemplate(createYearPicker(createPickerOptions()));
     }, [date, year, value, minDate, maxDate]);
     useEffect(() => {
-        const year = checkYearPicker(createPickerProps());
+        const year = verifyYearPicker(createPickerOptions());
         itIsDefined(year)
             ? formControl?.setValue(year)
             : setValue(formControl?.value || currentDate.getFullYear());
     }, [formControl?.value]);
-    function createPickerProps() {
+    function createPickerOptions() {
         return {
             date: currentDate,
             year,
@@ -2318,13 +2318,13 @@ function RlsPickerDate({ automatic, date, disabled, formControl, maxDate, minDat
     const [value, setValue] = useState(dateInitial);
     const [visibility, setVisibility] = useState('DAY');
     useEffect(() => {
-        const dateCheck = checkDateRange({
+        const dateRange = verifyDateRange({
             date: formControl?.value || date || today,
             minDate,
             maxDate
         });
-        setValue(dateCheck);
-        formControl?.setValue(dateCheck);
+        setValue(dateRange);
+        formControl?.setValue(dateRange);
     }, []);
     useEffect(() => {
         itIsDefined(yearControl.value) &&
@@ -2348,18 +2348,18 @@ function RlsPickerDate({ automatic, date, disabled, formControl, maxDate, minDat
         setVisibility('YEAR');
     }
     function onCancel() {
-        onListener && onListener({ type: PickerListenerType.Cancel });
+        onListener && onListener({ event: PickerListenerEvent.Cancel });
     }
     function onToday() {
         yearControl.setValue(today.getFullYear());
         dayControl.setValue(today.getDate());
         monthControl.setValue(today.getMonth());
         formControl?.setValue(today);
-        onListener && onListener({ type: PickerListenerType.Now, value: today });
+        onListener && onListener({ event: PickerListenerEvent.Now, value: today });
     }
     function onSelect() {
         formControl?.setValue(value);
-        onListener && onListener({ type: PickerListenerType.Select, value });
+        onListener && onListener({ event: PickerListenerEvent.Select, value });
     }
     return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-picker-date__header", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date__title rls-picker-date__title--description", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityDay, children: dateFormatTemplate(dateInitial, FORMAT_TITLE) }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date__title rls-picker-date__title--year", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityYear, children: yearControl.value }) }), jsxRuntimeExports.jsx(RlsPickerMonthTitle, { monthControl: monthControl, yearControl: yearControl, date: value, maxDate: maxDate, minDate: minDate, disabled: visibility === 'YEAR', type: 'month', onClick: onVisibilityMonth })] }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-picker-date__component', {
                     day: visibility === 'DAY',
@@ -2374,13 +2374,13 @@ function RlsFieldDate({ children, date, disabled, formControl, format, maxDate,
     const [value, setValue] = useState(formControl?.value || defaultValue);
     const [modalIsVisible, setModalIsVisible] = useState(false);
     useEffect(() => {
-        const dateCheck = checkDateRange({
+        const dateRange = verifyDateRange({
             date: formControl?.value || date || today,
             minDate,
             maxDate
         });
-        setValue(dateCheck);
-        formControl?.setValue(dateCheck);
+        setValue(dateRange);
+        formControl?.setValue(dateRange);
     }, []);
     function onChange(value) {
         setValue(value);
@@ -2402,8 +2402,8 @@ function RlsFieldDate({ children, date, disabled, formControl, format, maxDate,
     const valueInput = value
         ? dateFormatTemplate(value, format || FORMAT_DATE)
         : '';
-    return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date__control", type: "text", value: valueInput, readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDate, { formControl: formControl, date: date, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ value, type }) => {
-                        type !== PickerListenerType.Cancel && onChange(value);
+    return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date__control", type: "text", value: valueInput, readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDate, { formControl: formControl, date: date, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ event, value }) => {
+                        event !== PickerListenerEvent.Cancel && onChange(value);
                         formControl?.touch();
                         setModalIsVisible(false);
                     } }) })] }));
@@ -2446,11 +2446,11 @@ function RlsPickerDateRange({ automatic, date: datePicker, disabled, formControl
         setVisibility('YEAR');
     }
     function onCancel() {
-        onListener && onListener({ type: PickerListenerType.Cancel });
+        onListener && onListener({ event: PickerListenerEvent.Cancel });
     }
     function onSelect() {
         formControl?.setValue(value);
-        onListener && onListener({ type: PickerListenerType.Select, value });
+        onListener && onListener({ event: PickerListenerEvent.Select, value });
     }
     return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-picker-date-range__header", children: [jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__title rls-picker-date-range__title--description", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityDay, children: rangeFormatTemplate(value) }) }), jsxRuntimeExports.jsx("div", { className: "rls-picker-date-range__title rls-picker-date-range__title--year", children: jsxRuntimeExports.jsx("span", { onClick: onVisibilityYear, children: yearControl.value }) }), jsxRuntimeExports.jsx(RlsPickerMonthTitle, { monthControl: monthControl, yearControl: yearControl, date: date, maxDate: maxDate, minDate: minDate, disabled: visibility === 'YEAR', type: visibility === 'MONTH' ? 'year' : 'month', onClick: onVisibilityMonth })] }), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-picker-date-range__component', {
                     day: visibility === 'DAY',
@@ -2482,8 +2482,8 @@ function RlsFieldDateRange({ children, date: datePicker, disabled, formControl,
         setValue(value);
         onValue && onValue(value);
     }
-    return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date-range__control", type: "text", value: value ? rangeFormatTemplate(value) : '', readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date-range__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDateRange, { formControl: formControl, date: currentDate, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ type, value }) => {
-                        type !== PickerListenerType.Cancel && onChange(value);
+    return (jsxRuntimeExports.jsxs("div", { className: "rls-field-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled }), children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-box__body", children: [jsxRuntimeExports.jsx("input", { className: "rls-field-date-range__control", type: "text", value: value ? rangeFormatTemplate(value) : '', readOnly: true, placeholder: placeholder, onClick: onClickInput, disabled: disabled }), jsxRuntimeExports.jsx("button", { className: "rls-field-date-range__action", onClick: onClickAction, disabled: disabled, children: jsxRuntimeExports.jsx(RlsIcon, { value: value ? 'trash-2' : 'calendar' }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }), jsxRuntimeExports.jsx(RlsModal, { visible: modalIsVisible, rlsTheme: rlsTheme, children: jsxRuntimeExports.jsx(RlsPickerDateRange, { formControl: formControl, date: currentDate, disabled: disabled, maxDate: maxDate, minDate: minDate, onListener: ({ event, value }) => {
+                        event !== PickerListenerEvent.Cancel && onChange(value);
                         formControl?.touch();
                         setModalIsVisible(false);
                     } }) })] }));