@dilicorp/ui 0.0.45 → 0.0.47
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/atoms/input-datepicker.d.ts +3 -1
- package/dist/atoms/input-datepicker.d.ts.map +1 -1
- package/dist/atoms/input-datepicker.js +3 -3
- package/dist/components/alert-template/alert-template.d.ts.map +1 -1
- package/dist/components/alert-template/alert-template.js +1 -1
- package/dist/components/page-list/filters/filter-datepicker.d.ts.map +1 -1
- package/dist/components/page-list/filters/filter-datepicker.js +3 -8
- package/package.json +1 -1
|
@@ -4,7 +4,9 @@ export declare type SupportedDateFormat = 'dd/MM/yyyy';
|
|
|
4
4
|
export declare type InputDatepickerProps = {
|
|
5
5
|
value: string;
|
|
6
6
|
name: string;
|
|
7
|
-
|
|
7
|
+
id?: string;
|
|
8
|
+
placeholder?: string;
|
|
9
|
+
onChange?: (name: string, value: string) => void;
|
|
8
10
|
locale?: SupportedLanguages;
|
|
9
11
|
dateFormat?: SupportedDateFormat;
|
|
10
12
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-datepicker.d.ts","sourceRoot":"","sources":["../../src/atoms/input-datepicker.tsx"],"names":[],"mappings":";AAQA,oBAAY,kBAAkB,GAAG,OAAO,GAAC,OAAO,GAAC,OAAO,GAAC,OAAO,CAAA;AAChE,oBAAY,mBAAmB,GAAG,YAAY,CAAA;AAO9C,oBAAY,oBAAoB,GAAG;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;
|
|
1
|
+
{"version":3,"file":"input-datepicker.d.ts","sourceRoot":"","sources":["../../src/atoms/input-datepicker.tsx"],"names":[],"mappings":";AAQA,oBAAY,kBAAkB,GAAG,OAAO,GAAC,OAAO,GAAC,OAAO,GAAC,OAAO,CAAA;AAChE,oBAAY,mBAAmB,GAAG,YAAY,CAAA;AAO9C,oBAAY,oBAAoB,GAAG;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,UAAU,CAAC,EAAE,mBAAmB,CAAA;CACjC,CAAA;AAGD,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBA8C1D,CAAA"}
|
|
@@ -11,16 +11,16 @@ registerLocale('es-CO', es);
|
|
|
11
11
|
registerLocale('en-US', en);
|
|
12
12
|
// example use https://reactdatepicker.com
|
|
13
13
|
export const InputDatepicker = (props) => {
|
|
14
|
-
const { name, value, onChange, locale = 'pt-BR', dateFormat = 'dd/MM/yyyy' } = props;
|
|
14
|
+
const { name, id = name, value, onChange, locale = 'pt-BR', dateFormat = 'dd/MM/yyyy', placeholder = 'DD/MM/YYYY' } = props;
|
|
15
15
|
const [date, setDate] = React.useState(dateHelper.stringToDate(value));
|
|
16
16
|
const handleDateSelect = (currentDate) => {
|
|
17
17
|
if (onChange) {
|
|
18
18
|
onChange(name, dateHelper.dateToString(currentDate) || '');
|
|
19
|
-
setDate(currentDate);
|
|
20
19
|
}
|
|
20
|
+
setDate(currentDate);
|
|
21
21
|
};
|
|
22
22
|
const mask = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
|
|
23
|
-
return (React.createElement(ReactDatePicker, { locale: locale, dateFormat: dateFormat, className: "form-control", selected: date, onChange: handleDateSelect, placeholderText: "
|
|
23
|
+
return (React.createElement(ReactDatePicker, { name: name, id: id, locale: locale, dateFormat: dateFormat, className: "form-control", selected: date, onChange: handleDateSelect, placeholderText: placeholder, autoComplete: "off",
|
|
24
24
|
// showMonthDropdown
|
|
25
25
|
// useShortMonthInDropdown
|
|
26
26
|
showYearDropdown: true, yearDropdownItemNumber: 5, scrollableYearDropdown: true, tabIndex: 2, customInput: React.createElement(MaskedTextInput, { type: "text", mask: mask }) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-template.d.ts","sourceRoot":"","sources":["../../../src/components/alert-template/alert-template.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,4BAA4B,EAAE,MAAM,aAAa,CAAA;AAE1D,oBAAY,kBAAkB,GAAG,4BAA4B,CAAA;AAsB7D,eAAO,MAAM,aAAa,UAAW,kBAAkB,
|
|
1
|
+
{"version":3,"file":"alert-template.d.ts","sourceRoot":"","sources":["../../../src/components/alert-template/alert-template.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,4BAA4B,EAAE,MAAM,aAAa,CAAA;AAE1D,oBAAY,kBAAkB,GAAG,4BAA4B,CAAA;AAsB7D,eAAO,MAAM,aAAa,UAAW,kBAAkB,gBAiBtD,CAAA"}
|
|
@@ -25,7 +25,7 @@ export const AlertTemplate = (props) => {
|
|
|
25
25
|
// options
|
|
26
26
|
} = props;
|
|
27
27
|
return (React.createElement("div", { style: style.content },
|
|
28
|
-
React.createElement("div", null, message),
|
|
28
|
+
message === 'string' ? React.createElement("div", { dangerouslySetInnerHTML: { __html: message } }) : React.createElement("div", null, message),
|
|
29
29
|
React.createElement("div", null,
|
|
30
30
|
React.createElement(Button, { onClick: close, style: style.close },
|
|
31
31
|
React.createElement(Icon, { icon: "fa-times" })))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-datepicker.d.ts","sourceRoot":"","sources":["../../../../src/components/page-list/filters/filter-datepicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"filter-datepicker.d.ts","sourceRoot":"","sources":["../../../../src/components/page-list/filters/filter-datepicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAmB,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAA;AAE1G,aAAK,qBAAqB,GAAG;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,UAAU,CAAC,EAAE,mBAAmB,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAkB5D,CAAA"}
|
|
@@ -1,15 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import
|
|
3
|
-
import dateHelper from '../../../utils/date-helper';
|
|
2
|
+
import { InputDatepicker } from '../../../atoms/input-datepicker';
|
|
4
3
|
export const FilterDatepicker = (props) => {
|
|
5
|
-
const { name, id = name, value
|
|
6
|
-
const [date, setDate] = React.useState(dateHelper.stringToDate(value));
|
|
7
|
-
const handleChange = (currentDate) => {
|
|
8
|
-
setDate(currentDate);
|
|
9
|
-
};
|
|
4
|
+
const { name, id = name, value = '', placeholder } = props;
|
|
10
5
|
return (React.createElement("div", { className: "form-group" },
|
|
11
6
|
Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
|
|
12
7
|
placeholder,
|
|
13
8
|
":"),
|
|
14
|
-
React.createElement(
|
|
9
|
+
React.createElement(InputDatepicker, Object.assign({}, props, { value: value, id: id }))));
|
|
15
10
|
};
|