Gathering detailed insights and metrics for @deskpro/react-datepicker-hijri
Gathering detailed insights and metrics for @deskpro/react-datepicker-hijri
A simple and reusable datepicker component for React
Installations
npm install @deskpro/react-datepicker-hijriDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Releases
Unable to fetch releases
Languages
5
JavaScript
CSS
SCSS
Shell
HTML
JavaScript (98.14%)
CSS (0.94%)
SCSS (0.79%)
Shell (0.1%)
HTML (0.02%)
Developer
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
MIT License
4 Stars
1,362 Commits
9 Forks
8 Watchers
13 Branches
33 Contributors
Updated on Dec 03, 2024
Maintainers
2
Package Meta Information
Latest Version
1.5.1
Package Id
@deskpro/react-datepicker-hijri@1.5.1
Size
72.85 kB
Published on
Jun 29, 2020
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
4
Peer Dependencies
4
Dev Dependencies
65
babel-corebabel-eslintbabel-loaderbabel-plugin-add-react-displaynamebabel-plugin-external-helpersbabel-plugin-react-transformbabel-plugin-transform-class-propertiesbabel-plugin-transform-react-remove-prop-typesbabel-polyfillbabel-preset-airbnbbabel-preset-envbabel-preset-reactbabel-preset-stage-0chaicodecov.iocross-envcss-loaderenzymeenzyme-adapter-react-16eslinteslint-plugin-importeslint-plugin-nodeeslint-plugin-promiseeslint-plugin-reactexpressextract-text-webpack-pluginflow-binhighlight.jshuskyisparta-loaderkarmakarma-chaikarma-coveragekarma-firefox-launcherkarma-mochakarma-sinonkarma-sourcemap-loaderkarma-webpacklint-stagedlodashmochamomentmoment-hijrinode-sassnpm-run-allprettierreactreact-docgenreact-domreact-test-rendererreact-transform-hmrrimrafrolluprollup-plugin-babelrollup-plugin-commonjsrollup-plugin-node-resolverollup-plugin-uglifysass-lintsass-loadersinonstyle-loaderwebpackwebpack-dev-middlewarewebpack-dev-serverwebpack-hot-middleware
React Date Picker
A simple and reusable Datepicker component for React (Demo)
Installation
The package can be installed via NPM:
npm install @deskpro/react-datepicker-hijri --save
You’ll need to install react, propTypes, moment and moment-hijri separately since those dependencies aren’t included in the package. Below is a simple example of how to use the Datepicker in a React view. You will also need to require the CSS file from this package (or provide your own). The example below shows how to include the CSS from this package if your build system supports requiring CSS files (Webpack is one that does).
1import React from "react"; 2import DatePicker from "@deskpro/react-datepicker-hijri"; 3import moment from "moment-hijri"; 4 5import "@deskpro/react-datepicker-hijri/dist/react-datepicker.css"; 6 7// CSS Modules, react-datepicker-cssmodules.css 8// import '@deskpro/react-datepicker-hijri/dist/react-datepicker-cssmodules.css'; 9 10class Example extends React.Component { 11 constructor(props) { 12 super(props); 13 this.state = { 14 startDate: moment() 15 }; 16 this.handleChange = this.handleChange.bind(this); 17 } 18 19 handleChange(date) { 20 this.setState({ 21 startDate: date 22 }); 23 } 24 25 render() { 26 return ( 27 <DatePicker 28 selected={this.state.startDate} 29 onChange={this.handleChange} 30 calendar="hijri" 31 /> 32 ); 33 } 34}
Configuration
The most basic use of the DatePicker can be described with:
1<DatePicker selected={this.state.date} onChange={this.handleChange} />
You can use onSelect event handler which fires each time some calendar date has been selected
1<DatePicker selected={this.state.date} 2 onSelect={this.handleSelect} //when day is clicked 3 onChange={this.handleChange} //only when value has changed 4/>
onClickOutside handler may be useful to close datepicker in inline mode
See here for a full list of props that may be passed to the component. Examples are given on the main website.
Time picker
You can also include a time picker by adding the showTimeSelect prop
1<DatePicker 2 selected={this.state.date} 3 onChange={this.handleChange} 4 showTimeSelect 5 dateFormat="LLL" 6/>
Times will be displayed at 30-minute intervals by default (default configurable via timeInterval prop)
More examples of how to use the time picker are given on the main website
Localization
The date picker relies on moment.js internationalization to localize its display components. By default, the date picker will use the locale globally set in moment, which is English. Locales can be changed in the following ways:
- Globally by calling
moment.locale(lang) - Picker-specific by providing the
localeprop
Locales can be further configured in moment with various customization options.
As of version 0.23, the weekdays and weekStart DatePicker props have been removed. Instead, they can be configured with the weekdaysMin and week.dow moment locale customization options.
Compatibility
React
We're always trying to stay compatible with the latest version of React. We can't support all older versions of React.
Latest compatible versions:
- React 15.5 or newer: All above React-datepicker v.0.40.0
- React 15.4.1: needs React-datepicker v0.40.0, newer won't work (due to react-onclickoutside dependencies)
- React 0.14 or newer: All above React-datepicker v0.13.0
- React 0.13: React-datepicker v0.13.0
- pre React 0.13: React-datepicker v0.6.2
Browser Support
The date picker is compatible with the latest versions of Chrome, Firefox, and IE10+.
Unfortunately, it is difficult to support legacy browsers while maintaining our ability to develop new features in the future. For IE9 support, it is known that the classlist polyfill is needed, but this may change or break at any point in the future.
Local Development
The master branch contains the latest version of the Datepicker component. To start your example app, you can run yarn start. This starts a simple webserver on http://localhost:8080.
You can run yarn test to execute the test suite and linters. To help you develop the component we’ve set up some tests that cover the basic functionality (can be found in /tests). Even though we’re big fans of testing, this only covers a small piece of the component. We highly recommend you add tests when you’re adding new functionality.
The examples
The examples are hosted within the docs folder and are ran in the simple app that loads the Datepicker. To extend the examples with a new example, you can simply duplicate one of the existing examples and change the unique properties of your example.
Accessibility
Keyboard support
- Left: Move to the previous day.
- Right: Move to the next day.
- Up: Move to the previous week.
- Down: Move to the next week.
- PgUp: Move to the previous month.
- PgDn: Move to the next month.
- Home: Move to the previous year.
- End: Move to the next year.
- Enter/Esc/Tab: close the calendar. (Enter & Esc calls preventDefault)
License
Copyright (c) 2017 HackerOne Inc. and individual contributors. Licensed under MIT license, see LICENSE for the full license.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 1/11 approved changesets -- score normalized to 0
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Info: Possibly incomplete results: error parsing shell code: a command can only contain words and redirects; encountered (: scripts/generateMarkdown.sh:0
- Warn: npmCommand not pinned by hash: scripts/release.sh:10
- Info: 0 out of 1 npmCommand dependencies pinned
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 20 are checked with a SAST tool
Reason
95 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-6chw-6frg-f759
- Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
- Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25
- Warn: Project is vulnerable to: GHSA-pp7h-53gx-mx7r
- 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-257v-vj4p-3w2h
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-h6ch-v84p-w6p9
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-jcpv-g9rr-qxrc
- Warn: Project is vulnerable to: GHSA-44pw-h2cw-w3vq
- Warn: Project is vulnerable to: GHSA-vfrc-7r7c-w9mx
- Warn: Project is vulnerable to: GHSA-7wwv-vh3v-89cq
- 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-c7qv-q95q-8v27
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr
- Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg
- 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-282f-qqgm-c34q
- Warn: Project is vulnerable to: GHSA-675m-85rw-j3w4
- Warn: Project is vulnerable to: GHSA-7x7c-qm48-pq9c
- Warn: Project is vulnerable to: GHSA-rc3x-jf5g-xvc5
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- 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-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-wrvr-8mpx-r7pp
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g
- Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5
- Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp
- Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq
- Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr
- Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765
- Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-6fx8-h7jm-663j
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-566m-qj78-rww5
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- 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-7xfp-9c55-5vqj
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
- Warn: Project is vulnerable to: GHSA-7mwh-4pqv-wmr8
- 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-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-25hc-qcg6-38wj
- Warn: Project is vulnerable to: GHSA-cqmj-92xf-r6r9
- Warn: Project is vulnerable to: GHSA-c9g6-9335-x697
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-xc7v-wxcw-j472
- Warn: Project is vulnerable to: GHSA-394c-5j6w-4xmx
- Warn: Project is vulnerable to: GHSA-78cj-fxph-m83p
- Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3
- Warn: Project is vulnerable to: GHSA-cf4h-3jhx-xvhq
- Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
- Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v
- Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
Score
1.6
/10
Last Scanned on 2025-07-07
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