@onesy/ui-react 1.0.172 → 1.0.173

package/RoundMeter/RoundMeter.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"));
@@ -13,7 +12,8 @@ var _utils = require("@onesy/utils");
 var _styleReact = require("@onesy/style-react");
 var _Surface = _interopRequireDefault(require("../Surface"));
 var _utils2 = require("../utils");
-const _excluded = ["tonal", "color", "size", "parts", "lineCap", "padding", "gap", "border", "background", "boundary", "boundaryWidth", "arcProgress", "arcsVisible", "marksVisible", "labelsVisible", "marks", "markSize", "markWidth", "labels", "renderLabel", "childrenPosition", "additional", "textProps", "pathProps", "SvgProps", "MarkProps", "LabelProps", "BackgroundProps", "BorderProps", "ArcProps", "ArcMainProps", "ArcsProgressProps", "ArcProgressProps", "Component", "className", "style", "children"],
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "tonal", "color", "size", "parts", "lineCap", "padding", "gap", "border", "background", "boundary", "boundaryWidth", "arcProgress", "arcsVisible", "marksVisible", "labelsVisible", "marks", "markSize", "markWidth", "labels", "renderLabel", "childrenPosition", "additional", "textProps", "pathProps", "SvgProps", "MarkProps", "LabelProps", "BackgroundProps", "BorderProps", "ArcProps", "ArcMainProps", "ArcsProgressProps", "ArcProgressProps", "Component", "className", "style", "children"],
   _excluded2 = ["size", "padding", "position"],
   _excluded3 = ["value", "padding", "position"],
   _excluded4 = ["x", "y", "value"];
@@ -57,12 +57,13 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-RoundMeter'
 });
-const RoundMeter = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const RoundMeter = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements;
   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.onesyRoundMeter) === 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;
   const {
+      ref,
       tonal = true,
       color = 'primary',
       size = 'regular',
@@ -539,21 +540,22 @@ const RoundMeter = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     }
     return values_3.join(' ');
   }, [width, height, boundary, boundaryWidth, outsidePadding]);
