@bigbinary/neeto-molecules 1.15.33 → 1.15.35

package/dist/EmojiPicker.js

@@ -34,6 +34,7 @@ var EmojiPicker = function EmojiPicker(_ref) {
     },
     position: "bottom-start",
     buttonProps: {
+      "data-cy": "emoji-picker-dropdown-icon",
       icon: SmileFaceGrey,
       tooltipProps: {
         content: t("neetoMolecules.common.emojiPicker"),

package/dist/EmojiPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.js","sources":["../src/components/EmojiPicker.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nimport data from \"@emoji-mart/data/sets/14/apple.json\";\nimport Picker from \"@emoji-mart/react\";\nimport { SmileFaceGrey } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nconst EmojiPicker = ({ onSelect, dropdownProps, open = false }) => {\n  const { t } = useTranslation();\n  const [isOpen, setIsOpen] = useState(open);\n\n  const onEmojiClick = emoji => {\n    setIsOpen(false);\n    onSelect(emoji);\n  };\n\n  return (\n    <Dropdown\n      {...{ isOpen }}\n      closeOnEsc\n      appendTo={() => document.body}\n      closeOnSelect={false}\n      dropdownProps={{ className: \"neeto-ui-shadow-s z-10\" }}\n      position=\"bottom-start\"\n      buttonProps={{\n        icon: SmileFaceGrey,\n        tooltipProps: {\n          content: t(\"neetoMolecules.common.emojiPicker\"),\n          position: \"top\",\n        },\n        onClick: () => setIsOpen(true),\n        style: \"text\",\n      }}\n      onClickOutside={() => setIsOpen(false)}\n      onClose={() => setIsOpen(false)}\n      {...dropdownProps}\n    >\n      <Picker\n        {...{ data }}\n        autoFocus\n        native\n        previewPosition=\"none\"\n        set=\"apple\"\n        skinTonePosition=\"none\"\n        theme=\"light\"\n        onEmojiSelect={onEmojiClick}\n      />\n    </Dropdown>\n  );\n};\n\nEmojiPicker.propTypes = {\n  /**\n   * Function to be called when an emoji is selected\n   */\n  onSelect: PropTypes.func,\n  /**\n   * Props to be passed to the dropdown component.\n   */\n  dropdownProps: PropTypes.shape({\n    strategy: PropTypes.oneOf(Object.values([\"absolute\", \"fixed\"])),\n  }),\n  /**\n   * Whether to open the emoji picker by default or not.\n   */\n  open: PropTypes.bool,\n};\n\nexport default EmojiPicker;\n"],"names":["EmojiPicker","_ref","onSelect","dropdownProps","_ref$open","open","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","onEmojiClick","emoji","React","createElement","Dropdown","_extends","closeOnEsc","appendTo","document","body","closeOnSelect","className","position","buttonProps","icon","SmileFaceGrey","tooltipProps","content","onClick","style","onClickOutside","onClose","Picker","data","autoFocus","previewPosition","set","skinTonePosition","theme","onEmojiSelect"],"mappings":";;;;;;;;;AASA,IAAMA,WAAW,GAAG,SAAdA,WAAWA,CAAAC,IAAA,EAAkD;AAAA,EAAA,IAA5CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IAAAC,SAAA,GAAAH,IAAA,CAAEI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,SAAA,CAAA;AAC1D,EAAA,IAAAE,eAAA,GAAcC,cAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AACT,EAAA,IAAAC,SAAA,GAA4BC,QAAQ,CAACL,IAAI,CAAC;IAAAM,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAnCI,IAAAA,MAAM,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,SAAS,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAExB,EAAA,IAAMI,YAAY,GAAG,SAAfA,YAAYA,CAAGC,KAAK,EAAI;IAC5BF,SAAS,CAAC,KAAK,CAAC,CAAA;IAChBZ,QAAQ,CAACc,KAAK,CAAC,CAAA;GAChB,CAAA;AAED,EAAA,oBACEC,cAAA,CAAAC,aAAA,CAACC,QAAQ,EAAAC,QAAA,CAAA;AACDP,IAAAA,MAAM,EAANA,MAAM;IACZQ,UAAU,EAAA,IAAA;IACVC,QAAQ,EAAE,SAAAA,QAAA,GAAA;MAAA,OAAMC,QAAQ,CAACC,IAAI,CAAA;KAAC;AAC9BC,IAAAA,aAAa,EAAE,KAAM;AACrBtB,IAAAA,aAAa,EAAE;AAAEuB,MAAAA,SAAS,EAAE,wBAAA;KAA2B;AACvDC,IAAAA,QAAQ,EAAC,cAAc;AACvBC,IAAAA,WAAW,EAAE;AACXC,MAAAA,IAAI,EAAEC,aAAa;AACnBC,MAAAA,YAAY,EAAE;AACZC,QAAAA,OAAO,EAAExB,CAAC,CAAC,mCAAmC,CAAC;AAC/CmB,QAAAA,QAAQ,EAAE,KAAA;OACX;MACDM,OAAO,EAAE,SAAAA,OAAA,GAAA;QAAA,OAAMnB,SAAS,CAAC,IAAI,CAAC,CAAA;AAAA,OAAA;AAC9BoB,MAAAA,KAAK,EAAE,MAAA;KACP;IACFC,cAAc,EAAE,SAAAA,cAAA,GAAA;MAAA,OAAMrB,SAAS,CAAC,KAAK,CAAC,CAAA;KAAC;IACvCsB,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAMtB,SAAS,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,EAC5BX,aAAa,CAEjBc,eAAAA,cAAA,CAAAC,aAAA,CAACmB,MAAM,EAAA;AACCC,IAAAA,IAAI,EAAJA,IAAI;IACVC,SAAS,EAAA,IAAA;IACT,QAAM,EAAA,IAAA;AACNC,IAAAA,eAAe,EAAC,MAAM;AACtBC,IAAAA,GAAG,EAAC,OAAO;AACXC,IAAAA,gBAAgB,EAAC,MAAM;AACvBC,IAAAA,KAAK,EAAC,OAAO;AACbC,IAAAA,aAAa,EAAE7B,YAAAA;AAAa,GAC7B,CACO,CAAC,CAAA;AAEf;;;;"}
+{"version":3,"file":"EmojiPicker.js","sources":["../src/components/EmojiPicker.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nimport data from \"@emoji-mart/data/sets/14/apple.json\";\nimport Picker from \"@emoji-mart/react\";\nimport { SmileFaceGrey } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nconst EmojiPicker = ({ onSelect, dropdownProps, open = false }) => {\n  const { t } = useTranslation();\n  const [isOpen, setIsOpen] = useState(open);\n\n  const onEmojiClick = emoji => {\n    setIsOpen(false);\n    onSelect(emoji);\n  };\n\n  return (\n    <Dropdown\n      {...{ isOpen }}\n      closeOnEsc\n      appendTo={() => document.body}\n      closeOnSelect={false}\n      dropdownProps={{ className: \"neeto-ui-shadow-s z-10\" }}\n      position=\"bottom-start\"\n      buttonProps={{\n        \"data-cy\": \"emoji-picker-dropdown-icon\",\n        icon: SmileFaceGrey,\n        tooltipProps: {\n          content: t(\"neetoMolecules.common.emojiPicker\"),\n          position: \"top\",\n        },\n        onClick: () => setIsOpen(true),\n        style: \"text\",\n      }}\n      onClickOutside={() => setIsOpen(false)}\n      onClose={() => setIsOpen(false)}\n      {...dropdownProps}\n    >\n      <Picker\n        {...{ data }}\n        autoFocus\n        native\n        previewPosition=\"none\"\n        set=\"apple\"\n        skinTonePosition=\"none\"\n        theme=\"light\"\n        onEmojiSelect={onEmojiClick}\n      />\n    </Dropdown>\n  );\n};\n\nEmojiPicker.propTypes = {\n  /**\n   * Function to be called when an emoji is selected\n   */\n  onSelect: PropTypes.func,\n  /**\n   * Props to be passed to the dropdown component.\n   */\n  dropdownProps: PropTypes.shape({\n    strategy: PropTypes.oneOf(Object.values([\"absolute\", \"fixed\"])),\n  }),\n  /**\n   * Whether to open the emoji picker by default or not.\n   */\n  open: PropTypes.bool,\n};\n\nexport default EmojiPicker;\n"],"names":["EmojiPicker","_ref","onSelect","dropdownProps","_ref$open","open","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","onEmojiClick","emoji","React","createElement","Dropdown","_extends","closeOnEsc","appendTo","document","body","closeOnSelect","className","position","buttonProps","icon","SmileFaceGrey","tooltipProps","content","onClick","style","onClickOutside","onClose","Picker","data","autoFocus","previewPosition","set","skinTonePosition","theme","onEmojiSelect"],"mappings":";;;;;;;;;AASA,IAAMA,WAAW,GAAG,SAAdA,WAAWA,CAAAC,IAAA,EAAkD;AAAA,EAAA,IAA5CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IAAAC,SAAA,GAAAH,IAAA,CAAEI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,SAAA,CAAA;AAC1D,EAAA,IAAAE,eAAA,GAAcC,cAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AACT,EAAA,IAAAC,SAAA,GAA4BC,QAAQ,CAACL,IAAI,CAAC;IAAAM,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAnCI,IAAAA,MAAM,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,SAAS,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAExB,EAAA,IAAMI,YAAY,GAAG,SAAfA,YAAYA,CAAGC,KAAK,EAAI;IAC5BF,SAAS,CAAC,KAAK,CAAC,CAAA;IAChBZ,QAAQ,CAACc,KAAK,CAAC,CAAA;GAChB,CAAA;AAED,EAAA,oBACEC,cAAA,CAAAC,aAAA,CAACC,QAAQ,EAAAC,QAAA,CAAA;AACDP,IAAAA,MAAM,EAANA,MAAM;IACZQ,UAAU,EAAA,IAAA;IACVC,QAAQ,EAAE,SAAAA,QAAA,GAAA;MAAA,OAAMC,QAAQ,CAACC,IAAI,CAAA;KAAC;AAC9BC,IAAAA,aAAa,EAAE,KAAM;AACrBtB,IAAAA,aAAa,EAAE;AAAEuB,MAAAA,SAAS,EAAE,wBAAA;KAA2B;AACvDC,IAAAA,QAAQ,EAAC,cAAc;AACvBC,IAAAA,WAAW,EAAE;AACX,MAAA,SAAS,EAAE,4BAA4B;AACvCC,MAAAA,IAAI,EAAEC,aAAa;AACnBC,MAAAA,YAAY,EAAE;AACZC,QAAAA,OAAO,EAAExB,CAAC,CAAC,mCAAmC,CAAC;AAC/CmB,QAAAA,QAAQ,EAAE,KAAA;OACX;MACDM,OAAO,EAAE,SAAAA,OAAA,GAAA;QAAA,OAAMnB,SAAS,CAAC,IAAI,CAAC,CAAA;AAAA,OAAA;AAC9BoB,MAAAA,KAAK,EAAE,MAAA;KACP;IACFC,cAAc,EAAE,SAAAA,cAAA,GAAA;MAAA,OAAMrB,SAAS,CAAC,KAAK,CAAC,CAAA;KAAC;IACvCsB,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAMtB,SAAS,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,EAC5BX,aAAa,CAEjBc,eAAAA,cAAA,CAAAC,aAAA,CAACmB,MAAM,EAAA;AACCC,IAAAA,IAAI,EAAJA,IAAI;IACVC,SAAS,EAAA,IAAA;IACT,QAAM,EAAA,IAAA;AACNC,IAAAA,eAAe,EAAC,MAAM;AACtBC,IAAAA,GAAG,EAAC,OAAO;AACXC,IAAAA,gBAAgB,EAAC,MAAM;AACvBC,IAAAA,KAAK,EAAC,OAAO;AACbC,IAAAA,aAAa,EAAE7B,YAAAA;AAAa,GAC7B,CACO,CAAC,CAAA;AAEf;;;;"}

