New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
Socket
Book a DemoSign in
Socket

react-native-cool-components

Package Overview
Dependencies
Maintainers
1
Versions
9
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-native-cool-components

You can use some cool and animated components for both android and iOS. More components will get updated in future

latest
Source
npmnpm
Version
0.0.9
Version published
Maintainers
1
Created
Source

Welcome to react-native-cool-components

You can use some cool and animated components for both android and iOS. More components will get updated in future

Installation

npm i react-native-cool-components or yarn add react-native-cool-components

ButtonSwiper

ButtonSwiper

Usage

import { SafeAreaView } from "react-native";
import { ButtonSwiper } from "react-native-cool-components";
export class App extends Component {
  render() {
    return (
      <SafeAreaView>
        <ButtonSwiper onSwipeComplete={() => alert("Yo I just triggered")} />
      </SafeAreaView>
    );
  }
}

export default App;

Props

Prop NameTypeDefaultDescription
backContainerStyleStylenullback container wrapper style
placeHolderStyleStylenullspecify the width of the button within the string or number
buttonContainerStyleStylenullbutton container wrapper style
buttonTextStringCompletedbutton text
placeHolderStringSwipe to completeplaceholder text
onSwipeCompleteFunctionnullfunction to be triggered after button swiped to the end

BlurredCarousel

BlurredCarousel

Usage

import { SafeAreaView } from "react-native";
import { BlurredCarousel } from "react-native-cool-components";

const DATA = [
  "https://images.unsplash.com/photo-1612802687608-49884a90c5e0?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=700&q=80",
  "https://images.unsplash.com/photo-1612801572917-2f5e80c844bc?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80",
  "https://images.unsplash.com/photo-1612799077072-abec2b27a6e8?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80",
  "https://images.unsplash.com/photo-1612780829124-5180ccf69823?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80",
];

export class App extends Component {


  render() {
    return <BlurredCarousel data={DATA} />
  }
}

export default App;

Props

Prop NameTypeDefaultDescription
dataArraynulllist of images to be displayed
imageStyleStylenullimage style

Keywords

react-native-cool-components

FAQs

Package last updated on 08 Feb 2021

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts