@sustaina/shared-ui 1.65.0 → 1.65.2

package/dist/index.js

@@ -4728,7 +4728,7 @@ var InputPrimitive = React__namespace.forwardRef(
         ref,
         type,
         className: cn(
-          "placeholder:text-neutral-400 text-neutral-900 flex h-10 w-full min-w-0 items-center rounded-lg border bg-white px-4 text-sm transition-colors outline-none file:inline-flex file:h-7 file:rounded-md file:border-0 file:bg-transparent file:px-2 file:text-sm file:font-medium hover:border-neutral-500 focus-visible:border-neutral-900 focus-visible:ring-0 disabled:cursor-not-allowed disabled:bg-neutral-100 disabled:text-neutral-400 disabled:border-neutral-200 aria-invalid:border-destructive",
+          "placeholder:text-sus-gray-1 placeholder:font-normal text-neutral-900 flex h-10 w-full min-w-0 items-center rounded-lg border bg-white px-4 text-sm transition-colors outline-none file:inline-flex file:h-7 file:rounded-md file:border-0 file:bg-transparent file:px-2 file:text-sm file:font-medium hover:border-neutral-500 focus-visible:border-neutral-900 focus-visible:ring-0 disabled:cursor-not-allowed disabled:bg-neutral-100 disabled:text-neutral-400 disabled:border-neutral-200 aria-invalid:border-destructive",
           className
         ),
         ...props
@@ -7204,6 +7204,10 @@ var ComboboxInner = ({
   ...props
 }, ref) => {
   const { getLabelField, getValueField } = useFieldNames_default({ fieldNames });
+  const isFocusedRef = React__namespace.useRef(false);
+  const isPopoverOpenRef = React__namespace.useRef(false);
+  const suppressNextFocusRef = React__namespace.useRef(false);
+  const lastFocusEventRef = React__namespace.useRef(null);
   const { value: openPopover, setValue: setOpenPopover } = useControllableState_default({
     defaultValue: false,
     value: open
@@ -7231,18 +7235,27 @@ var ComboboxInner = ({
     }
     return null;
   }, [
-    currentSelectedOption,
-    getLabelField,
-    placeholder2,
+    isLoading,
     selectedValue,
+    placeholder2,
+    currentSelectedOption,
     showValueWhenNoMatch,
-    isLoading,
-    loadingContent
+    loadingContent,
+    valueRender,
+    getLabelField
   ]);
+  const signalBlur = React__namespace.useCallback(() => {
+    if (!isFocusedRef.current || !lastFocusEventRef.current) return;
+    isFocusedRef.current = false;
+    suppressNextFocusRef.current = true;
+    onBlur?.(lastFocusEventRef.current);
+  }, [onBlur]);
   const handleSelect = React__namespace.useCallback(
     (selected, option) => {
       setSelectedValue(selected);
       setOpenPopover(false);
+      isPopoverOpenRef.current = false;
+      signalBlur();
       if (typeof onSelect === "function") {
         onSelect(selected, option);
       }
@@ -7250,17 +7263,43 @@ var ComboboxInner = ({
         onOpenChange(false);
       }
     },
-    [onOpenChange, onSelect, setOpenPopover, setSelectedValue]
+    [onOpenChange, onSelect, setOpenPopover, setSelectedValue, signalBlur]
   );
   const handleOpenPopover = React__namespace.useCallback(
     (isOpen) => {
       if (disabled || isLoading) return;
+      isPopoverOpenRef.current = isOpen;
       setOpenPopover(isOpen);
+      if (!isOpen) {
+        signalBlur();
+      }
       if (typeof onOpenChange === "function") {
         onOpenChange(isOpen);
       }
     },
-    [disabled, isLoading, onOpenChange, setOpenPopover]
+    [disabled, isLoading, onOpenChange, setOpenPopover, signalBlur]
+  );
+  const handleFocus = React__namespace.useCallback(
+    (event) => {
+      lastFocusEventRef.current = event;
+      if (suppressNextFocusRef.current) {
+        suppressNextFocusRef.current = false;
+        return;
+      }
+      if (isFocusedRef.current) return;
+      isFocusedRef.current = true;
+      onFocus?.(event);
+    },
+    [onFocus]
+  );
+  const handleBlur = React__namespace.useCallback(
+    (event) => {
+      if (isPopoverOpenRef.current) return;
+      if (!isFocusedRef.current) return;
+      isFocusedRef.current = false;
+      onBlur?.(event);
+    },
+    [onBlur]
   );
   const handleClear = React__namespace.useCallback(
     (event) => {
@@ -7293,8 +7332,8 @@ var ComboboxInner = ({
         "data-state": openPopover ? "open" : "closed",
         "data-loading": isLoading,
         disabled: disabled || isLoading,
-        onFocus,
-        onBlur,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
         "data-testid": `combobox-trigger-${name}`,
         ...props,
         children: [
@@ -7330,6 +7369,11 @@ var ComboboxInner = ({
         align: "start",
         sideOffset: 4,
         ...popoverContentProps,
+        onCloseAutoFocus: (event) => {
+          event.preventDefault();
+          suppressNextFocusRef.current = false;
+          popoverContentProps?.onCloseAutoFocus?.(event);
+        },
         onWheel: (e) => {
           e.stopPropagation();
           popoverContentProps?.onWheel?.(e);
@@ -7338,6 +7382,9 @@ var ComboboxInner = ({
           "p-0 w-(--radix-popper-anchor-width) min-w-(--radix-popper-anchor-width) max-w-(--radix-popper-available-width) rounded-md",
           popoverContentProps?.className
         ),
+        onInteractOutside: (event) => {
+          popoverContentProps?.onInteractOutside?.(event);
+        },
         children: virtual ? /* @__PURE__ */ jsxRuntime.jsx(
           VirtualizedCommand_default,
           {
@@ -12656,7 +12703,7 @@ function TextArea({ className, autoResize = true, ...props }) {
     {
       "data-slot": "textarea",
       className: cn(
-        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "border-input placeholder:text-sus-gray-1 focus-visible:border-neutral-900 focus-visible:ring-0 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         autoResize ? "field-sizing-content min-h-16" : "field-sizing-fixed",
         className
       ),