@trackunit/custom-field-components 0.0.1026 → 0.0.1029

package/index.cjs.js

@@ -7,6 +7,9 @@ var reactFormComponents = require('@trackunit/react-form-components');
 var sharedUtils = require('@trackunit/shared-utils');
 var React = require('react');
 var reactHookForm = require('react-hook-form');
+var reactComponents = require('@trackunit/react-components');
+var reactCoreHooks = require('@trackunit/react-core-hooks');
+var reactModal = require('@trackunit/react-modal');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);
@@ -28,6 +31,15 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 var defaultTranslations = {
+	"customfield.stringlistfield.add": "Add",
+	"customfield.stringlistfield.addField.Heading": "Add {{label}}",
+	"customfield.stringlistfield.addField.InputPlaceholder": "Enter {{label}}",
+	"customfield.stringlistfield.deleteField.Heading": "Delete {{label}}",
+	"customfield.stringlistfield.deleteField.Message": "Are you sure you want to delete this {{label}}?",
+	"customfield.stringlistfield.deleteField.PrimaryActionLabel": "Delete",
+	"customfield.stringlistfield.deleteField.SecondaryActionLabel": "Cancel",
+	"customfield.stringlistfield.discard": "Discard",
+	"customfield.stringlistfield.noValuesAddedYet": "No values added yet",
 	"customfield.unit.ACRE": "acre",
 	"customfield.unit.AMPERE": "A",
 	"customfield.unit.AMPERE_HOUR": "Ah",
@@ -227,6 +239,64 @@ const DropdownCustomField = ({ defaultValue, dataTestId, onChange, onBlur, id, d
     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 }) }));
 };
 
