@trackunit/custom-field-components 0.0.899 → 0.0.901

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/index.cjs.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var jsxRuntime = require('react/jsx-runtime');
6
4
  var i18nLibraryTranslation = require('@trackunit/i18n-library-translation');
7
5
  var irisAppRuntimeCore = require('@trackunit/iris-app-runtime-core');
@@ -11,8 +9,7 @@ var React = require('react');
11
9
  var reactHookForm = require('react-hook-form');
12
10
  var uuid = require('uuid');
13
11
 
14
- function _interopNamespace(e) {
15
- if (e && e.__esModule) return e;
12
+ function _interopNamespaceDefault(e) {
16
13
  var n = Object.create(null);
17
14
  if (e) {
18
15
  Object.keys(e).forEach(function (k) {
@@ -25,11 +22,11 @@ function _interopNamespace(e) {
25
22
  }
26
23
  });
27
24
  }
28
- n["default"] = e;
25
+ n.default = e;
29
26
  return Object.freeze(n);
30
27
  }
31
28
 
32
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
29
+ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
33
30
 
34
31
  var defaultTranslations = {
35
32
  "customfield.unit.ACRE": "acre",
@@ -139,46 +136,13 @@ const setupLibraryTranslations = () => {
139
136
  i18nLibraryTranslation.registerTranslations(translations);
140
137
  };
141
138
 
142
- /******************************************************************************
143
- Copyright (c) Microsoft Corporation.
144
-
145
- Permission to use, copy, modify, and/or distribute this software for any
146
- purpose with or without fee is hereby granted.
147
-
148
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
149
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
150
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
151
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
152
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
153
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
154
- PERFORMANCE OF THIS SOFTWARE.
155
- ***************************************************************************** */
156
-
157
- function __rest(s, e) {
158
- var t = {};
159
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
160
- t[p] = s[p];
161
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
162
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
163
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
164
- t[p[i]] = s[p[i]];
165
- }
166
- return t;
167
- }
168
-
169
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
170
- var e = new Error(message);
171
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
172
- };
173
-
174
139
  /**
175
140
  * A component that can be used to render a boolean field
176
141
  *
177
142
  * @param options BooleanCustomFieldProps - options for the component
178
143
  * @returns { JSX.Element } JSX.Element - a component that can be used to render a boolean field
179
144
  */
180
- const BooleanCustomField = (_a) => {
181
- var { defaultValue, dataTestId = "booleanField", onChange, value, id, setValue, register, validationRules, disabled = false, label, tip, isInvalid, errorMessage, helpAddon, maxLength, helpText } = _a, rest = __rest(_a, ["defaultValue", "dataTestId", "onChange", "value", "id", "setValue", "register", "validationRules", "disabled", "label", "tip", "isInvalid", "errorMessage", "helpAddon", "maxLength", "helpText"]);
145
+ const BooleanCustomField = ({ defaultValue, dataTestId = "booleanField", onChange, value, id, setValue, register, validationRules, disabled = false, label, tip, isInvalid, errorMessage, helpAddon, maxLength, helpText, ...rest }) => {
182
146
  const initialValue = value !== undefined ? value : defaultValue ? defaultValue : false;
183
147
  const renderAsInvalid = isInvalid || Boolean(errorMessage);
184
148
  const htmlForId = id ? id : "boolean-custom-field-" + uuid.v4();
@@ -195,10 +159,10 @@ const BooleanCustomField = (_a) => {
195
159
  setInternalValue(isChecked);
196
160
  }, [setInternalValue, onChange, id, setValue]);
197
161
  React__namespace.useEffect(() => {
198
- register && register(id, Object.assign(Object.assign({}, validationRules), { value: internalValue.toString() }));
162
+ register && register(id, { ...validationRules, value: internalValue.toString() });
199
163
  // eslint-disable-next-line react-hooks/exhaustive-deps
200
164
  }, []); // register only once
201
- return (jsxRuntime.jsx(reactFormComponents.FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsxRuntime.jsx(reactFormComponents.Checkbox, Object.assign({ checked: internalValue, dataTestId: dataTestId, disabled: disabled, id: htmlForId, isInvalid: renderAsInvalid, name: id, onChange: event => (!rest.readOnly ? onChangeHandler(event) : null) }, rest)) }));
165
+ return (jsxRuntime.jsx(reactFormComponents.FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsxRuntime.jsx(reactFormComponents.Checkbox, { checked: internalValue, dataTestId: dataTestId, disabled: disabled, id: htmlForId, isInvalid: renderAsInvalid, name: id, onChange: event => (!rest.readOnly ? onChangeHandler(event) : null), ...rest }) }));
202
166
  };