-  const children_ = children && /*#__PURE__*/_react.default.createElement("g", {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-children'], classes.children])
-  }, _react.default.Children.toArray(children).map((item, index_1) => {
-    return /*#__PURE__*/_react.default.cloneElement(item, {
-      key: index_1,
-      fill: item.props.fill !== undefined ? item.props.fill : color,
-      stroke: item.props.stroke !== undefined ? item.props.stroke : color,
-      // clean up
-      value: undefined,
-      style: _objectSpread(_objectSpread({}, item.props.value !== undefined ? {
-        transform: `rotate(${(0, _utils.valueFromPercentageWithinRange)(item.props.value, min, max)}deg)`
-      } : undefined), item.props.style)
-    });
-  }));
-  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
+  const children_ = children && /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-children'], classes.children]),
+    children: _react.default.Children.toArray(children).map((item, index_1) => {
+      return /*#__PURE__*/_react.default.cloneElement(item, {
+        key: index_1,
+        fill: item.props.fill !== undefined ? item.props.fill : color,
+        stroke: item.props.stroke !== undefined ? item.props.stroke : color,
+        // clean up
+        value: undefined,
+        style: _objectSpread(_objectSpread({}, item.props.value !== undefined ? {
+          transform: `rotate(${(0, _utils.valueFromPercentageWithinRange)(item.props.value, min, max)}deg)`
+        } : undefined), item.props.style)
+      });
+    })
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Component, _objectSpread(_objectSpread({
     ref: item_0 => {
       if (ref) {
         if ((0, _utils.is)('function', ref)) ref(item_0);else ref.current = item_0;
@@ -562,80 +564,83 @@ const RoundMeter = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     },
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-root', `onesy-RoundMeter-size-${size}`], className, classes.root, classes[`size_${size}`], classes[`boundary_${String(boundary).replace('.', '')}`]]),
     style: _objectSpread(_objectSpread({}, styles.root), style)
-  }, other), additional, /*#__PURE__*/_react.default.createElement(Surface, {
-    tonal: tonal,
-    color: color
-  }, ({
-    color: color_,
-    backgroundColor
-  }) => /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: `0 ${yViewBox} ${width || 0} ${height || 0}`
-  }, SvgProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-svg'], SvgProps === null || SvgProps === void 0 ? void 0 : SvgProps.className, classes.svg])
-  }), childrenPosition === 'pre' && children_, background && /*#__PURE__*/_react.default.createElement("path", (0, _extends2.default)({
-    d: pathBackground,
-    fill: backgroundColor,
-    stroke: "none"
-  }, pathProps, BackgroundProps)), border && /*#__PURE__*/_react.default.createElement("path", (0, _extends2.default)({
-    d: pathBorder,
-    fill: "none",
-    stroke: color_,
-    strokeWidth: boundaryWidth
-  }, pathProps, BorderProps)), arcsVisible && /*#__PURE__*/_react.default.createElement("g", {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-arcs'], classes.arcs])
-  }, arcs.map((item_1, index_2) => /*#__PURE__*/_react.default.createElement("path", (0, _extends2.default)({
-    key: index_2,
-    d: item_1.d,
-    fill: "none",
-    stroke: color_,
-    strokeWidth: boundaryWidth,
-    strokeLinecap: lineCap
-  }, pathProps, ArcProps, ArcMainProps)))), arcsVisible && arcProgress && /*#__PURE__*/_react.default.createElement("g", (0, _extends2.default)({}, ArcsProgressProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-arcs-progress'], ArcsProgressProps === null || ArcsProgressProps === void 0 ? void 0 : ArcsProgressProps.className, classes.arcs_progress])
-  }), arcs.map((item_2, index_3) => /*#__PURE__*/_react.default.createElement("path", (0, _extends2.default)({
-    key: index_3,
-    d: item_2.d,
-    fill: "none",
-    stroke: color_,
-    strokeWidth: boundaryWidth,
-    strokeLinecap: lineCap
-  }, pathProps, ArcProps, ArcProgressProps)))), childrenPosition === 'pre-marks' && children_, marksVisible && !!marks_.length && marks.map((marksValue_0, index_4) => /*#__PURE__*/_react.default.createElement("g", {
-    key: index_4,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-marks'], classes.marks])
-  }, marksValue_0.map((item_3, index_) => /*#__PURE__*/_react.default.createElement("path", (0, _extends2.default)({
-    key: index_,
-    d: item_3.d,
-    fill: "none",
-    stroke: color_,
-    strokeWidth: item_3.width !== undefined ? item_3.width : markWidth,
-    strokeLinecap: lineCap
-  }, pathProps, MarkProps))))), childrenPosition === 'pre-labels' && children_, labelsVisible && !!labels_.length && labels.map((labelsValue_0, index_5) => {
-    return /*#__PURE__*/_react.default.createElement("g", {
-      key: index_5,
-      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-labels'], classes.labels])
-    }, labelsValue_0.map((item_4, index__0) => {
-      const {
-          x,
-          y,
-          value: value_1
-        } = item_4,
-        other__1 = (0, _objectWithoutProperties2.default)(item_4, _excluded4);
-      const propsLabel = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, other__1), textProps), LabelProps), {}, {
-        style: _objectSpread(_objectSpread(_objectSpread({
-          fill: color_
-        }, other__1.style), textProps === null || textProps === void 0 ? void 0 : textProps.style), LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.style)
-      });
-      if ((0, _utils.is)('function', renderLabel)) return renderLabel(x, y, value_1, propsLabel);
-      return /*#__PURE__*/_react.default.createElement("text", (0, _extends2.default)({
-        key: index__0,
-        x: x,
-        y: y
-      }, propsLabel, {
-        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-label'], other__1 === null || other__1 === void 0 ? void 0 : other__1.className, textProps === null || textProps === void 0 ? void 0 : textProps.className, LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className, classes.label])
-      }), value_1);
-    }));
-  }), childrenPosition === 'post' && children_)));
-});
+  }, other), {}, {
+    children: [additional, /*#__PURE__*/(0, _jsxRuntime.jsx)(Surface, {
+      tonal: tonal,
+      color: color,
+      children: ({
+        color: color_,
+        backgroundColor
+      }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", _objectSpread(_objectSpread({
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: `0 ${yViewBox} ${width || 0} ${height || 0}`
+      }, SvgProps), {}, {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-svg'], SvgProps === null || SvgProps === void 0 ? void 0 : SvgProps.className, classes.svg]),
+        children: [childrenPosition === 'pre' && children_, background && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", _objectSpread(_objectSpread({
+          d: pathBackground,
+          fill: backgroundColor,
+          stroke: "none"
+        }, pathProps), BackgroundProps)), border && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", _objectSpread(_objectSpread({
+          d: pathBorder,
+          fill: "none",
+          stroke: color_,
+          strokeWidth: boundaryWidth
+        }, pathProps), BorderProps)), arcsVisible && /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-arcs'], classes.arcs]),
+          children: arcs.map((item_1, index_2) => /*#__PURE__*/(0, _jsxRuntime.jsx)("path", _objectSpread(_objectSpread(_objectSpread({
+            d: item_1.d,
+            fill: "none",
+            stroke: color_,
+            strokeWidth: boundaryWidth,
+            strokeLinecap: lineCap
+          }, pathProps), ArcProps), ArcMainProps), index_2))
+        }), arcsVisible && arcProgress && /*#__PURE__*/(0, _jsxRuntime.jsx)("g", _objectSpread(_objectSpread({}, ArcsProgressProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-arcs-progress'], ArcsProgressProps === null || ArcsProgressProps === void 0 ? void 0 : ArcsProgressProps.className, classes.arcs_progress]),
+          children: arcs.map((item_2, index_3) => /*#__PURE__*/(0, _jsxRuntime.jsx)("path", _objectSpread(_objectSpread(_objectSpread({
+            d: item_2.d,
+            fill: "none",
+            stroke: color_,
+            strokeWidth: boundaryWidth,
+            strokeLinecap: lineCap
+          }, pathProps), ArcProps), ArcProgressProps), index_3))
+        })), childrenPosition === 'pre-marks' && children_, marksVisible && !!marks_.length && marks.map((marksValue_0, index_4) => /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-marks'], classes.marks]),
+          children: marksValue_0.map((item_3, index_) => /*#__PURE__*/(0, _jsxRuntime.jsx)("path", _objectSpread(_objectSpread({
+            d: item_3.d,
+            fill: "none",
+            stroke: color_,
+            strokeWidth: item_3.width !== undefined ? item_3.width : markWidth,
+            strokeLinecap: lineCap
+          }, pathProps), MarkProps), index_))
+        }, index_4)), childrenPosition === 'pre-labels' && children_, labelsVisible && !!labels_.length && labels.map((labelsValue_0, index_5) => {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+            className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-labels'], classes.labels]),
+            children: labelsValue_0.map((item_4, index__0) => {
+              const {
+                  x,
+                  y,
+                  value: value_1
+                } = item_4,
+                other__1 = (0, _objectWithoutProperties2.default)(item_4, _excluded4);
+              const propsLabel = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, other__1), textProps), LabelProps), {}, {
+                style: _objectSpread(_objectSpread(_objectSpread({
+                  fill: color_
+                }, other__1.style), textProps === null || textProps === void 0 ? void 0 : textProps.style), LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.style)
+              });
+              if ((0, _utils.is)('function', renderLabel)) return renderLabel(x, y, value_1, propsLabel);
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)("text", _objectSpread(_objectSpread({
+                x: x,
+                y: y
+              }, propsLabel), {}, {
+                className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('RoundMeter', theme) && ['onesy-RoundMeter-label'], other__1 === null || other__1 === void 0 ? void 0 : other__1.className, textProps === null || textProps === void 0 ? void 0 : textProps.className, LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className, classes.label]),
+                children: value_1
+              }), index__0);
+            })
+          }, index_5);
+        }), childrenPosition === 'post' && children_]
+      }))
+    })]
+  }));
+};
 RoundMeter.displayName = 'onesy-RoundMeter';
 var _default = exports.default = RoundMeter;

