@adaptabletools/adaptable
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
64 lines (63 loc) • 2.1 kB
JavaScript
import * as React from 'react';
import { parseISO } from 'date-fns';
import useProperty from '../../../components/utils/useProperty';
import AdaptableInput from '../../../View/Components/AdaptableInput';
import { DatepickerContext } from '../../../components/Datepicker/DatepickerContext';
import { parseToISO } from '../../../Utilities/Helpers/DateHelper';
const fillStyle = {
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
};
const hostStyle = {
...fillStyle,
boxSizing: 'border-box',
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
};
const inputStyle = {
position: 'relative',
background: 'transparent',
boxSizing: 'border-box',
minWidth: 0,
outline: 'none',
width: '100%',
border: 'none',
};
export const InternalAdaptableDateEditor = React.forwardRef((props, ref) => {
const inputRef = React.useRef(null);
const focus = () => {
inputRef.current?.focus();
};
const [value, setValue] = useProperty(props, 'value', props.defaultValue, {
onChange: (value) => {
if (value === '' || value == undefined) {
props.onValueChange?.(null);
}
else {
const date = typeof value === 'string' ? parseISO(value) : new Date(value);
props.onValueChange?.(date);
}
},
});
React.useImperativeHandle(ref, () => {
return {
focus,
};
});
const stringValue = parseToISO(value, props.dateFormat);
const onChange = React.useCallback((event) => {
setValue(event.target.value);
}, []);
return (React.createElement("div", { style: hostStyle },
React.createElement(DatepickerContext.Provider, { value: {
onHide: (keyboardEventKey) => {
props.onStopEdit?.(keyboardEventKey);
},
onShow: () => { },
} },
React.createElement(AdaptableInput, { type: 'date', value: stringValue, onChange: onChange, style: inputStyle, ref: inputRef }))));
});