203
167
 
204
168
  /**
@@ -208,7 +172,7 @@ const BooleanCustomField = (_a) => {
208
172
  * @returns { JSX.Element } JSX.Element - a component that can be used to render a date field
209
173
  */
210
174
  const DateCustomField = (props) => {
211
- const { setValue, defaultValue, register, id, validationRules } = props, rest = __rest(props, ["setValue", "defaultValue", "register", "id", "validationRules"]);
175
+ const { setValue, defaultValue, register, id, validationRules, ...rest } = props;
212
176
  const onChangeHandler = React.useCallback((e) => {
213
177
  var _a;
214
178
  setValue &&
@@ -219,9 +183,9 @@ const DateCustomField = (props) => {
219
183
  }, [setValue, id]);
220
184
  React.useEffect(() => {
221
185
  const value = defaultValue && new Date(defaultValue);
222
- register && register(id, Object.assign(Object.assign({}, validationRules), { value }));
186
+ register && register(id, { ...validationRules, value });
223
187
  }, [register, validationRules, defaultValue, id]);
224
- return (React.createElement(reactFormComponents.DateField, Object.assign({}, rest, { defaultValue: defaultValue, helpAddon: props.helpAddon || null, helpText: props.errorMessage || props.helpText, id: id, key: id, label: props.title, onChange: onChangeHandler })));
188
+ return (React.createElement(reactFormComponents.DateField, { ...rest, defaultValue: defaultValue, helpAddon: props.helpAddon || null, helpText: props.errorMessage || props.helpText, id: id, key: id, label: props.title, onChange: onChangeHandler }));
225
189
  };
226
190
 
227
191
  const convertToValueFormat = (value) => {
@@ -259,7 +223,7 @@ const DropdownCustomField = ({ defaultValue, dataTestId, onChange, onBlur, id, d
259
223
  return allValues ? allValues.map(convertToValueFormat) : [];
260
224
  }, [allValues]);
261
225
  React__namespace.useEffect(() => {
262
- register && register(id, Object.assign(Object.assign({}, validationRules), { value: selectedValue }));
226
+ register && register(id, { ...validationRules, value: selectedValue });
263
227
  }, [register, validationRules, selectedValue, id]);
264
228
  return (jsxRuntime.jsx(reactFormComponents.FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsxRuntime.jsx(reactFormComponents.Select, { "aria-labelledby": htmlForId + "-label", dataTestId: dataTestId, disabled: disabled, hasError: renderAsInvalid, inputId: htmlForId, isClearable: true, isMulti: multiSelect, onChange: onChangeHandler, options: options, value: selectedValue }) }));
265
229
  };
@@ -279,7 +243,11 @@ const getWebAddressValidationRules = (definition) => {
279
243
  },
280
244
  };
281
245
  return definition.uiEditable
282
- ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
246
+ ? {
247
+ ...pattern,
248
+ ...defaultRules,
249
+ }
250
+ : defaultRules;
283
251
  };