package/RoundProgress/RoundProgress.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,7 +12,8 @@ var _react = _interopRequireDefault(require("react"));
 var _utils = require("@onesy/utils");
 var _styleReact = require("@onesy/style-react");
 var _utils2 = require("../utils");
-const _excluded = ["tonal", "color", "size", "version", "value", "noShrink", "thickness", "rounded", "pathProps", "pathBackgroundProps", "className", "style", "children"];
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "tonal", "color", "size", "version", "value", "noShrink", "thickness", "rounded", "pathProps", "pathBackgroundProps", "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 noShrinkStrokeDashOffset = 194;
@@ -159,12 +159,13 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-RoundProgress'
 });
-const RoundProgress = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const RoundProgress = props_ => {
   var _theme$ui, _theme$ui2;
   const $ = (0, _compilerRuntime.c)(3);
   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.onesyRoundProgress) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const {
+      ref,
       tonal: t0,
       color: t1,
       size: t2,
@@ -227,35 +228,38 @@ const RoundProgress = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   } else {
     t8 = $[2];
   }
-  return /*#__PURE__*/_react.default.createElement("span", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
     ref: ref,
-    className: t7
-  }, /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
-    viewBox: "0 0 24 24",
-    className: t8,
-    style: _objectSpread(_objectSpread({}, styles.root), style)
-  }, other), /*#__PURE__*/_react.default.createElement("circle", (0, _extends2.default)({
-    fill: "none",
-    strokeWidth: thickness,
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }, !rounded && {
-    strokeLinecap: "butt"
-  }, pathBackgroundProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("RoundedProgress", theme) && ["onesy-RoundedProgress-path-background"], pathBackgroundProps === null || pathBackgroundProps === void 0 ? void 0 : pathBackgroundProps.className, classes.pathBackground, classes[`path_${version}`]])
-  })), /*#__PURE__*/_react.default.createElement("circle", (0, _extends2.default)({
-    fill: "none",
-    strokeWidth: thickness,
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }, !rounded && {
-    strokeLinecap: "butt"
-  }, pathProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("RoundedProgress", theme) && ["onesy-RoundedProgress-path"], pathProps === null || pathProps === void 0 ? void 0 : pathProps.className, classes.path, classes[`path_${version}`], noShrink && classes.path_indeterminate_noShrink]),
-    style: _objectSpread(_objectSpread({}, styles.circle), pathProps === null || pathProps === void 0 ? void 0 : pathProps.style)
-  }))), children);
-});
+    className: t7,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", _objectSpread(_objectSpread({
+      viewBox: "0 0 24 24",
+      className: t8,
+      style: _objectSpread(_objectSpread({}, styles.root), style)
+    }, other), {}, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("circle", _objectSpread(_objectSpread(_objectSpread({
+        fill: "none",
+        strokeWidth: thickness,
+        cx: "12",
+        cy: "12",
+        r: "10"
+      }, !rounded && {
+        strokeLinecap: "butt"
+      }), pathBackgroundProps), {}, {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("RoundedProgress", theme) && ["onesy-RoundedProgress-path-background"], pathBackgroundProps === null || pathBackgroundProps === void 0 ? void 0 : pathBackgroundProps.className, classes.pathBackground, classes[`path_${version}`]])
+      })), /*#__PURE__*/(0, _jsxRuntime.jsx)("circle", _objectSpread(_objectSpread(_objectSpread({
+        fill: "none",
+        strokeWidth: thickness,
+        cx: "12",
+        cy: "12",
+        r: "10"
+      }, !rounded && {
+        strokeLinecap: "butt"
+      }), pathProps), {}, {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)("RoundedProgress", theme) && ["onesy-RoundedProgress-path"], pathProps === null || pathProps === void 0 ? void 0 : pathProps.className, classes.path, classes[`path_${version}`], noShrink && classes.path_indeterminate_noShrink]),
+        style: _objectSpread(_objectSpread({}, styles.circle), pathProps === null || pathProps === void 0 ? void 0 : pathProps.style)
+      }))]
+    })), children]
+  });
+};
 RoundProgress.displayName = 'onesy-RoundProgress';
 var _default = exports.default = RoundProgress;

