├── .npmignore ├── .gitignore ├── lib ├── styles │ └── style.css ├── index.js └── elements │ ├── Header.js │ ├── Container.js │ ├── Span.js │ ├── CalendarHeading.js │ ├── Wrapper.js │ ├── Label.js │ ├── CalendarContainer.js │ ├── Icon.js │ ├── Input.js │ ├── SingleArrow.js │ ├── DoubleArrow.js │ ├── CalendarBody.js │ ├── DateEditor.js │ ├── MonthView.js │ ├── YearView.js │ └── DateView.js ├── dateview.jpg ├── yearview.jpg ├── monthview.jpg ├── assets ├── dateview.png ├── screen1.png ├── screen2.png ├── screen3.png ├── screen4.png ├── screen5.png ├── screen6.png ├── screen7.png ├── screen8.png ├── yearview.png └── monthview.png ├── coverage ├── favicon.png ├── sort-arrow-sprite.png ├── lcov-report │ ├── sort-arrow-sprite.png │ ├── prettify.css │ ├── block-navigation.js │ ├── elements │ │ ├── Header.js.html │ │ ├── Container.js.html │ │ ├── CalendarHeading.js.html │ │ ├── Span.js.html │ │ ├── Wrapper.js.html │ │ ├── CalendarContainer.js.html │ │ ├── Label.js.html │ │ ├── Icon.js.html │ │ ├── Input.js.html │ │ ├── SingleArrow.js.html │ │ └── DoubleArrow.js.html │ ├── components │ │ └── index.html │ ├── index.html │ ├── sorter.js │ └── base.css ├── prettify.css ├── block-navigation.js ├── elements │ ├── Header.js.html │ ├── Container.js.html │ ├── CalendarHeading.js.html │ ├── Span.js.html │ ├── Wrapper.js.html │ ├── CalendarContainer.js.html │ ├── Label.js.html │ ├── Icon.js.html │ ├── Input.js.html │ └── SingleArrow.js.html ├── components │ └── index.html ├── index.html ├── sorter.js └── base.css ├── modernDatepicker.png ├── .babelrc ├── __tests__ └── __snapshots__ │ └── ModernDatepicker.test.js.snap ├── webpack.config.js ├── package.json ├── CONTRIBUTING.md ├── CODE_OF_CONDUCT.md └── .eslintrc_test /.npmignore: -------------------------------------------------------------------------------- 1 | .babelrc 2 | lib 3 | CODE_OF_CONDUCT.md 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | build 3 | node_modules 4 | *.log 5 | -------------------------------------------------------------------------------- /lib/styles/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css?family=Open+Sans'); -------------------------------------------------------------------------------- /dateview.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/dateview.jpg -------------------------------------------------------------------------------- /yearview.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/yearview.jpg -------------------------------------------------------------------------------- /monthview.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/monthview.jpg -------------------------------------------------------------------------------- /assets/dateview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/dateview.png -------------------------------------------------------------------------------- /assets/screen1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen1.png -------------------------------------------------------------------------------- /assets/screen2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen2.png -------------------------------------------------------------------------------- /assets/screen3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen3.png -------------------------------------------------------------------------------- /assets/screen4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen4.png -------------------------------------------------------------------------------- /assets/screen5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen5.png -------------------------------------------------------------------------------- /assets/screen6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen6.png -------------------------------------------------------------------------------- /assets/screen7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen7.png -------------------------------------------------------------------------------- /assets/screen8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/screen8.png -------------------------------------------------------------------------------- /assets/yearview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/yearview.png -------------------------------------------------------------------------------- /assets/monthview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/assets/monthview.png -------------------------------------------------------------------------------- /coverage/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/coverage/favicon.png -------------------------------------------------------------------------------- /lib/index.js: -------------------------------------------------------------------------------- 1 | import ModernDatepicker from './components/ModernDatepicker'; 2 | export default ModernDatepicker; 3 | -------------------------------------------------------------------------------- /modernDatepicker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/modernDatepicker.png -------------------------------------------------------------------------------- /coverage/sort-arrow-sprite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/coverage/sort-arrow-sprite.png -------------------------------------------------------------------------------- /coverage/lcov-report/sort-arrow-sprite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/talentedandrew/react-modern-datepicker/HEAD/coverage/lcov-report/sort-arrow-sprite.png -------------------------------------------------------------------------------- /lib/elements/Header.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const Header = styled.div` 3 | width:100%; 4 | text-align : left; 5 | `; 6 | export default Header; 7 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "@babel/preset-env", 4 | "@babel/preset-react" 5 | ], 6 | "plugins": [ 7 | ["babel-plugin-styled-components", { 8 | "pure": true 9 | }] 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /lib/elements/Container.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const Container = styled.div` 3 | width : 100%; 4 | position : relative; 5 | font-family: 'Open Sans', sans-serif; 6 | `; 7 | export default Container; 8 | -------------------------------------------------------------------------------- /lib/elements/Span.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const Span = styled.span` 3 | font-size: 14px; 4 | text-align: center; 5 | color: #222222; 6 | width:40px; 7 | height:40px; 8 | margin:15px; 9 | display:inline-block; 10 | line-height: 40px; 11 | cursor : pointer; 12 | overflow : auto; 13 | `; 14 | export default Span; 15 | -------------------------------------------------------------------------------- /lib/elements/CalendarHeading.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const CalendarHeading = styled.div` 3 | width : 100%; 4 | height : 64px; 5 | max-width : 325px; 6 | max-height : 64px; 7 | position : relative; 8 | background-color : ${props => props.secondaryColor}; 9 | border-bottom: solid 1px #f4f4f4; 10 | border-radius: 6px; 11 | `; 12 | export default CalendarHeading; 13 | -------------------------------------------------------------------------------- /lib/elements/Wrapper.js: -------------------------------------------------------------------------------- 1 | import styled, { keyframes } from 'styled-components'; 2 | const fadeinout = keyframes` 3 | 0% { opacity: 0; } 4 | 50% { opacity: 1; } 5 | `; 6 | const Wrapper = styled.div` 7 | width: 100%; 8 | height: 250px; 9 | max-width: 280px; 10 | background: ${props => props.secondaryColor}; 11 | text-align: center; 12 | box-sizing: border-box; 13 | margin: 0 auto; 14 | animation: ${fadeinout} .5s linear 1 forwards; 15 | `; 16 | export default Wrapper; 17 | -------------------------------------------------------------------------------- /__tests__/__snapshots__/ModernDatepicker.test.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`ModernDatepicker component ModernDatepicker: renders correctly 1`] = ` 4 |
8 | 16 |
17 | `; 18 | -------------------------------------------------------------------------------- /lib/elements/Label.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | import React from 'react'; 3 | import PropTypes from 'prop-types'; 4 | const DLabel = styled.label` 5 | font-size: 15px; 6 | color: #000; 7 | `; 8 | const Label = props => { 9 | return ( 10 | 14 | ); 15 | }; 16 | 17 | Label.propTypes = { 18 | className: PropTypes.oneOfType([ 19 | PropTypes.string, 20 | PropTypes.object 21 | ]) 22 | }; 23 | 24 | export default Label; 25 | -------------------------------------------------------------------------------- /lib/elements/CalendarContainer.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const CalendarContainer = styled.div.attrs({ 3 | // we can define static props 4 | tabIndex: '1' 5 | })` 6 | width : 100%; 7 | user-select: none; 8 | height : 315px; 9 | max-width : 325px; 10 | min-width: 315px; 11 | max-height : 315px; 12 | position : absolute; 13 | top : 100%; 14 | background-color : ${props => props.secondaryColor}; 15 | border: solid 1px #f4f4f4; 16 | border-radius: 6px; 17 | &:focus{ 18 | outline : none; 19 | } 20 | `; 21 | export default CalendarContainer; 22 | -------------------------------------------------------------------------------- /coverage/prettify.css: -------------------------------------------------------------------------------- 1 | .pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun,.opn,.clo{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun,.opn,.clo{color:#440}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee} 2 | -------------------------------------------------------------------------------- /coverage/lcov-report/prettify.css: -------------------------------------------------------------------------------- 1 | .pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun,.opn,.clo{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun,.opn,.clo{color:#440}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee} 2 | -------------------------------------------------------------------------------- /lib/elements/Icon.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | import React from 'react'; 3 | import PropTypes from 'prop-types'; 4 | 5 | const Img = styled.img` 6 | width: 22px; 7 | height: 22px; 8 | position : absolute; 9 | cursor: pointer; 10 | bottom: 3px; 11 | margin: auto; 12 | right: 10px; 13 | `; 14 | 15 | const Icon = props => { 16 | return ( 17 | 22 | ); 23 | }; 24 | Icon.propTypes = { 25 | className: PropTypes.oneOfType([ 26 | PropTypes.string, 27 | PropTypes.object 28 | ]), 29 | icon: PropTypes.string.isRequired 30 | }; 31 | export default Icon; 32 | -------------------------------------------------------------------------------- /lib/elements/Input.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | import React from 'react'; 3 | import PropTypes from 'prop-types'; 4 | 5 | const DInput = styled.input` 6 | width:100%; 7 | padding: 5px; 8 | color: black; 9 | background: white; 10 | border: ${props => !props.showBorder ? 'none' : '1px solid'}; 11 | border-radius: 3px; 12 | box-sizing : border-box; 13 | &:focus { 14 | outline: none; 15 | } 16 | `; 17 | 18 | const Input = props => { 19 | return ( 20 | 24 | ); 25 | }; 26 | 27 | Input.propTypes = { 28 | className: PropTypes.oneOfType([ 29 | PropTypes.string, 30 | PropTypes.object 31 | ]) 32 | }; 33 | 34 | export default Input; 35 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const webpack = require('webpack'); 3 | const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; 4 | module.exports = { 5 | mode: 'production', 6 | entry: './lib/index.js', 7 | output: { 8 | path: path.resolve(__dirname, 'dist'), 9 | filename: 'main.js', 10 | library: { 11 | name: 'ReactModernDatepicker', 12 | type: 'umd', 13 | }, 14 | globalObject: 'this' 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.(js|jsx)$/, 20 | exclude: /node_modules/, 21 | use: { 22 | loader: 'babel-loader', 23 | }, 24 | }, 25 | ], 26 | }, 27 | optimization: { 28 | // We no not want to minimize our code. 29 | minimize: false 30 | }, 31 | externals: { 32 | react: { 33 | root: 'React', 34 | commonjs2: 'react', 35 | commonjs: 'react', 36 | amd: 'react', 37 | }, 38 | 'react-dom': { 39 | root: 'ReactDOM', 40 | commonjs2: 'react-dom', 41 | commonjs: 'react-dom', 42 | amd: 'react-dom', 43 | }, 44 | }, 45 | plugins: [ 46 | new BundleAnalyzerPlugin({ 47 | analyzerMode: 'static', 48 | generateStatsFile: false, 49 | reportFilename: path.resolve(__dirname, 'report', 'report.html') 50 | }), 51 | ], 52 | }; 53 | -------------------------------------------------------------------------------- /lib/elements/SingleArrow.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const SingleArrow = styled.span` 3 | width: 22px; 4 | height: 22px; 5 | border-radius: 11.3px; 6 | background-color: ${props => props.secondaryColor}; 7 | display: inline-block; 8 | position : absolute; 9 | top: 0; 10 | cursor: pointer; 11 | bottom: 0; 12 | margin: auto; 13 | color: #b8c2cb; 14 | font-weight: bold; 15 | opacity: 0.4; 16 | border-radius: 50%; 17 | border: ${props => '2px solid ' + props.primaryTextColor}; 18 | ${props => props.left ? 'left' : 'right'} : 40px; 19 | &:after { 20 | content: ''; 21 | display: inline-block; 22 | margin-top: 1px; 23 | margin-left: ${props => props.left ? '8px' : '6px'} ; 24 | width: 5px; 25 | height: 5px; 26 | border-top: ${props => '2px solid ' + props.primaryTextColor}; 27 | border-right: ${props => '2px solid ' + props.primaryTextColor}; 28 | -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 29 | -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 30 | transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 31 | position: absolute; 32 | top: 0; 33 | right: 0; 34 | left: 0; 35 | bottom: 0; 36 | margin: auto; 37 | } 38 | `; 39 | 40 | export default SingleArrow; 41 | -------------------------------------------------------------------------------- /lib/elements/DoubleArrow.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | const DoubleArrow = styled.span` 3 | width: 22px; 4 | height: 22px; 5 | border-radius: 11.3px; 6 | background-color: ${props => props.secondaryColor}; 7 | display: inline-block; 8 | position : absolute; 9 | top: 0; 10 | cursor: pointer; 11 | bottom: 0; 12 | margin: auto; 13 | color: #b8c2cb; 14 | font-weight: bold; 15 | opacity: 0.4; 16 | ${props => props.left ? 'left' : 'right'} : 7px; 17 | border-radius: 50%; 18 | border: ${props => '2px solid ' + props.primaryTextColor}; 19 | &:after, &:before { 20 | content: ''; 21 | display: inline-block; 22 | width: 5px; 23 | height: 5px; 24 | border-top: ${props => '2px solid ' + props.primaryTextColor}; 25 | border-right: ${props => '2px solid ' + props.primaryTextColor}; 26 | -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 27 | -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 28 | transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ; 29 | position: absolute; 30 | top: 0; 31 | right: 0; 32 | left: 0; 33 | bottom: 0; 34 | margin: auto; 35 | } 36 | &:after{ 37 | margin-left: 5px; 38 | } 39 | &:before{ 40 | margin-right: 5px; 41 | } 42 | `; 43 | 44 | export default DoubleArrow; 45 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-modern-datepicker", 3 | "version": "1.2.0", 4 | "description": "A modern date picker for react library", 5 | "homepage": "https://github.com/talentedandrew/react-modern-datepicker#readme", 6 | "main": "dist/main.js", 7 | "scripts": { 8 | "test": "jest", 9 | "build-old": "babel lib -d build", 10 | "clean": "rm -r dist && mkdir dist", 11 | "prebuild": "npm run clean", 12 | "build": "webpack", 13 | "build:watch": "babel lib -w -d build", 14 | "lint": "eslint lib/**; exit 0", 15 | "lint:watch": "esw -w lib/**", 16 | "lint:fix": "eslint lib/** --fix", 17 | "prepublish": "npm run test", 18 | "prepare": "npm run build" 19 | }, 20 | "repository": { 21 | "type": "git", 22 | "url": "git+https://github.com/talentedandrew/react-modern-datepicker.git" 23 | }, 24 | "keywords": [ 25 | "datepicker", 26 | "react-datepicker" 27 | ], 28 | "author": "Anurag Veekancheri", 29 | "license": "Apache License", 30 | "bugs": { 31 | "url": "https://github.com/talentedandrew/react-modern-datepicker/issues" 32 | }, 33 | "files": [ 34 | "dist" 35 | ], 36 | "devDependencies": { 37 | "@babel/cli": "^7.0.0", 38 | "@babel/core": "^7.4.5", 39 | "@babel/preset-env": "^7.4.5", 40 | "@babel/preset-react": "^7.0.0", 41 | "babel-core": "^7.0.0-bridge.0", 42 | "babel-eslint": "^9.0.0", 43 | "babel-jest": "^27.0.6", 44 | "babel-loader": "^8.0.6", 45 | "babel-plugin-styled-components": "^1.13.2", 46 | "enzyme": "^3.9.0", 47 | "enzyme-adapter-react-16": "^1.13.1", 48 | "eslint": "^4.19.1", 49 | "eslint-plugin-import": "^2.17.2", 50 | "eslint-plugin-jsx-a11y": "^6.2.1", 51 | "eslint-plugin-react": "^7.14.3", 52 | "eslint-watch": "^7.0.0", 53 | "jest": "^27.0.6", 54 | "polished": "^1.9.3", 55 | "prop-types": "^15.7.2", 56 | "react": "^16.8.6", 57 | "react-addons-test-utils": "^15.6.2", 58 | "react-dom": "^16.8.6", 59 | "react-test-renderer": "^16.8.6", 60 | "webpack": "^5.50.0", 61 | "webpack-bundle-analyzer": "^3.3.2", 62 | "webpack-cli": "^4.8.0" 63 | }, 64 | "peerDependencies": { 65 | "react": "^16.8.6", 66 | "react-dom": "^16.8.6" 67 | }, 68 | "dependencies": { 69 | "dayjs": "^1.8.14", 70 | "styled-components": "^4.2.0" 71 | }, 72 | "jest": { 73 | "verbose": true, 74 | "testURL": "http://localhost/", 75 | "collectCoverage": true, 76 | "coverageReporters": [ 77 | "json", 78 | "html" 79 | ] 80 | } 81 | } 82 | -------------------------------------------------------------------------------- /lib/elements/CalendarBody.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import DateView from './DateView'; 4 | import MonthView from './MonthView'; 5 | import YearView from './YearView'; 6 | import Wrapper from './Wrapper'; 7 | 8 | const CalendarBody = props => { 9 | const { viewFor, date, format, onChange, yearBlock, maxDate, minDate, primaryColor, secondaryColor, primaryTextColor, secondaryTextColor } = props; 10 | return ( 11 | 12 | {viewFor === 'date' && onChange(value, 'date')} 18 | primaryColor={primaryColor} 19 | primaryTextColor={primaryTextColor} 20 | secondaryColor={secondaryColor} 21 | secondaryTextColor={secondaryTextColor} 22 | />} 23 | {viewFor === 'month' && onChange(value, 'month')} 29 | primaryColor={primaryColor} 30 | primaryTextColor={primaryTextColor} 31 | secondaryColor={secondaryColor} 32 | secondaryTextColor={secondaryTextColor} 33 | />} 34 | {viewFor === 'year' && onChange(value, 'year')} 40 | primaryColor={primaryColor} 41 | primaryTextColor={primaryTextColor} 42 | secondaryColor={secondaryColor} 43 | secondaryTextColor={secondaryTextColor} 44 | yearBlock={yearBlock} 45 | />} 46 | 47 | ); 48 | }; 49 | 50 | CalendarBody.propTypes = { 51 | date: PropTypes.oneOfType([ 52 | PropTypes.string, 53 | PropTypes.object 54 | ]), 55 | format: PropTypes.string, 56 | maxDate:PropTypes.oneOfType([ 57 | PropTypes.string, 58 | PropTypes.object 59 | ]), 60 | minDate:PropTypes.oneOfType([ 61 | PropTypes.string, 62 | PropTypes.object 63 | ]), 64 | onChange: PropTypes.func, 65 | primaryColor: PropTypes.string, 66 | primaryTextColor: PropTypes.string, 67 | secondaryColor: PropTypes.string, 68 | secondaryTextColor: PropTypes.string, 69 | viewFor: PropTypes.string, 70 | yearBlock: PropTypes.number 71 | }; 72 | 73 | export default CalendarBody; 74 | -------------------------------------------------------------------------------- /coverage/block-navigation.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | var jumpToCode = (function init() { 3 | // Classes of code we would like to highlight in the file view 4 | var missingCoverageClasses = ['.cbranch-no', '.cstat-no', '.fstat-no']; 5 | 6 | // Elements to highlight in the file listing view 7 | var fileListingElements = ['td.pct.low']; 8 | 9 | // We don't want to select elements that are direct descendants of another match 10 | var notSelector = ':not(' + missingCoverageClasses.join('):not(') + ') > '; // becomes `:not(a):not(b) > ` 11 | 12 | // Selecter that finds elements on the page to which we can jump 13 | var selector = 14 | fileListingElements.join(', ') + 15 | ', ' + 16 | notSelector + 17 | missingCoverageClasses.join(', ' + notSelector); // becomes `:not(a):not(b) > a, :not(a):not(b) > b` 18 | 19 | // The NodeList of matching elements 20 | var missingCoverageElements = document.querySelectorAll(selector); 21 | 22 | var currentIndex; 23 | 24 | function toggleClass(index) { 25 | missingCoverageElements 26 | .item(currentIndex) 27 | .classList.remove('highlighted'); 28 | missingCoverageElements.item(index).classList.add('highlighted'); 29 | } 30 | 31 | function makeCurrent(index) { 32 | toggleClass(index); 33 | currentIndex = index; 34 | missingCoverageElements.item(index).scrollIntoView({ 35 | behavior: 'smooth', 36 | block: 'center', 37 | inline: 'center' 38 | }); 39 | } 40 | 41 | function goToPrevious() { 42 | var nextIndex = 0; 43 | if (typeof currentIndex !== 'number' || currentIndex === 0) { 44 | nextIndex = missingCoverageElements.length - 1; 45 | } else if (missingCoverageElements.length > 1) { 46 | nextIndex = currentIndex - 1; 47 | } 48 | 49 | makeCurrent(nextIndex); 50 | } 51 | 52 | function goToNext() { 53 | var nextIndex = 0; 54 | 55 | if ( 56 | typeof currentIndex === 'number' && 57 | currentIndex < missingCoverageElements.length - 1 58 | ) { 59 | nextIndex = currentIndex + 1; 60 | } 61 | 62 | makeCurrent(nextIndex); 63 | } 64 | 65 | return function jump(event) { 66 | switch (event.which) { 67 | case 78: // n 68 | case 74: // j 69 | goToNext(); 70 | break; 71 | case 66: // b 72 | case 75: // k 73 | case 80: // p 74 | goToPrevious(); 75 | break; 76 | } 77 | }; 78 | })(); 79 | window.addEventListener('keydown', jumpToCode); 80 | -------------------------------------------------------------------------------- /coverage/lcov-report/block-navigation.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | var jumpToCode = (function init() { 3 | // Classes of code we would like to highlight in the file view 4 | var missingCoverageClasses = ['.cbranch-no', '.cstat-no', '.fstat-no']; 5 | 6 | // Elements to highlight in the file listing view 7 | var fileListingElements = ['td.pct.low']; 8 | 9 | // We don't want to select elements that are direct descendants of another match 10 | var notSelector = ':not(' + missingCoverageClasses.join('):not(') + ') > '; // becomes `:not(a):not(b) > ` 11 | 12 | // Selecter that finds elements on the page to which we can jump 13 | var selector = 14 | fileListingElements.join(', ') + 15 | ', ' + 16 | notSelector + 17 | missingCoverageClasses.join(', ' + notSelector); // becomes `:not(a):not(b) > a, :not(a):not(b) > b` 18 | 19 | // The NodeList of matching elements 20 | var missingCoverageElements = document.querySelectorAll(selector); 21 | 22 | var currentIndex; 23 | 24 | function toggleClass(index) { 25 | missingCoverageElements 26 | .item(currentIndex) 27 | .classList.remove('highlighted'); 28 | missingCoverageElements.item(index).classList.add('highlighted'); 29 | } 30 | 31 | function makeCurrent(index) { 32 | toggleClass(index); 33 | currentIndex = index; 34 | missingCoverageElements.item(index).scrollIntoView({ 35 | behavior: 'smooth', 36 | block: 'center', 37 | inline: 'center' 38 | }); 39 | } 40 | 41 | function goToPrevious() { 42 | var nextIndex = 0; 43 | if (typeof currentIndex !== 'number' || currentIndex === 0) { 44 | nextIndex = missingCoverageElements.length - 1; 45 | } else if (missingCoverageElements.length > 1) { 46 | nextIndex = currentIndex - 1; 47 | } 48 | 49 | makeCurrent(nextIndex); 50 | } 51 | 52 | function goToNext() { 53 | var nextIndex = 0; 54 | 55 | if ( 56 | typeof currentIndex === 'number' && 57 | currentIndex < missingCoverageElements.length - 1 58 | ) { 59 | nextIndex = currentIndex + 1; 60 | } 61 | 62 | makeCurrent(nextIndex); 63 | } 64 | 65 | return function jump(event) { 66 | switch (event.which) { 67 | case 78: // n 68 | case 74: // j 69 | goToNext(); 70 | break; 71 | case 66: // b 72 | case 75: // k 73 | case 80: // p 74 | goToPrevious(); 75 | break; 76 | } 77 | }; 78 | })(); 79 | window.addEventListener('keydown', jumpToCode); 80 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | ## Open Development 4 | 5 | All work on react-modern-datepicker happens directly on [GitHub](https://github.com/talentedandrew/react-modern-datepicker). Contributors send pull requests which go through the same review process. 6 | 7 | 8 | ## Branch Organization 9 | 10 | We will do our best to keep the [`master` branch](https://github.com/talentedandrew/react-modern-datepicker/tree/master) in good shape, with tests passing at all times. But in order to move fast, we will make API changes that your application might not be compatible with. We recommend that you use [the latest stable version of React](https://reactjs.org/downloads.html). 11 | 12 | If you send a pull request, please do it against the `master` branch. 13 | 14 | 15 | ## Semantic Versioning 16 | 17 | react-modern-datepicker follows [semantic versioning](http://semver.org/). We release patch versions for bugfixes, minor versions for new features, and major versions for any breaking changes. When we make breaking changes, we also introduce deprecation warnings in a minor version so that our users learn about the upcoming changes and migrate their code in advance. 18 | 19 | 20 | ## Bugs 21 | 22 | We are using [GitHub Issues](https://github.com/talentedandrew/react-modern-datepicker/issues) for our public bugs. We keep a close eye on this and try to make it clear when we have an internal fix in progress. Before filing a new task, try to make sure your problem doesn't already exist. 23 | 24 | 25 | ## Proposing a Change 26 | 27 | If you intend to change the public API, or make any non-trivial changes to the implementation, we recommend [filing an issue](https://github.com/talentedandrew/react-modern-datepicker/issues/new). This lets us reach an agreement on your proposal before you put significant effort into it. 28 | 29 | If you're only fixing a bug, it's fine to submit a pull request right away but we still recommend to file an issue detailing what you're fixing. This is helpful in case we don't accept that specific fix but want to keep track of the issue. 30 | 31 | 32 | ## Sending a Pull Request 33 | 34 | We will review your pull request and either merge it, request changes to it, or close it with an explanation. 35 | 36 | ## Style Guide 37 | 38 | Run `npm run lint --fix` after making any changes to the code. 39 | 40 | Then, our linter will catch most issues that may exist in your code. You can check the status of your code styling by simply running `npm run lint`. 41 | 42 | However, there are still some styles that the linter cannot pick up. If you are unsure about something, looking at [Airbnb's Style Guide](https://github.com/airbnb/javascript) will guide you in the right direction. 43 | 44 | 45 | ## License 46 | 47 | By contributing to react-modern-datepicker, you agree that your contributions will be licensed under its Apache License. 48 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation. 6 | 7 | ## Our Standards 8 | 9 | Examples of behavior that contributes to creating a positive environment include: 10 | 11 | * Using welcoming and inclusive language 12 | * Being respectful of differing viewpoints and experiences 13 | * Gracefully accepting constructive criticism 14 | * Focusing on what is best for the community 15 | * Showing empathy towards other community members 16 | 17 | Examples of unacceptable behavior by participants include: 18 | 19 | * The use of sexualized language or imagery and unwelcome sexual attention or advances 20 | * Trolling, insulting/derogatory comments, and personal or political attacks 21 | * Public or private harassment 22 | * Publishing others' private information, such as a physical or electronic address, without explicit permission 23 | * Other conduct which could reasonably be considered inappropriate in a professional setting 24 | 25 | ## Our Responsibilities 26 | 27 | Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior. 28 | 29 | Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful. 30 | 31 | ## Scope 32 | 33 | This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers. 34 | 35 | ## Enforcement 36 | 37 | Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at talentedandrew@gmail.com. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately. 38 | 39 | Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership. 40 | 41 | ## Attribution 42 | 43 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version] 44 | 45 | [homepage]: http://contributor-covenant.org 46 | [version]: http://contributor-covenant.org/version/1/4/ 47 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Header.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Header.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Header.js 20 |

