@onesy/ui-react 1.0.172 → 1.0.174

package/CookieBanner/CookieBanner.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");
@@ -18,6 +17,7 @@ var _Surface = _interopRequireDefault(require("../Surface"));
 var _Slide = _interopRequireDefault(require("../Slide"));
 var _Line = _interopRequireDefault(require("../Line"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["name", "description", "size", "startActions", "endActions", "onReject", "onAllow", "in", "TransitionElement", "noTransition", "MainProps", "NameProps", "DescriptionProps", "ButtonProps", "RejectButtonProps", "AllowButtonProps", "TransitionProps", "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; }
@@ -44,7 +44,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-CookieBanner'
 });
-const CookieBanner = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const CookieBanner = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _theme$elements5;
   const $ = (0, _compilerRuntime.c)(10);
   const theme = (0, _styleReact.useOnesyTheme)();
@@ -100,18 +100,23 @@ const CookieBanner = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   const t3 = (0, _styleReact.classNames)([(0, _utils2.staticClassName)("CookieBanner", theme) && ["onesy-CookieBanner-root", `onesy-CookieBanner-size-${size}`], className, classes.root, classes[`size_${size}`]]);
   const t4 = (0, _styleReact.classNames)([(0, _utils2.staticClassName)("CookieBanner", theme) && ["onesy-CookieBanner-main"], MainProps === null || MainProps === void 0 ? void 0 : MainProps.className, classes.main]);
   const t5 = 0.25;
-  const t6 = (0, _utils.is)("string", name) ? /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
+  const t6 = (0, _utils.is)("string", name) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, _objectSpread(_objectSpread({
     version: size === "large" ? "t1" : size === "regular" ? "t2" : "t3",
     weight: 500
-  }, NameProps), name) : name;
-  const t7 = (0, _utils.is)("string", description) ? /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
+  }, NameProps), {}, {
+    children: name
+  })) : name;
+  const t7 = (0, _utils.is)("string", description) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, _objectSpread(_objectSpread({
     version: size === "large" ? "b1" : size === "regular" ? "b2" : "b3"
-  }, DescriptionProps), description) : description;
+  }, DescriptionProps), {}, {
+    children: description
+  })) : description;
   let t8;
   if ($[2] !== Line || $[3] !== t6 || $[4] !== t7) {
-    t8 = /*#__PURE__*/_react.default.createElement(Line, {
-      gap: t5
-    }, t6, t7);
+    t8 = /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+      gap: t5,
+      children: [t6, t7]
+    });
     $[2] = Line;
     $[3] = t6;
     $[4] = t7;
@@ -135,37 +140,46 @@ const CookieBanner = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   } else {
     t10 = $[9];
   }
-  return /*#__PURE__*/_react.default.createElement(TransitionElement, WrapperProps, /*#__PURE__*/_react.default.createElement(Line, (0, _extends2.default)({
-    ref: ref,
-    gap: 1.5,
-    align: "center",
-    fullWidth: true,
-    Component: Surface,
-    color: "default",
-    role: "region",
-    "aria-label": t2,
-    className: t3
-  }, other), /*#__PURE__*/_react.default.createElement(Line, (0, _extends2.default)({
-    gap: 1.5,
-    direction: "row",
-    wrap: "wrap",
-    align: "center",
-    justify: "space-between",
-    fullWidth: true
-  }, MainProps, {
-    className: t4
-  }), t8, /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "row",
-    align: "center"
-  }, startActions, /*#__PURE__*/_react.default.createElement(Button, (0, _extends2.default)({
-    onClick: onReject,
-    color: "default"
-  }, buttonProps, RejectButtonProps), t9), /*#__PURE__*/_react.default.createElement(Button, (0, _extends2.default)({
-    onClick: onAllow,
-    color: "primary",
-    version: "filled"
-  }, buttonProps, AllowButtonProps), t10), endActions))));
-});
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionElement, _objectSpread(_objectSpread({}, WrapperProps), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, _objectSpread(_objectSpread({
+      gap: 1.5,
+      align: "center",
+      fullWidth: true,
+      Component: Surface,
+      color: "default",
+      role: "region",
+      "aria-label": t2,
+      className: t3
+    }, other), {}, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, _objectSpread(_objectSpread({
+        gap: 1.5,
+        direction: "row",
+        wrap: "wrap",
+        align: "center",
+        justify: "space-between",
+        fullWidth: true
+      }, MainProps), {}, {
+        className: t4,
+        children: [t8, /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+          gap: 1,
+          direction: "row",
+          align: "center",
+          children: [startActions, /*#__PURE__*/(0, _jsxRuntime.jsx)(Button, _objectSpread(_objectSpread(_objectSpread({
+            onClick: onReject,
+            color: "default"
+          }, buttonProps), RejectButtonProps), {}, {
+            children: t9
+          })), /*#__PURE__*/(0, _jsxRuntime.jsx)(Button, _objectSpread(_objectSpread(_objectSpread({
+            onClick: onAllow,
+            color: "primary",
+            version: "filled"
+          }, buttonProps), AllowButtonProps), {}, {
+            children: t10
+          })), endActions]
+        })]
+      }))
+    }))
+  }));
+};
 CookieBanner.displayName = 'onesy-CookieBanner';
 var _default = exports.default = CookieBanner;