package/dist/ShareRecording.js

@@ -0,0 +1,198 @@
+import { _ as _extends } from './extends-093996c9.js';
+import { _ as _defineProperty } from './defineProperty-549061a7.js';
+import { _ as _slicedToArray } from './slicedToArray-b4278ecd.js';
+import { _ as _objectWithoutProperties } from './objectWithoutProperties-a0edb288.js';
+import React__default, { useState, useEffect } from 'react';
+import { buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
+import { Modal, Typography, Spinner, Tooltip, Checkbox, Button, Input } from '@bigbinary/neetoui';
+import { not } from 'ramda';
+import { useTranslation } from 'react-i18next';
+import CopyToClipboardButton from './CopyToClipboardButton.js';
+import { n } from './inject-css-c86de496.js';
+import 'classnames';
+import '@bigbinary/neeto-commons-frontend/utils/general';
+import '@bigbinary/neeto-icons';
+
+var ONE_SECOND = 1;
+var ONE_MINUTE = 60 * ONE_SECOND;
+var ONE_HOUR = 60 * ONE_MINUTE;
+
+var css = ".neeto-molecules-share-timestamp-input .neeto-ui-input__wrapper{position:relative}.neeto-molecules-share-timestamp-input .neeto-ui-input__wrapper:not(:last-child):after{content:\":\";font-weight:bolder;position:absolute;right:-8px;top:4px}";
+n(css,{});
+
+var getTimeValues = function getTimeValues(playbackTimeInSec) {
+  var hour = Math.floor(playbackTimeInSec / ONE_HOUR);
+  playbackTimeInSec = playbackTimeInSec % ONE_HOUR;
+  var minute = Math.floor(playbackTimeInSec / ONE_MINUTE);
+  playbackTimeInSec = playbackTimeInSec % ONE_MINUTE;
+  var second = Math.floor(playbackTimeInSec / ONE_SECOND);
+  return {
+    hour: hour,
+    minute: minute,
+    second: second
+  };
+};
+var padZero = function padZero(number) {
+  var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+  var string = String(number);
+  var threshold = Math.pow(10, length - 1);
+  if (number < threshold) {
+    while (String(threshold).length > string.length) {
+      string = "0".concat(number);
+    }
+  }
+  return string;
+};
+var shouldRenderHoursInput = function shouldRenderHoursInput(duration) {
+  var hours = Math.floor(duration / ONE_HOUR);
+  return hours > 0;
+};
+
+var _excluded = ["recordingUrl", "totalDuration", "currentTimestamp", "buttonProps", "isLoading"];
+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) { _defineProperty(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; }
+var ShareRecording = function ShareRecording(_ref) {
+  var recordingUrl = _ref.recordingUrl,
+    totalDuration = _ref.totalDuration,
+    currentTimestamp = _ref.currentTimestamp,
+    _ref$buttonProps = _ref.buttonProps,
+    buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var _useState3 = useState(""),
+    _useState4 = _slicedToArray(_useState3, 2),
+    shareLink = _useState4[0],
+    setShareLink = _useState4[1];
+  var _useState5 = useState(0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    currentPlaybackTime = _useState6[0],
+    setCurrentPlaybackTime = _useState6[1];
+  var _useState7 = useState(currentTimestamp > 0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isPlaybackTimeCheckboxChecked = _useState8[0],
+    setIsPlaybackTimeCheckboxChecked = _useState8[1];
+  var _getTimeValues = getTimeValues(currentPlaybackTime),
+    hour = _getTimeValues.hour,
+    minute = _getTimeValues.minute,
+    second = _getTimeValues.second;
+  var handlePlaybackTimestampChange = function handlePlaybackTimestampChange(_ref2) {
+    var valueInSec = _ref2.valueInSec,
+      offset = _ref2.offset;
+    var intendedTimeInSec = currentPlaybackTime + valueInSec - offset;
+    setCurrentPlaybackTime(Math.min(intendedTimeInSec, totalDuration));
+  };
+  var handleClick = function handleClick() {
+    var _buttonProps$onClick;
+    setIsOpen(true);
+    buttonProps === null || buttonProps === void 0 ? void 0 : (_buttonProps$onClick = buttonProps.onClick) === null || _buttonProps$onClick === void 0 ? void 0 : _buttonProps$onClick.call(buttonProps);
+  };
+  var renderTimeInput = function renderTimeInput(_ref3) {
+    var value = _ref3.value,
+      onChange = _ref3.onChange,
+      max = _ref3.max;
+    return /*#__PURE__*/React__default.createElement(Input, {
+      max: max,
+      onChange: onChange,
+      value: value,
+      className: "w-14",
+      disabled: not(isPlaybackTimeCheckboxChecked),
+      min: 0,
+      type: "number",
+      unlimitedChars: false
+    });
+  };
+  useEffect(function () {
+    if (not(isOpen)) return;
+    setIsPlaybackTimeCheckboxChecked(currentTimestamp > 0);
+    setCurrentPlaybackTime(currentTimestamp > 0 ? currentTimestamp : 0);
+  }, [isOpen]);
+  useEffect(function () {
+    var playbackUrl = buildUrl(recordingUrl, _objectSpread({}, isPlaybackTimeCheckboxChecked && currentPlaybackTime > 0 && {
+      t: currentPlaybackTime
+    }));
+    setShareLink(playbackUrl);
+  }, [recordingUrl, isPlaybackTimeCheckboxChecked, currentPlaybackTime]);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Modal, _extends({}, _objectSpread({
+    isOpen: isOpen
+  }, otherProps), {
+    "data-cy": "share-modal",
+    size: "large",
+    onClose: function onClose() {
+      return setIsOpen(false);
+    }
+  }), /*#__PURE__*/React__default.createElement(Modal.Header, null, /*#__PURE__*/React__default.createElement(Typography, {
+    style: "h2"
+  }, t("neetoMolecules.shareRecording.title"))), /*#__PURE__*/React__default.createElement(Modal.Body, {
+    className: "flex flex-col space-y-2"
+  }, isLoading ? /*#__PURE__*/React__default.createElement(Spinner, {
+    className: "mx-auto"
+  }) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-ui-bg-gray-100 neeto-ui-rounded-lg mb-3 flex items-center justify-between p-2"
+  }, /*#__PURE__*/React__default.createElement(Tooltip, {
+    content: shareLink
+  }, /*#__PURE__*/React__default.createElement(Typography, {
+    className: "truncate",
+    style: "body2"
+  }, shareLink)), /*#__PURE__*/React__default.createElement(CopyToClipboardButton, {
+    className: "flex-shrink-0",
+    style: "secondary",
+    value: shareLink
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "flex items-center gap-x-2"
+  }, /*#__PURE__*/React__default.createElement(Checkbox, {
+    checked: isPlaybackTimeCheckboxChecked,
+    className: "grow-0",
+    "data-cy": "time-checkbox",
+    label: t("neetoMolecules.shareRecording.checkboxLabel"),
+    onChange: function onChange(_ref4) {
+      var checked = _ref4.target.checked;
+      return setIsPlaybackTimeCheckboxChecked(checked);
+    }
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-share-timestamp-input flex items-center gap-x-3",
+    "data-cy": "time-inputs"
+  }, shouldRenderHoursInput(totalDuration) && renderTimeInput({
+    max: 99,
+    value: padZero(hour),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_HOUR,
+        offset: hour * ONE_HOUR
+      });
+    }
+  }), renderTimeInput({
+    max: 59,
+    value: padZero(minute),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_MINUTE,
+        offset: minute * ONE_MINUTE
+      });
+    }
+  }), renderTimeInput({
+    max: 59,
+    value: padZero(second),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_SECOND,
+        offset: second * ONE_SECOND
+      });
+    }
+  })))))), /*#__PURE__*/React__default.createElement(Button, _extends({
+    "data-cy": "share-button",
+    label: t("neetoMolecules.common.actions.share"),
+    style: "secondary"
+  }, buttonProps, {
+    onClick: handleClick
+  })));
+};
+
+export { ShareRecording as default };
+//# sourceMappingURL=ShareRecording.js.map

package/dist/ShareRecording.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShareRecording.js","sources":["../src/components/ShareRecording/constants.js","../src/components/ShareRecording/utils.js","../src/components/ShareRecording/index.jsx"],"sourcesContent":["export const ONE_SECOND = 1;\nexport const ONE_MINUTE = 60 * ONE_SECOND;\nexport const ONE_HOUR = 60 * ONE_MINUTE;\n","import { ONE_HOUR, ONE_MINUTE, ONE_SECOND } from \"./constants\";\n\nexport const getTimeValues = playbackTimeInSec => {\n  const hour = Math.floor(playbackTimeInSec / ONE_HOUR);\n  playbackTimeInSec = playbackTimeInSec % ONE_HOUR;\n  const minute = Math.floor(playbackTimeInSec / ONE_MINUTE);\n  playbackTimeInSec = playbackTimeInSec % ONE_MINUTE;\n  const second = Math.floor(playbackTimeInSec / ONE_SECOND);\n\n  return { hour, minute, second };\n};\n\nexport const padZero = (number, length = 2) => {\n  let string = String(number);\n  const threshold = Math.pow(10, length - 1);\n\n  if (number < threshold) {\n    while (String(threshold).length > string.length) {\n      string = `0${number}`;\n    }\n  }\n\n  return string;\n};\n\nexport const shouldRenderHoursInput = duration => {\n  const hours = Math.floor(duration / ONE_HOUR);\n\n  return hours > 0;\n};\n","import React, { useState, useEffect } from \"react\";\n\nimport { buildUrl } from \"neetocommons/utils\";\nimport {\n  Modal,\n  Typography,\n  Input,\n  Checkbox,\n  Tooltip,\n  Spinner,\n  Button,\n} from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { not } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport CopyToClipboardButton from \"components/CopyToClipboardButton\";\n\nimport { ONE_HOUR, ONE_MINUTE, ONE_SECOND } from \"./constants\";\nimport \"./share-modal.scss\";\nimport { getTimeValues, padZero, shouldRenderHoursInput } from \"./utils\";\n\nconst ShareRecording = ({\n  recordingUrl,\n  totalDuration,\n  currentTimestamp,\n  buttonProps = {},\n  isLoading = false,\n  ...otherProps\n}) => {\n  const { t } = useTranslation();\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [shareLink, setShareLink] = useState(\"\");\n  const [currentPlaybackTime, setCurrentPlaybackTime] = useState(0);\n  const [isPlaybackTimeCheckboxChecked, setIsPlaybackTimeCheckboxChecked] =\n    useState(currentTimestamp > 0);\n\n  const { hour, minute, second } = getTimeValues(currentPlaybackTime);\n\n  const handlePlaybackTimestampChange = ({ valueInSec, offset }) => {\n    const intendedTimeInSec = currentPlaybackTime + valueInSec - offset;\n\n    setCurrentPlaybackTime(Math.min(intendedTimeInSec, totalDuration));\n  };\n\n  const handleClick = () => {\n    setIsOpen(true);\n    buttonProps?.onClick?.();\n  };\n\n  const renderTimeInput = ({ value, onChange, max }) => (\n    <Input\n      {...{ max, onChange, value }}\n      className=\"w-14\"\n      disabled={not(isPlaybackTimeCheckboxChecked)}\n      min={0}\n      type=\"number\"\n      unlimitedChars={false}\n    />\n  );\n\n  useEffect(() => {\n    if (not(isOpen)) return;\n\n    setIsPlaybackTimeCheckboxChecked(currentTimestamp > 0);\n    setCurrentPlaybackTime(currentTimestamp > 0 ? currentTimestamp : 0);\n  }, [isOpen]);\n\n  useEffect(() => {\n    const playbackUrl = buildUrl(recordingUrl, {\n      ...(isPlaybackTimeCheckboxChecked &&\n        currentPlaybackTime > 0 && { t: currentPlaybackTime }),\n    });\n\n    setShareLink(playbackUrl);\n  }, [recordingUrl, isPlaybackTimeCheckboxChecked, currentPlaybackTime]);\n\n  return (\n    <>\n      <Modal\n        {...{ isOpen, ...otherProps }}\n        data-cy=\"share-modal\"\n        size=\"large\"\n        onClose={() => setIsOpen(false)}\n      >\n        <Modal.Header>\n          <Typography style=\"h2\">\n            {t(\"neetoMolecules.shareRecording.title\")}\n          </Typography>\n        </Modal.Header>\n        <Modal.Body className=\"flex flex-col space-y-2\">\n          {isLoading ? (\n            <Spinner className=\"mx-auto\" />\n          ) : (\n            <>\n              <div className=\"neeto-ui-bg-gray-100 neeto-ui-rounded-lg mb-3 flex items-center justify-between p-2\">\n                <Tooltip content={shareLink}>\n                  <Typography className=\"truncate\" style=\"body2\">\n                    {shareLink}\n                  </Typography>\n                </Tooltip>\n                <CopyToClipboardButton\n                  className=\"flex-shrink-0\"\n                  style=\"secondary\"\n                  value={shareLink}\n                />\n              </div>\n              <div className=\"flex items-center gap-x-2\">\n                <Checkbox\n                  checked={isPlaybackTimeCheckboxChecked}\n                  className=\"grow-0\"\n                  data-cy=\"time-checkbox\"\n                  label={t(\"neetoMolecules.shareRecording.checkboxLabel\")}\n                  onChange={({ target: { checked } }) =>\n                    setIsPlaybackTimeCheckboxChecked(checked)\n                  }\n                />\n                <div\n                  className=\"neeto-molecules-share-timestamp-input flex items-center gap-x-3\"\n                  data-cy=\"time-inputs\"\n                >\n                  {shouldRenderHoursInput(totalDuration) &&\n                    renderTimeInput({\n                      max: 99,\n                      value: padZero(hour),\n                      onChange: e =>\n                        handlePlaybackTimestampChange({\n                          valueInSec: e.target.value * ONE_HOUR,\n                          offset: hour * ONE_HOUR,\n                        }),\n                    })}\n                  {renderTimeInput({\n                    max: 59,\n                    value: padZero(minute),\n                    onChange: e =>\n                      handlePlaybackTimestampChange({\n                        valueInSec: e.target.value * ONE_MINUTE,\n                        offset: minute * ONE_MINUTE,\n                      }),\n                  })}\n                  {renderTimeInput({\n                    max: 59,\n                    value: padZero(second),\n                    onChange: e =>\n                      handlePlaybackTimestampChange({\n                        valueInSec: e.target.value * ONE_SECOND,\n                        offset: second * ONE_SECOND,\n                      }),\n                  })}\n                </div>\n              </div>\n            </>\n          )}\n        </Modal.Body>\n      </Modal>\n      <Button\n        data-cy=\"share-button\"\n        label={t(\"neetoMolecules.common.actions.share\")}\n        style=\"secondary\"\n        {...buttonProps}\n        onClick={handleClick}\n      />\n    </>\n  );\n};\n\nShareRecording.propTypes = {\n  /**\n   * Recording URL used for building the share link.\n   */\n  recordingUrl: PropTypes.string.isRequired,\n  /**\n   * Total duration of the content being shared.\n   */\n  totalDuration: PropTypes.number.isRequired,\n  /**\n   * Current playback time of the recorded content in seconds.\n   */\n  currentTimestamp: PropTypes.number.isRequired,\n  /**\n   * Additional props for the button component.\n   */\n  buttonProps: PropTypes.object,\n  /**\n   * Boolean indicating whether content is loading or not.\n   */\n  isLoading: PropTypes.bool,\n};\n\nexport default ShareRecording;\n"],"names":["ONE_SECOND","ONE_MINUTE","ONE_HOUR","getTimeValues","playbackTimeInSec","hour","Math","floor","minute","second","padZero","number","length","arguments","undefined","string","String","threshold","pow","concat","shouldRenderHoursInput","duration","hours","ShareRecording","_ref","recordingUrl","totalDuration","currentTimestamp","_ref$buttonProps","buttonProps","_ref$isLoading","isLoading","otherProps","_objectWithoutProperties","_excluded","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","_useState3","_useState4","shareLink","setShareLink","_useState5","_useState6","currentPlaybackTime","setCurrentPlaybackTime","_useState7","_useState8","isPlaybackTimeCheckboxChecked","setIsPlaybackTimeCheckboxChecked","_getTimeValues","handlePlaybackTimestampChange","_ref2","valueInSec","offset","intendedTimeInSec","min","handleClick","_buttonProps$onClick","onClick","call","renderTimeInput","_ref3","value","onChange","max","React","createElement","Input","className","disabled","not","type","unlimitedChars","useEffect","playbackUrl","buildUrl","_objectSpread","Fragment","Modal","_extends","size","onClose","Header","Typography","style","Body","Spinner","Tooltip","content","CopyToClipboardButton","Checkbox","checked","label","_ref4","target","e","Button"],"mappings":"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"}

package/dist/cjs/EmojiPicker.js

@@ -42,6 +42,7 @@ var EmojiPicker = function EmojiPicker(_ref) {
     },
     position: "bottom-start",
     buttonProps: {
+      "data-cy": "emoji-picker-dropdown-icon",
       icon: neetoIcons.SmileFaceGrey,
       tooltipProps: {
         content: t("neetoMolecules.common.emojiPicker"),

package/dist/cjs/EmojiPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.js","sources":["../../src/components/EmojiPicker.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nimport data from \"@emoji-mart/data/sets/14/apple.json\";\nimport Picker from \"@emoji-mart/react\";\nimport { SmileFaceGrey } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nconst EmojiPicker = ({ onSelect, dropdownProps, open = false }) => {\n  const { t } = useTranslation();\n  const [isOpen, setIsOpen] = useState(open);\n\n  const onEmojiClick = emoji => {\n    setIsOpen(false);\n    onSelect(emoji);\n  };\n\n  return (\n    <Dropdown\n      {...{ isOpen }}\n      closeOnEsc\n      appendTo={() => document.body}\n      closeOnSelect={false}\n      dropdownProps={{ className: \"neeto-ui-shadow-s z-10\" }}\n      position=\"bottom-start\"\n      buttonProps={{\n        icon: SmileFaceGrey,\n        tooltipProps: {\n          content: t(\"neetoMolecules.common.emojiPicker\"),\n          position: \"top\",\n        },\n        onClick: () => setIsOpen(true),\n        style: \"text\",\n      }}\n      onClickOutside={() => setIsOpen(false)}\n      onClose={() => setIsOpen(false)}\n      {...dropdownProps}\n    >\n      <Picker\n        {...{ data }}\n        autoFocus\n        native\n        previewPosition=\"none\"\n        set=\"apple\"\n        skinTonePosition=\"none\"\n        theme=\"light\"\n        onEmojiSelect={onEmojiClick}\n      />\n    </Dropdown>\n  );\n};\n\nEmojiPicker.propTypes = {\n  /**\n   * Function to be called when an emoji is selected\n   */\n  onSelect: PropTypes.func,\n  /**\n   * Props to be passed to the dropdown component.\n   */\n  dropdownProps: PropTypes.shape({\n    strategy: PropTypes.oneOf(Object.values([\"absolute\", \"fixed\"])),\n  }),\n  /**\n   * Whether to open the emoji picker by default or not.\n   */\n  open: PropTypes.bool,\n};\n\nexport default EmojiPicker;\n"],"names":["EmojiPicker","_ref","onSelect","dropdownProps","_ref$open","open","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","onEmojiClick","emoji","React","createElement","Dropdown","_extends","closeOnEsc","appendTo","document","body","closeOnSelect","className","position","buttonProps","icon","SmileFaceGrey","tooltipProps","content","onClick","style","onClickOutside","onClose","Picker","data","autoFocus","previewPosition","set","skinTonePosition","theme","onEmojiSelect"],"mappings":";;;;;;;;;;;;;;;;;AASA,IAAMA,WAAW,GAAG,SAAdA,WAAWA,CAAAC,IAAA,EAAkD;AAAA,EAAA,IAA5CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IAAAC,SAAA,GAAAH,IAAA,CAAEI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,SAAA,CAAA;AAC1D,EAAA,IAAAE,eAAA,GAAcC,2BAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AACT,EAAA,IAAAC,SAAA,GAA4BC,cAAQ,CAACL,IAAI,CAAC;IAAAM,UAAA,GAAAC,4BAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAnCI,IAAAA,MAAM,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,SAAS,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAExB,EAAA,IAAMI,YAAY,GAAG,SAAfA,YAAYA,CAAGC,KAAK,EAAI;IAC5BF,SAAS,CAAC,KAAK,CAAC,CAAA;IAChBZ,QAAQ,CAACc,KAAK,CAAC,CAAA;GAChB,CAAA;AAED,EAAA,oBACEC,yBAAA,CAAAC,aAAA,CAACC,gBAAQ,EAAAC,iBAAA,CAAA;AACDP,IAAAA,MAAM,EAANA,MAAM;IACZQ,UAAU,EAAA,IAAA;IACVC,QAAQ,EAAE,SAAAA,QAAA,GAAA;MAAA,OAAMC,QAAQ,CAACC,IAAI,CAAA;KAAC;AAC9BC,IAAAA,aAAa,EAAE,KAAM;AACrBtB,IAAAA,aAAa,EAAE;AAAEuB,MAAAA,SAAS,EAAE,wBAAA;KAA2B;AACvDC,IAAAA,QAAQ,EAAC,cAAc;AACvBC,IAAAA,WAAW,EAAE;AACXC,MAAAA,IAAI,EAAEC,wBAAa;AACnBC,MAAAA,YAAY,EAAE;AACZC,QAAAA,OAAO,EAAExB,CAAC,CAAC,mCAAmC,CAAC;AAC/CmB,QAAAA,QAAQ,EAAE,KAAA;OACX;MACDM,OAAO,EAAE,SAAAA,OAAA,GAAA;QAAA,OAAMnB,SAAS,CAAC,IAAI,CAAC,CAAA;AAAA,OAAA;AAC9BoB,MAAAA,KAAK,EAAE,MAAA;KACP;IACFC,cAAc,EAAE,SAAAA,cAAA,GAAA;MAAA,OAAMrB,SAAS,CAAC,KAAK,CAAC,CAAA;KAAC;IACvCsB,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAMtB,SAAS,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,EAC5BX,aAAa,CAEjBc,eAAAA,yBAAA,CAAAC,aAAA,CAACmB,0BAAM,EAAA;AACCC,IAAAA,IAAI,EAAJA,wBAAI;IACVC,SAAS,EAAA,IAAA;IACT,QAAM,EAAA,IAAA;AACNC,IAAAA,eAAe,EAAC,MAAM;AACtBC,IAAAA,GAAG,EAAC,OAAO;AACXC,IAAAA,gBAAgB,EAAC,MAAM;AACvBC,IAAAA,KAAK,EAAC,OAAO;AACbC,IAAAA,aAAa,EAAE7B,YAAAA;AAAa,GAC7B,CACO,CAAC,CAAA;AAEf;;;;"}
+{"version":3,"file":"EmojiPicker.js","sources":["../../src/components/EmojiPicker.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nimport data from \"@emoji-mart/data/sets/14/apple.json\";\nimport Picker from \"@emoji-mart/react\";\nimport { SmileFaceGrey } from \"neetoicons\";\nimport { Dropdown } from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nconst EmojiPicker = ({ onSelect, dropdownProps, open = false }) => {\n  const { t } = useTranslation();\n  const [isOpen, setIsOpen] = useState(open);\n\n  const onEmojiClick = emoji => {\n    setIsOpen(false);\n    onSelect(emoji);\n  };\n\n  return (\n    <Dropdown\n      {...{ isOpen }}\n      closeOnEsc\n      appendTo={() => document.body}\n      closeOnSelect={false}\n      dropdownProps={{ className: \"neeto-ui-shadow-s z-10\" }}\n      position=\"bottom-start\"\n      buttonProps={{\n        \"data-cy\": \"emoji-picker-dropdown-icon\",\n        icon: SmileFaceGrey,\n        tooltipProps: {\n          content: t(\"neetoMolecules.common.emojiPicker\"),\n          position: \"top\",\n        },\n        onClick: () => setIsOpen(true),\n        style: \"text\",\n      }}\n      onClickOutside={() => setIsOpen(false)}\n      onClose={() => setIsOpen(false)}\n      {...dropdownProps}\n    >\n      <Picker\n        {...{ data }}\n        autoFocus\n        native\n        previewPosition=\"none\"\n        set=\"apple\"\n        skinTonePosition=\"none\"\n        theme=\"light\"\n        onEmojiSelect={onEmojiClick}\n      />\n    </Dropdown>\n  );\n};\n\nEmojiPicker.propTypes = {\n  /**\n   * Function to be called when an emoji is selected\n   */\n  onSelect: PropTypes.func,\n  /**\n   * Props to be passed to the dropdown component.\n   */\n  dropdownProps: PropTypes.shape({\n    strategy: PropTypes.oneOf(Object.values([\"absolute\", \"fixed\"])),\n  }),\n  /**\n   * Whether to open the emoji picker by default or not.\n   */\n  open: PropTypes.bool,\n};\n\nexport default EmojiPicker;\n"],"names":["EmojiPicker","_ref","onSelect","dropdownProps","_ref$open","open","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","onEmojiClick","emoji","React","createElement","Dropdown","_extends","closeOnEsc","appendTo","document","body","closeOnSelect","className","position","buttonProps","icon","SmileFaceGrey","tooltipProps","content","onClick","style","onClickOutside","onClose","Picker","data","autoFocus","previewPosition","set","skinTonePosition","theme","onEmojiSelect"],"mappings":";;;;;;;;;;;;;;;;;AASA,IAAMA,WAAW,GAAG,SAAdA,WAAWA,CAAAC,IAAA,EAAkD;AAAA,EAAA,IAA5CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IAAAC,SAAA,GAAAH,IAAA,CAAEI,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,SAAA,CAAA;AAC1D,EAAA,IAAAE,eAAA,GAAcC,2BAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AACT,EAAA,IAAAC,SAAA,GAA4BC,cAAQ,CAACL,IAAI,CAAC;IAAAM,UAAA,GAAAC,4BAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAnCI,IAAAA,MAAM,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,SAAS,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAExB,EAAA,IAAMI,YAAY,GAAG,SAAfA,YAAYA,CAAGC,KAAK,EAAI;IAC5BF,SAAS,CAAC,KAAK,CAAC,CAAA;IAChBZ,QAAQ,CAACc,KAAK,CAAC,CAAA;GAChB,CAAA;AAED,EAAA,oBACEC,yBAAA,CAAAC,aAAA,CAACC,gBAAQ,EAAAC,iBAAA,CAAA;AACDP,IAAAA,MAAM,EAANA,MAAM;IACZQ,UAAU,EAAA,IAAA;IACVC,QAAQ,EAAE,SAAAA,QAAA,GAAA;MAAA,OAAMC,QAAQ,CAACC,IAAI,CAAA;KAAC;AAC9BC,IAAAA,aAAa,EAAE,KAAM;AACrBtB,IAAAA,aAAa,EAAE;AAAEuB,MAAAA,SAAS,EAAE,wBAAA;KAA2B;AACvDC,IAAAA,QAAQ,EAAC,cAAc;AACvBC,IAAAA,WAAW,EAAE;AACX,MAAA,SAAS,EAAE,4BAA4B;AACvCC,MAAAA,IAAI,EAAEC,wBAAa;AACnBC,MAAAA,YAAY,EAAE;AACZC,QAAAA,OAAO,EAAExB,CAAC,CAAC,mCAAmC,CAAC;AAC/CmB,QAAAA,QAAQ,EAAE,KAAA;OACX;MACDM,OAAO,EAAE,SAAAA,OAAA,GAAA;QAAA,OAAMnB,SAAS,CAAC,IAAI,CAAC,CAAA;AAAA,OAAA;AAC9BoB,MAAAA,KAAK,EAAE,MAAA;KACP;IACFC,cAAc,EAAE,SAAAA,cAAA,GAAA;MAAA,OAAMrB,SAAS,CAAC,KAAK,CAAC,CAAA;KAAC;IACvCsB,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAMtB,SAAS,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,EAC5BX,aAAa,CAEjBc,eAAAA,yBAAA,CAAAC,aAAA,CAACmB,0BAAM,EAAA;AACCC,IAAAA,IAAI,EAAJA,wBAAI;IACVC,SAAS,EAAA,IAAA;IACT,QAAM,EAAA,IAAA;AACNC,IAAAA,eAAe,EAAC,MAAM;AACtBC,IAAAA,GAAG,EAAC,OAAO;AACXC,IAAAA,gBAAgB,EAAC,MAAM;AACvBC,IAAAA,KAAK,EAAC,OAAO;AACbC,IAAAA,aAAa,EAAE7B,YAAAA;AAAa,GAC7B,CACO,CAAC,CAAA;AAEf;;;;"}