+/**
+ * Modal for adding a new string list field
+ */
+const AddStringListField = ({ id, label, isEditing, setIsEditing, onAdd }) => {
+    const { Modal } = reactModal.useModal();
+    const [inputValue, setInputValue] = React.useState("");
+    const { t } = useTranslation();
+    const handleAdd = () => {
+        if (inputValue.trim()) {
+            onAdd(inputValue.trim());
+            setInputValue("");
+            setIsEditing(false);
+        }
+    };
+    const handleDiscard = () => {
+        setInputValue("");
+        setIsEditing(false);
+    };
+    return (jsxRuntime.jsxs(Modal, { className: "max-w-lg", dataTestId: `${id}-edit-modal`, isOpen: isEditing, onDismissClick: handleDiscard, children: [jsxRuntime.jsx(reactComponents.CardHeader, { heading: t("customfield.stringlistfield.addField.Heading", { label: label }), onClose: handleDiscard }), jsxRuntime.jsx(reactComponents.CardBody, { children: jsxRuntime.jsx(reactFormComponents.TextInput, { dataTestId: `${id}-edit-modal-input`, onChange: e => setInputValue(e.target.value), placeholder: t("customfield.stringlistfield.addField.InputPlaceholder", { label: label }), value: inputValue }) }), jsxRuntime.jsxs(reactComponents.CardFooter, { children: [jsxRuntime.jsx(reactComponents.Button, { dataTestId: `${id}-edit-modal-discard-button`, onClick: handleDiscard, variant: "secondary", children: t("customfield.stringlistfield.discard") }), jsxRuntime.jsx(reactComponents.Button, { dataTestId: `${id}-edit-modal-add-button`, onClick: handleAdd, children: t("customfield.stringlistfield.add") })] })] }));
+};
+
+/**
+ * A custom field that displays a list of strings.
+ */
+const StringListField = ({ defaultValue = [], label, description, disabled, validationRules, id, control, register, dataTestId, ...props }) => {
+    const [isEditing, setIsEditing] = React.useState(false);
+    const { confirm } = reactCoreHooks.useConfirmationDialog();
+    const { t } = useTranslation();
+    return (jsxRuntime.jsx(reactHookForm.Controller, { control: control, defaultValue: defaultValue, name: id, render: ({ field }) => {
+            const handleRemoveValue = (index) => {
+                const newValues = field.value.filter((_, i) => i !== index);
+                field.onChange(newValues);
+            };
+            const handleFieldChange = (index, value) => {
+                const newValues = [...field.value];
+                newValues[index] = value;
+                field.onChange(newValues);
+            };
+            const handleRemoveValueConfirmation = async (index) => {
+                const confirmResult = await confirm({
+                    title: t("customfield.stringlistfield.deleteField.Heading", { label: label }),
+                    message: t("customfield.stringlistfield.deleteField.Message", { label: label }),
+                    primaryActionLabel: t("customfield.stringlistfield.deleteField.PrimaryActionLabel"),
+                    secondaryActionLabel: t("customfield.stringlistfield.deleteField.SecondaryActionLabel"),
+                    primaryActionType: "primary-danger",
+                });
+                if (confirmResult === "PRIMARY") {
+                    handleRemoveValue(index);
+                }
+            };
+            return (jsxRuntime.jsxs(reactComponents.Card, { ...props, className: "w-full", "data-testid": dataTestId, children: [jsxRuntime.jsx(reactComponents.CardHeader, { accessories: jsxRuntime.jsx(reactComponents.Tooltip, { label: description }), heading: label, headingVariant: "secondary" }), jsxRuntime.jsx(reactComponents.CardBody, { children: field.value.length === 0 ? (jsxRuntime.jsx(reactComponents.Text, { children: t("customfield.stringlistfield.noValuesAddedYet") })) : (jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: field.value.map((value, index) => (jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx(reactFormComponents.TextInput, { disabled: disabled, ...register(`${id}-${index}`, {
+                                            onChange: e => handleFieldChange(index, e.target.value),
+                                        }), defaultValue: value }), jsxRuntime.jsx(reactComponents.IconButton, { disabled: disabled, icon: jsxRuntime.jsx(reactComponents.Icon, { name: "Trash", size: "small" }), onClick: () => handleRemoveValueConfirmation(index), variant: "secondary-danger" })] }, index))) })) }), !disabled ? (jsxRuntime.jsx(reactComponents.CardFooter, { children: jsxRuntime.jsx(reactComponents.Button, { disabled: disabled, onClick: () => setIsEditing(true), variant: "secondary", children: t("customfield.stringlistfield.add", { label: label }) }) })) : null, jsxRuntime.jsx(AddStringListField, { id: id, isEditing: isEditing, label: label, onAdd: (newItem) => {
+                            field.onChange([...field.value, newItem]);
+                        }, setIsEditing: setIsEditing })] }));
+        }, rules: validationRules }));
+};
+
 /**
  * Generates validation rules for a web address field.
  *
@@ -347,6 +417,46 @@ const getBooleanValidationRules = (definition) => {
 const getDropdownValidationRules = (definition) => {
     return getDefaultValidationRules();
 };
+/**
+ * Generates validation rules for a string list field.
+ *
+ * @param {GetStringListValidationRulesDefinition} definition - The definition of the string list field.
+ * @returns {ValidationRules} The generated validation rules.
+ */
+const getStringListValidationRules = (definition) => {
+    const defaultRules = {};
+    const itemMinLength = definition.itemMinimumLength
+        ? {
+            minLength: {
+                value: definition.itemMinimumLength,
+                message: `minimum length for each item is ${definition.itemMinimumLength}`,
+            },
+        }
+        : undefined;
+    const itemMaxLength = definition.itemMaximumLength
+        ? {
+            maxLength: {
+                value: definition.itemMaximumLength,
+                message: `maximum length for each item is ${definition.itemMaximumLength}`,
+            },
+        }
+        : undefined;
+    const pattern = definition.pattern
+        ? {
+            pattern: {
+                value: RegExp(definition.pattern),
+                message: `Must match pattern: ${definition.pattern}`,
+            },
+        }
+        : undefined;
+    return definition.uiEditable
+        ? {
+            ...itemMaxLength,
+            ...itemMinLength,
+            ...pattern,
+        }
+        : defaultRules;
+};
 /**
  * Generates validation rules for a date field.
  *
@@ -482,7 +592,8 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return (jsxRuntime.jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: value, disabled: !isEditableCombined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
         }
         case "StringListFieldDefinition": {
-            return null; // Not implemented
+            const rules = getStringListValidationRules(def);
+            return (jsxRuntime.jsx(StringListField, { control: control, dataTestId: key, defaultValue: value !== null && value !== void 0 ? value : undefined, description: description !== null && description !== void 0 ? description : "", disabled: !isEditableCombined, errorMessage: errorMessage, id: uniqueIdentifier, label: title || "", register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "JsonFieldDefinition": {
             return null;

package/index.esm.js

@@ -1,13 +1,25 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { registerTranslations, useNamespaceTranslation } from '@trackunit/i18n-library-translation';
 import { getCustomFieldValueForDisplayInUI } from '@trackunit/iris-app-runtime-core';
-import { FormGroup, Checkbox, DateField, Select, useGetPhoneValidationRules, NumberField, TextField, PhoneField, ActionButton } from '@trackunit/react-form-components';
+import { FormGroup, Checkbox, DateField, Select, TextInput, useGetPhoneValidationRules, NumberField, TextField, PhoneField, ActionButton } from '@trackunit/react-form-components';
 import { uuidv4, exhaustiveCheck } from '@trackunit/shared-utils';
 import * as React from 'react';
 import { useCallback, useEffect, createElement, useState } from 'react';
-import { useWatch } from 'react-hook-form';
+import { Controller, useWatch } from 'react-hook-form';
+import { CardHeader, CardBody, CardFooter, Button, Card, Tooltip, Text, IconButton, Icon } from '@trackunit/react-components';
+import { useConfirmationDialog } from '@trackunit/react-core-hooks';
+import { useModal } from '@trackunit/react-modal';
 
 var defaultTranslations = {
+	"customfield.stringlistfield.add": "Add",
+	"customfield.stringlistfield.addField.Heading": "Add {{label}}",
+	"customfield.stringlistfield.addField.InputPlaceholder": "Enter {{label}}",
+	"customfield.stringlistfield.deleteField.Heading": "Delete {{label}}",
+	"customfield.stringlistfield.deleteField.Message": "Are you sure you want to delete this {{label}}?",
+	"customfield.stringlistfield.deleteField.PrimaryActionLabel": "Delete",
+	"customfield.stringlistfield.deleteField.SecondaryActionLabel": "Cancel",
+	"customfield.stringlistfield.discard": "Discard",
+	"customfield.stringlistfield.noValuesAddedYet": "No values added yet",
 	"customfield.unit.ACRE": "acre",
 	"customfield.unit.AMPERE": "A",
 	"customfield.unit.AMPERE_HOUR": "Ah",
@@ -207,6 +219,64 @@ const DropdownCustomField = ({ defaultValue, dataTestId, onChange, onBlur, id, d
     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 }) }));
 };
 
+/**
+ * Modal for adding a new string list field
+ */
+const AddStringListField = ({ id, label, isEditing, setIsEditing, onAdd }) => {
+    const { Modal } = useModal();
+    const [inputValue, setInputValue] = useState("");
+    const { t } = useTranslation();
+    const handleAdd = () => {
+        if (inputValue.trim()) {
+            onAdd(inputValue.trim());
+            setInputValue("");
+            setIsEditing(false);
+        }
+    };
+    const handleDiscard = () => {
+        setInputValue("");
+        setIsEditing(false);
+    };
+    return (jsxs(Modal, { className: "max-w-lg", dataTestId: `${id}-edit-modal`, isOpen: isEditing, onDismissClick: handleDiscard, children: [jsx(CardHeader, { heading: t("customfield.stringlistfield.addField.Heading", { label: label }), onClose: handleDiscard }), jsx(CardBody, { children: jsx(TextInput, { dataTestId: `${id}-edit-modal-input`, onChange: e => setInputValue(e.target.value), placeholder: t("customfield.stringlistfield.addField.InputPlaceholder", { label: label }), value: inputValue }) }), jsxs(CardFooter, { children: [jsx(Button, { dataTestId: `${id}-edit-modal-discard-button`, onClick: handleDiscard, variant: "secondary", children: t("customfield.stringlistfield.discard") }), jsx(Button, { dataTestId: `${id}-edit-modal-add-button`, onClick: handleAdd, children: t("customfield.stringlistfield.add") })] })] }));
+};
+
+/**
+ * A custom field that displays a list of strings.
+ */
+const StringListField = ({ defaultValue = [], label, description, disabled, validationRules, id, control, register, dataTestId, ...props }) => {
+    const [isEditing, setIsEditing] = useState(false);
+    const { confirm } = useConfirmationDialog();
+    const { t } = useTranslation();
+    return (jsx(Controller, { control: control, defaultValue: defaultValue, name: id, render: ({ field }) => {
+            const handleRemoveValue = (index) => {
+                const newValues = field.value.filter((_, i) => i !== index);
+                field.onChange(newValues);
+            };
+            const handleFieldChange = (index, value) => {
+                const newValues = [...field.value];
+                newValues[index] = value;
+                field.onChange(newValues);
+            };
+            const handleRemoveValueConfirmation = async (index) => {
+                const confirmResult = await confirm({
+                    title: t("customfield.stringlistfield.deleteField.Heading", { label: label }),
+                    message: t("customfield.stringlistfield.deleteField.Message", { label: label }),
+                    primaryActionLabel: t("customfield.stringlistfield.deleteField.PrimaryActionLabel"),
+                    secondaryActionLabel: t("customfield.stringlistfield.deleteField.SecondaryActionLabel"),
+                    primaryActionType: "primary-danger",
+                });
+                if (confirmResult === "PRIMARY") {
+                    handleRemoveValue(index);
+                }
+            };
+            return (jsxs(Card, { ...props, className: "w-full", "data-testid": dataTestId, children: [jsx(CardHeader, { accessories: jsx(Tooltip, { label: description }), heading: label, headingVariant: "secondary" }), jsx(CardBody, { children: field.value.length === 0 ? (jsx(Text, { children: t("customfield.stringlistfield.noValuesAddedYet") })) : (jsx("div", { className: "flex flex-wrap gap-2", children: field.value.map((value, index) => (jsxs("div", { className: "flex items-center gap-2", children: [jsx(TextInput, { disabled: disabled, ...register(`${id}-${index}`, {
+                                            onChange: e => handleFieldChange(index, e.target.value),
+                                        }), defaultValue: value }), jsx(IconButton, { disabled: disabled, icon: jsx(Icon, { name: "Trash", size: "small" }), onClick: () => handleRemoveValueConfirmation(index), variant: "secondary-danger" })] }, index))) })) }), !disabled ? (jsx(CardFooter, { children: jsx(Button, { disabled: disabled, onClick: () => setIsEditing(true), variant: "secondary", children: t("customfield.stringlistfield.add", { label: label }) }) })) : null, jsx(AddStringListField, { id: id, isEditing: isEditing, label: label, onAdd: (newItem) => {
+                            field.onChange([...field.value, newItem]);
+                        }, setIsEditing: setIsEditing })] }));
+        }, rules: validationRules }));
+};
+
 /**
  * Generates validation rules for a web address field.
  *
@@ -327,6 +397,46 @@ const getBooleanValidationRules = (definition) => {
 const getDropdownValidationRules = (definition) => {
     return getDefaultValidationRules();
 };
+/**
+ * Generates validation rules for a string list field.
+ *
+ * @param {GetStringListValidationRulesDefinition} definition - The definition of the string list field.
+ * @returns {ValidationRules} The generated validation rules.
+ */
+const getStringListValidationRules = (definition) => {
+    const defaultRules = {};
+    const itemMinLength = definition.itemMinimumLength
+        ? {
+            minLength: {
+                value: definition.itemMinimumLength,
+                message: `minimum length for each item is ${definition.itemMinimumLength}`,
+            },
+        }
+        : undefined;
+    const itemMaxLength = definition.itemMaximumLength
+        ? {
+            maxLength: {
+                value: definition.itemMaximumLength,
+                message: `maximum length for each item is ${definition.itemMaximumLength}`,
+            },
+        }
+        : undefined;
+    const pattern = definition.pattern
+        ? {
+            pattern: {
+                value: RegExp(definition.pattern),
+                message: `Must match pattern: ${definition.pattern}`,
+            },
+        }
+        : undefined;
+    return definition.uiEditable
+        ? {
+            ...itemMaxLength,
+            ...itemMinLength,
+            ...pattern,
+        }
+        : defaultRules;
+};
 /**
  * Generates validation rules for a date field.
  *
@@ -462,7 +572,8 @@ const useCustomFieldResolver = ({ field, definition, register, setValue, formSta
             return (jsx(DateCustomField, { dataTestId: `${key}`, defaultValue: value, disabled: !isEditableCombined, errorMessage: errorMessage, helpText: description, id: uniqueIdentifier, label: title || "", readOnly: !isEditableCombined, register: validation.register, setValue: validation.setValue, title: title || "", validationRules: rules }));
         }
         case "StringListFieldDefinition": {
-            return null; // Not implemented
+            const rules = getStringListValidationRules(def);
+            return (jsx(StringListField, { control: control, dataTestId: key, defaultValue: value !== null && value !== void 0 ? value : undefined, description: description !== null && description !== void 0 ? description : "", disabled: !isEditableCombined, errorMessage: errorMessage, id: uniqueIdentifier, label: title || "", register: validation.register, setValue: validation.setValue, validationRules: rules }));
         }
         case "JsonFieldDefinition": {
             return null;

package/package.json

@@ -1,12 +1,15 @@
 {
   "name": "@trackunit/custom-field-components",
-  "version": "0.0.1026",
+  "version": "0.0.1029",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
     "node": ">=20.x"
   },
   "dependencies": {
+    "@trackunit/react-components": "*",
+    "@trackunit/react-modal": "*",
+    "@trackunit/react-core-hooks": "*",
     "@trackunit/react-form-components": "*",
     "react": "18.3.1",
     "react-hook-form": "7.53.1",

package/src/StringListField/AddStringListField.d.ts

@@ -0,0 +1,12 @@
+interface AddStringListFieldProps {
+    id: string;
+    label: string;
+    isEditing: boolean;
+    setIsEditing: (isEditing: boolean) => void;
+    onAdd: (newItem: string) => void;
+}
+/**
+ * Modal for adding a new string list field
+ */
+export declare const AddStringListField: ({ id, label, isEditing, setIsEditing, onAdd }: AddStringListFieldProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/src/StringListField/StringListField.d.ts

@@ -0,0 +1,19 @@
+import { CommonProps } from "@trackunit/react-components";
+import { Control, FieldValues, RegisterOptions, UseFormRegister, UseFormSetValue } from "react-hook-form";
+export interface StringListFieldProps extends CommonProps {
+    defaultValue?: string[];
+    label: string;
+    helpText?: string;
+    errorMessage?: string;
+    register: UseFormRegister<FieldValues>;
+    setValue: UseFormSetValue<FieldValues>;
+    description?: string;
+    disabled?: boolean;
+    validationRules: RegisterOptions;
+    id: string;
+    control: Control<FieldValues>;
+}
+/**
+ * A custom field that displays a list of strings.
+ */
+export declare const StringListField: ({ defaultValue, label, description, disabled, validationRules, id, control, register, dataTestId, ...props }: StringListFieldProps) => import("react/jsx-runtime").JSX.Element;

package/src/getValidationRules.d.ts

@@ -52,6 +52,19 @@ export declare const getBooleanValidationRules: (definition: CommonValidationRul
  * @returns {ValidationRules} The generated validation rules.
  */
 export declare const getDropdownValidationRules: (definition: CommonValidationRulesDefinition) => ValidationRules;
+interface GetStringListValidationRulesDefinition extends CommonValidationRulesDefinition {
+    itemMaximumLength?: number | null;
+    itemMinimumLength?: number | null;
+    pattern?: string | null;
+    maximumItems?: number | null;
+}
+/**
+ * Generates validation rules for a string list field.
+ *
+ * @param {GetStringListValidationRulesDefinition} definition - The definition of the string list field.
+ * @returns {ValidationRules} The generated validation rules.
+ */
+export declare const getStringListValidationRules: (definition: GetStringListValidationRulesDefinition) => ValidationRules;
 /**
  * Generates validation rules for a date field.
  *

package/src/translation.d.ts

@@ -14,8 +14,8 @@ export declare const translations: TranslationResource<TranslationKeys>;
 /**
  *  Local useTranslation for this specific library
  */
-export declare const useTranslation: () => [TransForLibs<"customfield.unit.ACRE" | "customfield.unit.AMPERE" | "customfield.unit.AMPERE_HOUR" | "customfield.unit.ARE" | "customfield.unit.BAR" | "customfield.unit.CELSIUS" | "customfield.unit.CENTIMETRE" | "customfield.unit.CUBIC_FOOT" | "customfield.unit.CUBIC_METRE" | "customfield.unit.DAY" | "customfield.unit.DEGREE_ANGLE" | "customfield.unit.FAHRENHEIT" | "customfield.unit.FOOT" | "customfield.unit.G_FORCE" | "customfield.unit.GALLON_LIQUID" | "customfield.unit.GALLONS_PER_HOUR" | "customfield.unit.GRAM" | "customfield.unit.HECTARE" | "customfield.unit.HERTZ" | "customfield.unit.HOUR" | "customfield.unit.INCH" | "customfield.unit.INCHES_OF_WATER" | "customfield.unit.KILOGRAM" | "customfield.unit.KILOGRAM_PER_HOUR" | "customfield.unit.KILOGRAM_PER_SECOND" | "customfield.unit.KILOMETRE" | "customfield.unit.KILOMETRE_PER_HOUR" | "customfield.unit.KILOPASCAL" | "customfield.unit.KILOWATT" | "customfield.unit.KILOWATT_HOUR" | "customfield.unit.LITRE" | "customfield.unit.LITRES_PER_HOUR" | "customfield.unit.METRE" | "customfield.unit.METRE_PER_SECOND" | "customfield.unit.METRE_PER_SECOND_SQUARED" | "customfield.unit.METRIC_TON" | "customfield.unit.MILE" | "customfield.unit.MILE_PER_HOUR" | "customfield.unit.MILLIMETRE" | "customfield.unit.MILLISECOND" | "customfield.unit.MINUTE" | "customfield.unit.MONTH" | "customfield.unit.NEWTON" | "customfield.unit.OUNCE" | "customfield.unit.PASCAL" | "customfield.unit.PERCENT" | "customfield.unit.POUND" | "customfield.unit.POUND_PER_HOUR" | "customfield.unit.POUND_PER_SECOND" | "customfield.unit.POUND_PER_SQUARE_INCH" | "customfield.unit.REVOLUTIONS_PER_MINUTE" | "customfield.unit.SECOND" | "customfield.unit.SQUARE_FOOT" | "customfield.unit.SQUARE_KILOMETRE" | "customfield.unit.SQUARE_METRE" | "customfield.unit.TON" | "customfield.unit.US_TON" | "customfield.unit.VOLT" | "customfield.unit.VOLT_AMPERE" | "customfield.unit.WATT" | "customfield.unit.WEEK" | "customfield.unit.YARD" | "customfield.unit.YEAR">, import("i18next").i18n, boolean] & {
-    t: TransForLibs<"customfield.unit.ACRE" | "customfield.unit.AMPERE" | "customfield.unit.AMPERE_HOUR" | "customfield.unit.ARE" | "customfield.unit.BAR" | "customfield.unit.CELSIUS" | "customfield.unit.CENTIMETRE" | "customfield.unit.CUBIC_FOOT" | "customfield.unit.CUBIC_METRE" | "customfield.unit.DAY" | "customfield.unit.DEGREE_ANGLE" | "customfield.unit.FAHRENHEIT" | "customfield.unit.FOOT" | "customfield.unit.G_FORCE" | "customfield.unit.GALLON_LIQUID" | "customfield.unit.GALLONS_PER_HOUR" | "customfield.unit.GRAM" | "customfield.unit.HECTARE" | "customfield.unit.HERTZ" | "customfield.unit.HOUR" | "customfield.unit.INCH" | "customfield.unit.INCHES_OF_WATER" | "customfield.unit.KILOGRAM" | "customfield.unit.KILOGRAM_PER_HOUR" | "customfield.unit.KILOGRAM_PER_SECOND" | "customfield.unit.KILOMETRE" | "customfield.unit.KILOMETRE_PER_HOUR" | "customfield.unit.KILOPASCAL" | "customfield.unit.KILOWATT" | "customfield.unit.KILOWATT_HOUR" | "customfield.unit.LITRE" | "customfield.unit.LITRES_PER_HOUR" | "customfield.unit.METRE" | "customfield.unit.METRE_PER_SECOND" | "customfield.unit.METRE_PER_SECOND_SQUARED" | "customfield.unit.METRIC_TON" | "customfield.unit.MILE" | "customfield.unit.MILE_PER_HOUR" | "customfield.unit.MILLIMETRE" | "customfield.unit.MILLISECOND" | "customfield.unit.MINUTE" | "customfield.unit.MONTH" | "customfield.unit.NEWTON" | "customfield.unit.OUNCE" | "customfield.unit.PASCAL" | "customfield.unit.PERCENT" | "customfield.unit.POUND" | "customfield.unit.POUND_PER_HOUR" | "customfield.unit.POUND_PER_SECOND" | "customfield.unit.POUND_PER_SQUARE_INCH" | "customfield.unit.REVOLUTIONS_PER_MINUTE" | "customfield.unit.SECOND" | "customfield.unit.SQUARE_FOOT" | "customfield.unit.SQUARE_KILOMETRE" | "customfield.unit.SQUARE_METRE" | "customfield.unit.TON" | "customfield.unit.US_TON" | "customfield.unit.VOLT" | "customfield.unit.VOLT_AMPERE" | "customfield.unit.WATT" | "customfield.unit.WEEK" | "customfield.unit.YARD" | "customfield.unit.YEAR">;
+export declare const useTranslation: () => [TransForLibs<"customfield.stringlistfield.add" | "customfield.stringlistfield.addField.Heading" | "customfield.stringlistfield.addField.InputPlaceholder" | "customfield.stringlistfield.deleteField.Heading" | "customfield.stringlistfield.deleteField.Message" | "customfield.stringlistfield.deleteField.PrimaryActionLabel" | "customfield.stringlistfield.deleteField.SecondaryActionLabel" | "customfield.stringlistfield.discard" | "customfield.stringlistfield.noValuesAddedYet" | "customfield.unit.ACRE" | "customfield.unit.AMPERE" | "customfield.unit.AMPERE_HOUR" | "customfield.unit.ARE" | "customfield.unit.BAR" | "customfield.unit.CELSIUS" | "customfield.unit.CENTIMETRE" | "customfield.unit.CUBIC_FOOT" | "customfield.unit.CUBIC_METRE" | "customfield.unit.DAY" | "customfield.unit.DEGREE_ANGLE" | "customfield.unit.FAHRENHEIT" | "customfield.unit.FOOT" | "customfield.unit.G_FORCE" | "customfield.unit.GALLON_LIQUID" | "customfield.unit.GALLONS_PER_HOUR" | "customfield.unit.GRAM" | "customfield.unit.HECTARE" | "customfield.unit.HERTZ" | "customfield.unit.HOUR" | "customfield.unit.INCH" | "customfield.unit.INCHES_OF_WATER" | "customfield.unit.KILOGRAM" | "customfield.unit.KILOGRAM_PER_HOUR" | "customfield.unit.KILOGRAM_PER_SECOND" | "customfield.unit.KILOMETRE" | "customfield.unit.KILOMETRE_PER_HOUR" | "customfield.unit.KILOPASCAL" | "customfield.unit.KILOWATT" | "customfield.unit.KILOWATT_HOUR" | "customfield.unit.LITRE" | "customfield.unit.LITRES_PER_HOUR" | "customfield.unit.METRE" | "customfield.unit.METRE_PER_SECOND" | "customfield.unit.METRE_PER_SECOND_SQUARED" | "customfield.unit.METRIC_TON" | "customfield.unit.MILE" | "customfield.unit.MILE_PER_HOUR" | "customfield.unit.MILLIMETRE" | "customfield.unit.MILLISECOND" | "customfield.unit.MINUTE" | "customfield.unit.MONTH" | "customfield.unit.NEWTON" | "customfield.unit.OUNCE" | "customfield.unit.PASCAL" | "customfield.unit.PERCENT" | "customfield.unit.POUND" | "customfield.unit.POUND_PER_HOUR" | "customfield.unit.POUND_PER_SECOND" | "customfield.unit.POUND_PER_SQUARE_INCH" | "customfield.unit.REVOLUTIONS_PER_MINUTE" | "customfield.unit.SECOND" | "customfield.unit.SQUARE_FOOT" | "customfield.unit.SQUARE_KILOMETRE" | "customfield.unit.SQUARE_METRE" | "customfield.unit.TON" | "customfield.unit.US_TON" | "customfield.unit.VOLT" | "customfield.unit.VOLT_AMPERE" | "customfield.unit.WATT" | "customfield.unit.WEEK" | "customfield.unit.YARD" | "customfield.unit.YEAR">, import("i18next").i18n, boolean] & {
+    t: TransForLibs<"customfield.stringlistfield.add" | "customfield.stringlistfield.addField.Heading" | "customfield.stringlistfield.addField.InputPlaceholder" | "customfield.stringlistfield.deleteField.Heading" | "customfield.stringlistfield.deleteField.Message" | "customfield.stringlistfield.deleteField.PrimaryActionLabel" | "customfield.stringlistfield.deleteField.SecondaryActionLabel" | "customfield.stringlistfield.discard" | "customfield.stringlistfield.noValuesAddedYet" | "customfield.unit.ACRE" | "customfield.unit.AMPERE" | "customfield.unit.AMPERE_HOUR" | "customfield.unit.ARE" | "customfield.unit.BAR" | "customfield.unit.CELSIUS" | "customfield.unit.CENTIMETRE" | "customfield.unit.CUBIC_FOOT" | "customfield.unit.CUBIC_METRE" | "customfield.unit.DAY" | "customfield.unit.DEGREE_ANGLE" | "customfield.unit.FAHRENHEIT" | "customfield.unit.FOOT" | "customfield.unit.G_FORCE" | "customfield.unit.GALLON_LIQUID" | "customfield.unit.GALLONS_PER_HOUR" | "customfield.unit.GRAM" | "customfield.unit.HECTARE" | "customfield.unit.HERTZ" | "customfield.unit.HOUR" | "customfield.unit.INCH" | "customfield.unit.INCHES_OF_WATER" | "customfield.unit.KILOGRAM" | "customfield.unit.KILOGRAM_PER_HOUR" | "customfield.unit.KILOGRAM_PER_SECOND" | "customfield.unit.KILOMETRE" | "customfield.unit.KILOMETRE_PER_HOUR" | "customfield.unit.KILOPASCAL" | "customfield.unit.KILOWATT" | "customfield.unit.KILOWATT_HOUR" | "customfield.unit.LITRE" | "customfield.unit.LITRES_PER_HOUR" | "customfield.unit.METRE" | "customfield.unit.METRE_PER_SECOND" | "customfield.unit.METRE_PER_SECOND_SQUARED" | "customfield.unit.METRIC_TON" | "customfield.unit.MILE" | "customfield.unit.MILE_PER_HOUR" | "customfield.unit.MILLIMETRE" | "customfield.unit.MILLISECOND" | "customfield.unit.MINUTE" | "customfield.unit.MONTH" | "customfield.unit.NEWTON" | "customfield.unit.OUNCE" | "customfield.unit.PASCAL" | "customfield.unit.PERCENT" | "customfield.unit.POUND" | "customfield.unit.POUND_PER_HOUR" | "customfield.unit.POUND_PER_SECOND" | "customfield.unit.POUND_PER_SQUARE_INCH" | "customfield.unit.REVOLUTIONS_PER_MINUTE" | "customfield.unit.SECOND" | "customfield.unit.SQUARE_FOOT" | "customfield.unit.SQUARE_KILOMETRE" | "customfield.unit.SQUARE_METRE" | "customfield.unit.TON" | "customfield.unit.US_TON" | "customfield.unit.VOLT" | "customfield.unit.VOLT_AMPERE" | "customfield.unit.WATT" | "customfield.unit.WEEK" | "customfield.unit.YARD" | "customfield.unit.YEAR">;
     i18n: import("i18next").i18n;
     ready: boolean;
 };