@sproutsocial/seeds-react-menu 1.8.5 → 1.9.2

package/.turbo/turbo-build.log

@@ -3,27 +3,27 @@ $ tsup --dts
 CLI Building entry: {"index":"src/index.ts","v2/index":"src/v2/index.ts"}
 CLI Using tsconfig: tsconfig.json
 CLI tsup v8.5.0
-CLI Using tsup config: /home/runner/work/seeds/seeds/seeds-react/seeds-react-menu/tsup.config.ts
+CLI Using tsup config: /home/runner/_work/seeds/seeds/seeds-react/seeds-react-menu/tsup.config.ts
 CLI Target: es2022
 CLI Cleaning output folder
 CJS Build start
 ESM Build start
 CJS dist/index.js        90.52 KB
-CJS dist/v2/index.js     71.41 KB
+CJS dist/v2/index.js     72.63 KB
 CJS dist/index.js.map    176.37 KB
-CJS dist/v2/index.js.map 148.47 KB
-CJS ⚡️ Build success in 380ms
+CJS dist/v2/index.js.map 151.20 KB
+CJS ⚡️ Build success in 65ms
 ESM dist/esm/index.js              71.41 KB
-ESM dist/esm/v2/index.js           60.86 KB
 ESM dist/esm/chunk-ROQATIB7.js     9.15 KB
+ESM dist/esm/v2/index.js           62.08 KB
 ESM dist/esm/index.js.map          152.38 KB
-ESM dist/esm/v2/index.js.map       128.83 KB
 ESM dist/esm/chunk-ROQATIB7.js.map 22.93 KB
-ESM ⚡️ Build success in 381ms
+ESM dist/esm/v2/index.js.map       131.58 KB
+ESM ⚡️ Build success in 65ms
 DTS Build start
-DTS ⚡️ Build success in 17567ms
+DTS ⚡️ Build success in 4976ms
 DTS dist/index.d.ts     39.04 KB
-DTS dist/v2/index.d.ts  4.87 KB
+DTS dist/v2/index.d.ts  5.43 KB
 DTS dist/index.d.mts    39.04 KB
-DTS dist/v2/index.d.mts 4.87 KB
-Done in 19.14s.
+DTS dist/v2/index.d.mts 5.43 KB
+Done in 5.66s.

package/CHANGELOG.md

@@ -1,5 +1,69 @@
 # @sproutsocial/seeds-react-menu
 
+## 1.9.2
+
+### Patch Changes
+
+- Updated dependencies [7d54d67]
+  - @sproutsocial/seeds-react-button@1.4.0
+  - @sproutsocial/seeds-react-popout@2.4.28
+  - @sproutsocial/seeds-react-input@1.5.7
+  - @sproutsocial/seeds-react-token-input@1.4.28
+
+## 1.9.1
+
+### Patch Changes
+
+- b3d31ac: Clear MultiAutocomplete input text when the popout closes
+- c281089: Fix popoutPlacement="top" rendering the popout invisible
+- Updated dependencies [17d4f12]
+  - @sproutsocial/seeds-react-theme@3.6.0
+  - @sproutsocial/seeds-react-box@1.1.14
+  - @sproutsocial/seeds-react-icon@2.2.5
+  - @sproutsocial/seeds-react-label@1.0.14
+  - @sproutsocial/seeds-react-token-input@1.4.27
+  - @sproutsocial/seeds-react-checkbox@1.3.24
+  - @sproutsocial/seeds-react-input@1.5.6
+  - @sproutsocial/seeds-react-popout@2.4.27
+  - @sproutsocial/seeds-react-button@1.3.20
+  - @sproutsocial/seeds-react-switch@1.2.23
+  - @sproutsocial/seeds-react-radio@1.3.14
+
+## 1.9.0
+
+### Minor Changes
+
+- 2194620: Fixed scroll bar mouse handling bugs in AutoComplete V2
+
+## 1.8.7
+
+### Patch Changes
+
+- fe24df3: Enable `Select` component consumers to control popoutProps
+  - @sproutsocial/seeds-react-button@1.3.19
+  - @sproutsocial/seeds-react-checkbox@1.3.23
+  - @sproutsocial/seeds-react-input@1.5.5
+  - @sproutsocial/seeds-react-radio@1.3.13
+  - @sproutsocial/seeds-react-switch@1.2.22
+  - @sproutsocial/seeds-react-token-input@1.4.26
+  - @sproutsocial/seeds-react-popout@2.4.26
+
+## 1.8.6
+
+### Patch Changes
+
+- 4f91ec2: Expose onPointerDownOutside and onInteractOutside on all v2 menu components
+
+  Adds `onPointerDownOutside` and `onInteractOutside` props to `BaseSelectProps`,
+  making them available on all v2 components: `MultiAutocomplete`, `SingleAutocomplete`,
+  `MultiSelect`, `SingleSelect`, `SearchableSelect`, and `SearchableMultiSelect`.
+
+  These props are forwarded to the internal `Popout`/`Popover.Content`, enabling
+  consumers to call `event.preventDefault()` to prevent the popout from dismissing
+  when a pointer-down event occurs outside — critical for fixing the Radix
+  DismissableLayer conflict that causes a nested `flushSync` crash when any of these
+  components are used inside a `ModalV2` (Dialog).
+
 ## 1.8.5
 
 ### Patch Changes

