@onesy/ui-react 1.0.172 → 1.0.174

package/Move/Move.js

@@ -5,14 +5,14 @@ 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"));
 var _utils = require("@onesy/utils");
 var _styleReact = require("@onesy/style-react");
 var _utils2 = require("../utils");
-const _excluded = ["version", "manage", "manageLevel", "disabled", "onMouseDown", "onTouchStart", "Component", "className", "style", "children"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "version", "manage", "manageLevel", "disabled", "onMouseDown", "onTouchStart", "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 => ({
@@ -23,7 +23,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-Move'
 });
-const Move = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const Move = props_ => {
   var _theme$ui, _theme$ui2;
   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.onesyMove) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
@@ -31,6 +31,7 @@ const Move = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     classes
   } = useStyle();
   const {
+      ref,
       version = 'regular',
       manage = false,
       manageLevel = 0,
@@ -153,7 +154,7 @@ const Move = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       rootDocument.removeEventListener('touchmove', onTouchMove);
     };
   }, []);
-  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread(_objectSpread({
     ref: item_0 => {
       if (ref) {
         if ((0, _utils.is)('function', ref)) ref(item_0);else ref.current = item_0;
@@ -164,7 +165,9 @@ const Move = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     onTouchStart: onTouchStart,
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Move', theme) && ['onesy-Move-root'], className, classes.root]),
     style: _objectSpread(_objectSpread({}, styles.root), style)
-  }, other), children);
-});
+  }, other), {}, {
+    children: children
+  }));
+};
 Move.displayName = 'onesy-Move';
 var _default = exports.default = Move;

package/NavigationBar/NavigationBar.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");
@@ -15,6 +14,7 @@ var _styleReact = require("@onesy/style-react");
 var _Line = _interopRequireDefault(require("../Line"));
 var _Surface = _interopRequireDefault(require("../Surface"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["color", "tonal", "version", "value", "valueDefault", "onChange", "fixed", "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; }
@@ -32,7 +32,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NavigationBar'
 });
-const NavigationBar = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NavigationBar = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2;
   const $ = (0, _compilerRuntime.c)(4);
   const theme = (0, _styleReact.useOnesyTheme)();
@@ -146,8 +146,7 @@ const NavigationBar = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       }
     }));
   });
-  return /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Surface, _objectSpread(_objectSpread({
     Component: Line,
     color: color,
     tonal: tonal,
@@ -157,7 +156,9 @@ const NavigationBar = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     gap: 1,
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationBar", theme) && ["onesy-NavigationBar-root"], className, classes.root, fixed && classes.fixed]),
     style: _objectSpread(_objectSpread({}, style), styles.root)
-  }, other), children);
-});
+  }, other), {}, {
+    children: children
+  }));
+};
 NavigationBar.displayName = 'onesy-NavigationBar';
 var _default = exports.default = NavigationBar;

package/NavigationDrawer/NavigationDrawer.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"));
@@ -15,6 +14,7 @@ var _Modal = _interopRequireDefault(require("../Modal"));
 var _Slide = _interopRequireDefault(require("../Slide"));
 var _useSwipe = _interopRequireDefault(require("../useSwipe"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "version", "open", "openDefault", "position", "direction", "swipe", "swipeTouchAnywhere", "swipeBackgroundFollow", "min", "removeOnExited", "onClose", "TransitionComponentProps", "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; }
@@ -87,7 +87,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NavigationDrawer'
 });
-const NavigationDrawer = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NavigationDrawer = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _swipeValue, _swipeValue2;
   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.onesyNavigationDrawer) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
@@ -218,8 +218,7 @@ const NavigationDrawer = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
     other.openDefault = false;
     TransitionComponentProps.min = TransitionComponentProps.min !== undefined ? TransitionComponentProps.min : min;
   }
-  return /*#__PURE__*/_react.default.createElement(Modal, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Modal, _objectSpread(_objectSpread({
     open: open,
     mainRef: refs.modal,
     backgroundRef: refs.background,
@@ -237,7 +236,9 @@ const NavigationDrawer = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
     Component: Component,
     portal: position === 'fixed',
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationDrawer', theme) && ['onesy-NavigationDrawer-root'], className, classes.root, classes[`position_${position}`], classes[`direction_${direction}`], classes[`version_${version}`], classes[`version_${version}_position_${position}`]])
-  }, other), children);
-});
+  }, other), {}, {
+    children: children
+  }));
+};
 NavigationDrawer.displayName = 'onesy-NavigationDrawer';
 var _default = exports.default = NavigationDrawer;

package/NavigationItem/NavigationItem.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 _Line = _interopRequireDefault(require("../Line"));
 var _Tooltip = _interopRequireDefault(require("../Tooltip"));
 var _Transition = _interopRequireDefault(require("../Transition"));
 var _utils2 = require("../utils");
-const _excluded = ["tonal", "color", "version", "value", "name", "nameTooltip", "vertical", "icon", "iconSelected", "selected", "disabled", "IconWrapperComponent", "onFocus", "onBlur", "onKeyDown", "onMouseDown", "onMouseEnter", "onMouseLeave", "onTouchStart", "TooltipProps", "LabelProps", "IconWrapperProps", "className", "style", "children"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "tonal", "color", "version", "value", "name", "nameTooltip", "vertical", "icon", "iconSelected", "selected", "disabled", "IconWrapperComponent", "onFocus", "onBlur", "onKeyDown", "onMouseDown", "onMouseEnter", "onMouseLeave", "onTouchStart", "TooltipProps", "LabelProps", "IconWrapperProps", "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 => ({
@@ -109,7 +109,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NavigationItem'
 });
-const NavigationItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NavigationItem = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _ref;
   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.onesyNavigationItem) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
@@ -118,6 +118,7 @@ const NavigationItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const Tooltip = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Tooltip) || _Tooltip.default;
   const Transition = (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Transition) || _Transition.default;
   const {
+      ref,
       tonal = true,
       color = 'primary',
       version = 'regular',
@@ -229,7 +230,7 @@ const NavigationItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     styles.icon.color = styles.label.color = theme.methods.palette.color.value(color, 5, true, palette);
   }
   const Icon = selected && iconSelected || icon;
-  return /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
     name: (_ref = nameTooltip !== null && nameTooltip !== void 0 ? nameTooltip : name) !== null && _ref !== void 0 ? _ref : value,
     position: "top",
     alignment: "center",