284
252
  /**
285
253
  * Generates validation rules for a number field.
@@ -303,7 +271,12 @@ const getNumberValidationRules = (definition) => {
303
271
  };
304
272
  // TODO: Validate if integer if definition requires integer
305
273
  return definition.uiEditable
306
- ? Object.assign(Object.assign(Object.assign({}, maximum), minimum), defaultRules) : defaultRules;
274
+ ? {
275
+ ...maximum,
276
+ ...minimum,
277
+ ...defaultRules,
278
+ }
279
+ : defaultRules;
307
280
  };
308
281
  /**
309
282
  * Generates validation rules for a string field.
@@ -342,7 +315,13 @@ const getStringValidationRules = (definition) => {
342
315
  }
343
316
  : undefined;
344
317
  return definition.uiEditable
345
- ? Object.assign(Object.assign(Object.assign(Object.assign({}, maxLength), minLength), pattern), defaultRules) : defaultRules;
318
+ ? {
319
+ ...maxLength,
320
+ ...minLength,
321
+ ...pattern,
322
+ ...defaultRules,
323
+ }
324
+ : defaultRules;
346
325
  };
347
326
  /**
348
327
  * Generates validation rules by default for any type of field
@@ -396,7 +375,11 @@ const getEmailValidationRules = (definition) => {
396
375
  },
397
376
  };
398
377
  return definition.uiEditable
399
- ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
378
+ ? {
379
+ ...pattern,
380
+ ...defaultRules,
381
+ }
382
+ : defaultRules;
400
383
  };
401
384
 
402
385
  /**
@@ -453,19 +436,30 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
453
436
  switch (def.__typename) {
454
437
  case "WebAddressFieldDefinition": {
455
438
  const rules = getWebAddressValidationRules(def);
456
- return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ actions: !isEditableCombined && formValue ? jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "WEB_ADDRESS", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
439
+ return (jsxRuntime.jsx(reactFormComponents.TextField, { actions: !isEditableCombined && formValue ? jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "WEB_ADDRESS", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
440
+ ...rules,
441
+ value,
442
+ }) }));
457
443
  }
458
444
  case "EmailFieldDefinition": {
459
445
  const rules = getEmailValidationRules(def);
460
- return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ actions: !isEditableCombined && formValue ? jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "EMAIL", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
446
+ return (jsxRuntime.jsx(reactFormComponents.TextField, { actions: !isEditableCombined && formValue ? jsxRuntime.jsx(reactFormComponents.ActionButton, { type: "EMAIL", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
447
+ ...rules,
448
+ value,
449
+ }) }));
461
450
  }
462
451
  case "PhoneNumberFieldDefinition": {
463
452
  const rules = getPhoneNumberValidationRules(!def.uiEditable);
464
- return (jsxRuntime.jsx(reactFormComponents.PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value }, validation.register(uniqueIdentifier, Object.assign({}, rules)))));
453
+ return (jsxRuntime.jsx(reactFormComponents.PhoneField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value, ...validation.register(uniqueIdentifier, {
454
+ ...rules,
455
+ }) }));
465
456
  }
466
457
  case "StringFieldDefinition": {
467
458
  const rules = getStringValidationRules(def);
468
- return (jsxRuntime.jsx(reactFormComponents.TextField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
459
+ return (jsxRuntime.jsx(reactFormComponents.TextField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
460
+ ...rules,
461
+ value,
462
+ }) }));
469
463
  }
470
464
  case "NumberFieldDefinition": {
471
465
  const rules = getNumberValidationRules(def);
@@ -474,7 +468,10 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
474
468
  placeholder: title !== null && title !== void 0 ? title : "",
475
469
  addonAfter: unitTranslation(unit),
476
470
  };
477
- return (jsxRuntime.jsx(reactFormComponents.NumberField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_e = def.maximumNumber) !== null && _e !== void 0 ? _e : undefined, min: (_f = def.minimumNumber) !== null && _f !== void 0 ? _f : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })), numberProps)));
471
+ return (jsxRuntime.jsx(reactFormComponents.NumberField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_e = def.maximumNumber) !== null && _e !== void 0 ? _e : undefined, min: (_f = def.minimumNumber) !== null && _f !== void 0 ? _f : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any", ...validation.register(uniqueIdentifier, {
472
+ ...rules,
473
+ value,
474
+ }), ...numberProps }));
478
475
  }
479
476
  case "BooleanFieldDefinition": {
480
477
  const rules = getBooleanValidationRules();
@@ -497,10 +494,10 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
497
494
  placeholder: title !== null && title !== void 0 ? title : "",
498
495
  addonAfter: def.currency,
499
496
  };
500
- return (jsxRuntime.jsx(reactFormComponents.NumberField, Object.assign({ dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_j = def.maximumNumber) !== null && _j !== void 0 ? _j : undefined, min: (_k = def.minimumNumber) !== null && _k !== void 0 ? _k : undefined, readOnly: !isEditableCombined, step: "any" }, validation.register(uniqueIdentifier, rules), { onChange: e => {
497
+ return (jsxRuntime.jsx(reactFormComponents.NumberField, { dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_j = def.maximumNumber) !== null && _j !== void 0 ? _j : undefined, min: (_k = def.minimumNumber) !== null && _k !== void 0 ? _k : undefined, readOnly: !isEditableCombined, step: "any", ...validation.register(uniqueIdentifier, rules), onChange: e => {
501
498
  setNumberValue(e.target.value === "" ? null : e.target.value);
502
499
  validation.register(uniqueIdentifier, rules).onChange(e);
503
- } }, numberProps)));
500
+ }, ...numberProps }));
504
501
  }
505
502
  default:
506
503
  return sharedUtils.exhaustiveCheck(def);
package/index.esm.js CHANGED
@@ -116,46 +116,13 @@ const setupLibraryTranslations = () => {
116
116
  registerTranslations(translations);
117
117
  };
118
118
 
119
- /******************************************************************************
120
- Copyright (c) Microsoft Corporation.
121
-
122
- Permission to use, copy, modify, and/or distribute this software for any
123
- purpose with or without fee is hereby granted.
124
-
125
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
126
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
127
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
128
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
129
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
130
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
131
- PERFORMANCE OF THIS SOFTWARE.
132
- ***************************************************************************** */
133
-
134
- function __rest(s, e) {
135
- var t = {};
136
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
137
- t[p] = s[p];
138
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
139
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
140
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
141
- t[p[i]] = s[p[i]];
142
- }
143
- return t;
144
- }
145
-
146
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
147
- var e = new Error(message);
148
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
149
- };
150
-
151
119
  /**
152
120
  * A component that can be used to render a boolean field
153
121
  *
154
122
  * @param options BooleanCustomFieldProps - options for the component
155
123
  * @returns { JSX.Element } JSX.Element - a component that can be used to render a boolean field
156
124
  */