package/ScatterChart/ScatterChart.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 _Chart = _interopRequireDefault(require("../Chart"));
 var _ScatterChartItem = _interopRequireDefault(require("../ScatterChartItem"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["values", "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; }
@@ -23,9 +23,9 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-ScatterChart'
 });
-const ScatterChart = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const ScatterChart = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2;
-  const $ = (0, _compilerRuntime.c)(7);
+  const $ = (0, _compilerRuntime.c)(6);
   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.onesyScatterChart) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
   const Chart = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.Chart) || _Chart.default;
@@ -39,27 +39,25 @@ const ScatterChart = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     classes
   } = useStyle();
   const t0 = (0, _styleReact.classNames)([(0, _utils2.staticClassName)("ScatterChart", theme) && ["onesy-ScatterChart-root"], className, classes.root]);
-  const t1 = (0, _utils.is)("array", values) && values.map((item, index) => /*#__PURE__*/_react.default.createElement(ScatterChartItem, (0, _extends2.default)({
-    key: index
-  }, item)));
+  const t1 = (0, _utils.is)("array", values) && values.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(ScatterChartItem, _objectSpread({}, item), index));
   let t2;
-  if ($[0] !== Chart || $[1] !== other || $[2] !== ref || $[3] !== t0 || $[4] !== t1 || $[5] !== values) {
-    t2 = /*#__PURE__*/_react.default.createElement(Chart, (0, _extends2.default)({
-      ref: ref,
+  if ($[0] !== Chart || $[1] !== other || $[2] !== t0 || $[3] !== t1 || $[4] !== values) {
+    t2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(Chart, _objectSpread(_objectSpread({
       values: values,
       className: t0
-    }, other), t1);
+    }, other), {}, {
+      children: t1
+    }));
     $[0] = Chart;
     $[1] = other;
-    $[2] = ref;
-    $[3] = t0;
-    $[4] = t1;
-    $[5] = values;
-    $[6] = t2;
+    $[2] = t0;
+    $[3] = t1;
+    $[4] = values;
+    $[5] = t2;
   } else {
-    t2 = $[6];
+    t2 = $[5];
   }
   return t2;
-});
+};
 ScatterChart.displayName = 'onesy-ScatterChart';
 var _default = exports.default = ScatterChart;