@@ -237,49 +238,58 @@ const NavigationItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     touch: false,
     hover: false,
     focus: false
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
-    tabIndex: !disabled ? 0 : undefined,
-    onFocus: onFocus,
-    onBlur: onBlur,
-    onKeyDown: onKeyDown,
-    onTouchStart: onTouchStart,
-    onMouseDown: onMouseDown,
-    onMouseEnter: onMouseEnter,
-    onMouseLeave: onMouseLeave,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-root', selected && 'onesy-NavigationItem-selected', hover && `onesy-NavigationItem-hover`, mouseDown && `onesy-NavigationItem-mouse-down`, focus && `onesy-NavigationItem-focus`, disabled && `onesy-NavigationItem-disabled`], className, classes.root, vertical && classes.vertical, disabled && classes.disabled]),
-    style: _objectSpread({}, style)
-  }, other), /*#__PURE__*/_react.default.createElement(Line, {
-    ref: item => {
-      if (ref) {
-        if ((0, _utils.is)('function', ref)) ref(item);else ref.current = item;
-      }
-      refs.root.current = item;
-    },
-    direction: "column",
-    align: "center",
-    justify: "center",
-    gap: 0.25,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-item'], classes.item])
-  }, Icon && /*#__PURE__*/_react.default.createElement(Line, {
-    Component: "span",
-    align: "center",
-    justify: "center",
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-icon-wrapper'], classes.iconWrapper, ['none', 'auto'].includes(version) && classes.iconWrapper_center, ['auto'].includes(version) && selected && classes.iconWrapper_center_selected])
-  }, /*#__PURE__*/_react.default.createElement(Transition, {
-    in: hover || focus || selected
-  }, status => /*#__PURE__*/_react.default.createElement("span", {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-indicator'], classes.indicator, classes[`indicator_${status}`], selected && classes.indicator_selected, hover && classes.indicator_hover, focus && classes.indicator_focus, mouseDown && classes.indicator_pressed]),
-    style: styles.indicator
-  })), /*#__PURE__*/_react.default.createElement(IconWrapperComponent, (0, _extends2.default)({}, IconWrapperProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-icon'], IconWrapperProps === null || IconWrapperProps === void 0 ? void 0 : IconWrapperProps.className, classes.icon])
-  }), /*#__PURE__*/_react.default.cloneElement(Icon, {
-    style: _objectSpread(_objectSpread({}, Icon.props.style), styles.icon)
-  }))), (version === 'regular' || version === 'auto' && selected) && /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
-    version: "b3"
-  }, LabelProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-label', LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className]]),
-    style: _objectSpread(_objectSpread({}, styles.label), LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.style)
-  }), name))));
-});
+  }, TooltipProps), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", _objectSpread(_objectSpread({
+      tabIndex: !disabled ? 0 : undefined,
+      onFocus: onFocus,
+      onBlur: onBlur,
+      onKeyDown: onKeyDown,
+      onTouchStart: onTouchStart,
+      onMouseDown: onMouseDown,
+      onMouseEnter: onMouseEnter,
+      onMouseLeave: onMouseLeave,
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-root', selected && 'onesy-NavigationItem-selected', hover && `onesy-NavigationItem-hover`, mouseDown && `onesy-NavigationItem-mouse-down`, focus && `onesy-NavigationItem-focus`, disabled && `onesy-NavigationItem-disabled`], className, classes.root, vertical && classes.vertical, disabled && classes.disabled]),
+      style: _objectSpread({}, style)
+    }, other), {}, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+        ref: item => {
+          if (ref) {
+            if ((0, _utils.is)('function', ref)) ref(item);else ref.current = item;
+          }
+          refs.root.current = item;
+        },
+        direction: "column",
+        align: "center",
+        justify: "center",
+        gap: 0.25,
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-item'], classes.item]),
+        children: [Icon && /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+          Component: "span",
+          align: "center",
+          justify: "center",
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-icon-wrapper'], classes.iconWrapper, ['none', 'auto'].includes(version) && classes.iconWrapper_center, ['auto'].includes(version) && selected && classes.iconWrapper_center_selected]),
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Transition, {
+            in: hover || focus || selected,
+            children: status => /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-indicator'], classes.indicator, classes[`indicator_${status}`], selected && classes.indicator_selected, hover && classes.indicator_hover, focus && classes.indicator_focus, mouseDown && classes.indicator_pressed]),
+              style: styles.indicator
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconWrapperComponent, _objectSpread(_objectSpread({}, IconWrapperProps), {}, {
+            className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-icon'], IconWrapperProps === null || IconWrapperProps === void 0 ? void 0 : IconWrapperProps.className, classes.icon]),
+            children: /*#__PURE__*/_react.default.cloneElement(Icon, {
+              style: _objectSpread(_objectSpread({}, Icon.props.style), styles.icon)
+            })
+          }))]
+        }), (version === 'regular' || version === 'auto' && selected) && /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, _objectSpread(_objectSpread({
+          version: "b3"
+        }, LabelProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NavigationItem', theme) && ['onesy-NavigationItem-label', LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className]]),
+          style: _objectSpread(_objectSpread({}, styles.label), LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.style),
+          children: name
+        }))]
+      })
+    }))
+  }));
+};
 NavigationItem.displayName = 'onesy-NavigationItem';
 var _default = exports.default = NavigationItem;

