@trackunit/react-form-components 1.7.57 → 1.8.4
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
|
@@ -865,7 +865,12 @@ const Checkbox = ({ className, dataTestId = "checkbox", onChange, checked = fals
|
|
|
865
865
|
const internalRef = react.useRef(null);
|
|
866
866
|
const { isTextTruncated: isLabelCutOff, ref: labelRef } = reactComponents.useIsTextTruncated();
|
|
867
867
|
const isReadonly = disabled || readOnly;
|
|
868
|
+
const hasLabel = label !== undefined && label !== null && label !== "";
|
|
868
869
|
const onKeyPress = e => {
|
|
870
|
+
if (isReadonly) {
|
|
871
|
+
e.preventDefault();
|
|
872
|
+
return;
|
|
873
|
+
}
|
|
869
874
|
if ("Space" === e.code) {
|
|
870
875
|
e.preventDefault();
|
|
871
876
|
internalRef.current?.click();
|
|
@@ -875,11 +880,13 @@ const Checkbox = ({ className, dataTestId = "checkbox", onChange, checked = fals
|
|
|
875
880
|
}
|
|
876
881
|
};
|
|
877
882
|
const uuid = rest.id;
|
|
878
|
-
return (jsxRuntime.jsxs("label", { className:
|
|
883
|
+
return (jsxRuntime.jsxs("label", { className: hasLabel
|
|
884
|
+
? cvaBinaryControlWrapper({ className })
|
|
885
|
+
: `inline-flex w-fit items-center gap-2${isReadonly ? " pointer-events-none" : ""}${className ? ` ${className}` : ""}`, "data-testid": dataTestId ? `${dataTestId}-container` : null, htmlFor: uuid, onClick: e => stopPropagation && e.stopPropagation(), onKeyDown: onKeyPress, ref: internalRef, children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("input", { "aria-checked": !indeterminate && checked, checked: !indeterminate && checked, className: cvaCheckboxInput(), "data-testid": dataTestId, disabled: disabled, id: uuid, onChange: onChange, readOnly: readOnly, ref: ref, type: "checkbox", ...rest }), jsxRuntime.jsx("span", { className: cvaCheckbox({
|
|
879
886
|
disabled: isReadonly,
|
|
880
887
|
invalid: isReadonly ? false : isInvalid,
|
|
881
888
|
state: indeterminate ? "indeterminate" : checked ? "selected" : "deselected",
|
|
882
|
-
}), id: uuid, tabIndex: isReadonly ? -1 : tabIndex, children: icon })] }),
|
|
889
|
+
}), id: uuid, tabIndex: isReadonly ? -1 : tabIndex, children: icon })] }), hasLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, { className: cvaBinaryControlLabelTooltip(), disabled: !isLabelCutOff, label: label, placement: "top", children: jsxRuntime.jsx("span", { className: cvaLabel({
|
|
883
890
|
invalid: isReadonly ? false : isInvalid,
|
|
884
891
|
disabled: isReadonly,
|
|
885
892
|
}), id: `checkbox-label-${label}`, ref: labelRef, children: label }) }, "tooltip-" + rest.name)) : null, suffix ? (jsxRuntime.jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null] }));
|
|
@@ -1725,14 +1732,17 @@ const RadioItem = ({ label, value, dataTestId, className, description, suffix, .
|
|
|
1725
1732
|
const { ref: descriptionRef, isTextTruncated: isDescriptionTruncated } = reactComponents.useIsTextTruncated();
|
|
1726
1733
|
const descriptionId = description ? `${groupCtx?.id}-${value}-description` : undefined;
|
|
1727
1734
|
const inputId = `${groupCtx?.id}-${value}`;
|
|
1728
|
-
|
|
1735
|
+
const hasLabel = label !== undefined && label !== null && label !== "";
|
|
1736
|
+
return (jsxRuntime.jsxs("label", { className: hasLabel
|
|
1737
|
+
? cvaBinaryControlWrapper({ className })
|
|
1738
|
+
: `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, htmlFor: inputId, children: [jsxRuntime.jsx("input", { "aria-describedby": descriptionId, checked: isChecked, className: cvaRadioItem({
|
|
1729
1739
|
checked: isChecked,
|
|
1730
1740
|
disabled: groupCtx?.disabled,
|
|
1731
1741
|
invalid: groupCtx?.isInvalid,
|
|
1732
|
-
}), "data-testid": dataTestId, id: inputId, onChange: groupCtx?.onChange, type: "radio", value: value, ...rest }), jsxRuntime.jsx(reactComponents.Tooltip, { className: cvaBinaryControlLabelTooltip(), dataTestId: dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsxRuntime.jsx("span", { className: cvaLabel({
|
|
1742
|
+
}), "data-testid": dataTestId, id: inputId, onChange: groupCtx?.onChange, type: "radio", value: value, ...rest }), hasLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, { className: cvaBinaryControlLabelTooltip(), dataTestId: dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsxRuntime.jsx("span", { className: cvaLabel({
|
|
1733
1743
|
invalid: groupCtx?.isInvalid,
|
|
1734
1744
|
disabled: groupCtx?.disabled,
|
|
1735
|
-
}), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }, "tooltip-" + rest.name), suffix ? (jsxRuntime.jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsxRuntime.jsx(reactComponents.Tooltip, { className: cvaBinaryControlDescriptionTooltip(), dataTestId: dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlDescription({ disabled: groupCtx?.disabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }, "description-tooltip-" + rest.name)) : null] }));
|
|
1745
|
+
}), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }, "tooltip-" + rest.name)) : null, suffix ? (jsxRuntime.jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsxRuntime.jsx(reactComponents.Tooltip, { className: cvaBinaryControlDescriptionTooltip(), dataTestId: dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlDescription({ disabled: groupCtx?.disabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }, "description-tooltip-" + rest.name)) : null] }));
|
|
1736
1746
|
};
|
|
1737
1747
|
|
|
1738
1748
|
const cvaTimeRange = cssClassVarianceUtilities.cvaMerge([
|
package/index.esm.js
CHANGED
|
@@ -864,7 +864,12 @@ const Checkbox = ({ className, dataTestId = "checkbox", onChange, checked = fals
|
|
|
864
864
|
const internalRef = useRef(null);
|
|
865
865
|
const { isTextTruncated: isLabelCutOff, ref: labelRef } = useIsTextTruncated();
|
|
866
866
|
const isReadonly = disabled || readOnly;
|
|
867
|
+
const hasLabel = label !== undefined && label !== null && label !== "";
|
|
867
868
|
const onKeyPress = e => {
|
|
869
|
+
if (isReadonly) {
|
|
870
|
+
e.preventDefault();
|
|
871
|
+
return;
|
|
872
|
+
}
|
|
868
873
|
if ("Space" === e.code) {
|
|
869
874
|
e.preventDefault();
|
|
870
875
|
internalRef.current?.click();
|
|
@@ -874,11 +879,13 @@ const Checkbox = ({ className, dataTestId = "checkbox", onChange, checked = fals
|
|
|
874
879
|
}
|
|
875
880
|
};
|
|
876
881
|
const uuid = rest.id;
|
|
877
|
-
return (jsxs("label", { className:
|
|
882
|
+
return (jsxs("label", { className: hasLabel
|
|
883
|
+
? cvaBinaryControlWrapper({ className })
|
|
884
|
+
: `inline-flex w-fit items-center gap-2${isReadonly ? " pointer-events-none" : ""}${className ? ` ${className}` : ""}`, "data-testid": dataTestId ? `${dataTestId}-container` : null, htmlFor: uuid, onClick: e => stopPropagation && e.stopPropagation(), onKeyDown: onKeyPress, ref: internalRef, children: [jsxs("div", { children: [jsx("input", { "aria-checked": !indeterminate && checked, checked: !indeterminate && checked, className: cvaCheckboxInput(), "data-testid": dataTestId, disabled: disabled, id: uuid, onChange: onChange, readOnly: readOnly, ref: ref, type: "checkbox", ...rest }), jsx("span", { className: cvaCheckbox({
|
|
878
885
|
disabled: isReadonly,
|
|
879
886
|
invalid: isReadonly ? false : isInvalid,
|
|
880
887
|
state: indeterminate ? "indeterminate" : checked ? "selected" : "deselected",
|
|
881
|
-
}), id: uuid, tabIndex: isReadonly ? -1 : tabIndex, children: icon })] }),
|
|
888
|
+
}), id: uuid, tabIndex: isReadonly ? -1 : tabIndex, children: icon })] }), hasLabel ? (jsx(Tooltip, { className: cvaBinaryControlLabelTooltip(), disabled: !isLabelCutOff, label: label, placement: "top", children: jsx("span", { className: cvaLabel({
|
|
882
889
|
invalid: isReadonly ? false : isInvalid,
|
|
883
890
|
disabled: isReadonly,
|
|
884
891
|
}), id: `checkbox-label-${label}`, ref: labelRef, children: label }) }, "tooltip-" + rest.name)) : null, suffix ? (jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null] }));
|
|
@@ -1724,14 +1731,17 @@ const RadioItem = ({ label, value, dataTestId, className, description, suffix, .
|
|
|
1724
1731
|
const { ref: descriptionRef, isTextTruncated: isDescriptionTruncated } = useIsTextTruncated();
|
|
1725
1732
|
const descriptionId = description ? `${groupCtx?.id}-${value}-description` : undefined;
|
|
1726
1733
|
const inputId = `${groupCtx?.id}-${value}`;
|
|
1727
|
-
|
|
1734
|
+
const hasLabel = label !== undefined && label !== null && label !== "";
|
|
1735
|
+
return (jsxs("label", { className: hasLabel
|
|
1736
|
+
? cvaBinaryControlWrapper({ className })
|
|
1737
|
+
: `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, htmlFor: inputId, children: [jsx("input", { "aria-describedby": descriptionId, checked: isChecked, className: cvaRadioItem({
|
|
1728
1738
|
checked: isChecked,
|
|
1729
1739
|
disabled: groupCtx?.disabled,
|
|
1730
1740
|
invalid: groupCtx?.isInvalid,
|
|
1731
|
-
}), "data-testid": dataTestId, id: inputId, onChange: groupCtx?.onChange, type: "radio", value: value, ...rest }), jsx(Tooltip, { className: cvaBinaryControlLabelTooltip(), dataTestId: dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsx("span", { className: cvaLabel({
|
|
1741
|
+
}), "data-testid": dataTestId, id: inputId, onChange: groupCtx?.onChange, type: "radio", value: value, ...rest }), hasLabel ? (jsx(Tooltip, { className: cvaBinaryControlLabelTooltip(), dataTestId: dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsx("span", { className: cvaLabel({
|
|
1732
1742
|
invalid: groupCtx?.isInvalid,
|
|
1733
1743
|
disabled: groupCtx?.disabled,
|
|
1734
|
-
}), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }, "tooltip-" + rest.name), suffix ? (jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsx(Tooltip, { className: cvaBinaryControlDescriptionTooltip(), dataTestId: dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsx("span", { className: cvaBinaryControlDescription({ disabled: groupCtx?.disabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }, "description-tooltip-" + rest.name)) : null] }));
|
|
1744
|
+
}), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }, "tooltip-" + rest.name)) : null, suffix ? (jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsx(Tooltip, { className: cvaBinaryControlDescriptionTooltip(), dataTestId: dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsx("span", { className: cvaBinaryControlDescription({ disabled: groupCtx?.disabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }, "description-tooltip-" + rest.name)) : null] }));
|
|
1735
1745
|
};
|
|
1736
1746
|
|
|
1737
1747
|
const cvaTimeRange = cvaMerge([
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-form-components",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.8.4",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -16,14 +16,14 @@
|
|
|
16
16
|
"zod": "^3.23.8",
|
|
17
17
|
"react-hook-form": "7.62.0",
|
|
18
18
|
"tailwind-merge": "^2.0.0",
|
|
19
|
-
"@trackunit/css-class-variance-utilities": "1.
|
|
20
|
-
"@trackunit/react-components": "1.
|
|
21
|
-
"@trackunit/ui-icons": "1.
|
|
22
|
-
"@trackunit/shared-utils": "1.
|
|
23
|
-
"@trackunit/ui-design-tokens": "1.
|
|
24
|
-
"@trackunit/i18n-library-translation": "1.
|
|
19
|
+
"@trackunit/css-class-variance-utilities": "1.7.4",
|
|
20
|
+
"@trackunit/react-components": "1.9.4",
|
|
21
|
+
"@trackunit/ui-icons": "1.7.4",
|
|
22
|
+
"@trackunit/shared-utils": "1.9.4",
|
|
23
|
+
"@trackunit/ui-design-tokens": "1.7.4",
|
|
24
|
+
"@trackunit/i18n-library-translation": "1.7.4",
|
|
25
25
|
"string-ts": "^2.0.0",
|
|
26
|
-
"@trackunit/react-test-setup": "1.
|
|
26
|
+
"@trackunit/react-test-setup": "1.4.4",
|
|
27
27
|
"@js-temporal/polyfill": "^0.5.1"
|
|
28
28
|
},
|
|
29
29
|
"module": "./index.esm.js",
|
|
@@ -33,7 +33,7 @@ export interface WeekSchedule {
|
|
|
33
33
|
* @param {string} scheduleString String of week schedule
|
|
34
34
|
* @returns {WeekSchedule} Week schedule range
|
|
35
35
|
*/
|
|
36
|
-
export declare const parseSchedule: (scheduleString?: string) => WeekSchedule;
|
|
36
|
+
export declare const parseSchedule: (scheduleString?: string | null) => WeekSchedule;
|
|
37
37
|
/**
|
|
38
38
|
* Serialize week schedule to string schedule
|
|
39
39
|
*
|