Skip to content

[Bug]: Divider content prop naming is confusing and inconsistent #352

@AregSoft

Description

@AregSoft

Component

Divider

Is this a regression?

None

Describe the bug

The Divider component's props create an inconsistent and confusing API for developers. The existing props include text, icon, and content, all used to insert elements into the divider. However, the positioning prop, contentPosition, controls the alignment of the text and icon props, but not the alignment of the content prop.

This ambiguity makes it unclear which prop is responsible for positioning which element, leading to frustrating trial-and-error for users trying to center their custom element supplied via the content prop

To Reproduce

  1. Render a <Divider /> component and provide a value to the content prop (e.g., <Divider content={<span>Custom Content</span>} />).

  2. Attempt to change the position of the custom content ("before" | "after" | "center") using the contentPosition prop.

  3. The position of the custom element supplied via the content prop does not change. The contentPosition prop only affects the position if the text or icon props are used.

Expected behavior

Rename the content prop (e.g., to swappableElement).

Screenshots

No response

Package version

v3.0.0

Desktop

. OS:
. Browser & version:
. Additional Information:

Smartphone

. Device:
. OS:
. Browser & version:
. Additional Information:

Exception or Error

Additional context

No response

Metadata

Metadata

Assignees

Labels

phase / ready-to-goThis issue merged and will be included in the current milestone releasetype / bugSomething isn't working

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions