@trackunit/custom-field-components 1.13.32 → 1.13.34
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 +3 -3
- package/index.esm.js +3 -3
- package/package.json +10 -10
package/index.cjs.js
CHANGED
|
@@ -273,7 +273,7 @@ const AddStringListField = ({ id, label, isEditing, setIsEditing, onAdd, }) => {
|
|
|
273
273
|
return (jsxRuntime.jsxs(reactModal.Modal, { ...modal, "data-testid": `${id}-edit-modal`, size: "medium", children: [jsxRuntime.jsx(reactModal.ModalHeader, { heading: t("customfield.stringlistfield.addField.Heading", { label: label }), onClickClose: modal.close }), jsxRuntime.jsx(reactModal.ModalBody, { children: jsxRuntime.jsx(reactFormComponents.TextBaseInput, { "data-testid": `${id}-edit-modal-input`, onChange: e => setInputValue(e.target.value), placeholder: t("customfield.stringlistfield.addField.InputPlaceholder", { label: label }), value: inputValue }) }), jsxRuntime.jsx(reactModal.ModalFooter, { cancelLabel: t("customfield.stringlistfield.discard"), "data-testid": `${id}-edit-modal-footer`, onCancel: modal.close, primaryAction: handleAdd, primaryLabel: t("customfield.stringlistfield.add") })] }));
|
|
274
274
|
};
|
|
275
275
|
|
|
276
|
-
const StringListInput = ({ value: initialValue, onSave,
|
|
276
|
+
const StringListInput = ({ value: initialValue, onSave, onClickDelete, disabled, id, index }) => {
|
|
277
277
|
const [localValue, setLocalValue] = react.useState(initialValue);
|
|
278
278
|
react.useEffect(() => {
|
|
279
279
|
setLocalValue(initialValue);
|
|
@@ -283,7 +283,7 @@ const StringListInput = ({ value: initialValue, onSave, onDelete, disabled, id,
|
|
|
283
283
|
onSave(localValue);
|
|
284
284
|
}
|
|
285
285
|
}, [localValue, initialValue, onSave]);
|
|
286
|
-
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx(reactFormComponents.TextBaseInput, { "data-testid": `${id}-${index}-input`, disabled: disabled, onBlur: handleBlur, onChange: e => setLocalValue(e.target.value), value: localValue }), jsxRuntime.jsx(reactComponents.IconButton, { disabled: disabled, icon: jsxRuntime.jsx(reactComponents.Icon, { name: "Trash", size: "small" }), onClick:
|
|
286
|
+
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx(reactFormComponents.TextBaseInput, { "data-testid": `${id}-${index}-input`, disabled: disabled, onBlur: handleBlur, onChange: e => setLocalValue(e.target.value), value: localValue }), jsxRuntime.jsx(reactComponents.IconButton, { disabled: disabled, icon: jsxRuntime.jsx(reactComponents.Icon, { name: "Trash", size: "small" }), onClick: onClickDelete, variant: "secondary-danger" })] }));
|
|
287
287
|
};
|
|
288
288
|
/**
|
|
289
289
|
* A custom field that displays a list of strings.
|
|
@@ -314,7 +314,7 @@ const StringListField = ({ defaultValue = [], label, description, disabled, vali
|
|
|
314
314
|
handleRemoveValue(index);
|
|
315
315
|
}
|
|
316
316
|
};
|
|
317
|
-
return (jsxRuntime.jsxs(reactComponents.Card, { ...props, className: "w-full", "data-testid": dataTestId, children: [jsxRuntime.jsx(reactComponents.CardHeader, { accessories: jsxRuntime.jsx(reactComponents.Tooltip, {
|
|
317
|
+
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.jsx(StringListInput, { disabled: disabled, id: id, index: index, onClickDelete: () => handleRemoveValueConfirmation(index), onSave: newValue => handleFieldChange(index, newValue), value: value }, `${id}-${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) => {
|
|
318
318
|
field.onChange([...field.value, newItem]);
|
|
319
319
|
}, setIsEditing: setIsEditing })] }));
|
|
320
320
|
}, rules: validationRules }));
|
package/index.esm.js
CHANGED
|
@@ -271,7 +271,7 @@ const AddStringListField = ({ id, label, isEditing, setIsEditing, onAdd, }) => {
|
|
|
271
271
|
return (jsxs(Modal, { ...modal, "data-testid": `${id}-edit-modal`, size: "medium", children: [jsx(ModalHeader, { heading: t("customfield.stringlistfield.addField.Heading", { label: label }), onClickClose: modal.close }), jsx(ModalBody, { children: jsx(TextBaseInput, { "data-testid": `${id}-edit-modal-input`, onChange: e => setInputValue(e.target.value), placeholder: t("customfield.stringlistfield.addField.InputPlaceholder", { label: label }), value: inputValue }) }), jsx(ModalFooter, { cancelLabel: t("customfield.stringlistfield.discard"), "data-testid": `${id}-edit-modal-footer`, onCancel: modal.close, primaryAction: handleAdd, primaryLabel: t("customfield.stringlistfield.add") })] }));
|
|
272
272
|
};
|
|
273
273
|
|
|
274
|
-
const StringListInput = ({ value: initialValue, onSave,
|
|
274
|
+
const StringListInput = ({ value: initialValue, onSave, onClickDelete, disabled, id, index }) => {
|
|
275
275
|
const [localValue, setLocalValue] = useState(initialValue);
|
|
276
276
|
useEffect(() => {
|
|
277
277
|
setLocalValue(initialValue);
|
|
@@ -281,7 +281,7 @@ const StringListInput = ({ value: initialValue, onSave, onDelete, disabled, id,
|
|
|
281
281
|
onSave(localValue);
|
|
282
282
|
}
|
|
283
283
|
}, [localValue, initialValue, onSave]);
|
|
284
|
-
return (jsxs("div", { className: "flex items-center gap-2", children: [jsx(TextBaseInput, { "data-testid": `${id}-${index}-input`, disabled: disabled, onBlur: handleBlur, onChange: e => setLocalValue(e.target.value), value: localValue }), jsx(IconButton, { disabled: disabled, icon: jsx(Icon, { name: "Trash", size: "small" }), onClick:
|
|
284
|
+
return (jsxs("div", { className: "flex items-center gap-2", children: [jsx(TextBaseInput, { "data-testid": `${id}-${index}-input`, disabled: disabled, onBlur: handleBlur, onChange: e => setLocalValue(e.target.value), value: localValue }), jsx(IconButton, { disabled: disabled, icon: jsx(Icon, { name: "Trash", size: "small" }), onClick: onClickDelete, variant: "secondary-danger" })] }));
|
|
285
285
|
};
|
|
286
286
|
/**
|
|
287
287
|
* A custom field that displays a list of strings.
|
|
@@ -312,7 +312,7 @@ const StringListField = ({ defaultValue = [], label, description, disabled, vali
|
|
|
312
312
|
handleRemoveValue(index);
|
|
313
313
|
}
|
|
314
314
|
};
|
|
315
|
-
return (jsxs(Card, { ...props, className: "w-full", "data-testid": dataTestId, children: [jsx(CardHeader, { accessories: jsx(Tooltip, {
|
|
315
|
+
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) => (jsx(StringListInput, { disabled: disabled, id: id, index: index, onClickDelete: () => handleRemoveValueConfirmation(index), onSave: newValue => handleFieldChange(index, newValue), value: value }, `${id}-${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) => {
|
|
316
316
|
field.onChange([...field.value, newItem]);
|
|
317
317
|
}, setIsEditing: setIsEditing })] }));
|
|
318
318
|
}, rules: validationRules }));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/custom-field-components",
|
|
3
|
-
"version": "1.13.
|
|
3
|
+
"version": "1.13.34",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -10,15 +10,15 @@
|
|
|
10
10
|
"react": "19.0.0",
|
|
11
11
|
"react-hook-form": "7.62.0",
|
|
12
12
|
"react-select": "^5.10.2",
|
|
13
|
-
"@trackunit/react-form-components": "1.14.
|
|
14
|
-
"@trackunit/shared-utils": "1.13.
|
|
15
|
-
"@trackunit/custom-field-api": "1.13.
|
|
16
|
-
"@trackunit/iris-app-runtime-core": "1.13.
|
|
17
|
-
"@trackunit/react-components": "1.17.
|
|
18
|
-
"@trackunit/react-modal": "1.14.
|
|
19
|
-
"@trackunit/react-core-hooks": "1.12.
|
|
20
|
-
"@trackunit/i18n-library-translation": "1.12.
|
|
21
|
-
"@trackunit/iris-app-runtime-core-api": "1.12.
|
|
13
|
+
"@trackunit/react-form-components": "1.14.29",
|
|
14
|
+
"@trackunit/shared-utils": "1.13.44",
|
|
15
|
+
"@trackunit/custom-field-api": "1.13.32",
|
|
16
|
+
"@trackunit/iris-app-runtime-core": "1.13.27",
|
|
17
|
+
"@trackunit/react-components": "1.17.26",
|
|
18
|
+
"@trackunit/react-modal": "1.14.31",
|
|
19
|
+
"@trackunit/react-core-hooks": "1.12.28",
|
|
20
|
+
"@trackunit/i18n-library-translation": "1.12.29",
|
|
21
|
+
"@trackunit/iris-app-runtime-core-api": "1.12.25"
|
|
22
22
|
},
|
|
23
23
|
"module": "./index.esm.js",
|
|
24
24
|
"main": "./index.cjs.js",
|