v1.0.0-beta/react-resval

[nurulakbaral]

React Resval v1.0.0-beta

What's going on here?

First of all I realize that for React Resval version v0.1.0 there are some flaws in the abstraction is more or less not modular and redundant. So I tried to abstract again to be more modular in version v1.0.0.

v0.1.0

export function Component() {

  // There was repeated use of hooks.
  const fontSize = useVx({ base: '12px', md: '24px' })
  const color = useVx({ base: 'red', '600px': 'blue', lg: 'black' })

  return (
    <div>
      <h1 style={{ fontSize, color }}>Hello World!</h1>
    </div>
  )
}

v1.0.0

export function Component() {

  const { fontSize, color } = useVx({
    fontSize: { base: '12px', md: '24px' },
    color: { base: 'red', '600px': 'blue', lg: 'black' }
  })

  return (
    <div>
      <h1 style={{ fontSize, color }}>Hello World!</h1>
    </div>
  )
}