Updated to latest react-datepicker major version

This commit is contained in:
Alejandro Celaya 2022-03-11 17:16:24 +01:00
parent c4148f0494
commit 81d405d7be
4 changed files with 34 additions and 140 deletions

158
package-lock.json generated
View file

@ -29,7 +29,7 @@
"react-chartjs-2": "^3.3.0", "react-chartjs-2": "^3.3.0",
"react-colorful": "^5.5.1", "react-colorful": "^5.5.1",
"react-copy-to-clipboard": "^5.0.4", "react-copy-to-clipboard": "^5.0.4",
"react-datepicker": "^3.6.0", "react-datepicker": "^4.7.0",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-external-link": "^1.2.2", "react-external-link": "^1.2.2",
"react-leaflet": "^3.2.5", "react-leaflet": "^3.2.5",
@ -2375,19 +2375,6 @@
"react": ">=16.x" "react": ">=16.x"
} }
}, },
"node_modules/@hypnosphi/create-react-context": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/@hypnosphi/create-react-context/-/create-react-context-0.3.1.tgz",
"integrity": "sha512-V1klUed202XahrWJLLOT3EXNeCpFHCcJntdFGI15ntCwau+jfT386w7OFTMaCqOgXUH1fa0w/I1oZs+i/Rfr0A==",
"dependencies": {
"gud": "^1.0.0",
"warning": "^4.0.3"
},
"peerDependencies": {
"prop-types": "^15.0.0",
"react": ">=0.14.0"
}
},
"node_modules/@istanbuljs/load-nyc-config": { "node_modules/@istanbuljs/load-nyc-config": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz", "resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz",
@ -4382,20 +4369,6 @@
"react-popper": "^2.2.5" "react-popper": "^2.2.5"
} }
}, },
"node_modules/@types/react-datepicker/node_modules/react-popper": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"dev": true,
"dependencies": {
"react-fast-compare": "^3.0.1",
"warning": "^4.0.2"
},
"peerDependencies": {
"@popperjs/core": "^2.0.0",
"react": "^16.8.0 || ^17"
}
},
"node_modules/@types/react-dom": { "node_modules/@types/react-dom": {
"version": "17.0.13", "version": "17.0.13",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.13.tgz", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.13.tgz",
@ -13172,11 +13145,6 @@
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==", "integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==",
"dev": true "dev": true
}, },
"node_modules/gud": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
"integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
},
"node_modules/gzip-size": { "node_modules/gzip-size": {
"version": "5.1.1", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@ -18779,12 +18747,6 @@
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/popper.js": {
"version": "1.14.6",
"resolved": "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz",
"integrity": "sha1-qyDdTt+SiLiztlMcR8NhEHtgtLA=",
"deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1"
},
"node_modules/portfinder": { "node_modules/portfinder": {
"version": "1.0.28", "version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@ -24106,15 +24068,16 @@
} }
}, },
"node_modules/react-datepicker": { "node_modules/react-datepicker": {
"version": "3.6.0", "version": "4.7.0",
"resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-3.6.0.tgz", "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-4.7.0.tgz",
"integrity": "sha512-QCCtC1Y5kXZSbULbP33P2p0yTU+0Det7eBFABVM2k6AqdIvyBHVkO/hlq2WDeHlPtaf+DEniCIYjrv2BFdUMHw==", "integrity": "sha512-FS8KgbwqpxmJBv/bUdA42MYqYZa+fEYcpc746DZiHvVE2nhjrW/dg7c5B5fIUuI8gZET6FOzuDgezNcj568Czw==",
"dependencies": { "dependencies": {
"@popperjs/core": "^2.9.2",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"date-fns": "^2.0.1", "date-fns": "^2.24.0",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react-onclickoutside": "^6.10.0", "react-onclickoutside": "^6.12.0",
"react-popper": "^1.3.8" "react-popper": "^2.2.5"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.9.0 || ^17", "react": "^16.9.0 || ^17",
@ -24439,19 +24402,16 @@
} }
}, },
"node_modules/react-popper": { "node_modules/react-popper": {
"version": "1.3.10", "version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.10.tgz", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-sZfwHtHCMst0L0G/c83/Y/K1f9fNWMEKsk/cGAor68rQBHB75WuDQ7k95tkce8QNaUHhg9uFXIJbZO0eWRvJbw==", "integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"dependencies": { "dependencies": {
"@babel/runtime": "^7.1.2", "react-fast-compare": "^3.0.1",
"@hypnosphi/create-react-context": "^0.3.1",
"popper.js": "^1.14.4",
"prop-types": "^15.6.1",
"typed-styles": "^0.0.7",
"warning": "^4.0.2" "warning": "^4.0.2"
}, },
"peerDependencies": { "peerDependencies": {
"react": "0.14.x || ^15.0.0 || ^16.0.0 || ^17.0.0" "@popperjs/core": "^2.0.0",
"react": "^16.8.0 || ^17"
} }
}, },
"node_modules/react-redux": { "node_modules/react-redux": {
@ -24579,19 +24539,6 @@
"react-dom": ">=16.8.0" "react-dom": ">=16.8.0"
} }
}, },
"node_modules/reactstrap/node_modules/react-popper": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"dependencies": {
"react-fast-compare": "^3.0.1",
"warning": "^4.0.2"
},
"peerDependencies": {
"@popperjs/core": "^2.0.0",
"react": "^16.8.0 || ^17"
}
},
"node_modules/read-pkg": { "node_modules/read-pkg": {
"version": "5.2.0", "version": "5.2.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
@ -28947,11 +28894,6 @@
"underscore": "^1.12.1" "underscore": "^1.12.1"
} }
}, },
"node_modules/typed-styles": {
"version": "0.0.7",
"resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz",
"integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q=="
},
"node_modules/typedarray": { "node_modules/typedarray": {
"version": "0.0.6", "version": "0.0.6",
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
@ -33025,15 +32967,6 @@
"prop-types": "^15.7.2" "prop-types": "^15.7.2"
} }
}, },
"@hypnosphi/create-react-context": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/@hypnosphi/create-react-context/-/create-react-context-0.3.1.tgz",
"integrity": "sha512-V1klUed202XahrWJLLOT3EXNeCpFHCcJntdFGI15ntCwau+jfT386w7OFTMaCqOgXUH1fa0w/I1oZs+i/Rfr0A==",
"requires": {
"gud": "^1.0.0",
"warning": "^4.0.3"
}
},
"@istanbuljs/load-nyc-config": { "@istanbuljs/load-nyc-config": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz", "resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz",
@ -34559,18 +34492,6 @@
"@types/react": "*", "@types/react": "*",
"date-fns": "^2.0.1", "date-fns": "^2.0.1",
"react-popper": "^2.2.5" "react-popper": "^2.2.5"
},
"dependencies": {
"react-popper": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"dev": true,
"requires": {
"react-fast-compare": "^3.0.1",
"warning": "^4.0.2"
}
}
} }
}, },
"@types/react-dom": { "@types/react-dom": {
@ -41539,11 +41460,6 @@
"integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==", "integrity": "sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==",
"dev": true "dev": true
}, },
"gud": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
"integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
},
"gzip-size": { "gzip-size": {
"version": "5.1.1", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@ -45898,11 +45814,6 @@
"ts-pnp": "^1.1.6" "ts-pnp": "^1.1.6"
} }
}, },
"popper.js": {
"version": "1.14.6",
"resolved": "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz",
"integrity": "sha1-qyDdTt+SiLiztlMcR8NhEHtgtLA="
},
"portfinder": { "portfinder": {
"version": "1.0.28", "version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@ -50125,15 +50036,16 @@
} }
}, },
"react-datepicker": { "react-datepicker": {
"version": "3.6.0", "version": "4.7.0",
"resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-3.6.0.tgz", "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-4.7.0.tgz",
"integrity": "sha512-QCCtC1Y5kXZSbULbP33P2p0yTU+0Det7eBFABVM2k6AqdIvyBHVkO/hlq2WDeHlPtaf+DEniCIYjrv2BFdUMHw==", "integrity": "sha512-FS8KgbwqpxmJBv/bUdA42MYqYZa+fEYcpc746DZiHvVE2nhjrW/dg7c5B5fIUuI8gZET6FOzuDgezNcj568Czw==",
"requires": { "requires": {
"@popperjs/core": "^2.9.2",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"date-fns": "^2.0.1", "date-fns": "^2.24.0",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react-onclickoutside": "^6.10.0", "react-onclickoutside": "^6.12.0",
"react-popper": "^1.3.8" "react-popper": "^2.2.5"
} }
}, },
"react-dev-utils": { "react-dev-utils": {
@ -50376,15 +50288,11 @@
"requires": {} "requires": {}
}, },
"react-popper": { "react-popper": {
"version": "1.3.10", "version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.10.tgz", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-sZfwHtHCMst0L0G/c83/Y/K1f9fNWMEKsk/cGAor68rQBHB75WuDQ7k95tkce8QNaUHhg9uFXIJbZO0eWRvJbw==", "integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"requires": { "requires": {
"@babel/runtime": "^7.1.2", "react-fast-compare": "^3.0.1",
"@hypnosphi/create-react-context": "^0.3.1",
"popper.js": "^1.14.4",
"prop-types": "^15.6.1",
"typed-styles": "^0.0.7",
"warning": "^4.0.2" "warning": "^4.0.2"
} }
}, },
@ -50477,17 +50385,6 @@
"prop-types": "^15.5.8", "prop-types": "^15.5.8",
"react-popper": "^2.2.4", "react-popper": "^2.2.4",
"react-transition-group": "^4.4.2" "react-transition-group": "^4.4.2"
},
"dependencies": {
"react-popper": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
"integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==",
"requires": {
"react-fast-compare": "^3.0.1",
"warning": "^4.0.2"
}
}
} }
}, },
"read-pkg": { "read-pkg": {
@ -53913,11 +53810,6 @@
"underscore": "^1.12.1" "underscore": "^1.12.1"
} }
}, },
"typed-styles": {
"version": "0.0.7",
"resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz",
"integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q=="
},
"typedarray": { "typedarray": {
"version": "0.0.6", "version": "0.0.6",
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",

View file

@ -45,7 +45,7 @@
"react-chartjs-2": "^3.3.0", "react-chartjs-2": "^3.3.0",
"react-colorful": "^5.5.1", "react-colorful": "^5.5.1",
"react-copy-to-clipboard": "^5.0.4", "react-copy-to-clipboard": "^5.0.4",
"react-datepicker": "^3.6.0", "react-datepicker": "^4.7.0",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-external-link": "^1.2.2", "react-external-link": "^1.2.2",
"react-leaflet": "^3.2.5", "react-leaflet": "^3.2.5",

View file

@ -88,8 +88,9 @@
z-index: 2; z-index: 2;
&[data-placement^='top'] .react-datepicker__triangle.react-datepicker__triangle { &[data-placement^='top'] .react-datepicker__triangle.react-datepicker__triangle {
&::after {
border-top-color: var(--primary-color); border-top-color: var(--primary-color);
border-bottom-color: var(--border-color); }
&::before { &::before {
border-top-color: var(--border-color); border-top-color: var(--border-color);
@ -97,8 +98,9 @@
} }
&[data-placement^='bottom'] .react-datepicker__triangle.react-datepicker__triangle { &[data-placement^='bottom'] .react-datepicker__triangle.react-datepicker__triangle {
border-top-color: var(--border-color); &::after {
border-bottom-color: var(--secondary-color); border-bottom-color: var(--secondary-color);
}
&::before { &::before {
border-bottom-color: var(--border-color); border-bottom-color: var(--border-color);

View file

@ -1,12 +1,12 @@
import { FC, useRef } from 'react'; import { FC, useRef } from 'react';
import * as Popper from 'popper.js';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons'; import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons';
import { UncontrolledTooltip } from 'reactstrap'; import { UncontrolledTooltip } from 'reactstrap';
import { Placement } from '@popperjs/core';
interface InfoTooltipProps { interface InfoTooltipProps {
className?: string; className?: string;
placement: Popper.Placement; placement: Placement;
} }
export const InfoTooltip: FC<InfoTooltipProps> = ({ className = '', placement, children }) => { export const InfoTooltip: FC<InfoTooltipProps> = ({ className = '', placement, children }) => {