UNPKG

@react-awesome-query-builder/mui

Version:
83 lines (82 loc) 3.63 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = void 0; var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); var _react = _interopRequireDefault(require("react")); var _IconButton = _interopRequireDefault(require("@mui/material/IconButton")); var _ExpandMoreSharp = _interopRequireDefault(require("@mui/icons-material/ExpandMoreSharp")); var _FormControl = _interopRequireDefault(require("@mui/material/FormControl")); var _FormLabel = _interopRequireDefault(require("@mui/material/FormLabel")); var _Menu = _interopRequireDefault(require("@mui/material/Menu")); var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem")); var _Check = _interopRequireDefault(require("@mui/icons-material/Check")); var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon")); var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText")); var _default = function _default(_ref) { var valueSources = _ref.valueSources, valueSrc = _ref.valueSrc, title = _ref.title, setValueSrc = _ref.setValueSrc, readonly = _ref.readonly; var _React$useState = _react["default"].useState(null), _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2), anchorEl = _React$useState2[0], setAnchorEl = _React$useState2[1]; var handleOpen = function handleOpen(event) { setAnchorEl(event.currentTarget); }; var handleClose = function handleClose() { setAnchorEl(null); }; var toggleOpenClose = function toggleOpenClose(event) { anchorEl ? handleClose() : handleOpen(event); }; var handleChange = function handleChange(_e, srcKey) { setValueSrc(srcKey); handleClose(); }; var renderOptions = function renderOptions(valueSources) { return valueSources.map(function (_ref2) { var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2), srcKey = _ref3[0], info = _ref3[1]; var isSelected = valueSrc == srcKey || !valueSrc && srcKey == "value"; var onClick = function onClick(e) { return handleChange(e, srcKey); }; return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], { key: srcKey, value: srcKey, selected: isSelected, onClick: onClick }, !isSelected && /*#__PURE__*/_react["default"].createElement(_ListItemText["default"], { inset: true }, info.label), isSelected && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_ListItemIcon["default"], null, /*#__PURE__*/_react["default"].createElement(_Check["default"], null)), info.label)); }); }; var open = Boolean(anchorEl); return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_IconButton["default"], { size: "small", onClick: toggleOpenClose }, /*#__PURE__*/_react["default"].createElement(_ExpandMoreSharp["default"], null)), /*#__PURE__*/_react["default"].createElement(_Menu["default"], { anchorEl: anchorEl, open: open, onClose: handleClose }, /*#__PURE__*/_react["default"].createElement(_FormControl["default"], { component: "fieldset", sx: { p: 0 } }, /*#__PURE__*/_react["default"].createElement(_FormLabel["default"], { component: "legend", sx: { p: 2, pt: 0, pb: 1 } }, title), renderOptions(valueSources)))); }; exports["default"] = _default;