@trackunit/react-form-components 0.0.168 → 0.0.170

package/index.cjs.js

@@ -284,7 +284,7 @@ const cvaLabel = cssClassVarianceUtilities.cvaMerge([
 ], {
     variants: {
         invalid: {
-            true: "text-red-600 hover:text-red-700 group-hover:text-red-700 active:text-red-700 group-active:text-red-700",
+            true: "text-red-600 hover:text-red-700 active:text-red-700 group-hover:text-red-700 group-active:text-red-700",
             false: "",
         },
         disabled: {
@@ -3162,7 +3162,7 @@ const cvaOptionCardContainer = cssClassVarianceUtilities.cvaMerge(["contents"]);
 const OptionCard = React.forwardRef((_a, ref) => {
     var { icon, heading, subheading, description, disabled, id, value, className, dataTestId } = _a, rest = __rest(_a, ["icon", "heading", "subheading", "description", "disabled", "id", "value", "className", "dataTestId"]);
     const htmlForId = id !== null && id !== void 0 ? id : "option-card-" + v4();
-    return (jsxRuntime.jsxs("div", { "data-testid": dataTestId, className: cvaOptionCardContainer(), children: [jsxRuntime.jsx("input", Object.assign({ ref: ref, id: htmlForId, type: "radio", value: value, className: "hidden peer" }, rest)), jsxRuntime.jsxs("label", { htmlFor: htmlForId, className: cvaOptionCardLabel({ className, disabled }), children: [disabled && icon && React.cloneElement(icon, { className: `${icon.props.className} text-secondary-400` }), !disabled && icon, heading && (jsxRuntime.jsx(reactComponents.Heading, { variant: "secondary", subtle: disabled, children: heading })), (subheading || description) && (jsxRuntime.jsxs("div", { className: cvaOptionCardContent(), children: [subheading && (jsxRuntime.jsx(reactComponents.Text, { weight: "thick", align: "center", subtle: disabled, children: subheading })), description && (jsxRuntime.jsx(reactComponents.Text, { type: "span", subtle: true, align: "center", children: description }))] }))] })] }));
+    return (jsxRuntime.jsxs("div", { "data-testid": dataTestId, className: cvaOptionCardContainer(), children: [jsxRuntime.jsx("input", Object.assign({ ref: ref, id: htmlForId, type: "radio", value: value, className: "peer hidden" }, rest)), jsxRuntime.jsxs("label", { htmlFor: htmlForId, className: cvaOptionCardLabel({ className, disabled }), children: [disabled && icon && React.cloneElement(icon, { className: `${icon.props.className} text-secondary-400` }), !disabled && icon, heading && (jsxRuntime.jsx(reactComponents.Heading, { variant: "secondary", subtle: disabled, children: heading })), (subheading || description) && (jsxRuntime.jsxs("div", { className: cvaOptionCardContent(), children: [subheading && (jsxRuntime.jsx(reactComponents.Text, { weight: "thick", align: "center", subtle: disabled, children: subheading })), description && (jsxRuntime.jsx(reactComponents.Text, { type: "span", subtle: true, align: "center", children: description }))] }))] })] }));
 });
 
 // This file is a workaround for a bug in web browsers' "native"
@@ -13992,7 +13992,7 @@ const cvaSelect = cssClassVarianceUtilities.cvaMerge([
 ], {
     variants: {
         invalid: {
-            true: "border-red-600 text-red-600 hover:border-red-600 focus-within:ring-red-600",
+            true: "border-red-600 text-red-600 focus-within:ring-red-600 hover:border-red-600",
             false: "",
         },
         disabled: {
@@ -14005,10 +14005,10 @@ const cvaSelect = cssClassVarianceUtilities.cvaMerge([
         disabled: false,
     },
 });
-const cvaSelectIcon = cssClassVarianceUtilities.cvaMerge("flex justify-center items-center text-slate-400 hover:text-slate-500 mr-2 cursor-pointer");
+const cvaSelectIcon = cssClassVarianceUtilities.cvaMerge("mr-2 flex cursor-pointer items-center justify-center text-slate-400 hover:text-slate-500");
 const cvaSelectPrefix = cssClassVarianceUtilities.cvaMerge(["flex", "justify-center", "items-center", "text-slate-400", "pl-2"]);
 const cvaSelectXIcon = cssClassVarianceUtilities.cvaMerge([
-    "flex justify-center items-center text-slate-400 hover:text-slate-500 mr-2 cursor-pointer",
+    "mr-2 flex cursor-pointer items-center justify-center text-slate-400 hover:text-slate-500",
     "ml-1",
 ]);
 const cvaSelectMenuList = cssClassVarianceUtilities.cvaMerge(["min-w-min", "shadow-md", "rounded-lg", "z-20", "bg-white", "p-1", "border", "border-slate-300", "gap-1", "grid"], {
@@ -14170,7 +14170,7 @@ const TagsContainer = ({ items, width = "100%", itemsGap = 5, postFix, disabled
         }
         const itemCanFit = spaceNeeded <= availableSpace;
         if (itemCanFit) {
-            return (jsxRuntime.jsx(TagWithWidth, { onWidthKnown: onWidthKnownHandler, className: "shrink-0 inline-flex", onClose: e => {
+            return (jsxRuntime.jsx(TagWithWidth, { onWidthKnown: onWidthKnownHandler, className: "inline-flex shrink-0", onClose: e => {
                     e.stopPropagation();
                     item.onClick();
                 }, color: item.disabled ? "unknown" : "primary", dataTestId: item.text, disabled: disabled, children: item.text }, item.text + index));
@@ -14229,7 +14229,7 @@ const useCustomComponents = (componentsProps, disabled, menuIsOpen, refMenuIsEna
                                 : [], postFix: searchInput, disabled: disabled })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [tags &&
                                     tags.slice(0, maxSelectedDisplayCount).map(({ props: tagProps }) => {
                                         var _a, _b;
-                                        return (jsxRuntime.jsx(reactComponents.Tag, { className: "shrink-0 inline-flex", onClose: e => {
+                                        return (jsxRuntime.jsx(reactComponents.Tag, { className: "inline-flex shrink-0", onClose: e => {
                                                 var _a, _b;
                                                 e.stopPropagation();
                                                 refMenuIsEnabled.current = false;
@@ -14574,7 +14574,7 @@ const PhoneInput = React.forwardRef((_a, ref) => {
         // the event's type is inferred as Event, which doesn't have a target property, whereas ChangeEvent does.
         onChange && onChange(event);
     }, [phoneNumber, onChange]);
-    return (jsxRuntime.jsxs("div", { className: "grid grid-cols-min-fr gap-2", "data-testid": dataTestId && `${dataTestId}-container`, children: [jsxRuntime.jsx("input", { hidden: true, id: "phone-input", "data-testid": dataTestId, value: phoneNumber, ref: hiddenInputRef, onChange: onChange, "aria-invalid": isInvalid }), jsxRuntime.jsx(CountryCodeSelect, { dataTestId: dataTestId && `${dataTestId}-countryCodeSelect`, countryCode: code, onBlur: e => {
+    return (jsxRuntime.jsxs("div", { className: "grid-cols-min-fr grid gap-2", "data-testid": dataTestId && `${dataTestId}-container`, children: [jsxRuntime.jsx("input", { hidden: true, id: "phone-input", "data-testid": dataTestId, value: phoneNumber, ref: hiddenInputRef, onChange: onChange, "aria-invalid": isInvalid }), jsxRuntime.jsx(CountryCodeSelect, { dataTestId: dataTestId && `${dataTestId}-countryCodeSelect`, countryCode: code, onBlur: e => {
                     onBlurHandler();
                 }, onChange: e => {
                     var _a;

package/index.esm.js

@@ -258,7 +258,7 @@ const cvaLabel = cvaMerge([
 ], {
     variants: {
         invalid: {
-            true: "text-red-600 hover:text-red-700 group-hover:text-red-700 active:text-red-700 group-active:text-red-700",
+            true: "text-red-600 hover:text-red-700 active:text-red-700 group-hover:text-red-700 group-active:text-red-700",
             false: "",
         },
         disabled: {
@@ -3136,7 +3136,7 @@ const cvaOptionCardContainer = cvaMerge(["contents"]);
 const OptionCard = forwardRef((_a, ref) => {
     var { icon, heading, subheading, description, disabled, id, value, className, dataTestId } = _a, rest = __rest(_a, ["icon", "heading", "subheading", "description", "disabled", "id", "value", "className", "dataTestId"]);
     const htmlForId = id !== null && id !== void 0 ? id : "option-card-" + v4();
-    return (jsxs("div", { "data-testid": dataTestId, className: cvaOptionCardContainer(), children: [jsx$1("input", Object.assign({ ref: ref, id: htmlForId, type: "radio", value: value, className: "hidden peer" }, rest)), jsxs("label", { htmlFor: htmlForId, className: cvaOptionCardLabel({ className, disabled }), children: [disabled && icon && cloneElement(icon, { className: `${icon.props.className} text-secondary-400` }), !disabled && icon, heading && (jsx$1(Heading, { variant: "secondary", subtle: disabled, children: heading })), (subheading || description) && (jsxs("div", { className: cvaOptionCardContent(), children: [subheading && (jsx$1(Text, { weight: "thick", align: "center", subtle: disabled, children: subheading })), description && (jsx$1(Text, { type: "span", subtle: true, align: "center", children: description }))] }))] })] }));
+    return (jsxs("div", { "data-testid": dataTestId, className: cvaOptionCardContainer(), children: [jsx$1("input", Object.assign({ ref: ref, id: htmlForId, type: "radio", value: value, className: "peer hidden" }, rest)), jsxs("label", { htmlFor: htmlForId, className: cvaOptionCardLabel({ className, disabled }), children: [disabled && icon && cloneElement(icon, { className: `${icon.props.className} text-secondary-400` }), !disabled && icon, heading && (jsx$1(Heading, { variant: "secondary", subtle: disabled, children: heading })), (subheading || description) && (jsxs("div", { className: cvaOptionCardContent(), children: [subheading && (jsx$1(Text, { weight: "thick", align: "center", subtle: disabled, children: subheading })), description && (jsx$1(Text, { type: "span", subtle: true, align: "center", children: description }))] }))] })] }));
 });
 
 // This file is a workaround for a bug in web browsers' "native"
@@ -13966,7 +13966,7 @@ const cvaSelect = cvaMerge([
 ], {
     variants: {
         invalid: {
-            true: "border-red-600 text-red-600 hover:border-red-600 focus-within:ring-red-600",
+            true: "border-red-600 text-red-600 focus-within:ring-red-600 hover:border-red-600",
             false: "",
         },
         disabled: {
@@ -13979,10 +13979,10 @@ const cvaSelect = cvaMerge([
         disabled: false,
     },
 });
-const cvaSelectIcon = cvaMerge("flex justify-center items-center text-slate-400 hover:text-slate-500 mr-2 cursor-pointer");
+const cvaSelectIcon = cvaMerge("mr-2 flex cursor-pointer items-center justify-center text-slate-400 hover:text-slate-500");
 const cvaSelectPrefix = cvaMerge(["flex", "justify-center", "items-center", "text-slate-400", "pl-2"]);
 const cvaSelectXIcon = cvaMerge([
-    "flex justify-center items-center text-slate-400 hover:text-slate-500 mr-2 cursor-pointer",
+    "mr-2 flex cursor-pointer items-center justify-center text-slate-400 hover:text-slate-500",
     "ml-1",
 ]);
 const cvaSelectMenuList = cvaMerge(["min-w-min", "shadow-md", "rounded-lg", "z-20", "bg-white", "p-1", "border", "border-slate-300", "gap-1", "grid"], {
@@ -14144,7 +14144,7 @@ const TagsContainer = ({ items, width = "100%", itemsGap = 5, postFix, disabled
         }
         const itemCanFit = spaceNeeded <= availableSpace;
         if (itemCanFit) {
-            return (jsx$1(TagWithWidth, { onWidthKnown: onWidthKnownHandler, className: "shrink-0 inline-flex", onClose: e => {
+            return (jsx$1(TagWithWidth, { onWidthKnown: onWidthKnownHandler, className: "inline-flex shrink-0", onClose: e => {
                     e.stopPropagation();
                     item.onClick();
                 }, color: item.disabled ? "unknown" : "primary", dataTestId: item.text, disabled: disabled, children: item.text }, item.text + index));
@@ -14203,7 +14203,7 @@ const useCustomComponents = (componentsProps, disabled, menuIsOpen, refMenuIsEna
                                 : [], postFix: searchInput, disabled: disabled })) : (jsxs(Fragment$1, { children: [tags &&
                                     tags.slice(0, maxSelectedDisplayCount).map(({ props: tagProps }) => {
                                         var _a, _b;
-                                        return (jsx$1(Tag, { className: "shrink-0 inline-flex", onClose: e => {
+                                        return (jsx$1(Tag, { className: "inline-flex shrink-0", onClose: e => {
                                                 var _a, _b;
                                                 e.stopPropagation();
                                                 refMenuIsEnabled.current = false;
@@ -14548,7 +14548,7 @@ const PhoneInput = forwardRef((_a, ref) => {
         // the event's type is inferred as Event, which doesn't have a target property, whereas ChangeEvent does.
         onChange && onChange(event);
     }, [phoneNumber, onChange]);
-    return (jsxs("div", { className: "grid grid-cols-min-fr gap-2", "data-testid": dataTestId && `${dataTestId}-container`, children: [jsx$1("input", { hidden: true, id: "phone-input", "data-testid": dataTestId, value: phoneNumber, ref: hiddenInputRef, onChange: onChange, "aria-invalid": isInvalid }), jsx$1(CountryCodeSelect, { dataTestId: dataTestId && `${dataTestId}-countryCodeSelect`, countryCode: code, onBlur: e => {
+    return (jsxs("div", { className: "grid-cols-min-fr grid gap-2", "data-testid": dataTestId && `${dataTestId}-container`, children: [jsx$1("input", { hidden: true, id: "phone-input", "data-testid": dataTestId, value: phoneNumber, ref: hiddenInputRef, onChange: onChange, "aria-invalid": isInvalid }), jsx$1(CountryCodeSelect, { dataTestId: dataTestId && `${dataTestId}-countryCodeSelect`, countryCode: code, onBlur: e => {
                     onBlurHandler();
                 }, onChange: e => {
                     var _a;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-form-components",
-  "version": "0.0.168",
+  "version": "0.0.170",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -9,7 +9,7 @@
   "dependencies": {
     "@trackunit/css-class-variance-utilities": "0.0.14",
     "@trackunit/i18n-library-translation": "0.0.86",
-    "@trackunit/react-components": "0.1.172",
+    "@trackunit/react-components": "0.1.174",
     "@trackunit/shared-utils": "0.0.11",
     "@trackunit/ui-icons": "0.0.78",
     "date-fns": "2.29.3",