package/NavigationRail/NavigationRail.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");
@@ -17,6 +16,7 @@ var _Surface = _interopRequireDefault(require("../Surface"));
 var _Divider = _interopRequireDefault(require("../Divider"));
 var _NavigationBar = _interopRequireDefault(require("../NavigationBar"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "version", "size", "value", "valueDefault", "onChange", "justify", "border", "header", "fixed", "NavigationBarProps", "DividerProps", "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; }
@@ -66,7 +66,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NavigationRail'
 });
-const NavigationRail = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NavigationRail = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4;
   const $ = (0, _compilerRuntime.c)(4);
   const theme = (0, _styleReact.useOnesyTheme)();
@@ -175,8 +175,7 @@ const NavigationRail = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       }
     }));
   });
-  return /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Surface, _objectSpread(_objectSpread({
     Component: Line,
     color: color,
     tonal: tonal,
@@ -186,23 +185,27 @@ const NavigationRail = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     gap: 0,
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-root", `onesy-NavigationRail-version-${version}`, `onesy-NavigationRail-size-${size}`], className, classes.root, classes[`size_${size}`], fixed && classes.fixed]),
     style: _objectSpread(_objectSpread({}, style), styles.root)
-  }, other), header && /*#__PURE__*/_react.default.createElement(Line, {
-    align: "center",
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-header"], classes.header])
-  }, header), children && /*#__PURE__*/_react.default.createElement(NavigationBar, (0, _extends2.default)({
-    version: version,
-    direction: "column",
-    justify: justify,
-    gap: 2,
-    color: color,
-    tonal: tonal
-  }, NavigationBarProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-main"], NavigationBarProps === null || NavigationBarProps === void 0 ? void 0 : NavigationBarProps.className, classes.main])
-  }), children), border && /*#__PURE__*/_react.default.createElement(Divider, (0, _extends2.default)({
-    orientation: "vertical"
-  }, DividerProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-divider"], DividerProps === null || DividerProps === void 0 ? void 0 : DividerProps.className, classes.divider])
-  })));
-});
+  }, other), {}, {
+    children: [header && /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+      align: "center",
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-header"], classes.header]),
+      children: header
+    }), children && /*#__PURE__*/(0, _jsxRuntime.jsx)(NavigationBar, _objectSpread(_objectSpread({
+      version: version,
+      direction: "column",
+      justify: justify,
+      gap: 2,
+      color: color,
+      tonal: tonal
+    }, NavigationBarProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-main"], NavigationBarProps === null || NavigationBarProps === void 0 ? void 0 : NavigationBarProps.className, classes.main]),
+      children: children
+    })), border && /*#__PURE__*/(0, _jsxRuntime.jsx)(Divider, _objectSpread(_objectSpread({
+      orientation: "vertical"
+    }, DividerProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("NavigationRail", theme) && ["onesy-NavigationRail-divider"], DividerProps === null || DividerProps === void 0 ? void 0 : DividerProps.className, classes.divider])
+    }))]
+  }));
+};
 NavigationRail.displayName = 'onesy-NavigationRail';
 var _default = exports.default = NavigationRail;

package/NotFound/NotFound.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,6 +15,7 @@ var _Section = _interopRequireDefault(require("../Section"));
 var _Type = _interopRequireDefault(require("../Type"));
 var _Button = _interopRequireDefault(require("../Button"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["name", "to", "link", "renderButton", "fullHeight", "start", "end", "buttonText", "ButtonProps", "TypeProps", "className"];
 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; }
@@ -27,7 +27,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NotFound'
 });
-const NotFound = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NotFound = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
@@ -56,26 +56,29 @@ const NotFound = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const onTo = () => {
     if (link) window.open(link, 'blank');else navigate(to);
   };