21 |
22 |
23 | 100% 24 | Statements 25 | 1/1 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 100% 34 | Functions 35 | 0/0 36 |
37 |
38 | 100% 39 | Lines 40 | 1/1 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

49 | 
68 | 
1
50 | 2
51 | 3
52 | 4
53 | 5
54 | 6
55 | 7 
56 | 1x
57 |  
58 |  
59 |  
60 |  
61 |  
import styled from 'styled-components';
62 | const Header = styled.div`
63 | width:100%;
64 | text-align : left;
65 | `;
66 | export default Header;
67 |  
69 |
70 |
71 |
72 | Code coverage 73 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 74 |
75 | 76 | 77 | 84 | 85 | 86 | 87 | 88 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Container.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Container.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Container.js 20 |

21 |
22 |
23 | 100% 24 | Statements 25 | 1/1 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 100% 34 | Functions 35 | 0/0 36 |
37 |
38 | 100% 39 | Lines 40 | 1/1 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

49 | 
71 | 
1
50 | 2
51 | 3
52 | 4
53 | 5
54 | 6
55 | 7
56 | 8 
57 | 1x
58 |  
59 |  
60 |  
61 |  
62 |  
63 |  
import styled from 'styled-components';
64 | const Container = styled.div`
65 |     width : 100%;
66 |     position : relative;
67 |     font-family: 'Open Sans', sans-serif;
68 | `;
69 | export default Container;
70 |  
72 |
73 |
74 |
75 | Code coverage 76 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 77 |
78 | 79 | 80 | 87 | 88 | 89 | 90 | 91 | -------------------------------------------------------------------------------- /coverage/elements/Header.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Header.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Header.js

