@tenancy.nz/ui 1.0.3 → 1.0.5

package/dist/esm/components/Grid.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import MuiGrid from '@mui/material/GridLegacy';
 import { useTheme } from '@mui/material/styles';
@@ -17,22 +16,17 @@ function Grid(_ref) {
     container = _ref$container === void 0 ? false : _ref$container,
     rest = _objectWithoutProperties(_ref, _excluded);
   var theme = useTheme();
-  return marginFix && spacing && container ? /* @__PURE__ */jsx("div", {
+  return marginFix && spacing && container ? /* @__PURE__ */React.createElement("div", {
     style: {
       padding: "".concat(theme.spacing(spacing))
-    },
-    children: /* @__PURE__ */jsx(MuiGrid, _objectSpread2(_objectSpread2({
-      container: true,
-      spacing: spacing
-    }, rest), {}, {
-      children: children
-    }))
-  }) : /* @__PURE__ */jsx(MuiGrid, _objectSpread2(_objectSpread2({
+    }
+  }, /* @__PURE__ */React.createElement(MuiGrid, _objectSpread2({
+    container: true,
+    spacing: spacing
+  }, rest), children)) : /* @__PURE__ */React.createElement(MuiGrid, _objectSpread2({
     spacing: spacing,
     container: container
-  }, rest), {}, {
-    children: children
-  }));
+  }, rest), children);
 }
 Grid.propTypes = {
   /**

package/dist/esm/components/Heading.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import Typography from '@mui/material/Typography';
 
 var _excluded = ["as", "children", "color", "italic", "transform", "weight", "sx"];
@@ -25,14 +24,13 @@ function Heading(_ref) {
   }), transform && {
     textTransform: transform
   });
-  return /* @__PURE__ */jsx(Typography, _objectSpread2(_objectSpread2({}, rest), {}, {
+  return /* @__PURE__ */React.createElement(Typography, _objectSpread2(_objectSpread2({}, rest), {}, {
     color: color,
     component: as,
     variant: as,
     paragraph: false,
-    sx: _objectSpread2(_objectSpread2({}, textStyles), sx),
-    children: children
-  }));
+    sx: _objectSpread2(_objectSpread2({}, textStyles), sx)
+  }), children);
 }
 
 export { Heading as default };

package/dist/esm/components/IconButton.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import StyledIconButton from './IconButton.styled.js';
 
 var _excluded = ["children", "color", "edges", "disabled", "size"];
@@ -18,14 +17,12 @@ function IconButton(_ref) {
   var rest = _objectSpread2({
     size: size
   }, others);
-  return /* @__PURE__ */jsx(StyledIconButton, _objectSpread2(_objectSpread2({
+  return /* @__PURE__ */React.createElement(StyledIconButton, _objectSpread2({
     type: "button",
     color: color,
     edges: edges,
     disabled: disabled
-  }, rest), {}, {
-    children: children
-  }));
+  }, rest), children);
 }
 
 export { IconButton as default };

package/dist/esm/components/Icons.js

@@ -1,7 +1,6 @@
 "use strict";
 import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import styled from 'styled-components';
 import AddCircleIcon from '@mui/icons-material/AddCircle';
 import Heading from './Heading.js';
@@ -11,45 +10,27 @@ import Text from './Text.js';
 var _templateObject;
 var Code = styled.code(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  line-height: 1;\n  margin: 0 2px;\n  padding: 3px 5px;\n  white-space: nowrap;\n  border-radius: 3px;\n  font-size: 13px;\n  border: 1px solid #eeeeee;\n  color: rgba(51, 51, 51, 0.9);\n  background-color: #f8f8f8;\n"])));
 function Icons() {
-  return /* @__PURE__ */jsxs("div", {
-    children: [/* @__PURE__ */jsx(Heading, {
-      as: "h3",
-      children: "Icons"
-    }), /* @__PURE__ */jsxs(Text, {
-      color: "inherit",
-      children: ["This design system uses ", /* @__PURE__ */jsx(Code, {
-        children: "@mui/icons-material"
-      }), ", which includes the 1,100+ official Material icons converted to ", /* @__PURE__ */jsx(Code, {
-        children: "SvgIcon"
-      }), " ", "components."]
-    }), /* @__PURE__ */jsxs(Text, {
-      color: "inherit",
-      children: ["Visit", " ", /* @__PURE__ */jsx(Link, {
-        href: "https://material-ui.com/components/material-icons/",
-        target: "_blank",
-        rel: "noreferrer",
-        children: "Material UI Documentation"
-      }), " ", "for full list and examples."]
-    }), /* @__PURE__ */jsx("br", {}), /* @__PURE__ */jsx(Heading, {
-      as: "h5",
-      children: "Basic usage"
-    }), /* @__PURE__ */jsx(Text, {
-      as: "div",
-      children: /* @__PURE__ */jsx(Code, {
-        children: "import AddCircleIcon from '@mui/icons-material/AddCircle';"
-      })
-    }), /* @__PURE__ */jsx(Text, {
-      as: "div",
-      paragraph: false,
-      children: /* @__PURE__ */jsxs(Fragment, {
-        children: [/* @__PURE__ */jsx(AddCircleIcon, {}), " ", /* @__PURE__ */jsx(Text, {
-          as: "span",
-          paragraph: false,
-          children: "Add Circle Icon"
-        })]
-      })
-    })]
-  });
+  return /* @__PURE__ */React.createElement("div", null, /* @__PURE__ */React.createElement(Heading, {
+    as: "h3"
+  }, "Icons"), /* @__PURE__ */React.createElement(Text, {
+    color: "inherit"
+  }, "This design system uses ", /* @__PURE__ */React.createElement(Code, null, "@mui/icons-material"), ", which includes the 1,100+ official Material icons converted to ", /* @__PURE__ */React.createElement(Code, null, "SvgIcon"), " ", "components."), /* @__PURE__ */React.createElement(Text, {
+    color: "inherit"
+  }, "Visit", " ", /* @__PURE__ */React.createElement(Link, {
+    href: "https://material-ui.com/components/material-icons/",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "Material UI Documentation"), " ", "for full list and examples."), /* @__PURE__ */React.createElement("br", null), /* @__PURE__ */React.createElement(Heading, {
+    as: "h5"
+  }, "Basic usage"), /* @__PURE__ */React.createElement(Text, {
+    as: "div"
+  }, /* @__PURE__ */React.createElement(Code, null, "import AddCircleIcon from '@mui/icons-material/AddCircle';")), /* @__PURE__ */React.createElement(Text, {
+    as: "div",
+    paragraph: false
+  }, /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement(AddCircleIcon, null), " ", /* @__PURE__ */React.createElement(Text, {
+    as: "span",
+    paragraph: false
+  }, "Add Circle Icon"))));
 }
 
 export { Icons as default };

package/dist/esm/components/LinearProgress.js

@@ -1,12 +1,11 @@
 "use strict";
 import { extends as _extends, objectDestructuringEmpty as _objectDestructuringEmpty, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import LinearProgress$1 from '@mui/material/LinearProgress';
 
 function LinearProgress(_ref) {
   var rest = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
-  return /* @__PURE__ */jsx(LinearProgress$1, _objectSpread2({}, rest));
+  return /* @__PURE__ */React.createElement(LinearProgress$1, _objectSpread2({}, rest));
 }
 
 export { LinearProgress as default };

package/dist/esm/components/Link.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { StyledLink } from './Link.styled.js';
 
@@ -17,9 +16,7 @@ function Link(_ref) {
     color: color,
     underline: underline
   }, others);
-  return /* @__PURE__ */jsx(StyledLink, _objectSpread2(_objectSpread2({}, rest), {}, {
-    children: children
-  }));
+  return /* @__PURE__ */React.createElement(StyledLink, _objectSpread2({}, rest), children);
 }
 Link.propTypes = {
   /**

package/dist/esm/components/Media.js

@@ -1,6 +1,5 @@
 "use strict";
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { StyledMediaEl, StyledMediaSkeleton, StyledMedia } from './Media.styled.js';
 
@@ -12,14 +11,12 @@ function Media(_ref) {
     src = _ref.src,
     _ref$title = _ref.title,
     title = _ref$title === void 0 ? "" : _ref$title;
-  return /* @__PURE__ */jsxs(StyledMediaEl, {
-    children: [skeleton && /* @__PURE__ */jsx(StyledMediaSkeleton, {}), /* @__PURE__ */jsx(StyledMedia, {
-      as: as,
-      src: !skeleton ? src : "",
-      title: title,
-      alt: as === "img" ? title : ""
-    })]
-  });
+  return /* @__PURE__ */React.createElement(StyledMediaEl, null, skeleton && /* @__PURE__ */React.createElement(StyledMediaSkeleton, null), /* @__PURE__ */React.createElement(StyledMedia, {
+    as: as,
+    src: !skeleton ? src : "",
+    title: title,
+    alt: as === "img" ? title : ""
+  }));
 }
 Media.propTypes = {
   /**

package/dist/esm/components/Modal.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
 import BaseModal from './BaseModal.js';
 import Heading from './Heading.js';
 import LinearProgress from './LinearProgress.js';
@@ -33,12 +32,11 @@ function Modal(_ref) {
       onClose(e);
     }
   };
-  var header = isString(heading) ? /* @__PURE__ */jsx(Heading, {
+  var header = isString(heading) ? /* @__PURE__ */React.createElement(Heading, {
     as: "h3",
-    gutterBottom: false,
-    children: heading
-  }) : heading;
-  return /* @__PURE__ */jsxs(BaseModal, _objectSpread2(_objectSpread2({}, rest), {}, {
+    gutterBottom: false
+  }, heading) : heading;
+  return /* @__PURE__ */React.createElement(BaseModal, _objectSpread2(_objectSpread2({}, rest), {}, {
     onClose: handleClose,
     slotProps: {
       paper: {
@@ -49,30 +47,25 @@ function Modal(_ref) {
           }
         }
       }
-    },
-    children: [heading && /* @__PURE__ */jsxs(ModalHeader, {
-      onClose: handleClose,
-      children: [loading && /* @__PURE__ */jsx(Skeleton, {
-        variant: "text",
-        height: 20,
-        width: 250
-      }), !loading && header]
-    }), !loading && /* @__PURE__ */jsxs(ModalContent, {
-      disableGutter: true,
-      children: [children, content]
-    }), actions && /* @__PURE__ */jsx(ModalActions, {
-      sx: {
-        marginTop: {
-          xs: "20px",
-          md: "40px"
-        }
-      },
-      children: actions
-    }), loading && /* @__PURE__ */jsx(ModalContent, {
-      disableGutter: true,
-      children: /* @__PURE__ */jsx(LinearProgress, {})
-    })]
-  }));
+    }
+  }), heading && /* @__PURE__ */React.createElement(ModalHeader, {
+    onClose: handleClose
+  }, loading && /* @__PURE__ */React.createElement(Skeleton, {
+    variant: "text",
+    height: 20,
+    width: 250
+  }), !loading && header), !loading && /* @__PURE__ */React.createElement(ModalContent, {
+    disableGutter: true
+  }, children, content), actions && /* @__PURE__ */React.createElement(ModalActions, {
+    sx: {
+      marginTop: {
+        xs: "20px",
+        md: "40px"
+      }
+    }
+  }, actions), loading && /* @__PURE__ */React.createElement(ModalContent, {
+    disableGutter: true
+  }, /* @__PURE__ */React.createElement(LinearProgress, null)));
 }
 
 export { Modal as default };

package/dist/esm/components/ModalActions.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import DialogActions from '@mui/material/DialogActions';
 
 function ModalActions(_ref) {
@@ -16,11 +15,10 @@ function ModalActions(_ref) {
   }, gutter && {
     gap: "8px"
   }), sx);
-  return /* @__PURE__ */jsx(DialogActions, {
+  return /* @__PURE__ */React.createElement(DialogActions, {
     disableSpacing: !gutter,
-    sx: styles,
-    children: children
-  });
+    sx: styles
+  }, children);
 }
 
 export { ModalActions as default };

package/dist/esm/components/ModalContent.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import PropTypes from 'prop-types';
 import DialogContent from '@mui/material/DialogContent';
 
@@ -13,11 +12,10 @@ function ModalContent(_ref) {
   var styles = _objectSpread2(_objectSpread2({}, disableGutter && {
     padding: 0
   }), sx);
-  return /* @__PURE__ */jsx(DialogContent, {
+  return /* @__PURE__ */React.createElement(DialogContent, {
     dividers: false,
-    sx: styles,
-    children: children
-  });
+    sx: styles
+  }, children);
 }
 ModalContent.propTypes = {
   /**

package/dist/esm/components/ModalHeader.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
 import { Close } from '@mui/icons-material';
 import Box from './Box.js';
 import IconButton from './IconButton.js';
@@ -14,22 +13,16 @@ function ModalHeader(_ref) {
     _ref$onClose = _ref.onClose,
     onClose = _ref$onClose === void 0 ? void 0 : _ref$onClose,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /* @__PURE__ */jsxs(StyledModalHeader, _objectSpread2(_objectSpread2({}, rest), {}, {
-    children: [/* @__PURE__ */jsx(Box, {
-      overflow: "hidden",
-      width: "100%",
-      marginRight: "8px",
-      marginLeft: "0px",
-      children: children
-    }), onClose && /* @__PURE__ */jsx(Box, {
-      children: /* @__PURE__ */jsx(IconButton, {
-        color: "inherit",
-        size: "small",
-        onClick: onClose,
-        children: !closeIcon ? /* @__PURE__ */jsx(Close, {}) : closeIcon
-      })
-    })]
-  }));
+  return /* @__PURE__ */React.createElement(StyledModalHeader, _objectSpread2({}, rest), /* @__PURE__ */React.createElement(Box, {
+    overflow: "hidden",
+    width: "100%",
+    marginRight: "8px",
+    marginLeft: "0px"
+  }, children), onClose && /* @__PURE__ */React.createElement(Box, null, /* @__PURE__ */React.createElement(IconButton, {
+    color: "inherit",
+    size: "small",
+    onClick: onClose
+  }, !closeIcon ? /* @__PURE__ */React.createElement(Close, null) : closeIcon)));
 }
 
 export { ModalHeader as default };

