@react-awesome-query-builder/mui
Version:
User-friendly query builder for React. MUI 5 widgets
67 lines (66 loc) • 3.05 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _DateTimePicker = require("@mui/x-date-pickers/DateTimePicker");
var _package = _interopRequireDefault(require("@mui/x-date-pickers/package.json"));
var _FormControl = _interopRequireDefault(require("@mui/material/FormControl"));
var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
var _ui = require("@react-awesome-query-builder/ui");
var _xdpPackage$version$s, _xdpPackage$version; // to determine version
var moment = _ui.Utils.moment;
var xdpVersion = parseInt((_xdpPackage$version$s = _package["default"] === null || _package["default"] === void 0 || (_xdpPackage$version = _package["default"].version) === null || _xdpPackage$version === void 0 || (_xdpPackage$version = _xdpPackage$version.split(".")) === null || _xdpPackage$version === void 0 ? void 0 : _xdpPackage$version[0]) !== null && _xdpPackage$version$s !== void 0 ? _xdpPackage$version$s : "0");
var _default = exports["default"] = function _default(props) {
var value = props.value,
setValue = props.setValue,
use12Hours = props.use12Hours,
readonly = props.readonly,
placeholder = props.placeholder,
dateFormat = props.dateFormat,
timeFormat = props.timeFormat,
valueFormat = props.valueFormat,
customProps = props.customProps;
var formatSingleValue = function formatSingleValue(value) {
return value && value.isValid() ? value.format(valueFormat) : undefined;
};
var handleChange = function handleChange(value) {
setValue(formatSingleValue(value));
};
var dateTimeFormat = dateFormat + " " + timeFormat;
var renderInput = function renderInput(params) {
return /*#__PURE__*/_react["default"].createElement(_TextField["default"], (0, _extends2["default"])({
size: "small",
variant: "standard"
}, params));
};
var desktopModeMediaQuery = "@media (pointer: fine), (pointer: none)";
var pickerProps = xdpVersion >= 6 ? {
format: dateTimeFormat,
slotProps: {
textField: {
size: "small",
variant: "standard"
},
toolbar: {
toolbarPlaceholder: !readonly ? placeholder : ""
}
}
} : {
inputFormat: dateTimeFormat,
renderInput: renderInput,
toolbarPlaceholder: !readonly ? placeholder : ""
};
var aValue = value ? xdpVersion >= 6 ? moment(value, valueFormat) : value : null;
return /*#__PURE__*/_react["default"].createElement(_FormControl["default"], null, /*#__PURE__*/_react["default"].createElement(_DateTimePicker.DateTimePicker, (0, _extends2["default"])({
desktopModeMediaQuery: desktopModeMediaQuery,
readOnly: readonly,
disabled: readonly,
ampm: !!use12Hours,
value: aValue,
onChange: handleChange
}, pickerProps, customProps)));
};