157
- const BooleanCustomField = (_a) => {
158
- var { defaultValue, dataTestId = "booleanField", onChange, value, id, setValue, register, validationRules, disabled = false, label, tip, isInvalid, errorMessage, helpAddon, maxLength, helpText } = _a, rest = __rest(_a, ["defaultValue", "dataTestId", "onChange", "value", "id", "setValue", "register", "validationRules", "disabled", "label", "tip", "isInvalid", "errorMessage", "helpAddon", "maxLength", "helpText"]);
125
+ const BooleanCustomField = ({ defaultValue, dataTestId = "booleanField", onChange, value, id, setValue, register, validationRules, disabled = false, label, tip, isInvalid, errorMessage, helpAddon, maxLength, helpText, ...rest }) => {
159
126
  const initialValue = value !== undefined ? value : defaultValue ? defaultValue : false;
160
127
  const renderAsInvalid = isInvalid || Boolean(errorMessage);
161
128
  const htmlForId = id ? id : "boolean-custom-field-" + v4();
@@ -172,10 +139,10 @@ const BooleanCustomField = (_a) => {
172
139
  setInternalValue(isChecked);
173
140
  }, [setInternalValue, onChange, id, setValue]);
174
141
  React.useEffect(() => {
175
- register && register(id, Object.assign(Object.assign({}, validationRules), { value: internalValue.toString() }));
142
+ register && register(id, { ...validationRules, value: internalValue.toString() });
176
143
  // eslint-disable-next-line react-hooks/exhaustive-deps
177
144
  }, []); // register only once
178
- return (jsx(FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsx(Checkbox, Object.assign({ checked: internalValue, dataTestId: dataTestId, disabled: disabled, id: htmlForId, isInvalid: renderAsInvalid, name: id, onChange: event => (!rest.readOnly ? onChangeHandler(event) : null) }, rest)) }));
145
+ return (jsx(FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsx(Checkbox, { checked: internalValue, dataTestId: dataTestId, disabled: disabled, id: htmlForId, isInvalid: renderAsInvalid, name: id, onChange: event => (!rest.readOnly ? onChangeHandler(event) : null), ...rest }) }));
179
146
  };
