🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
Book a DemoInstallSign in
Socket
Book a DemoInstallSign in

react-datetime-picker

Package Overview
Dependencies
Maintainers
1
Versions
69
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-datetime-picker - npm Package Compare versions

Comparing version

1.7.0
to
2.0.0

18

dist/DateTimeInput.js

@@ -82,3 +82,2 @@ 'use strict';

var allViews = ['hour', 'minute', 'second'];
var className = 'react-datetime-picker__button__input';

@@ -105,8 +104,4 @@ var datesAreDifferent = function datesAreDifferent(date1, date2) {

var selectIfPossible = function selectIfPossible(element) {
if (!element) {
return;
}
element.focus();
element.select();
var focus = function focus(element) {
return element && element.focus();
};

@@ -157,3 +152,3 @@

var previousInput = findPreviousInput(input);
selectIfPossible(previousInput);
focus(previousInput);
break;

@@ -169,3 +164,3 @@ }

var nextInput = findNextInput(_input);
selectIfPossible(nextInput);
focus(nextInput);
break;

@@ -523,2 +518,5 @@ }

value: function render() {
var className = this.props.className;
return _react2.default.createElement(

@@ -637,2 +635,3 @@ 'div',

var _props4 = this.props,
className = _props4.className,
disabled = _props4.disabled,

@@ -756,2 +755,3 @@ isWidgetOpen = _props4.isWidgetOpen,

DateTimeInput.propTypes = {
className: _propTypes2.default.string.isRequired,
disabled: _propTypes2.default.bool,

@@ -758,0 +758,0 @@ isWidgetOpen: _propTypes2.default.bool,

14

dist/DateTimePicker.js

@@ -58,2 +58,3 @@ 'use strict';

var allViews = ['hour', 'minute', 'second'];
var baseClassName = 'react-datetime-picker';

@@ -206,4 +207,5 @@ var DateTimePicker = function (_PureComponent) {

'div',
{ className: 'react-datetime-picker__button' },
{ className: baseClassName + '__wrapper' },
_react2.default.createElement(_DateTimeInput2.default, {
className: baseClassName + '__inputGroup',
disabled: disabled,

@@ -225,3 +227,3 @@ locale: locale,

{
className: 'react-datetime-picker__clear-button react-datetime-picker__button__icon',
className: baseClassName + '__clear-button ' + baseClassName + '__button',
disabled: disabled,

@@ -237,3 +239,3 @@ onClick: this.clear,

{
className: 'react-datetime-picker__calendar-button react-datetime-picker__button__icon',
className: baseClassName + '__calendar-button ' + baseClassName + '__button',
disabled: disabled,

@@ -267,3 +269,3 @@ onClick: this.toggleCalendar,

var className = 'react-datetime-picker__calendar';
var className = baseClassName + '__calendar';

@@ -313,3 +315,3 @@ return _react2.default.createElement(

var className = 'react-datetime-picker__clock';
var className = baseClassName + '__clock';

@@ -356,4 +358,2 @@ var maxDetailIndex = allViews.indexOf(maxDetail);

var baseClassName = 'react-datetime-picker';
return _react2.default.createElement(

@@ -360,0 +360,0 @@ 'div',

2

dist/Divider.js

@@ -21,3 +21,3 @@ 'use strict';

'span',
{ className: 'react-datetime-picker__button__input__divider' },
{ className: 'react-datetime-picker__inputGroup__divider' },
children

@@ -24,0 +24,0 @@ );

6

package.json
{
"name": "react-datetime-picker",
"version": "1.7.0",
"version": "2.0.0",
"description": "A date range picker for your React app.",

@@ -52,5 +52,5 @@ "main": "dist/entry.js",

"react-clock": "^2.3.0",
"react-date-picker": "^6.13.0",
"react-date-picker": "^7.0.0",
"react-lifecycles-compat": "^3.0.4",
"react-time-picker": "^2.8.0"
"react-time-picker": "^3.0.0"
},

@@ -57,0 +57,0 @@ "devDependencies": {

52

src/__tests__/DateTimeInput.jsx

@@ -37,5 +37,9 @@ import React from 'react';

describe('DateTimeInput', () => {
const defaultProps = {
className: 'react-datetime-picker__inputGroup',
};
it('renders a native input and custom inputs', () => {
const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -52,3 +56,6 @@

const component = mount(
<DateTimeInput maxDetail="minute" />
<DateTimeInput
{...defaultProps}
maxDetail="minute"
/>
);

@@ -76,3 +83,6 @@

const component = mount(
<DateTimeInput maxDetail="hour" />
<DateTimeInput
{...defaultProps}
maxDetail="hour"
/>
);

@@ -103,2 +113,3 @@

<DateTimeInput
{...defaultProps}
maxDetail="second"

@@ -126,2 +137,3 @@ value={date}

<DateTimeInput
{...defaultProps}
locale="de-DE"

@@ -150,2 +162,3 @@ maxDetail="second"

<DateTimeInput
{...defaultProps}
maxDetail="second"

@@ -172,3 +185,6 @@ value={date}

const component = mount(
<DateTimeInput maxDetail="second" />
<DateTimeInput
{...defaultProps}
maxDetail="second"
/>
);

@@ -189,2 +205,3 @@

<DateTimeInput
{...defaultProps}
locale="de-DE"

@@ -207,6 +224,6 @@ maxDetail="second"

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);
const separators = component.find('.react-datetime-picker__button__input__divider');
const separators = component.find('.react-datetime-picker__inputGroup__divider');

@@ -222,6 +239,9 @@ expect(separators).toHaveLength(4);

const component = mount(
<DateTimeInput maxDetail="hour" />
<DateTimeInput
{...defaultProps}
maxDetail="hour"
/>
);
const separators = component.find('.react-datetime-picker__button__input__divider');
const separators = component.find('.react-datetime-picker__inputGroup__divider');
const customInputs = component.find('input[type="number"]');

@@ -234,3 +254,3 @@

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -253,3 +273,3 @@

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -265,3 +285,3 @@

const separators = component.find('.react-datetime-picker__button__input__divider');
const separators = component.find('.react-datetime-picker__inputGroup__divider');
const separatorKey = separators.at(0).text();

@@ -275,3 +295,3 @@ dayInput.simulate('keydown', getKey(separatorKey));

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -293,3 +313,3 @@

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -312,3 +332,3 @@

const component = mount(
<DateTimeInput />
<DateTimeInput {...defaultProps} />
);

@@ -334,2 +354,3 @@

<DateTimeInput
{...defaultProps}
onChange={onChange}

@@ -355,2 +376,3 @@ value={date}

<DateTimeInput
{...defaultProps}
maxDetail="second"

@@ -379,2 +401,3 @@ onChange={onChange}

<DateTimeInput
{...defaultProps}
onChange={onChange}

@@ -400,2 +423,3 @@ value={date}

<DateTimeInput
{...defaultProps}
onChange={onChange}

@@ -402,0 +426,0 @@ value={date}

17

src/DateTimeInput.jsx

@@ -33,3 +33,2 @@ import React, { PureComponent } from 'react';

const allViews = ['hour', 'minute', 'second'];
const className = 'react-datetime-picker__button__input';

@@ -58,9 +57,3 @@ const datesAreDifferent = (date1, date2) => (

const selectIfPossible = (element) => {
if (!element) {
return;
}
element.focus();
element.select();
};
const focus = element => element && element.focus();

@@ -229,2 +222,3 @@ const removeUnwantedCharacters = str => str

const {
className,
disabled,

@@ -272,3 +266,3 @@ isWidgetOpen,

const previousInput = findPreviousInput(input);
selectIfPossible(previousInput);
focus(previousInput);
break;

@@ -283,3 +277,3 @@ }

const nextInput = findNextInput(input);
selectIfPossible(nextInput);
focus(nextInput);
break;

@@ -631,2 +625,4 @@ }

render() {
const { className } = this.props;
return (

@@ -651,2 +647,3 @@ <div className={className}>

DateTimeInput.propTypes = {
className: PropTypes.string.isRequired,
disabled: PropTypes.bool,

@@ -653,0 +650,0 @@ isWidgetOpen: PropTypes.bool,

14

src/DateTimePicker.jsx

@@ -16,2 +16,3 @@ import React, { PureComponent } from 'react';

const allViews = ['hour', 'minute', 'second'];
const baseClassName = 'react-datetime-picker';

@@ -173,4 +174,5 @@ export default class DateTimePicker extends PureComponent {

return (
<div className="react-datetime-picker__button">
<div className={`${baseClassName}__wrapper`}>
<DateTimeInput
className={`${baseClassName}__inputGroup`}
disabled={disabled}

@@ -191,3 +193,3 @@ locale={locale}

<button
className="react-datetime-picker__clear-button react-datetime-picker__button__icon"
className={`${baseClassName}__clear-button ${baseClassName}__button`}
disabled={disabled}

@@ -203,3 +205,3 @@ onClick={this.clear}

<button
className="react-datetime-picker__calendar-button react-datetime-picker__button__icon"
className={`${baseClassName}__calendar-button ${baseClassName}__button`}
disabled={disabled}

@@ -234,3 +236,3 @@ onClick={this.toggleCalendar}

const className = 'react-datetime-picker__calendar';
const className = `${baseClassName}__calendar`;

@@ -283,3 +285,3 @@ return (

const className = 'react-datetime-picker__clock';
const className = `${baseClassName}__clock`;

@@ -322,4 +324,2 @@ const maxDetailIndex = allViews.indexOf(maxDetail);

const baseClassName = 'react-datetime-picker';
return (

@@ -326,0 +326,0 @@ <div

2

src/Divider.jsx

@@ -5,3 +5,3 @@ import React from 'react';

const Divider = ({ children }) => (
<span className="react-datetime-picker__button__input__divider">
<span className="react-datetime-picker__inputGroup__divider">
{children}

@@ -8,0 +8,0 @@ </span>

dist/DateTimePicker.css

Sorry, the diff of this file is not supported yet

dist/DateTimePicker.less

Sorry, the diff of this file is not supported yet

src/DateTimePicker.less

Sorry, the diff of this file is not supported yet