Skip to content

Components: Separate button and link components#9702

Closed
aduth wants to merge 1 commit intomasterfrom
update/button-link
Closed

Components: Separate button and link components#9702
aduth wants to merge 1 commit intomasterfrom
update/button-link

Conversation

@aduth
Copy link
Copy Markdown
Member

@aduth aduth commented Sep 7, 2018

Closes #7534

Work In Progress: This is an early iteration which includes basic refactoring, opened here for initial feedback as some of the proposals explored here and in #7534 are potentially subject to debate.

This pull request seeks to:

  • Extract semantics of navigable clickable element out of Button to a new Link component
    • Button's href and target props have been deprecated
  • Establish the default appearance of a button to be that of what was previously expressed through the isDefault prop
    • This is the most widespread breaking change of the pull request, as much of the interface operates on an assumption of a default button appearance which is largely unstyled
    • Existing usage is reinstated through new props isBorderless and isUnstyled, respectively to varying degrees of style resets
  • Button and Link can interchangeably inherit the appearance of another, via hasLinkAppearance and hasButtonAppearance respectively.
    • Buttons isLink prop has been deprecated. The new prop name is intended to better reflect that this is a cosmetic appearance change, not a change in semantics.
    • To support this, common styles have been lifted out of the Button component stylesheet to _mixins.scss
    • TODO: There are other mixins for buttons which appear to be targeted at the "unstyled" default, and should be considered for additional refactor. Their presence is concerning as it implies the "unstyled" as being default is intentional.

@aduth aduth added [Status] In Progress Tracking issues with work in progress Needs Design Feedback Needs general design feedback. [Feature] UI Components Impacts or related to the UI component system [Package] Components /packages/components labels Sep 7, 2018
@aduth aduth mentioned this pull request Sep 21, 2018
4 tasks
@karmatosed
Copy link
Copy Markdown
Member

The principle of this design wise makes sense so removing the feedback label.

@karmatosed karmatosed removed the Needs Design Feedback Needs general design feedback. label Oct 11, 2018
@aduth
Copy link
Copy Markdown
Member Author

aduth commented Jan 2, 2019

With 5.0 having shipped and serving as a basis for committing to backwards-compatibility, it's not seeming as viable to me to make such a fundamental shift to how we treat buttons and links in the WordPress components. Furthermore, the drift between this branch and master makes it challenging to resolve existing conflicts.

Moving forward, I've heard some commentary (citation needed) about at least flattening some of the variations of these components, including IconButton, ExternalLink, etc. I think it's worthwhile to keep open #7534, where discussion can continue.

@aduth aduth closed this Jan 2, 2019
@aduth aduth mentioned this pull request Jan 2, 2019
@aduth aduth deleted the update/button-link branch January 25, 2019 21:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Feature] UI Components Impacts or related to the UI component system [Package] Components /packages/components [Status] In Progress Tracking issues with work in progress

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants