@elliemae/ds-form 3.3.0-next.4 → 3.3.0-next.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.
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js +15 -29
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -65
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -19
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js +3 -15
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -20
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/cjs/DateInput/DSDateInput.js +14 -46
- package/dist/cjs/DateInput/DSDateInput.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputImpl.js +4 -17
- package/dist/cjs/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputs.js +9 -23
- package/dist/cjs/DateInput/components/DateInputs.js.map +1 -1
- package/dist/cjs/DateInputV2/components/DateInputs.js +9 -23
- package/dist/cjs/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js +3 -19
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js +4 -17
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/cjs/FormItem/DSFormItemLayout.js +56 -118
- package/dist/cjs/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/cjs/FormItem/ValidationFieldWrapper.js +3 -19
- package/dist/cjs/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/cjs/InputGroup/AddonWrapper.js +4 -17
- package/dist/cjs/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMask.js +19 -51
- package/dist/cjs/InputMask/DSInputMask.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js +11 -62
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/cjs/InputMask/MaskTypes.js +3 -17
- package/dist/cjs/InputMask/MaskTypes.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js +40 -103
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js +49 -121
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/index.js +79 -119
- package/dist/cjs/InputMask/mask_types/index.js.map +1 -1
- package/dist/cjs/InputProtected/DSInputProtected.js +14 -51
- package/dist/cjs/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/cjs/LargeInputText/DSLargeInputText.js +3 -19
- package/dist/cjs/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/cjs/Radio/DSRadio.js +24 -67
- package/dist/cjs/Radio/DSRadio.js.map +1 -1
- package/dist/cjs/RadioGroup/DSRadioGroup.js +15 -29
- package/dist/cjs/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/cjs/TimeInput/DSTimeInput.js +8 -40
- package/dist/cjs/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputImpl.js +4 -17
- package/dist/cjs/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputs.js +12 -25
- package/dist/cjs/TimeInput/TimeInputs.js.map +1 -1
- package/dist/cjs/Toggle/DSToggle.js +25 -66
- package/dist/cjs/Toggle/DSToggle.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleImpl.js +7 -22
- package/dist/cjs/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleRender.js +10 -24
- package/dist/cjs/Toggle/DSToggleRender.js.map +1 -1
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js +15 -31
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -67
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -21
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js +3 -17
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -22
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/esm/DateInput/DSDateInput.js +14 -48
- package/dist/esm/DateInput/DSDateInput.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputImpl.js +4 -19
- package/dist/esm/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputs.js +9 -25
- package/dist/esm/DateInput/components/DateInputs.js.map +1 -1
- package/dist/esm/DateInputV2/components/DateInputs.js +9 -25
- package/dist/esm/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js +3 -21
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js +4 -19
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/esm/FormItem/DSFormItemLayout.js +56 -120
- package/dist/esm/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/esm/FormItem/ValidationFieldWrapper.js +3 -21
- package/dist/esm/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/esm/InputGroup/AddonWrapper.js +4 -19
- package/dist/esm/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/esm/InputMask/DSInputMask.js +19 -53
- package/dist/esm/InputMask/DSInputMask.js.map +1 -1
- package/dist/esm/InputMask/DSInputMaskDeprecated.js +11 -64
- package/dist/esm/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/esm/InputMask/MaskTypes.js +3 -19
- package/dist/esm/InputMask/MaskTypes.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js +40 -105
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/NumberInputMask.js +49 -123
- package/dist/esm/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/SsnInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/index.js +79 -121
- package/dist/esm/InputMask/mask_types/index.js.map +1 -1
- package/dist/esm/InputProtected/DSInputProtected.js +14 -53
- package/dist/esm/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/esm/LargeInputText/DSLargeInputText.js +3 -21
- package/dist/esm/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/esm/Radio/DSRadio.js +24 -69
- package/dist/esm/Radio/DSRadio.js.map +1 -1
- package/dist/esm/RadioGroup/DSRadioGroup.js +15 -31
- package/dist/esm/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/esm/TimeInput/DSTimeInput.js +8 -42
- package/dist/esm/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputImpl.js +4 -19
- package/dist/esm/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputs.js +12 -27
- package/dist/esm/TimeInput/TimeInputs.js.map +1 -1
- package/dist/esm/Toggle/DSToggle.js +25 -68
- package/dist/esm/Toggle/DSToggle.js.map +1 -1
- package/dist/esm/Toggle/DSToggleImpl.js +7 -24
- package/dist/esm/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/esm/Toggle/DSToggleRender.js +10 -26
- package/dist/esm/Toggle/DSToggleRender.js.map +1 -1
- package/package.json +12 -12
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2 from "react";
|
|
35
4
|
import { aggregatedClasses } from "@elliemae/ds-classnames";
|
|
@@ -51,88 +20,51 @@ const Wrapper = aggregatedClasses("div")(blockName, null, ({ leftLabel, variant,
|
|
|
51
20
|
}));
|
|
52
21
|
const WrapperContent = aggregatedClasses("div")(`${blockName}-content`);
|
|
53
22
|
const WrapperContentGroup = aggregatedClasses("fieldset")(`${blockName}-content`);
|
|
54
|
-
const DSFormItemLayout = (
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
"leftLabel",
|
|
95
|
-
"floatingLabel",
|
|
96
|
-
"name",
|
|
97
|
-
"id",
|
|
98
|
-
"value",
|
|
99
|
-
"inputComponent",
|
|
100
|
-
"labelComponent",
|
|
101
|
-
"feedbackComponent",
|
|
102
|
-
"labelText",
|
|
103
|
-
"truncateText",
|
|
104
|
-
"hasError",
|
|
105
|
-
"validationState",
|
|
106
|
-
"validationMessage",
|
|
107
|
-
"feedbackMessage",
|
|
108
|
-
"readOnly",
|
|
109
|
-
"focused",
|
|
110
|
-
"type",
|
|
111
|
-
"autoFocus",
|
|
112
|
-
"disabled",
|
|
113
|
-
"onChange",
|
|
114
|
-
"onBlur",
|
|
115
|
-
"onFocus",
|
|
116
|
-
"onPaste",
|
|
117
|
-
"onKeyUp",
|
|
118
|
-
"extraInputProps",
|
|
119
|
-
"extraContent",
|
|
120
|
-
"leftAddon",
|
|
121
|
-
"rightAddon",
|
|
122
|
-
"required",
|
|
123
|
-
"optional",
|
|
124
|
-
"mask",
|
|
125
|
-
"useSubfix",
|
|
126
|
-
"suffix",
|
|
127
|
-
"variant",
|
|
128
|
-
"fitContent",
|
|
129
|
-
"withHighlight",
|
|
130
|
-
"containerProps"
|
|
131
|
-
]);
|
|
23
|
+
const DSFormItemLayout = ({
|
|
24
|
+
leftLabel,
|
|
25
|
+
floatingLabel,
|
|
26
|
+
name,
|
|
27
|
+
id,
|
|
28
|
+
value,
|
|
29
|
+
inputComponent: InputComponent,
|
|
30
|
+
labelComponent: LabelComponent,
|
|
31
|
+
feedbackComponent: FeedbackComponent,
|
|
32
|
+
labelText,
|
|
33
|
+
truncateText,
|
|
34
|
+
hasError,
|
|
35
|
+
validationState,
|
|
36
|
+
validationMessage,
|
|
37
|
+
feedbackMessage,
|
|
38
|
+
readOnly,
|
|
39
|
+
focused,
|
|
40
|
+
type,
|
|
41
|
+
autoFocus,
|
|
42
|
+
disabled,
|
|
43
|
+
onChange,
|
|
44
|
+
onBlur,
|
|
45
|
+
onFocus,
|
|
46
|
+
onPaste,
|
|
47
|
+
onKeyUp,
|
|
48
|
+
extraInputProps,
|
|
49
|
+
extraContent,
|
|
50
|
+
leftAddon,
|
|
51
|
+
rightAddon,
|
|
52
|
+
required,
|
|
53
|
+
optional,
|
|
54
|
+
mask,
|
|
55
|
+
useSubfix,
|
|
56
|
+
suffix,
|
|
57
|
+
variant,
|
|
58
|
+
fitContent,
|
|
59
|
+
withHighlight,
|
|
60
|
+
containerProps,
|
|
61
|
+
...rest
|
|
62
|
+
}) => {
|
|
132
63
|
const isGroup = InputComponent.type === (/* @__PURE__ */ React2.createElement(Group, null)).type;
|
|
133
64
|
const floatingLabelOverride = floatingLabel === "UNSAFE";
|
|
134
65
|
const WrapperContentComp = !isGroup ? WrapperContent : WrapperContentGroup;
|
|
135
|
-
const inputProps =
|
|
66
|
+
const inputProps = {
|
|
67
|
+
...extraInputProps,
|
|
136
68
|
disabled,
|
|
137
69
|
hasError: hasError || validationState === "error",
|
|
138
70
|
id,
|
|
@@ -149,14 +81,16 @@ const DSFormItemLayout = (_a) => {
|
|
|
149
81
|
mask,
|
|
150
82
|
useSubfix,
|
|
151
83
|
variant,
|
|
152
|
-
required
|
|
153
|
-
|
|
84
|
+
required,
|
|
85
|
+
...rest
|
|
86
|
+
};
|
|
154
87
|
const renderInput = (Input) => leftAddon || rightAddon ? /* @__PURE__ */ React2.createElement(DSInputGroup, {
|
|
155
88
|
leftAddon,
|
|
156
89
|
rightAddon,
|
|
157
90
|
variant
|
|
158
91
|
}, Input) : Input;
|
|
159
|
-
const renderFloating = /* @__PURE__ */ React2.createElement(DSFloatingLabelInput,
|
|
92
|
+
const renderFloating = /* @__PURE__ */ React2.createElement(DSFloatingLabelInput, {
|
|
93
|
+
...inputProps,
|
|
160
94
|
extraInputProps,
|
|
161
95
|
focused,
|
|
162
96
|
inputComponent: InputComponent,
|
|
@@ -165,7 +99,7 @@ const DSFormItemLayout = (_a) => {
|
|
|
165
99
|
optional,
|
|
166
100
|
required,
|
|
167
101
|
variant
|
|
168
|
-
})
|
|
102
|
+
});
|
|
169
103
|
const InputWithLabel = floatingLabelOverride ? renderInput(renderFloating) : /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(LabelComponent, {
|
|
170
104
|
htmlFor: id || name,
|
|
171
105
|
label: labelText,
|
|
@@ -175,7 +109,7 @@ const DSFormItemLayout = (_a) => {
|
|
|
175
109
|
truncateText
|
|
176
110
|
}), renderInput(getComponentFromProps(InputComponent, inputProps)));
|
|
177
111
|
if (suffix) {
|
|
178
|
-
return /* @__PURE__ */ React2.createElement(Wrapper,
|
|
112
|
+
return /* @__PURE__ */ React2.createElement(Wrapper, {
|
|
179
113
|
classProps: {
|
|
180
114
|
disabled,
|
|
181
115
|
readOnly,
|
|
@@ -184,8 +118,9 @@ const DSFormItemLayout = (_a) => {
|
|
|
184
118
|
variant,
|
|
185
119
|
fitContent,
|
|
186
120
|
withHighlight
|
|
187
|
-
}
|
|
188
|
-
|
|
121
|
+
},
|
|
122
|
+
...containerProps
|
|
123
|
+
}, /* @__PURE__ */ React2.createElement(SuffixWrapper, {
|
|
189
124
|
className: "suffix-wrapper"
|
|
190
125
|
}, /* @__PURE__ */ React2.createElement(SuffixInputWrapper, {
|
|
191
126
|
className: "suffix-input-wrapper"
|
|
@@ -198,7 +133,7 @@ const DSFormItemLayout = (_a) => {
|
|
|
198
133
|
withFeedback: Boolean(validationMessage || feedbackMessage)
|
|
199
134
|
}, suffix)));
|
|
200
135
|
}
|
|
201
|
-
return /* @__PURE__ */ React2.createElement(Wrapper,
|
|
136
|
+
return /* @__PURE__ */ React2.createElement(Wrapper, {
|
|
202
137
|
classProps: {
|
|
203
138
|
disabled,
|
|
204
139
|
readOnly,
|
|
@@ -207,8 +142,9 @@ const DSFormItemLayout = (_a) => {
|
|
|
207
142
|
variant,
|
|
208
143
|
fitContent,
|
|
209
144
|
withHighlight
|
|
210
|
-
}
|
|
211
|
-
|
|
145
|
+
},
|
|
146
|
+
...containerProps
|
|
147
|
+
}, /* @__PURE__ */ React2.createElement(WrapperContentComp, null, InputWithLabel, extraContent), /* @__PURE__ */ React2.createElement(FeedbackComponent, {
|
|
212
148
|
hasError,
|
|
213
149
|
text: validationState || hasError ? validationMessage : feedbackMessage
|
|
214
150
|
}));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/FormItem/DSFormItemLayout.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { describe, getComponentFromProps } from '@elliemae/ds-utilities';\nimport { Group } from '@elliemae/ds-shared';\nimport { DSInputGroup } from '../InputGroup';\nimport { DSFloatingLabelInput } from '../FloatingLabelInput';\nimport { DSError } from './Error/DSError';\nimport { props } from './props';\nimport { defaultProps } from './defaultProps';\nimport { FORMITEM_LAYOUT_VARIANTS } from './variants';\nimport { Suffix, SuffixInputWrapper, SuffixWrapper } from './Suffix/Suffix';\n// import { maskTypes } from '../InputMask/MaskTypes';\n\nexport { DSError, FORMITEM_LAYOUT_VARIANTS };\n\nconst blockName = 'form-item';\n\nconst Wrapper = aggregatedClasses('div')(blockName, null, ({ leftLabel, variant, fitContent, withHighlight }) => ({\n 'with-left-label': leftLabel,\n 'fit-content': fitContent,\n [variant]: variant,\n 'with-highlight': withHighlight,\n}));\n\nconst WrapperContent = aggregatedClasses('div')(`${blockName}-content`);\nconst WrapperContentGroup = aggregatedClasses('fieldset')(`${blockName}-content`);\n\nconst DSFormItemLayout = ({\n leftLabel,\n floatingLabel,\n name,\n id,\n value,\n inputComponent: InputComponent,\n labelComponent: LabelComponent,\n feedbackComponent: FeedbackComponent,\n labelText,\n truncateText,\n hasError,\n // orientation = 'vertical', // one of [ vertical, horizontal ]\n validationState, // one of [ success, error, warning ]\n validationMessage,\n feedbackMessage,\n readOnly,\n focused,\n type,\n autoFocus,\n disabled,\n onChange,\n onBlur,\n onFocus,\n onPaste,\n onKeyUp,\n extraInputProps,\n extraContent,\n leftAddon,\n rightAddon,\n required,\n optional,\n mask,\n useSubfix,\n suffix,\n variant,\n fitContent,\n withHighlight,\n containerProps,\n ...rest\n}) => {\n const isGroup = InputComponent.type === (<Group />).type;\n const floatingLabelOverride = floatingLabel === 'UNSAFE';\n const WrapperContentComp = !isGroup ? WrapperContent : WrapperContentGroup;\n\n // group the input props to not duplicate it inside the specific inputComponent (floating or not)\n const inputProps = {\n ...extraInputProps,\n disabled,\n hasError: hasError || validationState === 'error',\n id,\n name,\n type,\n autoFocus,\n onBlur,\n onChange,\n onFocus,\n onPaste,\n onKeyUp,\n readOnly,\n value,\n mask,\n useSubfix,\n variant,\n required,\n ...rest,\n };\n\n const renderInput = (Input) =>\n leftAddon || rightAddon ? (\n <DSInputGroup leftAddon={leftAddon} rightAddon={rightAddon} variant={variant}>\n {Input}\n </DSInputGroup>\n ) : (\n Input\n );\n\n const renderFloating = (\n <DSFloatingLabelInput\n {...inputProps}\n extraInputProps={extraInputProps}\n focused={focused}\n inputComponent={InputComponent}\n labelComponent={LabelComponent}\n labelText={labelText}\n optional={optional}\n required={required}\n variant={variant}\n />\n );\n\n const InputWithLabel = floatingLabelOverride ? (\n renderInput(renderFloating)\n ) : (\n <>\n <LabelComponent\n htmlFor={id || name}\n label={labelText}\n optional={optional}\n required={required}\n isGroup={isGroup}\n truncateText={truncateText}\n />\n {renderInput(getComponentFromProps(InputComponent, inputProps))}\n </>\n );\n\n if (suffix) {\n return (\n <Wrapper\n classProps={{\n disabled,\n readOnly,\n hasError,\n leftLabel,\n variant,\n fitContent,\n withHighlight,\n }}\n {...containerProps}\n >\n <SuffixWrapper className=\"suffix-wrapper\">\n <SuffixInputWrapper className=\"suffix-input-wrapper\">\n <WrapperContentComp>\n {InputWithLabel}\n {extraContent}\n </WrapperContentComp>\n <FeedbackComponent\n hasError={hasError}\n text={validationState || hasError ? validationMessage : feedbackMessage}\n />\n </SuffixInputWrapper>\n <Suffix\n className=\"suffix-label\"\n label={!!labelText}\n withFeedback={Boolean(validationMessage || feedbackMessage)}\n >\n {suffix}\n </Suffix>\n </SuffixWrapper>\n </Wrapper>\n );\n }\n\n return (\n <Wrapper\n classProps={{\n disabled,\n readOnly,\n hasError,\n leftLabel,\n variant,\n fitContent,\n withHighlight,\n }}\n {...containerProps}\n >\n <WrapperContentComp>\n {InputWithLabel}\n {extraContent}\n </WrapperContentComp>\n <FeedbackComponent hasError={hasError} text={validationState || hasError ? validationMessage : feedbackMessage} />\n </Wrapper>\n );\n};\n\nDSFormItemLayout.propTypes = props;\nDSFormItemLayout.defaultProps = defaultProps;\nDSFormItemLayout.displayName = 'DSFormItemLayout';\nconst DSFormItemLayoutWithSchema = describe(DSFormItemLayout);\nDSFormItemLayoutWithSchema.propTypes = props;\n\nexport default DSFormItemLayout;\nexport { DSFormItemLayoutWithSchema, DSFormItemLayout };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";AAAA;ACEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA,MAAM,YAAY;AAElB,MAAM,UAAU,kBAAkB,KAAK,EAAE,WAAW,MAAM,CAAC,EAAE,WAAW,SAAS,YAAY,oBAAqB;AAAA,EAChH,mBAAmB;AAAA,EACnB,eAAe;AAAA,EACf,CAAC,UAAU;AAAA,EACX,kBAAkB;AACpB,EAAE;AAEF,MAAM,iBAAiB,kBAAkB,KAAK,EAAE,GAAG,mBAAmB;AACtE,MAAM,sBAAsB,kBAAkB,UAAU,EAAE,GAAG,mBAAmB;AAEhF,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MACC;AACJ,QAAM,UAAU,eAAe,SAAU,sCAAC,WAAM,GAAI;AACpD,QAAM,wBAAwB,kBAAkB;AAChD,QAAM,qBAAqB,CAAC,UAAU,iBAAiB;AAGvD,QAAM,aAAa;AAAA,IACjB,GAAG;AAAA,IACH;AAAA,IACA,UAAU,YAAY,oBAAoB;AAAA,IAC1C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AAEA,QAAM,cAAc,CAAC,UACnB,aAAa,aACX,qCAAC;AAAA,IAAa;AAAA,IAAsB;AAAA,IAAwB;AAAA,KACzD,KACH,IAEA;AAGJ,QAAM,iBACJ,qCAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,GACF;AAGF,QAAM,iBAAiB,wBACrB,YAAY,cAAc,IAE1B,4DACE,qCAAC;AAAA,IACC,SAAS,MAAM;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,GACF,GACC,YAAY,sBAAsB,gBAAgB,UAAU,CAAC,CAChE;AAGF,MAAI,QAAQ;AACV,WACE,qCAAC;AAAA,MACC,YAAY;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,OAEJ,qCAAC;AAAA,MAAc,WAAU;AAAA,OACvB,qCAAC;AAAA,MAAmB,WAAU;AAAA,OAC5B,qCAAC,0BACE,gBACA,YACH,GACA,qCAAC;AAAA,MACC;AAAA,MACA,MAAM,mBAAmB,WAAW,oBAAoB;AAAA,KAC1D,CACF,GACA,qCAAC;AAAA,MACC,WAAU;AAAA,MACV,OAAO,CAAC,CAAC;AAAA,MACT,cAAc,QAAQ,qBAAqB,eAAe;AAAA,OAEzD,MACH,CACF,CACF;AAAA,EAEJ;AAEA,SACE,qCAAC;AAAA,IACC,YAAY;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,KAEJ,qCAAC,0BACE,gBACA,YACH,GACA,qCAAC;AAAA,IAAkB;AAAA,IAAoB,MAAM,mBAAmB,WAAW,oBAAoB;AAAA,GAAiB,CAClH;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc;AAC/B,MAAM,6BAA6B,SAAS,gBAAgB;AAC5D,2BAA2B,YAAY;AAEvC,IAAO,2BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,23 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
2
|
import * as React from "react";
|
|
22
3
|
import { Component } from "react";
|
|
23
4
|
class ValidationFieldWrapper extends Component {
|
|
@@ -61,9 +42,10 @@ class ValidationFieldWrapper extends Component {
|
|
|
61
42
|
const { value } = nextProps;
|
|
62
43
|
if (value === prevState.value)
|
|
63
44
|
return null;
|
|
64
|
-
return
|
|
45
|
+
return {
|
|
46
|
+
...prevState,
|
|
65
47
|
value
|
|
66
|
-
}
|
|
48
|
+
};
|
|
67
49
|
}
|
|
68
50
|
render() {
|
|
69
51
|
const { children } = this.props;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/FormItem/ValidationFieldWrapper.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Component } from 'react';\n\nexport default class ValidationFieldWrapper extends Component {\n static defaultProps = {\n validateOnBlur: false,\n validateOnChange: false,\n name: '', // name in context of the form\n value: '',\n validate: () => null,\n onChange: () => null,\n onBlur: () => null,\n };\n\n constructor(props) {\n super(props);\n this.state = {\n value: props.value,\n };\n }\n\n componentDidMount() {\n const { value } = this.state;\n this.executeValidations(value);\n }\n\n static getDerivedStateFromProps(nextProps, prevState) {\n const { value } = nextProps;\n if (value === prevState.value) return null;\n return {\n ...prevState,\n value,\n };\n }\n\n handleChange = (e) => {\n const { onChange } = this.props;\n this.setState({ value: e.target.value });\n if (onChange) onChange(e);\n }\n\n handleBlur = (e) => {\n const { onBlur, validateOnBlur } = this.props;\n const { value } = this.state;\n if (validateOnBlur) this.executeValidations(value);\n onBlur(e);\n }\n\n executeValidations = (value) => {\n const { validations } = this.props;\n if (validations && Array.isArray(validations)) {\n if (\n !validations.some(validation => {\n const { error, payload } = validation({ value });\n if (error)\n this.setState({ validationMessage: payload, state: error });\n return error;\n })\n ) {\n this.setState({ hasError: false });\n }\n }\n }\n\n render() {\n const { children } = this.props;\n const { value, validationMessage, validationState, hasError } = this.state;\n return children({\n value,\n validationMessage,\n validationState,\n hasError,\n onChange: this.handleChange,\n onBlur: this.handleBlur,\n });\n }\n}\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";AAAA;ACAA;AAEA,MAAO,+BAA6C,UAAU;AAAA,EAW5D,YAAY,OAAO;AACjB,UAAM,KAAK;AAoBb,wBAAe,CAAC,MAAM;AACpB,YAAM,EAAE,aAAa,KAAK;AAC1B,WAAK,SAAS,EAAE,OAAO,EAAE,OAAO,MAAM,CAAC;AACvC,UAAI;AAAU,iBAAS,CAAC;AAAA,IAC1B;AAEA,sBAAa,CAAC,MAAM;AAClB,YAAM,EAAE,QAAQ,mBAAmB,KAAK;AACxC,YAAM,EAAE,UAAU,KAAK;AACvB,UAAI;AAAgB,aAAK,mBAAmB,KAAK;AACjD,aAAO,CAAC;AAAA,IACV;AAEA,8BAAqB,CAAC,UAAU;AAC9B,YAAM,EAAE,gBAAgB,KAAK;AAC7B,UAAI,eAAe,MAAM,QAAQ,WAAW,GAAG;AAC7C,YACE,CAAC,YAAY,KAAK,gBAAc;AAC9B,gBAAM,EAAE,OAAO,YAAY,WAAW,EAAE,MAAM,CAAC;AAC/C,cAAI;AACF,iBAAK,SAAS,EAAE,mBAAmB,SAAS,OAAO,MAAM,CAAC;AAC5D,iBAAO;AAAA,QACT,CAAC,GACD;AACA,eAAK,SAAS,EAAE,UAAU,MAAM,CAAC;AAAA,QACnC;AAAA,MACF;AAAA,IACF;AA9CE,SAAK,QAAQ;AAAA,MACX,OAAO,MAAM;AAAA,IACf;AAAA,EACF;AAAA,EAEA,oBAAoB;AAClB,UAAM,EAAE,UAAU,KAAK;AACvB,SAAK,mBAAmB,KAAK;AAAA,EAC/B;AAAA,EAEA,OAAO,yBAAyB,WAAW,WAAW;AACpD,UAAM,EAAE,UAAU;AAClB,QAAI,UAAU,UAAU;AAAO,aAAO;AACtC,WAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAAA,EA+BA,SAAS;AACP,UAAM,EAAE,aAAa,KAAK;AAC1B,UAAM,EAAE,OAAO,mBAAmB,iBAAiB,aAAa,KAAK;AACrE,WAAO,SAAS;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU,KAAK;AAAA,MACf,QAAQ,KAAK;AAAA,IACf,CAAC;AAAA,EACH;AACF;AAxEE,AADmB,uBACZ,eAAe;AAAA,EACpB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU,MAAM;AAAA,EAChB,UAAU,MAAM;AAAA,EAChB,QAAQ,MAAM;AAChB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,20 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
6
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
7
|
-
var __spreadValues = (a, b) => {
|
|
8
|
-
for (var prop in b || (b = {}))
|
|
9
|
-
if (__hasOwnProp.call(b, prop))
|
|
10
|
-
__defNormalProp(a, prop, b[prop]);
|
|
11
|
-
if (__getOwnPropSymbols)
|
|
12
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
13
|
-
if (__propIsEnum.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
}
|
|
16
|
-
return a;
|
|
17
|
-
};
|
|
18
2
|
import * as React from "react";
|
|
19
3
|
import React2, { Component } from "react";
|
|
20
4
|
import { aggregatedClasses } from "@elliemae/ds-classnames";
|
|
@@ -35,9 +19,10 @@ class AddonWrapper extends Component {
|
|
|
35
19
|
containerProps
|
|
36
20
|
} = this.props;
|
|
37
21
|
const childType = inputComponent && inputComponent.type && inputComponent.type.name ? inputComponent.type.name.toLowerCase() : "default";
|
|
38
|
-
return /* @__PURE__ */ React2.createElement(Container,
|
|
39
|
-
className: `${className} ${blockName}--${childType}
|
|
40
|
-
|
|
22
|
+
return /* @__PURE__ */ React2.createElement(Container, {
|
|
23
|
+
className: `${className} ${blockName}--${childType}`,
|
|
24
|
+
...containerProps
|
|
25
|
+
}, leftAddon && /* @__PURE__ */ React2.createElement(InputAddon, null, leftAddon), inputComponent, rightAddon && /* @__PURE__ */ React2.createElement(InputAddon, null, rightAddon));
|
|
41
26
|
}
|
|
42
27
|
}
|
|
43
28
|
AddonWrapper.defaultProps = {};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputGroup/AddonWrapper.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { Component } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nconst blockName = 'input-addon-group';\n\nconst Container = aggregatedClasses('div')(blockName);\nconst InputAddon = aggregatedClasses('span')(blockName, 'addon');\n\nclass AddonWrapper extends Component {\n static defaultProps = {};\n\n state = {};\n\n render() {\n const {\n leftAddon,\n rightAddon,\n children: inputComponent,\n className,\n containerProps,\n } = this.props;\n const childType =\n inputComponent && inputComponent.type && inputComponent.type.name\n ? inputComponent.type.name.toLowerCase()\n : 'default';\n return (\n <Container\n className={`${className} ${blockName}--${childType}`}\n {...containerProps}\n >\n {leftAddon && <InputAddon>{leftAddon}</InputAddon>}\n {inputComponent}\n {rightAddon && <InputAddon>{rightAddon}</InputAddon>}\n </Container>\n );\n }\n}\n\nexport { AddonWrapper };\nexport default AddonWrapper;\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";AAAA;ACAA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,YAAY,kBAAkB,KAAK,EAAE,SAAS;AACpD,MAAM,aAAa,kBAAkB,MAAM,EAAE,WAAW,OAAO;AAE/D,MAAM,qBAAqB,UAAU;AAAA,EAArC;AAAA;AAGE,iBAAQ,CAAC;AAAA;AAAA,EAET,SAAS;AACP,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA;AAAA,QACE,KAAK;AACT,UAAM,YACJ,kBAAkB,eAAe,QAAQ,eAAe,KAAK,OACzD,eAAe,KAAK,KAAK,YAAY,IACrC;AACN,WACE,qCAAC;AAAA,MACC,WAAW,GAAG,aAAa,cAAc;AAAA,MACxC,GAAG;AAAA,OAEH,aAAa,qCAAC,kBAAY,SAAU,GACpC,gBACA,cAAc,qCAAC,kBAAY,UAAW,CACzC;AAAA,EAEJ;AACF;AA3BE,AADI,aACG,eAAe,CAAC;AA8BzB,IAAO,uBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2, { useCallback, useEffect, useState } from "react";
|
|
35
4
|
import { describe } from "@elliemae/ds-utilities";
|
|
@@ -52,22 +21,15 @@ const getValueFromEventOrString = (e) => {
|
|
|
52
21
|
}
|
|
53
22
|
return value;
|
|
54
23
|
};
|
|
55
|
-
const DSInputMask = (
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
"aria-label",
|
|
65
|
-
"autoFocus",
|
|
66
|
-
"innerRef",
|
|
67
|
-
"mask",
|
|
68
|
-
"pipe",
|
|
69
|
-
"value"
|
|
70
|
-
]);
|
|
24
|
+
const DSInputMask = ({
|
|
25
|
+
"aria-label": ariaLabel = "Input Mask",
|
|
26
|
+
autoFocus,
|
|
27
|
+
innerRef,
|
|
28
|
+
mask,
|
|
29
|
+
pipe,
|
|
30
|
+
value: valueOrEvent,
|
|
31
|
+
...rest
|
|
32
|
+
}) => {
|
|
71
33
|
const [rawValue, setRawValue] = useState(getValueFromEventOrString(valueOrEvent));
|
|
72
34
|
useEffect(() => {
|
|
73
35
|
setRawValue(getValueFromEventOrString(valueOrEvent));
|
|
@@ -83,7 +45,8 @@ const DSInputMask = (_a) => {
|
|
|
83
45
|
setRawMask(getRawMask(mask, newValue));
|
|
84
46
|
}, [mask]);
|
|
85
47
|
if (!pipe && isStringMask(rawMask)) {
|
|
86
|
-
return OutOfTheBoxMaskTypes[rawMask](
|
|
48
|
+
return OutOfTheBoxMaskTypes[rawMask]({
|
|
49
|
+
...rest,
|
|
87
50
|
"aria-label": ariaLabel,
|
|
88
51
|
innerRef,
|
|
89
52
|
value: rawValue,
|
|
@@ -95,10 +58,12 @@ const DSInputMask = (_a) => {
|
|
|
95
58
|
lastkey,
|
|
96
59
|
setLastkey,
|
|
97
60
|
setRawValue
|
|
98
|
-
})
|
|
61
|
+
});
|
|
99
62
|
}
|
|
100
63
|
if (!pipe && isObjectMask(rawMask)) {
|
|
101
|
-
return OutOfTheBoxMaskTypes[rawMask.type](
|
|
64
|
+
return OutOfTheBoxMaskTypes[rawMask.type]({
|
|
65
|
+
...rawMask,
|
|
66
|
+
...rest,
|
|
102
67
|
"aria-label": ariaLabel,
|
|
103
68
|
innerRef,
|
|
104
69
|
value: rawValue,
|
|
@@ -110,7 +75,7 @@ const DSInputMask = (_a) => {
|
|
|
110
75
|
lastkey,
|
|
111
76
|
setLastkey,
|
|
112
77
|
setRawValue
|
|
113
|
-
})
|
|
78
|
+
});
|
|
114
79
|
}
|
|
115
80
|
const getDeprecatedMask = () => {
|
|
116
81
|
if (mask === MASK_TYPES.DATE)
|
|
@@ -119,14 +84,15 @@ const DSInputMask = (_a) => {
|
|
|
119
84
|
return MASK_TYPES.DATE_TIME_DEPRECATED;
|
|
120
85
|
return mask;
|
|
121
86
|
};
|
|
122
|
-
return /* @__PURE__ */ React2.createElement(DSInputMaskDeprecated,
|
|
87
|
+
return /* @__PURE__ */ React2.createElement(DSInputMaskDeprecated, {
|
|
88
|
+
...rest,
|
|
123
89
|
"aria-label": ariaLabel,
|
|
124
90
|
autoFocus,
|
|
125
91
|
innerRef,
|
|
126
92
|
mask: getDeprecatedMask(),
|
|
127
93
|
pipe,
|
|
128
94
|
value: rawValue
|
|
129
|
-
})
|
|
95
|
+
});
|
|
130
96
|
};
|
|
131
97
|
DSInputMask.propTypes = inputProps;
|
|
132
98
|
DSInputMask.defaultProps = defaultProps;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputMask/DSInputMask.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { MASK_TYPES } from './MaskTypes';\nimport { MASK_PIPES } from './MaskPipes';\nimport { DSInputMaskDeprecated } from './DSInputMaskDeprecated';\nimport { inputProps } from './props';\nimport { defaultProps } from './defaultProps';\nimport { OutOfTheBoxMaskTypes } from './mask_types';\n\nconst isStringMask = (mask: any) => typeof mask === 'string';\n\nconst isObjectMask = (mask: any) => typeof mask === 'object' && mask.type;\n\nconst getRawMask = (mask: any, rawValue: string) =>\n typeof mask === 'function' ? mask(rawValue) : mask;\n\nconst getValueFromEventOrString = (e: any): string => {\n let value = e;\n if (e && e.target) {\n const {\n target: { value: eValue },\n } = e;\n value = eValue;\n }\n return value;\n};\n\nconst DSInputMask = ({\n 'aria-label': ariaLabel = 'Input Mask',\n autoFocus,\n innerRef,\n mask,\n pipe,\n value: valueOrEvent,\n ...rest\n}) => {\n const [rawValue, setRawValue] = useState(\n getValueFromEventOrString(valueOrEvent),\n );\n\n useEffect(() => {\n setRawValue(getValueFromEventOrString(valueOrEvent));\n }, [valueOrEvent]);\n\n const [rawMask, setRawMask] = useState<any>(getRawMask(mask, rawValue));\n\n const [focus, setFocus] = useState(autoFocus);\n\n const [lastkey, setLastkey] = useState<{ code: number; key: string }>({\n code: null,\n key: null,\n });\n\n const [cursorPosition, setCursorPosition] = useState({ current: 0 });\n\n const handleSetMask = useCallback(\n (newValue) => {\n setRawMask(getRawMask(mask, newValue));\n },\n [mask],\n );\n\n if (!pipe && isStringMask(rawMask)) {\n return OutOfTheBoxMaskTypes[rawMask]({\n ...rest,\n 'aria-label': ariaLabel,\n innerRef,\n value: rawValue,\n focus,\n setFocus,\n setRawMask: handleSetMask,\n cursorPosition,\n setCursorPosition,\n lastkey,\n setLastkey,\n setRawValue,\n });\n }\n\n if (!pipe && isObjectMask(rawMask)) {\n // we should change rawMask.type to rawMask.maskType\n // to avoid override standard props\n return OutOfTheBoxMaskTypes[rawMask.type]({\n ...rawMask,\n ...rest,\n 'aria-label': ariaLabel,\n innerRef,\n value: rawValue,\n focus,\n setFocus,\n setRawMask: handleSetMask,\n cursorPosition,\n setCursorPosition,\n lastkey,\n setLastkey,\n setRawValue,\n });\n }\n\n const getDeprecatedMask = () => {\n if (mask === MASK_TYPES.DATE) return MASK_TYPES.DATE_DEPRECATED;\n if (mask === MASK_TYPES.DATE_TIME) return MASK_TYPES.DATE_TIME_DEPRECATED;\n return mask;\n };\n return (\n <DSInputMaskDeprecated\n {...rest}\n aria-label={ariaLabel}\n autoFocus={autoFocus}\n innerRef={innerRef}\n mask={getDeprecatedMask()}\n pipe={pipe}\n value={rawValue}\n />\n );\n};\n\nDSInputMask.propTypes = inputProps;\nDSInputMask.defaultProps = defaultProps;\nDSInputMask.displayName = 'DSInputMask';\nconst DSInputMaskWithSchema = describe(DSInputMask).description(\n 'Masking input for custom formats',\n);\nDSInputMaskWithSchema.propTypes = inputProps;\n\nexport { MASK_TYPES, MASK_PIPES, DSInputMaskWithSchema, DSInputMask };\nexport default DSInputMask;\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,eAAe,CAAC,SAAc,OAAO,SAAS;AAEpD,MAAM,eAAe,CAAC,SAAc,OAAO,SAAS,YAAY,KAAK;AAErE,MAAM,aAAa,CAAC,MAAW,aAC7B,OAAO,SAAS,aAAa,KAAK,QAAQ,IAAI;AAEhD,MAAM,4BAA4B,CAAC,MAAmB;AACpD,MAAI,QAAQ;AACZ,MAAI,KAAK,EAAE,QAAQ;AACjB,UAAM;AAAA,MACJ,QAAQ,EAAE,OAAO;AAAA,QACf;AACJ,YAAQ;AAAA,EACV;AACA,SAAO;AACT;AAEA,MAAM,cAAc,CAAC;AAAA,EACnB,cAAc,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,KACJ;AAAA,MACC;AACJ,QAAM,CAAC,UAAU,eAAe,SAC9B,0BAA0B,YAAY,CACxC;AAEA,YAAU,MAAM;AACd,gBAAY,0BAA0B,YAAY,CAAC;AAAA,EACrD,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,CAAC,SAAS,cAAc,SAAc,WAAW,MAAM,QAAQ,CAAC;AAEtE,QAAM,CAAC,OAAO,YAAY,SAAS,SAAS;AAE5C,QAAM,CAAC,SAAS,cAAc,SAAwC;AAAA,IACpE,MAAM;AAAA,IACN,KAAK;AAAA,EACP,CAAC;AAED,QAAM,CAAC,gBAAgB,qBAAqB,SAAS,EAAE,SAAS,EAAE,CAAC;AAEnE,QAAM,gBAAgB,YACpB,CAAC,aAAa;AACZ,eAAW,WAAW,MAAM,QAAQ,CAAC;AAAA,EACvC,GACA,CAAC,IAAI,CACP;AAEA,MAAI,CAAC,QAAQ,aAAa,OAAO,GAAG;AAClC,WAAO,qBAAqB,SAAS;AAAA,MACnC,GAAG;AAAA,MACH,cAAc;AAAA,MACd;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,QAAQ,aAAa,OAAO,GAAG;AAGlC,WAAO,qBAAqB,QAAQ,MAAM;AAAA,MACxC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,cAAc;AAAA,MACd;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AAEA,QAAM,oBAAoB,MAAM;AAC9B,QAAI,SAAS,WAAW;AAAM,aAAO,WAAW;AAChD,QAAI,SAAS,WAAW;AAAW,aAAO,WAAW;AACrD,WAAO;AAAA,EACT;AACA,SACE,qCAAC;AAAA,IACE,GAAG;AAAA,IACJ,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,MAAM,kBAAkB;AAAA,IACxB;AAAA,IACA,OAAO;AAAA,GACT;AAEJ;AAEA,YAAY,YAAY;AACxB,YAAY,eAAe;AAC3B,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW,EAAE,YAClD,kCACF;AACA,sBAAsB,YAAY;AAGlC,IAAO,sBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2, { Component } from "react";
|
|
35
4
|
import { isEqual } from "lodash";
|
|
@@ -106,10 +75,11 @@ class DSInputMaskDeprecated extends Component {
|
|
|
106
75
|
}
|
|
107
76
|
const rawMaskWithTraps = getRawMask(mask, rawValue);
|
|
108
77
|
const rawMask = rawMaskWithTraps.filter((val) => val !== "[]");
|
|
109
|
-
const conformToMaskResults = conformToMask(rawValue, rawMask,
|
|
78
|
+
const conformToMaskResults = conformToMask(rawValue, rawMask, {
|
|
110
79
|
guide: false,
|
|
111
|
-
placeholderChar
|
|
112
|
-
|
|
80
|
+
placeholderChar,
|
|
81
|
+
...previousConformedValue && { previousConformedValue }
|
|
82
|
+
});
|
|
113
83
|
const { conformedValue: pipelessConformed } = conformToMaskResults;
|
|
114
84
|
let conformedValueEnsureLastMaskChar = pipelessConformed;
|
|
115
85
|
const lastMaskChar = rawMask[rawMask.length - 1];
|
|
@@ -218,7 +188,7 @@ class DSInputMaskDeprecated extends Component {
|
|
|
218
188
|
}
|
|
219
189
|
}
|
|
220
190
|
render() {
|
|
221
|
-
const
|
|
191
|
+
const {
|
|
222
192
|
autoFocus,
|
|
223
193
|
style,
|
|
224
194
|
disabled,
|
|
@@ -242,37 +212,14 @@ class DSInputMaskDeprecated extends Component {
|
|
|
242
212
|
clearable = false,
|
|
243
213
|
leftComponent,
|
|
244
214
|
rightComponent,
|
|
245
|
-
value
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
"style",
|
|
249
|
-
"disabled",
|
|
250
|
-
"className",
|
|
251
|
-
"name",
|
|
252
|
-
"maxLength",
|
|
253
|
-
"minLength",
|
|
254
|
-
"fluidWidth",
|
|
255
|
-
"placeholder",
|
|
256
|
-
"onKeyDown",
|
|
257
|
-
"onClick",
|
|
258
|
-
"onChange",
|
|
259
|
-
"onFocus",
|
|
260
|
-
"onBlur",
|
|
261
|
-
"onPaste",
|
|
262
|
-
"onKeyUp",
|
|
263
|
-
"hasError",
|
|
264
|
-
"readOnly",
|
|
265
|
-
"type",
|
|
266
|
-
"innerRef",
|
|
267
|
-
"clearable",
|
|
268
|
-
"leftComponent",
|
|
269
|
-
"rightComponent",
|
|
270
|
-
"value"
|
|
271
|
-
]);
|
|
215
|
+
value,
|
|
216
|
+
...rest
|
|
217
|
+
} = this.props;
|
|
272
218
|
const { maskedValue, focus } = this.state;
|
|
273
219
|
const propsValue = getValueFromEventOrString(value);
|
|
274
220
|
const finalValue = typeof propsValue === "string" || typeof propsValue === "number" ? propsValue : maskedValue;
|
|
275
|
-
return /* @__PURE__ */ React2.createElement(DSTextBox,
|
|
221
|
+
return /* @__PURE__ */ React2.createElement(DSTextBox, {
|
|
222
|
+
...rest,
|
|
276
223
|
"aria-label": rest["aria-label"],
|
|
277
224
|
className,
|
|
278
225
|
clearable,
|
|
@@ -297,7 +244,7 @@ class DSInputMaskDeprecated extends Component {
|
|
|
297
244
|
style,
|
|
298
245
|
type,
|
|
299
246
|
value: finalValue
|
|
300
|
-
})
|
|
247
|
+
});
|
|
301
248
|
}
|
|
302
249
|
}
|
|
303
250
|
DSInputMaskDeprecated.propTypes = {
|