[Divider] Add support for text-embedded dividers

[aworld1]

Fixes #7583

Checklist

• Includes tests
• Update documentation

Changes proposed in this pull request:

This PR adds the ability to embed text or other content within dividers, similar to Material UI's Divider component. This is useful for section headers, labels, or visual separation with context.

New API:

• children?: React.ReactNode - Content to embed within the divider (text, icons, etc.)
• textAlignment?: "left" | "center" | "right" - Controls the position of embedded content (default: "center")

Implementation details:

• Uses flexbox with ::before and ::after pseudo-elements to create line segments on each side of the content
• Text alignment variants adjust the flex distribution to position content appropriately
• Includes dark theme support
• Adds role="separator" for accessibility when children are present
• Fully backward compatible so existing dividers work unchanged

Example usage:

<Divider>Section Title</Divider>
<Divider textAlignment="left">Start of Section</Divider>
<Divider textAlignment="right">End of Section</Divider>

Reviewers should focus on:

• API design: Is textAlignment the right name for the prop? Should we use alignment instead?
• Styling: Spacing, text sizing, and color choices for embedded content
• Dark theme implementation
• Accessibility: Proper use of role="separator" attribute

Screenshot

Reference Issue #7583

[changelog-app]

Generate changelog in packages/core/changelog/@unreleased

Type (Select exactly one)

• Feature (Adding new functionality)
• Improvement (Improving existing functionality)
• Fix (Fixing an issue with existing functionality)
• Break (Creating a new major version by breaking public APIs)
• Deprecation (Removing functionality in a non-breaking way)
• Migration (Automatically moving data/functionality to a new system)

Description

[Divider] Add support for text-embedded dividers

---

Generate changelog in packages/docs-app/changelog/@unreleased

Type (Select exactly one)

• Feature (Adding new functionality)
• Improvement (Improving existing functionality)
• Fix (Fixing an issue with existing functionality)
• Break (Creating a new major version by breaking public APIs)
• Deprecation (Removing functionality in a non-breaking way)
• Migration (Automatically moving data/functionality to a new system)

Description

[Divider] Add support for text-embedded dividers

---

Check the box to generate changelog(s)

• Generate changelog entry

[changelog-app]

✅ Successfully generated changelog entries for:

• packages/core/changelog
• packages/docs-app/changelog

What happened?

Your changelog entries have been stored in the database as part of our migration to ChangelogV3.

Need to regenerate?

Simply interact with the changelog bot comment again to regenerate these entries.

---

📋Changelog Preview

✨ Features

• [Divider] Add support for text-embedded dividers (#7597)
• [Divider] Add support for text-embedded dividers (#7597)

[Copilot]

Pull Request Overview

This PR adds support for embedding text or other content within dividers, similar to Material UI's Divider component. The feature enables visual separation with contextual labels or section headers while maintaining backward compatibility with existing dividers.

Key Changes:

• Added children and textAlignment props to the Divider component API
• Implemented flexbox-based layout with pseudo-elements for line segments
• Added comprehensive test coverage and documentation examples

Reviewed Changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
packages/core/src/components/divider/divider.tsx	Core implementation adding children and textAlignment props with conditional rendering logic
packages/core/src/components/divider/_divider.scss	Styles for text-embedded dividers including flexbox layout, alignment variants, and dark theme support
packages/core/test/divider/dividerTests.tsx	Test suite covering text rendering, alignment options, accessibility, and className application
packages/core/src/components/divider/divider.md	Documentation explaining the new text embedding feature with alignment options
packages/docs-app/src/examples/core-examples/dividerExamples.tsx	Example component registration for the documentation app
packages/docs-app/src/examples/core-examples/divider/DividerWithText.tsx	Demo component showcasing all three alignment options
packages/docs-app/src/examples/core-examples/divider/DividerWithText.tsx.preview	Preview code snippet for the documentation

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[svc-palantir-github]

init

Build artifact links for this commit: documentation | landing | table | demo

This is an automated comment from the deploy-preview CircleCI job.

[Copilot]

Pull Request Overview

Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[svc-palantir-github]

cleaned

Build artifact links for this commit: documentation | landing | table | demo

This is an automated comment from the deploy-preview CircleCI job.

[svc-palantir-github]

renamed test for clarity

Build artifact links for this commit: documentation | landing | table | demo

This is an automated comment from the deploy-preview CircleCI job.