package/dist/cjs/ShareRecording.js

@@ -0,0 +1,204 @@
+'use strict';
+
+var _extends = require('./extends-1b35a664.js');
+var defineProperty = require('./defineProperty-886ed289.js');
+var slicedToArray = require('./slicedToArray-f320d9e7.js');
+var objectWithoutProperties = require('./objectWithoutProperties-2fed2d7d.js');
+var React = require('react');
+var utils = require('@bigbinary/neeto-commons-frontend/utils');
+var neetoui = require('@bigbinary/neetoui');
+var ramda = require('ramda');
+var reactI18next = require('react-i18next');
+var CopyToClipboardButton = require('./CopyToClipboardButton.js');
+var injectCss = require('./inject-css-80a5faa3.js');
+require('classnames');
+require('@bigbinary/neeto-commons-frontend/utils/general');
+require('@bigbinary/neeto-icons');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ONE_SECOND = 1;
+var ONE_MINUTE = 60 * ONE_SECOND;
+var ONE_HOUR = 60 * ONE_MINUTE;
+
+var css = ".neeto-molecules-share-timestamp-input .neeto-ui-input__wrapper{position:relative}.neeto-molecules-share-timestamp-input .neeto-ui-input__wrapper:not(:last-child):after{content:\":\";font-weight:bolder;position:absolute;right:-8px;top:4px}";
+injectCss.n(css,{});
+
+var getTimeValues = function getTimeValues(playbackTimeInSec) {
+  var hour = Math.floor(playbackTimeInSec / ONE_HOUR);
+  playbackTimeInSec = playbackTimeInSec % ONE_HOUR;
+  var minute = Math.floor(playbackTimeInSec / ONE_MINUTE);
+  playbackTimeInSec = playbackTimeInSec % ONE_MINUTE;
+  var second = Math.floor(playbackTimeInSec / ONE_SECOND);
+  return {
+    hour: hour,
+    minute: minute,
+    second: second
+  };
+};
+var padZero = function padZero(number) {
+  var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+  var string = String(number);
+  var threshold = Math.pow(10, length - 1);
+  if (number < threshold) {
+    while (String(threshold).length > string.length) {
+      string = "0".concat(number);
+    }
+  }
+  return string;
+};
+var shouldRenderHoursInput = function shouldRenderHoursInput(duration) {
+  var hours = Math.floor(duration / ONE_HOUR);
+  return hours > 0;
+};
+
+var _excluded = ["recordingUrl", "totalDuration", "currentTimestamp", "buttonProps", "isLoading"];
+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) { defineProperty._defineProperty(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; }
+var ShareRecording = function ShareRecording(_ref) {
+  var recordingUrl = _ref.recordingUrl,
+    totalDuration = _ref.totalDuration,
+    currentTimestamp = _ref.currentTimestamp,
+    _ref$buttonProps = _ref.buttonProps,
+    buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    otherProps = objectWithoutProperties._objectWithoutProperties(_ref, _excluded);
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var _useState = React.useState(false),
+    _useState2 = slicedToArray._slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var _useState3 = React.useState(""),
+    _useState4 = slicedToArray._slicedToArray(_useState3, 2),
+    shareLink = _useState4[0],
+    setShareLink = _useState4[1];
+  var _useState5 = React.useState(0),
+    _useState6 = slicedToArray._slicedToArray(_useState5, 2),
+    currentPlaybackTime = _useState6[0],
+    setCurrentPlaybackTime = _useState6[1];
+  var _useState7 = React.useState(currentTimestamp > 0),
+    _useState8 = slicedToArray._slicedToArray(_useState7, 2),
+    isPlaybackTimeCheckboxChecked = _useState8[0],
+    setIsPlaybackTimeCheckboxChecked = _useState8[1];
+  var _getTimeValues = getTimeValues(currentPlaybackTime),
+    hour = _getTimeValues.hour,
+    minute = _getTimeValues.minute,
+    second = _getTimeValues.second;
+  var handlePlaybackTimestampChange = function handlePlaybackTimestampChange(_ref2) {
+    var valueInSec = _ref2.valueInSec,
+      offset = _ref2.offset;
+    var intendedTimeInSec = currentPlaybackTime + valueInSec - offset;
+    setCurrentPlaybackTime(Math.min(intendedTimeInSec, totalDuration));
+  };
+  var handleClick = function handleClick() {
+    var _buttonProps$onClick;
+    setIsOpen(true);
+    buttonProps === null || buttonProps === void 0 ? void 0 : (_buttonProps$onClick = buttonProps.onClick) === null || _buttonProps$onClick === void 0 ? void 0 : _buttonProps$onClick.call(buttonProps);
+  };
+  var renderTimeInput = function renderTimeInput(_ref3) {
+    var value = _ref3.value,
+      onChange = _ref3.onChange,
+      max = _ref3.max;
+    return /*#__PURE__*/React__default["default"].createElement(neetoui.Input, {
+      max: max,
+      onChange: onChange,
+      value: value,
+      className: "w-14",
+      disabled: ramda.not(isPlaybackTimeCheckboxChecked),
+      min: 0,
+      type: "number",
+      unlimitedChars: false
+    });
+  };
+  React.useEffect(function () {
+    if (ramda.not(isOpen)) return;
+    setIsPlaybackTimeCheckboxChecked(currentTimestamp > 0);
+    setCurrentPlaybackTime(currentTimestamp > 0 ? currentTimestamp : 0);
+  }, [isOpen]);
+  React.useEffect(function () {
+    var playbackUrl = utils.buildUrl(recordingUrl, _objectSpread({}, isPlaybackTimeCheckboxChecked && currentPlaybackTime > 0 && {
+      t: currentPlaybackTime
+    }));
+    setShareLink(playbackUrl);
+  }, [recordingUrl, isPlaybackTimeCheckboxChecked, currentPlaybackTime]);
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Modal, _extends._extends({}, _objectSpread({
+    isOpen: isOpen
+  }, otherProps), {
+    "data-cy": "share-modal",
+    size: "large",
+    onClose: function onClose() {
+      return setIsOpen(false);
+    }
+  }), /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Header, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+    style: "h2"
+  }, t("neetoMolecules.shareRecording.title"))), /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Body, {
+    className: "flex flex-col space-y-2"
+  }, isLoading ? /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, {
+    className: "mx-auto"
+  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "neeto-ui-bg-gray-100 neeto-ui-rounded-lg mb-3 flex items-center justify-between p-2"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, {
+    content: shareLink
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+    className: "truncate",
+    style: "body2"
+  }, shareLink)), /*#__PURE__*/React__default["default"].createElement(CopyToClipboardButton, {
+    className: "flex-shrink-0",
+    style: "secondary",
+    value: shareLink
+  })), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "flex items-center gap-x-2"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Checkbox, {
+    checked: isPlaybackTimeCheckboxChecked,
+    className: "grow-0",
+    "data-cy": "time-checkbox",
+    label: t("neetoMolecules.shareRecording.checkboxLabel"),
+    onChange: function onChange(_ref4) {
+      var checked = _ref4.target.checked;
+      return setIsPlaybackTimeCheckboxChecked(checked);
+    }
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "neeto-molecules-share-timestamp-input flex items-center gap-x-3",
+    "data-cy": "time-inputs"
+  }, shouldRenderHoursInput(totalDuration) && renderTimeInput({
+    max: 99,
+    value: padZero(hour),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_HOUR,
+        offset: hour * ONE_HOUR
+      });
+    }
+  }), renderTimeInput({
+    max: 59,
+    value: padZero(minute),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_MINUTE,
+        offset: minute * ONE_MINUTE
+      });
+    }
+  }), renderTimeInput({
+    max: 59,
+    value: padZero(second),
+    onChange: function onChange(e) {
+      return handlePlaybackTimestampChange({
+        valueInSec: e.target.value * ONE_SECOND,
+        offset: second * ONE_SECOND
+      });
+    }
+  })))))), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, _extends._extends({
+    "data-cy": "share-button",
+    label: t("neetoMolecules.common.actions.share"),
+    style: "secondary"
+  }, buttonProps, {
+    onClick: handleClick
+  })));
+};
+
+module.exports = ShareRecording;
+//# sourceMappingURL=ShareRecording.js.map

