@dilicorp/ui 0.1.8 → 0.1.10

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.
@@ -7,6 +7,7 @@ export declare type InputDatepickerProps = {
7
7
  id?: string;
8
8
  placeholder?: string;
9
9
  onChange?: (name: string, value: string) => void;
10
+ onBlur?: (name: string, value: string) => void;
10
11
  locale?: SupportedLanguages;
11
12
  dateFormat?: SupportedDateFormat;
12
13
  minDate?: Date | null;
@@ -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,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;IAChC,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAGD,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBAoD1D,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,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9C,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,UAAU,CAAC,EAAE,mBAAmB,CAAA;IAChC,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAGD,eAAO,MAAM,eAAe,UAAW,oBAAoB,gBA4D1D,CAAA"}
@@ -11,7 +11,7 @@ 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, id = name, value, onChange, locale = 'pt-BR', dateFormat = 'dd/MM/yyyy', placeholder = 'DD/MM/YYYY', minDate, maxDate, currentValue } = props;
14
+ const { name, id = name, value, onChange, onBlur, locale = 'pt-BR', dateFormat = 'dd/MM/yyyy', placeholder = 'DD/MM/YYYY', minDate, maxDate, currentValue } = props;
15
15
  const [date, setDate] = React.useState(dateHelper.stringToDate(currentValue || value));
16
16
  const handleDateSelect = (currentDate) => {
17
17
  if (onChange) {
@@ -19,9 +19,15 @@ export const InputDatepicker = (props) => {
19
19
  }
20
20
  setDate(currentDate);
21
21
  };
22
+ const handleBlur = (event) => {
23
+ var _a;
24
+ if (onBlur) {
25
+ onBlur(name, (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value);
26
+ }
27
+ };
22
28
  const mask = [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/];
23
29
  return (React.createElement(ReactDatePicker, { name: name, id: id, "data-testid": id, locale: locale, dateFormat: dateFormat, className: "form-control", selected: date, onChange: handleDateSelect, placeholderText: placeholder, autoComplete: "off",
24
30
  // showMonthDropdown
25
31
  // useShortMonthInDropdown
26
- minDate: minDate, maxDate: maxDate, showYearDropdown: true, yearDropdownItemNumber: 5, scrollableYearDropdown: true, tabIndex: 2, customInput: React.createElement(MaskedTextInput, { type: "text", mask: mask }) }));
32
+ minDate: minDate, maxDate: maxDate, showYearDropdown: true, yearDropdownItemNumber: 5, scrollableYearDropdown: true, tabIndex: 2, onBlur: handleBlur, customInput: React.createElement(MaskedTextInput, { type: "text", mask: mask }) }));
27
33
  };
@@ -1 +1 @@
1
- {"version":3,"file":"input-currency.d.ts","sourceRoot":"","sources":["../../../../src/components/form-builder/components/input-currency.tsx"],"names":[],"mappings":";AAKA,aAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE;QACL,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KACnB,CAAA;IACD,YAAY,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAA;IACnC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,CAAA;QACd,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;CACF,CAAA;AAED,eAAO,MAAM,aAAa,4CAA6C,KAAK,gBAiB3E,CAAA"}
1
+ {"version":3,"file":"input-currency.d.ts","sourceRoot":"","sources":["../../../../src/components/form-builder/components/input-currency.tsx"],"names":[],"mappings":";AAKA,aAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE;QACL,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KACnB,CAAA;IACD,YAAY,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAA;IACnC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,CAAA;QACd,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;CACF,CAAA;AAED,eAAO,MAAM,aAAa,4CAA6C,KAAK,gBAkB3E,CAAA"}
@@ -2,6 +2,7 @@ import { FastField } from 'formik';
2
2
  import React from 'react';
3
3
  import numberHelper from '../../../utils/number-helper';
4
4
  export const InputCurrency = ({ attrs, handleChange, currency, name }) => {
5
+ const { maxLength = 20 } = attrs;
5
6
  const handleChangeCurrency = (event) => {
6
7
  const { value } = event.currentTarget;
7
8
  const sanitize = numberHelper.currencySanitize(value);
@@ -12,5 +13,5 @@ export const InputCurrency = ({ attrs, handleChange, currency, name }) => {
12
13
  }
13
14
  });
14
15
  };
15
- return (React.createElement(FastField, { name: name }, ({ field }) => React.createElement("input", Object.assign({}, field, attrs, { onChange: handleChangeCurrency, min: "0", maxLength: 20 }))));
16
+ return (React.createElement(FastField, { name: name }, ({ field }) => React.createElement("input", Object.assign({}, field, attrs, { onChange: handleChangeCurrency, min: "0", maxLength: maxLength }))));
16
17
  };
