linear-react-components-ui 1.1.25-beta.6 → 1.1.25-beta.7

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.
Files changed (59) hide show
  1. package/lib/{BaseMask-78847f45.d.ts → BaseMask-0c14ef51.d.ts} +1 -1
  2. package/lib/{Cnpj-8366781f.d.ts → Cnpj-53bfd6ab.d.ts} +2 -1
  3. package/lib/{Cpf-3dfd54eb.d.ts → Cpf-019b21e0.d.ts} +2 -1
  4. package/lib/{Phone-1962c0f2.d.ts → Phone-2bb0b397.d.ts} +1 -1
  5. package/lib/{ZipCode-be9c5b3b.d.ts → ZipCode-09460e18.d.ts} +1 -1
  6. package/lib/index-19761a50.d.ts +26 -0
  7. package/lib/{index-6fcf446c.d.ts → index-208e7f62.d.ts} +20 -2
  8. package/lib/{index-02a27c19.d.ts → index-3b70931d.d.ts} +20 -2
  9. package/lib/index-4bda404f.d.ts +42 -0
  10. package/lib/{index-25b80f32.d.ts → index-7dfa8924.d.ts} +1 -1
  11. package/lib/{index-6f5c772d.d.ts → index-9e576346.d.ts} +1 -1
  12. package/lib/{index-696662fe.d.ts → index-afb7b5a9.d.ts} +1 -1
  13. package/lib/inputs2/checkboxfield/index.d.ts +2 -3
  14. package/lib/inputs2/checkboxfield/index.js +125 -32
  15. package/lib/inputs2/colorfield/index.d.ts +5 -6
  16. package/lib/inputs2/date/datefield/index.js +322 -34
  17. package/lib/inputs2/date/datefield/types.d.ts +3 -5
  18. package/lib/inputs2/date/dateperiodfield/index.js +587 -34
  19. package/lib/inputs2/date/dateperiodfield/types.d.ts +3 -5
  20. package/lib/inputs2/filefield/index.d.ts +5 -6
  21. package/lib/inputs2/index.d.ts +15 -18
  22. package/lib/inputs2/mask/BaseMask.d.ts +5 -6
  23. package/lib/inputs2/mask/Cnpj.d.ts +6 -7
  24. package/lib/inputs2/mask/Cnpj.js +21 -18
  25. package/lib/inputs2/mask/Cpf.d.ts +6 -7
  26. package/lib/inputs2/mask/Cpf.js +19 -12
  27. package/lib/inputs2/mask/Phone.d.ts +6 -7
  28. package/lib/inputs2/mask/ZipCode.d.ts +6 -7
  29. package/lib/inputs2/numberfield/currency.d.ts +4 -5
  30. package/lib/inputs2/numberfield/decimal.d.ts +4 -5
  31. package/lib/inputs2/numberfield/index.d.ts +4 -5
  32. package/lib/inputs2/numberfield/types.d.ts +4 -5
  33. package/lib/inputs2/radiofield/index.d.ts +1 -1
  34. package/lib/inputs2/radiofield/index.js +126 -25
  35. package/lib/inputs2/radiofield/types.d.ts +4 -6
  36. package/lib/inputs2/selectfield/index.d.ts +1 -1
  37. package/lib/inputs2/selectfield/index.js +502 -35
  38. package/lib/inputs2/selectfield/types.d.ts +6 -8
  39. package/lib/inputs2/textareafield/index.d.ts +3 -4
  40. package/lib/inputs2/textareafield/index.js +154 -30
  41. package/lib/inputs2/textfield/index.d.ts +4 -5
  42. package/lib/inputs2/textfield/index.js +120 -30
  43. package/package.json +1 -1
  44. package/lib/index-053f615b.d.ts +0 -26
  45. package/lib/index-7159df18.d.ts +0 -21
  46. package/lib/inputs2/checkboxfield/base.d.ts +0 -29
  47. package/lib/inputs2/checkboxfield/base.js +0 -134
  48. package/lib/inputs2/date/datefield/base.d.ts +0 -13
  49. package/lib/inputs2/date/datefield/base.js +0 -330
  50. package/lib/inputs2/date/dateperiodfield/base.d.ts +0 -13
  51. package/lib/inputs2/date/dateperiodfield/base.js +0 -595
  52. package/lib/inputs2/radiofield/base.d.ts +0 -12
  53. package/lib/inputs2/radiofield/base.js +0 -156
  54. package/lib/inputs2/selectfield/base.d.ts +0 -11
  55. package/lib/inputs2/selectfield/base.js +0 -513
  56. package/lib/inputs2/textareafield/base.d.ts +0 -26
  57. package/lib/inputs2/textareafield/base.js +0 -166
  58. package/lib/inputs2/textfield/base.d.ts +0 -26
  59. package/lib/inputs2/textfield/base.js +0 -131