package/Countdown/Countdown.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"));
@@ -26,6 +25,7 @@ var _LinearProgress = _interopRequireDefault(require("../LinearProgress"));
 var _Line = _interopRequireDefault(require("../Line"));
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 var _utils2 = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["tonal", "color", "version", "renderValue", "icon", "onStart", "onPause", "onStop", "onResume", "Icon", "IconStart", "IconPause", "IconStop", "TreeProps", "TooltipProps", "RoundProgressProps", "NumericTextFieldProps", "IconButtonProps", "LinearProgressProps", "IconProps", "Component", "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; }
@@ -92,7 +92,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
 }), {
   name: 'onesy-Countdown'
 });
-const Countdown = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
+const Countdown = props_ => {
   var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _theme$elements5, _theme$elements6, _theme$elements7, _theme$elements8, _theme$elements9;
   const theme = (0, _styleReact.useOnesyTheme)();
   const l = theme.l;
@@ -250,8 +250,7 @@ const Countdown = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     return valueNew;
   };
   const value_ = status === 'initial' ? '00:00:00' : valueFormat(value);
-  return /*#__PURE__*/_react.default.createElement(Surface, (0, _extends2.default)({
-    ref: ref,
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Surface, _objectSpread(_objectSpread({
     tonal: tonal,
     color: color,
     gap: 1,
@@ -262,124 +261,165 @@ const Countdown = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       Component
     },
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-root'], className, classes.root])
-  }, other), icon && /*#__PURE__*/_react.default.createElement(Icon_, (0, _extends2.default)({
-    size: "medium"
-  }, IconProps, {
-    style: _objectSpread({
-      marginBottom: 4
-    }, IconProps === null || IconProps === void 0 ? void 0 : IconProps.style)
-  })), status === 'initial' && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "row",
-    align: "flex-end",
-    style: {
-      marginTop: 12,
-      marginBottom: -8
-    }
-  }, /*#__PURE__*/_react.default.createElement(NumericTextField, (0, _extends2.default)({
-    name: l('Hours'),
-    min: 0,
-    max: 23,
-    value: values.hours,
-    onChange: valueNew_0 => updateValues('hours', !valueNew_0 ? 0 : valueNew_0)
-  }, NumericTextFieldProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
-  })), /*#__PURE__*/_react.default.createElement(NumericTextField, (0, _extends2.default)({
-    name: l('Minutes'),
-    min: 0,
-    max: 59,
-    value: values.minutes,
-    onChange: valueNew_1 => updateValues('minutes', !valueNew_1 ? 0 : valueNew_1)
-  }, NumericTextFieldProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
-  })), /*#__PURE__*/_react.default.createElement(NumericTextField, (0, _extends2.default)({
-    name: l('Seconds'),
-    min: 0,
-    max: 59,
-    value: values.seconds,
-    onChange: valueNew_2 => updateValues('seconds', !valueNew_2 ? 0 : valueNew_2)
-  }, NumericTextFieldProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
-  })))), status !== 'initial' && ['regular', 'linear'].includes(version) && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "column",
-    align: "center",
-    justify: "center",
-    style: {
-      width: '100%'
-    }
-  }, (0, _utils.is)('function', renderValue) ? renderValue(value_) : /*#__PURE__*/_react.default.createElement(Type, {
-    version: "h1"
-  }, value_), version === 'linear' && /*#__PURE__*/_react.default.createElement(LinearProgress, (0, _extends2.default)({
-    version: "determinate",
-    value: (0, _utils.clamp)(Math.round(value / 1000 / (refs.total.current / 1000) * 100), 0, 100),
-    reverse: true,
-    style: {
-      margin: '4px 0 8px'
-    }
-  }, LinearProgressProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-linear-progress'], LinearProgressProps === null || LinearProgressProps === void 0 ? void 0 : LinearProgressProps.className, classes.linearProgress])
-  })))), status !== 'initial' && ['round'].includes(version) && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 0.5,
-    direction: "column",
-    align: "center",
-    justify: "center",
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-round-wrapper'], classes.roundWrapper])
-  }, /*#__PURE__*/_react.default.createElement(RoundProgress, (0, _extends2.default)({
-    version: "determinate",
-    value: (0, _utils.clamp)(Math.round(value / 1000 / (refs.total.current / 1000) * 100), 0, 100)
-  }, RoundProgressProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-round-progress'], RoundProgressProps === null || RoundProgressProps === void 0 ? void 0 : RoundProgressProps.className, classes.roundProgress])
-  })), (0, _utils.is)('function', renderValue) ? renderValue(value_) : /*#__PURE__*/_react.default.createElement(Type, {
-    version: "h1"
-  }, value_), /*#__PURE__*/_react.default.createElement(Type, {
-    version: "b3",
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-meta'], classes.meta])
-  }, l('Total'), " ", (0, _date.duration)(refs.total.current, false)))), /*#__PURE__*/_react.default.createElement(Line, {
-    gap: 1,
-    direction: "row",
-    align: "center",
-    justify: "center"
-  }, status === 'initial' && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-    name: l('Start')
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: onStart,
-    disabled: !((values.hours || 0) + (values.minutes || 0) + (values.seconds || 0))
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconStart, null))))), status === 'running' && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-    name: l('Stop')
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: onStop
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconStop, null))), /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-    name: l('Pause')
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: onPause
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconPause, null))))), status === 'paused' && /*#__PURE__*/_react.default.createElement(Fade, {
-    in: true,
-    add: true
-  }, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-    name: l('Stop')
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: onStop
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconStop, null))), /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-    name: l('Resume')
-  }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-    onClick: onResume
-  }, IconButtonProps), /*#__PURE__*/_react.default.createElement(IconStart, null)))))));
-});
+  }, other), {}, {
+    children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon_, _objectSpread(_objectSpread({
+      size: "medium"
+    }, IconProps), {}, {
+      style: _objectSpread({
+        marginBottom: 4
+      }, IconProps === null || IconProps === void 0 ? void 0 : IconProps.style)
+    })), status === 'initial' && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+      in: true,
+      add: true,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+        gap: 1,
+        direction: "row",
+        align: "flex-end",
+        style: {
+          marginTop: 12,
+          marginBottom: -8
+        },
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(NumericTextField, _objectSpread(_objectSpread({
+          name: l('Hours'),
+          min: 0,
+          max: 23,
+          value: values.hours,
+          onChange: valueNew_0 => updateValues('hours', !valueNew_0 ? 0 : valueNew_0)
+        }, NumericTextFieldProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
+        })), /*#__PURE__*/(0, _jsxRuntime.jsx)(NumericTextField, _objectSpread(_objectSpread({
+          name: l('Minutes'),
+          min: 0,
+          max: 59,
+          value: values.minutes,
+          onChange: valueNew_1 => updateValues('minutes', !valueNew_1 ? 0 : valueNew_1)
+        }, NumericTextFieldProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
+        })), /*#__PURE__*/(0, _jsxRuntime.jsx)(NumericTextField, _objectSpread(_objectSpread({
+          name: l('Seconds'),
+          min: 0,
+          max: 59,
+          value: values.seconds,
+          onChange: valueNew_2 => updateValues('seconds', !valueNew_2 ? 0 : valueNew_2)
+        }, NumericTextFieldProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-numeric-text-field'], NumericTextFieldProps === null || NumericTextFieldProps === void 0 ? void 0 : NumericTextFieldProps.className, classes.numericTextField])
+        }))]
+      })
+    }), status !== 'initial' && ['regular', 'linear'].includes(version) && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+      in: true,
+      add: true,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+        gap: 1,
+        direction: "column",
+        align: "center",
+        justify: "center",
+        style: {
+          width: '100%'
+        },
+        children: [(0, _utils.is)('function', renderValue) ? renderValue(value_) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, {
+          version: "h1",
+          children: value_
+        }), version === 'linear' && /*#__PURE__*/(0, _jsxRuntime.jsx)(LinearProgress, _objectSpread(_objectSpread({
+          version: "determinate",
+          value: (0, _utils.clamp)(Math.round(value / 1000 / (refs.total.current / 1000) * 100), 0, 100),
+          reverse: true,
+          style: {
+            margin: '4px 0 8px'
+          }
+        }, LinearProgressProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-linear-progress'], LinearProgressProps === null || LinearProgressProps === void 0 ? void 0 : LinearProgressProps.className, classes.linearProgress])
+        }))]
+      })
+    }), status !== 'initial' && ['round'].includes(version) && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+      in: true,
+      add: true,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+        gap: 0.5,
+        direction: "column",
+        align: "center",
+        justify: "center",
+        className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-round-wrapper'], classes.roundWrapper]),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(RoundProgress, _objectSpread(_objectSpread({
+          version: "determinate",
+          value: (0, _utils.clamp)(Math.round(value / 1000 / (refs.total.current / 1000) * 100), 0, 100)
+        }, RoundProgressProps), {}, {
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-round-progress'], RoundProgressProps === null || RoundProgressProps === void 0 ? void 0 : RoundProgressProps.className, classes.roundProgress])
+        })), (0, _utils.is)('function', renderValue) ? renderValue(value_) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Type, {
+          version: "h1",
+          children: value_
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Type, {
+          version: "b3",
+          className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Countdown', theme) && ['onesy-Countdown-meta'], classes.meta]),
+          children: [l('Total'), " ", (0, _date.duration)(refs.total.current, false)]
+        })]
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Line, {
+      gap: 1,
+      direction: "row",
+      align: "center",
+      justify: "center",
+      children: [status === 'initial' && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+        in: true,
+        add: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
+            name: l('Start')
+          }, TooltipProps), {}, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+              onClick: onStart,
+              disabled: !((values.hours || 0) + (values.minutes || 0) + (values.seconds || 0))
+            }, IconButtonProps), {}, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconStart, {})
+            }))
+          }))
+        })
+      }), status === 'running' && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+        in: true,
+        add: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
+            name: l('Stop')
+          }, TooltipProps), {}, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+              onClick: onStop
+            }, IconButtonProps), {}, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconStop, {})
+            }))
+          })), /*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
+            name: l('Pause')
+          }, TooltipProps), {}, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+              onClick: onPause
+            }, IconButtonProps), {}, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconPause, {})
+            }))
+          }))]
+        })
+      }), status === 'paused' && /*#__PURE__*/(0, _jsxRuntime.jsx)(Fade, {
+        in: true,
+        add: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
+            name: l('Stop')
+          }, TooltipProps), {}, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+              onClick: onStop
+            }, IconButtonProps), {}, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconStop, {})
+            }))
+          })), /*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip, _objectSpread(_objectSpread({
+            name: l('Resume')
+          }, TooltipProps), {}, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, _objectSpread(_objectSpread({
+              onClick: onResume
+            }, IconButtonProps), {}, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconStart, {})
+            }))
+          }))]
+        })
+      })]
+    })]
+  }));
+};
 Countdown.displayName = 'onesy-Countdown';
 var _default = exports.default = Countdown;