@rolster/react-components 18.15.23 → 18.15.30
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/index.js +104 -92
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/index.js +104 -92
- package/dist/es/index.js.map +1 -1
- package/dist/esm/components/organisms/Datatable/Datatable.d.ts +2 -2
- package/dist/esm/components/organisms/Datatable/Datatable.js +1 -1
- package/dist/esm/components/organisms/Datatable/Datatable.js.map +1 -1
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.d.ts +14 -3
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js +20 -17
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.js.map +1 -1
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteController.d.ts +38 -0
- package/dist/esm/components/organisms/FieldAutocomplete/{FieldAutocompleteHook.js → FieldAutocompleteController.js} +27 -25
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteController.js.map +1 -0
- package/dist/esm/components/organisms/FieldDate/FieldDate.d.ts +3 -2
- package/dist/esm/components/organisms/FieldDate/FieldDate.js +3 -3
- package/dist/esm/components/organisms/FieldDate/FieldDate.js.map +1 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.d.ts +15 -4
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js +17 -14
- package/dist/esm/components/organisms/FieldSelect/FieldSelect.js.map +1 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelectController.d.ts +35 -0
- package/dist/esm/components/organisms/FieldSelect/FieldSelectController.js +71 -0
- package/dist/esm/components/organisms/FieldSelect/FieldSelectController.js.map +1 -0
- package/dist/esm/components/organisms/PickerDate/PickerDate.d.ts +1 -1
- package/dist/esm/components/organisms/PickerDate/PickerDate.js.map +1 -1
- package/dist/esm/controllers/DatatableController.d.ts +6 -0
- package/dist/esm/controllers/DatatableController.js +24 -0
- package/dist/esm/controllers/DatatableController.js.map +1 -0
- package/dist/esm/controllers/ListController.d.ts +35 -0
- package/dist/esm/{hooks/ListControlHook.js → controllers/ListController.js} +4 -3
- package/dist/esm/controllers/ListController.js.map +1 -0
- package/dist/esm/controllers/index.d.ts +2 -0
- package/dist/esm/controllers/index.js +3 -0
- package/dist/esm/controllers/index.js.map +1 -0
- package/dist/esm/index.d.ts +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/package.json +7 -7
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteHook.d.ts +0 -27
- package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocompleteHook.js.map +0 -1
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.d.ts +0 -24
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.js +0 -70
- package/dist/esm/components/organisms/FieldSelect/FieldSelectHook.js.map +0 -1
- package/dist/esm/hooks/DatatableHook.d.ts +0 -6
- package/dist/esm/hooks/DatatableHook.js +0 -22
- package/dist/esm/hooks/DatatableHook.js.map +0 -1
- package/dist/esm/hooks/ListControlHook.d.ts +0 -24
- package/dist/esm/hooks/ListControlHook.js.map +0 -1
- package/dist/esm/hooks/index.d.ts +0 -2
- package/dist/esm/hooks/index.js +0 -3
- package/dist/esm/hooks/index.js.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DatatableController } from '../../../controllers';
|
|
2
2
|
import { RlsComponent } from '../../definitions';
|
|
3
3
|
interface DatatableCellProps extends RlsComponent {
|
|
4
4
|
className?: string;
|
|
@@ -10,7 +10,7 @@ interface DatatableRecordProps extends RlsComponent {
|
|
|
10
10
|
error?: boolean;
|
|
11
11
|
}
|
|
12
12
|
interface DatatableProps extends RlsComponent {
|
|
13
|
-
datatable?:
|
|
13
|
+
datatable?: DatatableController;
|
|
14
14
|
footer?: JSX.Element;
|
|
15
15
|
header?: JSX.Element;
|
|
16
16
|
summary?: JSX.Element;
|
|
@@ -21,6 +21,6 @@ export function RlsDatatableData({ children, className, control, overflow }) {
|
|
|
21
21
|
export function RlsDatatable({ children, datatable, footer, header, rlsTheme, summary }) {
|
|
22
22
|
return (_jsxs("div", { className: renderClassStatus('rls-datatable', {
|
|
23
23
|
scrolleable: datatable?.scrolleable
|
|
24
|
-
}), "rls-theme": rlsTheme, children: [_jsxs("table", { children: [header && _jsx("thead", { className: "rls-datatable__thead", children: header }), _jsx("tbody", { ref: datatable?.
|
|
24
|
+
}), "rls-theme": rlsTheme, children: [_jsxs("table", { children: [header && _jsx("thead", { className: "rls-datatable__thead", children: header }), _jsx("tbody", { ref: datatable?.tableRef, className: "rls-datatable__tbody", children: children })] }), summary && _jsx("div", { className: "rls-datatable__tsummary", children: summary }), footer && _jsx("div", { className: "rls-datatable__tfooter", children: footer })] }));
|
|
25
25
|
}
|
|
26
26
|
//# sourceMappingURL=Datatable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Datatable.js","sourceRoot":"","sources":["../../../../../src/components/organisms/Datatable/Datatable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsBzD,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAgB;IAC3D,OAAO,aAAI,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAM,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,OAAO,EACY;IACnB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,sBAAsB,EACtB,EAAE,OAAO,EAAE,EACX,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,KAAK,EACgB;IACrB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,uBAAuB,EACvB,EAAE,KAAK,EAAE,EACT,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,KAAK,EACgB;IACrB,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAC1B,uBAAuB,EACvB,EAAE,KAAK,EAAE,EACT,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,qBAAqB,EACrB,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrB,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAC1B,qBAAqB,EACrB,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrB,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACQ;IACf,OAAO,CACL,eACE,SAAS,EAAE,iBAAiB,CAAC,eAAe,EAAE;YAC5C,WAAW,EAAE,SAAS,EAAE,WAAW;SACpC,CAAC,eACS,QAAQ,aAEnB,4BACG,MAAM,IAAI,gBAAO,SAAS,EAAC,sBAAsB,YAAE,MAAM,GAAS,EAEnE,gBAAO,GAAG,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"Datatable.js","sourceRoot":"","sources":["../../../../../src/components/organisms/Datatable/Datatable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsBzD,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAgB;IAC3D,OAAO,aAAI,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAM,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,OAAO,EACY;IACnB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,sBAAsB,EACtB,EAAE,OAAO,EAAE,EACX,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,KAAK,EACgB;IACrB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,uBAAuB,EACvB,EAAE,KAAK,EAAE,EACT,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,KAAK,EACgB;IACrB,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAC1B,uBAAuB,EACvB,EAAE,KAAK,EAAE,EACT,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,aACE,SAAS,EAAE,iBAAiB,CAC1B,qBAAqB,EACrB,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrB,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,cACE,SAAS,EAAE,iBAAiB,CAC1B,qBAAqB,EACrB,EAAE,OAAO,EAAE,QAAQ,EAAE,EACrB,SAAS,CACV,CAAC,IAAI,EAAE,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACQ;IACf,OAAO,CACL,eACE,SAAS,EAAE,iBAAiB,CAAC,eAAe,EAAE;YAC5C,WAAW,EAAE,SAAS,EAAE,WAAW;SACpC,CAAC,eACS,QAAQ,aAEnB,4BACG,MAAM,IAAI,gBAAO,SAAS,EAAC,sBAAsB,YAAE,MAAM,GAAS,EAEnE,gBAAO,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAC,sBAAsB,YAC9D,QAAQ,GACH,IACF,EAEP,OAAO,IAAI,cAAK,SAAS,EAAC,yBAAyB,YAAE,OAAO,GAAO,EAEnE,MAAM,IAAI,cAAK,SAAS,EAAC,wBAAwB,YAAE,MAAM,GAAO,IAC7D,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -6,18 +6,29 @@ import './FieldAutocomplete.css';
|
|
|
6
6
|
interface FieldAutocompleteProps<T = any, E extends Element<T> = Element<T>> extends RlsComponent {
|
|
7
7
|
suggestions: E[];
|
|
8
8
|
disabled?: boolean;
|
|
9
|
-
formControl?: ReactControl<HTMLElement, T
|
|
9
|
+
formControl?: ReactControl<HTMLElement, T>;
|
|
10
10
|
hiddenIcon?: boolean;
|
|
11
11
|
msgErrorDisabled?: boolean;
|
|
12
12
|
onSearch?: (pattern: string) => void;
|
|
13
|
-
onSelect?: (value: T) => void;
|
|
13
|
+
onSelect?: (value: NonNullable<T>) => void;
|
|
14
14
|
onValue?: (value?: T) => void;
|
|
15
15
|
placeholder?: string;
|
|
16
16
|
searching?: boolean;
|
|
17
|
+
value?: T;
|
|
17
18
|
}
|
|
18
19
|
interface FieldAutocompleteTemplateProps<T = any, E extends Element<T> = Element<T>> extends FieldAutocompleteProps<T, E> {
|
|
19
20
|
render: (element: E) => ReactNode;
|
|
20
21
|
}
|
|
21
22
|
export declare function RlsFieldAutocompleteTemplate<T = any, E extends Element<T> = Element<T>>(props: FieldAutocompleteTemplateProps<T, E>): import("react/jsx-runtime").JSX.Element;
|
|
22
|
-
|
|
23
|
+
interface FieldValueProps<T = any, E extends Element<T> = Element<T>> extends FieldAutocompleteProps<T, E> {
|
|
24
|
+
value: NonUndefined<T>;
|
|
25
|
+
}
|
|
26
|
+
interface FieldUndefinedProps<T = any, E extends Element<T> = Element<T>> extends FieldAutocompleteProps<T, E> {
|
|
27
|
+
value: undefined;
|
|
28
|
+
}
|
|
29
|
+
type FieldVoidProps<T = any, E extends Element<T> = Element<T>> = Omit<FieldValueProps<T, E>, 'value'>;
|
|
30
|
+
export declare function RlsFieldAutocomplete<T = any>(props: FieldVoidProps<T, AutocompleteElement<T>>): JSX.Element;
|
|
31
|
+
export declare function RlsFieldAutocomplete<T = any>(props: FieldUndefinedProps<T, AutocompleteElement<T>>): JSX.Element;
|
|
32
|
+
export declare function RlsFieldAutocomplete<T = any>(props: FieldValueProps<T, AutocompleteElement<T>>): JSX.Element;
|
|
33
|
+
export declare function RlsFieldAutocomplete<T = any>(props: FieldAutocompleteProps<T, AutocompleteElement<T>>): JSX.Element;
|
|
23
34
|
export {};
|
|
@@ -3,25 +3,28 @@ import { reactI18n } from '../../../i18n';
|
|
|
3
3
|
import { renderClassStatus } from '../../../helpers/css';
|
|
4
4
|
import { RlsIcon, RlsProgressBar } from '../../atoms';
|
|
5
5
|
import { RlsBallot, RlsMessageFormError } from '../../molecules';
|
|
6
|
-
import { useFieldAutocomplete } from './
|
|
6
|
+
import { useFieldAutocomplete } from './FieldAutocompleteController';
|
|
7
7
|
import './FieldAutocomplete.css';
|
|
8
8
|
export function RlsFieldAutocompleteTemplate(props) {
|
|
9
|
-
const
|
|
10
|
-
const {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
9
|
+
const autocomplete = useFieldAutocomplete(props);
|
|
10
|
+
const { controller } = autocomplete;
|
|
11
|
+
const { render, children, formControl, hiddenIcon, msgErrorDisabled, onSearch, placeholder, rlsTheme, searching } = props;
|
|
12
|
+
const disabled = formControl?.disabled || props.disabled;
|
|
13
|
+
const className = renderClassStatus('rls-field-box', {
|
|
14
|
+
focused: controller.focused,
|
|
15
|
+
disabled,
|
|
16
|
+
error: formControl?.wrong,
|
|
17
|
+
selected: !!controller.value
|
|
18
|
+
}, 'rls-field-list rls-field-autocomplete');
|
|
19
|
+
return (_jsxs("div", { ref: controller.contentRef, className: className, "rls-theme": rlsTheme, children: [children && _jsx("label", { className: "rls-field-box__label", children: children }), _jsx("div", { className: "rls-field-box__component", children: _jsxs("div", { className: "rls-field-box__body", children: [_jsx("input", { className: "rls-field-list__control", readOnly: true, disabled: disabled, placeholder: placeholder, value: controller.value, onClick: autocomplete.onClickControl }), !hiddenIcon && controller.value && (_jsx("button", { className: "rls-field-list__action", disabled: disabled, onClick: autocomplete.onClickAction, children: _jsx(RlsIcon, { value: "trash-2" }) }))] }) }), !msgErrorDisabled && (_jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })), _jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
20
|
+
visible: controller.listIsVisible,
|
|
21
|
+
higher: controller.higher,
|
|
22
|
+
hide: !controller.listIsVisible
|
|
23
|
+
}), children: [_jsx("div", { className: "rls-field-list__suggestions__body", children: _jsxs("ul", { ref: controller.listRef, className: "rls-field-list__ul", children: [_jsxs("div", { className: "rls-field-list__ul__search", children: [_jsx("input", { ref: controller.inputRef, className: "rls-field-list__ul__control", type: "text", placeholder: reactI18n('listInputPlaceholder'), value: autocomplete.pattern, onChange: ({ target: { value } }) => {
|
|
24
|
+
autocomplete.setPattern(value);
|
|
25
|
+
}, disabled: disabled || searching, onFocus: autocomplete.onFocusInput, onBlur: autocomplete.onBlurInput, onKeyDown: autocomplete.onKeydownInput }), onSearch && (_jsx("button", { disabled: disabled || searching, onClick: () => {
|
|
26
|
+
onSearch(autocomplete.pattern);
|
|
27
|
+
}, children: _jsx(RlsIcon, { value: "search" }) }))] }), searching && _jsx(RlsProgressBar, { indeterminate: true }), autocomplete.coincidences.map((element, index) => (_jsx("li", { className: "rls-field-list__element", tabIndex: -1, onClick: autocomplete.onClickElement(element), onKeyDown: autocomplete.onKeydownElement(element), children: render(element) }, index))), !autocomplete.coincidences.length && (_jsx("li", { className: "rls-field-list__empty", children: _jsxs("div", { className: "rls-field-list__empty__description", children: [_jsx("label", { className: "rls-label-bold truncate", children: reactI18n('listEmptyTitle') }), _jsx("p", { className: "rls-caption-regular", children: reactI18n('listEmptyDescription') })] }) }))] }) }), _jsx("div", { className: "rls-field-list__backdrop", onClick: autocomplete.onClickBackdrop })] })] }));
|
|
25
28
|
}
|
|
26
29
|
export function RlsFieldAutocomplete(props) {
|
|
27
30
|
return (_jsx(RlsFieldAutocompleteTemplate, { ...props, render: (element) => (_jsx(RlsBallot, { subtitle: element.subtitle, img: element.img, initials: element.initials, children: _jsx("span", { children: element.title }) })) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldAutocomplete.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldAutocomplete/FieldAutocomplete.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"FieldAutocomplete.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldAutocomplete/FieldAutocomplete.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { AbstractAutocompleteElement as Element } from '@rolster/components';
|
|
2
|
+
import { ReactControl } from '@rolster/react-forms';
|
|
3
|
+
import { KeyboardEvent, KeyboardEventHandler, MouseEventHandler } from 'react';
|
|
4
|
+
import { ListController } from '../../../controllers';
|
|
5
|
+
export interface FieldAutocompleteControl<T = any, E extends Element<T> = Element<T>> {
|
|
6
|
+
coincidences: E[];
|
|
7
|
+
controller: ListController<T>;
|
|
8
|
+
onBlurInput: () => void;
|
|
9
|
+
onClickAction: () => void;
|
|
10
|
+
onClickBackdrop: () => void;
|
|
11
|
+
onClickControl: () => void;
|
|
12
|
+
onClickElement: (element: E) => MouseEventHandler;
|
|
13
|
+
onFocusInput: () => void;
|
|
14
|
+
onKeydownElement: (element: E) => KeyboardEventHandler;
|
|
15
|
+
onKeydownInput: (event: KeyboardEvent) => void;
|
|
16
|
+
pattern: string;
|
|
17
|
+
setPattern: (value: string) => void;
|
|
18
|
+
}
|
|
19
|
+
interface FieldAutocompleteProps<T = any, E extends Element<T> = Element<T>> {
|
|
20
|
+
suggestions: E[];
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
formControl?: ReactControl<HTMLElement, T>;
|
|
23
|
+
onSelect?: (value: NonNullable<T>) => void;
|
|
24
|
+
onValue?: (value: T) => void;
|
|
25
|
+
value?: T;
|
|
26
|
+
}
|
|
27
|
+
interface FieldValueProps<T = any, E extends Element<T> = Element<T>> extends FieldAutocompleteProps<T, E> {
|
|
28
|
+
value: NonUndefined<T>;
|
|
29
|
+
}
|
|
30
|
+
interface FieldUndefinedProps<T = any, E extends Element<T> = Element<T>> extends FieldAutocompleteProps<T | undefined, E> {
|
|
31
|
+
value: undefined;
|
|
32
|
+
}
|
|
33
|
+
type FieldVoidProps<T = any, E extends Element<T> = Element<T>> = Omit<FieldUndefinedProps<T | undefined, E>, 'value'>;
|
|
34
|
+
export declare function useFieldAutocomplete<T = any, E extends Element<T> = Element<T>>(props: FieldVoidProps<T, E>): FieldAutocompleteControl<T | undefined, E>;
|
|
35
|
+
export declare function useFieldAutocomplete<T = any, E extends Element<T> = Element<T>>(props: FieldUndefinedProps<T, E>): FieldAutocompleteControl<T | undefined, E>;
|
|
36
|
+
export declare function useFieldAutocomplete<T = any, E extends Element<T> = Element<T>>(props: FieldValueProps<T, E>): FieldAutocompleteControl<T, E>;
|
|
37
|
+
export declare function useFieldAutocomplete<T = any, E extends Element<T> = Element<T>>(props: FieldAutocompleteProps<T, E>): FieldAutocompleteControl<T, E>;
|
|
38
|
+
export {};
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { createAutocompleteStore } from '@rolster/components';
|
|
2
2
|
import { useEffect, useRef, useState } from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { useListController } from '../../../controllers';
|
|
4
4
|
const DURATION_ANIMATION = 240;
|
|
5
5
|
const MAX_ELEMENTS = 6;
|
|
6
|
-
export function useFieldAutocomplete(
|
|
6
|
+
export function useFieldAutocomplete(props) {
|
|
7
|
+
const controller = useListController(props);
|
|
7
8
|
const [pattern, setPattern] = useState('');
|
|
8
9
|
const [coincidences, setCoincidences] = useState([]);
|
|
9
10
|
const currentStore = useRef({
|
|
@@ -11,46 +12,45 @@ export function useFieldAutocomplete({ disabled, formControl, onSelect, onValue,
|
|
|
11
12
|
pattern: '',
|
|
12
13
|
previous: null
|
|
13
14
|
});
|
|
14
|
-
const
|
|
15
|
-
const { inputRef, navigationElement, navigationInput, setFormValue, setState } = listControl;
|
|
15
|
+
const disabled = props.formControl?.disabled || props.disabled;
|
|
16
16
|
useEffect(() => {
|
|
17
17
|
refreshCoincidences(pattern, true);
|
|
18
|
-
}, [suggestions]);
|
|
18
|
+
}, [props.suggestions]);
|
|
19
19
|
useEffect(() => {
|
|
20
20
|
refreshCoincidences(pattern);
|
|
21
21
|
}, [pattern]);
|
|
22
22
|
function onClickControl() {
|
|
23
23
|
if (!disabled) {
|
|
24
|
-
setState({ listIsVisible: true });
|
|
24
|
+
controller.setState({ listIsVisible: true });
|
|
25
25
|
setTimeout(() => {
|
|
26
|
-
inputRef?.current?.focus();
|
|
26
|
+
controller.inputRef?.current?.focus();
|
|
27
27
|
}, DURATION_ANIMATION);
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
function onFocusInput() {
|
|
31
|
-
setState({ focused: true });
|
|
31
|
+
controller.setState({ focused: true });
|
|
32
32
|
}
|
|
33
33
|
function onBlurInput() {
|
|
34
|
-
setState({ focused: false });
|
|
34
|
+
controller.setState({ focused: false });
|
|
35
35
|
}
|
|
36
36
|
function onKeydownInput(event) {
|
|
37
37
|
switch (event.code) {
|
|
38
38
|
case 'Escape':
|
|
39
39
|
case 'Tab':
|
|
40
|
-
setState({ listIsVisible: false });
|
|
40
|
+
controller.setState({ listIsVisible: false });
|
|
41
41
|
break;
|
|
42
42
|
default:
|
|
43
|
-
navigationInput(event);
|
|
43
|
+
controller.navigationInput(event);
|
|
44
44
|
break;
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
function onClickAction() {
|
|
48
|
-
setState({ listIsVisible: false, value: '' });
|
|
49
|
-
setFormValue(
|
|
50
|
-
onValue && onValue(
|
|
48
|
+
controller.setState({ listIsVisible: false, value: '' });
|
|
49
|
+
controller.setFormValue(props.value);
|
|
50
|
+
props.onValue && props.onValue(props.value);
|
|
51
51
|
}
|
|
52
52
|
function onClickBackdrop() {
|
|
53
|
-
setState({ listIsVisible: false });
|
|
53
|
+
controller.setState({ listIsVisible: false });
|
|
54
54
|
}
|
|
55
55
|
function onClickElement(element) {
|
|
56
56
|
return () => {
|
|
@@ -59,24 +59,26 @@ export function useFieldAutocomplete({ disabled, formControl, onSelect, onValue,
|
|
|
59
59
|
}
|
|
60
60
|
function onKeydownElement(element) {
|
|
61
61
|
return (event) => {
|
|
62
|
-
event.code === 'Enter'
|
|
62
|
+
event.code === 'Enter'
|
|
63
|
+
? onChange(element)
|
|
64
|
+
: controller.navigationElement(event);
|
|
63
65
|
};
|
|
64
66
|
}
|
|
65
67
|
function onChange({ description, value }) {
|
|
66
|
-
if (onSelect) {
|
|
67
|
-
setState({ listIsVisible: false });
|
|
68
|
-
onSelect(value);
|
|
68
|
+
if (props.onSelect) {
|
|
69
|
+
controller.setState({ listIsVisible: false });
|
|
70
|
+
value && props.onSelect(value);
|
|
69
71
|
}
|
|
70
72
|
else {
|
|
71
|
-
setState({ listIsVisible: false, value: description });
|
|
72
|
-
setFormValue(value);
|
|
73
|
+
controller.setState({ listIsVisible: false, value: description });
|
|
74
|
+
controller.setFormValue(value);
|
|
73
75
|
}
|
|
74
|
-
onValue && onValue(value);
|
|
76
|
+
props.onValue && props.onValue(value);
|
|
75
77
|
}
|
|
76
78
|
function refreshCoincidences(pattern, reboot = false) {
|
|
77
79
|
const { collection, store } = createAutocompleteStore({
|
|
78
80
|
pattern,
|
|
79
|
-
suggestions,
|
|
81
|
+
suggestions: props.suggestions,
|
|
80
82
|
reboot,
|
|
81
83
|
store: currentStore.current
|
|
82
84
|
});
|
|
@@ -85,7 +87,7 @@ export function useFieldAutocomplete({ disabled, formControl, onSelect, onValue,
|
|
|
85
87
|
}
|
|
86
88
|
return {
|
|
87
89
|
coincidences,
|
|
88
|
-
|
|
90
|
+
controller,
|
|
89
91
|
onBlurInput,
|
|
90
92
|
onClickAction,
|
|
91
93
|
onClickBackdrop,
|
|
@@ -98,4 +100,4 @@ export function useFieldAutocomplete({ disabled, formControl, onSelect, onValue,
|
|
|
98
100
|
setPattern
|
|
99
101
|
};
|
|
100
102
|
}
|
|
101
|
-
//# sourceMappingURL=
|
|
103
|
+
//# sourceMappingURL=FieldAutocompleteController.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FieldAutocompleteController.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldAutocomplete/FieldAutocompleteController.ts"],"names":[],"mappings":"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"}
|
|
@@ -4,13 +4,14 @@ import './FieldDate.css';
|
|
|
4
4
|
interface FieldDateProps extends RlsComponent {
|
|
5
5
|
date?: Date;
|
|
6
6
|
disabled?: boolean;
|
|
7
|
-
formControl?: ReactControl<HTMLElement,
|
|
7
|
+
formControl?: ReactControl<HTMLElement, Date> | ReactControl<HTMLElement, Date | undefined>;
|
|
8
8
|
format?: string;
|
|
9
9
|
maxDate?: Date;
|
|
10
10
|
minDate?: Date;
|
|
11
11
|
msgErrorDisabled?: boolean;
|
|
12
12
|
onValue?: (value?: Date) => void;
|
|
13
13
|
placeholder?: string;
|
|
14
|
+
value?: Date;
|
|
14
15
|
}
|
|
15
|
-
export declare function RlsFieldDate({ children, date, disabled, formControl, format, maxDate, minDate, msgErrorDisabled, onValue, placeholder, rlsTheme }: FieldDateProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function RlsFieldDate({ children, date, disabled, formControl, format, maxDate, minDate, msgErrorDisabled, onValue, placeholder, rlsTheme, value: defaultValue }: FieldDateProps): import("react/jsx-runtime").JSX.Element;
|
|
16
17
|
export {};
|
|
@@ -9,9 +9,9 @@ import { RlsModal } from '../Modal/Modal';
|
|
|
9
9
|
import { RlsPickerDate } from '../PickerDate/PickerDate';
|
|
10
10
|
import './FieldDate.css';
|
|
11
11
|
const FORMAT_DATE = '{dd}/{mx}/{aa}';
|
|
12
|
-
export function RlsFieldDate({ children, date, disabled, formControl, format, maxDate, minDate, msgErrorDisabled, onValue, placeholder, rlsTheme }) {
|
|
12
|
+
export function RlsFieldDate({ children, date, disabled, formControl, format, maxDate, minDate, msgErrorDisabled, onValue, placeholder, rlsTheme, value: defaultValue }) {
|
|
13
13
|
const today = new Date(); // Initial current date in component
|
|
14
|
-
const [value, setValue] = useState();
|
|
14
|
+
const [value, setValue] = useState(defaultValue);
|
|
15
15
|
const [modalIsVisible, setModalIsVisible] = useState(false);
|
|
16
16
|
useEffect(() => {
|
|
17
17
|
const dateCheck = checkDateRange({
|
|
@@ -31,7 +31,7 @@ export function RlsFieldDate({ children, date, disabled, formControl, format, ma
|
|
|
31
31
|
}
|
|
32
32
|
function onClickAction() {
|
|
33
33
|
if (value) {
|
|
34
|
-
formControl?.setValue(
|
|
34
|
+
formControl?.setValue(defaultValue);
|
|
35
35
|
formControl?.touch();
|
|
36
36
|
onChange(undefined);
|
|
37
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldDate.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldDate/FieldDate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,kBAAkB,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAEpD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,GAAG,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"FieldDate.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldDate/FieldDate.tsx"],"names":[],"mappings":"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"}
|
|
@@ -6,15 +6,26 @@ import './FieldSelect.css';
|
|
|
6
6
|
interface FieldSelectProps<T = any, E extends Element<T> = Element<T>> extends RlsComponent {
|
|
7
7
|
suggestions: E[];
|
|
8
8
|
disabled?: boolean;
|
|
9
|
-
formControl?: ReactControl<HTMLElement, T
|
|
9
|
+
formControl?: ReactControl<HTMLElement, T>;
|
|
10
10
|
msgErrorDisabled?: boolean;
|
|
11
|
-
onSelect?: (value: T) => void;
|
|
12
|
-
onValue?: (value
|
|
11
|
+
onSelect?: (value: NonNullable<T>) => void;
|
|
12
|
+
onValue?: (value: T) => void;
|
|
13
13
|
placeholder?: string;
|
|
14
|
+
value?: T;
|
|
14
15
|
}
|
|
15
16
|
interface FieldSelectTemplateProps<T = any, E extends Element<T> = Element<T>> extends FieldSelectProps<T, E> {
|
|
16
17
|
render: (element: E) => ReactNode;
|
|
17
18
|
}
|
|
18
19
|
export declare function RlsFieldSelectTemplate<T = any, E extends Element<T> = Element<T>>(props: FieldSelectTemplateProps<T, E>): import("react/jsx-runtime").JSX.Element;
|
|
19
|
-
|
|
20
|
+
interface FieldValueProps<T = any, E extends Element<T> = Element<T>> extends FieldSelectProps<T, E> {
|
|
21
|
+
value: NonUndefined<T>;
|
|
22
|
+
}
|
|
23
|
+
interface FieldUndefinedProps<T = any, E extends Element<T> = Element<T>> extends FieldSelectProps<T, E> {
|
|
24
|
+
value: undefined;
|
|
25
|
+
}
|
|
26
|
+
type FieldVoidProps<T = any, E extends Element<T> = Element<T>> = Omit<FieldValueProps<T, E>, 'value'>;
|
|
27
|
+
export declare function RlsFieldSelect<T = any>(props: FieldVoidProps<T, ListElement<T>>): JSX.Element;
|
|
28
|
+
export declare function RlsFieldSelect<T = any>(props: FieldUndefinedProps<T, ListElement<T>>): JSX.Element;
|
|
29
|
+
export declare function RlsFieldSelect<T = any>(props: FieldValueProps<T, ListElement<T>>): JSX.Element;
|
|
30
|
+
export declare function RlsFieldSelect<T = any>(props: FieldSelectProps<T, ListElement<T>>): JSX.Element;
|
|
20
31
|
export {};
|
|
@@ -3,22 +3,25 @@ import { reactI18n } from '../../../i18n';
|
|
|
3
3
|
import { renderClassStatus } from '../../../helpers/css';
|
|
4
4
|
import { RlsIcon } from '../../atoms';
|
|
5
5
|
import { RlsBallot, RlsMessageFormError } from '../../molecules';
|
|
6
|
-
import { useFieldSelect } from './
|
|
6
|
+
import { useFieldSelect } from './FieldSelectController';
|
|
7
7
|
import './FieldSelect.css';
|
|
8
8
|
export function RlsFieldSelectTemplate(props) {
|
|
9
|
-
const
|
|
10
|
-
const {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
9
|
+
const select = useFieldSelect(props);
|
|
10
|
+
const { controller } = select;
|
|
11
|
+
const { render, suggestions, children, formControl, msgErrorDisabled, placeholder, rlsTheme } = props;
|
|
12
|
+
const disabled = formControl?.disabled || props.disabled;
|
|
13
|
+
const className = renderClassStatus('rls-field-box', {
|
|
14
|
+
focused: controller.focused,
|
|
15
|
+
disabled,
|
|
16
|
+
error: formControl?.wrong
|
|
17
|
+
}, 'rls-field-list rls-field-select');
|
|
18
|
+
return (_jsxs("div", { ref: controller.contentRef, className: className, "rls-theme": rlsTheme, children: [children && _jsx("label", { className: "rls-field-box__label", children: children }), _jsx("div", { className: "rls-field-box__component", children: _jsxs("div", { className: "rls-field-box__body", children: [_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 }), _jsx("button", { className: renderClassStatus('rls-field-list__action', {
|
|
19
|
+
visible: controller.listIsVisible
|
|
20
|
+
}), disabled: disabled, onClick: select.onClickAction, children: _jsx(RlsIcon, { value: "arrow-ios-down" }) })] }) }), !msgErrorDisabled && (_jsx(RlsMessageFormError, { className: "rls-field-box__error", formControl: formControl })), _jsxs("div", { className: renderClassStatus('rls-field-list__suggestions', {
|
|
21
|
+
visible: controller.listIsVisible,
|
|
22
|
+
higher: controller.higher,
|
|
23
|
+
hide: !controller.listIsVisible
|
|
24
|
+
}), children: [_jsx("div", { className: "rls-field-list__suggestions__body", children: _jsxs("ul", { ref: controller.listRef, className: "rls-field-list__ul", children: [suggestions.map((element, index) => (_jsx("li", { className: "rls-field-list__element", tabIndex: -1, onClick: select.onClickElement(element), onKeyDown: select.onKeydownElement(element), children: render(element) }, index))), !suggestions.length && (_jsx("li", { className: "rls-field-list__empty", children: _jsxs("div", { className: "rls-field-list__empty__description", children: [_jsx("label", { className: "rls-label-bold truncate", children: reactI18n('listEmptyTitle') }), _jsx("p", { className: "rls-caption-regular", children: reactI18n('listEmptyDescription') })] }) }))] }) }), _jsx("div", { className: "rls-field-list__backdrop", onClick: select.onClickBackdrop })] })] }));
|
|
22
25
|
}
|
|
23
26
|
export function RlsFieldSelect(props) {
|
|
24
27
|
return (_jsx(RlsFieldSelectTemplate, { ...props, render: (element) => (_jsx(RlsBallot, { subtitle: element.subtitle, img: element.img, initials: element.initials, children: _jsx("span", { children: element.title }) })) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldSelect.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldSelect/FieldSelect.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"FieldSelect.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldSelect/FieldSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { AbstractListElement as Element } from '@rolster/components';
|
|
2
|
+
import { ReactControl } from '@rolster/react-forms';
|
|
3
|
+
import { KeyboardEvent, KeyboardEventHandler, MouseEventHandler } from 'react';
|
|
4
|
+
import { ListController } from '../../../controllers';
|
|
5
|
+
export interface FieldSelectControl<T = any, E extends Element<T> = Element<T>> {
|
|
6
|
+
controller: ListController<T>;
|
|
7
|
+
onBlurInput: () => void;
|
|
8
|
+
onClickAction: () => void;
|
|
9
|
+
onClickBackdrop: () => void;
|
|
10
|
+
onClickElement: (element: E) => MouseEventHandler;
|
|
11
|
+
onClickInput: () => void;
|
|
12
|
+
onFocusInput: () => void;
|
|
13
|
+
onKeydownElement: (element: E) => KeyboardEventHandler;
|
|
14
|
+
onKeydownInput: (event: KeyboardEvent) => void;
|
|
15
|
+
}
|
|
16
|
+
interface FieldSelectProps<T = any, E extends Element<T> = Element<T>> {
|
|
17
|
+
suggestions: E[];
|
|
18
|
+
disabled?: boolean;
|
|
19
|
+
formControl?: ReactControl<HTMLElement, T>;
|
|
20
|
+
onSelect?: (value: NonNullable<T>) => void;
|
|
21
|
+
onValue?: (value: T) => void;
|
|
22
|
+
value?: T;
|
|
23
|
+
}
|
|
24
|
+
interface FieldValueProps<T = any, E extends Element<T> = Element<T>> extends FieldSelectProps<T, E> {
|
|
25
|
+
value: NonUndefined<T>;
|
|
26
|
+
}
|
|
27
|
+
interface FieldUndefinedProps<T = any, E extends Element<T> = Element<T>> extends FieldSelectProps<T | undefined, E> {
|
|
28
|
+
value: undefined;
|
|
29
|
+
}
|
|
30
|
+
type FieldVoidProps<T = any, E extends Element<T> = Element<T>> = Omit<FieldValueProps<T | undefined, E>, 'value'>;
|
|
31
|
+
export declare function useFieldSelect<T = any, E extends Element<T> = Element<T>>(props: FieldVoidProps<T, E>): FieldSelectControl<T | undefined, E>;
|
|
32
|
+
export declare function useFieldSelect<T = any, E extends Element<T> = Element<T>>(props: FieldUndefinedProps<T, E>): FieldSelectControl<T | undefined, E>;
|
|
33
|
+
export declare function useFieldSelect<T = any, E extends Element<T> = Element<T>>(props: FieldValueProps<T, E>): FieldSelectControl<T, E>;
|
|
34
|
+
export declare function useFieldSelect<T = any, E extends Element<T> = Element<T>>(props: FieldSelectProps<T, E>): FieldSelectControl<T, E>;
|
|
35
|
+
export {};
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { useListController } from '../../../controllers';
|
|
2
|
+
export function useFieldSelect(props) {
|
|
3
|
+
const controller = useListController(props);
|
|
4
|
+
function onFocusInput() {
|
|
5
|
+
controller.setState({ focused: true });
|
|
6
|
+
}
|
|
7
|
+
function onBlurInput() {
|
|
8
|
+
controller.setState({ focused: false });
|
|
9
|
+
}
|
|
10
|
+
function onClickInput() {
|
|
11
|
+
controller.setState({ listIsVisible: true });
|
|
12
|
+
}
|
|
13
|
+
function onKeydownInput(event) {
|
|
14
|
+
switch (event.code) {
|
|
15
|
+
case 'Space':
|
|
16
|
+
case 'Enter':
|
|
17
|
+
controller.setState({ listIsVisible: true });
|
|
18
|
+
break;
|
|
19
|
+
case 'Escape':
|
|
20
|
+
case 'Tab':
|
|
21
|
+
controller.setState({ listIsVisible: false });
|
|
22
|
+
break;
|
|
23
|
+
default:
|
|
24
|
+
controller.navigationInput(event);
|
|
25
|
+
break;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
function onClickAction() {
|
|
29
|
+
controller.setState({ listIsVisible: !controller.listIsVisible });
|
|
30
|
+
!controller.listIsVisible && controller.inputRef?.current?.focus();
|
|
31
|
+
}
|
|
32
|
+
function onClickBackdrop() {
|
|
33
|
+
controller.setState({ listIsVisible: false });
|
|
34
|
+
}
|
|
35
|
+
function onClickElement(element) {
|
|
36
|
+
return () => {
|
|
37
|
+
onChange(element);
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
function onKeydownElement(element) {
|
|
41
|
+
return (event) => {
|
|
42
|
+
event.code === 'Enter'
|
|
43
|
+
? onChange(element)
|
|
44
|
+
: controller.navigationElement(event);
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
function onChange({ description, value }) {
|
|
48
|
+
controller.inputRef?.current?.focus();
|
|
49
|
+
if (props.onSelect) {
|
|
50
|
+
controller.setState({ listIsVisible: false });
|
|
51
|
+
value && props.onSelect(value);
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
controller.setFormValue(value);
|
|
55
|
+
controller.setState({ listIsVisible: false, value: description });
|
|
56
|
+
}
|
|
57
|
+
props.onValue && props.onValue(value);
|
|
58
|
+
}
|
|
59
|
+
return {
|
|
60
|
+
controller,
|
|
61
|
+
onBlurInput,
|
|
62
|
+
onClickAction,
|
|
63
|
+
onClickBackdrop,
|
|
64
|
+
onClickInput,
|
|
65
|
+
onClickElement,
|
|
66
|
+
onFocusInput,
|
|
67
|
+
onKeydownElement,
|
|
68
|
+
onKeydownInput
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
//# sourceMappingURL=FieldSelectController.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FieldSelectController.js","sourceRoot":"","sources":["../../../../../src/components/organisms/FieldSelect/FieldSelectController.ts"],"names":[],"mappings":"AAGA,OAAO,EAAkB,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAqDzE,MAAM,UAAU,cAAc,CAC5B,KAA6B;IAE7B,MAAM,UAAU,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAE5C,SAAS,YAAY;QACnB,UAAU,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACzC,CAAC;IAED,SAAS,WAAW;QAClB,UAAU,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IAC1C,CAAC;IAED,SAAS,YAAY;QACnB,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;IAC/C,CAAC;IAED,SAAS,cAAc,CAAC,KAAoB;QAC1C,QAAQ,KAAK,CAAC,IAAI,EAAE,CAAC;YACnB,KAAK,OAAO,CAAC;YACb,KAAK,OAAO;gBACV,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;gBAC7C,MAAM;YAER,KAAK,QAAQ,CAAC;YACd,KAAK,KAAK;gBACR,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,CAAC;gBAC9C,MAAM;YAER;gBACE,UAAU,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;gBAClC,MAAM;QACV,CAAC;IACH,CAAC;IAED,SAAS,aAAa;QACpB,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC,CAAC;QAClE,CAAC,UAAU,CAAC,aAAa,IAAI,UAAU,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IACrE,CAAC;IAED,SAAS,eAAe;QACtB,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,CAAC;IAChD,CAAC;IAED,SAAS,cAAc,CAAC,OAAmB;QACzC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,OAAO,CAAC,CAAC;QACpB,CAAC,CAAC;IACJ,CAAC;IAED,SAAS,gBAAgB,CAAC,OAAmB;QAC3C,OAAO,CAAC,KAAK,EAAE,EAAE;YACf,KAAK,CAAC,IAAI,KAAK,OAAO;gBACpB,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC;gBACnB,CAAC,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC,CAAC;IACJ,CAAC;IAED,SAAS,QAAQ,CAAC,EAAE,WAAW,EAAE,KAAK,EAAc;QAClD,UAAU,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAEtC,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;YACnB,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,CAAC;YAC9C,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;YAC/B,UAAU,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;QACpE,CAAC;QAED,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACxC,CAAC;IAED,OAAO;QACL,UAAU;QACV,WAAW;QACX,aAAa;QACb,eAAe;QACf,YAAY;QACZ,cAAc;QACd,YAAY;QACZ,gBAAgB;QAChB,cAAc;KACf,CAAC;AACJ,CAAC"}
|
|
@@ -6,7 +6,7 @@ interface PickerDateProps extends RlsComponent {
|
|
|
6
6
|
automatic?: boolean;
|
|
7
7
|
date?: Date;
|
|
8
8
|
disabled?: boolean;
|
|
9
|
-
formControl?: ReactControl<HTMLElement, Date | undefined>;
|
|
9
|
+
formControl?: ReactControl<HTMLElement, Date> | ReactControl<HTMLElement, Date | undefined>;
|
|
10
10
|
maxDate?: Date;
|
|
11
11
|
minDate?: Date;
|
|
12
12
|
onListener?: (listener: PickerListener<Date>) => void;
|