-  return /*#__PURE__*/_react.default.createElement(Section, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Section, _objectSpread(_objectSpread({
     flex: true,
     fullWidth: true,
     align: "center",
     justify: "center",
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NotFound', theme) && [`onesy-NotFound-root`], className, classes.root, fullHeight && classes.fullHeight])
-  }, other), start, /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
-    version: "h3",
-    align: "center"
-  }, TypeProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NotFound', theme) && [`onesy-NotFound-type`], TypeProps === null || TypeProps === void 0 ? void 0 : TypeProps.className])
-  }), name), (0, _utils.is)('function', renderButton) ? renderButton({}) : /*#__PURE__*/_react.default.createElement(Button, (0, _extends2.default)({
-    color: "default",
-    version: "outlined",
-    size: "small",
-    onClick: onTo
-  }, ButtonProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NotFound', theme) && [`onesy-NotFound-button`], ButtonProps === null || ButtonProps === void 0 ? void 0 : ButtonProps.className, classes.button])
-  }), buttonText), end);
-});
+  }, other), {}, {
+    children: [start, /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, _objectSpread(_objectSpread({
+      version: "h3",
+      align: "center"
+    }, TypeProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NotFound', theme) && [`onesy-NotFound-type`], TypeProps === null || TypeProps === void 0 ? void 0 : TypeProps.className]),
+      children: name
+    })), (0, _utils.is)('function', renderButton) ? renderButton({}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Button, _objectSpread(_objectSpread({
+      color: "default",
+      version: "outlined",
+      size: "small",
+      onClick: onTo
+    }, ButtonProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NotFound', theme) && [`onesy-NotFound-button`], ButtonProps === null || ButtonProps === void 0 ? void 0 : ButtonProps.className, classes.button]),
+      children: buttonText
+    })), end]
+  }));
+};
 NotFound.displayName = 'onesy-NotFound';
 var _default = exports.default = NotFound;

package/NumericTextField/NumericTextField.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 _IconMaterialKeyboardArrowDownW = _interopRequireDefault(require("@onesy/ico
 var _AdvancedTextField = _interopRequireDefault(require("../AdvancedTextField"));
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 var _utils2 = require("../utils");
-const _excluded = ["valueDefault", "value", "onChange", "version", "size", "min", "max", "increment", "decrement", "incrementValue", "decrementValue", "onFocus", "onBlur", "IconIncrement", "IconDecrement", "IconButtonProps", "IconProps", "className"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "valueDefault", "value", "onChange", "version", "size", "min", "max", "increment", "decrement", "incrementValue", "decrementValue", "onFocus", "onBlur", "IconIncrement", "IconDecrement", "IconButtonProps", "IconProps", "className"];
 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 => ({
@@ -24,13 +24,14 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-NumericTextField'
 });
-const NumericTextField = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const NumericTextField = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2;
   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.onesyNumericTextField) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const AdvancedTextField = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.AdvancedTextField) || _AdvancedTextField.default;
   const IconButton = (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.IconButton) || _IconButton.default;
   const {
+      ref,
       valueDefault,
       value: value_,
       onChange: onChange_,
@@ -177,13 +178,17 @@ const NumericTextField = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
     size: 24,
     fontSize: '1.5rem'
   };
-  if (decrement) end.push(/*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
+  if (decrement) end.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread(_objectSpread({
     onClick: onDecrement
-  }, iconButtonProps, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconDecrement, IconProps)));
-  if (increment) end.push(/*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
+  }, iconButtonProps), IconButtonProps), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconDecrement, _objectSpread({}, IconProps))
+  })));
+  if (increment) end.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread(_objectSpread({
     onClick: onIncrement
-  }, iconButtonProps, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconIncrement, IconProps)));
-  return /*#__PURE__*/_react.default.createElement(AdvancedTextField, (0, _extends2.default)({
+  }, iconButtonProps), IconButtonProps), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconIncrement, _objectSpread({}, IconProps))
+  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AdvancedTextField, _objectSpread({
     ref: item => {
       if (ref) {
         if ((0, _utils.is)('function', ref)) ref(item);else ref.current = item;
@@ -209,6 +214,6 @@ const NumericTextField = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
     endVerticalAlign: "center",
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('NumericTextField', theme) && ['onesy-NumericTextField-root', `onesy-NumericTextField-version-${version}`, `onesy-NumericTextField-size-${size}`], className, classes.root])
   }, other));
-});
+};
 NumericTextField.displayName = 'onesy-NumericTextField';
 var _default = exports.default = NumericTextField;