@geneui/components
Version:
The Gene UI components library designed for BI tools
175 lines (171 loc) • 6.4 kB
JavaScript
import { _ as _extends } from '../_rollupPluginBabelHelpers-e8fb2e5c.js';
import React__default, { forwardRef, useState, useCallback, useEffect } from 'react';
import PropTypes from 'prop-types';
import { d as dayjsWithPlugins } from '../dateValidation-67caec66.js';
import { g as getBrowserDateFormat } from '../localization-4ba17032.js';
import { c as checkTimeValidation } from '../checkTimeValidation-e56771be.js';
import 'react-dom';
import ExtendedInput from '../ExtendedInput/index.js';
import '../_commonjsHelpers-24198af3.js';
import '../index-031ff73c.js';
import '../configs-00612ce0.js';
import '../index-a0e4e333.js';
import '../hooks/useDeviceType.js';
import '../hooks/useWindowSize.js';
import '../hooks/useDebounce.js';
import '../useEllipsisDetection-4d997d5d.js';
import '../Icon/index.js';
import '../style-inject.es-746bb8ed.js';
import '../SuggestionList/index.js';
import '../hooks/useKeyDown.js';
import '../hooks/useClickOutside.js';
import '../config-1053d64d.js';
import '../Scrollbar/index.js';
import '../callAfterDelay-7272faca.js';
import '../index-6d7e99cd.js';
import '../tslib.es6-f211516f.js';
import '../GeneUIProvider/index.js';
const nonLettersRegex = /[\W_]+/g;
const getFormatSeparator = format => format[format.search(nonLettersRegex)];
const isUpperCase = str => str === str.toUpperCase();
const isLowerCase = str => str === str.toLowerCase();
/*
* Splitting time to { format, value } object
* For checking is value fit format
* Formats are taken from day.js date formats list
* */
function splitTimeToObjects(dateParts, formatParts, meridiemValue, meridiemFormat) {
const hourFormats = ['H', 'HH', 'h', 'hh'];
const minuteFormats = ['m', 'mm'];
const secondFormats = ['s', 'ss'];
const hour = {};
const minute = {};
const second = {};
const meridiem = {};
formatParts.forEach((item, index) => {
if (hourFormats.includes(item)) {
hour.value = dateParts[index];
hour.format = item;
} else if (minuteFormats.includes(item)) {
minute.value = dateParts[index];
minute.format = item;
} else if (secondFormats.includes(item)) {
second.value = dateParts[index];
second.format = item;
}
});
if (meridiemFormat || meridiemValue) {
meridiem.value = meridiemValue;
meridiem.format = meridiemFormat;
}
return {
hour,
minute,
second,
meridiem
};
}
const isHourInRightFormat = _ref => {
let {
value,
format
} = _ref;
return value && (format === 'H' && value.length <= 2 && Number(value[0]) !== 0 || format === 'h' && value.length <= 2 && Number(value[0]) !== 0 || format === 'HH' && value.length === 2 || format === 'hh' && value.length === 2);
};
const isMinuteInRightFormat = _ref2 => {
let {
value,
format
} = _ref2;
return value && (format === 'm' && value.length <= 2 && (value.length !== 2 || Number(value[0]) !== 0) || format === 'mm' && value.length === 2);
};
const isSecondInRightFormat = _ref3 => {
let {
value,
format
} = _ref3;
return !format || value && (format === 's' && value.length <= 2 && (value.length !== 2 || Number(value[0]) !== 0) || format === 'ss' && value.length === 2);
};
const isMeridiemInRightFormat = _ref4 => {
let {
value,
format
} = _ref4;
return !(format || value) || value && (format === 'A' && isUpperCase(value) || format === 'a' && isLowerCase(value));
};
const checkTimeFormat = _ref5 => {
let {
hour,
minute,
second,
meridiem
} = _ref5;
return isHourInRightFormat(hour) && isMinuteInRightFormat(minute) && isSecondInRightFormat(second) && isMeridiemInRightFormat(meridiem);
};
function validateField() {
let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
let required = arguments.length > 1 ? arguments[1] : undefined;
let customValidation = arguments.length > 2 ? arguments[2] : undefined;
let min = arguments.length > 3 ? arguments[3] : undefined;
let max = arguments.length > 4 ? arguments[4] : undefined;
let format = arguments.length > 5 ? arguments[5] : undefined;
const date = dayjsWithPlugins(value, format);
const separator = getFormatSeparator(format);
const splittedDate = value.split(' ');
const splittedFormat = format.split(' ');
const dateParts = splittedDate[0].split(separator);
const formatParts = splittedFormat[0].split(separator);
const timeObject = splitTimeToObjects(dateParts, formatParts, splittedDate[1], splittedFormat[1]);
const isValidFormat = checkTimeFormat(timeObject);
const isValidDate = checkTimeValidation(timeObject);
const isSameLength = dateParts.length === formatParts.length;
const isBefore = !max || date.isBefore(dayjsWithPlugins(max, format));
const isAfter = !min || date.isAfter(dayjsWithPlugins(min, format));
return (!customValidation || customValidation(value)) && (!required || value.length) && (!required && !value.length || isValidDate && isSameLength && isValidFormat && isBefore && isAfter);
}
const DateInput = /*#__PURE__*/forwardRef((_ref6, ref) => {
let {
onChange,
value,
customValidation,
required,
getInitialState,
min,
max,
format,
...restProps
} = _ref6;
const [isValid, setValidation] = useState(() => validateField(value, required, customValidation, min, max, format));
const handleChange = useCallback(e => {
const {
value
} = e.target;
const isValid = validateField(value, required, customValidation, min, max, format);
setValidation(isValid);
onChange && onChange(e, isValid);
}, [onChange, required, customValidation, min, max, format]);
useEffect(() => {
getInitialState && getInitialState(isValid);
}, [getInitialState, isValid]);
useEffect(() => setValidation(validateField(value, required, customValidation, min, max, format)), [required, min, max, format, value, customValidation]);
return /*#__PURE__*/React__default.createElement(ExtendedInput, _extends({
ref: ref,
value: value,
isValid: isValid,
onChange: handleChange
}, restProps));
});
DateInput.propTypes = {
value: PropTypes.string,
onChange: PropTypes.func,
required: PropTypes.bool,
getInitialState: PropTypes.func,
customValidation: PropTypes.func,
min: PropTypes.string,
max: PropTypes.string,
format: PropTypes.string
};
DateInput.defaultProps = {
format: getBrowserDateFormat()
};
export { DateInput as default };