@trackunit/react-form-components 1.18.27 → 1.20.6

package/index.cjs.js

@@ -1494,7 +1494,7 @@ const useMultiMeasure = ({ skip = false, onChange } = {}) => {
         refCallbacksRef.current.set(index, callback);
         return callback;
     }, [skip]);
-    return { geometries, getRef };
+    return react.useMemo(() => ({ geometries, getRef }), [geometries, getRef]);
 };
 
 const DEFAULT_STATE = {
@@ -3631,35 +3631,51 @@ RadioGroup.displayName = "RadioGroup";
  * @param {RadioItemProps} props - The props for the RadioItem component
  * @returns {ReactElement} RadioItem component
  */
-const RadioItem = ({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, ...rest }) => {
+const RadioItem = ({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, checked = undefined, disabled = false, name, onChange, readOnly = undefined, ...rest }) => {
     const groupCtx = react.useContext(RadioGroupContext);
+    const hasGroupContext = groupCtx !== null;
     const isChecked = groupCtx?.value === value;
+    const isRenderedChecked = hasGroupContext ? isChecked : checked === true;
+    const isDisabled = groupCtx?.disabled ?? disabled;
+    const isStandaloneChecked = !hasGroupContext && checked !== undefined;
+    const shouldRenderReadOnly = readOnly ?? (isStandaloneChecked && onChange === undefined);
     // Empty string is treated as "no selection" to allow tabbing into the group when no radio is checked
     const hasGroupValue = groupCtx?.value !== undefined && groupCtx.value !== "";
     const inputRef = react.useRef(null);
-    const wasCheckedRef = react.useRef(isChecked);
+    const wasCheckedRef = react.useRef(isRenderedChecked);
     const { ref: labelRef, isTextTruncated: isLabelTruncated } = reactComponents.useIsTextTruncated();
     const { ref: descriptionRef, isTextTruncated: isDescriptionTruncated } = reactComponents.useIsTextTruncated();
-    const descriptionId = description ? `${groupCtx?.id}-${value}-description` : undefined;
-    const inputId = `${groupCtx?.id}-${value}`;
+    const descriptionId = description && hasGroupContext ? `${groupCtx.id}-${value}-description` : undefined;
+    const inputId = hasGroupContext ? `${groupCtx.id}-${value}` : undefined;
     const hasLabel = label !== undefined && label !== null && label !== "";
     // Restore focus after React re-render when this radio becomes checked via arrow keys
     react.useEffect(() => {
-        if (isChecked && !wasCheckedRef.current) {
+        if (isRenderedChecked && !wasCheckedRef.current) {
             inputRef.current?.focus();
         }
-        wasCheckedRef.current = isChecked;
-    }, [isChecked]);
+        wasCheckedRef.current = isRenderedChecked;
+    }, [isRenderedChecked]);
     return (jsxRuntime.jsxs("label", { className: hasLabel
             ? cvaBinaryControlWrapper({ className })
-            : `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, ref: ref, children: [jsxRuntime.jsx("input", { "aria-describedby": descriptionId, checked: isChecked, className: cvaRadioItem({
-                    checked: isChecked,
-                    disabled: groupCtx?.disabled,
+            : `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, ref: ref, children: [jsxRuntime.jsx("input", { "aria-describedby": descriptionId, checked: isRenderedChecked, className: cvaRadioItem({
+                    checked: isRenderedChecked,
+                    disabled: isDisabled,
                     invalid: groupCtx?.isInvalid,
-                }), "data-testid": dataTestId, id: inputId, name: groupCtx?.name, onChange: groupCtx?.onChange, ref: inputRef, tabIndex: tabIndex ?? (groupCtx?.disabled ? -1 : isChecked ? 0 : hasGroupValue ? -1 : 0), type: "radio", value: value, ...rest }), hasLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlLabelTooltip(), children: jsxRuntime.jsx("span", { className: cvaLabel({
+                }), "data-testid": dataTestId, disabled: isDisabled, id: inputId, name: groupCtx?.name ?? name, onChange: groupCtx?.onChange ?? onChange, readOnly: shouldRenderReadOnly, ref: inputRef, tabIndex: tabIndex ?? (isDisabled ? -1 : isRenderedChecked ? 0 : hasGroupValue ? -1 : 0), type: "radio", value: value, ...rest }), hasLabel ? (jsxRuntime.jsx(reactComponents.Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlLabelTooltip(), children: jsxRuntime.jsx("span", { className: cvaLabel({
                             invalid: groupCtx?.isInvalid,
-                            disabled: groupCtx?.disabled,
-                        }), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }) }, "tooltip-" + rest.name)) : null, suffix !== undefined && suffix !== null && suffix !== "" ? (jsxRuntime.jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsxRuntime.jsx(reactComponents.Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlDescriptionTooltip(), 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] }));
+                            disabled: isDisabled,
+                        }), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }) }, "tooltip-" + (groupCtx?.name ?? name))) : null, suffix !== undefined && suffix !== null && suffix !== "" ? (jsxRuntime.jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsxRuntime.jsx(reactComponents.Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsxRuntime.jsx("span", { className: cvaBinaryControlDescriptionTooltip(), children: jsxRuntime.jsx("span", { className: cvaBinaryControlDescription({ disabled: isDisabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }) }, "description-tooltip-" + (groupCtx?.name ?? name))) : null] }));
+};
+
+/**
+ * Returns whether the provided radio value matches the current RadioGroup selection.
+ *
+ * @param {string | number} value - The radio item's value
+ * @returns {boolean} True when the current RadioGroup context is checked for the provided value
+ */
+const useRadioItemChecked = (value) => {
+    const radioGroupContext = react.useContext(RadioGroupContext);
+    return radioGroupContext?.value === value;
 };
 
 const cvaTimeRange = cssClassVarianceUtilities.cvaMerge([
@@ -4834,7 +4850,7 @@ const useGetPhoneValidationRules = () => {
             }
             : defaultRules;
     }, [t]);
-    return { getPhoneNumberValidationRules };
+    return react.useMemo(() => ({ getPhoneNumberValidationRules }), [getPhoneNumberValidationRules]);
 };
 
 /**
@@ -4843,15 +4859,13 @@ const useGetPhoneValidationRules = () => {
  *  @property {Function} getPhoneNumber - A function for get formatted phone number with country code and plus sign
  */
 const usePhoneInput = () => {
-    const getPhoneNumber = ({ country, phone }) => {
+    const getPhoneNumber = react.useCallback(({ country, phone }) => {
         if (country) {
             return getPhoneNumberWithPlus(`${country}${phone || ""}`);
         }
         return phone || "";
-    };
-    return {
-        getPhoneNumber,
-    };
+    }, []);
+    return react.useMemo(() => ({ getPhoneNumber }), [getPhoneNumber]);
 };
 
 /**
@@ -5010,6 +5024,7 @@ exports.useCreatableSelect = useCreatableSelect;
 exports.useCustomComponents = useCustomComponents;
 exports.useGetPhoneValidationRules = useGetPhoneValidationRules;
 exports.usePhoneInput = usePhoneInput;
+exports.useRadioItemChecked = useRadioItemChecked;
 exports.useSelect = useSelect;
 exports.useZodValidators = useZodValidators;
 exports.validateEmailAddress = validateEmailAddress;

package/index.esm.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { registerTranslations, useNamespaceTranslation, NamespaceTrans } from '@trackunit/i18n-library-translation';
 import { Temporal, toDateUtil, startOfDayUtil } from '@trackunit/date-and-time-utils';
 import { IconButton, Icon, Tooltip, Popover, PopoverTrigger, PopoverContent, Button, cvaMenu, cvaMenuList, Tag, useIsTextTruncated, ZStack, MenuItem, useMeasure, useDebounce, useMergeRefs, Spinner, useScrollBlock, Text, Heading, useIsFirstRender } from '@trackunit/react-components';
-import { useRef, useEffect, useImperativeHandle, useState, useCallback, cloneElement, isValidElement, useLayoutEffect, useReducer, useMemo, createContext, useContext, useId } from 'react';
+import { useRef, useEffect, useImperativeHandle, useState, useCallback, cloneElement, isValidElement, useLayoutEffect, useMemo, useReducer, createContext, useContext, useId } from 'react';
 import ReactCalendar from 'react-calendar';
 import { twMerge } from 'tailwind-merge';
 import { themeSpacing } from '@trackunit/ui-design-tokens';
@@ -1493,7 +1493,7 @@ const useMultiMeasure = ({ skip = false, onChange } = {}) => {
         refCallbacksRef.current.set(index, callback);
         return callback;
     }, [skip]);
-    return { geometries, getRef };
+    return useMemo(() => ({ geometries, getRef }), [geometries, getRef]);
 };
 
 const DEFAULT_STATE = {
@@ -3630,35 +3630,51 @@ RadioGroup.displayName = "RadioGroup";
  * @param {RadioItemProps} props - The props for the RadioItem component
  * @returns {ReactElement} RadioItem component
  */