package/dist/cjs/ShareRecording.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShareRecording.js","sources":["../../src/components/ShareRecording/constants.js","../../src/components/ShareRecording/utils.js","../../src/components/ShareRecording/index.jsx"],"sourcesContent":["export const ONE_SECOND = 1;\nexport const ONE_MINUTE = 60 * ONE_SECOND;\nexport const ONE_HOUR = 60 * ONE_MINUTE;\n","import { ONE_HOUR, ONE_MINUTE, ONE_SECOND } from \"./constants\";\n\nexport const getTimeValues = playbackTimeInSec => {\n  const hour = Math.floor(playbackTimeInSec / ONE_HOUR);\n  playbackTimeInSec = playbackTimeInSec % ONE_HOUR;\n  const minute = Math.floor(playbackTimeInSec / ONE_MINUTE);\n  playbackTimeInSec = playbackTimeInSec % ONE_MINUTE;\n  const second = Math.floor(playbackTimeInSec / ONE_SECOND);\n\n  return { hour, minute, second };\n};\n\nexport const padZero = (number, length = 2) => {\n  let string = String(number);\n  const threshold = Math.pow(10, length - 1);\n\n  if (number < threshold) {\n    while (String(threshold).length > string.length) {\n      string = `0${number}`;\n    }\n  }\n\n  return string;\n};\n\nexport const shouldRenderHoursInput = duration => {\n  const hours = Math.floor(duration / ONE_HOUR);\n\n  return hours > 0;\n};\n","import React, { useState, useEffect } from \"react\";\n\nimport { buildUrl } from \"neetocommons/utils\";\nimport {\n  Modal,\n  Typography,\n  Input,\n  Checkbox,\n  Tooltip,\n  Spinner,\n  Button,\n} from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { not } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport CopyToClipboardButton from \"components/CopyToClipboardButton\";\n\nimport { ONE_HOUR, ONE_MINUTE, ONE_SECOND } from \"./constants\";\nimport \"./share-modal.scss\";\nimport { getTimeValues, padZero, shouldRenderHoursInput } from \"./utils\";\n\nconst ShareRecording = ({\n  recordingUrl,\n  totalDuration,\n  currentTimestamp,\n  buttonProps = {},\n  isLoading = false,\n  ...otherProps\n}) => {\n  const { t } = useTranslation();\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [shareLink, setShareLink] = useState(\"\");\n  const [currentPlaybackTime, setCurrentPlaybackTime] = useState(0);\n  const [isPlaybackTimeCheckboxChecked, setIsPlaybackTimeCheckboxChecked] =\n    useState(currentTimestamp > 0);\n\n  const { hour, minute, second } = getTimeValues(currentPlaybackTime);\n\n  const handlePlaybackTimestampChange = ({ valueInSec, offset }) => {\n    const intendedTimeInSec = currentPlaybackTime + valueInSec - offset;\n\n    setCurrentPlaybackTime(Math.min(intendedTimeInSec, totalDuration));\n  };\n\n  const handleClick = () => {\n    setIsOpen(true);\n    buttonProps?.onClick?.();\n  };\n\n  const renderTimeInput = ({ value, onChange, max }) => (\n    <Input\n      {...{ max, onChange, value }}\n      className=\"w-14\"\n      disabled={not(isPlaybackTimeCheckboxChecked)}\n      min={0}\n      type=\"number\"\n      unlimitedChars={false}\n    />\n  );\n\n  useEffect(() => {\n    if (not(isOpen)) return;\n\n    setIsPlaybackTimeCheckboxChecked(currentTimestamp > 0);\n    setCurrentPlaybackTime(currentTimestamp > 0 ? currentTimestamp : 0);\n  }, [isOpen]);\n\n  useEffect(() => {\n    const playbackUrl = buildUrl(recordingUrl, {\n      ...(isPlaybackTimeCheckboxChecked &&\n        currentPlaybackTime > 0 && { t: currentPlaybackTime }),\n    });\n\n    setShareLink(playbackUrl);\n  }, [recordingUrl, isPlaybackTimeCheckboxChecked, currentPlaybackTime]);\n\n  return (\n    <>\n      <Modal\n        {...{ isOpen, ...otherProps }}\n        data-cy=\"share-modal\"\n        size=\"large\"\n        onClose={() => setIsOpen(false)}\n      >\n        <Modal.Header>\n          <Typography style=\"h2\">\n            {t(\"neetoMolecules.shareRecording.title\")}\n          </Typography>\n        </Modal.Header>\n        <Modal.Body className=\"flex flex-col space-y-2\">\n          {isLoading ? (\n            <Spinner className=\"mx-auto\" />\n          ) : (\n            <>\n              <div className=\"neeto-ui-bg-gray-100 neeto-ui-rounded-lg mb-3 flex items-center justify-between p-2\">\n                <Tooltip content={shareLink}>\n                  <Typography className=\"truncate\" style=\"body2\">\n                    {shareLink}\n                  </Typography>\n                </Tooltip>\n                <CopyToClipboardButton\n                  className=\"flex-shrink-0\"\n                  style=\"secondary\"\n                  value={shareLink}\n                />\n              </div>\n              <div className=\"flex items-center gap-x-2\">\n                <Checkbox\n                  checked={isPlaybackTimeCheckboxChecked}\n                  className=\"grow-0\"\n                  data-cy=\"time-checkbox\"\n                  label={t(\"neetoMolecules.shareRecording.checkboxLabel\")}\n                  onChange={({ target: { checked } }) =>\n                    setIsPlaybackTimeCheckboxChecked(checked)\n                  }\n                />\n                <div\n                  className=\"neeto-molecules-share-timestamp-input flex items-center gap-x-3\"\n                  data-cy=\"time-inputs\"\n                >\n                  {shouldRenderHoursInput(totalDuration) &&\n                    renderTimeInput({\n                      max: 99,\n                      value: padZero(hour),\n                      onChange: e =>\n                        handlePlaybackTimestampChange({\n                          valueInSec: e.target.value * ONE_HOUR,\n                          offset: hour * ONE_HOUR,\n                        }),\n                    })}\n                  {renderTimeInput({\n                    max: 59,\n                    value: padZero(minute),\n                    onChange: e =>\n                      handlePlaybackTimestampChange({\n                        valueInSec: e.target.value * ONE_MINUTE,\n                        offset: minute * ONE_MINUTE,\n                      }),\n                  })}\n                  {renderTimeInput({\n                    max: 59,\n                    value: padZero(second),\n                    onChange: e =>\n                      handlePlaybackTimestampChange({\n                        valueInSec: e.target.value * ONE_SECOND,\n                        offset: second * ONE_SECOND,\n                      }),\n                  })}\n                </div>\n              </div>\n            </>\n          )}\n        </Modal.Body>\n      </Modal>\n      <Button\n        data-cy=\"share-button\"\n        label={t(\"neetoMolecules.common.actions.share\")}\n        style=\"secondary\"\n        {...buttonProps}\n        onClick={handleClick}\n      />\n    </>\n  );\n};\n\nShareRecording.propTypes = {\n  /**\n   * Recording URL used for building the share link.\n   */\n  recordingUrl: PropTypes.string.isRequired,\n  /**\n   * Total duration of the content being shared.\n   */\n  totalDuration: PropTypes.number.isRequired,\n  /**\n   * Current playback time of the recorded content in seconds.\n   */\n  currentTimestamp: PropTypes.number.isRequired,\n  /**\n   * Additional props for the button component.\n   */\n  buttonProps: PropTypes.object,\n  /**\n   * Boolean indicating whether content is loading or not.\n   */\n  isLoading: PropTypes.bool,\n};\n\nexport default ShareRecording;\n"],"names":["ONE_SECOND","ONE_MINUTE","ONE_HOUR","getTimeValues","playbackTimeInSec","hour","Math","floor","minute","second","padZero","number","length","arguments","undefined","string","String","threshold","pow","concat","shouldRenderHoursInput","duration","hours","ShareRecording","_ref","recordingUrl","totalDuration","currentTimestamp","_ref$buttonProps","buttonProps","_ref$isLoading","isLoading","otherProps","_objectWithoutProperties","_excluded","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isOpen","setIsOpen","_useState3","_useState4","shareLink","setShareLink","_useState5","_useState6","currentPlaybackTime","setCurrentPlaybackTime","_useState7","_useState8","isPlaybackTimeCheckboxChecked","setIsPlaybackTimeCheckboxChecked","_getTimeValues","handlePlaybackTimestampChange","_ref2","valueInSec","offset","intendedTimeInSec","min","handleClick","_buttonProps$onClick","onClick","call","renderTimeInput","_ref3","value","onChange","max","React","createElement","Input","className","disabled","not","type","unlimitedChars","useEffect","playbackUrl","buildUrl","_objectSpread","Fragment","Modal","_extends","size","onClose","Header","Typography","style","Body","Spinner","Tooltip","content","CopyToClipboardButton","Checkbox","checked","label","_ref4","target","e","Button"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAO,IAAMA,UAAU,GAAG,CAAC,CAAA;AACpB,IAAMC,UAAU,GAAG,EAAE,GAAGD,UAAU,CAAA;AAClC,IAAME,QAAQ,GAAG,EAAE,GAAGD,UAAU;;;;;ACAhC,IAAME,aAAa,GAAG,SAAhBA,aAAaA,CAAGC,iBAAiB,EAAI;EAChD,IAAMC,IAAI,GAAGC,IAAI,CAACC,KAAK,CAACH,iBAAiB,GAAGF,QAAQ,CAAC,CAAA;EACrDE,iBAAiB,GAAGA,iBAAiB,GAAGF,QAAQ,CAAA;EAChD,IAAMM,MAAM,GAAGF,IAAI,CAACC,KAAK,CAACH,iBAAiB,GAAGH,UAAU,CAAC,CAAA;EACzDG,iBAAiB,GAAGA,iBAAiB,GAAGH,UAAU,CAAA;EAClD,IAAMQ,MAAM,GAAGH,IAAI,CAACC,KAAK,CAACH,iBAAiB,GAAGJ,UAAU,CAAC,CAAA;EAEzD,OAAO;AAAEK,IAAAA,IAAI,EAAJA,IAAI;AAAEG,IAAAA,MAAM,EAANA,MAAM;AAAEC,IAAAA,MAAM,EAANA,MAAAA;GAAQ,CAAA;AACjC,CAAC,CAAA;AAEM,IAAMC,OAAO,GAAG,SAAVA,OAAOA,CAAIC,MAAM,EAAiB;AAAA,EAAA,IAAfC,MAAM,GAAAC,SAAA,CAAAD,MAAA,GAAA,CAAA,IAAAC,SAAA,CAAA,CAAA,CAAA,KAAAC,SAAA,GAAAD,SAAA,CAAA,CAAA,CAAA,GAAG,CAAC,CAAA;AACxC,EAAA,IAAIE,MAAM,GAAGC,MAAM,CAACL,MAAM,CAAC,CAAA;EAC3B,IAAMM,SAAS,GAAGX,IAAI,CAACY,GAAG,CAAC,EAAE,EAAEN,MAAM,GAAG,CAAC,CAAC,CAAA;EAE1C,IAAID,MAAM,GAAGM,SAAS,EAAE;IACtB,OAAOD,MAAM,CAACC,SAAS,CAAC,CAACL,MAAM,GAAGG,MAAM,CAACH,MAAM,EAAE;AAC/CG,MAAAA,MAAM,GAAAI,GAAAA,CAAAA,MAAA,CAAOR,MAAM,CAAE,CAAA;AACvB,KAAA;AACF,GAAA;AAEA,EAAA,OAAOI,MAAM,CAAA;AACf,CAAC,CAAA;AAEM,IAAMK,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAGC,QAAQ,EAAI;EAChD,IAAMC,KAAK,GAAGhB,IAAI,CAACC,KAAK,CAACc,QAAQ,GAAGnB,QAAQ,CAAC,CAAA;EAE7C,OAAOoB,KAAK,GAAG,CAAC,CAAA;AAClB,CAAC;;;;;ACPD,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAOd;AAAA,EAAA,IANJC,YAAY,GAAAD,IAAA,CAAZC,YAAY;IACZC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IACbC,gBAAgB,GAAAH,IAAA,CAAhBG,gBAAgB;IAAAC,gBAAA,GAAAJ,IAAA,CAChBK,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,gBAAA;IAAAE,cAAA,GAAAN,IAAA,CAChBO,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,cAAA;AACdE,IAAAA,UAAU,GAAAC,gDAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AAEb,EAAA,IAAAC,eAAA,GAAcC,2BAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC,CAAA;AAET,EAAA,IAAAC,SAAA,GAA4BC,cAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,4BAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAApCI,IAAAA,MAAM,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,SAAS,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AACxB,EAAA,IAAAI,UAAA,GAAkCL,cAAQ,CAAC,EAAE,CAAC;IAAAM,UAAA,GAAAJ,4BAAA,CAAAG,UAAA,EAAA,CAAA,CAAA;AAAvCE,IAAAA,SAAS,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,YAAY,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AAC9B,EAAA,IAAAG,UAAA,GAAsDT,cAAQ,CAAC,CAAC,CAAC;IAAAU,UAAA,GAAAR,4BAAA,CAAAO,UAAA,EAAA,CAAA,CAAA;AAA1DE,IAAAA,mBAAmB,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,sBAAsB,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AAClD,EAAA,IAAAG,UAAA,GACEb,cAAQ,CAACZ,gBAAgB,GAAG,CAAC,CAAC;IAAA0B,UAAA,GAAAZ,4BAAA,CAAAW,UAAA,EAAA,CAAA,CAAA;AADzBE,IAAAA,6BAA6B,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,gCAAgC,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AAGtE,EAAA,IAAAG,cAAA,GAAiCrD,aAAa,CAAC+C,mBAAmB,CAAC;IAA3D7C,IAAI,GAAAmD,cAAA,CAAJnD,IAAI;IAAEG,MAAM,GAAAgD,cAAA,CAANhD,MAAM;IAAEC,MAAM,GAAA+C,cAAA,CAAN/C,MAAM,CAAA;AAE5B,EAAA,IAAMgD,6BAA6B,GAAG,SAAhCA,6BAA6BA,CAAAC,KAAA,EAA+B;AAAA,IAAA,IAAzBC,UAAU,GAAAD,KAAA,CAAVC,UAAU;MAAEC,MAAM,GAAAF,KAAA,CAANE,MAAM,CAAA;AACzD,IAAA,IAAMC,iBAAiB,GAAGX,mBAAmB,GAAGS,UAAU,GAAGC,MAAM,CAAA;IAEnET,sBAAsB,CAAC7C,IAAI,CAACwD,GAAG,CAACD,iBAAiB,EAAEnC,aAAa,CAAC,CAAC,CAAA;GACnE,CAAA;AAED,EAAA,IAAMqC,WAAW,GAAG,SAAdA,WAAWA,GAAS;AAAA,IAAA,IAAAC,oBAAA,CAAA;IACxBrB,SAAS,CAAC,IAAI,CAAC,CAAA;AACfd,IAAAA,WAAW,aAAXA,WAAW,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,CAAAmC,oBAAA,GAAXnC,WAAW,CAAEoC,OAAO,MAAAD,IAAAA,IAAAA,oBAAA,uBAApBA,oBAAA,CAAAE,IAAA,CAAArC,WAAuB,CAAC,CAAA;GACzB,CAAA;AAED,EAAA,IAAMsC,eAAe,GAAG,SAAlBA,eAAeA,CAAAC,KAAA,EAAA;AAAA,IAAA,IAAMC,KAAK,GAAAD,KAAA,CAALC,KAAK;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;MAAEC,GAAG,GAAAH,KAAA,CAAHG,GAAG,CAAA;AAAA,IAAA,oBAC7CC,yBAAA,CAAAC,aAAA,CAACC,aAAK,EAAA;AACEH,MAAAA,GAAG,EAAHA,GAAG;AAAED,MAAAA,QAAQ,EAARA,QAAQ;AAAED,MAAAA,KAAK,EAALA,KAAK;AAC1BM,MAAAA,SAAS,EAAC,MAAM;AAChBC,MAAAA,QAAQ,EAAEC,SAAG,CAACvB,6BAA6B,CAAE;AAC7CQ,MAAAA,GAAG,EAAE,CAAE;AACPgB,MAAAA,IAAI,EAAC,QAAQ;AACbC,MAAAA,cAAc,EAAE,KAAA;AAAM,KACvB,CAAC,CAAA;GACH,CAAA;AAEDC,EAAAA,eAAS,CAAC,YAAM;AACd,IAAA,IAAIH,SAAG,CAACnC,MAAM,CAAC,EAAE,OAAA;AAEjBa,IAAAA,gCAAgC,CAAC5B,gBAAgB,GAAG,CAAC,CAAC,CAAA;IACtDwB,sBAAsB,CAACxB,gBAAgB,GAAG,CAAC,GAAGA,gBAAgB,GAAG,CAAC,CAAC,CAAA;AACrE,GAAC,EAAE,CAACe,MAAM,CAAC,CAAC,CAAA;AAEZsC,EAAAA,eAAS,CAAC,YAAM;AACd,IAAA,IAAMC,WAAW,GAAGC,cAAQ,CAACzD,YAAY,EAAA0D,aAAA,CAAA,EAAA,EACnC7B,6BAA6B,IAC/BJ,mBAAmB,GAAG,CAAC,IAAI;AAAEb,MAAAA,CAAC,EAAEa,mBAAAA;AAAoB,KAAC,CACxD,CAAC,CAAA;IAEFH,YAAY,CAACkC,WAAW,CAAC,CAAA;GAC1B,EAAE,CAACxD,YAAY,EAAE6B,6BAA6B,EAAEJ,mBAAmB,CAAC,CAAC,CAAA;AAEtE,EAAA,oBACEsB,yBAAA,CAAAC,aAAA,CAAAD,yBAAA,CAAAY,QAAA,EAAA,IAAA,eACEZ,yBAAA,CAAAC,aAAA,CAACY,aAAK,EAAAC,iBAAA,KAAAH,aAAA,CAAA;AACEzC,IAAAA,MAAM,EAANA,MAAAA;AAAM,GAAA,EAAKV,UAAU,CAAA,EAAA;AAC3B,IAAA,SAAA,EAAQ,aAAa;AACrBuD,IAAAA,IAAI,EAAC,OAAO;IACZC,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAM7C,SAAS,CAAC,KAAK,CAAC,CAAA;AAAA,KAAA;AAAC,GAAA,CAAA,eAEhC6B,yBAAA,CAAAC,aAAA,CAACY,aAAK,CAACI,MAAM,EAAA,IAAA,eACXjB,yBAAA,CAAAC,aAAA,CAACiB,kBAAU,EAAA;AAACC,IAAAA,KAAK,EAAC,IAAA;AAAI,GAAA,EACnBtD,CAAC,CAAC,qCAAqC,CAC9B,CACA,CAAC,eACfmC,yBAAA,CAAAC,aAAA,CAACY,aAAK,CAACO,IAAI,EAAA;AAACjB,IAAAA,SAAS,EAAC,yBAAA;AAAyB,GAAA,EAC5C5C,SAAS,gBACRyC,yBAAA,CAAAC,aAAA,CAACoB,eAAO,EAAA;AAAClB,IAAAA,SAAS,EAAC,SAAA;AAAS,GAAE,CAAC,gBAE/BH,yBAAA,CAAAC,aAAA,CAAAD,yBAAA,CAAAY,QAAA,EAAA,IAAA,eACEZ,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKE,IAAAA,SAAS,EAAC,qFAAA;AAAqF,GAAA,eAClGH,yBAAA,CAAAC,aAAA,CAACqB,eAAO,EAAA;AAACC,IAAAA,OAAO,EAAEjD,SAAAA;AAAU,GAAA,eAC1B0B,yBAAA,CAAAC,aAAA,CAACiB,kBAAU,EAAA;AAACf,IAAAA,SAAS,EAAC,UAAU;AAACgB,IAAAA,KAAK,EAAC,OAAA;GACpC7C,EAAAA,SACS,CACL,CAAC,eACV0B,yBAAA,CAAAC,aAAA,CAACuB,qBAAqB,EAAA;AACpBrB,IAAAA,SAAS,EAAC,eAAe;AACzBgB,IAAAA,KAAK,EAAC,WAAW;AACjBtB,IAAAA,KAAK,EAAEvB,SAAAA;AAAU,GAClB,CACE,CAAC,eACN0B,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKE,IAAAA,SAAS,EAAC,2BAAA;AAA2B,GAAA,eACxCH,yBAAA,CAAAC,aAAA,CAACwB,gBAAQ,EAAA;AACPC,IAAAA,OAAO,EAAE5C,6BAA8B;AACvCqB,IAAAA,SAAS,EAAC,QAAQ;AAClB,IAAA,SAAA,EAAQ,eAAe;AACvBwB,IAAAA,KAAK,EAAE9D,CAAC,CAAC,6CAA6C,CAAE;IACxDiC,QAAQ,EAAE,SAAAA,QAAAA,CAAA8B,KAAA,EAAA;AAAA,MAAA,IAAaF,OAAO,GAAAE,KAAA,CAAjBC,MAAM,CAAIH,OAAO,CAAA;MAAA,OAC5B3C,gCAAgC,CAAC2C,OAAO,CAAC,CAAA;AAAA,KAAA;AAC1C,GACF,CAAC,eACF1B,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEE,IAAAA,SAAS,EAAC,iEAAiE;IAC3E,SAAQ,EAAA,aAAA;AAAa,GAAA,EAEpBvD,sBAAsB,CAACM,aAAa,CAAC,IACpCyC,eAAe,CAAC;AACdI,IAAAA,GAAG,EAAE,EAAE;AACPF,IAAAA,KAAK,EAAE3D,OAAO,CAACL,IAAI,CAAC;IACpBiE,QAAQ,EAAE,SAAAA,QAAAA,CAAAgC,CAAC,EAAA;AAAA,MAAA,OACT7C,6BAA6B,CAAC;AAC5BE,QAAAA,UAAU,EAAE2C,CAAC,CAACD,MAAM,CAAChC,KAAK,GAAGnE,QAAQ;QACrC0D,MAAM,EAAEvD,IAAI,GAAGH,QAAAA;AACjB,OAAC,CAAC,CAAA;AAAA,KAAA;GACL,CAAC,EACHiE,eAAe,CAAC;AACfI,IAAAA,GAAG,EAAE,EAAE;AACPF,IAAAA,KAAK,EAAE3D,OAAO,CAACF,MAAM,CAAC;IACtB8D,QAAQ,EAAE,SAAAA,QAAAA,CAAAgC,CAAC,EAAA;AAAA,MAAA,OACT7C,6BAA6B,CAAC;AAC5BE,QAAAA,UAAU,EAAE2C,CAAC,CAACD,MAAM,CAAChC,KAAK,GAAGpE,UAAU;QACvC2D,MAAM,EAAEpD,MAAM,GAAGP,UAAAA;AACnB,OAAC,CAAC,CAAA;AAAA,KAAA;GACL,CAAC,EACDkE,eAAe,CAAC;AACfI,IAAAA,GAAG,EAAE,EAAE;AACPF,IAAAA,KAAK,EAAE3D,OAAO,CAACD,MAAM,CAAC;IACtB6D,QAAQ,EAAE,SAAAA,QAAAA,CAAAgC,CAAC,EAAA;AAAA,MAAA,OACT7C,6BAA6B,CAAC;AAC5BE,QAAAA,UAAU,EAAE2C,CAAC,CAACD,MAAM,CAAChC,KAAK,GAAGrE,UAAU;QACvC4D,MAAM,EAAEnD,MAAM,GAAGT,UAAAA;AACnB,OAAC,CAAC,CAAA;AAAA,KAAA;AACN,GAAC,CACE,CACF,CACL,CAEM,CACP,CAAC,eACRwE,yBAAA,CAAAC,aAAA,CAAC8B,cAAM,EAAAjB,iBAAA,CAAA;AACL,IAAA,SAAA,EAAQ,cAAc;AACtBa,IAAAA,KAAK,EAAE9D,CAAC,CAAC,qCAAqC,CAAE;AAChDsD,IAAAA,KAAK,EAAC,WAAA;AAAW,GAAA,EACb9D,WAAW,EAAA;AACfoC,IAAAA,OAAO,EAAEF,WAAAA;AAAY,GAAA,CACtB,CACD,CAAC,CAAA;AAEP;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-molecules",
-  "version": "1.15.33",
+  "version": "1.15.35",
   "description": "A package of reusable molecular components for neeto products.",
   "repository": "git@github.com:bigbinary/neeto-molecules.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",

package/src/translations/en.json

@@ -29,7 +29,8 @@
         "archive": "Archive",
         "unArchive": "Unarchive",
         "enable": "Enable",
-        "disable": "Disable"
+        "disable": "Disable",
+        "share": "Share"
       },
       "or": "or",
       "name": "name",
