@smart-react-components/ui/DatePicker/index.js

SRC UI includes React and Styled components.

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.DatePickerTimeType = exports.DatePickerType = void 0;
const Section_1 = __importDefault(require("@smart-react-components/core/Element/Section"));
const element_props_1 = __importDefault(require("@smart-react-components/core/element-props"));
const intrinsic_styled_core_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-core-props"));
const CSSTransitionSwitch_1 = __importDefault(require("@smart-react-components/transition/CSSTransitionSwitch"));
const react_1 = __importDefault(require("react"));
const DatePickerButtons_1 = __importDefault(require("../components/DatePicker/DatePickerButtons"));
const DatePickerElement_1 = __importDefault(require("../components/DatePicker/DatePickerElement"));
const DatePickerHeader_1 = __importDefault(require("../components/DatePicker/DatePickerHeader"));
const DatePicker_1 = __importDefault(require("../components/DatePicker/DatePicker"));
const TimePicker_1 = __importDefault(require("../components/DatePicker/TimePicker"));
const date_picker_1 = require("../constants/date-picker");
const props_1 = require("../util/props");
const core_1 = require("@smart-react-components/core");
var date_picker_2 = require("../constants/date-picker");
Object.defineProperty(exports, "DatePickerType", { enumerable: true, get: function () { return date_picker_2.DatePickerType; } });
Object.defineProperty(exports, "DatePickerTimeType", { enumerable: true, get: function () { return date_picker_2.DatePickerTimeType; } });
const DatePicker = props => {
    var _a;
    const [selectedPicker, setSelectedPicker] = react_1.default.useState(props.pickerType !== date_picker_1.DatePickerType.TIME ? date_picker_1.DatePickerSelectedPicker.DATE : date_picker_1.DatePickerSelectedPicker.TIME);
    const [selectedDate, setSelectedDate] = react_1.default.useState((_a = props.value) !== null && _a !== void 0 ? _a : new Date());
    const [selectedDatePicker, setSelectedDatePicker] = react_1.default.useState(date_picker_1.DatePickerSelectedDatePicker.WEEK);
    return (react_1.default.createElement(DatePickerElement_1.default, Object.assign({}, props.elementProps, (0, element_props_1.default)(props, [intrinsic_styled_core_props_1.default]), (0, props_1.applyResponsiveStyledProp)(props, 'size', 'datePickerSize', v => v)),
        react_1.default.createElement(DatePickerHeader_1.default, Object.assign({}, (0, props_1.applyResponsiveStyledProp)(props, 'size', 'size', v => v), { hasCloseIcon: props.hasCloseIcon, isSoft: props.isSoft, palette: props.palette, pickerType: props.pickerType, onClose: props.onClose, selectedPicker: selectedPicker, setSelectedPicker: setSelectedPicker, value: props.value })),
        react_1.default.createElement(Section_1.default, Object.assign({}, (0, props_1.applyResponsiveStyledProps)(props, 'size', {
            paddingHorizontal: v => `$size.datePicker.${v}.space.x`,
            paddingVertical: v => `$size.datePicker.${v}.space.y`,
        }), { background: "$color.dynamic.background", borderBottomRadius: "$radius.datePicker" }),
            react_1.default.createElement(core_1.Div, Object.assign({}, (0, props_1.applyResponsiveStyledProp)(props, 'size', 'height', v => `$size.datePicker.${v}.bodyHeight`)),
                react_1.default.createElement(CSSTransitionSwitch_1.default, { active: selectedPicker, className: selectedPicker === date_picker_1.DatePickerSelectedPicker.DATE ? 'src-out-in' : 'src-in-out', duration: 150 },
                    react_1.default.createElement(DatePicker_1.default, Object.assign({ key: date_picker_1.DatePickerSelectedPicker.DATE }, (0, props_1.applyResponsiveStyledProp)(props, 'size', 'size', v => v), { isSoft: props.isSoft, palette: props.palette, selectedDate: selectedDate, selectedPicker: selectedDatePicker, setSelectedDate: setSelectedDate, setSelectedPicker: setSelectedDatePicker, setValue: props.setValue, value: props.value })),
                    react_1.default.createElement(TimePicker_1.default, Object.assign({ key: date_picker_1.DatePickerSelectedPicker.TIME }, (0, props_1.applyResponsiveStyledProp)(props, 'size', 'size', v => v), { isSoft: props.isSoft, palette: props.palette, setValue: props.setValue, timeType: props.timeType, value: props.value })))),
            props.hasButtons && (react_1.default.createElement(DatePickerButtons_1.default, { isSoft: props.isSoft, palette: props.palette, onCancel: props.onCancel, onSave: props.onSave })))));
};
DatePicker.defaultProps = {
    palette: 'primary',
    pickerType: date_picker_1.DatePickerType.DATE_TIME,
    size: 'medium',
    timeType: date_picker_1.DatePickerTimeType.T12,
};
exports.default = DatePicker;