@pinuts/bsr-uikit-relaunch/dist/items/eventWizardItems/EventPicker/EventPicker.js

BSR UI-KIT Relaunch

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var PropTypes = _interopRequireWildcard(require("prop-types"));
var _formBuilder = require("@pinuts/form-builder");
var _Alert = _interopRequireDefault(require("react-bootstrap/Alert"));
var _RadioField = _interopRequireDefault(require("./Components/RadioField.jsx"));
var _CheckboxField = _interopRequireDefault(require("./Components/CheckboxField.jsx"));
var _PickerFieldsetLegend = _interopRequireDefault(require("../shared/PickerFieldsetLegend.jsx"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const {
  useFormikContext
} = _formBuilder.formik;
const EventPicker = _ref => {
  let {
    config
  } = _ref;
  const {
    key: id,
    singleSelection,
    singleSelectionCheckbox,
    inputProps = {},
    name = '',
    sortAlphabetically = false
  } = config;
  const {
    events,
    headline,
    className,
    locationSelectLink
  } = inputProps;
  let renderedEvents = [];
  const fieldSetClassName = _formBuilder.utils.getClassNames([className, 'event-picker']);
  const {
    errorMsgId
  } = config;
  const usedErrorMsgId = errorMsgId || id;
  const {
    errors
  } = useFormikContext();
  const errorMsg = errors[usedErrorMsgId];
  const groupName = name || id;
  if (sortAlphabetically) {
    events.sort((a, b) => a.header.localeCompare(b.header));
  }
  if (singleSelection && !singleSelectionCheckbox) {
    renderedEvents = events.map(_ref2 => {
      let {
        header,
        infoLine1,
        infoLine2,
        subtext,
        eventId,
        event,
        bookable = true
      } = _ref2;
      const curEventId = eventId || event;
      return /*#__PURE__*/_react.default.createElement(_RadioField.default, {
        key: curEventId,
        config: {
          name: groupName,
          value: curEventId,
          header,
          infoLine1,
          infoLine2,
          subtext,
          id,
          disabled: !bookable
        }
      });
    });
  } else {
    renderedEvents = events.map(_ref3 => {
      let {
        eventId,
        event,
        header,
        infobadge,
        subtitle,
        required,
        isPreselected,
        isDeselectable
      } = _ref3;
      return /*#__PURE__*/_react.default.createElement(_CheckboxField.default, {
        key: eventId || event,
        config: {
          name: groupName,
          value: eventId || event,
          header,
          infobadge,
          subtitle,
          required,
          singleSelectionCheckbox,
          isPreselected: isPreselected,
          isDeselectable: isDeselectable
        }
      });
    });
  }

  // TODO Fielset mit legend
  // alles in ein fieldset packen
  // https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/examples/checkbox-mixed/
  return /*#__PURE__*/_react.default.createElement("fieldset", {
    className: fieldSetClassName
  }, /*#__PURE__*/_react.default.createElement(_PickerFieldsetLegend.default, {
    groupName: groupName,
    headline: headline,
    infoText: inputProps.infoText,
    infoButton: inputProps.infoButton,
    locationSelectLink: locationSelectLink
  }), errorMsg && /*#__PURE__*/_react.default.createElement(_Alert.default, {
    variant: "danger"
  }, errorMsg), renderedEvents.length > 0 ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("ul", {
    className: "checkboxes picker-list"
  }, renderedEvents)) : /*#__PURE__*/_react.default.createElement("h4", null, "Keine Veranstaltungen an diesem Termin w\xE4hlbar"));
};
EventPicker.propTypes = {
  config: PropTypes.shape({
    className: PropTypes.string,
    key: PropTypes.string.isRequired,
    singleSelection: PropTypes.bool,
    singleSelectionCheckbox: PropTypes.bool,
    sortAlphabetically: PropTypes.bool,
    inputProps: PropTypes.shape({
      events: PropTypes.arrayOf(PropTypes.shape({
        header: PropTypes.string,
        infoLine1: PropTypes.string,
        infoLine2: PropTypes.string,
        subtext: PropTypes.string,
        eventId: PropTypes.string,
        event: PropTypes.string,
        bookable: PropTypes.bool
      })),
      headline: PropTypes.string,
      className: PropTypes.string,
      infoText: PropTypes.string,
      infoButton: PropTypes.bool,
      locationSelectLink: PropTypes.string
    }),
    errorMsgId: PropTypes.string,
    name: PropTypes.string
  })
};
var _default = exports.default = EventPicker;
(0, _formBuilder.registerComponent)('EventPicker', EventPicker);