@@ -1,330 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.InputBase = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _lodash = _interopRequireDefault(require("lodash"));
9
- var _reactImask = require("react-imask");
10
- var _uuid = require("uuid");
11
- var _reactDom = require("react-dom");
12
- var _moment = _interopRequireDefault(require("moment"));
13
- var _hint = _interopRequireDefault(require("../../../hint"));
14
- var _tooltip = require("../../../tooltip");
15
- var _helpers = require("../../../form2/helpers");
16
- var _types = require("../types");
17
- var BaseDate = _interopRequireWildcard(require("../base"));
18
- var _helpers2 = require("../helpers");
19
- var _triggers = require("./triggers");
20
- var _calendarbox = require("./calendarbox");
21
- var _context = require("./context");
22
- const _excluded = ["label", "errors", "tooltip", "tooltipPosition", "tooltipWidth", "shouldCloseOnSelect", "returnValueType", "customClass", "customClassLabel", "customClassWrapper", "customClassInputContainer", "textAlign", "labelUppercase", "skeletonize", "hintPosition", "themePopover", "popoverAlign", "showCalendarButton", "openCalendarOnFocus", "undigitable", "showClearDateButton", "placeholder", "readOnly", "disabled"];
23
- /* eslint-disable @typescript-eslint/no-use-before-define */
24
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
25
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
26
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
27
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
28
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
29
- const InputBase = exports.InputBase = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
30
- var _props$hint;
31
- const {
32
- label,
33
- errors,
34
- tooltip,
35
- tooltipPosition,
36
- tooltipWidth,
37
- shouldCloseOnSelect = true,
38
- returnValueType = 'default',
39
- customClass = '',
40
- customClassLabel = '',
41
- customClassWrapper = '',
42
- customClassInputContainer = '',
43
- textAlign = 'left',
44
- labelUppercase = false,
45
- skeletonize = false,
46
- hintPosition = 'below',
47
- themePopover = 'light',
48
- popoverAlign = 'left',
49
- showCalendarButton = true,
50
- openCalendarOnFocus = true,
51
- undigitable = false,
52
- showClearDateButton = true,
53
- placeholder = _helpers2.TOKEN_PTBR_FORMAT,
54
- readOnly,
55
- disabled
56
- } = props,
57
- rest = _objectWithoutProperties(props, _excluded);
58
- const [calendarBoxOpen, setCalendarBoxOpen] = _react.default.useState(false);
59
- const [activeDescendant, setActiveDescendant] = _react.default.useState((0, _moment.default)().format(_helpers2.TOKEN_ISO_FORMAT));
60
- const [selectedDate, setSelectedDate] = _react.default.useState(null);
61
- const [calendarDisplayDate, setCalendarDisplayDate] = _react.default.useState(selectedDate !== null && selectedDate !== void 0 ? selectedDate : (0, _moment.default)());
62
- const calendarRef = _react.default.useRef(null);
63
- const inputRootRef = _react.default.useRef(null);
64
- const dateInputRef = _react.default.useRef(null);
65
- const dateContainerRef = _react.default.useRef(null);
66
- const {
67
- setValue: setMaskValue,
68
- unmaskedValue,
69
- value: maskedValue
70
- } = (0, _reactImask.useIMask)({
71
- mask: _helpers2.TOKEN_MASK,
72
- lazy: false,
73
- placeholderChar: '_'
74
- }, {
75
- ref: dateInputRef,
76
- defaultValue: selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.format(_helpers2.TOKEN_PTBR_FORMAT),
77
- onComplete: value => {
78
- const date = (0, _moment.default)(value, _helpers2.TOKEN_PTBR_FORMAT);
79
- if (date.isValid()) {
80
- handleUpdateDateState(date);
81
- }
82
- }
83
- });
84
- const inputId = _react.default.useMemo(() => props.id || props.name || (0, _uuid.v1)(), [props.id, props.name]);
85
- const hasLabel = !_lodash.default.isEmpty(props === null || props === void 0 ? void 0 : props.label);
86
- const hasHintMessages = Boolean((_props$hint = props.hint) === null || _props$hint === void 0 ? void 0 : _props$hint.length);
87
- const hasValidationErrors = Boolean(errors === null || errors === void 0 ? void 0 : errors.length);
88
- const hasValidDateSelected = !_lodash.default.isEmpty(props === null || props === void 0 ? void 0 : props.value);
89
- const handleUpdateDateState = _react.default.useCallback(date => {
90
- var _props$onChange;
91
- const nonIsoDateFormat = date.format(_helpers2.TOKEN_ISO_FORMAT);
92
- const isoDateFormat = date.toISOString();
93
- setSelectedDate(date.clone());
94
- setCalendarDisplayDate(date.clone());
95
- (_props$onChange = props.onChange) === null || _props$onChange === void 0 ? void 0 : _props$onChange.call(props, {
96
- target: {
97
- name: props.name,
98
- value: returnValueType === 'default' ? nonIsoDateFormat : isoDateFormat
99
- }
100
- });
101
- if (shouldCloseOnSelect) handleCloseCalendar();
102
- }, [selectedDate, props.name, props.onChange, shouldCloseOnSelect]);
103
- const handleOpenCalendar = _react.default.useCallback(() => setCalendarBoxOpen(true), []);
104
- const handleCloseCalendar = _react.default.useCallback(() => setCalendarBoxOpen(false), []);
105
- const handleNextMonth = _react.default.useCallback(() => setCalendarDisplayDate(prevDisplayDate => prevDisplayDate.clone().add(1, 'month')), []);
106
- const handlePreviousMonth = _react.default.useCallback(() => setCalendarDisplayDate(prevDisplayDate => prevDisplayDate.clone().subtract(1, 'month')), []);
107
- const handleChangeCalendarBoxState = _react.default.useCallback(() => {
108
- setCalendarBoxOpen(prevState => {
109
- if (dateInputRef.current !== document.activeElement) {
110
- var _dateInputRef$current, _dateInputRef$current2;
111
- dateInputRef === null || dateInputRef === void 0 ? void 0 : (_dateInputRef$current = dateInputRef.current) === null || _dateInputRef$current === void 0 ? void 0 : (_dateInputRef$current2 = _dateInputRef$current.focus) === null || _dateInputRef$current2 === void 0 ? void 0 : _dateInputRef$current2.call(_dateInputRef$current);
112
- }
113
- return !prevState;
114
- });
115
- }, []);
116
- const handleNavigateWithDays = _react.default.useCallback(offset => {
117
- setCalendarDisplayDate(prevDisplayDate => {
118
- const daySelected = prevDisplayDate.clone().add(offset, 'day');
119
- setActiveDescendant(daySelected.format(_helpers2.TOKEN_ISO_FORMAT));
120
- return daySelected;
121
- });
122
- }, []);
123
- const handleNavigateWithWeeks = _react.default.useCallback(when => {
124
- setCalendarDisplayDate(prevDisplayDate => {
125
- let daySelected = prevDisplayDate;
126
- if (when === 'end') daySelected = prevDisplayDate.clone().endOf('week');
127
- if (when === 'start') daySelected = prevDisplayDate.clone().startOf('week');
128
- setActiveDescendant(daySelected.format(_helpers2.TOKEN_ISO_FORMAT));
129
- return daySelected;
130
- });
131
- }, []);
132
- const handleOnClickClearSelectedDate = _react.default.useCallback(() => {
133
- var _props$onChange2;
134
- (_props$onChange2 = props.onChange) === null || _props$onChange2 === void 0 ? void 0 : _props$onChange2.call(props, {
135
- target: {
136
- name: props.name,
137
- value: ''
138
- }
139
- });
140
- setSelectedDate(null);
141
- setMaskValue('');
142
- handleCloseCalendar();
143
- }, [props.onChange]);
144
- const handleOnBlur = event => {
145
- var _props$onBlur;
146
- props === null || props === void 0 ? void 0 : (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, event);
147
- handleCloseCalendar();
148
- setActiveDescendant((selectedDate !== null && selectedDate !== void 0 ? selectedDate : (0, _moment.default)()).format(_helpers2.TOKEN_ISO_FORMAT));
149
- setCalendarDisplayDate(selectedDate !== null && selectedDate !== void 0 ? selectedDate : (0, _moment.default)());
150
- if (_lodash.default.size(unmaskedValue) !== 8) {
151
- const date = (0, _moment.default)(_lodash.default.toString(props === null || props === void 0 ? void 0 : props.value), _helpers2.TOKEN_ISO_FORMAT);
152
- if (date.isValid()) {
153
- setMaskValue(date.format('DD/MM/YYYY'));
154
- }
155
- }
156
- };
157
- const handleOnFocus = event => {
158
- var _props$onFocus;
159
- props === null || props === void 0 ? void 0 : (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 ? void 0 : _props$onFocus.call(props, event);
160
- setActiveDescendant((selectedDate !== null && selectedDate !== void 0 ? selectedDate : (0, _moment.default)()).format(_helpers2.TOKEN_ISO_FORMAT));
161
- setCalendarDisplayDate(selectedDate !== null && selectedDate !== void 0 ? selectedDate : (0, _moment.default)());
162
- if (!readOnly && openCalendarOnFocus) {
163
- handleOpenCalendar();
164
- }
165
- };
166
- const handleOnPaste = event => {
167
- if (undigitable) {
168
- event.preventDefault();
169
- } else {
170
- var _props$onPaste;
171
- (_props$onPaste = props.onPaste) === null || _props$onPaste === void 0 ? void 0 : _props$onPaste.call(props, event);
172
- }
173
- };
174
- const handleOnBeforeInput = event => {
175
- if (undigitable) {
176
- event.preventDefault();
177
- } else {
178
- var _props$onBeforeInput;
179
- (_props$onBeforeInput = props.onBeforeInput) === null || _props$onBeforeInput === void 0 ? void 0 : _props$onBeforeInput.call(props, event);
180
- }
181
- };
182
- const handleOnKeyDown = event => {
183
- var _props$onKeyDown;
184
- props === null || props === void 0 ? void 0 : (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 ? void 0 : _props$onKeyDown.call(props, event);
185
- if (calendarBoxOpen && event.key && !event.shiftKey && !event.altKey && _helpers2.NAVIGATION_KEYS.includes(event.key)) {
186
- event.preventDefault();
187
- switch (event.key) {
188
- case _types.Keys.arrowLeft:
189
- handleNavigateWithDays(-1);
190
- break;
191
- case _types.Keys.arrowRight:
192
- handleNavigateWithDays(1);
193
- break;
194
- case _types.Keys.arrowUp:
195
- handleNavigateWithDays(-7);
196
- break;
197
- case _types.Keys.arrowDown:
198
- handleNavigateWithDays(7);
199
- break;
200
- case _types.Keys.pageUp:
201
- handleNextMonth();
202
- break;
203
- case _types.Keys.pageDown:
204
- handlePreviousMonth();
205
- break;
206
- case _types.Keys.home:
207
- handleNavigateWithWeeks('start');
208
- break;
209
- case _types.Keys.end:
210
- handleNavigateWithWeeks('end');
211
- break;
212
- case _types.Keys.escape:
213
- handleCloseCalendar();
214
- break;
215
- case _types.Keys.enter:
216
- handleUpdateDateState((0, _moment.default)(_lodash.default.toString(activeDescendant), _helpers2.TOKEN_ISO_FORMAT));
217
- break;
218
- default:
219
- break;
220
- }
221
- }
222
- };
223
- _react.default.useEffect(() => {
224
- var _props$value;
225
- const currentValue = (_props$value = props === null || props === void 0 ? void 0 : props.value) !== null && _props$value !== void 0 ? _props$value : null;
226
- const date = (0, _moment.default)(_lodash.default.toString(currentValue), _helpers2.TOKEN_ISO_FORMAT);
227
- setSelectedDate(date.isValid() ? date : null);
228
- setMaskValue(date.format(_helpers2.TOKEN_PTBR_FORMAT));
229
- }, [props === null || props === void 0 ? void 0 : props.value]);
230
- const contextValues = _react.default.useMemo(() => ({
231
- label,
232
- inputFieldId: inputId,
233
- activeDescendant,
234
- calendarBoxOpen,
235
- isReadOnly: Boolean(readOnly),
236
- isDisabled: Boolean(disabled),
237
- skeletonize,
238
- showCalendarButton,
239
- hasValidDateSelected,
240
- dateInputRef,
241
- dateContainerRef,
242
- handleOpenCalendar,
243
- handleCloseCalendar,
244
- handleNextMonth,
245
- handlePreviousMonth,
246
- handleSelectDate: handleUpdateDateState,
247
- selectedDate,
248
- unmaskedValue,
249
- maskedValue,
250
- showClearDateButton,
251
- handleChangeCalendarBoxState,
252
- handleOnClickClearSelectedDate,
253
- calendarDisplayDate,
254
- calendarRef
255
- }), [label, activeDescendant, calendarBoxOpen, readOnly, disabled, skeletonize, showCalendarButton, selectedDate, calendarDisplayDate, hasValidDateSelected, unmaskedValue, maskedValue]);
256
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_context.DateFieldContext.Provider, {
257
- value: contextValues
258
- }, /*#__PURE__*/_react.default.createElement(BaseDate.Root, {
259
- ref: inputRootRef,
260
- "data-testid": "test-date-field-root",
261
- customClassWrapper: customClassWrapper,
262
- hasValidationErrors: hasValidationErrors
263
- }, hasLabel && /*#__PURE__*/_react.default.createElement(BaseDate.Label, {
264
- "data-testid": "test-date-field-label",
265
- label: label,
266
- inputId: inputId,
267
- hint: props === null || props === void 0 ? void 0 : props.hint,
268
- isDisabled: disabled,
269
- isReadOnly: readOnly,
270
- skeletonize: skeletonize,
271
- required: props === null || props === void 0 ? void 0 : props.required,
272
- hintPosition: hintPosition,
273
- themePopover: themePopover,
274
- popoverAlign: popoverAlign,
275
- labelUppercase: labelUppercase,
276
- hasHintMessages: hasHintMessages,
277
- customClassLabel: customClassLabel
278
- }), /*#__PURE__*/_react.default.createElement(BaseDate.Container, {
279
- ref: dateContainerRef,
280
- skeletonize: skeletonize,
281
- customClassInputContainer: customClassInputContainer
282
- }, /*#__PURE__*/_react.default.createElement(BaseDate.Input, _extends({}, rest, {
283
- ref: (0, _helpers.mergeRefs)(ref, dateInputRef),
284
- id: inputId,
285
- name: props === null || props === void 0 ? void 0 : props.name,
286
- value: maskedValue,
287
- readOnly: readOnly,
288
- disabled: disabled,
289
- customClass: customClass,
290
- tabIndex: !readOnly && !skeletonize ? 0 : -1,
291
- placeholder: placeholder,
292
- "aria-activedescendant": activeDescendant,
293
- "aria-expanded": calendarBoxOpen,
294
- "aria-controls": inputId,
295
- "aria-labelledby": inputId,
296
- "data-state-is-period-input": false,
297
- "data-testid": "test-date-field-input",
298
- "data-state-error": hasValidationErrors,
299
- "data-state-read-only": readOnly,
300
- "data-state-text-align": textAlign,
301
- "data-state-undigitable": undigitable,
302
- "data-state-skeletonize": skeletonize,
303
- onBlur: handleOnBlur,
304
- onFocus: handleOnFocus,
305
- onPaste: handleOnPaste,
306
- onKeyDown: handleOnKeyDown,
307
- onBeforeInput: handleOnBeforeInput
308
- })), /*#__PURE__*/_react.default.createElement(_triggers.Triggers, null)), calendarBoxOpen && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_calendarbox.CalendarBox, {
309
- ref: calendarRef
310
- }), document.body), hintPosition === 'below' && /*#__PURE__*/_react.default.createElement(_hint.default, {
311
- customClass: "hint",
312
- description: props.hint,
313
- disabled: disabled,
314
- skeletonize: skeletonize,
315
- visible: hasHintMessages
316
- }), hasValidationErrors && /*#__PURE__*/_react.default.createElement("span", {
317
- "data-testid": "test-date-field-list-errors",
318
- className: "error",
319
- "data-state-skeletonize": skeletonize,
320
- "aria-describedby": String(props.name).concat('-errors')
321
- }, errors === null || errors === void 0 ? void 0 : errors.map((error, index) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
322
- key: "".concat(index + 1, "-").concat(error)
323
- }, error, "\xA0"))))), /*#__PURE__*/_react.default.createElement(_tooltip.Tooltip, {
324
- targetRef: inputRootRef,
325
- text: tooltip,
326
- width: tooltipWidth,
327
- position: tooltipPosition
328
- }));
329
- });
330
- InputBase.displayName = 'DateFieldInputBase';
@@ -1,13 +0,0 @@
1
- import React__default from 'react';
2
- import { DatePeriodFieldBaseProps } from './types.js';
3
- import 'moment';
4
- import '../../../@types/Align.js';
5
- import '../../../@types/ColorStyles.js';
6
- import '../../../tooltip/types.js';
7
- import '../../../@types/Position.js';
8
- import '../../../@types/PermissionAttr.js';
9
- import '../types.js';
10
-
11
- declare const InputBase: React__default.ForwardRefExoticComponent<DatePeriodFieldBaseProps & React__default.RefAttributes<HTMLInputElement>>;
12
-
13
- export { InputBase };