180
147
 
181
148
  /**
@@ -185,7 +152,7 @@ const BooleanCustomField = (_a) => {
185
152
  * @returns { JSX.Element } JSX.Element - a component that can be used to render a date field
186
153
  */
187
154
  const DateCustomField = (props) => {
188
- const { setValue, defaultValue, register, id, validationRules } = props, rest = __rest(props, ["setValue", "defaultValue", "register", "id", "validationRules"]);
155
+ const { setValue, defaultValue, register, id, validationRules, ...rest } = props;
189
156
  const onChangeHandler = useCallback((e) => {
190
157
  var _a;
191
158
  setValue &&
@@ -196,9 +163,9 @@ const DateCustomField = (props) => {
196
163
  }, [setValue, id]);
197
164
  useEffect(() => {
198
165
  const value = defaultValue && new Date(defaultValue);
199
- register && register(id, Object.assign(Object.assign({}, validationRules), { value }));
166
+ register && register(id, { ...validationRules, value });
200
167
  }, [register, validationRules, defaultValue, id]);
201
- return (createElement(DateField, Object.assign({}, rest, { defaultValue: defaultValue, helpAddon: props.helpAddon || null, helpText: props.errorMessage || props.helpText, id: id, key: id, label: props.title, onChange: onChangeHandler })));
168
+ return (createElement(DateField, { ...rest, defaultValue: defaultValue, helpAddon: props.helpAddon || null, helpText: props.errorMessage || props.helpText, id: id, key: id, label: props.title, onChange: onChangeHandler }));
202
169
  };
203
170
 
204
171
  const convertToValueFormat = (value) => {
@@ -236,7 +203,7 @@ const DropdownCustomField = ({ defaultValue, dataTestId, onChange, onBlur, id, d
236
203
  return allValues ? allValues.map(convertToValueFormat) : [];
237
204
  }, [allValues]);
238
205
  React.useEffect(() => {
239
- register && register(id, Object.assign(Object.assign({}, validationRules), { value: selectedValue }));
206
+ register && register(id, { ...validationRules, value: selectedValue });
240
207
  }, [register, validationRules, selectedValue, id]);
241
208
  return (jsx(FormGroup, { dataTestId: dataTestId ? `${dataTestId}-FormGroup` : undefined, helpAddon: helpAddon || null, helpText: errorMessage || helpText, htmlFor: htmlForId, isInvalid: renderAsInvalid, label: label, tip: tip, children: jsx(Select, { "aria-labelledby": htmlForId + "-label", dataTestId: dataTestId, disabled: disabled, hasError: renderAsInvalid, inputId: htmlForId, isClearable: true, isMulti: multiSelect, onChange: onChangeHandler, options: options, value: selectedValue }) }));
242
209
  };
@@ -256,7 +223,11 @@ const getWebAddressValidationRules = (definition) => {
256
223
  },
257
224
  };
258
225
  return definition.uiEditable
259
- ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
226
+ ? {
227
+ ...pattern,
228
+ ...defaultRules,
229
+ }
230
+ : defaultRules;
260
231
  };
