Ask questionsImprove/add handling of default values

Is your feature request related to a problem? Please describe.

When building UI libraries you want to set good defaults but let consumers override if necessary. Which doesn't really work with the padding/margin currently. So there is no clear way of defining default values that works in all situations.

Eg here, as a consumer of the Box component I expect that I'll be able to overwrite the left padding.

Describe the solution you'd like

A better way to provide default values, using defaultProps isn't always enough. Currently I've created a wrapper around system, I wish something similar was available natively. The caveat with this solution is that it doesn't work with compose which is kind of a deal breaker.

export function system(config) {
  const parser = systemCore(config);
  parser.withDefaults = defaults => props => parser({ ...defaults, ...props });

  return parser;

Describe alternatives you've considered


Additional context



Answer questions alexandernanberg

@bernatfortet I ended up forking styled-system and added withDefaults on the parser, I can create a gist of the entire source if you'd like


Related questions

No questions were found.
Github User Rank List