npmpackage.info

Gathering detailed insights and metrics for react-native-flip-card

Other packages similar to react-native-flip-card

react-native-card-flip

1.0.7

Card flip animation for React Native

@types/react-native-flip-card

3.5.7

TypeScript definitions for react-native-flip-card

react-native-flip-card-plus

2.0.0

The card component which has a motion of flip for React Native(Android) with gestures

@ivangonzalezg/react-native-flip-card

3.5.7

The card component which has a motion of flip for React Native(iOS/Android)

Gathering detailed insights and metrics for react-native-flip-card

react-native-flip-card - 3.5.7 | npmpackage.info

react-native-flip-card

The card component which has a motion of flip for React Native(iOS/Android)

3.5.7

392

MIT

JavaScript

13.81 kB

2,722,800 2.3

Installations

npm install react-native-flip-card

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

16.18.0

NPM Version

8.19.2 Score

85.8

Supply Chain

98.3

Quality

77.9

Maintenance

100

Vulnerability

100

License

Pull Requests

Open

3

Total

59

Closed

31

Merged

25

Issues

Open

23

Total

51

Closed

28

Releases

v3.5.7

Updated on Feb 13, 2023

View All 1 releases

Languages

JavaScript

Objective-C

Starlark

Java

JavaScript (69.69%)

Objective-C (17.89%)

Starlark (7.02%)

Java (5.4%)

Developer

moschan

Download Statistics

Total Downloads

2,722,800

Last Day

208

Last Week

5,048

Last Month

22,483

Last Year

288,814

GitHub Statistics

MIT License

392 Stars

118 Commits

110 Forks

7 Watchers

3 Branches

23 Contributors

Updated on May 25, 2025

Maintainers

View All 23 Contributors

Package Meta Information

Latest Version

3.5.7

Package Id

react-native-flip-card@3.5.7

Unpacked Size

13.81 kB

Size

4.42 kB

File Count

NPM Version

8.19.2

Node Version

16.18.0

Published on

Feb 13, 2023

Total Downloads

Cumulative downloads

Total Downloads

2,722,800

Last Day

-51.7%

208

Compared to previous day

Last Week

-17.2%

5,048

Compared to previous week

Last Month

-2.1%

22,483

Compared to previous month

Last Year

-24.9%

288,814

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

deprecated-react-native-prop-types prop-types

react-native-flip-card

The card component which have motion of flip for React Native(iOS/Android)

Demo

Installation

in Cli

npm i react-native-flip-card

Usage

Simple

import FlipCard from 'react-native-flip-card'

<FlipCard>
  {/* Face Side */}
  <View style={styles.face}>
    <Text>The Face</Text>
  </View>
  {/* Back Side */}
  <View style={styles.back}>
    <Text>The Back</Text>
  </View>
</FlipCard>

Customized

<FlipCard 
  style={styles.card}
  friction={6}
  perspective={1000}
  flipHorizontal={true}
  flipVertical={false}
  flip={false}
  clickable={true}
  onFlipEnd={(isFlipEnd)=>{console.log('isFlipEnd', isFlipEnd)}}
>
  {/* Face Side */}
  <View style={styles.face}>
    <Text>The Face</Text>
  </View>
  {/* Back Side */}
  <View style={styles.back}>
    <Text>The Back</Text>
  </View>
</FlipCard>

Props

flip(bool) `Default: false`

If you change default display side, you can set true to this param. If you change side, you can pass bool variable dynamically.

clickable(bool) `Default: true`

If you want to disable click a card, you can set false to this param.

friction(number) `Default: 6`

The friction of card animation

perspective(number) `Default: 0`

The amount of perspective applied to the flip transformation

flipHorizontal(bool) `Default: false`

If you set true, a card flip to horizontal.

flipVertical(bool) `Default: true`

If you set false, a card not flip to vertical. If you set true both flipHorizontal and flipVertical , a card flip to diagonal.

vertical	diagnoal

onFlipStart(function) `(isFlipStart) => {}`

When a card starts a flip animation, call onFlipEnd function with param.

onFlipEnd(function) `(isFlipEnd) => {}`

When a card finishes a flip animation, call onFlipEnd function with param.

alignHeight(boolean) `Default:false`

If you pass true to alignHeight param, the card keep height of bigger side.

alignWidth(boolean) `Default:false`

If you pass true to alignWidth param, the card keep width of bigger side.

useNativeDriver(boolean) `Default:false`

If you pass true to useNativeDriver param, the card animation will utilize the native driver.

Credits

Inspired by react-flipcard

License

MIT

No vulnerabilities found.

10

License

Determines if the project has defined a license.

9

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

5

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Reason

86 existing vulnerabilities detected