@@ -1 +1 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-builder/components/input.tsx"],"names":[],"mappings":";AACA,OAAO,EAAa,WAAW,EAAE,MAAM,QAAQ,CAAA;AAK/C,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAE7D,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,IAAI,CAAC,EAAE,MAAM,GAAC,QAAQ,GAAC,UAAU,GAAC,OAAO,GAAC,MAAM,GAAC,QAAQ,GAAC,QAAQ,GAAC,QAAQ,GAAC,OAAO,GAAC,OAAO,CAAA;IAC3F,IAAI,CAAC,EAAE,MAAM,GAAC,KAAK,CAAC,MAAM,GAAC,MAAM,CAAC,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;IACD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,aAAK,KAAK,GAAG,IAAI,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG;IACnD,OAAO,EAAE,WAAW,CAAC,GAAG,CAAC,CAAA;CAC1B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAE,KAAK,EAAE,KAAK,eA+F1C"}
1
+ {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../src/components/form-builder/components/input.tsx"],"names":[],"mappings":";AACA,OAAO,EAAa,WAAW,EAAE,MAAM,QAAQ,CAAA;AAK/C,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAE7D,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,IAAI,CAAC,EAAE,MAAM,GAAC,QAAQ,GAAC,UAAU,GAAC,OAAO,GAAC,MAAM,GAAC,QAAQ,GAAC,QAAQ,GAAC,QAAQ,GAAC,OAAO,GAAC,OAAO,CAAA;IAC3F,IAAI,CAAC,EAAE,MAAM,GAAC,KAAK,CAAC,MAAM,GAAC,MAAM,CAAC,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;IACD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,aAAK,KAAK,GAAG,IAAI,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG;IACnD,OAAO,EAAE,WAAW,CAAC,GAAG,CAAC,CAAA;CAC1B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAE,KAAK,EAAE,KAAK,eAmG1C"}
@@ -44,7 +44,11 @@ export default function Input(props) {
44
44
  }
45
45
  if (actions.setFieldValue) {
46
46
  if (type === 'number') {
47
- actions.setFieldValue(name, event.currentTarget.value.replace(/[^0-9.]/g, ''));
47
+ const newValue = event.currentTarget.value.replace(/[^0-9.]/g, '');
48
+ if (typeof elements.max === 'number' && elements.max < Number(newValue)) {
49
+ return;
50
+ }
51
+ actions.setFieldValue(name, newValue);
48
52
  }
49
53
  else {
50
54
  actions.setFieldValue(name, event.currentTarget.value);
@@ -10,6 +10,7 @@ declare type FilterDatepickerProps = {
10
10
  minDate?: Date | null;
11
11
  maxDate?: Date | null;
12
12
  onChange?: (name: string, value: string) => void;
13
+ onBlur?: (name: string, value: string) => void;
13
14
  currentValue?: string;
14
15
  };
15
16
  export declare const FilterDatepicker: React.FC<FilterDatepickerProps>;
@@ -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;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;IAChC,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA+B5D,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;IAChC,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,OAAO,CAAC,EAAE,IAAI,GAAC,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAuC5D,CAAA"}
@@ -1,15 +1,20 @@
1
1
  import React from 'react';
2
2
  import { InputDatepicker } from '../../../atoms/input-datepicker';
3
3
  export const FilterDatepicker = (props) => {
4
- const { name, id = name, value = '', placeholder, minDate, maxDate, onChange, currentValue } = props;
4
+ const { name, id = name, value = '', placeholder, minDate, maxDate, onChange, onBlur, currentValue } = props;
5
5
  const handleChange = (name, value) => {
6
6
  if (onChange) {
7
7
  onChange(name, value);
8
8
  }
9
9
  };
10
+ const handleBlur = (name, value) => {
11
+ if (onBlur) {
12
+ onBlur(name, value);
13
+ }
14
+ };
10
15
  return (React.createElement("div", { className: "form-group" },
11
16
  Boolean(placeholder) && React.createElement("label", { className: "form-label", htmlFor: name },
12
17
  placeholder,
13
18
  ":"),
14
- React.createElement(InputDatepicker, Object.assign({}, props, { value: value || currentValue || '', id: id, minDate: minDate, maxDate: maxDate, onChange: handleChange }))));
19
+ React.createElement(InputDatepicker, Object.assign({}, props, { value: value || currentValue || '', id: id, minDate: minDate, maxDate: maxDate, onChange: handleChange, onBlur: handleBlur }))));
15
20
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dilicorp/ui",
3
- "version": "0.1.8",
3
+ "version": "0.1.10",
4
4
  "description": "A simple UI design for Dilicorp",
5
5
  "repository": {
6
6
  "type": "git",