refactor(Separated): fix key usage in Separated component: use child.key instead of array index for better stability

[wo-o29]

Overview

This PR improves the Separated component by changing the React key used in the mapped children from the array index to the child element’s own key.

Using array indices as keys in React lists is considered an anti-pattern because it can cause issues with component state, performance, and rendering consistency during updates such as insertion, deletion, or reordering.

By leveraging the unique key property provided by React elements via Children.toArray(), this change enhances rendering stability and avoids unnecessary re-renders or UI glitches.

This results in more predictable behavior, better performance, and easier maintenance for components using Separated.

Before	After

• example code

<Separated by={<span>|</span>}>
  {["hello", "react", "world"].map((item) => (
    <div key={item}>{item}</div>
  ))}
</Separated>

Checklist

• Written new or updated existing test cases if necessary
• Run yarn run fix to format and lint the code and docs
• Run yarn run test:coverage to confirm coverage completeness
• Updated JSDoc comments or documentation where applicable

[Copilot]

Pull Request Overview

This PR refactors the Separated component to improve React key usage by replacing array indices with child element keys for better rendering stability and performance.

• Changes the React key from array index to child.key in the mapped children
• Improves rendering consistency during updates like insertion, deletion, or reordering
• Follows React best practices by avoiding array index keys

---

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

[codecov-commenter]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (5bdb4ff) to head (e903eea).
⚠️ Report is 6 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##              main      #278   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           37        37           
  Lines         1093      1093           
  Branches       324       324           
=========================================
  Hits          1093      1093           

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[kimyouknow]

@wo-o29 Thanks for the improvement!

The change to use child.key ?? i is correct and preserves user-provided keys. Note: Since Children.toArray() re-keys children (.0, .$item-1, etc.), child.key is always non-null here — the ?? i fallback won't execute. Still, the change meaningfully improves Fragment keys from plain indices to identity-based keys.

[kimyouknow]

One thing needed: please add a changeset (yarn changeset → patch) per our Contributing Guide.

Then we'll merge!

[kimyouknow]

Thanks!