chore(drawer): export drawer children props #4310
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
🦋 Changeset detectedLatest commit: 476bd57 The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
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 |
|
@omarshehab221 is attempting to deploy a commit to the NextUI Inc Team on Vercel. A member of the Team first needs to authorize it. |
WalkthroughThe changes involve modifications to the Changes
Suggested reviewers
Tip CodeRabbit's docstrings feature is now available as part of our Early Access Program! Simply use the command Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
|
Hey @omarshehab221 please fix the |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (3)
packages/components/drawer/src/index.ts (3)
1-11: Consider documenting the architectural decision to reuse Modal propsWhile reusing Modal props for Drawer components promotes consistency and reduces duplication, it creates a coupling between these components. Consider adding a comment explaining this design decision and its implications for maintainers.
Add a comment like:
+// Note: Drawer components intentionally reuse Modal props to maintain consistency +// and reduce duplication. Changes to Modal props will affect Drawer components. import { ModalHeader, ModalBody,
17-23: Consider reorganizing type exportsThe
UseDisclosurePropstype seems out of place among Drawer-specific types. Consider moving it to be grouped with other hook-related exports for better organization.export type { ModalContentProps as DrawerContentProps, ModalHeaderProps as DrawerHeaderProps, ModalBodyProps as DrawerBodyProps, ModalFooterProps as DrawerFooterProps, - UseDisclosureProps, }; // export hooks +export type {UseDisclosureProps}; export {useDrawer} from "./use-drawer";
A changeset is needed for the new Drawer exports
The existing changesets are for different components (
pagination,listbox,menu, andinput-otp) and don't document the new exports in the Drawer component. Please add a new changeset to document these changes.
- Use
pnpm changesetto create a new changeset- Document the new exports being added to the Drawer component
- Include
@nextui-org/drawerin the changeset🔗 Analysis chain
Line range hint
1-38: Add a changeset to document these exportsAs mentioned in the PR comments, please add a changeset to document these new exports. This will help with versioning and release notes.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Check if a changeset exists for this PR fd -e md . .changesetLength of output: 116
Script:
#!/bin/bash # Let's check the content of the changesets to see if they document these exports cat .changeset/breezy-bobcats-destroy.md .changeset/smooth-trainers-walk.mdLength of output: 320
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
📒 Files selected for processing (1)
packages/components/drawer/src/index.ts(1 hunks)
🔇 Additional comments (1)
packages/components/drawer/src/index.ts (1)
26-27: Verify useDisclosure hook usage
Let's verify that the useDisclosure hook is actually used by the Drawer component to ensure we're not exposing unnecessary APIs.
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
.changeset/forty-ducks-brake.md (1)
1-5: Enhance the changeset description for better clarity.While the patch version bump is appropriate, the description could be more informative for changelog readers.
Consider applying this diff to provide more details:
--- "@nextui-org/drawer": patch --- -Export useDisclosure and Drawer children props from `@nextui-org/drawer` +Export useDisclosure hook and Drawer component props from `@nextui-org/drawer`: +- Export DrawerContentProps, DrawerHeaderProps, DrawerBodyProps, and DrawerFooterProps +- Export UseDisclosureProps for better TypeScript support +- Re-export useDisclosure hook from @nextui-org/use-disclosure
wingkwong
changed the title
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/components/drawer/src/index.ts(1 hunks)
🧰 Additional context used
🪛 eslint
packages/components/drawer/src/index.ts
[error] 6-6: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 7-7: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 8-8: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 9-9: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
🔇 Additional comments (2)
packages/components/drawer/src/index.ts (2)
16-21: LGTM! Type exports are well-structured
The type exports are properly aliased to provide drawer-specific type names while reusing the modal types. This is a good approach for maintaining consistency between modal and drawer components.
Line range hint 24-36: LGTM! Exports are well-organized
The exports are logically grouped into hooks, main component, and subcomponents. The consistent aliasing pattern between types and components makes the API intuitive.
🧰 Tools
🪛 eslint
[error] 6-6: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 7-7: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 8-8: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 9-9: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
| import { | ||
| ModalHeader, | ||
| ModalBody, | ||
| ModalFooter, | ||
| ModalContent, | ||
| type ModalContentProps, | ||
| type ModalHeaderProps, | ||
| type ModalBodyProps, | ||
| type ModalFooterProps, | ||
| } from "@nextui-org/modal"; |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Use top-level type imports for better consistency
Convert inline type specifiers to top-level type imports to follow TypeScript best practices and maintain consistency.
Apply this change:
-import {
- ModalHeader,
- ModalBody,
- ModalFooter,
- ModalContent,
- type ModalContentProps,
- type ModalHeaderProps,
- type ModalBodyProps,
- type ModalFooterProps,
-} from "@nextui-org/modal";
+import {
+ ModalHeader,
+ ModalBody,
+ ModalFooter,
+ ModalContent,
+} from "@nextui-org/modal";
+import type {
+ ModalContentProps,
+ ModalHeaderProps,
+ ModalBodyProps,
+ ModalFooterProps,
+} from "@nextui-org/modal";📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { | |
| ModalHeader, | |
| ModalBody, | |
| ModalFooter, | |
| ModalContent, | |
| type ModalContentProps, | |
| type ModalHeaderProps, | |
| type ModalBodyProps, | |
| type ModalFooterProps, | |
| } from "@nextui-org/modal"; | |
| import { | |
| ModalHeader, | |
| ModalBody, | |
| ModalFooter, | |
| ModalContent, | |
| } from "@nextui-org/modal"; | |
| import type { | |
| ModalContentProps, | |
| ModalHeaderProps, | |
| ModalBodyProps, | |
| ModalFooterProps, | |
| } from "@nextui-org/modal"; |
🧰 Tools
🪛 eslint
[error] 6-6: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 7-7: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 8-8: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
[error] 9-9: Prefer using a top-level type-only import instead of inline type specifiers.
(import/consistent-type-specifier-style)
Closes #
📝 Description
Export DrawerContentProps, DrawerHeaderProps, DrawerBodyProps, DrawerFooterProps and UseDisclosureProps from
@nextui-org/drawer⛳️ Current behavior (updates)
The drawer children props aren't exported
🚀 New behavior
the drawer children props are exported
💣 Is this a breaking change (Yes/No):
📝 Additional Information
Summary by CodeRabbit
useDisclosurehook to improve modal functionalities.