@bigbinary/neeto-molecules 1.0.1 → 1.0.3

package/dist/KeyboardShortcuts.js

@@ -1,7 +1,7 @@
 import React, { useDebugValue } from 'react';
 import { useHotKeys } from '@bigbinary/neeto-commons-frontend/react-utils';
 import { Close } from '@bigbinary/neeto-icons';
-import { Kbd, Typography, Button } from '@bigbinary/neetoui';
+import { Typography, Kbd, Button } from '@bigbinary/neetoui';
 import { manager } from '@bigbinary/neetoui/managers';
 import { useTranslation } from 'react-i18next';
 import i18next from 'i18next';
@@ -743,30 +743,23 @@ var classnames$1 = {exports: {}};
 
 var classnames = classnames$1.exports;
 
-var DisplayHotKey = function DisplayHotKey(_ref) {
-  var hotkey = _ref.hotkey;
-  var isSequentialHotkey = hotkey.includes(" ");
-  var isSimultaneousHotkey = hotkey.includes("+");
-  var isSingleKeyHotkey = !isSequentialHotkey && !isSimultaneousHotkey;
-  var sequences = [];
-  if (isSingleKeyHotkey) return /*#__PURE__*/React.createElement(Kbd, {
-    keyName: hotkey
-  });
-  if (isSequentialHotkey) {
-    sequences = hotkey.split(" ");
-  } else if (isSimultaneousHotkey) {
-    sequences = hotkey.split("+");
-  }
-  return sequences.map(function (keyName, idx) {
-    return /*#__PURE__*/React.createElement(React.Fragment, {
-      key: idx
-    }, /*#__PURE__*/React.createElement(Kbd, {
-      keyName: keyName
-    }), isSequentialHotkey && idx + 1 !== sequences.length && /*#__PURE__*/React.createElement(Kbd, {
-      keyName: "then"
-    }));
-  });
+var KEY_SHORTFORM_MAP = {
+  command: "cmd",
+  escape: "esc",
+  control: "ctrl",
+  option: "opt"
+};
+var MAC_TO_WINDOWS_KEYS_MAP = {
+  option: "alt",
+  command: "ctrl",
+  "return": "enter",
+  "delete": "backspace"
+};
+var OS = {
+  mac: "OS X",
+  windows: "Windows"
 };
+var FULL_SHORTCUTS_LINK_PROP_NAME = "fullShortcutsLink";
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
@@ -2055,46 +2048,34 @@ var platform$1 = {exports: {}};
 
 var platform = platform$1.exports;
 
-var KEY_SHORTFORM_MAP = {
-  command: "cmd",
-  escape: "esc",
-  control: "ctrl",
-  option: "opt"
-};
-var MAC_TO_WINDOWS_KEYS_MAP = {
-  option: "alt",
-  command: "ctrl",
-  "return": "enter",
-  "delete": "backspace"
-};
-var OS = {
-  mac: "OS X",
-  windows: "Windows"
-};
-
-var shortenHotKey = function shortenHotKey(hotkey) {
-  var result = hotkey;
-  Object.entries(KEY_SHORTFORM_MAP).forEach(function (_ref) {
+var convertHotKeyToWindows = function convertHotKeyToWindows(hotkey) {
+  toPairs(MAC_TO_WINDOWS_KEYS_MAP).forEach(function (_ref) {
     var _ref2 = _slicedToArray(_ref, 2),
-      longform = _ref2[0],
-      shortform = _ref2[1];
-    result = result.replaceAll(longform, shortform);
+      macKey = _ref2[0],
+      windowsKey = _ref2[1];
+    hotkey = hotkey.replaceAll(macKey, windowsKey);
   });
-  return result;
+  return hotkey;
+};
+var replaceDeleteKeyWithBackspace = function replaceDeleteKeyWithBackspace(hotkey) {
+  return hotkey.replaceAll("delete", "backspace");
 };
 var convertHotkeyToUsersPlatform = function convertHotkeyToUsersPlatform(hotkey) {
   var _platformInfo$os, _platformInfo$os$fami;
   var platformInfo = platform.parse(navigator.userAgent);
   var isOSX = (_platformInfo$os = platformInfo.os) === null || _platformInfo$os === void 0 ? void 0 : (_platformInfo$os$fami = _platformInfo$os.family) === null || _platformInfo$os$fami === void 0 ? void 0 : _platformInfo$os$fami.includes(OS.mac);
-  if (isOSX) return hotkey;
-  var hotkeyForWindows = hotkey;
-  toPairs(MAC_TO_WINDOWS_KEYS_MAP).forEach(function (_ref3) {
+  if (isOSX) return replaceDeleteKeyWithBackspace(hotkey);
+  return convertHotKeyToWindows(hotkey);
+};
+var shortenHotKey = function shortenHotKey(hotkey) {
+  var result = hotkey;
+  Object.entries(KEY_SHORTFORM_MAP).forEach(function (_ref3) {
     var _ref4 = _slicedToArray(_ref3, 2),
-      macKey = _ref4[0],
-      windowsKey = _ref4[1];
-    hotkeyForWindows = hotkeyForWindows.replaceAll(macKey, windowsKey);
+      longform = _ref4[0],
+      shortform = _ref4[1];
+    result = result.replaceAll(longform, shortform);
   });
-  return hotkeyForWindows;
+  return result;
 };
 var getGlobalShortcuts = function getGlobalShortcuts() {
   return _defineProperty({}, i18next.t("neetoMolecules.keyboardShortcuts.global.categoryName"), {
@@ -2109,35 +2090,71 @@ var getGlobalShortcuts = function getGlobalShortcuts() {
   });
 };
 
+var HotKey = function HotKey(_ref) {
+  var description = _ref.description,
+    sequence = _ref.sequence;
+  var hotkey = shortenHotKey(convertHotkeyToUsersPlatform(sequence));
+  var isSequentialHotkey = hotkey.includes(" ");
+  var isSimultaneousHotkey = hotkey.includes("+");
+  var isSingleKeyHotkey = !isSequentialHotkey && !isSimultaneousHotkey;
+  var sequences = [];
+  if (isSingleKeyHotkey) {
+    sequences = [hotkey];
+  } else if (isSequentialHotkey) {
+    sequences = hotkey.split(" ");
+  } else if (isSimultaneousHotkey) {
+    sequences = hotkey.split("+");
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: "my-3 px-4"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center justify-between gap-3",
+    "data-testid": "hotkey-item"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-gray-800",
+    lineHeight: "normal",
+    style: "body2"
+  }, description), /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center gap-1"
+  }, sequences.map(function (keyName, idx) {
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: idx
+    }, /*#__PURE__*/React.createElement(Kbd, {
+      keyName: keyName
+    }), isSequentialHotkey && idx + 1 !== sequences.length && /*#__PURE__*/React.createElement(Kbd, {
+      keyName: "then"
+    }));
+  }))));
+};
+
 var HotKeyList = function HotKeyList(_ref) {
   var hotkeys = _ref.hotkeys;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   return Object.keys(hotkeys).map(function (categoryName) {
+    var categoryValues = hotkeys[categoryName];
+    var fullShortcutsLink = categoryValues[FULL_SHORTCUTS_LINK_PROP_NAME];
     return /*#__PURE__*/React.createElement(React.Fragment, {
       key: categoryName
     }, /*#__PURE__*/React.createElement(Typography, {
       className: "neeto-ui-text-gray-800 mt-4 px-4 text-xs font-bold",
       lineHeight: "normal",
       style: "body2"
-    }, categoryName), Object.entries(hotkeys[categoryName]).map(function (_ref2) {
+    }, categoryName), Object.entries(categoryValues).map(function (_ref2) {
       var _ref3 = _slicedToArray(_ref2, 2),
         _ref3$ = _ref3[1],
         sequence = _ref3$.sequence,
         description = _ref3$.description;
-      return /*#__PURE__*/React.createElement("div", {
-        className: "my-3 px-4",
-        key: sequence
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "flex items-center justify-between gap-3",
-        "data-testid": "hotkey-item"
-      }, /*#__PURE__*/React.createElement(Typography, {
-        className: "neeto-ui-text-gray-800",
-        lineHeight: "normal",
-        style: "body2"
-      }, description), /*#__PURE__*/React.createElement("div", {
-        className: "flex items-center gap-1"
-      }, /*#__PURE__*/React.createElement(DisplayHotKey, {
-        hotkey: shortenHotKey(convertHotkeyToUsersPlatform(sequence))
-      }))));
+      return sequence && /*#__PURE__*/React.createElement(HotKey, {
+        description: description,
+        key: sequence,
+        sequence: sequence
+      });
+    }), fullShortcutsLink && /*#__PURE__*/React.createElement(Button, {
+      className: "pl-4 mb-3",
+      href: fullShortcutsLink,
+      style: "link",
+      label: t("neetoMolecules.keyboardShortcuts.viewFullListOfShortcuts")
     }));
   });
 };
