@onesy/ui-react 1.0.79 → 1.0.81

package/CalendarAvailability/CalendarAvailability.js

@@ -288,11 +288,12 @@ const CalendarAvailability = react_1.default.forwardRef((props_, ref) => {
         return palette[rangeShade];
     }, [rangeShade, style_react_1.colors, theme]);
     const itemToText = react_1.default.useCallback((item) => {
+        var _a, _b;
         if (item === 'pending')
-            return 'scheduled';
+            return l('Scheduled');
         if (item === 'not-count-workout-session')
-            return `don't count workout session`;
-        return item;
+            return l(`Don't count workout session`);
+        return (_b = (_a = optionsStatus === null || optionsStatus === void 0 ? void 0 : optionsStatus.find(itemStatus => itemStatus.value === item)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : l(item);
     }, []);
     const viewOptions = react_1.default.useMemo(() => {
         return viewsProps === null || viewsProps === void 0 ? void 0 : viewsProps.map(item => ({
@@ -370,20 +371,12 @@ const CalendarAvailability = react_1.default.forwardRef((props_, ref) => {
                     (0, utils_2.staticClassName)('CalendarAvailability', theme) && [
                         'onesy-CalendarAvailability-header'
                     ]
-                ]) }, { children: [startHeader, (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 2, direction: 'row', wrap: 'wrap', justify: 'space-between', align: 'center', fullWidth: true }, { children: [(0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 1.5, direction: 'row', wrap: 'wrap', align: 'center', className: classes.aside }, { children: [startLeft, (0, jsx_runtime_1.jsx)(Button, Object.assign({ color: 'inherit', version: 'outlined', size: 'small', onClick: onToday, selected: now.days === date.days }, { children: l('Today') })), (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 0, direction: 'row', align: 'center' }, { children: [(0, jsx_runtime_1.jsx)(Tooltip, Object.assign({ name: `${l('Previous')} ${view}` }, { children: (0, jsx_runtime_1.jsx)(IconButton, Object.assign({ onClick: onPrevious }, IconButtonProps, { children: (0, jsx_runtime_1.jsx)(IconPrevious, { size: 'regular' }) })) })), (0, jsx_runtime_1.jsx)(Tooltip, Object.assign({ name: `${l('Next')} ${view}` }, { children: (0, jsx_runtime_1.jsx)(IconButton, Object.assign({ onClick: onNext }, IconButtonProps, { children: (0, jsx_runtime_1.jsx)(IconNext, { size: 'regular' }) })) }))] })), (0, jsx_runtime_1.jsx)(Type, Object.assign({ version: 'h2', weight: 500, whiteSpace: 'nowrap' }, { children: formattedDate })), endLeft] })), (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 1.5, direction: 'row', align: 'center', flexNo: true, className: (0, style_react_1.classNames)([
+                ]) }, { children: [startHeader, (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 2, direction: 'row', wrap: 'wrap', justify: 'space-between', align: 'center', fullWidth: true }, { children: [(0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 1.5, direction: 'row', wrap: 'wrap', align: 'center', className: classes.aside }, { children: [startLeft, (0, jsx_runtime_1.jsx)(Button, Object.assign({ color: 'inherit', version: 'outlined', size: 'small', onClick: onToday, selected: now.days === date.days }, { children: l('Today') })), (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 0, direction: 'row', align: 'center' }, { children: [(0, jsx_runtime_1.jsx)(Tooltip, Object.assign({ name: `${l('Previous')} ${l(view)}` }, { children: (0, jsx_runtime_1.jsx)(IconButton, Object.assign({ onClick: onPrevious }, IconButtonProps, { children: (0, jsx_runtime_1.jsx)(IconPrevious, { size: 'regular' }) })) })), (0, jsx_runtime_1.jsx)(Tooltip, Object.assign({ name: `${l('Next')} ${l(view)}` }, { children: (0, jsx_runtime_1.jsx)(IconButton, Object.assign({ onClick: onNext }, IconButtonProps, { children: (0, jsx_runtime_1.jsx)(IconNext, { size: 'regular' }) })) }))] })), (0, jsx_runtime_1.jsx)(Type, Object.assign({ version: 'h2', weight: 500, whiteSpace: 'nowrap' }, { children: formattedDate })), endLeft] })), (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 1.5, direction: 'row', align: 'center', flexNo: true, className: (0, style_react_1.classNames)([
                                     classes.aside,
                                     classes.overflowX
                                 ]) }, { children: [startRight, ['week', 'day'].includes(view) && ((0, jsx_runtime_1.jsxs)(Label, Object.assign({ checked: displayTime, onChange: onChangeDisplayTime }, { children: [(0, jsx_runtime_1.jsx)(Switch, {}), l('Display time')] }))), (0, jsx_runtime_1.jsx)(Select, { name: l('View'), value: view, onChange: onChangeView, options: viewOptions, size: 'small', MenuProps: {
                                             portal: true,
                                             size: 'regular'
-                                        }, WrapperProps: {
-                                            style: {
-                                                width: 170,
-                                                minWidth: 'unset'
-                                            }
-                                        }, style: {
-                                            width: 170,
-                                            minWidth: 'unset'
                                         } }), endRight] }))] })), endHeader] })), (0, jsx_runtime_1.jsxs)(Line, Object.assign({ ref: refs.calendar, gap: 2, flex: true, fullWidth: true }, { children: [view === 'simple' && ((0, jsx_runtime_1.jsx)(Line, Object.assign({ gap: 1, flex: true, fullWidth: true }, { children: (0, jsx_runtime_1.jsxs)(Line, Object.assign({ gap: 4, fullWidth: true, className: (0, style_react_1.classNames)([
                                 (0, utils_2.staticClassName)('CalendarAvailability', theme) && [
                                     'onesy-CalendarAvailability-simple'

package/CalendarWeek/CalendarWeek.js

@@ -199,6 +199,17 @@ const CalendarWeek = react_1.default.forwardRef((props_, ref) => {
             return item;
         });
     }, [times]);
+    const optionsStatus = react_1.default.useMemo(() => {
+        return [
+            { name: l('Working'), value: 'working' },
+            { name: l('Not working'), value: 'not-working' },
+            { name: l('On a break'), value: 'break' },
+            { name: l('Scheduled'), value: 'pending' },
+            { name: l('Rescheduled'), value: 'rescheduled' },
+            { name: l('Cancelled'), value: 'canceled' },
+            { name: l('Other'), value: 'other' }
+        ];
+    }, []);
     const getColor = react_1.default.useCallback((item) => {
         let palette = theme.palette.color.neutral;
         if ((item === null || item === void 0 ? void 0 : item.status) === 'working')
@@ -220,11 +231,12 @@ const CalendarWeek = react_1.default.forwardRef((props_, ref) => {
         return palette[rangeShade];
     }, [rangeShade, style_react_1.colors, theme]);
     const itemToText = react_1.default.useCallback((item) => {
+        var _a, _b;
         if (item === 'pending')
-            return 'scheduled';
+            return l('Scheduled');
         if (item === 'not-count-workout-session')
-            return `don't count workout session`;
-        return item;
+            return l(`Don't count workout session`);
+        return (_b = (_a = optionsStatus === null || optionsStatus === void 0 ? void 0 : optionsStatus.find(itemStatus => itemStatus.value === item)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : l(item);
     }, []);
     const renderTimes = (day, valuesAll, weekly = true, itemDay) => {
         if (itemDay !== undefined && !(itemDay === null || itemDay === void 0 ? void 0 : itemDay.active))

package/esm/CalendarAvailability/CalendarAvailability.js

@@ -324,9 +324,9 @@ const CalendarAvailability = /*#__PURE__*/React.forwardRef((props_, ref) => {
     return palette[rangeShade];
   }, [rangeShade, colors, theme]);
   const itemToText = React.useCallback(item => {
-    if (item === 'pending') return 'scheduled';
-    if (item === 'not-count-workout-session') return `don't count workout session`;
-    return item;
+    if (item === 'pending') return l('Scheduled');
+    if (item === 'not-count-workout-session') return l(`Don't count workout session`);
+    return optionsStatus?.find(itemStatus => itemStatus.value === item)?.name ?? l(item);
   }, []);
   const viewOptions = React.useMemo(() => {
     return viewsProps?.map(item => ({
@@ -531,13 +531,13 @@ const CalendarAvailability = /*#__PURE__*/React.forwardRef((props_, ref) => {
     direction: "row",
     align: "center"
   }, /*#__PURE__*/React.createElement(Tooltip, {
-    name: `${l('Previous')} ${view}`
+    name: `${l('Previous')} ${l(view)}`
   }, /*#__PURE__*/React.createElement(IconButton, _extends({
     onClick: onPrevious
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconPrevious, {
     size: "regular"
   }))), /*#__PURE__*/React.createElement(Tooltip, {
-    name: `${l('Next')} ${view}`
+    name: `${l('Next')} ${l(view)}`
   }, /*#__PURE__*/React.createElement(IconButton, _extends({
     onClick: onNext
   }, IconButtonProps), /*#__PURE__*/React.createElement(IconNext, {
@@ -564,16 +564,6 @@ const CalendarAvailability = /*#__PURE__*/React.forwardRef((props_, ref) => {
     MenuProps: {
       portal: true,
       size: 'regular'
-    },
-    WrapperProps: {
-      style: {
-        width: 170,
-        minWidth: 'unset'
-      }
-    },
-    style: {
-      width: 170,
-      minWidth: 'unset'
     }
   }), endRight)), endHeader), /*#__PURE__*/React.createElement(Line, {
     ref: refs.calendar,

package/esm/CalendarWeek/CalendarWeek.js

@@ -199,6 +199,30 @@ const CalendarWeek = /*#__PURE__*/React.forwardRef((props_, ref) => {
       return item;
     });
   }, [times]);
+  const optionsStatus = React.useMemo(() => {
+    return [{
+      name: l('Working'),
+      value: 'working'
+    }, {
+      name: l('Not working'),
+      value: 'not-working'
+    }, {
+      name: l('On a break'),
+      value: 'break'
+    }, {
+      name: l('Scheduled'),
+      value: 'pending'
+    }, {
+      name: l('Rescheduled'),
+      value: 'rescheduled'
+    }, {
+      name: l('Cancelled'),
+      value: 'canceled'
+    }, {
+      name: l('Other'),
+      value: 'other'
+    }];
+  }, []);
   const getColor = React.useCallback(item => {
     let palette = theme.palette.color.neutral;
     if (item?.status === 'working') palette = theme.palette.color.success;
@@ -212,9 +236,9 @@ const CalendarWeek = /*#__PURE__*/React.forwardRef((props_, ref) => {
     return palette[rangeShade];
   }, [rangeShade, colors, theme]);
   const itemToText = React.useCallback(item => {
-    if (item === 'pending') return 'scheduled';
-    if (item === 'not-count-workout-session') return `don't count workout session`;
-    return item;
+    if (item === 'pending') return l('Scheduled');
+    if (item === 'not-count-workout-session') return l(`Don't count workout session`);
+    return optionsStatus?.find(itemStatus => itemStatus.value === item)?.name ?? l(item);
   }, []);
   const renderTimes = function (day, valuesAll) {
     let weekly = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;

package/esm/index.js

@@ -1,4 +1,4 @@
-/** @license UiReact v1.0.79
+/** @license UiReact v1.0.81
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onesy/ui-react",
-  "version": "1.0.79",
+  "version": "1.0.81",
   "description": "UI for React",
   "repository": "https://github.com/onesy-me/onesy.git",
   "author": "Lazar <lazareric2@gmail.com>",