@onesy/ui-react 1.0.172 → 1.0.174

package/TableCell/TableCell.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
@@ -19,7 +18,8 @@ var _Divider = _interopRequireDefault(require("../Divider"));
 var _utils2 = require("../utils");
 var _Tooltip = _interopRequireDefault(require("../Tooltip"));
 var _useResize = _interopRequireDefault(require("../useResize"));
-const _excluded = ["tonal", "color", "size", "position", "align", "justify", "noWeight", "sort", "sortedBy", "sortedByDefault", "onSort", "sticky", "stickyPosition", "stickyOffset", "timeout", "disabled", "IconArrow", "IconButtonSortProps", "TypeProps", "DividerProps", "Component", "className", "style", "children"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "tonal", "color", "size", "position", "align", "justify", "noWeight", "sort", "sortedBy", "sortedByDefault", "onSort", "sticky", "stickyPosition", "stickyOffset", "timeout", "disabled", "IconArrow", "IconButtonSortProps", "TypeProps", "DividerProps", "Component", "className", "style", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const useStyle = (0, _styleReact.style)(theme => ({
@@ -127,7 +127,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TableCell'
 });
-const TableCell = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TableCell = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
@@ -137,6 +137,7 @@ const TableCell = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const IconButton = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.IconButton) || _IconButton.default;
   const Divider = (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Divider) || _Divider.default;
   const {
+      ref,
       tonal = true,
       color,
       size = 'regular',
@@ -281,7 +282,7 @@ const TableCell = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     stylesOther[stickyPosition === 'left' ? 'left' : 'right'] = offset + (stickyOffset !== undefined ? stickyOffset : 0);
     if (position === 'head') stylesOther.zIndex = '17';
   }
-  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Component, _objectSpread(_objectSpread({
     ref: item_3 => {
       if (ref) {
         if ((0, _utils.is)('function', ref)) ref(item_3);
@@ -293,31 +294,37 @@ const TableCell = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     role: "cell",
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-root`, `onesy-TableCell-size-${size}`, sticky && `onesy-TableCell-sticky`, stickyPosition && `onesy-TableCell-sticky-position-${stickyPosition}`, stickyActive && `onesy-TableHead-sticky-active`], className, classes.root, position === 'head' ? classes.head : classes.body, noWeight && classes.noWeight, sticky && [classes.sticky, classes[`sticky_${stickyPosition}`]], stickyActive && classes[`stickyActive_${stickyPosition}`]]),
     style: _objectSpread(_objectSpread({}, style), stylesOther)
-  }, other), /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 0,
-    direction: "row",
-    align: align,
-    justify: justify,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-value`], classes.value, classes[`size_${size}`], sort !== undefined && classes.sort])
-  }, (0, _utils.is)('simple', children) ? /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
-    version: "l2",
-    tabIndex: sort !== undefined ? 0 : undefined
-  }, TypeProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-value-type`], TypeProps === null || TypeProps === void 0 ? void 0 : TypeProps.className])
-  }), children) : children && /*#__PURE__*/_react.default.cloneElement(children, {
-    tabIndex: sort !== undefined ? 0 : undefined
-  }), sort && /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-    name: sortedBy === 'asc' ? l('Ascending') : l('Descending')
-  }, /*#__PURE__*/_react.default.createElement(IconButton, {
-    size: "small",
-    onClick: onSort,
-    disabled: disabled,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-sort-icon-button`], classes.sortedBy, classes[`sortedBy_${sortedBy}`]])
-  }, /*#__PURE__*/_react.default.createElement(IconArrow, null)))), /*#__PURE__*/_react.default.createElement(Divider, (0, _extends2.default)({
-    color: "inherit"
-  }, DividerProps, {
-    className: (0, _styleReact.classNames)([DividerProps === null || DividerProps === void 0 ? void 0 : DividerProps.className, classes.divider])
-  })));
-});
+  }, other), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+      gap: 0,
+      direction: "row",
+      align: align,
+      justify: justify,
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-value`], classes.value, classes[`size_${size}`], sort !== undefined && classes.sort]),
+      children: [(0, _utils.is)('simple', children) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, _objectSpread(_objectSpread({
+        version: "l2",
+        tabIndex: sort !== undefined ? 0 : undefined
+      }, TypeProps), {}, {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-value-type`], TypeProps === null || TypeProps === void 0 ? void 0 : TypeProps.className]),
+        children: children
+      })) : children && /*#__PURE__*/_react.default.cloneElement(children, {
+        tabIndex: sort !== undefined ? 0 : undefined
+      }), sort && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+        name: sortedBy === 'asc' ? l('Ascending') : l('Descending'),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, {
+          size: "small",
+          onClick: onSort,
+          disabled: disabled,
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableCell', theme) && [`onesy-TableCell-sort-icon-button`], classes.sortedBy, classes[`sortedBy_${sortedBy}`]]),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconArrow, {})
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Divider, _objectSpread(_objectSpread({
+      color: "inherit"
+    }, DividerProps), {}, {
+      className: (0, _styleReact.classNames)([DividerProps === null || DividerProps === void 0 ? void 0 : DividerProps.className, classes.divider])
+    }))]
+  }));
+};
 TableCell.displayName = 'onesy-TableCell';
 var _default = exports.default = TableCell;

package/TableFooter/TableFooter.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _compilerRuntime = require("react/compiler-runtime");
@@ -13,6 +12,7 @@ var _react = _interopRequireDefault(require("react"));
 var _styleReact = require("@onesy/style-react");
 var _Surface = _interopRequireDefault(require("../Surface"));
 var _utils = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "size", "Component", "className", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -30,9 +30,9 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TableFooter'
 });
-const TableFooter = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TableFooter = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements;
-  const $ = (0, _compilerRuntime.c)(9);
+  const $ = (0, _compilerRuntime.c)(8);
   const theme = (0, _styleReact.useOnesyTheme)();
   const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyTableFooter) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const Surface = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Surface) || _Surface.default;
@@ -54,27 +54,27 @@ const TableFooter = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   } = useStyle();
   const t4 = (0, _styleReact.classNames)([(0, _utils.staticClassName)("TableFooter", theme) && ["onesy-TableFooter-root", `onesy-TableFooter-size-${size}`], className, classes.root, classes[`size_${size}`]]);
   let t5;
-  if ($[0] !== Component || $[1] !== Surface || $[2] !== children || $[3] !== color || $[4] !== other || $[5] !== ref || $[6] !== t4 || $[7] !== tonal) {
-    t5 = /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
-      ref: ref,
+  if ($[0] !== Component || $[1] !== Surface || $[2] !== children || $[3] !== color || $[4] !== other || $[5] !== t4 || $[6] !== tonal) {
+    t5 = /*#__PURE__*/(0, _jsxRuntime.jsx)(Surface, _objectSpread(_objectSpread({
       tonal: tonal,
       color: color,
       Component: Component,
       className: t4
-    }, other), children);
+    }, other), {}, {
+      children: children
+    }));
     $[0] = Component;
     $[1] = Surface;
     $[2] = children;
     $[3] = color;
     $[4] = other;
-    $[5] = ref;
-    $[6] = t4;
-    $[7] = tonal;
-    $[8] = t5;
+    $[5] = t4;
+    $[6] = tonal;
+    $[7] = t5;
   } else {
-    t5 = $[8];
+    t5 = $[7];
   }
   return t5;
-});
+};
 TableFooter.displayName = 'onesy-TableFooter';
 var _default = exports.default = TableFooter;

package/TableHead/TableHead.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
@@ -16,7 +15,8 @@ var _utils2 = require("../utils");
 var _TableRow = _interopRequireDefault(require("../TableRow"));
 var _LinearProgress = _interopRequireDefault(require("../LinearProgress"));
 var _useResize = _interopRequireDefault(require("../useResize"));
-const _excluded = ["tonal", "color", "size", "sticky", "stickyOffset", "timeout", "loading", "LinearGradientProps", "TableRowLoaderProps", "Component", "className", "style", "children"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "tonal", "color", "size", "sticky", "stickyOffset", "timeout", "loading", "LinearGradientProps", "TableRowLoaderProps", "Component", "className", "style", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const useStyle = (0, _styleReact.style)(theme => ({
@@ -47,7 +47,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TableHead'
 });
-const TableHead = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TableHead = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3;
   const theme = (0, _styleReact.useOnesyTheme)();
   const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyTableHead) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
@@ -55,6 +55,7 @@ const TableHead = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const TableRow = (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.TableRow) || _TableRow.default;
   const LinearProgress = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.LinearProgress) || _LinearProgress.default;
   const {
+      ref,
       tonal = true,
       color = 'themed',
       size = 'regular',
@@ -149,7 +150,7 @@ const TableHead = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       };
     }
   }, [timeout, windowWidth, sticky, root]);
