search

instacart / Snacks

The Instacart Component Library
https://instacart.github.io/Snacks/
Apache License 2.0
81 stars 36 forks source link

Adds props.customElement to <Button /> #347

Closed KsenijaGogic closed 5 years ago

KsenijaGogic commented 5 years ago

Problem

Trying to figure out an elegant way to:

  1. Allow Snacks users to pass a custom component to the <Button /> component to leverage styling (perfect use case: react-router's <Link />)
  2. while maintaining the source / approach of <Button /> mostly untouched

The motivation for this is mainly to avoid improper HTML practices with nesting a <Button /> inside a <Link />.

Solution

Current approach leverages existing dynamic element creation to add a 3rd option (a, button, props.customElement). ~Adds an additional customElementProps prop to allow users to specify props they may need (to, q, etc.).~ customElementProps removed in order to favour elementAttributes.

codecov[bot] commented 5 years ago

Codecov Report

Merging #347 into master will increase coverage by 0.04%. The diff coverage is 100%.

@@            Coverage Diff             @@
##           master     #347      +/-   ##
==========================================
+ Coverage   82.22%   82.27%   +0.04%     
==========================================
  Files          59       59              
  Lines        1221     1224       +3     
  Branches      218      219       +1     
==========================================
+ Hits         1004     1007       +3     
  Misses        165      165              
  Partials       52       52
KsenijaGogic commented 5 years ago

Closing this PR as a new release of React Router will solve this problem specifically.