23 |
24 | 25 |
26 | 100% 27 | Statements 28 | 1/1 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 100% 41 | Functions 42 | 0/0 43 |
44 | 45 | 46 |
47 | 100% 48 | Lines 49 | 1/1 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

60 | 
1
61 | 2
62 | 3
63 | 4
64 | 5
65 | 6
66 | 7 
67 | 1x
68 |  
69 |  
70 |  
71 |  
72 |  
import styled from 'styled-components';
73 | const Header = styled.div`
74 | width:100%;
75 | text-align : left;
76 | `;
77 | export default Header;
78 |  
79 | 80 |
81 |
82 |
83 | Code coverage generated by 84 | istanbul 85 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 86 |
87 | 88 | 89 | 94 | 95 | 96 | 97 | 98 | -------------------------------------------------------------------------------- /lib/elements/DateEditor.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | import React from 'react'; 3 | import PropTypes from 'prop-types'; 4 | import dayjs from "dayjs"; 5 | import customParseFormat from 'dayjs/plugin/customParseFormat'; 6 | import isBetween from 'dayjs/plugin/isBetween'; 7 | import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; 8 | import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; 9 | dayjs.extend(customParseFormat); 10 | dayjs.extend(isBetween); 11 | dayjs.extend(isSameOrAfter); 12 | dayjs.extend(isSameOrBefore); 13 | const Span = styled.span` 14 | font-size: 1.5em; 15 | text-align: center; 16 | color:${props => props.primaryTextColor}; 17 | font-size: 20px; 18 | font-weight: 600; 19 | margin-right: 10px; 20 | line-height: 64px; 21 | cursor: pointer; 22 | opacity:0.4; 23 | 24 | `; 25 | const SelectedSpan = styled(Span)` 26 | color:${props => props.primaryTextColor}; 27 | opacity:1; 28 | `; 29 | const Wrapper = styled.div` 30 | min-width: 170px; 31 | background: ${props => props.secondaryColor}; 32 | text-align: center; 33 | border-radius: 6px; 34 | `; 35 | const DateEditor = props => { 36 | const { onDateClick, onMonthClick, onYearClick, date, format, viewFor, maxDate, minDate, primaryTextColor } = props; 37 | const _date = dayjs(date || dayjs().format(format || 'DD-MM-YYYY'), format || 'DD-MM-YYYY'); 38 | const _minDate = dayjs(minDate, format || 'DD-MM-YYYY'); 39 | const _maxDate = dayjs(maxDate, format || 'DD-MM-YYYY'); 40 | const defaultDate = _date.isBetween( minDate ? _minDate.clone().subtract(1, 'day') : _date.clone().subtract(1, 'day'), maxDate ? _maxDate.clone().add(1, 'day') : _date.clone().add(1, 'day')) ? _date : maxDate && _maxDate.isSameOrAfter(_date) ? _date : minDate && _minDate.isSameOrBefore(_date) ? _minDate : maxDate ? _maxDate.clone().subtract(1, 'day') : minDate ? _minDate.clone().add(1, 'day') : _date; 41 | const day = date ? dayjs(date, format || 'DD-MM-YYYY').format('DD') : defaultDate.format('DD') ; 42 | const month = date ? dayjs(date, format || 'DD-MM-YYYY').format('MMM') : defaultDate.format('MMM') ; 43 | const year = date ? dayjs(date, format || 'DD-MM-YYYY').format('YYYY') : defaultDate.format('YYYY') ; 44 | return ( 45 | 46 | {viewFor === 'date' ? {day} : {day}} 53 | {viewFor === 'month' ? {month} : {month}} 60 | {viewFor === 'year' ? {year} : {year}} 67 | 68 | ); 69 | }; 70 | DateEditor.propTypes = { 71 | date: PropTypes.oneOfType([ 72 | PropTypes.string, 73 | PropTypes.object 74 | ]), 75 | format: PropTypes.string, 76 | maxDate: PropTypes.oneOfType([ 77 | PropTypes.string, 78 | PropTypes.object 79 | ]), 80 | minDate: PropTypes.oneOfType([ 81 | PropTypes.string, 82 | PropTypes.object 83 | ]), 84 | onDateClick: PropTypes.func, 85 | onMonthClick: PropTypes.func, 86 | onYearClick: PropTypes.func, 87 | primaryTextColor: PropTypes.string, 88 | secondaryColor: PropTypes.string, 89 | viewFor: PropTypes.string, 90 | }; 91 | export default DateEditor; 92 | 93 | 94 | -------------------------------------------------------------------------------- /coverage/lcov-report/components/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for components 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files components 20 |

21 |
22 |
23 | 44.37% 24 | Statements 25 | 63/142 26 |
27 |
28 | 41.55% 29 | Branches 30 | 155/373 31 |
32 |
33 | 32% 34 | Functions 35 | 8/25 36 |
37 |
38 | 45% 39 | Lines 40 | 63/140 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 |
49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 |
FileStatementsBranchesFunctionsLines
ModernDatepicker.js
44.37%63/14241.55%155/37332%8/2545%63/140
79 |
80 |
81 |
82 | Code coverage 83 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 84 |
85 | 86 | 87 | 94 | 95 | 96 | 97 | 98 | -------------------------------------------------------------------------------- /coverage/elements/Container.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Container.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Container.js

23 |
24 | 25 |
26 | 100% 27 | Statements 28 | 1/1 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 100% 41 | Functions 42 | 0/0 43 |
44 | 45 | 46 |
47 | 100% 48 | Lines 49 | 1/1 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8 
 68 | 1x
 69 |  
 70 |  
 71 |  
 72 |  
 73 |  
 74 |  
import styled from 'styled-components';
 75 | const Container = styled.div`
 76 |     width : 100%;
 77 |     position : relative;
 78 |     font-family: 'Open Sans', sans-serif;
 79 | `;
 80 | export default Container;
 81 |  
82 | 83 |
84 |
85 |
86 | Code coverage generated by 87 | istanbul 88 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 89 |
90 | 91 | 92 | 97 | 98 | 99 | 100 | 101 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/CalendarHeading.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/CalendarHeading.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements CalendarHeading.js 20 |

21 |
22 |
23 | 50% 24 | Statements 25 | 1/2 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 0% 34 | Functions 35 | 0/1 36 |
37 |
38 | 50% 39 | Lines 40 | 1/2 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
 86 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13 
 62 | 1x
 63 |  
 64 |  
 65 |  
 66 |  
 67 |  
 68 |  
 69 |  
 70 |  
 71 |  
 72 |  
 73 |  
import styled from 'styled-components';
 74 | const CalendarHeading = styled.div`
 75 |     width : 100%;
 76 |     height : 64px;
 77 |     max-width : 325px;
 78 |     max-height : 64px;
 79 |     position : relative;
 80 |     background-color : ${props => props.secondaryColor};
 81 |     border-bottom: solid 1px #f4f4f4;
 82 |     border-radius: 6px;
 83 | `;
 84 | export default CalendarHeading;
 85 |  
87 |
88 |
89 |
90 | Code coverage 91 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 92 |
93 | 94 | 95 | 102 | 103 | 104 | 105 | 106 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Span.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Span.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Span.js 20 |

21 |
22 |
23 | 100% 24 | Statements 25 | 1/1 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 100% 34 | Functions 35 | 0/0 36 |
37 |
38 | 100% 39 | Lines 40 | 1/1 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
 92 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15 
 64 | 1x
 65 |  
 66 |  
 67 |  
 68 |  
 69 |  
 70 |  
 71 |  
 72 |  
 73 |  
 74 |  
 75 |  
 76 |  
 77 |  
import styled from 'styled-components';
 78 | const Span = styled.span`
 79 |   font-size: 14px;
 80 |   text-align: center;
 81 |   color: #222222;
 82 |   width:40px;
 83 |   height:40px;
 84 |   margin:15px;
 85 |   display:inline-block;
 86 |   line-height: 40px;
 87 |   cursor : pointer;
 88 |   overflow : auto;
 89 | `;
 90 | export default Span;
 91 |  
93 |
94 |
95 |
96 | Code coverage 97 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 98 |
99 | 100 | 101 | 108 | 109 | 110 | 111 | 112 | -------------------------------------------------------------------------------- /lib/elements/MonthView.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import dayjs from "dayjs"; 4 | import customParseFormat from 'dayjs/plugin/customParseFormat'; 5 | import isBetween from 'dayjs/plugin/isBetween'; 6 | import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; 7 | import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; 8 | import styled from 'styled-components'; 9 | import Wrapper from './Wrapper'; 10 | import Span from './Span'; 11 | import Header from './Header'; 12 | 13 | dayjs.extend(customParseFormat); 14 | dayjs.extend(isBetween); 15 | dayjs.extend(isSameOrAfter); 16 | dayjs.extend(isSameOrBefore); 17 | 18 | const YSpan = styled(Span)` 19 | margin: 5px 15px; 20 | pointer-events : ${props => props.isMax || props.isMin ? 'none' : 'auto'}; 21 | cursor : ${props => props.isMax || props.isMin ? 'default' : 'pointer'}; 22 | background-color:${props =>props.isMax || props.isMin ? '#eee' : props.secondaryColor}; 23 | color:${props => props.primaryTextColor}; 24 | opacity:${props => props.isMax || props.isMin ? '0.4' : '1'}; 25 | width: 60px; 26 | `; 27 | const SelectedSpan = styled(Span)` 28 | background-color:${props => props.primaryColor}; 29 | color : ${props => props.isMax || props.isMin ? props.primaryTextColor : props.secondaryTextColor}; 30 | margin: 5px 15px; 31 | width: 60px; 32 | `; 33 | const MonthView = props => { 34 | const { date, format, onMonthChange, maxDate, minDate, primaryColor, secondaryColor, primaryTextColor, secondaryTextColor } = props; 35 | const _date = dayjs(date || dayjs().format(format || 'DD-MM-YYYY'), format || 'DD-MM-YYYY'); 36 | const _minDate = dayjs(minDate, format || 'DD-MM-YYYY'); 37 | const _maxDate = dayjs(maxDate, format || 'DD-MM-YYYY'); 38 | const defaultDate = _date.isBetween( minDate ? _minDate.clone().subtract(1, 'day') : _date.clone().subtract(1, 'day'), maxDate ? _maxDate.clone().add(1, 'day') : _date.clone().add(1, 'day')) ? _date : maxDate && _maxDate.isSameOrAfter(_date) ? _date : minDate && _minDate.isSameOrBefore(_date) ? _minDate : maxDate ? _maxDate.clone().subtract(1, 'day') : minDate ? _minDate.clone().add(1, 'day') : _date; 39 | const mainDate = date ? dayjs(date, format || 'DD-MM-YYYY') : defaultDate; 40 | const endDate = maxDate ? dayjs(maxDate, format || 'DD-MM-YYYY') : null; 41 | const startDate = minDate ? dayjs(minDate, format || 'DD-MM-YYYY') : null; 42 | const currentMonth = mainDate.format('MMM'); 43 | const rawMonths = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; 44 | let months = []; 45 | for (let i = 0; i < rawMonths.length ; i++){ 46 | months.push({ 47 | m : rawMonths[i], 48 | isMax : endDate ? mainDate.month(i).isAfter(endDate) : false, 49 | isMin : startDate ? mainDate.month(i).isBefore(startDate) : false, 50 | }); 51 | } 52 | return ( 53 | 54 |
55 | {months.map((month, k) => { 56 | return ( 57 | currentMonth === month.m ? !month.isMax && !month.isMin && onMonthChange(k)} 62 | primaryColor={primaryColor} 63 | primaryTextColor={primaryTextColor} 64 | secondaryTextColor={secondaryTextColor} 65 | >{month.m} : !month.isMax && !month.isMin && onMonthChange(k)} 70 | primaryTextColor={primaryTextColor} 71 | secondaryColor={secondaryColor} 72 | secondaryTextColor={secondaryTextColor} 73 | >{month.m} 74 | ); 75 | })} 76 |
77 | 78 | ); 79 | }; 80 | 81 | MonthView.propTypes = { 82 | date: PropTypes.oneOfType([ 83 | PropTypes.string, 84 | PropTypes.object 85 | ]), 86 | format: PropTypes.string, 87 | maxDate:PropTypes.oneOfType([ 88 | PropTypes.string, 89 | PropTypes.object 90 | ]), 91 | minDate:PropTypes.oneOfType([ 92 | PropTypes.string, 93 | PropTypes.object 94 | ]), 95 | onMonthChange: PropTypes.func, 96 | primaryColor: PropTypes.string, 97 | primaryTextColor: PropTypes.string, 98 | secondaryColor: PropTypes.string, 99 | secondaryTextColor: PropTypes.string 100 | }; 101 | export default MonthView; 102 | -------------------------------------------------------------------------------- /lib/elements/YearView.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import dayjs from "dayjs"; 4 | import customParseFormat from 'dayjs/plugin/customParseFormat'; 5 | import isBetween from 'dayjs/plugin/isBetween'; 6 | import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; 7 | import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; 8 | import styled from 'styled-components'; 9 | import Wrapper from './Wrapper'; 10 | import Span from './Span'; 11 | import Header from './Header'; 12 | dayjs.extend(customParseFormat); 13 | dayjs.extend(isBetween); 14 | dayjs.extend(isSameOrAfter); 15 | dayjs.extend(isSameOrBefore); 16 | 17 | 18 | const YSpan = styled(Span)` 19 | margin: 5px 15px; 20 | pointer-events : ${props => props.isMax || props.isMin ? 'none' : 'auto'}; 21 | cursor : ${props => props.isMax || props.isMin ? 'default' : 'pointer'}; 22 | background-color:${props =>props.isMax || props.isMin ? '#eee' : props.secondaryColor}; 23 | color:${props => props.primaryTextColor}; 24 | opacity:${props => props.isMax || props.isMin ? '0.4' : '1'}; 25 | `; 26 | const SelectedSpan = styled(Span)` 27 | background-color:${props => props.primaryColor}; 28 | color : ${props => props.isMax || props.isMin ? props.primaryTextColor : props.secondaryTextColor}; 29 | margin: 5px 15px; 30 | 31 | `; 32 | const getYears = (year, main, end, start) => { 33 | let startYear = year; 34 | let endYear = year + 15; 35 | let years = []; 36 | for (let i = startYear; i <= endYear; i++ ){ 37 | years.push({ 38 | y : i, 39 | isMax : end ? main.year(i).isAfter(end) : false , 40 | isMin : start ? main.year(i).isBefore(start) : false , 41 | }); 42 | } 43 | return years; 44 | }; 45 | const YearView = props => { 46 | const { date, format, onYearChange, yearBlock, maxDate, minDate, primaryColor, secondaryColor, primaryTextColor, secondaryTextColor } = props; 47 | const _date = dayjs(date || dayjs().format(format || 'DD-MM-YYYY'), format || 'DD-MM-YYYY'); 48 | const _minDate = dayjs(minDate, format || 'DD-MM-YYYY'); 49 | const _maxDate = dayjs(maxDate, format || 'DD-MM-YYYY'); 50 | const defaultDate = _date.isBetween( minDate ? _minDate.clone().subtract(1, 'day') : _date.clone().subtract(1, 'day'), maxDate ? _maxDate.clone().add(1, 'day') : _date.clone().add(1, 'day')) ? _date : maxDate && _maxDate.isSameOrAfter(_date) ? _date : minDate && _minDate.isSameOrBefore(_date) ? _minDate : maxDate ? _maxDate.clone().subtract(1, 'day') : minDate ? _minDate.clone().add(1, 'day') : _date; 51 | const mainDate = date ? dayjs(date, format || 'DD-MM-YYYY') : defaultDate; 52 | const endDate = maxDate ? dayjs(maxDate, format || 'DD-MM-YYYY') : null; 53 | const startDate = minDate ? dayjs(minDate, format || 'DD-MM-YYYY') : null; 54 | const currentYear = mainDate.get('year'); 55 | const years= getYears(yearBlock, mainDate, endDate, startDate); 56 | return ( 57 | 58 |
59 | {years.map((year, k) => { 60 | return ( 61 | currentYear === year.y ? !year.isMax && !year.isMin && onYearChange(year.y)} 66 | primaryColor={primaryColor} 67 | primaryTextColor={primaryTextColor} 68 | secondaryTextColor={secondaryTextColor} 69 | >{year.y} : !year.isMax && !year.isMin && onYearChange(year.y)} 74 | primaryTextColor={primaryTextColor} 75 | secondaryColor={secondaryColor} 76 | secondaryTextColor={secondaryTextColor} 77 | >{year.y} 78 | ); 79 | })} 80 |
81 | 82 | ); 83 | }; 84 | YearView.propTypes = { 85 | date: PropTypes.oneOfType([ 86 | PropTypes.string, 87 | PropTypes.object 88 | ]), 89 | format: PropTypes.string, 90 | maxDate:PropTypes.oneOfType([ 91 | PropTypes.string, 92 | PropTypes.object 93 | ]), 94 | minDate:PropTypes.oneOfType([ 95 | PropTypes.string, 96 | PropTypes.object 97 | ]), 98 | onYearChange: PropTypes.func, 99 | primaryColor: PropTypes.string, 100 | primaryTextColor: PropTypes.string, 101 | secondaryColor: PropTypes.string, 102 | secondaryTextColor: PropTypes.string, 103 | yearBlock: PropTypes.number 104 | }; 105 | export default YearView; 106 | -------------------------------------------------------------------------------- /coverage/components/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for components 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files components

