@wulperstudio/cms/organisms/GenerateGroups/GenerateGroups.js

Wulper Studio Library Components CMS

/* eslint-disable react/no-array-index-key */
import React, { createElement as _createElement } from 'react';
import { Typography } from '@mui/material';
import { Root, RootSelectors, WrapSelector } from './styled';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var GenerateGroups = function GenerateGroups(_ref) {
  var _ref$position = _ref.position,
    position = _ref$position === void 0 ? 'right' : _ref$position,
    title = _ref.title,
    TitleProps = _ref.TitleProps,
    selectors = _ref.selectors,
    AddComponent = _ref.AddComponent,
    onClickAdd = _ref.onClickAdd,
    onChange = _ref.onChange,
    rootProps = _ref.rootProps,
    rootSelectorsProps = _ref.rootSelectorsProps,
    wrapSelectorProps = _ref.wrapSelectorProps;
  return /*#__PURE__*/_jsxs(Root, Object.assign({}, rootProps, {
    children: [title && /*#__PURE__*/_jsx(Typography, Object.assign({
      fontSize: "14px",
      lineHeight: "18px",
      color: "typography.main"
    }, TitleProps, {
      children: title
    })), /*#__PURE__*/_jsxs(RootSelectors, Object.assign({}, rootSelectorsProps, {
      children: [position === 'left' && /*#__PURE__*/_jsx("div", {
        className: "left",
        onClick: function onClick() {
          if (onClickAdd) onClickAdd();
        },
        children: AddComponent
      }), selectors == null ? void 0 : selectors.map(function (selector, index) {
        return /*#__PURE__*/_createElement(WrapSelector, Object.assign({}, wrapSelectorProps, {
          key: index,
          onClick: function onClick() {
            if (onChange) {
              onChange(index);
            }
          }
        }), selector);
      }), position === 'right' && /*#__PURE__*/_jsx("div", {
        className: "right",
        onClick: function onClick() {
          if (onClickAdd) onClickAdd();
        },
        children: AddComponent
      })]
    }))]
  }));
};
export default GenerateGroups;