@sproutsocial/seeds-react-modal 2.5.6 → 2.5.8

package/.turbo/turbo-build.log

@@ -9,25 +9,25 @@ $ tsup --dts
 CJS Build start
 ESM Build start
 CJS dist/index.js        41.42 KB
-CJS dist/v2/index.js     32.96 KB
 CJS dist/v1/index.js     10.31 KB
+CJS dist/v2/index.js     32.96 KB
 CJS dist/index.js.map    82.23 KB
-CJS dist/v2/index.js.map 67.35 KB
 CJS dist/v1/index.js.map 14.56 KB
-CJS ⚡️ Build success in 37ms
+CJS dist/v2/index.js.map 67.35 KB
+CJS ⚡️ Build success in 29ms
+ESM dist/esm/v1/index.js           165.00 B
 ESM dist/esm/index.js              733.00 B
-ESM dist/esm/chunk-XQ2A6HDC.js     27.90 KB
 ESM dist/esm/chunk-72GBDCA2.js     7.57 KB
-ESM dist/esm/v1/index.js           165.00 B
+ESM dist/esm/chunk-XQ2A6HDC.js     27.90 KB
 ESM dist/esm/v2/index.js           746.00 B
+ESM dist/esm/v1/index.js.map       71.00 B
 ESM dist/esm/index.js.map          1.16 KB
-ESM dist/esm/chunk-XQ2A6HDC.js.map 66.27 KB
 ESM dist/esm/chunk-72GBDCA2.js.map 14.38 KB
-ESM dist/esm/v1/index.js.map       71.00 B
+ESM dist/esm/chunk-XQ2A6HDC.js.map 66.27 KB
 ESM dist/esm/v2/index.js.map       71.00 B
-ESM ⚡️ Build success in 37ms
+ESM ⚡️ Build success in 30ms
 DTS Build start
-DTS ⚡️ Build success in 4204ms
+DTS ⚡️ Build success in 3984ms
 DTS dist/index.d.ts                          1.07 KB
 DTS dist/v1/index.d.ts                       413.00 B
 DTS dist/v2/index.d.ts                       1.16 KB
@@ -38,4 +38,4 @@ $ tsup --dts
 DTS dist/v2/index.d.mts                      1.16 KB
 DTS dist/Modal-DTeKLfEI.d.mts                2.52 KB
 DTS dist/ModalExternalTrigger-BnbJk9zY.d.mts 23.41 KB
-Done in 5.00s.
+Done in 4.71s.

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @sproutsocial/seeds-react-modal
 
+## 2.5.8
+
+### Patch Changes
+
+- @sproutsocial/seeds-react-icon@2.3.5
+- @sproutsocial/seeds-react-button@2.0.3
+
+## 2.5.7
+
+### Patch Changes
+
+- @sproutsocial/seeds-react-icon@2.3.4
+- @sproutsocial/seeds-react-button@2.0.2
+
 ## 2.5.6
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/seeds-react-modal",
-  "version": "2.5.6",
+  "version": "2.5.8",
   "description": "Seeds React Modal",
   "author": "Sprout Social, Inc.",
   "license": "MIT",
@@ -37,8 +37,8 @@
   "dependencies": {
     "@radix-ui/react-dialog": "^1.1.14",
     "@sproutsocial/seeds-react-box": "^1.1.16",
-    "@sproutsocial/seeds-react-button": "^2.0.1",
-    "@sproutsocial/seeds-react-icon": "^2.3.3",
+    "@sproutsocial/seeds-react-button": "^2.0.3",
+    "@sproutsocial/seeds-react-icon": "^2.3.5",
     "@sproutsocial/seeds-react-portal": "^1.2.0",
     "@sproutsocial/seeds-react-system-props": "^3.0.1",
     "@sproutsocial/seeds-react-text": "^1.4.0",
@@ -52,7 +52,7 @@
   "devDependencies": {
     "@sproutsocial/eslint-config-seeds": "*",
     "@sproutsocial/seeds-react-form-field": "^1.1.10",
-    "@sproutsocial/seeds-react-input": "^1.5.12",
+    "@sproutsocial/seeds-react-input": "^1.5.14",
     "@sproutsocial/seeds-react-testing-library": "*",
     "@sproutsocial/seeds-testing": "*",
     "@sproutsocial/seeds-tsconfig": "*",

package/src/__tests__/v2/Modal.test.tsx

@@ -1074,7 +1074,9 @@ describe("ModalExternalTrigger component", () => {
 
     const button = screen.getByTestId("test-button");
     expect(button).toBeInTheDocument();
-    expect(button).toHaveAttribute("disabled");
+    // Seeds Button uses aria-disabled rather than the HTML disabled attribute
+    // so the disabled button stays in the tab order — see Button.tsx.
+    expect(button).toHaveAttribute("aria-disabled", "true");
   });
 });
 

package/src/v2/ModalV2.stories.tsx

@@ -1414,6 +1414,42 @@ export const WithPopout: Story = {
                 <Button>Open Popout</Button>
               </Popout>
             </Box>
+            <Box>
+              <Text fontSize={200} fontWeight="semibold" mb={200}>
+                Popout V1 (focus fight repro)
+              </Text>
+              <Text as="p" fontSize={100} mb={200}>
+                Open this popout. With the bug, focus flickers/bounces because
+                Radix Dialog&apos;s FocusScope and the Popout&apos;s
+                react-focus-lock each try to trap focus. Try tabbing between the
+                two inputs — focus should stay inside the popout.
+              </Text>
+              <Popout
+                placement="bottom-start"
+                content={
+                  <Popout.Content>
+                    <Box display="flex" flexDirection="column" gap={200}>
+                      <label>
+                        First input{" "}
+                        <input
+                          data-testid="popout-input-1"
+                          placeholder="focus should land here"
+                        />
+                      </label>
+                      <label>
+                        Second input{" "}
+                        <input
+                          data-testid="popout-input-2"
+                          placeholder="tab should reach here"
+                        />
+                      </label>
+                    </Box>
+                  </Popout.Content>
+                }
+              >
+                <Button>Open Popout with focusable content</Button>
+              </Popout>
+            </Box>
             <Box>
               <Text fontSize={200} fontWeight="semibold" mb={200}>
                 Popout V2