package/dist/esm/components/Nameplate.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import Skeleton from '@mui/material/Skeleton';
 import MuiContainer from '@mui/material/Container';
@@ -27,68 +26,44 @@ function Nameplate(_ref) {
   var isMobile = useMediaQuery(function (theme) {
     return theme.breakpoints.down("sm");
   });
-  return /* @__PURE__ */jsx(StyledWrapper, {
-    children: /* @__PURE__ */jsx(MuiContainer, _objectSpread2(_objectSpread2({
-      maxWidth: "lg"
-    }, rest), {}, {
-      children: /* @__PURE__ */jsx(Box, {
-        sx: {
-          display: "flex",
-          justifyContent: "space-between",
-          flexWrap: "nowrap",
-          alignItems: "center",
-          px: isMobile ? 2 : 0,
-          py: 4
-        },
-        children: skeleton ? /* @__PURE__ */jsxs(Fragment, {
-          children: [/* @__PURE__ */jsxs("div", {
-            style: {
-              flexGrow: 1
-            },
-            children: [/* @__PURE__ */jsx(Skeleton, {
-              width: isMobile ? "80%" : "40%",
-              height: isMobile ? 22 : 30
-            }), /* @__PURE__ */jsx(Skeleton, {
-              width: isMobile ? "60%" : "30%",
-              height: isMobile ? 22 : 30
-            })]
-          }), /* @__PURE__ */jsx(Skeleton, {
-            variant: "rect",
-            height: 100,
-            width: 100
-          })]
-        }) : /* @__PURE__ */jsxs(Fragment, {
-          children: [/* @__PURE__ */jsxs("div", {
-            children: [title && /* @__PURE__ */jsxs(Text, {
-              color: "textSecondary",
-              variant: "body1",
-              weight: "600",
-              children: [isMobile && /* @__PURE__ */jsx("small", {
-                children: /* @__PURE__ */jsx("small", {
-                  children: title
-                })
-              }), !isMobile && title]
-            }), /* @__PURE__ */jsxs(Heading, {
-              as: isMobile ? "h5" : "h3",
-              weight: "400",
-              color: "textPrimary",
-              gutterBottom: false,
-              children: [heading, subHeading && /* @__PURE__ */jsxs(Fragment, {
-                children: [/* @__PURE__ */jsx("br", {}), " ", subHeading]
-              })]
-            })]
-          }), /* @__PURE__ */jsxs(StyledImgWrapper, {
-            children: [logo && /* @__PURE__ */jsx(StyledImg, {
-              src: logo,
-              alt: heading
-            }), !logo && heading && /* @__PURE__ */jsx(StyledImgText, {
-              children: heading[0].toUpperCase()
-            })]
-          })]
-        })
-      })
-    }))
-  });
+  return /* @__PURE__ */React.createElement(StyledWrapper, null, /* @__PURE__ */React.createElement(MuiContainer, _objectSpread2({
+    maxWidth: "lg"
+  }, rest), /* @__PURE__ */React.createElement(Box, {
+    sx: {
+      display: "flex",
+      justifyContent: "space-between",
+      flexWrap: "nowrap",
+      alignItems: "center",
+      px: isMobile ? 2 : 0,
+      py: 4
+    }
+  }, skeleton ? /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement("div", {
+    style: {
+      flexGrow: 1
+    }
+  }, /* @__PURE__ */React.createElement(Skeleton, {
+    width: isMobile ? "80%" : "40%",
+    height: isMobile ? 22 : 30
+  }), /* @__PURE__ */React.createElement(Skeleton, {
+    width: isMobile ? "60%" : "30%",
+    height: isMobile ? 22 : 30
+  })), /* @__PURE__ */React.createElement(Skeleton, {
+    variant: "rect",
+    height: 100,
+    width: 100
+  })) : /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement("div", null, title && /* @__PURE__ */React.createElement(Text, {
+    color: "textSecondary",
+    variant: "body1",
+    weight: "600"
+  }, isMobile && /* @__PURE__ */React.createElement("small", null, /* @__PURE__ */React.createElement("small", null, title)), !isMobile && title), /* @__PURE__ */React.createElement(Heading, {
+    as: isMobile ? "h5" : "h3",
+    weight: "400",
+    color: "textPrimary",
+    gutterBottom: false
+  }, heading, subHeading && /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement("br", null), " ", subHeading))), /* @__PURE__ */React.createElement(StyledImgWrapper, null, logo && /* @__PURE__ */React.createElement(StyledImg, {
+    src: logo,
+    alt: heading
+  }), !logo && heading && /* @__PURE__ */React.createElement(StyledImgText, null, heading[0].toUpperCase()))))));
 }
 Nameplate.propTypes = {
   /**

package/dist/esm/components/Pagination.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import uuid from 'react-uuid';
 import usePagination from '@mui/material/usePagination';
@@ -23,7 +22,7 @@ var getLabel = function getLabel(type) {
     return "Next";
   }
   if (type === "start-ellipsis" || type === "end-ellipsis") {
-    return /* @__PURE__ */jsx(MoreHorizIcon, {
+    return /* @__PURE__ */React.createElement(MoreHorizIcon, {
       fontSize: "inherit"
     });
   }
@@ -73,20 +72,16 @@ function Pagination(_ref) {
       showLastButton: showFirstLastButtons
     })),
     items = _usePagination.items;