package/ScatterChartItem/ScatterChartItem.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 _Line = _interopRequireDefault(require("../Line"));
 var _Type = _interopRequireDefault(require("../Type"));
 var _useMediaQuery = _interopRequireDefault(require("../useMediaQuery"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "name", "values", "refs", "rects", "updateDefs", "updateLegend", "minMax", "animate", "animateTimeout", "PathProps", "BackgroundProps", "BorderProps", "LegendItemProps", "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; }
@@ -32,7 +32,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-ScatterChartItem'
 });
-const ScatterChartItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const ScatterChartItem = 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.onesyScatterChartItem) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
@@ -93,20 +93,22 @@ const ScatterChartItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
   refs.animateTimeout.current = animateTimeout;
   refs.init.current = init;
   const LegendItem = () => {
-    return /*#__PURE__*/_react.default.createElement(Line, (0, _extends2.default)({
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, _objectSpread(_objectSpread({
       gap: 1,
       direction: "row",
       align: "center"
-    }, LegendItemProps, {
-      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('ScatterChartItem', theme) && ['onesy-ScatterChartItem-legend-item'], LegendItemProps === null || LegendItemProps === void 0 ? void 0 : LegendItemProps.className, classes.legend_item])
-    }), /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('ScatterChartItem', theme) && ['onesy-ScatterChartItem-legend-icon'], classes.legend_icon]),
-      style: {
-        background: !refs.theme.current.palette.color[color] ? color : refs.theme.current.palette.color[color]['main']
-      }
-    }), /*#__PURE__*/_react.default.createElement(Type, {
-      version: "b3"
-    }, name));
+    }, LegendItemProps), {}, {
+      className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('ScatterChartItem', theme) && ['onesy-ScatterChartItem-legend-item'], LegendItemProps === null || LegendItemProps === void 0 ? void 0 : LegendItemProps.className, classes.legend_item]),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('ScatterChartItem', theme) && ['onesy-ScatterChartItem-legend-icon'], classes.legend_icon]),
+        style: {
+          background: !refs.theme.current.palette.color[color] ? color : refs.theme.current.palette.color[color]['main']
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, {
+        version: "b3",
+        children: name
+      })]
+    }));
   };
   const make = () => {
     // Make values into x, y, coordinates
@@ -130,25 +132,25 @@ const ScatterChartItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
         values__.y = (0, _utils.valueFromPercentageWithinRange)(values__.y, 0, height);
         return [values__.x, height - values__.y].map(item_ => Math.abs(item_));
       });