23 |
24 | 25 |
26 | 60.76% 27 | Statements 28 | 96/158 29 |
30 | 31 | 32 |
33 | 52.61% 34 | Branches 35 | 212/403 36 |
37 | 38 | 39 |
40 | 37.04% 41 | Functions 42 | 10/27 43 |
44 | 45 | 46 |
47 | 60.26% 48 | Lines 49 | 94/156 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 |
60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 |
FileStatementsBranchesFunctionsLines
ModernDatepicker.js 78 |
79 | 		60.76%96/15852.61%212/40337.04%10/2760.26%94/156
92 |
93 |
94 |
95 |
96 | Code coverage generated by 97 | istanbul 98 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 99 |
100 | 101 | 102 | 107 | 108 | 109 | 110 | 111 | -------------------------------------------------------------------------------- /coverage/lcov-report/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for All files 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files 20 |

21 |
22 |
23 | 36.45% 24 | Statements 25 | 121/332 26 |
27 |
28 | 23.25% 29 | Branches 30 | 156/671 31 |
32 |
33 | 10.64% 34 | Functions 35 | 10/94 36 |
37 |
38 | 37.35% 39 | Lines 40 | 121/324 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 |
49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 |
FileStatementsBranchesFunctionsLines
components
44.37%63/14241.55%155/37332%8/2545%63/140
elements
30.53%58/1900.34%1/2982.9%2/6931.52%58/184
92 |
93 |
94 |
95 | Code coverage 96 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 97 |
98 | 99 | 100 | 107 | 108 | 109 | 110 | 111 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Wrapper.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Wrapper.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Wrapper.js 20 |

21 |
22 |
23 | 66.67% 24 | Statements 25 | 2/3 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 0% 34 | Functions 35 | 0/1 36 |
37 |
38 | 66.67% 39 | Lines 40 | 2/3 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
 98 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17 
 66 | 1x
 67 |  
 68 |  
 69 |  
 70 | 1x
 71 |  
 72 |  
 73 |  
 74 |  
 75 |  
 76 |  
 77 |  
 78 |  
 79 |  
 80 |  
 81 |  
import styled, { keyframes } from 'styled-components';
 82 | const fadeinout = keyframes`
 83 | 0% { opacity: 0; }
 84 | 50% { opacity: 1; }
 85 | `;
 86 | const Wrapper = styled.div`
 87 |   width: 100%;
 88 |   height: 250px;
 89 |   max-width: 280px;
 90 |   background: ${props => props.secondaryColor};
 91 |   text-align: center;
 92 |   box-sizing: border-box;
 93 |   margin: 0 auto;
 94 |   animation: ${fadeinout} .5s linear 1 forwards;
 95 | `;
 96 | export default Wrapper;
 97 |  
99 |
100 |
101 |
102 | Code coverage 103 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 104 |
105 | 106 | 107 | 114 | 115 | 116 | 117 | 118 | -------------------------------------------------------------------------------- /coverage/elements/CalendarHeading.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/CalendarHeading.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements CalendarHeading.js

23 |
24 | 25 |
26 | 50% 27 | Statements 28 | 1/2 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/1 43 |
44 | 45 | 46 |
47 | 50% 48 | Lines 49 | 1/2 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13 
 73 | 1x
 74 |  
 75 |  
 76 |  
 77 |  
 78 |  
 79 |  
 80 |  
 81 |  
 82 |  
 83 |  
 84 |  
import styled from 'styled-components';
 85 | const CalendarHeading = styled.div`
 86 |     width : 100%;
 87 |     height : 64px;
 88 |     max-width : 325px;
 89 |     max-height : 64px;
 90 |     position : relative;
 91 |     background-color : ${props => props.secondaryColor};
 92 |     border-bottom: solid 1px #f4f4f4;
 93 |     border-radius: 6px;
 94 | `;
 95 | export default CalendarHeading;
 96 |  
97 | 98 |
99 |
100 |
101 | Code coverage generated by 102 | istanbul 103 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 104 |
105 | 106 | 107 | 112 | 113 | 114 | 115 | 116 | -------------------------------------------------------------------------------- /coverage/elements/Span.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Span.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Span.js

23 |
24 | 25 |
26 | 100% 27 | Statements 28 | 1/1 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 100% 41 | Functions 42 | 0/0 43 |
44 | 45 | 46 |
47 | 100% 48 | Lines 49 | 1/1 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15 
 75 | 1x
 76 |  
 77 |  
 78 |  
 79 |  
 80 |  
 81 |  
 82 |  
 83 |  
 84 |  
 85 |  
 86 |  
 87 |  
 88 |  
import styled from 'styled-components';
 89 | const Span = styled.span`
 90 |   font-size: 14px;
 91 |   text-align: center;
 92 |   color: #222222;
 93 |   width:40px;
 94 |   height:40px;
 95 |   margin:15px;
 96 |   display:inline-block;
 97 |   line-height: 40px;
 98 |   cursor : pointer;
 99 |   overflow : auto;
100 | `;
101 | export default Span;
102 |  
103 | 104 |
105 |
106 |
107 | Code coverage generated by 108 | istanbul 109 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 110 |
111 | 112 | 113 | 118 | 119 | 120 | 121 | 122 | -------------------------------------------------------------------------------- /coverage/elements/Wrapper.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Wrapper.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Wrapper.js

23 |
24 | 25 |
26 | 66.67% 27 | Statements 28 | 2/3 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/1 43 |
44 | 45 | 46 |
47 | 66.67% 48 | Lines 49 | 2/3 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17 
 77 | 1x
 78 |  
 79 |  
 80 |  
 81 | 1x
 82 |  
 83 |  
 84 |  
 85 |  
 86 |  
 87 |  
 88 |  
 89 |  
 90 |  
 91 |  
 92 |  
import styled, { keyframes } from 'styled-components';
 93 | const fadeinout = keyframes`
 94 | 0% { opacity: 0; }
 95 | 50% { opacity: 1; }
 96 | `;
 97 | const Wrapper = styled.div`
 98 |   width: 100%;
 99 |   height: 250px;
100 |   max-width: 280px;
101 |   background: ${props => props.secondaryColor};
102 |   text-align: center;
103 |   box-sizing: border-box;
104 |   margin: 0 auto;
105 |   animation: ${fadeinout} .5s linear 1 forwards;
106 | `;
107 | export default Wrapper;
108 |  
109 | 110 |
111 |
112 |
113 | Code coverage generated by 114 | istanbul 115 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 116 |
117 | 118 | 119 | 124 | 125 | 126 | 127 | 128 | -------------------------------------------------------------------------------- /coverage/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for All files 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files

23 |
24 | 25 |
26 | 44.25% 27 | Statements 28 | 154/348 29 |
30 | 31 | 32 |
33 | 30.34% 34 | Branches 35 | 213/702 36 |
37 | 38 | 39 |
40 | 12.5% 41 | Functions 42 | 12/96 43 |
44 | 45 | 46 |
47 | 44.71% 48 | Lines 49 | 152/340 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 |
60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 |
FileStatementsBranchesFunctionsLines
components 78 |
79 | 		60.76%96/15852.61%212/40337.04%10/2760.26%94/156
elements 93 |
94 | 		30.53%58/1900.33%1/2992.9%2/6931.52%58/184
107 |
108 |
109 |
110 |
111 | Code coverage generated by 112 | istanbul 113 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 114 |
115 | 116 | 117 | 122 | 123 | 124 | 125 | 126 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/CalendarContainer.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/CalendarContainer.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements CalendarContainer.js 20 |

21 |
22 |
23 | 50% 24 | Statements 25 | 1/2 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 0% 34 | Functions 35 | 0/1 36 |
37 |
38 | 50% 39 | Lines 40 | 1/2 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
113 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22 
 71 | 1x
 72 |  
 73 |  
 74 |  
 75 |  
 76 |  
 77 |  
 78 |  
 79 |  
 80 |  
 81 |  
 82 |  
 83 |  
 84 |  
 85 |  
 86 |  
 87 |  
 88 |  
 89 |  
 90 |  
 91 |  
import styled from 'styled-components';
 92 | const CalendarContainer = styled.div.attrs({
 93 |   // we can define static props
 94 |   tabIndex: '1'
 95 | })`
 96 |     width : 100%;
 97 |     user-select: none;
 98 |     height : 315px;
 99 |     max-width : 325px;
100 |     min-width: 315px;
101 |     max-height : 315px;
102 |     position : absolute;
103 |     top : 100%;
104 |     background-color : ${props => props.secondaryColor};
105 |     border: solid 1px #f4f4f4;
106 |     border-radius: 6px;
107 |     &:focus{
108 |         outline : none;
109 |     }
110 | `;
111 | export default CalendarContainer;
112 |  
114 |
115 |
116 |
117 | Code coverage 118 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 119 |
120 | 121 | 122 | 129 | 130 | 131 | 132 | 133 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Label.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Label.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Label.js 20 |

21 |
22 |
23 | 75% 24 | Statements 25 | 3/4 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 0% 34 | Functions 35 | 0/1 36 |
37 |
38 | 75% 39 | Lines 40 | 3/4 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
122 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22
 71 | 23
 72 | 24
 73 | 25 
 74 |  
 75 |  
 76 | 1x
 77 |  
 78 |  
 79 |  
 80 | 1x
 81 |  
 82 |  
 83 |  
 84 |  
 85 |  
 86 |  
 87 |  
 88 |  
 89 | 1x
 90 |  
 91 |  
 92 |  
 93 |  
 94 |  
 95 |  
 96 |  
 97 |  
import styled from 'styled-components';
 98 | import React from 'react';
 99 | import PropTypes from 'prop-types';