-  return /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Surface, _objectSpread(_objectSpread({
     ref: item => {
       if (ref) {
         if ((0, _utils.is)('function', ref)) ref(item);
@@ -164,22 +165,25 @@ const TableHead = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     Component: Component,
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableHead', theme) && [`onesy-TableHead-root`, `onesy-TableHead-size-${size}`, sticky && `onesy-TableHead-sticky`, stickyActive && `onesy-TableHead-sticky-active`], className, classes.root, sticky && classes.sticky, stickyActive && classes.stickyActive]),
     style: _objectSpread(_objectSpread({}, style), styleOther)
-  }, other), _react.default.Children.toArray(children).map((item_0, index) => (/*#__PURE__*/_react.default.cloneElement(item_0, {
-    key: index,
-    tonal: item_0.props.tonal !== undefined ? item_0.props.tonal : tonal,
-    color: item_0.props.color !== undefined ? item_0.props.color : color,
-    size: item_0.props.size !== undefined ? item_0.props.size : size,
-    position: 'head'
-  }))), loading && /*#__PURE__*/_react.default.createElement(TableRow, (0, _extends2.default)({}, TableRowLoaderProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableHead', theme) && [`onesy-TableHead-row-loader`], TableRowLoaderProps === null || TableRowLoaderProps === void 0 ? void 0 : TableRowLoaderProps.className, classes.rowLoader])
-  }), /*#__PURE__*/_react.default.createElement(LinearProgress, (0, _extends2.default)({
-    tonal: true,
-    color: "primary",
-    colspan: "100%",
-    Component: "td"
-  }, LinearGradientProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableHead', theme) && [`onesy-TableHead-td-loader`], LinearGradientProps === null || LinearGradientProps === void 0 ? void 0 : LinearGradientProps.className, classes.tdLoader])
-  }))));
-});
+  }, other), {}, {
+    children: [_react.default.Children.toArray(children).map((item_0, index) => (/*#__PURE__*/_react.default.cloneElement(item_0, {
+      key: index,
+      tonal: item_0.props.tonal !== undefined ? item_0.props.tonal : tonal,
+      color: item_0.props.color !== undefined ? item_0.props.color : color,
+      size: item_0.props.size !== undefined ? item_0.props.size : size,
+      position: 'head'
+    }))), loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(TableRow, _objectSpread(_objectSpread({}, TableRowLoaderProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableHead', theme) && [`onesy-TableHead-row-loader`], TableRowLoaderProps === null || TableRowLoaderProps === void 0 ? void 0 : TableRowLoaderProps.className, classes.rowLoader]),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LinearProgress, _objectSpread(_objectSpread({
+        tonal: true,
+        color: "primary",
+        colspan: "100%",
+        Component: "td"
+      }, LinearGradientProps), {}, {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TableHead', theme) && [`onesy-TableHead-td-loader`], LinearGradientProps === null || LinearGradientProps === void 0 ? void 0 : LinearGradientProps.className, classes.tdLoader])
+      }))
+    }))]
+  }));
+};
 TableHead.displayName = 'onesy-TableHead';
 var _default = exports.default = TableHead;

package/TableHeader/TableHeader.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _compilerRuntime = require("react/compiler-runtime");
@@ -14,6 +13,7 @@ var _styleReact = require("@onesy/style-react");
 var _Line = _interopRequireDefault(require("../Line"));
 var _Surface = _interopRequireDefault(require("../Surface"));
 var _utils = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "size", "Component", "className", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -31,9 +31,9 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TableHeader'
 });
-const TableHeader = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TableHeader = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2;
-  const $ = (0, _compilerRuntime.c)(9);
+  const $ = (0, _compilerRuntime.c)(8);
   const theme = (0, _styleReact.useOnesyTheme)();
   const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyTableHeader) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const Line = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Line) || _Line.default;
