npmpackage.info

Gathering detailed insights and metrics for react-native-dropdown-picker

Other packages similar to react-native-dropdown-picker

@react-native-picker/picker

2.10.0

React Native Picker for iOS, Android, macOS, and Windows

react-native-select-dropdown

4.0.1

react-native-select-dropdown is a highly customized dropdown | select | picker | menu for react native that works for andriod and iOS platforms.

react-native-modal-datetime-picker

18.0.0

A react-native datetime-picker for Android and iOS

react-native-date-picker

5.0.7

A datetime picker for React Native. In-modal or inlined. Supports Android and iOS.

Gathering detailed insights and metrics for react-native-dropdown-picker

react-native-dropdown-picker

A single / multiple, categorizable, customizable, localizable and searchable item picker (drop-down) component for react native which supports both Android & iOS.

5.4.6

1,001

MIT

JavaScript

10,280,557 2.6

Installations

npm install react-native-dropdown-picker

Score

58.6

Supply Chain

55.9

Quality

71.5

Maintenance

Vulnerability

95.6

License

Pull Requests

Open

10

Total

190

Closed

21

Merged

159

Issues

Open

152

Total

572

Closed

420

Releases

v5.4.6

Published on 09 Mar 2023

v5.4.4

Published on 20 Dec 2022

v5.4.3

Published on 12 Nov 2022

v5.4.2

Published on 06 May 2022

v5.4.1

Published on 06 May 2022

v5.4.0

Published on 08 Apr 2022

View all 35 releases

Developer

hossein-zare

Developer Guide

BETA

Module System

CommonJS

Min. Node Version

Typescript Support

Yes

Node Version

12.22.12

NPM Version

6.14.16 Statistics

1,001 Stars

729 Commits

297 Forks

9 Watching

7 Branches

43 Contributors

Updated on 27 Nov 2024

Languages

JavaScript (97.09%)

Shell (2.91%)

Total Downloads

Cumulative downloads

Total Downloads

10,280,557

Last day

6.6%

18,241

Compared to previous day

Last week

7.3%

95,745

Compared to previous week

Last month

8.5%

380,698

Compared to previous month

Last year

28.9%

4,242,850

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Peer Dependencies

react react-native

Dev Dependencies

@types/react @types/react-native @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-config-airbnb eslint-config-airbnb-typescript eslint-config-prettier eslint-plugin-eslint-comments eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-prettier eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-react-native prettier typescript

Versions

React Native Dropdown Picker

📱 Screenshots

The above screenshots were taken from this example.

👋 Usage

Basic usage

The following code shows basic usage of this library:

1import React, {useState} from 'react';
2import {View, Text} from 'react-native';
3import DropDownPicker from 'react-native-dropdown-picker';
4
5export default function App() {
6    const [open, setOpen] = useState(false);
7    const [value, setValue] = useState(null);
8    const [items, setItems] = useState([
9        {label: 'Apple', value: 'apple'},
10        {label: 'Banana', value: 'banana'},
11        {label: 'Pear', value: 'pear'},
12    ]);
13
14    return (
15        <View style={{flex: 1}}>
16            <View
17                style={{
18                    flex: 1,
19                    alignItems: 'center',
20                    justifyContent: 'center',
21                    paddingHorizontal: 15,
22                }}>
23                <DropDownPicker
24                    open={open}
25                    value={value}
26                    items={items}
27                    setOpen={setOpen}
28                    setValue={setValue}
29                    setItems={setItems}
30                    placeholder={'Choose a fruit.'}
31                />
32            </View>
33
34            <View style={{
35                flex: 1,
36                alignItems: 'center',
37                justifyContent: 'center'
38            }}>
39                <Text>Chosen fruit: {value === null ? 'none' : value}</Text>
40            </View>
41        </View>
42    );
43}

Further information on usage

You can find more examples in the examples subdirectory. This subdirectory is a working Expo project demonstrating this library. It shows how to use this library with class components as well as with function components, and in TypeScript as well as in JavaScript. Navigate into the examples subdirectory, run npm install, and then run npx expo start to see the examples working.

For further information on how to use this library, read the usage documentation.

📄 Further documentation

The docs can be read at: https://hossein-zare.github.io/react-native-dropdown-picker-website

The docs can be edited at: https://github.com/hossein-zare/react-native-dropdown-picker-website

😕 Support and issues

If you have questions or need help, you can ask a question on Stack Overflow or make a GitHub issue. You can also make a GitHub issue to report a bug or make a feature request.

🚀️ Contributing

See CONTRIBUTING.md.

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

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

10

License

Determines if the project has defined a license.

1

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

Reason

dependency not pinned by hash detected -- score normalized to 1

Details

Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:108: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/ci.yaml:109: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:115: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/ci.yaml:116: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:122: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/ci.yaml:126: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:18: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:44: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:45: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:68: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:88: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/ci.yaml:90: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/ci.yaml:98: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/ci.yaml:99: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/ci.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publish.yaml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/publish.yaml/dev-5.x?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publish.yaml:13: update your workflow using https://app.stepsecurity.io/secureworkflow/hossein-zare/react-native-dropdown-picker/publish.yaml/dev-5.x?enable=pin
Warn: npmCommand not pinned by hash: update_reformat.sh:36
Warn: npmCommand not pinned by hash: update_reformat.sh:38
Warn: npmCommand not pinned by hash: update_reformat.sh:41
Warn: npmCommand not pinned by hash: update_reformat.sh:48
Warn: npmCommand not pinned by hash: update_reformat.sh:51
Info: 0 out of 12 GitHub-owned GitHubAction dependencies pinned
Info: 0 out of 5 third-party GitHubAction dependencies pinned
Info: 2 out of 7 npmCommand dependencies pinned

0

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

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

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.

Score

2.6

/10

Last Scanned on 2024-11-18

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