Skip to content

Button: Add xl size#1076

Open
Kavin-Trimble wants to merge 5 commits intomainfrom
686-add-xl-size-buttons
Open

Button: Add xl size#1076
Kavin-Trimble wants to merge 5 commits intomainfrom
686-add-xl-size-buttons

Conversation

@Kavin-Trimble
Copy link
Copy Markdown
Contributor

📄 Summary of Changes

Button: Add xl size

💭 Type of Change

  • Bug fix (fixes an issue)
  • New feature (adds functionality)
  • Configuration change (modifies scaling or properties of existing infrastructure & services)
  • Documentation change
  • Other

📋 Test Plan

✅ Self Code Review Checklist

PR authors and reviewers, please verify that all of these items have been completed.

  • My code is clean and readable
  • I followed standard conventions
  • Component code is WCAG 2.2 compliant (if applicable)
  • I have made theme files changes (if applicable)
  • I have made documentation changes (if applicable)
  • I have made Storybook changes including usage documentation (if applicable)
  • I have tested the component thoroughly in Storybook including RTL rendering (if applicable)

🔗 Work Item

Issue #686

Copilot AI review requested due to automatic review settings May 5, 2026 11:15
@Kavin-Trimble Kavin-Trimble requested a review from a team as a code owner May 5, 2026 11:15
@Kavin-Trimble Kavin-Trimble linked an issue May 5, 2026 that may be closed by this pull request
2 tasks
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 5, 2026

PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://trimble-oss.github.io/modus-wc-2.0/pr-preview/pr-1076/

Built to branch gh-pages at 2026-05-06 07:02 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

Adds an xl size option to modus-wc-button, exposing it through the component API, Storybook controls, and button SCSS so consumers can render a larger button variant.

Changes:

  • Widened the button size prop to accept xl.
  • Added xl to Storybook controls for the button component.
  • Added SCSS rules for xl sizing, padding, and circle/square width handling.

Reviewed changes

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

File Description
src/components/modus-wc-button/modus-wc-button.tsx Extends the button prop API to accept xl and passes the new size through class generation.
src/components/modus-wc-button/modus-wc-button.stories.ts Exposes the new xl option in Storybook args and controls.
src/components/modus-wc-button/modus-wc-button.scss Defines the new xl button styles, including general sizing and circle/square width rules.

Comment thread src/components/modus-wc-button/modus-wc-button.scss Outdated

/** The size of the button. */
@Prop() size: DaisySize = 'md';
@Prop() size: DaisySize | 'xl' = 'md';

/** The size of the button. */
@Prop() size: DaisySize = 'md';
@Prop() size: DaisySize | 'xl' = 'md';

/** The size of the button. */
@Prop() size: DaisySize = 'md';
@Prop() size: DaisySize | 'xl' = 'md';
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.

Button with circle shape has fixed width, differs from figma

2 participants