@rabex-kit/rabex-ui 0.1.4 → 0.1.6

package/dist/rabex-ui.esm.js

@@ -808,7 +808,6 @@ var typographySizes = {
     weight: 'semiBold'
   }
 };
-// Define icon sizes for different button sizes
 var iconSizes = {
   xs: 16,
   sm: 16,
@@ -816,22 +815,12 @@ var iconSizes = {
   lg: 24,
   xl: 24
 };
-/**
- * Buttons allow users to take actions, and make choices, with a single tap.
- *
- * This is a custom wrapper component made of Material-UI Button.
- *
- * You can read Material-UI Button Documentation [here](https://mui.com/material-ui/api/Button/).
- *
- * ```typescript
- *  import { Button } from '@rabex-kit/core';
- *  ```
- *
- *
- * @param props
- * @returns
- */
-var StyledButton = /*#__PURE__*/styled(MuiButton)(function (_ref) {
+// Styled button with shouldForwardProp to exclude 'isIcon' from DOM
+var StyledButton = /*#__PURE__*/styled(MuiButton, {
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return prop !== 'isIcon';
+  }
+})(function (_ref) {
   var size = _ref.size;
   return {
     display: 'flex',
@@ -847,20 +836,21 @@ var StyledButton = /*#__PURE__*/styled(MuiButton)(function (_ref) {
     }
   };
 });
-var Button = function Button(props) {
+var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$size = props.size,
     size = _props$size === void 0 ? 'md' : _props$size,
     isIcon = props.isIcon,
     children = props.children,
     rest = _objectWithoutPropertiesLoose(props, _excluded$2);
   return React.createElement(StyledButton, Object.assign({
+    ref: ref,
     size: size,
     isIcon: isIcon
   }, rest), isIcon ? children : React.createElement(Typography, {
     variant: typographySizes[size].variant,
     weight: typographySizes[size].weight
   }, children));
-};
+});
 Button.defaultProps = {
   variant: 'contained',
   size: 'md',