-const RadioItem = ({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, ...rest }) => {
+const RadioItem = ({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, checked = undefined, disabled = false, name, onChange, readOnly = undefined, ...rest }) => {
     const groupCtx = useContext(RadioGroupContext);
+    const hasGroupContext = groupCtx !== null;
     const isChecked = groupCtx?.value === value;
+    const isRenderedChecked = hasGroupContext ? isChecked : checked === true;
+    const isDisabled = groupCtx?.disabled ?? disabled;
+    const isStandaloneChecked = !hasGroupContext && checked !== undefined;
+    const shouldRenderReadOnly = readOnly ?? (isStandaloneChecked && onChange === undefined);
     // Empty string is treated as "no selection" to allow tabbing into the group when no radio is checked
     const hasGroupValue = groupCtx?.value !== undefined && groupCtx.value !== "";
     const inputRef = useRef(null);
-    const wasCheckedRef = useRef(isChecked);
+    const wasCheckedRef = useRef(isRenderedChecked);
     const { ref: labelRef, isTextTruncated: isLabelTruncated } = useIsTextTruncated();
     const { ref: descriptionRef, isTextTruncated: isDescriptionTruncated } = useIsTextTruncated();
-    const descriptionId = description ? `${groupCtx?.id}-${value}-description` : undefined;
-    const inputId = `${groupCtx?.id}-${value}`;
+    const descriptionId = description && hasGroupContext ? `${groupCtx.id}-${value}-description` : undefined;
+    const inputId = hasGroupContext ? `${groupCtx.id}-${value}` : undefined;
     const hasLabel = label !== undefined && label !== null && label !== "";
     // Restore focus after React re-render when this radio becomes checked via arrow keys
     useEffect(() => {
-        if (isChecked && !wasCheckedRef.current) {
+        if (isRenderedChecked && !wasCheckedRef.current) {
             inputRef.current?.focus();
         }
-        wasCheckedRef.current = isChecked;
-    }, [isChecked]);
+        wasCheckedRef.current = isRenderedChecked;
+    }, [isRenderedChecked]);
     return (jsxs("label", { className: hasLabel
             ? cvaBinaryControlWrapper({ className })
-            : `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, ref: ref, children: [jsx("input", { "aria-describedby": descriptionId, checked: isChecked, className: cvaRadioItem({
-                    checked: isChecked,
-                    disabled: groupCtx?.disabled,
+            : `inline-flex w-fit items-center gap-2 ${className || ""}`.trim(), "data-testid": dataTestId ? `${dataTestId}-Wrapper` : undefined, ref: ref, children: [jsx("input", { "aria-describedby": descriptionId, checked: isRenderedChecked, className: cvaRadioItem({
+                    checked: isRenderedChecked,
+                    disabled: isDisabled,
                     invalid: groupCtx?.isInvalid,
-                }), "data-testid": dataTestId, id: inputId, name: groupCtx?.name, onChange: groupCtx?.onChange, ref: inputRef, tabIndex: tabIndex ?? (groupCtx?.disabled ? -1 : isChecked ? 0 : hasGroupValue ? -1 : 0), type: "radio", value: value, ...rest }), hasLabel ? (jsx(Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsx("span", { className: cvaBinaryControlLabelTooltip(), children: jsx("span", { className: cvaLabel({
+                }), "data-testid": dataTestId, disabled: isDisabled, id: inputId, name: groupCtx?.name ?? name, onChange: groupCtx?.onChange ?? onChange, readOnly: shouldRenderReadOnly, ref: inputRef, tabIndex: tabIndex ?? (isDisabled ? -1 : isRenderedChecked ? 0 : hasGroupValue ? -1 : 0), type: "radio", value: value, ...rest }), hasLabel ? (jsx(Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Label-Tooltip` : undefined, disabled: !isLabelTruncated, label: label, placement: "top", children: jsx("span", { className: cvaBinaryControlLabelTooltip(), children: jsx("span", { className: cvaLabel({
                             invalid: groupCtx?.isInvalid,
-                            disabled: groupCtx?.disabled,
-                        }), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }) }, "tooltip-" + rest.name)) : null, suffix !== undefined && suffix !== null && suffix !== "" ? (jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsx(Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsx("span", { className: cvaBinaryControlDescriptionTooltip(), 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] }));
+                            disabled: isDisabled,
+                        }), "data-testid": dataTestId ? `${dataTestId}-Label` : undefined, ref: labelRef, children: label }) }) }, "tooltip-" + (groupCtx?.name ?? name))) : null, suffix !== undefined && suffix !== null && suffix !== "" ? (jsx("div", { className: cvaBinaryControlSuffixContainer(), "data-testid": dataTestId ? `${dataTestId}-suffix-container` : undefined, children: suffix })) : null, description ? (jsx(Tooltip, { "data-testid": dataTestId ? `${dataTestId}-Description-Tooltip` : undefined, disabled: !isDescriptionTruncated, label: description, placement: "top", children: jsx("span", { className: cvaBinaryControlDescriptionTooltip(), children: jsx("span", { className: cvaBinaryControlDescription({ disabled: isDisabled }), "data-testid": dataTestId ? `${dataTestId}-Description` : undefined, id: descriptionId, ref: descriptionRef, children: description }) }) }, "description-tooltip-" + (groupCtx?.name ?? name))) : null] }));
+};
+
+/**
+ * Returns whether the provided radio value matches the current RadioGroup selection.
+ *
+ * @param {string | number} value - The radio item's value
+ * @returns {boolean} True when the current RadioGroup context is checked for the provided value
+ */
+const useRadioItemChecked = (value) => {
+    const radioGroupContext = useContext(RadioGroupContext);
+    return radioGroupContext?.value === value;
 };
 
 const cvaTimeRange = cvaMerge([
@@ -4833,7 +4849,7 @@ const useGetPhoneValidationRules = () => {
             }
             : defaultRules;
     }, [t]);
-    return { getPhoneNumberValidationRules };
+    return useMemo(() => ({ getPhoneNumberValidationRules }), [getPhoneNumberValidationRules]);
 };
 
 /**
@@ -4842,15 +4858,13 @@ const useGetPhoneValidationRules = () => {
  *  @property {Function} getPhoneNumber - A function for get formatted phone number with country code and plus sign
  */
 const usePhoneInput = () => {
-    const getPhoneNumber = ({ country, phone }) => {
+    const getPhoneNumber = useCallback(({ country, phone }) => {
         if (country) {
             return getPhoneNumberWithPlus(`${country}${phone || ""}`);
         }
         return phone || "";
-    };
-    return {
-        getPhoneNumber,
-    };
+    }, []);
+    return useMemo(() => ({ getPhoneNumber }), [getPhoneNumber]);
 };
 
 /**
@@ -4916,4 +4930,4 @@ const useZodValidators = () => {
  */
 setupLibraryTranslations();
 
-export { ActionButton, BaseInput, BaseSelect, Checkbox, CheckboxField, ColorField, CreatableSelect, CreatableSelectField, DEFAULT_TIME, DateBaseInput, DateField, DropZone, DropZoneDefaultLabel, EMAIL_REGEX, EmailField, FormFieldSelectAdapter, FormGroup, Label, MultiSelectField, NumberBaseInput, NumberField, OptionCard, PasswordBaseInput, PasswordField, PhoneBaseInput, PhoneField, PhoneFieldWithController, RadioGroup, RadioItem, Schedule, ScheduleVariant, Search, SelectField, TextAreaBaseInput, TextAreaField, TextBaseInput, TextField, TimeRange, TimeRangeField, ToggleSwitch, ToggleSwitchOption, UploadField, UploadInput, UrlField, checkIfPhoneNumberHasPlus, countryCodeToFlagEmoji, cvaAccessoriesContainer, cvaActionButton, cvaActionContainer, cvaInput$1 as cvaInput, cvaInputAddon, cvaInputBase, cvaInputBaseDisabled, cvaInputBaseInvalid, cvaInputBaseReadOnly, cvaInputBaseSize, cvaInputElement, cvaInputGroup, cvaInputItemPlacementManager, cvaInputPrefix, cvaInputSuffix, cvaLabel, cvaRadioItem, cvaSelectClearIndicator, cvaSelectContainer, cvaSelectControl, cvaSelectDropdownIconContainer, cvaSelectDropdownIndicator, cvaSelectIndicatorsContainer, cvaSelectLoadingMessage, cvaSelectMenu, cvaSelectMenuList, cvaSelectMultiValue, cvaSelectNoOptionsMessage, cvaSelectPlaceholder, cvaSelectPrefixSuffix, cvaSelectSingleValue, cvaSelectValueContainer, dateToISODateUTC, getCountryAbbreviation, getPhoneNumberWithPlus, isInvalidCountryCode, isInvalidPhoneNumber, isValidHEXColor, parseDateFieldValue, parseSchedule, phoneErrorMessage, serializeSchedule, toISODateStringUTC, useCreatableSelect, useCustomComponents, useGetPhoneValidationRules, usePhoneInput, useSelect, useZodValidators, validateEmailAddress, validatePhoneNumber, weekDay };
+export { ActionButton, BaseInput, BaseSelect, Checkbox, CheckboxField, ColorField, CreatableSelect, CreatableSelectField, DEFAULT_TIME, DateBaseInput, DateField, DropZone, DropZoneDefaultLabel, EMAIL_REGEX, EmailField, FormFieldSelectAdapter, FormGroup, Label, MultiSelectField, NumberBaseInput, NumberField, OptionCard, PasswordBaseInput, PasswordField, PhoneBaseInput, PhoneField, PhoneFieldWithController, RadioGroup, RadioItem, Schedule, ScheduleVariant, Search, SelectField, TextAreaBaseInput, TextAreaField, TextBaseInput, TextField, TimeRange, TimeRangeField, ToggleSwitch, ToggleSwitchOption, UploadField, UploadInput, UrlField, checkIfPhoneNumberHasPlus, countryCodeToFlagEmoji, cvaAccessoriesContainer, cvaActionButton, cvaActionContainer, cvaInput$1 as cvaInput, cvaInputAddon, cvaInputBase, cvaInputBaseDisabled, cvaInputBaseInvalid, cvaInputBaseReadOnly, cvaInputBaseSize, cvaInputElement, cvaInputGroup, cvaInputItemPlacementManager, cvaInputPrefix, cvaInputSuffix, cvaLabel, cvaRadioItem, cvaSelectClearIndicator, cvaSelectContainer, cvaSelectControl, cvaSelectDropdownIconContainer, cvaSelectDropdownIndicator, cvaSelectIndicatorsContainer, cvaSelectLoadingMessage, cvaSelectMenu, cvaSelectMenuList, cvaSelectMultiValue, cvaSelectNoOptionsMessage, cvaSelectPlaceholder, cvaSelectPrefixSuffix, cvaSelectSingleValue, cvaSelectValueContainer, dateToISODateUTC, getCountryAbbreviation, getPhoneNumberWithPlus, isInvalidCountryCode, isInvalidPhoneNumber, isValidHEXColor, parseDateFieldValue, parseSchedule, phoneErrorMessage, serializeSchedule, toISODateStringUTC, useCreatableSelect, useCustomComponents, useGetPhoneValidationRules, usePhoneInput, useRadioItemChecked, useSelect, useZodValidators, validateEmailAddress, validatePhoneNumber, weekDay };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-form-components",
-  "version": "1.18.27",
+  "version": "1.20.6",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -9,17 +9,17 @@
   "dependencies": {
     "react-calendar": "^6.0.0",
     "react-select": "^5.10.2",
-    "@trackunit/date-and-time-utils": "1.11.91",
+    "@trackunit/date-and-time-utils": "1.11.93",
     "usehooks-ts": "^3.1.0",
     "libphonenumber-js": "^1.12.22",
     "zod": "^3.23.8",
     "tailwind-merge": "^2.0.0",
-    "@trackunit/css-class-variance-utilities": "1.11.89",
-    "@trackunit/react-components": "1.20.20",
-    "@trackunit/ui-icons": "1.11.85",
-    "@trackunit/shared-utils": "1.13.89",
-    "@trackunit/ui-design-tokens": "1.11.86",
-    "@trackunit/i18n-library-translation": "1.15.20",
+    "@trackunit/css-class-variance-utilities": "1.11.91",
+    "@trackunit/react-components": "1.21.4",
+    "@trackunit/ui-icons": "1.11.87",
+    "@trackunit/shared-utils": "1.13.91",
+    "@trackunit/ui-design-tokens": "1.11.88",
+    "@trackunit/i18n-library-translation": "1.17.4",
     "string-ts": "^2.0.0",
     "es-toolkit": "^1.39.10"
   },