Details

Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25
Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
Warn: Project is vulnerable to: GHSA-j4mr-9xw3-c9jx
Warn: Project is vulnerable to: GHSA-7p89-p6hx-q4fw
Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx
Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4
Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
Warn: Project is vulnerable to: GHSA-9vvw-cc9w-f27h
Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
Warn: Project is vulnerable to: GHSA-h6ch-v84p-w6p9
Warn: Project is vulnerable to: GHSA-qrmc-fj45-qfc2
Warn: Project is vulnerable to: GHSA-9qj9-36jm-prpv
Warn: Project is vulnerable to: GHSA-q42p-pg8m-cqh6
Warn: Project is vulnerable to: GHSA-w457-6q6x-cgp9
Warn: Project is vulnerable to: GHSA-62gr-4qp9-h98f
Warn: Project is vulnerable to: GHSA-f52g-6jhx-586p
Warn: Project is vulnerable to: GHSA-2cf5-4w76-r9qv
Warn: Project is vulnerable to: GHSA-3cqr-58rm-57f8
Warn: Project is vulnerable to: GHSA-g9r4-xpmj-mj65
Warn: Project is vulnerable to: GHSA-q2c6-c6pm-g3gh
Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44
Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988
Warn: Project is vulnerable to: GHSA-44pw-h2cw-w3vq
Warn: Project is vulnerable to: GHSA-jp4x-w63m-7wgm
Warn: Project is vulnerable to: GHSA-c429-5p7v-vgjp
Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
Warn: Project is vulnerable to: GHSA-2pr6-76vf-7546
Warn: Project is vulnerable to: GHSA-8j8c-7jfh-h6hx
Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695
Warn: Project is vulnerable to: GHSA-fvqr-27wr-82fm
Warn: Project is vulnerable to: GHSA-4xc9-xhrj-v574
Warn: Project is vulnerable to: GHSA-x5rq-j2xg-h7qm
Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
Warn: Project is vulnerable to: GHSA-f9cm-qmx5-m98h
Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp
Warn: Project is vulnerable to: GHSA-qx2f-477c-35rq
Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
Warn: Project is vulnerable to: GHSA-wrvr-8mpx-r7pp
Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
Warn: Project is vulnerable to: GHSA-446m-mv8f-q348
Warn: Project is vulnerable to: GHSA-8hfj-j24r-96c4
Warn: Project is vulnerable to: GHSA-wc69-rhjr-hc9g
Warn: Project is vulnerable to: GHSA-gwg9-rgvj-4h5j
Warn: Project is vulnerable to: GHSA-w9mr-4mfr-499f
Warn: Project is vulnerable to: GHSA-7mc5-chhp-fmc3
Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g
Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p
Warn: Project is vulnerable to: GHSA-6394-6h9h-cfjg
Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
Warn: Project is vulnerable to: GHSA-4cpg-3vgw-4877
Warn: Project is vulnerable to: GHSA-gqgv-6jq5-jjj9
Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
Warn: Project is vulnerable to: GHSA-6g33-f262-xjp4
Warn: Project is vulnerable to: GHSA-rxrc-rgv4-jpvx
Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
Warn: Project is vulnerable to: GHSA-gff7-g5r8-mg8m
Warn: Project is vulnerable to: GHSA-2m39-62fm-q8r3
Warn: Project is vulnerable to: GHSA-mf6x-7mm4-x2g7
Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v
Warn: Project is vulnerable to: GHSA-g7q5-pjjr-gqvp
Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
Warn: Project is vulnerable to: GHSA-662x-fhqg-9p8v
Warn: Project is vulnerable to: GHSA-394c-5j6w-4xmx
Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3
Warn: Project is vulnerable to: GHSA-5v72-xg48-5rpm
Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
Warn: Project is vulnerable to: GHSA-h6q6-9hqw-rwfv
Warn: Project is vulnerable to: GHSA-5fg8-2547-mr8q
Warn: Project is vulnerable to: GHSA-crh6-fp67-6883
Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp

Score

2.3

/10

Last Scanned on 2025-06-30

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to react-native-flip-card

Other packages similar to react-native-flip-card

react-native-flip-card

Installations

Developer Guide

No

CommonJS

16.18.0

8.19.2

Score

Pull Requests

3

59

31

25

Issues

23

51

28

Releases

Languages

Developer

moschan

Download Statistics

GitHub Statistics

Maintainers

Package Meta Information

Total Downloads

2,722,800

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

react-native-flip-card

Demo

Installation

in Cli

Usage

Simple

Customized

Props

flip(bool) Default: false

clickable(bool) Default: true

friction(number) Default: 6

perspective(number) Default: 0

flipHorizontal(bool) Default: false

flipVertical(bool) Default: true

onFlipStart(function) (isFlipStart) => {}

onFlipEnd(function) (isFlipEnd) => {}

alignHeight(boolean) Default:false

alignWidth(boolean) Default:false

useNativeDriver(boolean) Default:false

Credits

License

10

9

5

0

0

0

0

0

0

0

2.3

/10

flip(bool) `Default: false`

clickable(bool) `Default: true`

friction(number) `Default: 6`

perspective(number) `Default: 0`

flipHorizontal(bool) `Default: false`

flipVertical(bool) `Default: true`

onFlipStart(function) `(isFlipStart) => {}`

onFlipEnd(function) `(isFlipEnd) => {}`

alignHeight(boolean) `Default:false`

alignWidth(boolean) `Default:false`

useNativeDriver(boolean) `Default:false`