@trackunit/custom-field-components 0.0.112 → 0.0.117

package/getValidationRules.d.ts

@@ -1,11 +1,11 @@
 import { BooleanFieldDefinition, DateFieldDefinition, DropDownFieldDefinition, EmailFieldDefinition, NumberFieldDefinition, PhoneNumberFieldDefinition, StringFieldDefinition, WebAddressFieldDefinition } from "@trackunit/iris-app-runtime-core-api";
 import { RegisterOptions } from "react-hook-form";
 export declare type ValidationRules = RegisterOptions;
+export declare const getWebAddressValidationRules: (definition: WebAddressFieldDefinition) => ValidationRules;
 export declare const getNumberValidationRules: (definition: NumberFieldDefinition) => ValidationRules;
 export declare const getStringValidationRules: (definition: StringFieldDefinition) => ValidationRules;
 export declare const getBooleanValidationRules: (definition: BooleanFieldDefinition) => ValidationRules;
 export declare const getDropdownValidationRules: (definition: DropDownFieldDefinition) => ValidationRules;
 export declare const getDateValidationRules: (definition: DateFieldDefinition) => ValidationRules;
 export declare const getEmailValidationRules: (definition: EmailFieldDefinition) => ValidationRules;
-export declare const getWebAddressValidationRules: (definition: WebAddressFieldDefinition) => ValidationRules;
 export declare const getPhoneNumberValidationRules: (definition: PhoneNumberFieldDefinition) => ValidationRules;

package/index.js

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { CustomFieldType } from '@trackunit/iris-app-runtime-core-api';
-import { FormGroup, Checkbox, DateField, Select, BaseInput, TextField } from '@trackunit/react-components';
+import { FormGroup, Checkbox, DateField, Select, BaseInput, TextField, ActionButton } from '@trackunit/react-components';
 import * as React from 'react';
 import { useCallback, useEffect } from 'react';
 import { isValidPhoneNumber } from 'libphonenumber-js';