-  return /* @__PURE__ */jsx(StyledList, {
-    children: items.map(function (item) {
-      return /* @__PURE__ */jsx(StyledListItem, {
-        children: /* @__PURE__ */jsxs(StyledButton, _objectSpread2(_objectSpread2({
-          color: color,
-          shape: shape,
-          size: size,
-          type: item.type
-        }, item), {}, {
-          children: [item.type !== "page" && getLabel(item.type), item.type === "page" && item.page]
-        }))
-      }, uuid(item));
-    })
-  });
+  return /* @__PURE__ */React.createElement(StyledList, null, items.map(function (item) {
+    return /* @__PURE__ */React.createElement(StyledListItem, {
+      key: uuid(item)
+    }, /* @__PURE__ */React.createElement(StyledButton, _objectSpread2({
+      color: color,
+      shape: shape,
+      size: size,
+      type: item.type
+    }, item), item.type !== "page" && getLabel(item.type), item.type === "page" && item.page));
+  }));
 }
 Pagination.propTypes = {
   /**

package/dist/esm/components/Paper.js

@@ -1,5 +1,4 @@
 "use strict";
-import { jsx } from 'react/jsx-runtime';
 import StyledPaper from './Paper.styled.js';
 
 function Paper(_ref) {
@@ -18,16 +17,15 @@ function Paper(_ref) {
     rounded = _ref$rounded === void 0 ? true : _ref$rounded,
     _ref$sx = _ref.sx,
     sx = _ref$sx === void 0 ? {} : _ref$sx;
-  return /* @__PURE__ */jsx(StyledPaper, {
+  return /* @__PURE__ */React.createElement(StyledPaper, {
     elevate: outlined ? false : elevate,
     fill: fill,
     inset: inset,
     outlined: outlined,
     rounded: rounded,
     noOverflow: !overflow,
-    sx: sx,
-    children: children
-  });
+    sx: sx
+  }, children);
 }
 
 export { Paper as default };

