@trackunit/custom-field-components 0.0.520 → 0.0.522

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
@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var irisAppRuntimeCore = require('@trackunit/iris-app-runtime-core');
7
7
  var irisAppRuntimeCoreApi = require('@trackunit/iris-app-runtime-core-api');
8
- var reactComponents = require('@trackunit/react-components');
9
8
  var reactFormComponents = require('@trackunit/react-form-components');
10
9
  var React = require('react');
11
10
 
@@ -3450,8 +3449,7 @@ const getPhoneNumberValidationRules = (definition) => {
3450
3449
  * @returns { JSX.Element } A JSX.Element or null if the field definition is undefined
3451
3450
  */
3452
3451
  const useCustomFieldResolver = (field, validation, unitPreference = "SI", language, fieldId) => {
3453
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
3454
- const [isEditing, setIsEditing] = React.useState(false);
3452
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
3455
3453
  const [numberValue, setNumberValue] = React.useState(() => {
3456
3454
  if ((field === null || field === void 0 ? void 0 : field.definition) && field.definition.type === irisAppRuntimeCoreApi.CustomFieldType.NUMBER) {
3457
3455
  const typedValue = field.value;
@@ -3504,6 +3502,7 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3504
3502
  }
3505
3503
  case irisAppRuntimeCoreApi.CustomFieldType.NUMBER: {
3506
3504
  const typedDefinition = field.definition;
3505
+ const typedValue = field.value;
3507
3506
  const rules = getNumberValidationRules(typedDefinition);
3508
3507
  const unit = unitPreference === "US_CUSTOMARY" && typedDefinition.unitUs
3509
3508
  ? `${typedDefinition.unitUs}`
@@ -3514,22 +3513,19 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3514
3513
  placeholder: (_l = typedDefinition.title) !== null && _l !== void 0 ? _l : "",
3515
3514
  addonAfter: unit,
3516
3515
  };
3517
- return (jsxRuntime.jsx(reactFormComponents.FormGroup, { htmlFor: isEditing ? key || "number-field" : `${key}-number-field`, label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${typedDefinition.key}-FormGroup`, disabled: !typedDefinition.uiEditable, children: isEditing ? (jsxRuntime.jsx(reactFormComponents.NumberInput, Object.assign({ id: key || "number-field", dataTestId: typedDefinition.key ? typedDefinition.key : `numberField`, defaultValue: numberValue === null ? undefined : numberValue, readOnly: !typedDefinition.uiEditable, step: typedDefinition.isInteger ? 1 : "any", min: (_m = typedDefinition.minimumNumber) !== null && _m !== void 0 ? _m : undefined, max: (_o = typedDefinition.maximumNumber) !== null && _o !== void 0 ? _o : undefined }, validation.register(key, rules), { onBlur: () => setIsEditing(!isEditing), onChange: e => {
3518
- setNumberValue(e.target.value === "" ? null : e.target.value);
3519
- validation.register(key, rules).onChange(e);
3520
- } }, numberProps))) : (jsxRuntime.jsx(reactFormComponents.BaseInput, Object.assign({ type: "text", id: `${key}-number-field`, dataTestId: `${typedDefinition.key}`, defaultValue: numberValue === null ? undefined : numberValue, readOnly: true, actions: jsxRuntime.jsx("div", { className: "tu-action-container", children: jsxRuntime.jsx(reactComponents.IconButton, { className: "tu-action-button", dataTestId: `${typedDefinition.key}-editIconButtonId`, size: "small", color: "tertiary", icon: jsxRuntime.jsx(reactComponents.Icon, { size: "small", name: "Pencil" }), onClick: () => setIsEditing(!isEditing) }) }) }, numberProps))) }));
3516
+ return (jsxRuntime.jsx(reactFormComponents.NumberField, Object.assign({ label: title, id: key || "number-field", defaultValue: (_m = typedValue.numberValue) !== null && _m !== void 0 ? _m : "", step: typedDefinition.isInteger ? 1 : "any", min: (_o = typedDefinition.minimumNumber) !== null && _o !== void 0 ? _o : undefined, max: (_p = typedDefinition.maximumNumber) !== null && _p !== void 0 ? _p : undefined, readOnly: !typedDefinition.uiEditable, helpText: description, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, validation.register(key, rules), numberProps)));
3521
3517
  }
3522
3518
  case irisAppRuntimeCoreApi.CustomFieldType.BOOLEAN: {
3523
3519
  const typedDefinition = field.definition;
3524
3520
  const typedValue = field.value;
3525
3521
  const rules = getBooleanValidationRules();
3526
- return (jsxRuntime.jsx(BooleanCustomField, { label: (_p = typedDefinition.title) !== null && _p !== void 0 ? _p : "", id: key || "boolean-field", defaultValue: (_q = typedValue.booleanValue) !== null && _q !== void 0 ? _q : undefined, readOnly: !typedDefinition.uiEditable, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3522
+ return (jsxRuntime.jsx(BooleanCustomField, { label: (_q = typedDefinition.title) !== null && _q !== void 0 ? _q : "", id: key || "boolean-field", defaultValue: (_r = typedValue.booleanValue) !== null && _r !== void 0 ? _r : undefined, readOnly: !typedDefinition.uiEditable, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3527
3523
  }
3528
3524
  case irisAppRuntimeCoreApi.CustomFieldType.DROPDOWN: {
3529
3525
  const typedDefinition = field.definition;
3530
3526
  const typedValue = field.value;
3531
3527
  const rules = getDropdownValidationRules();
3532
- return (jsxRuntime.jsx(DropdownCustomField, { label: typedDefinition.title || "", id: key || "dropdown-field", defaultValue: (_r = typedValue.stringArrayValue) !== null && _r !== void 0 ? _r : undefined, disabled: !typedDefinition.uiEditable, allValues: (_s = typedDefinition.allValues) !== null && _s !== void 0 ? _s : undefined, multiSelect: (_t = typedDefinition.multiSelect) !== null && _t !== void 0 ? _t : false, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3528
+ return (jsxRuntime.jsx(DropdownCustomField, { label: typedDefinition.title || "", id: key || "dropdown-field", defaultValue: (_s = typedValue.stringArrayValue) !== null && _s !== void 0 ? _s : undefined, disabled: !typedDefinition.uiEditable, allValues: (_t = typedDefinition.allValues) !== null && _t !== void 0 ? _t : undefined, multiSelect: (_u = typedDefinition.multiSelect) !== null && _u !== void 0 ? _u : false, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3533
3529
  }
3534
3530
  case irisAppRuntimeCoreApi.CustomFieldType.DATE: {
3535
3531
  const typedDefinition = field.definition;
@@ -3547,16 +3543,16 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3547
3543
  case irisAppRuntimeCoreApi.CustomFieldType.MONETARY: {
3548
3544
  const rules = getNumberValidationRules(field.definition);
3549
3545
  const numberProps = {
3550
- placeholder: (_u = field.definition.title) !== null && _u !== void 0 ? _u : "",
3546
+ placeholder: (_v = field.definition.title) !== null && _v !== void 0 ? _v : "",
3551
3547
  addonAfter: field.definition.currency,
3552
3548
  };
3553
3549
  const value = numberValue === undefined || numberValue === null || numberValue === ""
3554
3550
  ? ""
3555
3551
  : parseFloat(Number(numberValue).toPrecision(4));
3556
- return (jsxRuntime.jsx(reactFormComponents.FormGroup, { htmlFor: isEditing ? key || "number-field" : `${key}-number-field`, label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${field.definition.key}-FormGroup`, disabled: !field.definition.uiEditable, children: isEditing ? (jsxRuntime.jsx(reactFormComponents.NumberInput, Object.assign({ id: key || "number-field", dataTestId: field.definition.key ? field.definition.key : `monetaryField`, defaultValue: value, readOnly: !field.definition.uiEditable, step: "any", min: (_v = field.definition.minimumNumber) !== null && _v !== void 0 ? _v : undefined, max: (_w = field.definition.maximumNumber) !== null && _w !== void 0 ? _w : undefined }, validation.register(key, rules), { onBlur: () => setIsEditing(!isEditing), onChange: e => {
3552
+ return (jsxRuntime.jsx(reactFormComponents.FormGroup, { htmlFor: key || "number-field", label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${field.definition.key}-FormGroup`, disabled: !field.definition.uiEditable, children: jsxRuntime.jsx(reactFormComponents.NumberInput, Object.assign({ id: key || "number-field", dataTestId: field.definition.key ? field.definition.key : `monetaryField`, defaultValue: value, readOnly: !field.definition.uiEditable, step: "any", min: (_w = field.definition.minimumNumber) !== null && _w !== void 0 ? _w : undefined, max: (_x = field.definition.maximumNumber) !== null && _x !== void 0 ? _x : undefined }, validation.register(key, rules), { onChange: e => {
3557
3553
  setNumberValue(e.target.value === "" ? null : e.target.value);
3558
3554
  validation.register(key, rules).onChange(e);
3559
- } }, numberProps))) : (jsxRuntime.jsx(reactFormComponents.BaseInput, Object.assign({ type: "text", id: `${key}-monetary-field`, dataTestId: `${field.definition.key}`, defaultValue: value, readOnly: true, actions: jsxRuntime.jsx("div", { className: "tu-action-container", children: jsxRuntime.jsx(reactComponents.IconButton, { className: "tu-action-button", dataTestId: `${field.definition.key}-editIconButtonId`, size: "small", color: "tertiary", icon: jsxRuntime.jsx(reactComponents.Icon, { size: "small", name: "Pencil" }), onClick: () => setIsEditing(!isEditing) }) }) }, numberProps))) }));
3555
+ } }, numberProps)) }));
3560
3556
  }
3561
3557
  default:
3562
3558
  throw new Error(`Type not supported: ${type}`);
package/index.esm.js CHANGED
@@ -1,8 +1,7 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { CustomFieldRuntime } from '@trackunit/iris-app-runtime-core';
3
3
  import { CustomFieldType } from '@trackunit/iris-app-runtime-core-api';
4
- import { IconButton, Icon } from '@trackunit/react-components';
5
- import { FormGroup, Checkbox, DateField, Select, NumberInput, BaseInput, TextField, ActionButton } from '@trackunit/react-form-components';
4
+ import { FormGroup, Checkbox, DateField, Select, NumberInput, NumberField, TextField, ActionButton } from '@trackunit/react-form-components';
6
5
  import * as React from 'react';
7
6
  import { useCallback, useEffect, createElement, useState } from 'react';
8
7
 
@@ -3427,8 +3426,7 @@ const getPhoneNumberValidationRules = (definition) => {
3427
3426
  * @returns { JSX.Element } A JSX.Element or null if the field definition is undefined
3428
3427
  */
3429
3428
  const useCustomFieldResolver = (field, validation, unitPreference = "SI", language, fieldId) => {
3430
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
3431
- const [isEditing, setIsEditing] = useState(false);
3429
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
3432
3430
  const [numberValue, setNumberValue] = useState(() => {
3433
3431
  if ((field === null || field === void 0 ? void 0 : field.definition) && field.definition.type === CustomFieldType.NUMBER) {
3434
3432
  const typedValue = field.value;
@@ -3481,6 +3479,7 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3481
3479
  }
3482
3480
  case CustomFieldType.NUMBER: {
3483
3481
  const typedDefinition = field.definition;
3482
+ const typedValue = field.value;
3484
3483
  const rules = getNumberValidationRules(typedDefinition);
3485
3484
  const unit = unitPreference === "US_CUSTOMARY" && typedDefinition.unitUs
3486
3485
  ? `${typedDefinition.unitUs}`
@@ -3491,22 +3490,19 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3491
3490
  placeholder: (_l = typedDefinition.title) !== null && _l !== void 0 ? _l : "",
3492
3491
  addonAfter: unit,
3493
3492
  };
3494
- return (jsx(FormGroup, { htmlFor: isEditing ? key || "number-field" : `${key}-number-field`, label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${typedDefinition.key}-FormGroup`, disabled: !typedDefinition.uiEditable, children: isEditing ? (jsx(NumberInput, Object.assign({ id: key || "number-field", dataTestId: typedDefinition.key ? typedDefinition.key : `numberField`, defaultValue: numberValue === null ? undefined : numberValue, readOnly: !typedDefinition.uiEditable, step: typedDefinition.isInteger ? 1 : "any", min: (_m = typedDefinition.minimumNumber) !== null && _m !== void 0 ? _m : undefined, max: (_o = typedDefinition.maximumNumber) !== null && _o !== void 0 ? _o : undefined }, validation.register(key, rules), { onBlur: () => setIsEditing(!isEditing), onChange: e => {
3495
- setNumberValue(e.target.value === "" ? null : e.target.value);
3496
- validation.register(key, rules).onChange(e);
3497
- } }, numberProps))) : (jsx(BaseInput, Object.assign({ type: "text", id: `${key}-number-field`, dataTestId: `${typedDefinition.key}`, defaultValue: numberValue === null ? undefined : numberValue, readOnly: true, actions: jsx("div", { className: "tu-action-container", children: jsx(IconButton, { className: "tu-action-button", dataTestId: `${typedDefinition.key}-editIconButtonId`, size: "small", color: "tertiary", icon: jsx(Icon, { size: "small", name: "Pencil" }), onClick: () => setIsEditing(!isEditing) }) }) }, numberProps))) }));
3493
+ return (jsx(NumberField, Object.assign({ label: title, id: key || "number-field", defaultValue: (_m = typedValue.numberValue) !== null && _m !== void 0 ? _m : "", step: typedDefinition.isInteger ? 1 : "any", min: (_o = typedDefinition.minimumNumber) !== null && _o !== void 0 ? _o : undefined, max: (_p = typedDefinition.maximumNumber) !== null && _p !== void 0 ? _p : undefined, readOnly: !typedDefinition.uiEditable, helpText: description, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, validation.register(key, rules), numberProps)));
3498
3494
  }
3499
3495
  case CustomFieldType.BOOLEAN: {
3500
3496
  const typedDefinition = field.definition;
3501
3497
  const typedValue = field.value;
3502
3498
  const rules = getBooleanValidationRules();
3503
- return (jsx(BooleanCustomField, { label: (_p = typedDefinition.title) !== null && _p !== void 0 ? _p : "", id: key || "boolean-field", defaultValue: (_q = typedValue.booleanValue) !== null && _q !== void 0 ? _q : undefined, readOnly: !typedDefinition.uiEditable, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3499
+ return (jsx(BooleanCustomField, { label: (_q = typedDefinition.title) !== null && _q !== void 0 ? _q : "", id: key || "boolean-field", defaultValue: (_r = typedValue.booleanValue) !== null && _r !== void 0 ? _r : undefined, readOnly: !typedDefinition.uiEditable, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3504
3500
  }
3505
3501
  case CustomFieldType.DROPDOWN: {
3506
3502
  const typedDefinition = field.definition;
3507
3503
  const typedValue = field.value;
3508
3504
  const rules = getDropdownValidationRules();
3509
- return (jsx(DropdownCustomField, { label: typedDefinition.title || "", id: key || "dropdown-field", defaultValue: (_r = typedValue.stringArrayValue) !== null && _r !== void 0 ? _r : undefined, disabled: !typedDefinition.uiEditable, allValues: (_s = typedDefinition.allValues) !== null && _s !== void 0 ? _s : undefined, multiSelect: (_t = typedDefinition.multiSelect) !== null && _t !== void 0 ? _t : false, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3505
+ return (jsx(DropdownCustomField, { label: typedDefinition.title || "", id: key || "dropdown-field", defaultValue: (_s = typedValue.stringArrayValue) !== null && _s !== void 0 ? _s : undefined, disabled: !typedDefinition.uiEditable, allValues: (_t = typedDefinition.allValues) !== null && _t !== void 0 ? _t : undefined, multiSelect: (_u = typedDefinition.multiSelect) !== null && _u !== void 0 ? _u : false, register: validation.register, validationRules: rules, helpText: description, setValue: validation.setValue, errorMessage: errorMessage, dataTestId: `${typedDefinition.key}` }, key));
3510
3506
  }
3511
3507
  case CustomFieldType.DATE: {
3512
3508
  const typedDefinition = field.definition;
@@ -3524,16 +3520,16 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", langua
3524
3520
  case CustomFieldType.MONETARY: {
3525
3521
  const rules = getNumberValidationRules(field.definition);
3526
3522
  const numberProps = {
3527
- placeholder: (_u = field.definition.title) !== null && _u !== void 0 ? _u : "",
3523
+ placeholder: (_v = field.definition.title) !== null && _v !== void 0 ? _v : "",
3528
3524
  addonAfter: field.definition.currency,
3529
3525
  };
3530
3526
  const value = numberValue === undefined || numberValue === null || numberValue === ""
3531
3527
  ? ""
3532
3528
  : parseFloat(Number(numberValue).toPrecision(4));
3533
- return (jsx(FormGroup, { htmlFor: isEditing ? key || "number-field" : `${key}-number-field`, label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${field.definition.key}-FormGroup`, disabled: !field.definition.uiEditable, children: isEditing ? (jsx(NumberInput, Object.assign({ id: key || "number-field", dataTestId: field.definition.key ? field.definition.key : `monetaryField`, defaultValue: value, readOnly: !field.definition.uiEditable, step: "any", min: (_v = field.definition.minimumNumber) !== null && _v !== void 0 ? _v : undefined, max: (_w = field.definition.maximumNumber) !== null && _w !== void 0 ? _w : undefined }, validation.register(key, rules), { onBlur: () => setIsEditing(!isEditing), onChange: e => {
3529
+ return (jsx(FormGroup, { htmlFor: key || "number-field", label: title, isInvalid: errorMessage ? true : false, helpText: errorMessage || description, dataTestId: `${field.definition.key}-FormGroup`, disabled: !field.definition.uiEditable, children: jsx(NumberInput, Object.assign({ id: key || "number-field", dataTestId: field.definition.key ? field.definition.key : `monetaryField`, defaultValue: value, readOnly: !field.definition.uiEditable, step: "any", min: (_w = field.definition.minimumNumber) !== null && _w !== void 0 ? _w : undefined, max: (_x = field.definition.maximumNumber) !== null && _x !== void 0 ? _x : undefined }, validation.register(key, rules), { onChange: e => {
3534
3530
  setNumberValue(e.target.value === "" ? null : e.target.value);
3535
3531
  validation.register(key, rules).onChange(e);
3536
- } }, numberProps))) : (jsx(BaseInput, Object.assign({ type: "text", id: `${key}-monetary-field`, dataTestId: `${field.definition.key}`, defaultValue: value, readOnly: true, actions: jsx("div", { className: "tu-action-container", children: jsx(IconButton, { className: "tu-action-button", dataTestId: `${field.definition.key}-editIconButtonId`, size: "small", color: "tertiary", icon: jsx(Icon, { size: "small", name: "Pencil" }), onClick: () => setIsEditing(!isEditing) }) }) }, numberProps))) }));
3532
+ } }, numberProps)) }));
3537
3533
  }
3538
3534
  default:
3539
3535
  throw new Error(`Type not supported: ${type}`);
package/package.json CHANGED
@@ -1,21 +1,21 @@
1
1
  {
2
2
  "name": "@trackunit/custom-field-components",
3
- "version": "0.0.520",
3
+ "version": "0.0.522",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "engines": {
7
7
  "node": ">=18.x"
8
8
  },
9
9
  "dependencies": {
10
- "@trackunit/iris-app-runtime-core": "0.3.89",
11
- "@trackunit/iris-app-runtime-core-api": "0.3.80",
12
- "@trackunit/react-components": "0.1.185",
13
- "@trackunit/react-core-contexts-test": "0.1.123",
14
- "@trackunit/react-form-components": "0.0.185",
10
+ "@trackunit/iris-app-runtime-core": "0.3.90",
11
+ "@trackunit/iris-app-runtime-core-api": "0.3.81",
12
+ "@trackunit/react-components": "0.1.187",
13
+ "@trackunit/react-core-contexts-test": "0.1.124",
14
+ "@trackunit/react-form-components": "0.0.187",
15
15
  "libphonenumber-js": "1.10.36",
16
16
  "react": "18.2.0",
17
17
  "react-hook-form": "7.40.0",
18
- "react-select": "5.7.3",
18
+ "react-select": "5.7.7",
19
19
  "uuid": "8.3.2"
20
20
  },
21
21
  "module": "./index.esm.js",