@@ -2163,13 +2180,9 @@ var KeyboardShortcutsPane = function KeyboardShortcutsPane(_ref) {
     return setIsOpen(function (prevIsOpen) {
       return !prevIsOpen;
     });
-  }, {
-    mode: "global"
   });
   useHotKeys(shortcuts.close.sequence, function () {
     return setIsOpen(false);
-  }, {
-    mode: "global"
   });
   return /*#__PURE__*/React.createElement("div", {
     className: classnames("neeto-commons-keyboard-shortcuts-pane neeto-ui-border-gray-300 transition-width ml-auto min-h-screen border-l bg-white duration-300 ease-in-out overflow-y-scroll", {

package/dist/Schedule.cjs.js

@@ -864,12 +864,13 @@ var Header = function Header(_ref) {
     }
   }, t("neetoMolecules.common.actions.edit"))))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex items-center space-x-2"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Clock, {
-    size: 20
-  }), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, {
+    content: t("neetoMolecules.schedule.timezoneTooltip"),
+    position: "bottom"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     style: "h4",
     weight: "medium"
-  }, timeZoneAndTime), /*#__PURE__*/React__default["default"].createElement(neetoui.Dropdown, {
+  }, timeZoneAndTime)), /*#__PURE__*/React__default["default"].createElement(neetoui.Dropdown, {
     icon: neetoIcons.MenuVertical,
     buttonProps: {
       style: "text",
@@ -879,7 +880,7 @@ var Header = function Header(_ref) {
     onClick: function onClick() {
       return window.location.href = MY_PROFILE_URL;
     }
-  }, t("neetoMolecules.common.actions.edit"))))));
+  }, t("neetoMolecules.common.actions.changeTimezone"))))));
 };
 
 var Schedule = /*#__PURE__*/React.forwardRef(function (_ref, scheduleRef) {

package/dist/Schedule.js

@@ -3,7 +3,7 @@ import { findIndexBy, isPresent, toLabelAndValue, isNotPresent, noop } from '@bi
 import { FieldArray, ErrorMessage, useFormikContext, Formik, Form as Form$1 } from 'formik';
 import { uniq, pluck, difference, append, without, identity, pick, assoc } from 'ramda';
 import { timeFormat, joinHyphenCase } from '@bigbinary/neeto-commons-frontend/utils';
-import { Typography, Button, Dropdown, Label, Checkbox as Checkbox$1 } from '@bigbinary/neetoui';
+import { Typography, Button, Dropdown, Label, Checkbox as Checkbox$1, Tooltip } from '@bigbinary/neetoui';
 import { useTranslation } from 'react-i18next';
 import dayjs from 'dayjs';
 import i18next from 'i18next';
@@ -12,7 +12,7 @@ import customParseFormat from 'dayjs/plugin/customParseFormat';
 import timezone from 'dayjs/plugin/timezone';
 import utc from 'dayjs/plugin/utc';
 import weekday from 'dayjs/plugin/weekday';
-import { Delete, Plus, Copy, MenuVertical, Clock } from '@bigbinary/neeto-icons';
+import { Delete, Plus, Copy, MenuVertical } from '@bigbinary/neeto-icons';
 import { Select, Checkbox } from '@bigbinary/neetoui/formik';
 
 var DAYS = ["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"];
@@ -833,12 +833,13 @@ var Header = function Header(_ref) {
     }
   }, t("neetoMolecules.common.actions.edit"))))), /*#__PURE__*/React.createElement("div", {
     className: "flex items-center space-x-2"
-  }, /*#__PURE__*/React.createElement(Clock, {
-    size: 20
-  }), /*#__PURE__*/React.createElement(Typography, {
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    content: t("neetoMolecules.schedule.timezoneTooltip"),
+    position: "bottom"
+  }, /*#__PURE__*/React.createElement(Typography, {
     style: "h4",
     weight: "medium"
-  }, timeZoneAndTime), /*#__PURE__*/React.createElement(Dropdown, {
+  }, timeZoneAndTime)), /*#__PURE__*/React.createElement(Dropdown, {
     icon: MenuVertical,
     buttonProps: {
       style: "text",
@@ -848,7 +849,7 @@ var Header = function Header(_ref) {
     onClick: function onClick() {
       return window.location.href = MY_PROFILE_URL;
     }
-  }, t("neetoMolecules.common.actions.edit"))))));
+  }, t("neetoMolecules.common.actions.changeTimezone"))))));
 };
 
 var Schedule = /*#__PURE__*/forwardRef(function (_ref, scheduleRef) {