Add none gap option to Stack component

[Copilot]

Closes https://github.com/github/primer/issues/6311

What are you trying to accomplish?

Stack component lacked none gap option available in Primer React. Added :none to GapArg::OPTIONS to enable 0px spacing.

CSS already supported data-gap='none'. Tests auto-generate from OPTIONS array. Changeset added for minor version bump in next release.

Usage:

# Static
Primer::Alpha::Stack.new(gap: :none)

# Responsive
Primer::Alpha::Stack.new(gap: { narrow: :none, regular: :condensed })

Available options: nil (default, 1rem), :none (0px), :condensed (0.5rem), :normal (1rem), :spacious (1.5rem)

Integration

Risk Assessment

• Low risk - Single line addition to OPTIONS array. CSS and test infrastructure already in place. No breaking changes.

What approach did you choose and why?

Added :none to GapArg::OPTIONS array. Leverages existing CSS rules and test generation. Minimal change for maximum compatibility.

Created changeset file (.changeset/add-stack-none-gap.md) marking this as a minor version bump for the next release, following standard changesets workflow.

Anything you want to highlight for special attention from reviewers?

Tests dynamically generate from OPTIONS - verify test_renders_static_arg_gap_with_none_option and test_renders_responsive_arg_gap_with_none_option pass.

Accessibility

• No new axe scan violation - This change does not introduce any new axe scan violations.

Merge checklist

• Added/updated tests (auto-generated from OPTIONS)
• Added/updated documentation
• Added/updated previews (Lookbook) (auto-updated from OPTIONS)
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

View original Slack conversation

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[changeset-bot]

🦋 Changeset detected

Latest commit: 772b2e4

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/view-components	Minor

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

[HiroAgustin]

@copilot add a changeset to bump release version, follow this guidelines: https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md

[Copilot]

@copilot add a changeset to bump release version, follow this guidelines: https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md

Added changeset in commit 772b2e4. The changeset marks this as a minor version bump and will be included in the next release.

[Copilot]

Pull request overview

This PR adds a none gap option to the Stack component to achieve parity with Primer React. The CSS infrastructure already supported data-gap='none' with 0px spacing; this change simply exposes it by adding :none to the GapArg::OPTIONS array.

Changes:

• Added :none option to GapArg::OPTIONS array in Stack component
• Updated JSON documentation files to include :none in gap option descriptions
• Created changeset for minor version bump

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File	Description
app/components/primer/alpha/stack.rb	Added :none to GapArg::OPTIONS array to enable 0px gap spacing
static/info_arch.json	Updated gap parameter description to include :none option
static/arguments.json	Updated gap parameter description to include :none option
.changeset/add-stack-none-gap.md	Added changeset documenting the new feature for minor version bump

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[TylerJDev]

Thanks for the PR! LGTM! ✨