package/src/components/RadioGroup/RadioItem.d.ts

@@ -25,4 +25,4 @@ export interface RadioItemProps<TValue extends string | number = string> extends
  * @param {RadioItemProps} props - The props for the RadioItem component
  * @returns {ReactElement} RadioItem component
  */
-export declare const RadioItem: <TValue extends string | number>({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, ...rest }: RadioItemProps<TValue>) => ReactElement;
+export declare const RadioItem: <TValue extends string | number>({ label, value, "data-testid": dataTestId, className, description, suffix, tabIndex, ref, checked, disabled, name, onChange, readOnly, ...rest }: RadioItemProps<TValue>) => ReactElement;

package/src/components/RadioGroup/useRadioItemChecked.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Returns whether the provided radio value matches the current RadioGroup selection.
+ *
+ * @param {string | number} value - The radio item's value
+ * @returns {boolean} True when the current RadioGroup context is checked for the provided value
+ */
+export declare const useRadioItemChecked: (value: string | number) => boolean;

package/src/index.d.ts

@@ -36,6 +36,7 @@ export * from "./components/PhoneFieldWithController/PhoneFieldWithController";
 export * from "./components/RadioGroup/RadioGroup";
 export * from "./components/RadioGroup/RadioGroup.variants";
 export * from "./components/RadioGroup/RadioItem";
