Skip to content

Releases: nandorojo/dripsy

v2.3.2

18 Aug 15:55
Compare
Choose a tag to compare

2.3.2 (2021-08-18)

Note: Version bump only for package dripsy

v2.2.0

21 May 21:55
Compare
Choose a tag to compare

2.2.0 (2021-05-21)

New: Headless Dripsy with useSx

import { useSx } from 'dripsy'

If you want to use the sx prop with a custom component, such as from another library, try the useSx hook:

import { Button } from 'react-native-paper'

export default function HeadlessButton() {
  const sx = useSx()

  return <Button style={sx({ color: 'primary' })} />
}

The sx function will return a memoized value.

v2.1.0

21 May 21:30
Compare
Choose a tag to compare

2.1.0 (2021-05-21)

Features

  • styled(View)(({ primary }) => ({ height: primary ? 1 : 2 })) (ab3be90)

v2.0.1

20 May 22:43
Compare
Choose a tag to compare

v2 is now out.

yarn add dripsy

Fixes

There are a lot of nice performance benefits now that we got rid of the Fresnel dependency. It'll be completely gone in a minor update.

Breaking Changes

  • This version gets rid of SSR support. If you're using Next.js, pass ssr={true} to your DripsyProvider. This comes with a lot of great fixes.
  • The webContainerSx prop has been deprecated 😎

Features

v2 doesn't come with any big features yet. Now that we've gotten rid of Fresnel, a ton of doors immediately open to add more features. Consider this major shift a way to let us do much more with Dripsy.

Style based on props

Via #85 and #12, this syntax will now be allowed, and type safe!

It isn't implemented yet, but look out for it.

const TallView = styled(View)(({ height }: { height: number }) => ({
  height
}))

export default () => <TallView height={1} />

This could also let you memoize components more, if you need to.

Custom component props

Some components, such as ScrollView, have custom style props, such as contentContainerStyle. v2 will make it super easy to support adding themed values to this! It will probably look like this:

const Scrollable = styled(ScrollView, {
  customProps: {
    contentContainerStyle: true
  }
})()

export default () => <TallView height={1} contentContainerStyle={{ bg: 'primary' }} />

The API still needs some work here.

Memoized useSx hook

This isn't implemented either, but v2 makes it possible.

import { Button } from 'react-native-paper'
import { useSx } from 'dripsy' // this doesn't exist yet!

export default function PaperButton() {
  const paddingTall = 2
  const sx = useSx(() => ({ px: [1, null, paddingTall] }), [paddingTall])

  return <Button style={sx} />
}

This offers another API for interacting with third-party components, besides styled.

v1.5.18

09 May 20:21
Compare
Choose a tag to compare

1.5.18 (2021-05-09)

Bug Fixes

v1.5.17

09 May 20:20
Compare
Choose a tag to compare

1.5.17 (2021-05-09)

Bug Fixes

  • add jsx pragma for classic runTime to ssr-component file (efa4a82)
  • make sure to tell use jsx as well (117e800)

v1.5.16

28 Apr 16:43
Compare
Choose a tag to compare

1.5.16 (2021-04-28)

Note: Version bump only for package dripsy

v1.5.15

28 Apr 16:38
Compare
Choose a tag to compare

1.5.15 (2021-04-28)

Note: Version bump only for package dripsy

v1.5.14

28 Apr 16:32
Compare
Choose a tag to compare

1.5.14 (2021-04-28)

Note: Version bump only for package dripsy

v1.5.13

28 Apr 16:26
Compare
Choose a tag to compare

1.5.13 (2021-04-28)

Note: Version bump only for package dripsy