@boomerang-io/carbon-addons-boomerang-react/dist/cjs/components/DateInput/DateInput.js

Carbon Addons for Boomerang apps

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var react = require('@carbon/react');
var icons = require('@carbon/react/icons');
var cx = require('classnames');
var TooltipHover = require('../TooltipHover/TooltipHover.js');
var DataDrivenInputTypes = require('../../constants/DataDrivenInputTypes.js');
var settings = require('../../internal/settings.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);
var cx__default = /*#__PURE__*/_interopDefault(cx);

/*
IBM Confidential
694970X, 69497O0
© Copyright IBM Corp. 2022, 2024
*/
const DateInputComponent = React__default.default.forwardRef(function DateInputComponent({ id, dateFormat, datePickerProps = {}, disabled, helperText, invalid, label, labelText, max, min, onCalendarChange, onChange, readOnly, tooltipClassName = `${settings.prefix}--bmrg-date-input__tooltip`, tooltipContent, tooltipProps = { direction: "top" }, type = DataDrivenInputTypes.DATE_TYPES.DATE, value, ...dateInputProps }, ref) {
    const labelValue = label || labelText;
    const dateInputHelperId = !helperText ? undefined : `date-input-helper-text-${id}`;
    const helperClasses = cx__default.default(`${settings.prefix}--form__helper-text`, {
        [`${settings.prefix}--form__helper-text--disabled`]: disabled,
    });
    if (type === DataDrivenInputTypes.DATE_TYPES.DATE_RANGE) {
        /** Add support for csv strings */
        const finalValue = typeof value === "string" ? value.split(",") : value;
        return (React__default.default.createElement("div", { className: `${settings.prefix}--bmrg-date-input` },
            labelValue && (React__default.default.createElement("div", { className: `${settings.prefix}--label ${settings.prefix}--bmrg-date-input__label` },
                React__default.default.createElement("div", null, labelValue),
                tooltipContent && (React__default.default.createElement("div", { className: tooltipClassName },
                    React__default.default.createElement(TooltipHover.default, { tooltipContent: tooltipContent, ...tooltipProps },
                        React__default.default.createElement(icons.Information, { size: 16, fill: "currentColor" })))))),
            React__default.default.createElement(react.DatePicker, { key: id, allowInput: !readOnly, className: `${settings.prefix}--bmrg-date-picker`, dateFormat: dateFormat, datePickerType: "range", maxDate: max, minDate: min, onChange: typeof onCalendarChange === "function" ? onCalendarChange : onChange, value: finalValue, ...datePickerProps },
                React__default.default.createElement(react.DatePickerInput, { id: `${id}-start`, autoComplete: "off", disabled: disabled || readOnly, invalid: invalid, labelText: "", readOnly: readOnly, ref: ref, style: { width: "100%" }, pattern: ".*", ...dateInputProps }),
                React__default.default.createElement(react.DatePickerInput, { id: `${id}-end`, autoComplete: "off", disabled: disabled || readOnly, invalid: invalid, labelText: "", readOnly: readOnly, ref: ref, style: { width: "100%" }, pattern: ".*", ...dateInputProps })),
            helperText && !invalid && (React__default.default.createElement("div", { id: dateInputHelperId, className: helperClasses }, helperText))));
    }
    else {
        return (React__default.default.createElement("div", { className: `${settings.prefix}--bmrg-date-input` },
            React__default.default.createElement(react.DatePicker, { key: id, allowInput: !readOnly, className: `${settings.prefix}--bmrg-date-picker`, dateFormat: dateFormat, datePickerType: "single", maxDate: max, minDate: min, onChange: onCalendarChange, value: value, ...datePickerProps },
                React__default.default.createElement(react.DatePickerInput, { id: id, disabled: disabled || readOnly, invalid: invalid, onChange: onChange, labelText: labelValue && (React__default.default.createElement("div", { className: `${settings.prefix}--bmrg-date-input__label` },
                        React__default.default.createElement("div", null, labelValue),
                        tooltipContent && (React__default.default.createElement("div", { className: tooltipClassName },
                            React__default.default.createElement(TooltipHover.default, { tooltipContent: tooltipContent, ...tooltipProps },
                                React__default.default.createElement(icons.Information, { size: 16, fill: "currentColor" })))))), readOnly: readOnly, ref: ref, style: { width: "100%" }, pattern: ".*", ...dateInputProps })),
            helperText && !invalid && (React__default.default.createElement("div", { id: dateInputHelperId, className: helperClasses }, helperText))));
    }
});

exports.default = DateInputComponent;