-      const element = /*#__PURE__*/_react.default.createElement("g", {
-        ref: refs.path
-      }, values_.map((item_0, index) => /*#__PURE__*/_react.default.createElement(Path, (0, _extends2.default)({
-        key: index,
-        cx: item_0[0],
-        cy: item_0[1],
-        r: 4,
-        fill: !refs.theme.current.palette.color[color] ? color : refs.theme.current.palette.color[color]['main'],
-        stroke: "none"
-      }, PathProps, {
-        Component: "circle",
-        style: _objectSpread(_objectSpread(_objectSpread({}, PathProps === null || PathProps === void 0 ? void 0 : PathProps.style), refs.animate.current && refs.init.current !== 'animated' && {
-          opacity: 0,
-          transform: 'scale(0)'
-        }), {}, {
-          transformBox: 'fill-box',
-          transformOrigin: 'center'
-        }, refs.pathStyle.current)
-      }))));
+      const element = /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+        ref: refs.path,
+        children: values_.map((item_0, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Path, _objectSpread(_objectSpread({
+          cx: item_0[0],
+          cy: item_0[1],
+          r: 4,
+          fill: !refs.theme.current.palette.color[color] ? color : refs.theme.current.palette.color[color]['main'],
+          stroke: "none"
+        }, PathProps), {}, {
+          Component: "circle",
+          style: _objectSpread(_objectSpread(_objectSpread({}, PathProps === null || PathProps === void 0 ? void 0 : PathProps.style), refs.animate.current && refs.init.current !== 'animated' && {
+            opacity: 0,
+            transform: 'scale(0)'
+          }), {}, {
+            transformBox: 'fill-box',
+            transformOrigin: 'center'
+          }, refs.pathStyle.current)
+        }), index))
+      });
 
       // Legend item
       if ((0, _utils.is)('function', updateLegend)) {
@@ -163,7 +165,7 @@ const ScatterChartItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
                 name,
                 values
               },
-              element: /*#__PURE__*/_react.default.createElement(LegendItem, null)
+              element: /*#__PURE__*/(0, _jsxRuntime.jsx)(LegendItem, {})
             });
           }
           return newValues;
@@ -203,6 +205,6 @@ const ScatterChartItem = /*#__PURE__*/_react.default.forwardRef((props_, ref) =>
   return value && /*#__PURE__*/_react.default.cloneElement(value, _objectSpread({
     className
   }, other));
-});
+};
 ScatterChartItem.displayName = 'onesy-ScatterChartItem';
 var _default = exports.default = ScatterChartItem;