@rehagro/ui 1.0.37 → 1.0.39

package/dist/index.mjs

@@ -48,6 +48,8 @@ var TOKEN_MAP = {
   inputPxSm: { var: "--rh-input-px-sm", isColor: false },
   inputPxMd: { var: "--rh-input-px-md", isColor: false },
   inputPxLg: { var: "--rh-input-px-lg", isColor: false },
+  buttonHeightXxs: { var: "--rh-button-height-xxs", isColor: false },
+  buttonHeightXs: { var: "--rh-button-height-xs", isColor: false },
   buttonHeightSm: { var: "--rh-button-height-sm", isColor: false },
   buttonHeightMd: { var: "--rh-button-height-md", isColor: false },
   buttonHeightLg: { var: "--rh-button-height-lg", isColor: false },
@@ -809,6 +811,8 @@ function getArbitraryColorStyle(variant, color) {
   return { color, borderColor: "transparent" };
 }
 var sizeClasses = {
+  xxs: "rh-text-2xs rh-leading-none rh-px-1.5 rh-h-button-xxs rh-gap-1",
+  xs: "rh-text-xs rh-leading-none rh-px-2 rh-h-button-xs rh-gap-1",
   sm: "rh-text-sm rh-px-3 rh-h-button-sm",
   md: "rh-text-sm rh-px-4 rh-h-button-md",
   lg: "rh-text-base rh-px-5 rh-h-button-lg",
@@ -958,6 +962,8 @@ function getArbitraryColorStyle2(variant, color) {
   return { color, borderColor: "transparent" };
 }
 var sizeClasses2 = {
+  xxs: "rh-h-4 rh-w-4 rh-text-2xs",
+  xs: "rh-h-6 rh-w-6 rh-text-xs",
   sm: "rh-h-8 rh-w-8 rh-text-sm",
   md: "rh-h-10 rh-w-10 rh-text-base",
   lg: "rh-h-12 rh-w-12 rh-text-lg"
@@ -1094,6 +1100,9 @@ var TextInput = forwardRef(function TextInput2({
   ...rest
 }, ref) {
   const inputId = id || React9.useId();
+  const [isHelperDismissed, setIsHelperDismissed] = React9.useState(false);
+  const { onChange, ...inputProps } = rest;
+  const visualStatus = helperText && isHelperDismissed ? "default" : status;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1111,7 +1120,7 @@ var TextInput = forwardRef(function TextInput2({
               "rh-border rh-bg-surface rh-font-body",
               "rh-transition-colors rh-duration-150",
               "rh-overflow-hidden",
-              statusClasses[status],
+              statusClasses[visualStatus],
               radiusClasses3[radius],
               sizeClasses3[size],
               disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-bg-background" : "",
@@ -1135,14 +1144,18 @@ var TextInput = forwardRef(function TextInput2({
                   ref,
                   id: inputId,
                   disabled,
-                  "aria-invalid": status === "error" || void 0,
+                  "aria-invalid": visualStatus === "error" || void 0,
                   "aria-describedby": helperText ? `${inputId}-helper` : void 0,
                   className: [
                     "rh-flex-1 rh-min-w-0 rh-bg-transparent rh-outline-none",
                     "rh-text-text placeholder:rh-text-text-muted",
                     disabled ? "rh-cursor-not-allowed" : ""
                   ].filter(Boolean).join(" "),
-                  ...rest
+                  onChange: (e) => {
+                    if (helperText) setIsHelperDismissed(true);
+                    onChange?.(e);
+                  },
+                  ...inputProps
                 }
               ),
               rightIcon && /* @__PURE__ */ jsx(
@@ -1159,13 +1172,13 @@ var TextInput = forwardRef(function TextInput2({
             ]
           }
         ),
-        helperText && /* @__PURE__ */ jsxs(
+        helperText && !isHelperDismissed && /* @__PURE__ */ jsxs(
           "span",
           {
             id: `${inputId}-helper`,
             className: [
               "rh-flex rh-items-center rh-gap-1 rh-text-xs",
-              helperStatusClasses[status]
+              helperStatusClasses[visualStatus]
             ].join(" "),
             children: [
               /* @__PURE__ */ jsx(WarningCircleIcon, {}),
@@ -1553,6 +1566,8 @@ var Select = forwardRef(function Select2(props, ref) {
   const helperId = React9.useId();
   const [isOpen, setIsOpen] = React9.useState(false);
   const [activeIndex, setActiveIndex] = React9.useState(-1);
+  const [isHelperDismissed, setIsHelperDismissed] = React9.useState(false);
+  React9.useRef({ query: "", lastAt: 0 });
   const wrapperRef = React9.useRef(null);
   const innerRef = React9.useRef(null);
   const listboxRef = React9.useRef(null);
@@ -1566,7 +1581,9 @@ var Select = forwardRef(function Select2(props, ref) {
   const isControlled = props.value !== void 0;
   const selectedValues = isControlled ? Array.isArray(props.value) ? props.value : props.value !== void 0 ? [props.value] : [] : internalValue;
   const enabledOptions = options.filter((o) => !o.disabled);
+  const visualStatus = helperText && isHelperDismissed ? "default" : status;
   const handleSelect = (optionValue) => {
+    if (helperText) setIsHelperDismissed(true);
     if (multiple) {
       const next = selectedValues.includes(optionValue) ? selectedValues.filter((v) => v !== optionValue) : [...selectedValues, optionValue];
       if (!isControlled) setInternalValue(next);
@@ -1716,7 +1733,7 @@ var Select = forwardRef(function Select2(props, ref) {
             "aria-controls": listboxId,
             "aria-labelledby": label ? `${triggerId}-label` : void 0,
             "aria-describedby": helperText ? helperId : void 0,
-            "aria-invalid": status === "error" || void 0,
+            "aria-invalid": visualStatus === "error" || void 0,
             "aria-disabled": disabled || void 0,
             disabled,
             onClick: () => !disabled && setIsOpen((o) => !o),
@@ -1726,7 +1743,7 @@ var Select = forwardRef(function Select2(props, ref) {
               "rh-border rh-bg-surface rh-font-body",
               "rh-transition-colors rh-duration-150",
               "rh-text-left rh-w-full",
-              statusClasses2[status],
+              statusClasses2[visualStatus],
               radiusClasses4[radius],
               sizeClasses5[size],
               disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-bg-background" : "rh-cursor-pointer",
@@ -1819,13 +1836,13 @@ var Select = forwardRef(function Select2(props, ref) {
             })
           }
         ),
-        helperText && /* @__PURE__ */ jsxs(
+        helperText && !isHelperDismissed && /* @__PURE__ */ jsxs(
           "span",
           {
             id: helperId,
             className: [
               "rh-flex rh-items-center rh-gap-1 rh-text-xs",
-              helperStatusClasses2[status]
+              helperStatusClasses2[visualStatus]
             ].join(" "),
             children: [
               /* @__PURE__ */ jsx(WarningCircleIcon, {}),