@rolster/react-components 18.15.1 → 18.15.2

package/dist/esm/components/atoms/CheckBox/CheckBox.js

@@ -5,8 +5,8 @@ export function RlsCheckBox({ checked, disabled, onClick, rlsTheme }) {
     return (_jsx("div", { className: renderClassStatus('rls-checkbox', { checked, disabled }), onClick: onClick, "rls-theme": rlsTheme, children: _jsx("div", { className: "rls-checkbox__component" }) }));
 }
 export function RlsCheckBoxControl({ formControl, disabled, rlsTheme }) {
-    return (_jsx(RlsCheckBox, { checked: formControl.state || false, disabled: disabled, onClick: () => {
-            formControl.setState(!formControl.state);
+    return (_jsx(RlsCheckBox, { checked: !!formControl.value, disabled: disabled, onClick: () => {
+            formControl.setValue(!formControl.value);
         }, rlsTheme: rlsTheme }));
 }
 //# sourceMappingURL=CheckBox.js.map

package/dist/esm/components/atoms/CheckBox/CheckBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckBox.js","sourceRoot":"","sources":["../../../../../src/components/atoms/CheckBox/CheckBox.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,gBAAgB,CAAC;AAaxB,MAAM,UAAU,WAAW,CAAC,EAC1B,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,EACM;IACd,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,EACnE,OAAO,EAAE,OAAO,eACL,QAAQ,YAEnB,cAAK,SAAS,EAAC,yBAAyB,GAAO,GAC3C,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,WAAW,EACX,QAAQ,EACR,QAAQ,EACa;IACrB,OAAO,CACL,KAAC,WAAW,IACV,OAAO,EAAE,WAAW,CAAC,KAAK,IAAI,KAAK,EACnC,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;YACZ,WAAW,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC,EACD,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"CheckBox.js","sourceRoot":"","sources":["../../../../../src/components/atoms/CheckBox/CheckBox.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,gBAAgB,CAAC;AAaxB,MAAM,UAAU,WAAW,CAAC,EAC1B,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,EACM;IACd,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,EACnE,OAAO,EAAE,OAAO,eACL,QAAQ,YAEnB,cAAK,SAAS,EAAC,yBAAyB,GAAO,GAC3C,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,WAAW,EACX,QAAQ,EACR,QAAQ,EACa;IACrB,OAAO,CACL,KAAC,WAAW,IACV,OAAO,EAAE,CAAC,CAAC,WAAW,CAAC,KAAK,EAC5B,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;YACZ,WAAW,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC3C,CAAC,EACD,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC"}

package/dist/esm/components/atoms/Input/Input.js

@@ -5,10 +5,10 @@ import './Input.css';
 export function RlsInput({ children, disabled, formControl, placeholder, type, value, onValue }) {
     const [focused, setFocused] = useState(false);
     function onChange(event) {
-        setState(type === 'number' ? +event.target.value : event.target.value);
+        setValue(type === 'number' ? +event.target.value : event.target.value);
     }
-    function setState(value) {
-        formControl?.setState(value);
+    function setValue(value) {
+        formControl?.setValue(value);
         if (onValue) {
             onValue(value);
         }
@@ -24,6 +24,6 @@ export function RlsInput({ children, disabled, formControl, placeholder, type, v
     return (_jsxs("div", { className: renderClassStatus('rls-input', {
             focused: formControl?.focused || focused,
             disabled: formControl?.disabled || disabled
-        }), children: [_jsx("input", { ref: formControl?.elementRef, className: "rls-input__component", autoComplete: "off", type: type || 'text', placeholder: placeholder, disabled: formControl?.disabled || disabled, onFocus: onFocus, onBlur: onBlur, onChange: onChange, value: formControl?.state || value || '' }), _jsx("span", { className: "rls-input__value", children: children })] }));
+        }), children: [_jsx("input", { ref: formControl?.elementRef, className: "rls-input__component", autoComplete: "off", type: type || 'text', placeholder: placeholder, disabled: formControl?.disabled || disabled, onFocus: onFocus, onBlur: onBlur, onChange: onChange, value: formControl?.value || value || '' }), _jsx("span", { className: "rls-input__value", children: children })] }));
 }
 //# sourceMappingURL=Input.js.map

package/dist/esm/components/atoms/InputMoney/InputMoney.js

@@ -5,7 +5,7 @@ import { RlsInput } from '../Input/Input';
 import './InputMoney.css';
 export function RlsInputMoney({ decimals, disabled, formControl, placeholder, symbol, value, onValue }) {
     const [valueInput, setValueInput] = useState(value || 0);
-    function onMoney(value) {
+    function onChange(value) {
         if (!formControl) {
             setValueInput(value);
         }
@@ -13,6 +13,6 @@ export function RlsInputMoney({ decimals, disabled, formControl, placeholder, sy
             onValue(value);
         }
     }
-    return (_jsx("div", { className: "rls-input-money", children: _jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onMoney, children: _jsx(RlsAmount, { value: formControl?.state || value || valueInput, symbol: symbol, decimals: decimals }) }) }));
+    return (_jsx("div", { className: "rls-input-money", children: _jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: _jsx(RlsAmount, { value: formControl?.value || value || valueInput, symbol: symbol, decimals: decimals }) }) }));
 }
 //# sourceMappingURL=InputMoney.js.map

package/dist/esm/components/atoms/InputMoney/InputMoney.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputMoney.js","sourceRoot":"","sources":["../../../../../src/components/atoms/InputMoney/InputMoney.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,kBAAkB,CAAC;AAY1B,MAAM,UAAU,aAAa,CAAC,EAC5B,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,WAAW,EACX,MAAM,EACN,KAAK,EACL,OAAO,EACS;IAChB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;IAEzD,SAAS,OAAO,CAAC,KAAa;QAC5B,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,iBAAiB,YAC9B,KAAC,QAAQ,IACP,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,YAEhB,KAAC,SAAS,IACR,KAAK,EAAE,WAAW,EAAE,KAAK,IAAI,KAAK,IAAI,UAAU,EAChD,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,GAClB,GACO,GACP,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"InputMoney.js","sourceRoot":"","sources":["../../../../../src/components/atoms/InputMoney/InputMoney.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,kBAAkB,CAAC;AAY1B,MAAM,UAAU,aAAa,CAAC,EAC5B,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,WAAW,EACX,MAAM,EACN,KAAK,EACL,OAAO,EACS;IAChB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;IAEzD,SAAS,QAAQ,CAAC,KAAa;QAC7B,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,iBAAiB,YAC9B,KAAC,QAAQ,IACP,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,QAAQ,YAEjB,KAAC,SAAS,IACR,KAAK,EAAE,WAAW,EAAE,KAAK,IAAI,KAAK,IAAI,UAAU,EAChD,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,GAClB,GACO,GACP,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/components/atoms/InputNumber/InputNumber.js

@@ -4,7 +4,7 @@ import { RlsInput } from '../Input/Input';
 import './InputNumber.css';
 export function RlsInputNumber({ disabled, formControl, placeholder, value, onValue }) {
     const [valueInput, setValueInput] = useState(value || 0);
-    function onNumber(value) {
+    function onChange(value) {
         if (!formControl) {
             setValueInput(value);
         }
@@ -12,6 +12,6 @@ export function RlsInputNumber({ disabled, formControl, placeholder, value, onVa
             onValue(value);
         }
     }
-    return (_jsx("div", { className: "rls-input-number", children: _jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onNumber, children: formControl?.state || value || valueInput }) }));
+    return (_jsx("div", { className: "rls-input-number", children: _jsx(RlsInput, { formControl: formControl, type: "number", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: formControl?.value || value || valueInput }) }));
 }
 //# sourceMappingURL=InputNumber.js.map

package/dist/esm/components/atoms/InputPassword/InputPassword.js

@@ -5,7 +5,7 @@ import './InputPassword.css';
 export function RlsInputPassword({ disabled, formControl, placeholder, type, onValue }) {
     const [focused, setFocused] = useState(false);
     function onChange(event) {
-        formControl?.setState(event.target.value);
+        formControl?.setValue(event.target.value);
         if (onValue) {
             onValue(event.target.value);
         }

package/dist/esm/components/atoms/InputText/InputText.js

@@ -4,7 +4,7 @@ import { RlsInput } from '../Input/Input';
 import './InputText.css';
 export function RlsInputText({ disabled, formControl, placeholder, value, onValue }) {
     const [valueInput, setValueInput] = useState(value || '');
-    function onText(value) {
+    function onChange(value) {
         if (!formControl) {
             setValueInput(value);
         }
@@ -12,6 +12,6 @@ export function RlsInputText({ disabled, formControl, placeholder, value, onValu
             onValue(value);
         }
     }
-    return (_jsx("div", { className: "rls-input-text", children: _jsx(RlsInput, { formControl: formControl, type: "text", value: value, disabled: disabled, placeholder: placeholder, onValue: onText, children: formControl?.state || value || valueInput }) }));
+    return (_jsx("div", { className: "rls-input-text", children: _jsx(RlsInput, { formControl: formControl, type: "text", value: value, disabled: disabled, placeholder: placeholder, onValue: onChange, children: formControl?.value || value || valueInput }) }));
 }
 //# sourceMappingURL=InputText.js.map

package/dist/esm/components/atoms/InputText/InputText.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputText.js","sourceRoot":"","sources":["../../../../../src/components/atoms/InputText/InputText.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,iBAAiB,CAAC;AAUzB,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,WAAW,EACX,KAAK,EACL,OAAO,EACQ;IACf,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAE1D,SAAS,MAAM,CAAC,KAAa;QAC3B,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,gBAAgB,YAC7B,KAAC,QAAQ,IACP,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,MAAM,YAEd,WAAW,EAAE,KAAK,IAAI,KAAK,IAAI,UAAU,GACjC,GACP,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"InputText.js","sourceRoot":"","sources":["../../../../../src/components/atoms/InputText/InputText.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,iBAAiB,CAAC;AAUzB,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,WAAW,EACX,KAAK,EACL,OAAO,EACQ;IACf,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAE1D,SAAS,QAAQ,CAAC,KAAa;QAC7B,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,gBAAgB,YAC7B,KAAC,QAAQ,IACP,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,QAAQ,YAEhB,WAAW,EAAE,KAAK,IAAI,KAAK,IAAI,UAAU,GACjC,GACP,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/components/atoms/Switch/Switch.js

@@ -5,8 +5,8 @@ export function RlsSwitch({ checked, disabled, rlsTheme, onClick }) {
     return (_jsx("div", { className: renderClassStatus('rls-switch', { checked, disabled }), onClick: onClick, "rls-theme": rlsTheme, children: _jsxs("div", { className: "rls-switch__component", children: [_jsx("div", { className: "rls-switch__component__element" }), _jsx("div", { className: "rls-switch__component__bar" })] }) }));
 }
 export function RlsSwitchControl({ formControl, disabled, rlsTheme }) {
-    return (_jsx(RlsSwitch, { checked: formControl.state || false, disabled: disabled, onClick: () => {
-            formControl.setState(!formControl.state);
+    return (_jsx(RlsSwitch, { checked: formControl.value || false, disabled: disabled, onClick: () => {
+            formControl.setValue(!formControl.value);
         }, rlsTheme: rlsTheme }));
 }
 //# sourceMappingURL=Switch.js.map

package/dist/esm/components/molecules/LabelCheckBox/LabelCheckBox.js

@@ -4,13 +4,13 @@ import { renderClassStatus } from '../../../helpers/css';
 import { RlsCheckBox } from '../../atoms';
 import './LabelCheckBox.css';
 export function RlsLabelCheckBox({ children, disabled, extended, formControl, rlsTheme }) {
-    const [checked, setChecked] = useState(!!formControl?.state);
+    const [checked, setChecked] = useState(!!formControl?.value);
     useEffect(() => {
-        setChecked(!!formControl?.state);
-    }, [formControl?.state]);
+        setChecked(!!formControl?.value);
+    }, [formControl?.value]);
     function onToggle() {
         if (formControl) {
-            formControl?.setState(!formControl.state);
+            formControl?.setValue(!formControl.value);
         }
         else {
             setChecked(!checked);

package/dist/esm/components/molecules/LabelRadioButton/LabelRadioButton.js

@@ -4,13 +4,13 @@ import { renderClassStatus } from '../../../helpers/css';
 import { RlsRadioButton } from '../../atoms';
 import './LabelRadioButton.css';
 export function RlsLabelRadioButton({ children, disabled, extended, formControl, rlsTheme, value }) {
-    const [checked, setChecked] = useState(formControl?.state === value);
+    const [checked, setChecked] = useState(formControl?.value === value);
     useEffect(() => {
-        setChecked(formControl?.state === value);
-    }, [formControl?.state]);
+        setChecked(formControl?.value === value);
+    }, [formControl?.value]);
     function onSelect() {
         if (formControl) {
-            formControl?.setState(value);
+            formControl?.setValue(value);
         }
     }
     return (_jsxs("div", { className: renderClassStatus('rls-label-radiobutton', {

package/dist/esm/components/molecules/LabelSwitch/LabelSwitch.js

@@ -4,13 +4,13 @@ import { renderClassStatus } from '../../../helpers/css';
 import { RlsSwitch } from '../../atoms';
 import './LabelSwitch.css';
 export function RlsLabelSwitch({ children, disabled, extended, formControl, rlsTheme }) {
-    const [checked, setChecked] = useState(!!formControl?.state);
+    const [checked, setChecked] = useState(!!formControl?.value);
     useEffect(() => {
-        setChecked(!!formControl?.state);
-    }, [formControl?.state]);
+        setChecked(!!formControl?.value);
+    }, [formControl?.value]);
     function onToggle() {
         if (formControl) {
-            formControl?.setState(!formControl.state);
+            formControl?.setValue(!formControl.value);
         }
         else {
             setChecked(!checked);

package/dist/esm/components/molecules/Pagination/Pagination.d.ts

@@ -1,27 +1,15 @@
+import { FilterCriteria } from '@rolster/components';
 import './Pagination.css';
-interface PaginationEvent {
+interface PaginationEvent<T> {
     firstPage: boolean;
     lastPage: boolean;
+    suggestions: T[];
 }
 interface PaginationProps<T> {
-    elements: T[];
+    suggestions: T[];
     count?: number;
-    filter?: Nulleable<string>;
-    onElements?: (elements: T[]) => void;
-    onPagination?: (event: PaginationEvent) => void;
+    filter?: FilterCriteria<T>;
+    onPagination?: (event: PaginationEvent<T>) => void;
 }
-export interface Page<T> {
-    collection: T[];
-    count: number;
-    index: number;
-    maxPage: number;
-}
-export interface PaginationState {
-    active: boolean;
-    label: string;
-    value: number;
-    prev?: PaginationState;
-    next?: PaginationState;
-}
-export declare function RlsPagination<T>({ elements, count: defaultCount, filter, onElements, onPagination }: PaginationProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function RlsPagination<T>({ suggestions, count, filter, onPagination }: PaginationProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/components/molecules/Pagination/Pagination.js

@@ -1,219 +1,63 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { hasPattern } from '@rolster/helpers-string';
-import { useEffect, useState } from 'react';
+import { PaginationController } from '@rolster/components';
+import { useEffect, useRef, useState } from 'react';
 import { renderClassStatus } from '../../../helpers/css';
 import { RlsIcon } from '../../atoms';
 import './Pagination.css';
-const DEFAULT_COUNT_ELEMENT = 20;
-const MIN_NUMBER_PAGE = 1;
-const FIRST_PAGE = 0;
-const DEFAULT_MAX_VISIBLE = 4;
-export function RlsPagination({ elements, count: defaultCount, filter, onElements, onPagination }) {
-    const count = defaultCount || DEFAULT_COUNT_ELEMENT;
-    const [collection, setCollection] = useState([]);
-    const [index, setIndex] = useState(0);
-    const [maxPage, setMaxPage] = useState(calculateMaxPage(elements, count));
-    const [paginations, setPaginations] = useState([]);
-    const [currentPagination, setCurrentPagination] = useState();
-    const [description, setDescription] = useState('');
-    const [firstPage, setFirstPage] = useState(true);
-    const [lastPage, setLastPage] = useState(false);
+export function RlsPagination({ suggestions, count, filter, onPagination }) {
+    const controller = useRef(new PaginationController({ suggestions, count }));
+    const [template, setTemplate] = useState(controller.current.template);
     useEffect(() => {
-        refreshFromElements(elements);
-    }, [elements]);
+        controller.current = new PaginationController({
+            suggestions,
+            count,
+            position: template.currentPage.value
+        });
+        onPagination &&
+            onPagination({
+                firstPage: controller.current.template.firstPage,
+                lastPage: controller.current.template.lastPage,
+                suggestions: controller.current.page.collection
+            });
+        setTemplate(controller.current.template);
+    }, [suggestions, count]);
     useEffect(() => {
-        const isFirstPage = currentPagination?.value === FIRST_PAGE;
-        const isLastPage = currentPagination?.value === maxPage - 1;
-        setFirstPage(isFirstPage);
-        setLastPage(isLastPage);
-        if (onPagination) {
-            onPagination({ firstPage: isFirstPage, lastPage: isLastPage });
-        }
-    }, [currentPagination]);
-    useEffect(() => {
-        refreshFromFilter(filter);
+        refreshPagination(controller.current.filtrable(filter));
     }, [filter]);
-    function onChangeElements(elements) {
-        if (onElements) {
-            onElements(elements);
-        }
-    }
-    function calculateMaxPage(collection, count) {
-        return collection.length ? Math.ceil(collection.length / count) : 0;
-    }
-    function onSelectPagination(pagination) {
-        const { value } = pagination;
-        pagination.active = true;
-        setIndex(value);
-        setCurrentPagination(pagination);
-        refreshFromChanged(clonePage({ index: value }));
+    function refreshPagination(pagination) {
+        if (pagination) {
+            const { page, template } = pagination;
+            const { firstPage, lastPage } = template;
+            onPagination &&
+                onPagination({
+                    firstPage,
+                    lastPage,
+                    suggestions: page.collection
+                });
+            setTemplate(template);
+        }
+    }
+    function goToPagination(page) {
+        refreshPagination(controller.current.goToPage(page));
     }
-    function goPagination(pagination) {
-        if (currentPagination) {
-            currentPagination.active = false;
-        }
-        onSelectPagination(pagination);
+    function goFirstPagination() {
+        refreshPagination(controller.current.goFirstPage());
     }
     function goPreviousPagination() {
-        if (currentPagination) {
-            const { prev, value } = currentPagination;
-            if (prev) {
-                onSelectPagination(prev);
-                currentPagination.active = false;
-            }
-            else {
-                const prevIndex = value - MIN_NUMBER_PAGE;
-                if (prevIndex >= FIRST_PAGE) {
-                    refreshFromChanged(clonePageFromIndex(prevIndex));
-                }
-            }
-        }
-    }
-    function goFirstPagination() {
-        if (collection.length) {
-            refreshFromChanged(clonePageFromIndex(FIRST_PAGE));
-        }
+        refreshPagination(controller.current.goPreviousPage());
     }
     function goNextPagination() {
-        if (currentPagination) {
-            const { next, value } = currentPagination;
-            if (next) {
-                onSelectPagination(next);
-                currentPagination.active = false;
-            }
-            else {
-                const nextIndex = value + 1;
-                if (nextIndex <= maxPage) {
-                    refreshFromChanged(clonePageFromIndex(nextIndex));
-                }
-            }
-        }
+        refreshPagination(controller.current.goNextPage());
     }
     function goLastPagination() {
-        if (collection.length) {
-            refreshFromChanged(clonePageFromIndex(maxPage - MIN_NUMBER_PAGE));
-        }
-    }
-    function createPageCollection(props) {
-        const { collection, count, index } = props;
-        if (collection.length) {
-            const finish = (index + MIN_NUMBER_PAGE) * count;
-            const start = index * count;
-            return collection.slice(start, finish);
-        }
-        return [];
-    }
-    function refreshFromElements(elements) {
-        elements.length
-            ? refreshFromChanged(refreshPage(elements, filter))
-            : rebootPagination();
-    }
-    function refreshFromFilter(filter) {
-        refreshFromChanged(refreshPage(elements, filter));
-    }
-    function refreshFromChanged(page) {
-        refreshPaginations(page);
-        refreshDescription(page);
-        onChangeElements(createPageCollection(page));
-    }
-    function refreshCollection(elements, filter) {
-        const collection = filter
-            ? elements.filter((element) => hasPattern(JSON.stringify(element), filter))
-            : elements;
-        setCollection(collection);
-        return collection;
-    }
-    function refreshMaxPage(collection, count) {
-        const maxPage = calculateMaxPage(collection, count);
-        setMaxPage(maxPage);
-        return maxPage;
-    }
-    function refreshIndex(collection, currentMaxPage) {
-        const maxPage = currentMaxPage || refreshMaxPage(collection, count);
-        if (index < maxPage || index === FIRST_PAGE) {
-            return index;
-        }
-        const newIndex = maxPage - 1;
-        setIndex(newIndex);
-        return newIndex;
-    }
-    function refreshDescription(page) {
-        const { collection, count, index } = page;
-        const totalCount = elements.length;
-        const start = index * count + MIN_NUMBER_PAGE;
-        let end = (index + MIN_NUMBER_PAGE) * count;
-        if (end > collection.length) {
-            end = collection.length;
-        }
-        setDescription(`${start} - ${end} de ${totalCount}`);
-    }
-    function refreshPaginations({ index, maxPage }) {
-        let maxPageVisible = index + DEFAULT_MAX_VISIBLE;
-        if (maxPageVisible > maxPage) {
-            maxPageVisible = maxPage;
-        }
-        let minIndexPage = maxPageVisible - DEFAULT_MAX_VISIBLE;
-        if (minIndexPage < 0) {
-            minIndexPage = 0;
-        }
-        if (minIndexPage > index) {
-            minIndexPage = index;
-        }
-        let prevPagination = undefined;
-        const paginations = [];
-        for (let i = minIndexPage; i < maxPageVisible; i++) {
-            const pagination = createPagination(i, index);
-            paginations.push(pagination);
-            pagination.prev = prevPagination;
-            if (prevPagination) {
-                prevPagination.next = pagination;
-            }
-            prevPagination = pagination;
-        }
-        setPaginations(paginations);
-    }
-    function clonePage(pagePartial) {
-        return {
-            collection: pagePartial.collection || collection,
-            index: typeof pagePartial.index === 'number' ? pagePartial.index : index,
-            count: pagePartial.count || count,
-            maxPage: typeof pagePartial.maxPage === 'number' ? pagePartial.maxPage : maxPage
-        };
-    }
-    function clonePageFromIndex(index) {
-        return clonePage({ index });
-    }
-    function refreshPage(elements, filter) {
-        const collection = refreshCollection(elements, filter);
-        const maxPage = refreshMaxPage(collection, count);
-        const index = refreshIndex(collection, maxPage);
-        return clonePage({ collection, index, maxPage });
-    }
-    function createPagination(value, index) {
-        const active = value === index;
-        const pagination = {
-            label: (value + 1).toString(),
-            value,
-            active
-        };
-        if (active) {
-            setCurrentPagination(pagination);
-        }
-        return pagination;
-    }
-    function rebootPagination() {
-        setCollection([]);
-        setMaxPage(0);
-        setIndex(0);
-        setPaginations([]);
-        onChangeElements([]);
+        refreshPagination(controller.current.goLastPage());
     }
-    return (_jsxs("div", { className: "rls-pagination", children: [_jsxs("div", { className: "rls-pagination__actions", children: [_jsx("button", { className: "rls-pagination__action", onClick: goFirstPagination, disabled: firstPage, children: _jsx(RlsIcon, { value: "arrowhead-left" }) }), _jsx("button", { className: "rls-pagination__action", onClick: goPreviousPagination, disabled: firstPage, children: _jsx(RlsIcon, { value: "arrow-ios-left" }) })] }), _jsx("div", { className: "rls-pagination__pages", children: paginations.map((page, index) => {
+    return (_jsxs("div", { className: "rls-pagination", children: [_jsxs("div", { className: "rls-pagination__actions", children: [_jsx("button", { className: "rls-pagination__action", onClick: goFirstPagination, disabled: template.firstPage, children: _jsx(RlsIcon, { value: "arrowhead-left" }) }), _jsx("button", { className: "rls-pagination__action", onClick: goPreviousPagination, disabled: template.firstPage, children: _jsx(RlsIcon, { value: "arrow-ios-left" }) })] }), _jsx("div", { className: "rls-pagination__pages", children: template.pages.map((page, index) => {
                     return (_jsx("div", { className: renderClassStatus('rls-pagination__page', {
                             active: page.active
                         }), onClick: () => {
-                            goPagination(page);
+                            goToPagination(page);
                         }, children: page.label }, index));
-                }) }), _jsx("div", { className: "rls-pagination__description", children: description }), _jsxs("div", { className: "rls-pagination__actions", children: [_jsx("button", { className: "rls-pagination__action", onClick: goNextPagination, disabled: lastPage, children: _jsx(RlsIcon, { value: "arrow-ios-right" }) }), _jsx("button", { className: "rls-pagination__action", onClick: goLastPagination, disabled: lastPage, children: _jsx(RlsIcon, { value: "arrowhead-right" }) })] })] }));
+                }) }), _jsx("div", { className: "rls-pagination__description", children: template.description }), _jsxs("div", { className: "rls-pagination__actions", children: [_jsx("button", { className: "rls-pagination__action", onClick: goNextPagination, disabled: template.lastPage, children: _jsx(RlsIcon, { value: "arrow-ios-right" }) }), _jsx("button", { className: "rls-pagination__action", onClick: goLastPagination, disabled: template.lastPage, children: _jsx(RlsIcon, { value: "arrowhead-right" }) })] })] }));
 }
 //# sourceMappingURL=Pagination.js.map

package/dist/esm/components/molecules/Pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../../../src/components/molecules/Pagination/Pagination.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../../../src/components/molecules/Pagination/Pagination.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/molecules/PickerDay/PickerDay.css

@@ -13,14 +13,15 @@
   margin-bottom: var(--rls-sizing-x4);
   background: var(--rls-app-background-100);
   color: var(--rls-app-color-500);
-  border-radius: var(--rls-sizing-x2);
+  border-radius: var(--rls-sizing-x4);
 }
 .rls-picker-day__label {
   padding: var(--rls-sizing-x6) 0rem;
   text-align: center;
   width: 100%;
-  font-size: var(--rls-sizing-x6);
-  font-weight: var(--rls-font-weight-bold);
+  font-size: 5.75rem;
+  font-weight: var(--rls-font-weight-semibold);
+  letter-spacing: 0.0375em;
 }
 .rls-picker-day__week {
   display: flex;
@@ -40,6 +41,7 @@
   height: var(--rls-sizing-x18);
   line-height: var(--rls-sizing-x18);
   box-sizing: border-box;
+  letter-spacing: 0.0475em;
 }
 .rls-picker-day__element__span:not(:hover) {
   color: var(--pvt-span-font-color);

package/dist/esm/components/molecules/PickerDay/PickerDay.js

@@ -8,7 +8,7 @@ import './PickerDay.css';
 export function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxDate, month, minDate, onValue, rlsTheme, year }) {
     const currentDate = date || new Date(); // Initial date
     const [weeks, setWeeks] = useState([]);
-    const [value, setValue] = useState(formControl?.state || currentDate.getDate());
+    const [value, setValue] = useState(formControl?.value || currentDate.getDate());
     useEffect(() => {
         const props = createPickerProps();
         const day = checkDayPicker(props);
@@ -17,13 +17,13 @@ export function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxD
     useEffect(() => {
         const day = checkDayPicker(createPickerProps());
         day
-            ? formControl?.setState(day)
-            : setValue(formControl?.state || currentDate.getDate());
-    }, [formControl?.state]);
+            ? formControl?.setValue(day)
+            : setValue(formControl?.value || currentDate.getDate());
+    }, [formControl?.value]);
     function createPickerProps() {
         return {
             date: currentDate,
-            day: formControl?.state || value,
+            day: formControl?.value || value,
             month: itIsDefined(month) ? month : currentDate.getMonth(),
             year: year || currentDate.getFullYear(),
             minDate,
@@ -31,7 +31,7 @@ export function RlsPickerDay({ date, disabled: disabledPicker, formControl, maxD
         };
     }
     function setDayValue(value) {
-        formControl ? formControl.setState(value) : setValue(value);
+        formControl ? formControl.setValue(value) : setValue(value);
     }
     function onChange(value) {
         setDayValue(value);

package/dist/esm/components/molecules/PickerDayRange/PickerDayRange.js

@@ -2,11 +2,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createDayRangePicker } from '@rolster/components';
 import { DAY_LABELS, DateRange, assignDayInDate, dateFormatTemplate, dateIsBefore, normalizeMinTime } from '@rolster/dates';
 import { useEffect, useRef, useState } from 'react';
-import { DATE_RANGE_FORMAT } from '../../../constants';
 import { renderClassStatus } from '../../../helpers/css';
 import './PickerDayRange.css';
+const FORMAT_RANGE = '{dd}/{mx}/{aa}';
 export function RlsPickerDayRange({ date, disabled: disabledPicker, formControl, maxDate, minDate, rlsTheme }) {
-    const currentRange = formControl?.state || DateRange.now();
+    const currentRange = formControl?.value || DateRange.now();
     const currentDate = normalizeMinTime(date || currentRange.minDate);
     const sourceDate = useRef(currentRange.minDate);
     const [weeks, setWeeks] = useState([]);
@@ -27,9 +27,9 @@ export function RlsPickerDayRange({ date, disabled: disabledPicker, formControl,
             : new DateRange(date, sourceDate.current);
         sourceDate.current = date;
         setRange(range);
-        formControl?.setState(range);
+        formControl?.setValue(range);
     }
-    return (_jsxs("div", { className: "rls-picker-day-range", "rls-theme": rlsTheme, children: [_jsx("div", { className: "rls-picker-day-range__title", children: dateFormatTemplate(sourceDate.current, DATE_RANGE_FORMAT) }), _jsx("div", { className: "rls-picker-day-range__header", children: DAY_LABELS().map((title, index) => (_jsx("label", { className: "rls-picker-day-range__label", children: title }, index))) }), _jsx("div", { className: "rls-picker-day-range__component", children: weeks.map(({ days }, index) => (_jsx("div", { className: "rls-picker-day-range__week", children: days.map(({ disabled, end, forbidden, source, ranged, value }, index) => (_jsx("div", { className: renderClassStatus('rls-picker-day-range__element', {
+    return (_jsxs("div", { className: "rls-picker-day-range", "rls-theme": rlsTheme, children: [_jsx("div", { className: "rls-picker-day-range__title", children: dateFormatTemplate(sourceDate.current, FORMAT_RANGE) }), _jsx("div", { className: "rls-picker-day-range__header", children: DAY_LABELS().map((title, index) => (_jsx("label", { className: "rls-picker-day-range__label", children: title }, index))) }), _jsx("div", { className: "rls-picker-day-range__component", children: weeks.map(({ days }, index) => (_jsx("div", { className: "rls-picker-day-range__week", children: days.map(({ disabled, end, forbidden, source, ranged, value }, index) => (_jsx("div", { className: renderClassStatus('rls-picker-day-range__element', {
                             disabled: disabled || disabledPicker,
                             end,
                             forbidden,