+export * from "./components/RadioGroup/useRadioItemChecked";
 export * from "./components/Schedule/Schedule";
 export * from "./components/Schedule/ScheduleParser";
 export * from "./components/Search/Search";

package/translation.cjs12.js

@@ -7,7 +7,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Это поле является обязательным",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Применить",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Отмена",
 	"dateField.actions.clear": "Очистить",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Перетаскивание ввода файла",

package/translation.cjs17.js

@@ -6,7 +6,7 @@ var translation = {
 	"colorField.error.INVALID_HEX_CODE": "Please enter a valid color before continuing.",
 	"colorField.error.REQUIRED": "This field is required",
 	"colorField.tooltip": "Select color",
-	"dateField.actions.apply": "Apply",
+	"dateField.actions.apply": "นำไปใช้",
 	"dateField.actions.cancel": "ยกเลิก",
 	"dateField.actions.clear": "ล้าง",
 	"dateField.placeholder": "yyyy-mm-dd",

package/translation.cjs3.js

@@ -7,7 +7,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Toto pole je povinné",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Použít",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Zrušit",
 	"dateField.actions.clear": "Vymazat",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Přetažení vstupu do souboru",

package/translation.cjs6.js

@@ -7,7 +7,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Tämä kenttä on pakollinen",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Käytä",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Peruuta",
 	"dateField.actions.clear": "Tyhjennä",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Vedä ja pudota tiedostosyöte",

package/translation.esm12.js

@@ -5,7 +5,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Это поле является обязательным",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Применить",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Отмена",
 	"dateField.actions.clear": "Очистить",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Перетаскивание ввода файла",

package/translation.esm17.js

@@ -4,7 +4,7 @@ var translation = {
 	"colorField.error.INVALID_HEX_CODE": "Please enter a valid color before continuing.",
 	"colorField.error.REQUIRED": "This field is required",
 	"colorField.tooltip": "Select color",
-	"dateField.actions.apply": "Apply",
+	"dateField.actions.apply": "นำไปใช้",
 	"dateField.actions.cancel": "ยกเลิก",
 	"dateField.actions.clear": "ล้าง",
 	"dateField.placeholder": "yyyy-mm-dd",

package/translation.esm3.js

@@ -5,7 +5,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Toto pole je povinné",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Použít",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Zrušit",
 	"dateField.actions.clear": "Vymazat",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Přetažení vstupu do souboru",

package/translation.esm6.js

@@ -5,7 +5,7 @@ var translation = {
 	"colorField.error.REQUIRED": "Tämä kenttä on pakollinen",
 	"colorField.tooltip": "Select color",
 	"dateField.actions.apply": "Käytä",
-	"dateField.actions.cancel": "Cancel",
+	"dateField.actions.cancel": "Peruuta",
 	"dateField.actions.clear": "Tyhjennä",
 	"dateField.placeholder": "yyyy-mm-dd",
 	"dropzone.input.title": "Vedä ja pudota tiedostosyöte",