@rolster/react-components 18.18.0 → 18.18.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/assets/{index-DIGj2mhy.css → index-Bco_fVV_.css} +1 -1
- package/dist/cjs/index.js +28 -22
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/assets/{index-DIGj2mhy.css → index-Bco_fVV_.css} +1 -1
- package/dist/es/index.js +28 -22
- package/dist/es/index.js.map +1 -1
- package/dist/esm/components/atoms/Breadcrumb/Breadcrumb.css +1 -1
- package/dist/esm/components/molecules/FieldMoney/FieldMoney.js +3 -2
- package/dist/esm/components/molecules/FieldMoney/FieldMoney.js.map +1 -1
- package/dist/esm/components/molecules/FieldNumber/FieldNumber.js +3 -2
- package/dist/esm/components/molecules/FieldNumber/FieldNumber.js.map +1 -1
- package/dist/esm/components/molecules/FieldPassword/FieldPassword.js +3 -2
- package/dist/esm/components/molecules/FieldPassword/FieldPassword.js.map +1 -1
- package/dist/esm/components/molecules/FieldText/FieldText.js +3 -2
- package/dist/esm/components/molecules/FieldText/FieldText.js.map +1 -1
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js +5 -5
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js.map +1 -1
- package/dist/esm/components/organisms/FieldDate/FieldDate.js +2 -1
- package/dist/esm/components/organisms/FieldDate/FieldDate.js.map +1 -1
- package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.js +2 -1
- package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.js.map +1 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js +6 -6
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js.map +1 -1
- package/dist/esm/controllers/ListController.js +1 -1
- package/dist/esm/controllers/ListController.js.map +1 -1
- package/package.json +3 -3
package/dist/es/index.js
CHANGED
|
@@ -1592,18 +1592,20 @@ function RlsMessageFormError({ className, formControl }) {
|
|
|
1592
1592
|
}
|
|
1593
1593
|
|
|
1594
1594
|
function RlsFieldMoney({ children, decimals, disabled, formControl, identifier, msgErrorDisabled, onValue, placeholder, symbol, rlsTheme, value }) {
|
|
1595
|
+
const _disabled = formControl?.disabled || disabled;
|
|
1595
1596
|
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: renderClassStatus('rls-field-box', {
|
|
1596
|
-
focused: formControl?.focused,
|
|
1597
|
+
focused: formControl?.focused && !_disabled,
|
|
1597
1598
|
error: formControl?.wrong,
|
|
1598
|
-
disabled:
|
|
1599
|
+
disabled: _disabled
|
|
1599
1600
|
}, 'rls-field-money'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputMoney, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, symbol: symbol, decimals: decimals, onValue: onValue }) }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }));
|
|
1600
1601
|
}
|
|
1601
1602
|
|
|
1602
1603
|
function RlsFieldNumber({ children, disabled, formControl, identifier, msgErrorDisabled, onValue, placeholder, rlsTheme, value }) {
|
|
1604
|
+
const _disabled = formControl?.disabled || disabled;
|
|
1603
1605
|
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: renderClassStatus('rls-field-box', {
|
|
1604
|
-
focused: formControl?.focused,
|
|
1606
|
+
focused: formControl?.focused && !_disabled,
|
|
1605
1607
|
error: formControl?.wrong,
|
|
1606
|
-
disabled:
|
|
1608
|
+
disabled: _disabled
|
|
1607
1609
|
}, 'rls-field-number'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputNumber, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, onValue: onValue }) }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }));
|
|
1608
1610
|
}
|
|
1609
1611
|
|
|
@@ -1612,18 +1614,20 @@ function RlsFieldPassword({ children, disabled, formControl, identifier, msgErro
|
|
|
1612
1614
|
function onToggleInput() {
|
|
1613
1615
|
setPassword(!password);
|
|
1614
1616
|
}
|
|
1617
|
+
const _disabled = formControl?.disabled || disabled;
|
|
1615
1618
|
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: renderClassStatus(' rls-field-box', {
|
|
1616
|
-
focused: formControl?.focused,
|
|
1619
|
+
focused: formControl?.focused && !_disabled,
|
|
1617
1620
|
error: formControl?.wrong,
|
|
1618
|
-
disabled:
|
|
1621
|
+
disabled: _disabled
|
|
1619
1622
|
}, 'rls-field-password'), "rls-theme": rlsTheme, 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(RlsInputPassword, { formControl: formControl, disabled: disabled, placeholder: placeholder, type: password ? 'password' : 'text' }), jsxRuntimeExports.jsx(RlsButtonAction, { icon: password ? 'eye' : 'eye-off', onClick: onToggleInput })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }));
|
|
1620
1623
|
}
|
|
1621
1624
|
|
|
1622
1625
|
function RlsFieldText({ children, disabled, formControl, identifier, msgErrorDisabled, onValue, placeholder, rlsTheme, value }) {
|
|
1626
|
+
const _disabled = formControl?.disabled || disabled;
|
|
1623
1627
|
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: renderClassStatus('rls-field-box', {
|
|
1624
|
-
focused: formControl?.focused,
|
|
1628
|
+
focused: formControl?.focused && !_disabled,
|
|
1625
1629
|
error: formControl?.wrong,
|
|
1626
|
-
disabled:
|
|
1630
|
+
disabled: _disabled
|
|
1627
1631
|
}, 'rls-field-text'), "rls-theme": rlsTheme, children: [children && jsxRuntimeExports.jsx("label", { className: "rls-field-box__label", children: children }), jsxRuntimeExports.jsx("div", { className: "rls-field-box__component", children: jsxRuntimeExports.jsx("div", { className: "rls-field-box__body", children: jsxRuntimeExports.jsx(RlsInputText, { formControl: formControl, value: value, disabled: disabled, placeholder: placeholder, onValue: onValue }) }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl }))] }));
|
|
1628
1632
|
}
|
|
1629
1633
|
|
|
@@ -2123,7 +2127,7 @@ function useListController(props) {
|
|
|
2123
2127
|
refresh(collection.current, formControl?.value, automatic);
|
|
2124
2128
|
}, [suggestions]);
|
|
2125
2129
|
useEffect(() => {
|
|
2126
|
-
refresh(collection.current, formControl?.value);
|
|
2130
|
+
refresh(collection.current, formControl?.value, automatic);
|
|
2127
2131
|
}, [formControl?.value]);
|
|
2128
2132
|
function refresh(collection, state, automatic) {
|
|
2129
2133
|
if (!state) {
|
|
@@ -2301,20 +2305,20 @@ function RlsFieldAutocompleteTemplate(props) {
|
|
|
2301
2305
|
const autocomplete = useFieldAutocomplete(props);
|
|
2302
2306
|
const { controller } = autocomplete;
|
|
2303
2307
|
const { render, children, formControl, msgErrorDisabled, onSearch, placeholder, rlsTheme, searching } = props;
|
|
2304
|
-
const
|
|
2308
|
+
const _disabled = formControl?.disabled || props.disabled;
|
|
2305
2309
|
const className = renderClassStatus('rls-field-box', {
|
|
2306
|
-
focused: controller.focused,
|
|
2307
|
-
disabled,
|
|
2310
|
+
focused: controller.focused && !_disabled,
|
|
2308
2311
|
error: formControl?.wrong,
|
|
2312
|
+
disabled: _disabled,
|
|
2309
2313
|
selected: !!controller.value
|
|
2310
2314
|
}, 'rls-field-list rls-field-autocomplete');
|
|
2311
|
-
return (jsxRuntimeExports.jsxs("div", { id: props.identifier, ref: controller.contentRef, className: className, "rls-theme": rlsTheme, 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-list__control", readOnly: true, disabled:
|
|
2315
|
+
return (jsxRuntimeExports.jsxs("div", { id: props.identifier, ref: controller.contentRef, className: className, "rls-theme": rlsTheme, 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-list__control", readOnly: true, disabled: _disabled, placeholder: placeholder, value: controller.value, onClick: autocomplete.onClickControl }), jsxRuntimeExports.jsx("button", { className: "rls-field-list__action", disabled: _disabled, onClick: autocomplete.onClickAction, children: jsxRuntimeExports.jsx(RlsIcon, { value: controller.value ? 'trash-2' : 'arrow-ios-down' }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
2312
2316
|
visible: controller.modalIsVisible,
|
|
2313
2317
|
higher: controller.higher,
|
|
2314
2318
|
hide: !controller.modalIsVisible
|
|
2315
2319
|
}), children: [jsxRuntimeExports.jsx("div", { className: "rls-field-list__suggestions__body", children: jsxRuntimeExports.jsxs("ul", { ref: controller.listRef, className: "rls-field-list__ul", children: [jsxRuntimeExports.jsxs("div", { className: "rls-field-list__ul__search", children: [jsxRuntimeExports.jsx("input", { ref: controller.inputRef, className: "rls-field-list__ul__control", type: "text", placeholder: reactI18n('listInputPlaceholder'), value: autocomplete.pattern, onChange: (event) => {
|
|
2316
2320
|
autocomplete.setPattern(event.target.value);
|
|
2317
|
-
}, disabled:
|
|
2321
|
+
}, disabled: _disabled || searching, onFocus: autocomplete.onFocusInput, onBlur: autocomplete.onBlurInput, onKeyDown: autocomplete.onKeydownInput }), onSearch && (jsxRuntimeExports.jsx("button", { disabled: _disabled || searching, onClick: () => {
|
|
2318
2322
|
onSearch(autocomplete.pattern);
|
|
2319
2323
|
}, children: jsxRuntimeExports.jsx(RlsIcon, { value: "search" }) }))] }), searching && jsxRuntimeExports.jsx(RlsProgressBar, { indeterminate: true }), autocomplete.coincidences.map((element, index) => (jsxRuntimeExports.jsx("li", { className: "rls-field-list__element", tabIndex: -1, onClick: autocomplete.onClickElement(element), onKeyDown: autocomplete.onKeydownElement(element), children: render(element) }, index))), !autocomplete.coincidences.length && (jsxRuntimeExports.jsx("li", { className: "rls-field-list__empty", children: jsxRuntimeExports.jsxs("div", { className: "rls-field-list__empty__description", children: [jsxRuntimeExports.jsx("label", { className: "rls-label-bold truncate", children: reactI18n('listEmptyTitle') }), jsxRuntimeExports.jsx("p", { className: "rls-caption-regular", children: reactI18n('listEmptyDescription') })] }) }))] }) }), jsxRuntimeExports.jsx("div", { className: "rls-field-list__backdrop", onClick: autocomplete.onClickBackdrop })] })] }));
|
|
2320
2324
|
}
|
|
@@ -2420,7 +2424,8 @@ function RlsFieldDate({ children, date, disabled, formControl, format, identifie
|
|
|
2420
2424
|
const valueInput = value
|
|
2421
2425
|
? dateFormatTemplate(value, format || FORMAT_DATE)
|
|
2422
2426
|
: '';
|
|
2423
|
-
|
|
2427
|
+
const _disabled = formControl?.disabled || disabled;
|
|
2428
|
+
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: "rls-field-date", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled: _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 }) => {
|
|
2424
2429
|
event !== PickerListenerEvent.Cancel && onChange(value);
|
|
2425
2430
|
formControl?.touch();
|
|
2426
2431
|
setModalIsVisible(false);
|
|
@@ -2500,7 +2505,8 @@ function RlsFieldDateRange({ children, date: datePicker, disabled, formControl,
|
|
|
2500
2505
|
setValue(value);
|
|
2501
2506
|
onValue && onValue(value);
|
|
2502
2507
|
}
|
|
2503
|
-
|
|
2508
|
+
const _disabled = formControl?.disabled || disabled;
|
|
2509
|
+
return (jsxRuntimeExports.jsxs("div", { id: identifier, className: "rls-field-date-range", "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-box', { disabled: _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 }) => {
|
|
2504
2510
|
event !== PickerListenerEvent.Cancel && onChange(value);
|
|
2505
2511
|
formControl?.touch();
|
|
2506
2512
|
setModalIsVisible(false);
|
|
@@ -2583,15 +2589,15 @@ function RlsFieldSelectTemplate(props) {
|
|
|
2583
2589
|
const select = useFieldSelect(props);
|
|
2584
2590
|
const { controller } = select;
|
|
2585
2591
|
const { render, suggestions, children, formControl, msgErrorDisabled, placeholder, rlsTheme } = props;
|
|
2586
|
-
const
|
|
2592
|
+
const _disabled = formControl?.disabled || props.disabled;
|
|
2587
2593
|
const className = renderClassStatus('rls-field-box', {
|
|
2588
|
-
focused: controller.focused,
|
|
2589
|
-
|
|
2590
|
-
|
|
2594
|
+
focused: controller.focused && !_disabled,
|
|
2595
|
+
error: formControl?.wrong,
|
|
2596
|
+
disabled: _disabled
|
|
2591
2597
|
}, 'rls-field-list rls-field-select');
|
|
2592
|
-
return (jsxRuntimeExports.jsxs("div", { id: props.identifier, ref: controller.contentRef, className: className, "rls-theme": rlsTheme, 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", { ref: controller.inputRef, className: "rls-field-list__control", readOnly: true, disabled:
|
|
2598
|
+
return (jsxRuntimeExports.jsxs("div", { id: props.identifier, ref: controller.contentRef, className: className, "rls-theme": rlsTheme, 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", { ref: controller.inputRef, className: "rls-field-list__control", readOnly: true, disabled: _disabled, placeholder: placeholder, value: controller.value, onFocus: select.onFocusInput, onBlur: select.onBlurInput, onClick: select.onClickInput, onKeyDown: select.onKeydownInput }), jsxRuntimeExports.jsx("button", { className: renderClassStatus('rls-field-list__action', {
|
|
2593
2599
|
visible: controller.modalIsVisible
|
|
2594
|
-
}), disabled:
|
|
2600
|
+
}), disabled: _disabled, onClick: select.onClickAction, children: jsxRuntimeExports.jsx(RlsIcon, { value: "arrow-ios-down" }) })] }) }), !msgErrorDisabled && (jsxRuntimeExports.jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })), jsxRuntimeExports.jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
2595
2601
|
visible: controller.modalIsVisible,
|
|
2596
2602
|
higher: controller.higher,
|
|
2597
2603
|
hide: !controller.modalIsVisible
|