[WB-2111.3] Add portal prop to Floating component #2844
Conversation
…s maybeGetPortalMountedModalHostElement from WB Modal.
🦋 Changeset detectedLatest commit: 938b356 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Size Change: +229 B (+0.21%) Total Size: 111 kB
ℹ️ View Unchanged
|
A new build was pushed to Chromatic! 🚀https://5e1bf4b385e3fb0020b7073c-bhboquneld.chromatic.com/ Chromatic results:
|
| import {Meta} from "@storybook/addon-docs/blocks"; | ||
|
|
||
| <Meta title="Packages / Floating / Floating / Accessibility" /> | ||
| <Meta title="Packages / Floating / Accessibility" /> |
There was a problem hiding this comment.
note: Moved this one level down to be consistent with the rest of the packages with only one export.
There was a problem hiding this comment.
note: For some reason, I had this inside the code, so I got rid of it.
| hideProp ? hide() : undefined, | ||
| ], | ||
| }); | ||
| const {elements, refs, floatingStyles, context, middlewareData} = |
There was a problem hiding this comment.
note: The only change here is adding elements so we can pass it to the Portal instance. The rest are formatting changes.
There was a problem hiding this comment.
note: I copied this from wb-modal and adapted it to work here (changed to WB imports).
There was a problem hiding this comment.
note: copied this from wb-modal to centralize that logic here. One the migration is done, I'll be removing the wb-modal copy.
GeraldRequired Reviewers
Don't want to be involved in this pull request? Comment |
npm Snapshot: Published🎉 Good news!! We've packaged up the latest commit from this PR (f2fd3d0) and published all packages with changesets to npm. You can install the packages in ./dev/tools/deploy_wonder_blocks.js --tag="PR2844"Packages can also be installed manually by running: pnpm add @khanacademy/wonder-blocks-<package-name>@PR2844 |
somewhatabstract
left a comment
somewhatabstract
left a comment
There was a problem hiding this comment.
LGTM
Exciting to see this work happening!
Summary:
Next step on the Floating component:
Modal.
Implementation plan:
styleprop and RTL supportIssue: https://khanacademy.atlassian.net/browse/WB-2111
Test plan:
Navigate to the Floating component stories and verify that the portal example
works as expected. This means that the floating content should be rendered
inside the modal host element.
Also verify that this looks and works good in the Floating Testing Snapshots
story.