@@ -1809,8 +1809,9 @@ const BooleanCustomField = _a => {
   React.useEffect(() => {
     register && register(id, Object.assign(Object.assign({}, validationRules), {
       value: internalValue.toString()
-    }));
-  }, [register, validationRules, id, internalValue]);
+    })); // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []); // register only once
+
   return jsx(FormGroup, Object.assign({
     label: label,
     tip: tip,
@@ -2361,6 +2362,16 @@ $({ target: 'RegExp', proto: true, forced: /./.exec !== exec }, {
   exec: exec
 });
 
+const getWebAddressValidationRules = definition => {
+  const defaultRules = {};
+  const pattern = {
+    pattern: {
+      value: RegExp("^(((https?|ftps?)://)(%[0-9A-Fa-f]{2}|[-()_.!~*';/?:@&=+$,A-Za-z0-9])+)([).!';/?:,][[:blank:|:blank:]])?$"),
+      message: `Must match url pattern`
+    }
+  };
+  return definition.uiEditable ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
+};
 const getNumberValidationRules = definition => {
   const defaultRules = {
     valueAsNumber: true
@@ -2428,16 +2439,6 @@ const getEmailValidationRules = definition => {
   };
   return definition.uiEditable ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
 };
-const getWebAddressValidationRules = definition => {
-  const defaultRules = {};
-  const pattern = {
-    pattern: {
-      value: RegExp("^(((https?|ftps?)://)(%[0-9A-Fa-f]{2}|[-()_.!~*';/?:@&=+$,A-Za-z0-9])+)([).!';/?:,][[:blank:|:blank:]])?$"),
-      message: `Must match url pattern`
-    }
-  };
-  return definition.uiEditable ? Object.assign(Object.assign({}, pattern), defaultRules) : defaultRules;
-};
 const getPhoneNumberValidationRules = definition => {
   const defaultRules = {};
   const pattern = {
@@ -2447,7 +2448,7 @@ const getPhoneNumberValidationRules = definition => {
 };
 
 const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldId) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
 
   if ((field === null || field === void 0 ? void 0 : field.definition) === undefined || ((_a = field === null || field === void 0 ? void 0 : field.definition) === null || _a === void 0 ? void 0 : _a.type) === undefined) {
     return null;
@@ -2463,32 +2464,41 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
   } = field.definition;
 
   switch (type) {
-    case CustomFieldType.EMAIL:
+    case CustomFieldType.WEB_ADDRESS:
       {
         const typedDefinition = field.definition;
         const typedValue = field.value;
-        const rules = getEmailValidationRules(typedDefinition);
+        const rules = getWebAddressValidationRules(typedDefinition);
         return jsx(TextField, Object.assign({
           id: key,
           label: title,
           placeholder: (_c = typedDefinition.title) !== null && _c !== void 0 ? _c : "",
           defaultValue: (_e = (_d = typedValue.stringValue) !== null && _d !== void 0 ? _d : typedDefinition.defaultStringValue) !== null && _e !== void 0 ? _e : "",
+          dataTestId: "webAddressField",
+          actions: !typedDefinition.uiEditable && (typedValue.stringValue || typedDefinition.defaultStringValue) && jsx(ActionButton, {
+            value: (_f = typedValue.stringValue) !== null && _f !== void 0 ? _f : typedDefinition.defaultStringValue,
+            type: "WEB_ADDRESS"
+          }),
           readOnly: !typedDefinition.uiEditable,
           helpText: description || undefined,
           errorMessage: errorMessage
         }, validation.register(key, rules)));
       }
 
-    case CustomFieldType.WEB_ADDRESS:
+    case CustomFieldType.EMAIL:
       {
         const typedDefinition = field.definition;
         const typedValue = field.value;
-        const rules = getWebAddressValidationRules(typedDefinition);
+        const rules = getEmailValidationRules(typedDefinition);
         return jsx(TextField, Object.assign({
           id: key,
           label: title,
-          placeholder: (_f = typedDefinition.title) !== null && _f !== void 0 ? _f : "",
-          defaultValue: (_h = (_g = typedValue.stringValue) !== null && _g !== void 0 ? _g : typedDefinition.defaultStringValue) !== null && _h !== void 0 ? _h : "",
+          placeholder: (_g = typedDefinition.title) !== null && _g !== void 0 ? _g : "",
+          defaultValue: (_j = (_h = typedValue.stringValue) !== null && _h !== void 0 ? _h : typedDefinition.defaultStringValue) !== null && _j !== void 0 ? _j : "",
+          actions: !typedDefinition.uiEditable && (typedValue.stringValue || typedDefinition.defaultStringValue) && jsx(ActionButton, {
+            value: (_k = typedValue.stringValue) !== null && _k !== void 0 ? _k : typedDefinition.defaultStringValue,
+            type: "EMAIL"
+          }),
           readOnly: !typedDefinition.uiEditable,
           helpText: description || undefined,
           errorMessage: errorMessage
@@ -2503,8 +2513,12 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
         return jsx(TextField, Object.assign({
           label: title,
           id: key,
-          placeholder: (_j = typedDefinition.title) !== null && _j !== void 0 ? _j : "",
-          defaultValue: (_l = (_k = typedValue.stringValue) !== null && _k !== void 0 ? _k : typedDefinition.defaultStringValue) !== null && _l !== void 0 ? _l : "",
+          placeholder: (_l = typedDefinition.title) !== null && _l !== void 0 ? _l : "",
+          defaultValue: (_o = (_m = typedValue.stringValue) !== null && _m !== void 0 ? _m : typedDefinition.defaultStringValue) !== null && _o !== void 0 ? _o : "",
+          actions: !typedDefinition.uiEditable && (typedValue.stringValue || typedDefinition.defaultStringValue) && jsx(ActionButton, {
+            value: (_p = typedValue.stringValue) !== null && _p !== void 0 ? _p : typedDefinition.defaultStringValue,
+            type: "PHONE_NUMBER"
+          }),
           readOnly: !typedDefinition.uiEditable,
           helpText: description || undefined,
           errorMessage: errorMessage === "" ? "Must be a phone number" : undefined
@@ -2519,8 +2533,8 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
         return jsx(TextField, Object.assign({
           label: title,
           id: key || "string-field",
-          placeholder: (_m = typedDefinition.title) !== null && _m !== void 0 ? _m : "",
-          defaultValue: (_p = (_o = typedValue.stringValue) !== null && _o !== void 0 ? _o : typedDefinition.defaultStringValue) !== null && _p !== void 0 ? _p : "",
+          placeholder: (_q = typedDefinition.title) !== null && _q !== void 0 ? _q : "",
+          defaultValue: (_s = (_r = typedValue.stringValue) !== null && _r !== void 0 ? _r : typedDefinition.defaultStringValue) !== null && _s !== void 0 ? _s : "",
           readOnly: !typedDefinition.uiEditable,
           helpText: description || undefined,
           errorMessage: errorMessage,
@@ -2544,13 +2558,13 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
             type: "number",
             id: key || "number-field",
             dataTestId: "numberField",
-            placeholder: (_q = typedDefinition.title) !== null && _q !== void 0 ? _q : "",
-            defaultValue: (_s = (_r = typedValue.numberValue) !== null && _r !== void 0 ? _r : typedDefinition.defaultNumberValue) !== null && _s !== void 0 ? _s : "",
+            placeholder: (_t = typedDefinition.title) !== null && _t !== void 0 ? _t : "",
+            defaultValue: (_v = (_u = typedValue.numberValue) !== null && _u !== void 0 ? _u : typedDefinition.defaultNumberValue) !== null && _v !== void 0 ? _v : "",
             addonAfter: unit,
             readOnly: !typedDefinition.uiEditable,
             step: typedDefinition.isInteger ? 1 : "any",
-            min: (_t = typedDefinition.minimumNumber) !== null && _t !== void 0 ? _t : undefined,
-            max: (_u = typedDefinition.maximumNumber) !== null && _u !== void 0 ? _u : undefined
+            min: (_w = typedDefinition.minimumNumber) !== null && _w !== void 0 ? _w : undefined,
+            max: (_x = typedDefinition.maximumNumber) !== null && _x !== void 0 ? _x : undefined
           }, validation.register(key, rules)))
         }));
       }
@@ -2561,9 +2575,9 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
         const typedValue = field.value;
         const rules = getBooleanValidationRules();
         return jsx(BooleanCustomField, {
-          label: (_v = typedDefinition.title) !== null && _v !== void 0 ? _v : "",
+          label: (_y = typedDefinition.title) !== null && _y !== void 0 ? _y : "",
           id: key || "boolean-field",
-          defaultValue: (_x = (_w = typedValue.booleanValue) !== null && _w !== void 0 ? _w : typedDefinition.defaultBooleanValue) !== null && _x !== void 0 ? _x : undefined,
+          defaultValue: (_0 = (_z = typedValue.booleanValue) !== null && _z !== void 0 ? _z : typedDefinition.defaultBooleanValue) !== null && _0 !== void 0 ? _0 : undefined,
           readOnly: !typedDefinition.uiEditable,
           register: validation.register,
           validationRules: rules,
@@ -2582,10 +2596,10 @@ const useCustomFieldResolver = (field, validation, unitPreference = "SI", fieldI
         return jsx(DropdownCustomField, {
           label: typedDefinition.title || "",
           id: key || "dropdown-field",
-          defaultValue: (_z = (_y = typedValue.stringArrayValue) !== null && _y !== void 0 ? _y : typedDefinition.defaultStringArrayValue) !== null && _z !== void 0 ? _z : undefined,
+          defaultValue: (_2 = (_1 = typedValue.stringArrayValue) !== null && _1 !== void 0 ? _1 : typedDefinition.defaultStringArrayValue) !== null && _2 !== void 0 ? _2 : undefined,
           disabled: !typedDefinition.uiEditable,
-          allValues: (_0 = typedDefinition.allValues) !== null && _0 !== void 0 ? _0 : undefined,
-          multiSelect: (_1 = typedDefinition.multiSelect) !== null && _1 !== void 0 ? _1 : false,
+          allValues: (_3 = typedDefinition.allValues) !== null && _3 !== void 0 ? _3 : undefined,
+          multiSelect: (_4 = typedDefinition.multiSelect) !== null && _4 !== void 0 ? _4 : false,
           register: validation.register,
           validationRules: rules,
           helpText: description || undefined,

package/mocks.d.ts

@@ -1,4 +1,4 @@
-import { BooleanFieldDefinition, DateFieldDefinition, DropDownFieldDefinition, NumberFieldDefinition, StringFieldDefinition, ValueAndDefinition } from "@trackunit/iris-app-runtime-core-api";
+import { BooleanFieldDefinition, DateFieldDefinition, DropDownFieldDefinition, NumberFieldDefinition, StringFieldDefinition, ValueAndDefinition, WebAddressFieldDefinition } from "@trackunit/iris-app-runtime-core-api";
 import { FieldValues, FormState, UseFormRegister, UseFormSetValue } from "react-hook-form";
 export declare const getValidationRules: () => Promise<{
     register: UseFormRegister<FieldValues>;
@@ -11,6 +11,8 @@ export declare const numberFieldDefinition: NumberFieldDefinition;
 export declare const numberField: ValueAndDefinition;
 export declare const dateFieldDefinition: DateFieldDefinition;
 export declare const dateField: ValueAndDefinition;
+export declare const webAddressFieldDefinition: WebAddressFieldDefinition;
+export declare const webAddressField: ValueAndDefinition;
 export declare const booleanFieldDefinition: BooleanFieldDefinition;
 export declare const booleanField: ValueAndDefinition;
 export declare const dropDownFieldDefinition: DropDownFieldDefinition;

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@trackunit/custom-field-components",
-  "version": "0.0.112",
+  "version": "0.0.117",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {
-    "@trackunit/react-core-contexts-test": "0.0.33",
-    "@trackunit/react-components": "0.0.126",
+    "@trackunit/react-core-contexts-test": "0.0.34",
+    "@trackunit/react-components": "0.0.130",
     "react": "17.0.1",
     "react-hook-form": "^7.29.0",
-    "@trackunit/iris-app-runtime-core": "0.0.63",
+    "@trackunit/iris-app-runtime-core": "0.0.64",
     "@trackunit/iris-app-runtime-core-api": "0.0.61",
     "react-select": "^5.4.0",
     "libphonenumber-js": "^1.10.7"