Skip to content

Add Divider - #92

Open
OSSDiablo wants to merge 4 commits into
SiriusSoftwareLtd:devfrom
OSSDiablo:91-divider
Open

Add Divider#92
OSSDiablo wants to merge 4 commits into
SiriusSoftwareLtd:devfrom
OSSDiablo:91-divider

Conversation

@OSSDiablo

@OSSDiablo OSSDiablo commented Aug 1, 2026

Copy link
Copy Markdown

Summary

A page can only be broken into parts by naming them, since a Section is a heading. This adds a rule that breaks without saying anything, takes a word in the middle when there is one worth saying, and with no rule at all is simply room.

Related issue

Closes #91

Change type

  • Bug fix
  • Feature
  • Refactor or maintenance
  • Build, tooling, or CI
  • Breaking change

Changes

  • src/components/divider.luau: a faint rule across the page, kept light enough that it does not read as a border against the element strokes either side of it.
  • text puts a word in the middle. The rule becomes two halves sharing whatever the label leaves, through UIFlexItem, so it stays centred at any text length. Set swaps it; a divider built without one has no label to put it in.
  • line = false draws no rule and leaves only the room. There is no spacer element, and this is the other thing a divider gets reached for.
  • spacing sets the room above and below, defaulting to 12.
  • Registered through Tab:_register like every other element, so it reorders with the Move* methods and fades with the page.

Compatibility and breaking changes

  • Breaking change: No
  • Migration required: No
  • Compatibility notes: one new factory on Tab. Nothing existing changed; no persisted data, themes or public behaviour affected. Not stateful, so no flag is registered.

Validation

  • I ran make ci, including the coverage threshold, or explained below why it does not apply.
  • I added or updated automated or Roblox-hosted tests where practical.
  • I completed applicable manual testing in Roblox Studio or the affected environment.
  • I tested the affected compatibility paths.

Test scenarios and results

  • make ci: 232 tests pass, coverage 82.88% against the 82.88% baseline in this branch.
  • Three specs: a rule with and without a label including Set on both, the heights for default, custom and line-free spacing, and fading with the page including the line-free case having nothing to fade.
  • Exercised in a live client on an executor build across all six themes, at several spacings and label lengths.
  • Run in Roblox Studio from a Rojo-built place. A plain rule, rules with a word in them at default, tight and loose spacing, and room with no rule, all laid out as expected between the elements either side.

Documentation coordination

  • Public documentation impact: one new element to document, Tab:CreateDivider.
  • Companion docs issue or pull request: document the gen2 additions docs#39.
  • In-repository comments, examples, or types updated: src/types.luau gains DividerProps and Divider, and the factory on Tab.

UI evidence

Before After
Groups can only be separated by giving each one a Section heading, and there is no way to place plain room. https://github.com/user-attachments/assets/cdc3ff59-426c-4f44-be66-de7e761bb8bf

A plain rule between two groups, one with a word in the middle, one with the line off leaving only the room, tighter and looser spacings, and the label changed through Set.

Checklist

  • This pull request targets dev.
  • The change is focused and contains no unrelated work.
  • I reviewed my own changes.
  • Tests cover the change where practical.
  • Coverage did not drop below the enforced threshold.
  • Public documentation is unaffected, or I linked companion work in SiriusSoftwareLtd/docs.
  • Required code comments, examples, and types match the resulting behavior.
  • I did not commit standalone documentation changes that belong in the docs repository.
  • I did not commit generated files such as roblox.yml, sourcemap.json, globalTypes.d.luau, or build/.
  • This pull request contains no publicly disclosed vulnerability details.

@MaxTCodes MaxTCodes left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Divider follows the existing component and registration patterns, and the tests cover its main creation and reveal behavior.

I found two issues in Divider:Set that should be fixed before merge. It does not update the locale binding when its text changes, so Window:SetLocale() can restore stale text. Clearing the text also leaves the split rule in place, creating a gap instead of returning to the plain divider layout.

I did not repeat the Label and Paragraph findings here because those changes belong to #90, and their locale issue is already under review there.

Once the Divider setter keeps its locale binding current and restores a continuous rule when its label is cleared, I do not see any other blocking issue in the Divider change.

