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

Wulper Studio Library Components CMS

import React from 'react';
import { Tabs, styled } from '@mui/material';
import { jsx as _jsx } from "react/jsx-runtime";
export var StyledTabs = styled(Tabs)({
  '& ': {
    minHeight: '44px',
    width: '100%',
    maxWidth: '100%',
    overflowX: 'auto'
  },
  '& div ': {
    display: 'flex',
    gap: '15px',
    padding: '5px 0',
    '& *': {
      flexGrow: 0
    }
  },
  '& .MuiTabs-indicator': {
    display: 'none',
    backgroundColor: 'transparent'
  }
});
var RootPanel = styled('div', {
  shouldForwardProp: function shouldForwardProp(prop) {
    return prop !== 'index' && prop !== 'value';
  }
})(function (_ref) {
  var value = _ref.value,
    index = _ref.index;
  return {
    width: '100%',
    height: value === index ? '100%' : 0,
    maxWidth: '100%',
    overflowY: 'auto'
  };
});
export var TabPanel = function TabPanel(props) {
  var children = props.children,
    value = props.value,
    index = props.index;
  return /*#__PURE__*/_jsx(RootPanel, {
    value: value,
    index: index,
    children: value === index && children
  });
};
export var WrapperTabs = styled('div', {
  shouldForwardProp: function shouldForwardProp(prop) {
    return prop !== 'padding';
  }
})(function (_ref2) {
  var padding = _ref2.padding;
  return {
    width: '100%',
    maxWidth: '100%',
    backgroundColor: 'transparent',
    marginTop: '0px',
    marginBottom: '0px',
    padding: padding || '15px 0',
    position: 'relative',
    overflowX: 'auto'
  };
});
export var Root = styled('div')({
  display: 'grid',
  gridTemplateRows: 'auto 1fr',
  height: '100%'
});
export var WrapperTab = styled('div', {
  shouldForwardProp: function shouldForwardProp(prop) {
    return prop !== 'textColor' && prop !== 'value';
  }
})(function () {
  return {
    cursor: 'pointer'
  };
});