100 | const DLabel = styled.label`
101 |   font-size: 15px;
102 |   color: #000;
103 | `;
104 | const Label = props => {
105 |   return (
106 |     <DLabel
107 |       {...props} 
108 |       className={props.className}
109 |     />
110 |   );
111 | };
112 |  
113 | Label.propTypes = {
114 |   className: PropTypes.oneOfType([
115 |     PropTypes.string,
116 |     PropTypes.object
117 |   ])
118 | };
119 |  
120 | export default Label;
121 |  
123 |
124 |
125 |
126 | Code coverage 127 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 128 |
129 | 130 | 131 | 138 | 139 | 140 | 141 | 142 | -------------------------------------------------------------------------------- /lib/elements/DateView.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components'; 2 | import React from 'react'; 3 | import PropTypes from 'prop-types'; 4 | import dayjs from "dayjs"; 5 | import customParseFormat from 'dayjs/plugin/customParseFormat'; 6 | import isBetween from 'dayjs/plugin/isBetween'; 7 | import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; 8 | import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; 9 | 10 | import Wrapper from './Wrapper'; 11 | import Span from './Span'; 12 | import Header from './Header'; 13 | 14 | dayjs.extend(customParseFormat); 15 | dayjs.extend(isBetween); 16 | dayjs.extend(isSameOrAfter); 17 | dayjs.extend(isSameOrBefore); 18 | 19 | const DSpan = styled(Span)` 20 | height:30px; 21 | line-height: 30px; 22 | margin: 0; 23 | pointer-events : ${props => props.isMax || props.isMin ? 'none' : 'auto'}; 24 | cursor : ${props => props.isMax || props.isMin ? 'default' : 'pointer'}; 25 | background-color:${props =>props.isMax || props.isMin ? "#eee" : props.secondaryColor}; 26 | color:${props => props.primaryTextColor}; 27 | opacity:${props => props.isMax || props.isMin ? '0.4' : '1'}; 28 | `; 29 | const SelectedSpan = styled(Span)` 30 | background-color:${props => props.primaryColor}; 31 | color : ${props => props.isMax || props.isMin ? props.primaryTextColor : props.secondaryTextColor}; 32 | height:30px; 33 | line-height: 30px; 34 | margin: 0; 35 | opacity:${props => props.isMax || props.isMin ? '0.4' : '1'}; 36 | `; 37 | const HeadSpan = styled(Span)` 38 | color: #b8c2cb; 39 | font-weight: 600; 40 | margin: 0; 41 | color:${props => props.primaryTextColor}; 42 | opacity:0.4; 43 | `; 44 | const Body = styled.div` 45 | width:100%; 46 | text-align : left; 47 | height:30px; 48 | `; 49 | 50 | const DateView = props => { 51 | const { date, format, onDateChange, maxDate, minDate, primaryColor, secondaryColor, primaryTextColor, secondaryTextColor } = props; 52 | const _date = dayjs(date || dayjs().format(format || 'DD-MM-YYYY'), format || 'DD-MM-YYYY'); 53 | const _minDate = dayjs(minDate, format || 'DD-MM-YYYY'); 54 | const _maxDate = dayjs(maxDate, format || 'DD-MM-YYYY'); 55 | const defaultDate = _date.isBetween( minDate ? _minDate.clone().subtract(1, 'day') : _date.clone().subtract(1, 'day'), maxDate ? _maxDate.clone().add(1, 'day') : _date.clone().add(1, 'day')) ? _date : maxDate && _maxDate.isSameOrAfter(_date) ? _date : minDate && _minDate.isSameOrBefore(_date) ? _minDate : maxDate ? _maxDate.clone().subtract(1, 'day') : minDate ? _minDate.clone().add(1, 'day') : _date; 56 | const mainDate = date ? dayjs(date, format || 'DD-MM-YYYY') : defaultDate; 57 | const endDate = maxDate ? dayjs(maxDate, format || 'DD-MM-YYYY') : null; 58 | const startDate = minDate ? dayjs(minDate, format || 'DD-MM-YYYY') : null; 59 | const currentDate = mainDate.get('date'); 60 | const days = mainDate.daysInMonth(5); 61 | const daysToAdd = Number(mainDate.startOf('month').format('d')); 62 | let daysArray = []; 63 | for (let i = 1; i <= days; i++) { 64 | daysArray[i-1] = { 65 | d : i , 66 | isMax : endDate ? mainDate.startOf('day').date(i).isAfter(endDate) : false , 67 | isMin : startDate ? mainDate.startOf('day').date(i).isBefore(startDate) : false 68 | }; 69 | } 70 | let extraDaysArray = []; 71 | for (let i = 0; i < daysToAdd; i++) { 72 | extraDaysArray[i] = 0; 73 | } 74 | const totalDays = extraDaysArray.concat(daysArray); 75 | let d = []; 76 | let chunk = 7; 77 | for (let i=0,j=totalDays.length; i 82 |
83 | S 84 | M 85 | T 86 | W 87 | T 88 | F 89 | S 90 |
91 | {d.map((week, k) => { 92 | return ( 93 | {week.map((day, i) => { 94 | return ( 95 | (currentDate === day.d) && !d.isMax ? !d.isMax && !day.isMin && onDateChange(day.d)} 100 | primaryColor={primaryColor} 101 | primaryTextColor={primaryTextColor} 102 | secondaryTextColor={secondaryTextColor} 103 | >{day ? day.d : ''} : day && !d.isMax && !day.isMin && onDateChange(day.d)} 108 | primaryColor={primaryColor} 109 | primaryTextColor={primaryTextColor} 110 | secondaryColor={secondaryColor} 111 | >{day ? day.d : ''} 112 | );})} 113 | 114 | ); 115 | })} 116 | 117 | ); 118 | }; 119 | 120 | DateView.propTypes = { 121 | date: PropTypes.oneOfType([ 122 | PropTypes.string, 123 | PropTypes.object 124 | ]), 125 | format: PropTypes.string, 126 | maxDate:PropTypes.oneOfType([ 127 | PropTypes.string, 128 | PropTypes.object 129 | ]), 130 | minDate:PropTypes.oneOfType([ 131 | PropTypes.string, 132 | PropTypes.object 133 | ]), 134 | onDateChange: PropTypes.func, 135 | primaryColor: PropTypes.string, 136 | primaryTextColor: PropTypes.string, 137 | secondaryColor: PropTypes.string, 138 | secondaryTextColor: PropTypes.string 139 | }; 140 | export default DateView; 141 | -------------------------------------------------------------------------------- /coverage/sorter.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | var addSorting = (function() { 3 | 'use strict'; 4 | var cols, 5 | currentSort = { 6 | index: 0, 7 | desc: false 8 | }; 9 | 10 | // returns the summary table element 11 | function getTable() { 12 | return document.querySelector('.coverage-summary'); 13 | } 14 | // returns the thead element of the summary table 15 | function getTableHeader() { 16 | return getTable().querySelector('thead tr'); 17 | } 18 | // returns the tbody element of the summary table 19 | function getTableBody() { 20 | return getTable().querySelector('tbody'); 21 | } 22 | // returns the th element for nth column 23 | function getNthColumn(n) { 24 | return getTableHeader().querySelectorAll('th')[n]; 25 | } 26 | 27 | // loads all columns 28 | function loadColumns() { 29 | var colNodes = getTableHeader().querySelectorAll('th'), 30 | colNode, 31 | cols = [], 32 | col, 33 | i; 34 | 35 | for (i = 0; i < colNodes.length; i += 1) { 36 | colNode = colNodes[i]; 37 | col = { 38 | key: colNode.getAttribute('data-col'), 39 | sortable: !colNode.getAttribute('data-nosort'), 40 | type: colNode.getAttribute('data-type') || 'string' 41 | }; 42 | cols.push(col); 43 | if (col.sortable) { 44 | col.defaultDescSort = col.type === 'number'; 45 | colNode.innerHTML = 46 | colNode.innerHTML + ''; 47 | } 48 | } 49 | return cols; 50 | } 51 | // attaches a data attribute to every tr element with an object 52 | // of data values keyed by column name 53 | function loadRowData(tableRow) { 54 | var tableCols = tableRow.querySelectorAll('td'), 55 | colNode, 56 | col, 57 | data = {}, 58 | i, 59 | val; 60 | for (i = 0; i < tableCols.length; i += 1) { 61 | colNode = tableCols[i]; 62 | col = cols[i]; 63 | val = colNode.getAttribute('data-value'); 64 | if (col.type === 'number') { 65 | val = Number(val); 66 | } 67 | data[col.key] = val; 68 | } 69 | return data; 70 | } 71 | // loads all row data 72 | function loadData() { 73 | var rows = getTableBody().querySelectorAll('tr'), 74 | i; 75 | 76 | for (i = 0; i < rows.length; i += 1) { 77 | rows[i].data = loadRowData(rows[i]); 78 | } 79 | } 80 | // sorts the table using the data for the ith column 81 | function sortByIndex(index, desc) { 82 | var key = cols[index].key, 83 | sorter = function(a, b) { 84 | a = a.data[key]; 85 | b = b.data[key]; 86 | return a < b ? -1 : a > b ? 1 : 0; 87 | }, 88 | finalSorter = sorter, 89 | tableBody = document.querySelector('.coverage-summary tbody'), 90 | rowNodes = tableBody.querySelectorAll('tr'), 91 | rows = [], 92 | i; 93 | 94 | if (desc) { 95 | finalSorter = function(a, b) { 96 | return -1 * sorter(a, b); 97 | }; 98 | } 99 | 100 | for (i = 0; i < rowNodes.length; i += 1) { 101 | rows.push(rowNodes[i]); 102 | tableBody.removeChild(rowNodes[i]); 103 | } 104 | 105 | rows.sort(finalSorter); 106 | 107 | for (i = 0; i < rows.length; i += 1) { 108 | tableBody.appendChild(rows[i]); 109 | } 110 | } 111 | // removes sort indicators for current column being sorted 112 | function removeSortIndicators() { 113 | var col = getNthColumn(currentSort.index), 114 | cls = col.className; 115 | 116 | cls = cls.replace(/ sorted$/, '').replace(/ sorted-desc$/, ''); 117 | col.className = cls; 118 | } 119 | // adds sort indicators for current column being sorted 120 | function addSortIndicators() { 121 | getNthColumn(currentSort.index).className += currentSort.desc 122 | ? ' sorted-desc' 123 | : ' sorted'; 124 | } 125 | // adds event listeners for all sorter widgets 126 | function enableUI() { 127 | var i, 128 | el, 129 | ithSorter = function ithSorter(i) { 130 | var col = cols[i]; 131 | 132 | return function() { 133 | var desc = col.defaultDescSort; 134 | 135 | if (currentSort.index === i) { 136 | desc = !currentSort.desc; 137 | } 138 | sortByIndex(i, desc); 139 | removeSortIndicators(); 140 | currentSort.index = i; 141 | currentSort.desc = desc; 142 | addSortIndicators(); 143 | }; 144 | }; 145 | for (i = 0; i < cols.length; i += 1) { 146 | if (cols[i].sortable) { 147 | // add the click event handler on the th so users 148 | // dont have to click on those tiny arrows 149 | el = getNthColumn(i).querySelector('.sorter').parentElement; 150 | if (el.addEventListener) { 151 | el.addEventListener('click', ithSorter(i)); 152 | } else { 153 | el.attachEvent('onclick', ithSorter(i)); 154 | } 155 | } 156 | } 157 | } 158 | // adds sorting functionality to the UI 159 | return function() { 160 | if (!getTable()) { 161 | return; 162 | } 163 | cols = loadColumns(); 164 | loadData(); 165 | addSortIndicators(); 166 | enableUI(); 167 | }; 168 | })(); 169 | 170 | window.addEventListener('load', addSorting); 171 | -------------------------------------------------------------------------------- /coverage/lcov-report/sorter.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | var addSorting = (function() { 3 | 'use strict'; 4 | var cols, 5 | currentSort = { 6 | index: 0, 7 | desc: false 8 | }; 9 | 10 | // returns the summary table element 11 | function getTable() { 12 | return document.querySelector('.coverage-summary'); 13 | } 14 | // returns the thead element of the summary table 15 | function getTableHeader() { 16 | return getTable().querySelector('thead tr'); 17 | } 18 | // returns the tbody element of the summary table 19 | function getTableBody() { 20 | return getTable().querySelector('tbody'); 21 | } 22 | // returns the th element for nth column 23 | function getNthColumn(n) { 24 | return getTableHeader().querySelectorAll('th')[n]; 25 | } 26 | 27 | // loads all columns 28 | function loadColumns() { 29 | var colNodes = getTableHeader().querySelectorAll('th'), 30 | colNode, 31 | cols = [], 32 | col, 33 | i; 34 | 35 | for (i = 0; i < colNodes.length; i += 1) { 36 | colNode = colNodes[i]; 37 | col = { 38 | key: colNode.getAttribute('data-col'), 39 | sortable: !colNode.getAttribute('data-nosort'), 40 | type: colNode.getAttribute('data-type') || 'string' 41 | }; 42 | cols.push(col); 43 | if (col.sortable) { 44 | col.defaultDescSort = col.type === 'number'; 45 | colNode.innerHTML = 46 | colNode.innerHTML + ''; 47 | } 48 | } 49 | return cols; 50 | } 51 | // attaches a data attribute to every tr element with an object 52 | // of data values keyed by column name 53 | function loadRowData(tableRow) { 54 | var tableCols = tableRow.querySelectorAll('td'), 55 | colNode, 56 | col, 57 | data = {}, 58 | i, 59 | val; 60 | for (i = 0; i < tableCols.length; i += 1) { 61 | colNode = tableCols[i]; 62 | col = cols[i]; 63 | val = colNode.getAttribute('data-value'); 64 | if (col.type === 'number') { 65 | val = Number(val); 66 | } 67 | data[col.key] = val; 68 | } 69 | return data; 70 | } 71 | // loads all row data 72 | function loadData() { 73 | var rows = getTableBody().querySelectorAll('tr'), 74 | i; 75 | 76 | for (i = 0; i < rows.length; i += 1) { 77 | rows[i].data = loadRowData(rows[i]); 78 | } 79 | } 80 | // sorts the table using the data for the ith column 81 | function sortByIndex(index, desc) { 82 | var key = cols[index].key, 83 | sorter = function(a, b) { 84 | a = a.data[key]; 85 | b = b.data[key]; 86 | return a < b ? -1 : a > b ? 1 : 0; 87 | }, 88 | finalSorter = sorter, 89 | tableBody = document.querySelector('.coverage-summary tbody'), 90 | rowNodes = tableBody.querySelectorAll('tr'), 91 | rows = [], 92 | i; 93 | 94 | if (desc) { 95 | finalSorter = function(a, b) { 96 | return -1 * sorter(a, b); 97 | }; 98 | } 99 | 100 | for (i = 0; i < rowNodes.length; i += 1) { 101 | rows.push(rowNodes[i]); 102 | tableBody.removeChild(rowNodes[i]); 103 | } 104 | 105 | rows.sort(finalSorter); 106 | 107 | for (i = 0; i < rows.length; i += 1) { 108 | tableBody.appendChild(rows[i]); 109 | } 110 | } 111 | // removes sort indicators for current column being sorted 112 | function removeSortIndicators() { 113 | var col = getNthColumn(currentSort.index), 114 | cls = col.className; 115 | 116 | cls = cls.replace(/ sorted$/, '').replace(/ sorted-desc$/, ''); 117 | col.className = cls; 118 | } 119 | // adds sort indicators for current column being sorted 120 | function addSortIndicators() { 121 | getNthColumn(currentSort.index).className += currentSort.desc 122 | ? ' sorted-desc' 123 | : ' sorted'; 124 | } 125 | // adds event listeners for all sorter widgets 126 | function enableUI() { 127 | var i, 128 | el, 129 | ithSorter = function ithSorter(i) { 130 | var col = cols[i]; 131 | 132 | return function() { 133 | var desc = col.defaultDescSort; 134 | 135 | if (currentSort.index === i) { 136 | desc = !currentSort.desc; 137 | } 138 | sortByIndex(i, desc); 139 | removeSortIndicators(); 140 | currentSort.index = i; 141 | currentSort.desc = desc; 142 | addSortIndicators(); 143 | }; 144 | }; 145 | for (i = 0; i < cols.length; i += 1) { 146 | if (cols[i].sortable) { 147 | // add the click event handler on the th so users 148 | // dont have to click on those tiny arrows 149 | el = getNthColumn(i).querySelector('.sorter').parentElement; 150 | if (el.addEventListener) { 151 | el.addEventListener('click', ithSorter(i)); 152 | } else { 153 | el.attachEvent('onclick', ithSorter(i)); 154 | } 155 | } 156 | } 157 | } 158 | // adds sorting functionality to the UI 159 | return function() { 160 | if (!getTable()) { 161 | return; 162 | } 163 | cols = loadColumns(); 164 | loadData(); 165 | addSortIndicators(); 166 | enableUI(); 167 | }; 168 | })(); 169 | 170 | window.addEventListener('load', addSorting); 171 | -------------------------------------------------------------------------------- /coverage/elements/CalendarContainer.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/CalendarContainer.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements CalendarContainer.js

23 |
24 | 25 |
26 | 50% 27 | Statements 28 | 1/2 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/1 43 |
44 | 45 | 46 |
47 | 50% 48 | Lines 49 | 1/2 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17
 77 | 18
 78 | 19
 79 | 20
 80 | 21
 81 | 22 
 82 | 1x
 83 |  
 84 |  
 85 |  
 86 |  
 87 |  
 88 |  
 89 |  
 90 |  
 91 |  
 92 |  
 93 |  
 94 |  
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 |  
101 |  
102 |  
import styled from 'styled-components';
103 | const CalendarContainer = styled.div.attrs({
104 |   // we can define static props
105 |   tabIndex: '1'
106 | })`
107 |     width : 100%;
108 |     user-select: none;
109 |     height : 315px;
110 |     max-width : 325px;
111 |     min-width: 315px;
112 |     max-height : 315px;
113 |     position : absolute;
114 |     top : 100%;
115 |     background-color : ${props => props.secondaryColor};
116 |     border: solid 1px #f4f4f4;
117 |     border-radius: 6px;
118 |     &:focus{
119 |         outline : none;
120 |     }
121 | `;
122 | export default CalendarContainer;
123 |  
124 | 125 |
126 |
127 |
128 | Code coverage generated by 129 | istanbul 130 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 131 |
132 | 133 | 134 | 139 | 140 | 141 | 142 | 143 | -------------------------------------------------------------------------------- /coverage/elements/Label.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Label.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Label.js

23 |
24 | 25 |
26 | 75% 27 | Statements 28 | 3/4 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/1 43 |
44 | 45 | 46 |
47 | 75% 48 | Lines 49 | 3/4 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17
 77 | 18
 78 | 19
 79 | 20
 80 | 21
 81 | 22
 82 | 23
 83 | 24
 84 | 25 
 85 |  
 86 |  
 87 | 1x
 88 |  
 89 |  
 90 |  
 91 | 1x
 92 |  
 93 |  
 94 |  
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 | 1x
101 |  
102 |  
103 |  
104 |  
105 |  
106 |  
107 |  
108 |  
import styled from 'styled-components';
109 | import React from 'react';
110 | import PropTypes from 'prop-types';
111 | const DLabel = styled.label`
112 |   font-size: 15px;
113 |   color: #000;
114 | `;
115 | const Label = props => {
116 |   return (
117 |     <DLabel
118 |       {...props} 
119 |       className={props.className}
120 |     />
121 |   );
122 | };
123 |  
124 | Label.propTypes = {
125 |   className: PropTypes.oneOfType([
126 |     PropTypes.string,
127 |     PropTypes.object
128 |   ])
129 | };
130 |  
131 | export default Label;
132 |  
133 | 134 |
135 |
136 |
137 | Code coverage generated by 138 | istanbul 139 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 140 |
141 | 142 | 143 | 148 | 149 | 150 | 151 | 152 | -------------------------------------------------------------------------------- /coverage/base.css: -------------------------------------------------------------------------------- 1 | body, html { 2 | margin:0; padding: 0; 3 | height: 100%; 4 | } 5 | body { 6 | font-family: Helvetica Neue, Helvetica, Arial; 7 | font-size: 14px; 8 | color:#333; 9 | } 10 | .small { font-size: 12px; } 11 | *, *:after, *:before { 12 | -webkit-box-sizing:border-box; 13 | -moz-box-sizing:border-box; 14 | box-sizing:border-box; 15 | } 16 | h1 { font-size: 20px; margin: 0;} 17 | h2 { font-size: 14px; } 18 | pre { 19 | font: 12px/1.4 Consolas, "Liberation Mono", Menlo, Courier, monospace; 20 | margin: 0; 21 | padding: 0; 22 | -moz-tab-size: 2; 23 | -o-tab-size: 2; 24 | tab-size: 2; 25 | } 26 | a { color:#0074D9; text-decoration:none; } 27 | a:hover { text-decoration:underline; } 28 | .strong { font-weight: bold; } 29 | .space-top1 { padding: 10px 0 0 0; } 30 | .pad2y { padding: 20px 0; } 31 | .pad1y { padding: 10px 0; } 32 | .pad2x { padding: 0 20px; } 33 | .pad2 { padding: 20px; } 34 | .pad1 { padding: 10px; } 35 | .space-left2 { padding-left:55px; } 36 | .space-right2 { padding-right:20px; } 37 | .center { text-align:center; } 38 | .clearfix { display:block; } 39 | .clearfix:after { 40 | content:''; 41 | display:block; 42 | height:0; 43 | clear:both; 44 | visibility:hidden; 45 | } 46 | .fl { float: left; } 47 | @media only screen and (max-width:640px) { 48 | .col3 { width:100%; max-width:100%; } 49 | .hide-mobile { display:none!important; } 50 | } 51 | 52 | .quiet { 53 | color: #7f7f7f; 54 | color: rgba(0,0,0,0.5); 55 | } 56 | .quiet a { opacity: 0.7; } 57 | 58 | .fraction { 59 | font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; 60 | font-size: 10px; 61 | color: #555; 62 | background: #E8E8E8; 63 | padding: 4px 5px; 64 | border-radius: 3px; 65 | vertical-align: middle; 66 | } 67 | 68 | div.path a:link, div.path a:visited { color: #333; } 69 | table.coverage { 70 | border-collapse: collapse; 71 | margin: 10px 0 0 0; 72 | padding: 0; 73 | } 74 | 75 | table.coverage td { 76 | margin: 0; 77 | padding: 0; 78 | vertical-align: top; 79 | } 80 | table.coverage td.line-count { 81 | text-align: right; 82 | padding: 0 5px 0 20px; 83 | } 84 | table.coverage td.line-coverage { 85 | text-align: right; 86 | padding-right: 10px; 87 | min-width:20px; 88 | } 89 | 90 | table.coverage td span.cline-any { 91 | display: inline-block; 92 | padding: 0 5px; 93 | width: 100%; 94 | } 95 | .missing-if-branch { 96 | display: inline-block; 97 | margin-right: 5px; 98 | border-radius: 3px; 99 | position: relative; 100 | padding: 0 4px; 101 | background: #333; 102 | color: yellow; 103 | } 104 | 105 | .skip-if-branch { 106 | display: none; 107 | margin-right: 10px; 108 | position: relative; 109 | padding: 0 4px; 110 | background: #ccc; 111 | color: white; 112 | } 113 | .missing-if-branch .typ, .skip-if-branch .typ { 114 | color: inherit !important; 115 | } 116 | .coverage-summary { 117 | border-collapse: collapse; 118 | width: 100%; 119 | } 120 | .coverage-summary tr { border-bottom: 1px solid #bbb; } 121 | .keyline-all { border: 1px solid #ddd; } 122 | .coverage-summary td, .coverage-summary th { padding: 10px; } 123 | .coverage-summary tbody { border: 1px solid #bbb; } 124 | .coverage-summary td { border-right: 1px solid #bbb; } 125 | .coverage-summary td:last-child { border-right: none; } 126 | .coverage-summary th { 127 | text-align: left; 128 | font-weight: normal; 129 | white-space: nowrap; 130 | } 131 | .coverage-summary th.file { border-right: none !important; } 132 | .coverage-summary th.pct { } 133 | .coverage-summary th.pic, 134 | .coverage-summary th.abs, 135 | .coverage-summary td.pct, 136 | .coverage-summary td.abs { text-align: right; } 137 | .coverage-summary td.file { white-space: nowrap; } 138 | .coverage-summary td.pic { min-width: 120px !important; } 139 | .coverage-summary tfoot td { } 140 | 141 | .coverage-summary .sorter { 142 | height: 10px; 143 | width: 7px; 144 | display: inline-block; 145 | margin-left: 0.5em; 146 | background: url(sort-arrow-sprite.png) no-repeat scroll 0 0 transparent; 147 | } 148 | .coverage-summary .sorted .sorter { 149 | background-position: 0 -20px; 150 | } 151 | .coverage-summary .sorted-desc .sorter { 152 | background-position: 0 -10px; 153 | } 154 | .status-line { height: 10px; } 155 | /* yellow */ 156 | .cbranch-no { background: yellow !important; color: #111; } 157 | /* dark red */ 158 | .red.solid, .status-line.low, .low .cover-fill { background:#C21F39 } 159 | .low .chart { border:1px solid #C21F39 } 160 | .highlighted, 161 | .highlighted .cstat-no, .highlighted .fstat-no, .highlighted .cbranch-no{ 162 | background: #C21F39 !important; 163 | } 164 | /* medium red */ 165 | .cstat-no, .fstat-no, .cbranch-no, .cbranch-no { background:#F6C6CE } 166 | /* light red */ 167 | .low, .cline-no { background:#FCE1E5 } 168 | /* light green */ 169 | .high, .cline-yes { background:rgb(230,245,208) } 170 | /* medium green */ 171 | .cstat-yes { background:rgb(161,215,106) } 172 | /* dark green */ 173 | .status-line.high, .high .cover-fill { background:rgb(77,146,33) } 174 | .high .chart { border:1px solid rgb(77,146,33) } 175 | /* dark yellow (gold) */ 176 | .status-line.medium, .medium .cover-fill { background: #f9cd0b; } 177 | .medium .chart { border:1px solid #f9cd0b; } 178 | /* light yellow */ 179 | .medium { background: #fff4c2; } 180 | 181 | .cstat-skip { background: #ddd; color: #111; } 182 | .fstat-skip { background: #ddd; color: #111 !important; } 183 | .cbranch-skip { background: #ddd !important; color: #111; } 184 | 185 | span.cline-neutral { background: #eaeaea; } 186 | 187 | .coverage-summary td.empty { 188 | opacity: .5; 189 | padding-top: 4px; 190 | padding-bottom: 4px; 191 | line-height: 1; 192 | color: #888; 193 | } 194 | 195 | .cover-fill, .cover-empty { 196 | display:inline-block; 197 | height: 12px; 198 | } 199 | .chart { 200 | line-height: 0; 201 | } 202 | .cover-empty { 203 | background: white; 204 | } 205 | .cover-full { 206 | border-right: none !important; 207 | } 208 | pre.prettyprint { 209 | border: none !important; 210 | padding: 0 !important; 211 | margin: 0 !important; 212 | } 213 | .com { color: #999 !important; } 214 | .ignore-none { color: #999; font-weight: normal; } 215 | 216 | .wrapper { 217 | min-height: 100%; 218 | height: auto !important; 219 | height: 100%; 220 | margin: 0 auto -48px; 221 | } 222 | .footer, .push { 223 | height: 48px; 224 | } 225 | -------------------------------------------------------------------------------- /.eslintrc_test: -------------------------------------------------------------------------------- 1 | { 2 | root: true, 3 | parser: 'babel-eslint', 4 | plugins: [/*'import', */'jsx-a11y', 'react'], 5 | env: { 6 | browser: true, 7 | commonjs: true, 8 | es6: true, 9 | jest: true, 10 | node: true 11 | }, 12 | parserOptions: { 13 | ecmaVersion: 6, 14 | sourceType: 'module', 15 | ecmaFeatures: { 16 | jsx: true, 17 | generators: true, 18 | experimentalObjectRestSpread: true 19 | } 20 | }, 21 | settings: { 22 | 'import/ignore': [ 23 | 'node_modules', 24 | '\\.(json|css|jpg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm)$', 25 | ], 26 | 'import/extensions': ['.js'], 27 | 'import/resolver': { 28 | node: { 29 | extensions: ['.js', '.json'] 30 | } 31 | } 32 | }, 33 | rules: { 34 | // http://eslint.org/docs/rules/ 35 | 'array-callback-return': 'warn', 36 | 'camelcase': 'warn', 37 | 'curly': 'warn', 38 | 'default-case': ['warn', { commentPattern: '^no default$' }], 39 | 'dot-location': ['warn', 'property'], 40 | 'eol-last': 'warn', 41 | 'eqeqeq': ['warn', 'always'], 42 | 'indent': ['warn', 2, { "SwitchCase": 1 }], 43 | 'guard-for-in': 'warn', 44 | 'keyword-spacing': 'warn', 45 | 'new-parens': 'warn', 46 | 'no-array-constructor': 'warn', 47 | 'no-caller': 'warn', 48 | 'no-cond-assign': ['warn', 'always'], 49 | 'no-const-assign': 'warn', 50 | 'no-control-regex': 'warn', 51 | 'no-delete-var': 'warn', 52 | 'no-dupe-args': 'warn', 53 | 'no-dupe-class-members': 'warn', 54 | 'no-dupe-keys': 'warn', 55 | 'no-duplicate-case': 'warn', 56 | 'no-empty-character-class': 'warn', 57 | 'no-empty-pattern': 'warn', 58 | 'no-eval': 'warn', 59 | 'no-ex-assign': 'warn', 60 | 'no-extend-native': 'warn', 61 | 'no-extra-bind': 'warn', 62 | 'no-extra-label': 'warn', 63 | 'no-fallthrough': 'warn', 64 | 'no-func-assign': 'warn', 65 | 'no-global-assign': 'warn', 66 | 'no-implied-eval': 'warn', 67 | 'no-invalid-regexp': 'warn', 68 | 'no-iterator': 'warn', 69 | 'no-label-var': 'warn', 70 | 'no-labels': ['warn', { allowLoop: false, allowSwitch: false }], 71 | 'no-lone-blocks': 'warn', 72 | 'no-loop-func': 'warn', 73 | 'no-mixed-operators': ['warn', { 74 | groups: [ 75 | ['&', '|', '^', '~', '<<', '>>', '>>>'], 76 | ['==', '!=', '===', '!==', '>', '>=', '<', '<='], 77 | ['&&', '||'], 78 | ['in', 'instanceof'] 79 | ], 80 | allowSamePrecedence: false 81 | }], 82 | 'no-multi-str': 'warn', 83 | 'no-new-func': 'warn', 84 | 'no-new-object': 'warn', 85 | 'no-new-symbol': 'warn', 86 | 'no-new-wrappers': 'warn', 87 | 'no-obj-calls': 'warn', 88 | 'no-octal': 'warn', 89 | 'no-octal-escape': 'warn', 90 | 'no-redeclare': 'warn', 91 | 'no-regex-spaces': 'warn', 92 | 'no-restricted-syntax': [ 93 | 'warn', 94 | 'LabeledStatement', 95 | 'WithStatement', 96 | ], 97 | 'no-script-url': 'warn', 98 | 'no-self-assign': 'warn', 99 | 'no-self-compare': 'warn', 100 | 'no-sequences': 'warn', 101 | 'no-shadow-restricted-names': 'warn', 102 | 'no-sparse-arrays': 'warn', 103 | 'no-template-curly-in-string': 'warn', 104 | 'no-this-before-super': 'warn', 105 | 'no-throw-literal': 'warn', 106 | 'no-undef': 'warn', 107 | 'no-unexpected-multiline': 'warn', 108 | 'no-unreachable': 'warn', 109 | 'no-unsafe-negation': 'warn', 110 | 'no-unused-expressions': 'warn', 111 | 'no-unused-labels': 'warn', 112 | 'no-unused-vars': ['warn', { vars: 'local', args: 'none' }], 113 | 'no-use-before-define': ['warn', 'nofunc'], 114 | 'no-useless-computed-key': 'warn', 115 | 'no-useless-concat': 'warn', 116 | 'no-useless-constructor': 'warn', 117 | 'no-useless-escape': 'warn', 118 | 'no-useless-rename': ['warn', { 119 | ignoreDestructuring: false, 120 | ignoreImport: false, 121 | ignoreExport: false, 122 | }], 123 | 'no-with': 'warn', 124 | 'no-whitespace-before-property': 'warn', 125 | 'object-curly-spacing': ['warn', 'always'], 126 | 'operator-assignment': ['warn', 'always'], 127 | radix: 'warn', 128 | 'require-yield': 'warn', 129 | 'rest-spread-spacing': ['warn', 'never'], 130 | 'semi': 'warn', 131 | strict: ['warn', 'never'], 132 | 'unicode-bom': ['warn', 'never'], 133 | 'use-isnan': 'warn', 134 | 'valid-typeof': 'warn', 135 | 'react/jsx-boolean-value': 'warn', 136 | 'react/jsx-closing-bracket-location': 'warn', 137 | 'react/jsx-curly-spacing': 'warn', 138 | 'react/jsx-equals-spacing': ['warn', 'never'], 139 | 'react/jsx-first-prop-new-line': ['warn', 'multiline'], 140 | 'react/jsx-handler-names': 'warn', 141 | 'react/jsx-indent': ['warn', 2], 142 | 'react/jsx-indent-props': ['warn', 2], 143 | 'react/jsx-key': 'warn', 144 | 'react/jsx-max-props-per-line': 'warn', 145 | 'react/jsx-no-bind': ['warn', {'allowArrowFunctions': true}], 146 | 'react/jsx-no-comment-textnodes': 'warn', 147 | 'react/jsx-no-duplicate-props': ['warn', { ignoreCase: true }], 148 | 'react/jsx-no-undef': 'warn', 149 | 'react/jsx-pascal-case': ['warn', { 150 | allowAllCaps: true, 151 | ignore: [], 152 | }], 153 | 'react/jsx-sort-props': 'warn', 154 | 'react/jsx-tag-spacing': 'warn', 155 | 'react/jsx-uses-react': 'warn', 156 | 'react/jsx-uses-vars': 'warn', 157 | 'react/jsx-wrap-multilines': 'warn', 158 | 'react/no-deprecated': 'warn', 159 | 'react/no-did-mount-set-state': 'warn', 160 | 'react/no-did-update-set-state': 'warn', 161 | 'react/no-direct-mutation-state': 'warn', 162 | 'react/no-is-mounted': 'warn', 163 | 'react/no-unused-prop-types': 'warn', 164 | 'react/prefer-es6-class': 'warn', 165 | // 'react/prefer-stateless-function': 'warn', 166 | 'react/prop-types': 'warn', 167 | 'react/react-in-jsx-scope': 'warn', 168 | 'react/require-render-return': 'warn', 169 | 'react/self-closing-comp': 'warn', 170 | 'react/sort-comp': 'warn', 171 | 'react/sort-prop-types': 'warn', 172 | 'react/style-prop-object': 'warn', 173 | 'react/void-dom-elements-no-children': 'warn', 174 | // https://github.com/evcohen/eslint-plugin-jsx-a11y/tree/master/docs/rules 175 | 'jsx-a11y/aria-role': 'warn', 176 | 'jsx-a11y/img-has-alt': 'warn', 177 | 'jsx-a11y/img-redundant-alt': 'warn', 178 | 'jsx-a11y/no-access-key': 'warn' 179 | } 180 | } 181 | -------------------------------------------------------------------------------- /coverage/lcov-report/base.css: -------------------------------------------------------------------------------- 1 | body, html { 2 | margin:0; padding: 0; 3 | height: 100%; 4 | } 5 | body { 6 | font-family: Helvetica Neue, Helvetica, Arial; 7 | font-size: 14px; 8 | color:#333; 9 | } 10 | .small { font-size: 12px; } 11 | *, *:after, *:before { 12 | -webkit-box-sizing:border-box; 13 | -moz-box-sizing:border-box; 14 | box-sizing:border-box; 15 | } 16 | h1 { font-size: 20px; margin: 0;} 17 | h2 { font-size: 14px; } 18 | pre { 19 | font: 12px/1.4 Consolas, "Liberation Mono", Menlo, Courier, monospace; 20 | margin: 0; 21 | padding: 0; 22 | -moz-tab-size: 2; 23 | -o-tab-size: 2; 24 | tab-size: 2; 25 | } 26 | a { color:#0074D9; text-decoration:none; } 27 | a:hover { text-decoration:underline; } 28 | .strong { font-weight: bold; } 29 | .space-top1 { padding: 10px 0 0 0; } 30 | .pad2y { padding: 20px 0; } 31 | .pad1y { padding: 10px 0; } 32 | .pad2x { padding: 0 20px; } 33 | .pad2 { padding: 20px; } 34 | .pad1 { padding: 10px; } 35 | .space-left2 { padding-left:55px; } 36 | .space-right2 { padding-right:20px; } 37 | .center { text-align:center; } 38 | .clearfix { display:block; } 39 | .clearfix:after { 40 | content:''; 41 | display:block; 42 | height:0; 43 | clear:both; 44 | visibility:hidden; 45 | } 46 | .fl { float: left; } 47 | @media only screen and (max-width:640px) { 48 | .col3 { width:100%; max-width:100%; } 49 | .hide-mobile { display:none!important; } 50 | } 51 | 52 | .quiet { 53 | color: #7f7f7f; 54 | color: rgba(0,0,0,0.5); 55 | } 56 | .quiet a { opacity: 0.7; } 57 | 58 | .fraction { 59 | font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; 60 | font-size: 10px; 61 | color: #555; 62 | background: #E8E8E8; 63 | padding: 4px 5px; 64 | border-radius: 3px; 65 | vertical-align: middle; 66 | } 67 | 68 | div.path a:link, div.path a:visited { color: #333; } 69 | table.coverage { 70 | border-collapse: collapse; 71 | margin: 10px 0 0 0; 72 | padding: 0; 73 | } 74 | 75 | table.coverage td { 76 | margin: 0; 77 | padding: 0; 78 | vertical-align: top; 79 | } 80 | table.coverage td.line-count { 81 | text-align: right; 82 | padding: 0 5px 0 20px; 83 | } 84 | table.coverage td.line-coverage { 85 | text-align: right; 86 | padding-right: 10px; 87 | min-width:20px; 88 | } 89 | 90 | table.coverage td span.cline-any { 91 | display: inline-block; 92 | padding: 0 5px; 93 | width: 100%; 94 | } 95 | .missing-if-branch { 96 | display: inline-block; 97 | margin-right: 5px; 98 | border-radius: 3px; 99 | position: relative; 100 | padding: 0 4px; 101 | background: #333; 102 | color: yellow; 103 | } 104 | 105 | .skip-if-branch { 106 | display: none; 107 | margin-right: 10px; 108 | position: relative; 109 | padding: 0 4px; 110 | background: #ccc; 111 | color: white; 112 | } 113 | .missing-if-branch .typ, .skip-if-branch .typ { 114 | color: inherit !important; 115 | } 116 | .coverage-summary { 117 | border-collapse: collapse; 118 | width: 100%; 119 | } 120 | .coverage-summary tr { border-bottom: 1px solid #bbb; } 121 | .keyline-all { border: 1px solid #ddd; } 122 | .coverage-summary td, .coverage-summary th { padding: 10px; } 123 | .coverage-summary tbody { border: 1px solid #bbb; } 124 | .coverage-summary td { border-right: 1px solid #bbb; } 125 | .coverage-summary td:last-child { border-right: none; } 126 | .coverage-summary th { 127 | text-align: left; 128 | font-weight: normal; 129 | white-space: nowrap; 130 | } 131 | .coverage-summary th.file { border-right: none !important; } 132 | .coverage-summary th.pct { } 133 | .coverage-summary th.pic, 134 | .coverage-summary th.abs, 135 | .coverage-summary td.pct, 136 | .coverage-summary td.abs { text-align: right; } 137 | .coverage-summary td.file { white-space: nowrap; } 138 | .coverage-summary td.pic { min-width: 120px !important; } 139 | .coverage-summary tfoot td { } 140 | 141 | .coverage-summary .sorter { 142 | height: 10px; 143 | width: 7px; 144 | display: inline-block; 145 | margin-left: 0.5em; 146 | background: url(sort-arrow-sprite.png) no-repeat scroll 0 0 transparent; 147 | } 148 | .coverage-summary .sorted .sorter { 149 | background-position: 0 -20px; 150 | } 151 | .coverage-summary .sorted-desc .sorter { 152 | background-position: 0 -10px; 153 | } 154 | .status-line { height: 10px; } 155 | /* yellow */ 156 | .cbranch-no { background: yellow !important; color: #111; } 157 | /* dark red */ 158 | .red.solid, .status-line.low, .low .cover-fill { background:#C21F39 } 159 | .low .chart { border:1px solid #C21F39 } 160 | .highlighted, 161 | .highlighted .cstat-no, .highlighted .fstat-no, .highlighted .cbranch-no{ 162 | background: #C21F39 !important; 163 | } 164 | /* medium red */ 165 | .cstat-no, .fstat-no, .cbranch-no, .cbranch-no { background:#F6C6CE } 166 | /* light red */ 167 | .low, .cline-no { background:#FCE1E5 } 168 | /* light green */ 169 | .high, .cline-yes { background:rgb(230,245,208) } 170 | /* medium green */ 171 | .cstat-yes { background:rgb(161,215,106) } 172 | /* dark green */ 173 | .status-line.high, .high .cover-fill { background:rgb(77,146,33) } 174 | .high .chart { border:1px solid rgb(77,146,33) } 175 | /* dark yellow (gold) */ 176 | .status-line.medium, .medium .cover-fill { background: #f9cd0b; } 177 | .medium .chart { border:1px solid #f9cd0b; } 178 | /* light yellow */ 179 | .medium { background: #fff4c2; } 180 | 181 | .cstat-skip { background: #ddd; color: #111; } 182 | .fstat-skip { background: #ddd; color: #111 !important; } 183 | .cbranch-skip { background: #ddd !important; color: #111; } 184 | 185 | span.cline-neutral { background: #eaeaea; } 186 | 187 | .coverage-summary td.empty { 188 | opacity: .5; 189 | padding-top: 4px; 190 | padding-bottom: 4px; 191 | line-height: 1; 192 | color: #888; 193 | } 194 | 195 | .cover-fill, .cover-empty { 196 | display:inline-block; 197 | height: 12px; 198 | } 199 | .chart { 200 | line-height: 0; 201 | } 202 | .cover-empty { 203 | background: white; 204 | } 205 | .cover-full { 206 | border-right: none !important; 207 | } 208 | pre.prettyprint { 209 | border: none !important; 210 | padding: 0 !important; 211 | margin: 0 !important; 212 | } 213 | .com { color: #999 !important; } 214 | .ignore-none { color: #999; font-weight: normal; } 215 | 216 | .wrapper { 217 | min-height: 100%; 218 | height: auto !important; 219 | height: 100%; 220 | margin: 0 auto -48px; 221 | } 222 | .footer, .push { 223 | height: 48px; 224 | } 225 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Icon.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Icon.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Icon.js 20 |

21 |
22 |
23 | 75% 24 | Statements 25 | 3/4 26 |
27 |
28 | 100% 29 | Branches 30 | 0/0 31 |
32 |
33 | 0% 34 | Functions 35 | 0/1 36 |
37 |
38 | 75% 39 | Lines 40 | 3/4 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
143 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22
 71 | 23
 72 | 24
 73 | 25
 74 | 26
 75 | 27
 76 | 28
 77 | 29
 78 | 30
 79 | 31
 80 | 32 
 81 |  
 82 |  
 83 |  
 84 | 1x
 85 |  
 86 |  
 87 |  
 88 |  
 89 |  
 90 |  
 91 |  
 92 |  
 93 |  
 94 | 1x
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 |  
101 |  
102 |  
103 | 1x
104 |  
105 |  
106 |  
107 |  
108 |  
109 |  
110 |  
111 |  
import styled from 'styled-components';
112 | import React from 'react';
113 | import PropTypes from 'prop-types';
114 |  
115 | const Img = styled.img`
116 |     width: 22px;
117 |     height: 22px;
118 |     position : absolute;
119 |     cursor: pointer;
120 |     bottom: 3px;
121 |     margin: auto;
122 |     right: 10px;
123 | `;
124 |  
125 | const Icon = props => {
126 |   return ( 
127 |     <Img
128 |       {...props}
129 |       className={props.className}
130 |       src={props.icon}
131 |     /> 
132 |   );
133 | };
134 | Icon.propTypes = {
135 |   className: PropTypes.oneOfType([
136 |     PropTypes.string,
137 |     PropTypes.object
138 |   ]),
139 |   icon: PropTypes.string.isRequired
140 | };
141 | export default Icon;
142 |  
144 |
145 |
146 |
147 | Code coverage 148 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 149 |
150 | 151 | 152 | 159 | 160 | 161 | 162 | 163 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/Input.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/Input.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements Input.js 20 |

21 |
22 |
23 | 100% 24 | Statements 25 | 5/5 26 |
27 |
28 | 50% 29 | Branches 30 | 1/2 31 |
32 |
33 | 100% 34 | Functions 35 | 2/2 36 |
37 |
38 | 100% 39 | Lines 40 | 5/5 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
152 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22
 71 | 23
 72 | 24
 73 | 25
 74 | 26
 75 | 27
 76 | 28
 77 | 29
 78 | 30
 79 | 31
 80 | 32
 81 | 33
 82 | 34
 83 | 35 
 84 |  
 85 |  
 86 |  
 87 | 1x
 88 |  
 89 |  
 90 |  
 91 |  
 92 | 1x
 93 |  
 94 |  
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 | 1x
101 | 1x
102 |  
103 |  
104 |  
105 |  
106 |  
107 |  
108 |  
109 | 1x
110 |  
111 |  
112 |  
113 |  
114 |  
115 |  
116 |  
117 |  
import styled from 'styled-components';
118 | import React from 'react';
119 | import PropTypes from 'prop-types';
120 |  
121 | const DInput = styled.input`
122 |   width:100%;
123 |   padding: 5px;
124 |   color: black;
125 |   background: white;
126 |   border: ${props => !props.showBorder ? 'none' : '1px solid'};
127 |   border-radius: 3px;
128 |   box-sizing : border-box;
129 |   &:focus {
130 |     outline: none;
131 |   }
132 | `;
133 |  
134 | const Input = props => {
135 |   return (
136 |     <DInput
137 |       {...props} 
138 |       className={props.className}
139 |     />
140 |   );
141 | };
142 |  
143 | Input.propTypes = {
144 |   className: PropTypes.oneOfType([
145 |     PropTypes.string,
146 |     PropTypes.object
147 |   ])
148 | };
149 |  
150 | export default Input;
151 |  
153 |
154 |
155 |
156 | Code coverage 157 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 158 |
159 | 160 | 161 | 168 | 169 | 170 | 171 | 172 | -------------------------------------------------------------------------------- /coverage/elements/Icon.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Icon.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Icon.js

23 |
24 | 25 |
26 | 75% 27 | Statements 28 | 3/4 29 |
30 | 31 | 32 |
33 | 100% 34 | Branches 35 | 0/0 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/1 43 |
44 | 45 | 46 |
47 | 75% 48 | Lines 49 | 3/4 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17
 77 | 18
 78 | 19
 79 | 20
 80 | 21
 81 | 22
 82 | 23
 83 | 24
 84 | 25
 85 | 26
 86 | 27
 87 | 28
 88 | 29
 89 | 30
 90 | 31
 91 | 32 
 92 |  
 93 |  
 94 |  
 95 | 1x
 96 |  
 97 |  
 98 |  
 99 |  
100 |  
101 |  
102 |  
103 |  
104 |  
105 | 1x
106 |  
107 |  
108 |  
109 |  
110 |  
111 |  
112 |  
113 |  
114 | 1x
115 |  
116 |  
117 |  
118 |  
119 |  
120 |  
121 |  
122 |  
import styled from 'styled-components';
123 | import React from 'react';
124 | import PropTypes from 'prop-types';
125 |  
126 | const Img = styled.img`
127 |     width: 22px;
128 |     height: 22px;
129 |     position : absolute;
130 |     cursor: pointer;
131 |     bottom: 3px;
132 |     margin: auto;
133 |     right: 10px;
134 | `;
135 |  
136 | const Icon = props => {
137 |   return ( 
138 |     <Img
139 |       {...props}
140 |       className={props.className}
141 |       src={props.icon}
142 |     /> 
143 |   );
144 | };
145 | Icon.propTypes = {
146 |   className: PropTypes.oneOfType([
147 |     PropTypes.string,
148 |     PropTypes.object
149 |   ]),
150 |   icon: PropTypes.string.isRequired
151 | };
152 | export default Icon;
153 |  
154 | 155 |
156 |
157 |
158 | Code coverage generated by 159 | istanbul 160 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 161 |
162 | 163 | 164 | 169 | 170 | 171 | 172 | 173 | -------------------------------------------------------------------------------- /coverage/elements/Input.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/Input.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements Input.js

23 |
24 | 25 |
26 | 100% 27 | Statements 28 | 5/5 29 |
30 | 31 | 32 |
33 | 50% 34 | Branches 35 | 1/2 36 |
37 | 38 | 39 |
40 | 100% 41 | Functions 42 | 2/2 43 |
44 | 45 | 46 |
47 | 100% 48 | Lines 49 | 5/5 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17
 77 | 18
 78 | 19
 79 | 20
 80 | 21
 81 | 22
 82 | 23
 83 | 24
 84 | 25
 85 | 26
 86 | 27
 87 | 28
 88 | 29
 89 | 30
 90 | 31
 91 | 32
 92 | 33
 93 | 34
 94 | 35 
 95 |  
 96 |  
 97 |  
 98 | 1x
 99 |  
100 |  
101 |  
102 |  
103 | 1x
104 |  
105 |  
106 |  
107 |  
108 |  
109 |  
110 |  
111 | 1x
112 | 1x
113 |  
114 |  
115 |  
116 |  
117 |  
118 |  
119 |  
120 | 1x
121 |  
122 |  
123 |  
124 |  
125 |  
126 |  
127 |  
128 |  
import styled from 'styled-components';
129 | import React from 'react';
130 | import PropTypes from 'prop-types';
131 |  
132 | const DInput = styled.input`
133 |   width:100%;
134 |   padding: 5px;
135 |   color: black;
136 |   background: white;
137 |   border: ${props => !props.showBorder ? 'none' : '1px solid'};
138 |   border-radius: 3px;
139 |   box-sizing : border-box;
140 |   &:focus {
141 |     outline: none;
142 |   }
143 | `;
144 |  
145 | const Input = props => {
146 |   return (
147 |     <DInput
148 |       {...props} 
149 |       className={props.className}
150 |     />
151 |   );
152 | };
153 |  
154 | Input.propTypes = {
155 |   className: PropTypes.oneOfType([
156 |     PropTypes.string,
157 |     PropTypes.object
158 |   ])
159 | };
160 |  
161 | export default Input;
162 |  
163 | 164 |
165 |
166 |
167 | Code coverage generated by 168 | istanbul 169 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 170 |
171 | 172 | 173 | 178 | 179 | 180 | 181 | 182 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/SingleArrow.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/SingleArrow.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements SingleArrow.js 20 |

21 |
22 |
23 | 10% 24 | Statements 25 | 1/10 26 |
27 |
28 | 0% 29 | Branches 30 | 0/10 31 |
32 |
33 | 0% 34 | Functions 35 | 0/9 36 |
37 |
38 | 10% 39 | Lines 40 | 1/10 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
170 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22
 71 | 23
 72 | 24
 73 | 25
 74 | 26
 75 | 27
 76 | 28
 77 | 29
 78 | 30
 79 | 31
 80 | 32
 81 | 33
 82 | 34
 83 | 35
 84 | 36
 85 | 37
 86 | 38
 87 | 39
 88 | 40
 89 | 41 
 90 | 1x
 91 |  
 92 |  
 93 |  
 94 |  
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 |  
101 |  
102 |  
103 |  
104 |  
105 |  
106 |  
107 |  
108 |  
109 |  
110 |  
111 |  
112 |  
113 |  
114 |  
115 |  
116 |  
117 |  
118 |  
119 |  
120 |  
121 |  
122 |  
123 |  
124 |  
125 |  
126 |  
127 |  
128 |  
129 |  
import styled from 'styled-components';
130 | const SingleArrow = styled.span`
131 |     width: 22px;
132 |     height: 22px;
133 |     border-radius: 11.3px;
134 |     background-color: ${props => props.secondaryColor};
135 |     display: inline-block;
136 |     position : absolute;
137 |     top: 0;
138 |     cursor: pointer;
139 |     bottom: 0;
140 |     margin: auto;
141 |     color: #b8c2cb;
142 |     font-weight: bold;
143 |     opacity: 0.4;
144 |     border-radius: 50%;
145 |     border: ${props => '2px solid ' + props.primaryTextColor};
146 |     ${props => props.left ? 'left' : 'right'} : 40px;
147 |     &:after {
148 |         content: '';
149 |         display: inline-block;
150 |         margin-top: 1px;
151 |         margin-left: ${props => props.left ? '8px' : '6px'} ;
152 |         width: 5px;
153 |         height: 5px;
154 |         border-top: ${props => '2px solid ' + props.primaryTextColor};
155 |         border-right: ${props => '2px solid ' + props.primaryTextColor};
156 |         -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
157 |         -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
158 |         transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
159 |         position: absolute;
160 |         top: 0;
161 |         right: 0;
162 |         left: 0;
163 |         bottom: 0;
164 |         margin: auto;
165 |     }
166 | `;
167 |  
168 | export default SingleArrow;
169 |  
171 |
172 |
173 |
174 | Code coverage 175 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 176 |
177 | 178 | 179 | 186 | 187 | 188 | 189 | 190 | -------------------------------------------------------------------------------- /coverage/lcov-report/elements/DoubleArrow.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Code coverage report for elements/DoubleArrow.js 5 | 6 | 7 | 8 | 9 | 14 | 15 | 16 |
17 |
18 |

19 | All files / elements DoubleArrow.js 20 |

21 |
22 |
23 | 11.11% 24 | Statements 25 | 1/9 26 |
27 |
28 | 0% 29 | Branches 30 | 0/8 31 |
32 |
33 | 0% 34 | Functions 35 | 0/8 36 |
37 |
38 | 11.11% 39 | Lines 40 | 1/9 41 |
42 |
43 |

44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |

46 |
47 |
48 | 

 49 | 
182 | 
1
 50 | 2
 51 | 3
 52 | 4
 53 | 5
 54 | 6
 55 | 7
 56 | 8
 57 | 9
 58 | 10
 59 | 11
 60 | 12
 61 | 13
 62 | 14
 63 | 15
 64 | 16
 65 | 17
 66 | 18
 67 | 19
 68 | 20
 69 | 21
 70 | 22
 71 | 23
 72 | 24
 73 | 25
 74 | 26
 75 | 27
 76 | 28
 77 | 29
 78 | 30
 79 | 31
 80 | 32
 81 | 33
 82 | 34
 83 | 35
 84 | 36
 85 | 37
 86 | 38
 87 | 39
 88 | 40
 89 | 41
 90 | 42
 91 | 43
 92 | 44
 93 | 45 
 94 | 1x
 95 |  
 96 |  
 97 |  
 98 |  
 99 |  
100 |  
101 |  
102 |  
103 |  
104 |  
105 |  
106 |  
107 |  
108 |  
109 |  
110 |  
111 |  
112 |  
113 |  
114 |  
115 |  
116 |  
117 |  
118 |  
119 |  
120 |  
121 |  
122 |  
123 |  
124 |  
125 |  
126 |  
127 |  
128 |  
129 |  
130 |  
131 |  
132 |  
133 |  
134 |  
135 |  
136 |  
137 |  
import styled from 'styled-components';
138 | const DoubleArrow = styled.span`
139 |     width: 22px;
140 |     height: 22px;
141 |     border-radius: 11.3px;
142 |     background-color: ${props => props.secondaryColor};
143 |     display: inline-block;
144 |     position : absolute;
145 |     top: 0;
146 |     cursor: pointer;
147 |     bottom: 0;
148 |     margin: auto;
149 |     color: #b8c2cb;
150 |     font-weight: bold;
151 |     opacity: 0.4;
152 |     ${props => props.left ? 'left' : 'right'} : 7px;
153 |     border-radius: 50%;
154 |     border: ${props => '2px solid ' + props.primaryTextColor};
155 |     &:after, &:before {
156 |         content: '';
157 |         display: inline-block;
158 |         width: 5px;
159 |         height: 5px;
160 |         border-top: ${props => '2px solid ' + props.primaryTextColor};
161 |         border-right: ${props => '2px solid ' + props.primaryTextColor};
162 |         -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
163 |         -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
164 |         transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
165 |         position: absolute;
166 |         top: 0;
167 |         right: 0;
168 |         left: 0;
169 |         bottom: 0;
170 |         margin: auto;
171 |     }
172 |     &:after{
173 |         margin-left: 5px;
174 |     }
175 |     &:before{
176 |         margin-right: 5px;
177 |     }
178 | `;
179 |  
180 | export default DoubleArrow;
181 |  
183 |
184 |
185 |
186 | Code coverage 187 | generated by istanbul at Sun Aug 04 2019 16:57:57 GMT+0530 (India Standard Time) 188 |
189 | 190 | 191 | 198 | 199 | 200 | 201 | 202 | -------------------------------------------------------------------------------- /coverage/elements/SingleArrow.js.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Code coverage report for elements/SingleArrow.js 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
21 |
22 |

All files / elements SingleArrow.js

23 |
24 | 25 |
26 | 10% 27 | Statements 28 | 1/10 29 |
30 | 31 | 32 |
33 | 0% 34 | Branches 35 | 0/10 36 |
37 | 38 | 39 |
40 | 0% 41 | Functions 42 | 0/9 43 |
44 | 45 | 46 |
47 | 10% 48 | Lines 49 | 1/10 50 |
51 | 52 | 53 |
54 |

55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |

57 |
58 |
59 | 

 60 | 
1
 61 | 2
 62 | 3
 63 | 4
 64 | 5
 65 | 6
 66 | 7
 67 | 8
 68 | 9
 69 | 10
 70 | 11
 71 | 12
 72 | 13
 73 | 14
 74 | 15
 75 | 16
 76 | 17
 77 | 18
 78 | 19
 79 | 20
 80 | 21
 81 | 22
 82 | 23
 83 | 24
 84 | 25
 85 | 26
 86 | 27
 87 | 28
 88 | 29
 89 | 30
 90 | 31
 91 | 32
 92 | 33
 93 | 34
 94 | 35
 95 | 36
 96 | 37
 97 | 38
 98 | 39
 99 | 40
100 | 41 
101 | 1x
102 |  
103 |  
104 |  
105 |  
106 |  
107 |  
108 |  
109 |  
110 |  
111 |  
112 |  
113 |  
114 |  
115 |  
116 |  
117 |  
118 |  
119 |  
120 |  
121 |  
122 |  
123 |  
124 |  
125 |  
126 |  
127 |  
128 |  
129 |  
130 |  
131 |  
132 |  
133 |  
134 |  
135 |  
136 |  
137 |  
138 |  
139 |  
140 |  
import styled from 'styled-components';
141 | const SingleArrow = styled.span`
142 |     width: 22px;
143 |     height: 22px;
144 |     border-radius: 11.3px;
145 |     background-color: ${props => props.secondaryColor};
146 |     display: inline-block;
147 |     position : absolute;
148 |     top: 0;
149 |     cursor: pointer;
150 |     bottom: 0;
151 |     margin: auto;
152 |     color: #b8c2cb;
153 |     font-weight: bold;
154 |     opacity: 0.4;
155 |     border-radius: 50%;
156 |     border: ${props => '2px solid ' + props.primaryTextColor};
157 |     ${props => props.left ? 'left' : 'right'} : 40px;
158 |     &:after {
159 |         content: '';
160 |         display: inline-block;
161 |         margin-top: 1px;
162 |         margin-left: ${props => props.left ? '8px' : '6px'} ;
163 |         width: 5px;
164 |         height: 5px;
165 |         border-top: ${props => '2px solid ' + props.primaryTextColor};
166 |         border-right: ${props => '2px solid ' + props.primaryTextColor};
167 |         -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
168 |         -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
169 |         transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
170 |         position: absolute;
171 |         top: 0;
172 |         right: 0;
173 |         left: 0;
174 |         bottom: 0;
175 |         margin: auto;
176 |     }
177 | `;
178 |  
179 | export default SingleArrow;
180 |  
181 | 182 |
183 |
184 |
185 | Code coverage generated by 186 | istanbul 187 | at Tue Aug 17 2021 11:30:05 GMT+0530 (India Standard Time) 188 |
189 | 190 | 191 | 196 | 197 | 198 | 199 | 200 | --------------------------------------------------------------------------------