@@ -57,27 +57,27 @@ const TableHeader = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const t4 = Surface;
   const t5 = (0, _styleReact.classNames)([(0, _utils.staticClassName)("TableHeader", theme) && ["onesy-TableHeader-root", `onesy-TableHeader-size-${size}`], className, classes.root, classes[`size_${size}`]]);
   let t6;
-  if ($[0] !== Component || $[1] !== children || $[2] !== color || $[3] !== other || $[4] !== ref || $[5] !== t4 || $[6] !== t5 || $[7] !== tonal) {
-    t6 = /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
-      ref: ref,
+  if ($[0] !== Component || $[1] !== children || $[2] !== color || $[3] !== other || $[4] !== t4 || $[5] !== t5 || $[6] !== tonal) {
+    t6 = /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread(_objectSpread({
       tonal: tonal,
       color: color,
       Component: t4,
       className: t5
-    }, other), children);
+    }, other), {}, {
+      children: children
+    }));
     $[0] = Component;
     $[1] = children;
     $[2] = color;
     $[3] = other;
-    $[4] = ref;
-    $[5] = t4;
-    $[6] = t5;
-    $[7] = tonal;
-    $[8] = t6;
+    $[4] = t4;
+    $[5] = t5;
+    $[6] = tonal;
+    $[7] = t6;
   } else {
-    t6 = $[8];
+    t6 = $[7];
   }
   return t6;
-});
+};
 TableHeader.displayName = 'onesy-TableHeader';
 var _default = exports.default = TableHeader;

package/TablePagination/TablePagination.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
@@ -21,6 +20,7 @@ var _Select = _interopRequireDefault(require("../Select"));
 var _ListItem = _interopRequireDefault(require("../ListItem"));
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "version", "elevation", "size", "page", "pageDefault", "onChange", "rowsPerPage", "rowsPerPageDefault", "rowsPerPageOptions", "rowsPerPageText", "onRowsPerPageChange", "total", "first", "before", "next", "last", "IconFirst", "IconBefore", "IconNext", "IconLast", "Component", "className", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -35,7 +35,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TablePagination'
 });
-const TablePagination = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TablePagination = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _theme$elements5;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
@@ -100,58 +100,76 @@ const TablePagination = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
     elevation,
     size
   };