Comment thread src/components/divider.luau Outdated
@OSSDiablo OSSDiablo mentioned this pull request Aug 1, 2026
19 tasks
@OSSDiablo

Copy link
Copy Markdown
Author

Both fixed.

The locale binding goes through _bindLocale now, so the source is rebound as the text lands. That one was mine across three components; #90 has the same fix for Label and Paragraph.

Clearing the label also closes the rule back up. The halves sit either side of it with the layout's gap between them, so hiding the label on its own left that gap in the middle of the line. Dropping the far half leaves the near one filling the width, since the layout skips what it cannot see, and that is the plain rule again. Spec covers clearing and setting it back.

make ci: 235 tests, coverage 83.12%.

@MaxTCodes MaxTCodes left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please remove the Label and Paragraph changes from this PR. Those components already belong to #90 and should remain scoped to that PR.

#92 should include only the Divider implementation, its public API and types, and the tests required for Divider. Keeping these changes separate will make both PRs easier to review and prevent the same code from appearing in two feature PRs.

Please rebase or update this branch so the #92 diff contains only the Divider work.

A Section groups by naming what follows it, so breaking a page into parts meant giving every part a heading whether it wanted one or not.

- a faint rule across the page, kept light enough that it does not read as a border against the element strokes either side of it
- an optional word in the middle, which splits the rule into halves that share whatever the word leaves, so it stays centred at any length
- `line = false` draws no rule and leaves only the room, which is the other thing a divider gets reached for and had no other way of being had
- `spacing` sets the room above and below
Same as Label and Paragraph: writing the label directly is undone by the
next SetLocale, which re-resolves every localised property from the
source it was bound to.
The halves are laid out either side of the label with a gap between them,
so hiding the label alone left that gap sitting in the middle of the
line. The layout skips what it cannot see, so dropping the far half
leaves the near one filling the width, which is the plain rule again.
@OSSDiablo

Copy link
Copy Markdown
Author

done, rebased onto dev with only the divider commits. the branch was cut off the label/paragraph one which is why it carried them.

diff is divider.luau, its CreateDivider on Tab, the two types, and the divider specs. the locale spec here only covers the divider now, the label and paragraph half of it stays on #90.

also exported DividerProps and Divider from init while i was rebasing, same as the other elements have.

@MaxTCodes MaxTCodes left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Divider implementation looks good now. The earlier locale and clear-label issues are fixed. The Label and Paragraph changes have been removed from this PR, and CI passes on the rebased head.

One item still needs to be addressed before merge. This adds the public Tab:CreateDivider API. The PR notes that it needs public documentation, but no companion docs issue or PR is linked. The feature PR template requires companion work in SiriusSoftwareLtd/docs when a feature affects public documentation.

Please open and link the companion documentation work.

The validation numbers in the PR body are also stale after the rebase. CI currently passes 232 tests with 82.88% line coverage.

We also need to wait for @jensonhirst to sign off on this PR before it can be merged.

I do not see any other blocking issues in the code.

@OSSDiablo

Copy link
Copy Markdown
Author

companion docs are open as SiriusSoftwareLtd/docs#39, linked in the body now, a Divider page alongside the other elements.

body numbers are corrected too, 232 tests and 82.88% after the rebase.

@OSSDiablo

Copy link
Copy Markdown
Author

studio validation done, checkbox ticked and the result is in the body. plain rule, rules with a word at default, tight and loose spacing, and room with no rule, all sitting right between the elements either side.

recording of the studio run is on #86: https://github.com/user-attachments/assets/8718b07e-4a4c-4606-bf62-e9c7a336b5db

@jensonhirst

Copy link
Copy Markdown
Member

Set does nothing on a divider built without text:

function Divider:Set(text)
    if not self.title then
        return
    end

A public method that silently no-ops is a trap. Someone calls it, nothing happens, and there's nothing on screen or in the console saying why. Either build the label lazily on first Set, or warn the way Flags.__newindex does for an unknown flag. Lazy build is the better one, there's no reason a divider can't gain a word later.

The constructor takes name as an alias for text and types.luau doesn't mention it. Document it or drop it. An accepted prop that isn't in the types is one nobody can find and everybody has to maintain.

Set("") also leaves self.text as "" where the constructor leaves it nil. Pick one.

Sequencing: this wants to go before #90, they both touch tab.luau and types.luau.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants