@wulperstudio/cms/organisms/TabsRedes/TabsRedes.js

Wulper Studio Library Components CMS

import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import React from 'react';
import { Divider } from '@mui/material';
import { v4 } from 'uuid';
import { Root, WrapperTabs, WrapperTab, StyledTabs, TabPanel } from './styled';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var TabsRedes = function TabsRedes(props) {
  var _props$componentsProp;
  var _React$useState = React.useState(0),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    value = _React$useState2[0],
    setValue = _React$useState2[1];
  var handleChange = function handleChange(newValue) {
    setValue(newValue);
  };
  return /*#__PURE__*/_jsxs(Root, {
    children: [props.isVisibleDivider && /*#__PURE__*/_jsx(Divider, {
      sx: {
        borderColor: '#ECECFB'
      }
    }), /*#__PURE__*/_jsx(WrapperTabs, {
      padding: props == null || (_props$componentsProp = props.componentsProps) == null || (_props$componentsProp = _props$componentsProp.root) == null ? void 0 : _props$componentsProp.padding,
      children: /*#__PURE__*/_jsx(StyledTabs, {
        value: value,
        variant: "scrollable",
        scrollButtons: false,
        children: props.data.map(function (_ref, i) {
          var tab = _ref.tab;
          return /*#__PURE__*/_jsx(WrapperTab, {
            onClick: function onClick() {
              return handleChange(i);
            },
            children: typeof tab === 'function' ? tab(i === value) : tab
          }, v4());
        })
      })
    }), props.isVisibleDivider && /*#__PURE__*/_jsx(Divider, {
      sx: {
        borderColor: '#ECECFB'
      }
    }), /*#__PURE__*/_jsx("div", {
      children: props.data.map(function (_ref2, i) {
        var items = _ref2.items;
        return /*#__PURE__*/_jsx(TabPanel, {
          value: value,
          index: i,
          children: items
        }, v4());
      })
    })]
  });
};