package/dist/esm/v2/index.js

@@ -217,8 +217,21 @@ function Popout({
   const popoverOnOpenChange = isControlled ? onOpenChange : handleOpenChange;
   const radixRef = React2.useRef(null);
   return /* @__PURE__ */ jsxs(Popover.Root, { open: popoverOpen, onOpenChange: popoverOnOpenChange, children: [
-    /* @__PURE__ */ jsx(Popover.Trigger, { ref: radixRef, asChild: true, children }),
-    /* @__PURE__ */ jsx(Popover.Anchor, { children: /* @__PURE__ */ jsx("div", { style: { height: "1px" }, children: "\xA0" }) }),
+    /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ jsx(Popover.Trigger, { ref: radixRef, asChild: true, children }),
+      /* @__PURE__ */ jsx(
+        Popover.Anchor,
+        {
+          style: {
+            position: "absolute",
+            top: side === "top" ? 0 : "100%",
+            left: 0,
+            right: 0,
+            height: "1px"
+          }
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(
       StyledContent,
       {
@@ -608,7 +621,8 @@ var VirtualizedComboboxContent = ({
     {
       style: {
         height: `${rowVirtualizer.getTotalSize()}px`,
-        position: "relative"
+        position: "relative",
+        overflow: "hidden"
       },
       children: /* @__PURE__ */ jsx6(
         "div",
@@ -936,7 +950,10 @@ function SingleSelect({
   triggerButtonProps,
   menuProps,
   inputType = "icon",
-  removePlaceholderItem = false
+  removePlaceholderItem = false,
+  onPointerDownOutside,
+  onInteractOutside,
+  popoutPlacement
 }) {
   const [uncontrolledSelectedItemId, setUncontrolledSelectedItemId] = useState2(null);
   const [uncontrolledIsOpen, setUncontrolledIsOpen] = useState2(false);
@@ -1035,6 +1052,7 @@ function SingleSelect({
     {
       open: selectIsOpen,
       onOpenChange: updateIsOpen,
+      side: popoutPlacement,
       animationConfig: menuAnimationConfig,
       onOpenAutoFocus: (e) => {
         e.preventDefault();
@@ -1042,6 +1060,8 @@ function SingleSelect({
       onCloseAutoFocus: (e) => {
         e.preventDefault();
       },
+      onPointerDownOutside,
+      onInteractOutside,
       content: /* @__PURE__ */ jsx7(
         ComboboxContent,
         {
@@ -1147,7 +1167,10 @@ function MultiSelect({
   triggerButtonProps,
   menuProps,
   inputType = "checkbox",
-  shouldOverflow
+  shouldOverflow,
+  onPointerDownOutside,
+  onInteractOutside,
+  popoutPlacement
 }) {
   const [uncontrolledSelectedItemIds, setUncontrolledSelectedItemIds] = useState3([]);
   const [uncontrolledIsOpen, setUncontrolledIsOpen] = useState3(false);
@@ -1322,12 +1345,15 @@ function MultiSelect({
     {
       open: selectIsOpen,
       onOpenChange: updateIsOpen,
+      side: popoutPlacement,
       onOpenAutoFocus: (e) => {
         e.preventDefault();
       },
       onCloseAutoFocus: (e) => {
         e.preventDefault();
       },
+      onPointerDownOutside,
+      onInteractOutside,
       animationConfig: menuAnimationConfig,
       content: /* @__PURE__ */ jsx8(
         ComboboxContent,
@@ -1433,7 +1459,10 @@ function SingleAutocomplete({
   stateReducer = defaultReducer3,
   menuProps,
   inputType = "icon",
-  includePlaceholderItem = false
+  includePlaceholderItem = false,
+  onPointerDownOutside,
+  onInteractOutside,
+  popoutPlacement
 }) {
   const [uncontrolledInputValue, setUncontrolledInputValue] = useState4("");
   const [uncontrolledSelectedItemId, setUncontrolledSelectedItemId] = useState4(null);
@@ -1603,6 +1632,7 @@ function SingleAutocomplete({
     {
       open: comboboxIsOpen,
       onOpenChange: updateIsOpen,
+      side: popoutPlacement,
       animationConfig: menuAnimationConfig,
       onOpenAutoFocus: (e) => {
         e.preventDefault();
@@ -1610,6 +1640,8 @@ function SingleAutocomplete({
       onCloseAutoFocus: (e) => {
         e.preventDefault();
       },
+      onPointerDownOutside,
+      onInteractOutside,
       content: /* @__PURE__ */ jsx9(
         ComboboxContent,
         {
@@ -1667,7 +1699,7 @@ function SingleAutocomplete({
 }
 
 // src/v2/Autocomplete/MultiAutocomplete.tsx
-import { useState as useState5, useMemo as useMemo6 } from "react";
+import { useState as useState5, useMemo as useMemo6, useRef as useRef3 } from "react";
 import { useCombobox as useCombobox2, useMultipleSelection as useMultipleSelection2 } from "downshift";
 import { TokenInput } from "@sproutsocial/seeds-react-token-input";
 import { jsx as jsx10 } from "react/jsx-runtime";
@@ -1715,8 +1747,12 @@ function MultiAutocomplete({
   onIsOpenChange,
   stateReducer = defaultReducer4,
   menuProps,
-  inputType = "checkbox"
+  inputType = "checkbox",
+  onPointerDownOutside,
+  onInteractOutside,
+  popoutPlacement
 }) {
+  const mousedownInPopoverRef = useRef3(false);
   const [uncontrolledInputValue, setUncontrolledInputValue] = useState5("");
   const [uncontrolledSelectedItemIds, setUncontrolledSelectedItemIds] = useState5([]);
   const [uncontrolledIsOpen, setUncontrolledIsOpen] = useState5(false);
@@ -1743,6 +1779,9 @@ function MultiAutocomplete({
     onInputValueChange?.(newInputValue);
   };
   const updateIsOpen = (newIsOpen) => {
+    if (!newIsOpen) {
+      updateInputValue("");
+    }
     if (!isIsOpenControlled) {
       setUncontrolledIsOpen(newIsOpen);
     }
@@ -1919,6 +1958,11 @@ function MultiAutocomplete({
     if (inputProps.onBlur) {
       inputProps.onBlur(e);
     }
+    if (mousedownInPopoverRef.current) {
+      mousedownInPopoverRef.current = false;
+      e.target.focus();
+      return;
+    }
     updateIsOpen(false);
   };
   const inputPropsToSpread = { ...inputProps };
@@ -1928,13 +1972,22 @@ function MultiAutocomplete({
     {
       open: comboboxIsOpen,
       onOpenChange: updateIsOpen,
+      side: popoutPlacement,
       onOpenAutoFocus: (e) => {
         e.preventDefault();
       },
       onCloseAutoFocus: (e) => {
         e.preventDefault();
       },
+      onPointerDownOutside,
+      onInteractOutside,
       animationConfig: menuAnimationConfig,
+      onMouseDown: () => {
+        mousedownInPopoverRef.current = true;
+      },
+      onMouseUp: () => {
+        mousedownInPopoverRef.current = false;
+      },
       content: /* @__PURE__ */ jsx10(
         ComboboxContent,
         {