package/dist/esm/components/Popper.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
+import React, { forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import MuiPopper from '@mui/material/Popper';
 import MuiFade from '@mui/material/Fade';
@@ -9,7 +8,7 @@ import MuiPaper from '@mui/material/Paper';
 
 var _excluded = ["children", "anchorEl", "open", "disablePortal", "placement"];
 function Popper(_ref, ref) {
-  var _children = _ref.children,
+  var children = _ref.children,
     _ref$anchorEl = _ref.anchorEl,
     anchorEl = _ref$anchorEl === void 0 ? null : _ref$anchorEl,
     _ref$open = _ref.open,
@@ -25,26 +24,23 @@ function Popper(_ref, ref) {
     disablePortal: disablePortal,
     placement: placement
   }, others);
-  return /* @__PURE__ */jsx(MuiPopper, _objectSpread2(_objectSpread2({}, rest), {}, {
+  return /* @__PURE__ */React.createElement(MuiPopper, _objectSpread2(_objectSpread2({}, rest), {}, {
     transition: true,
     ref: ref,
     style: {
       zIndex: 9999
-    },
-    children: function children(_ref2) {
-      var TransitionProps = _ref2.TransitionProps;
-      return /* @__PURE__ */jsx(MuiFade, _objectSpread2(_objectSpread2({}, TransitionProps), {}, {
-        timeout: 350,
-        children: /* @__PURE__ */jsx(MuiPaper, {
-          elevation: 3,
-          style: {
-            margin: 5
-          },
-          children: _children
-        })
-      }));
     }
-  }));
+  }), function (_ref2) {
+    var TransitionProps = _ref2.TransitionProps;
+    return /* @__PURE__ */React.createElement(MuiFade, _objectSpread2(_objectSpread2({}, TransitionProps), {}, {
+      timeout: 350
+    }), /* @__PURE__ */React.createElement(MuiPaper, {
+      elevation: 3,
+      style: {
+        margin: 5
+      }
+    }, children));
+  });
 }
 Popper.propTypes = {
   /**