@@ -762,6 +763,10 @@
     },
     "reactions": {
       "content": "{{groupedNames, anyCase}} reacted."
+    },
+    "shareRecording": {
+      "title": "Share recording",
+      "checkboxLabel": "Start playback at"
     }
   }
 }

package/types/ShareRecording.d.ts

@@ -0,0 +1,35 @@
+import { ButtonProps } from "@bigbinary/neetoui";
+import React from "react";
+/**
+ *
+ * The ShareRecording component provides a modal interface for sharing recordings.
+ *
+ * It includes options for specifying playback timestamps and generates shareable
+ *
+ * links accordingly. The modal interface allows users to copy the shareable link
+ *
+ * and adjust playback timestamps.
+ *
+ * @example 
+ *
+ * <ShareRecording
+ *   recordingUrl="https://example.com/recording"
+ *   totalDuration={3600} // Total duration in seconds (e.g., 1 hour)
+ *   currentTimestamp={300} // Current playback time in seconds
+ *   buttonProps={{
+ *     onClick: () => {
+ *       console.log("Share button has been clicked");
+ *     },
+ *   }}
+ *   isLoading={false}
+ * />
+ * @endexample
+*/
+declare const ShareRecording: React.FC<{
+  recordingUrl: string;
+  totalDuration: number;
+  currentTimestamp: number;
+  buttonProps?: ButtonProps;
+  isLoading?: boolean;
+}>;
+export default ShareRecording;