261
232
  /**
262
233
  * Generates validation rules for a number field.
@@ -280,7 +251,12 @@ const getNumberValidationRules = (definition) => {
280
251
  };
281
252
  // TODO: Validate if integer if definition requires integer
282
253
  return definition.uiEditable
283
- ? Object.assign(Object.assign(Object.assign({}, maximum), minimum), defaultRules) : defaultRules;
254
+ ? {
255
+ ...maximum,
256
+ ...minimum,
257
+ ...defaultRules,
258
+ }
259
+ : defaultRules;
284
260
  };
285
261
  /**
286
262
  * Generates validation rules for a string field.
@@ -319,7 +295,13 @@ const getStringValidationRules = (definition) => {
319
295
  }
320
296
  : undefined;
321
297
  return definition.uiEditable
322
- ? Object.assign(Object.assign(Object.assign(Object.assign({}, maxLength), minLength), pattern), defaultRules) : defaultRules;
298
+ ? {
299
+ ...maxLength,
300
+ ...minLength,
301
+ ...pattern,
302
+ ...defaultRules,
303
+ }
304
+ : defaultRules;
323
305
  };
324
306
  /**
325
307
  * Generates validation rules by default for any type of field
@@ -373,7 +355,11 @@ const getEmailValidationRules = (definition) => {
373
355
  },
374
356
  };
375
357
  return definition.uiEditable
376
- ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
358
+ ? {
359
+ ...pattern,
360
+ ...defaultRules,
361
+ }
362
+ : defaultRules;
377
363
  };
378
364
 
379
365
  /**
@@ -430,19 +416,30 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
430
416
  switch (def.__typename) {
431
417
  case "WebAddressFieldDefinition": {
432
418
  const rules = getWebAddressValidationRules(def);
433
- return (jsx(TextField, Object.assign({ actions: !isEditableCombined && formValue ? jsx(ActionButton, { type: "WEB_ADDRESS", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
419
+ return (jsx(TextField, { actions: !isEditableCombined && formValue ? jsx(ActionButton, { type: "WEB_ADDRESS", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
420
+ ...rules,
421
+ value,
422
+ }) }));
434
423
  }
435
424
  case "EmailFieldDefinition": {
436
425
  const rules = getEmailValidationRules(def);
437
- return (jsx(TextField, Object.assign({ actions: !isEditableCombined && formValue ? jsx(ActionButton, { type: "EMAIL", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
426
+ return (jsx(TextField, { actions: !isEditableCombined && formValue ? jsx(ActionButton, { type: "EMAIL", value: formValue }) : null, dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
427
+ ...rules,
428
+ value,
429
+ }) }));
438
430
  }
439
431
  case "PhoneNumberFieldDefinition": {
440
432
  const rules = getPhoneNumberValidationRules(!def.uiEditable);
441
- return (jsx(PhoneField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value }, validation.register(uniqueIdentifier, Object.assign({}, rules)))));
433
+ return (jsx(PhoneField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, value: value, ...validation.register(uniqueIdentifier, {
434
+ ...rules,
435
+ }) }));
442
436
  }
443
437
  case "StringFieldDefinition": {
444
438
  const rules = getStringValidationRules(def);
445
- return (jsx(TextField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })))));
439
+ return (jsx(TextField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, placeholder: title !== null && title !== void 0 ? title : "", readOnly: !isEditableCombined, ...validation.register(uniqueIdentifier, {
440
+ ...rules,
441
+ value,
442
+ }) }));
446
443
  }
447
444
  case "NumberFieldDefinition": {
448
445
  const rules = getNumberValidationRules(def);
@@ -451,7 +448,10 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
451
448
  placeholder: title !== null && title !== void 0 ? title : "",
452
449
  addonAfter: unitTranslation(unit),
453
450
  };
454
- return (jsx(NumberField, Object.assign({ dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_e = def.maximumNumber) !== null && _e !== void 0 ? _e : undefined, min: (_f = def.minimumNumber) !== null && _f !== void 0 ? _f : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any" }, validation.register(uniqueIdentifier, Object.assign(Object.assign({}, rules), { value })), numberProps)));
451
+ return (jsx(NumberField, { dataTestId: `${key}`, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title, max: (_e = def.maximumNumber) !== null && _e !== void 0 ? _e : undefined, min: (_f = def.minimumNumber) !== null && _f !== void 0 ? _f : undefined, readOnly: !isEditableCombined, step: def.isInteger ? 1 : "any", ...validation.register(uniqueIdentifier, {
452
+ ...rules,
453
+ value,
454
+ }), ...numberProps }));
455
455
  }
456
456
  case "BooleanFieldDefinition": {
457
457
  const rules = getBooleanValidationRules();
@@ -474,10 +474,10 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
474
474
  placeholder: title !== null && title !== void 0 ? title : "",
475
475
  addonAfter: def.currency,
476
476
  };
477
- return (jsx(NumberField, Object.assign({ dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_j = def.maximumNumber) !== null && _j !== void 0 ? _j : undefined, min: (_k = def.minimumNumber) !== null && _k !== void 0 ? _k : undefined, readOnly: !isEditableCombined, step: "any" }, validation.register(uniqueIdentifier, rules), { onChange: e => {
477
+ return (jsx(NumberField, { dataTestId: key ? key : `monetaryField`, defaultValue: value, disabled: !isEditableCombined, helpText: errorMessage || description, id: uniqueIdentifier, isInvalid: errorMessage ? true : false, label: title, max: (_j = def.maximumNumber) !== null && _j !== void 0 ? _j : undefined, min: (_k = def.minimumNumber) !== null && _k !== void 0 ? _k : undefined, readOnly: !isEditableCombined, step: "any", ...validation.register(uniqueIdentifier, rules), onChange: e => {
478
478
  setNumberValue(e.target.value === "" ? null : e.target.value);
479
479
  validation.register(uniqueIdentifier, rules).onChange(e);
480
- } }, numberProps)));
480
+ }, ...numberProps }));
481
481
  }
482
482
  default:
483
483
  return exhaustiveCheck(def);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trackunit/custom-field-components",
3
- "version": "0.0.899",
3
+ "version": "0.0.901",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "engines": {
@@ -8,7 +8,7 @@
8
8
  },
9
9
  "dependencies": {
10
10
  "@trackunit/react-form-components": "*",
11
- "react": "^18.2.0",
11
+ "react": "18.3.1",
12
12
  "react-hook-form": "7.40.0",
13
13
  "@trackunit/custom-field-api": "*",
14
14
  "@trackunit/shared-utils": "*",
@@ -16,10 +16,11 @@
16
16
  "@trackunit/iris-app-runtime-core": "*",
17
17
  "@trackunit/iris-app-runtime-core-api": "*",
18
18
  "react-select": "^5.8.0",
19
- "@testing-library/react": "14.0.0",
19
+ "@testing-library/react": "15.0.6",
20
20
  "jest-fetch-mock": "^3.0.3",
21
21
  "@trackunit/i18n-library-translation": "*"
22
22
  },
23
23
  "module": "./index.esm.js",
24
- "main": "./index.cjs.js"
25
- }
24
+ "main": "./index.cjs.js",
25
+ "types": "./index.esm.d.ts"
26
+ }
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { CustomFieldDefinition, CustomFieldValueAndDefinition } from "@trackunit/custom-field-api";
3
2
  import { Control, FieldValues, FormState, UseFormRegister, UseFormSetValue } from "react-hook-form";
4
3
  import { UnitPreference } from "./UnitPreference";
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { DateFieldProps } from "@trackunit/react-form-components";
3
2
  import { FieldValues, RegisterOptions, UseFormRegister, UseFormSetValue } from "react-hook-form";
4
3
  import { FormGroupExposedProps } from "./types";
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { NamespaceTransProps, TransForLibs, TranslationResource } from "@trackunit/i18n-library-translation";
3
2
  import defaultTranslations from "./locales/en/translation.json";
4
3
  /** A type for all available translation keys in this library */
@@ -27,7 +26,7 @@ export type TranslationFunction = TransForLibs<TranslationKeys>;
27
26
  /**
28
27
  * Trans for this specific library.
29
28
  */
30
- export declare const Trans: (props: NamespaceTransProps<TranslationKeys>) => JSX.Element;
29
+ export declare const Trans: (props: NamespaceTransProps<TranslationKeys>) => import("react/jsx-runtime").JSX.Element;
31
30
  /**
32
31
  * Registers the translations for this library
33
32
  */
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "jahre"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": " lat(a)"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "anos"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "лет"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "ani"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "años"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "år"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "年"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": " ปี"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "år"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "roky/let"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "jaar"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "années"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "vuotta"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "év"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "anni"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;
@@ -66,4 +66,4 @@ var translation = {
66
66
  "customfield.unit.YEAR": "år"
67
67
  };
68
68
 
69
- exports["default"] = translation;
69
+ exports.default = translation;