@react-awesome-query-builder/mui/esm/widgets/core/MuiConjs.js

User-friendly query builder for React. MUI 5 widgets

import _extends from "@babel/runtime/helpers/extends";
import React, { useCallback } from "react";
import FormControl from "@mui/material/FormControl";
import ButtonGroup from "@mui/material/ButtonGroup";
import Button from "@mui/material/Button";
var Conj = /*#__PURE__*/React.memo(function (_ref) {
  var conjKey = _ref.conjKey,
    id = _ref.id,
    name = _ref.name,
    label = _ref.label,
    checked = _ref.checked,
    setConjunction = _ref.setConjunction,
    readonly = _ref.readonly,
    disabled = _ref.disabled;
  var onClick = useCallback(function () {
    setConjunction(conjKey);
  }, [conjKey, setConjunction]);
  var postfix = setConjunction.isDummyFn ? "__dummy" : "";
  if ((readonly || disabled) && !checked) {
    return null;
  }
  return /*#__PURE__*/React.createElement(Button, {
    key: id + postfix,
    id: id + postfix,
    color: "primary",
    disableElevation: true,
    variant: checked ? "contained" : "outlined",
    sx: {
      backgroundColor: checked ? "primary.main" : "background.paper"
    },
    value: conjKey,
    onClick: onClick,
    disabled: readonly || disabled
  }, label);
});
var Conjs = /*#__PURE__*/React.memo(function (_ref2) {
  var id = _ref2.id,
    not = _ref2.not,
    setNot = _ref2.setNot,
    conjunctionOptions = _ref2.conjunctionOptions,
    setConjunction = _ref2.setConjunction,
    disabled = _ref2.disabled,
    readonly = _ref2.readonly,
    config = _ref2.config,
    showNot = _ref2.showNot,
    notLabel = _ref2.notLabel;
  //TIP: disabled=true if only 1 rule; readonly=true if immutable mode
  var conjsCount = Object.keys(conjunctionOptions).length;
  var lessThenTwo = disabled;
  var _config$settings = config.settings,
    forceShowConj = _config$settings.forceShowConj,
    renderSize = _config$settings.renderSize;
  var showConj = forceShowConj || conjsCount > 1 && !lessThenTwo;
  var renderOptions = function renderOptions() {
    return Object.keys(conjunctionOptions).map(function (conjKey) {
      var _conjunctionOptions$c = conjunctionOptions[conjKey],
        id = _conjunctionOptions$c.id,
        name = _conjunctionOptions$c.name,
        label = _conjunctionOptions$c.label,
        checked = _conjunctionOptions$c.checked;
      var conjProps = {
        conjKey: conjKey,
        id: id,
        name: name,
        label: label,
        checked: checked,
        setConjunction: setConjunction,
        readonly: readonly,
        disabled: disabled
      };
      if (disabled && !checked) {
        return null;
      }
      return /*#__PURE__*/React.createElement(Conj, _extends({
        key: id
      }, conjProps));
    });
  };
  var onNotClick = useCallback(function () {
    setNot(!not);
  }, [not, setNot]);
  var renderNot = function renderNot() {
    if (readonly && !not) return null;
    return /*#__PURE__*/React.createElement(Button, {
      size: renderSize,
      key: id,
      id: id + "__not",
      color: "error",
      disableElevation: true,
      variant: not ? "contained" : "outlined",
      sx: {
        backgroundColor: not ? "error.main" : "background.paper"
      },
      onClick: onNotClick,
      disabled: readonly
    }, notLabel || "NOT");
  };
  return /*#__PURE__*/React.createElement(FormControl, null, /*#__PURE__*/React.createElement(ButtonGroup, {
    disableElevation: true,
    size: renderSize,
    disabled: readonly,
    sx: {
      marginLeft: "1px"
    }
  }, showNot && renderNot(), showConj && renderOptions()));
});
export default Conjs;