-  return /*#__PURE__*/_react.default.createElement(Line, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, _objectSpread(_objectSpread({
     gap: 3,
     direction: "row",
     justify: "flex-start",
     align: "center",
     Component: Component,
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TablePagination', theme) && [`onesy-TablePagination-root`, `onesy-TablePagination-version-${version}`, `onesy-TablePagination-size-${size}`], className, classes.root])
-  }, other), /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "row",
-    justify: "flex-start",
-    align: "center"
-  }, /*#__PURE__*/_react.default.createElement(Select, {
-    tonal: tonal,
-    color: color,
-    label: rowsPerPageText,
-    size: "small",
-    value: rowsPerPage,
-    onChange: onUpdateRowsPerPage,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TablePagination', theme) && [`onesy-TablePagination-select`], classes.select])
-  }, rowsPerPageOptions.map(item => /*#__PURE__*/_react.default.createElement(ListItem, {
-    key: item,
-    primary: item,
-    value: item,
-    button: true
-  })))), /*#__PURE__*/_react.default.createElement(Type, {
-    version: "b2",
-    gap: 1,
-    direction: "row",
-    justify: "flex-start",
-    align: "center",
-    Component: Line,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TablePagination', theme) && [`onesy-TablePagination-text`], classes.text])
-  }, /*#__PURE__*/_react.default.createElement("span", null, page * rowsPerPage + 1, " - ", (page + 1) * rowsPerPage || total), " ", /*#__PURE__*/_react.default.createElement("span", null, l('of')), " ", /*#__PURE__*/_react.default.createElement("span", null, total)), /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "row",
-    justify: "flex-start",
-    align: "center"
-  }, first && /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: () => update(0),
-    disabled: page === 0
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconFirst, null)), before && /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: () => update((0, _utils.clamp)(page - 1, 0, maxPage)),
-    disabled: page === 0
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconBefore, null)), next && /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: () => update((0, _utils.clamp)(page + 1, 0, maxPage)),
-    disabled: page === maxPage
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconNext, null)), last && /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: () => update(maxPage),
-    disabled: page === maxPage
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconLast, null))));
-});
+  }, other), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+      gap: 1,
+      direction: "row",
+      justify: "flex-start",
+      align: "center",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Select, {
+        tonal: tonal,
+        color: color,
+        label: rowsPerPageText,
+        size: "small",
+        value: rowsPerPage,
+        onChange: onUpdateRowsPerPage,
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TablePagination', theme) && [`onesy-TablePagination-select`], classes.select]),
+        children: rowsPerPageOptions.map(item => /*#__PURE__*/(0, _jsxRuntime.jsx)(ListItem, {
+          primary: item,
+          value: item,
+          button: true
+        }, item))
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Type, {
+      version: "b2",
+      gap: 1,
+      direction: "row",
+      justify: "flex-start",
+      align: "center",
+      Component: Line,
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('TablePagination', theme) && [`onesy-TablePagination-text`], classes.text]),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        children: [page * rowsPerPage + 1, " - ", (page + 1) * rowsPerPage || total]
+      }), " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: l('of')
+      }), " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: total
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+      gap: 1,
+      direction: "row",
+      justify: "flex-start",
+      align: "center",
+      children: [first && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+        onClick: () => update(0),
+        disabled: page === 0
+      }, IconButtonProps), {}, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconFirst, {})
+      })), before && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+        onClick: () => update((0, _utils.clamp)(page - 1, 0, maxPage)),
+        disabled: page === 0
+      }, IconButtonProps), {}, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconBefore, {})
+      })), next && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+        onClick: () => update((0, _utils.clamp)(page + 1, 0, maxPage)),
+        disabled: page === maxPage
+      }, IconButtonProps), {}, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconNext, {})
+      })), last && /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+        onClick: () => update(maxPage),
+        disabled: page === maxPage
+      }, IconButtonProps), {}, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconLast, {})
+      }))]
+    })]
+  }));
+};
 TablePagination.displayName = 'onesy-TablePagination';
 var _default = exports.default = TablePagination;

package/TableRow/TableRow.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _compilerRuntime = require("react/compiler-runtime");
@@ -14,6 +13,7 @@ var _utils = require("@onesy/utils");
 var _styleReact = require("@onesy/style-react");
 var _Surface = _interopRequireDefault(require("../Surface"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "size", "hover", "selected", "position", "Component", "className", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -37,9 +37,9 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-TableRow'
 });
-const TableRow = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const TableRow = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements;
-  const $ = (0, _compilerRuntime.c)(9);
+  const $ = (0, _compilerRuntime.c)(8);
   const theme = (0, _styleReact.useOnesyTheme)();
   const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesyTableRow) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const Surface = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Surface) || _Surface.default;
@@ -75,28 +75,28 @@ const TableRow = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     noWeight: index === 0 && position === "body"
   }) : item);
   let t9;
-  if ($[0] !== Component || $[1] !== Surface || $[2] !== color || $[3] !== other || $[4] !== ref || $[5] !== t7 || $[6] !== t8 || $[7] !== tonal) {
-    t9 = /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
-      ref: ref,
+  if ($[0] !== Component || $[1] !== Surface || $[2] !== color || $[3] !== other || $[4] !== t7 || $[5] !== t8 || $[6] !== tonal) {
+    t9 = /*#__PURE__*/(0, _jsxRuntime.jsx)(Surface, _objectSpread(_objectSpread({
       tonal: tonal,
       color: color,
       role: t6,
       Component: Component,
       className: t7
-    }, other), t8);
+    }, other), {}, {
+      children: t8
+    }));
     $[0] = Component;
     $[1] = Surface;
     $[2] = color;
     $[3] = other;
-    $[4] = ref;
-    $[5] = t7;
-    $[6] = t8;
-    $[7] = tonal;
-    $[8] = t9;
+    $[4] = t7;
+    $[5] = t8;
+    $[6] = tonal;
+    $[7] = t9;
   } else {
-    t9 = $[8];
+    t9 = $[7];
   }
   return t9;
-});
+};
 TableRow.displayName = 'onesy-TableRow';
 var _default = exports.default = TableRow;