@micromag/core 0.3.119 → 0.3.124

package/es/components.js

@@ -38,6 +38,7 @@ import { getSizeWithinBounds } from '@folklore/size';
 import { faCommentDots } from '@fortawesome/free-solid-svg-icons/faCommentDots';
 import { faCheck } from '@fortawesome/free-solid-svg-icons/faCheck';
 import { faTimes } from '@fortawesome/free-solid-svg-icons/faTimes';
+import { faCircle } from '@fortawesome/free-solid-svg-icons/faCircle';
 import { faPercent } from '@fortawesome/free-solid-svg-icons/faPercent';
 import { useSpring } from '@react-spring/core';
 import { animated } from '@react-spring/web';
@@ -3435,7 +3436,7 @@ var Timeline = function Timeline(props) {
 };
 
 /* eslint-disable react/jsx-props-no-spreading, react/destructuring-assignment, react/prop-types */
-var Title = function Title(props) {
+var Title$1 = function Title(props) {
   return /*#__PURE__*/React.createElement(PlaceholderText, Object.assign({}, props, {
     className: classNames([props.className, styles$c.title]),
     height: 0.5,
@@ -3865,6 +3866,23 @@ var Answer$1 = function Answer(_ref) {
   })));
 };
 
+var Title = function Title(props) {
+  return /*#__PURE__*/React.createElement(PlaceholderBlock, Object.assign({}, props, {
+    width: "100%",
+    height: "100%",
+    className: classNames([styles$c.container, _defineProperty({}, props.className, props.className !== null)])
+  }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faCircle,
+    className: styles$c.icon
+  }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faCircle,
+    className: styles$c.icon
+  }), /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faCircle,
+    className: styles$c.icon
+  }));
+};
+
 var styles$2 = {"container":"micromag-core-placeholders-survey-answer-container","block":"micromag-core-placeholders-survey-answer-block","percent":"micromag-core-placeholders-survey-answer-percent","percentIcon":"micromag-core-placeholders-survey-answer-percentIcon"};
 
 var Answer = function Answer(_ref) {
@@ -3905,12 +3923,13 @@ var Placeholders = /*#__PURE__*/Object.freeze({
     MapPath: MapPath,
     QuizAnswer: Answer$1,
     Quote: Quote,
+    ShareOptions: Title,
     ShortText: ShortText,
     Subtitle: Subtitle,
     SurveyAnswer: Answer,
     Text: TextPlaceholder,
     Timeline: Timeline,
-    Title: Title,
+    Title: Title$1,
     Video: Video,
     Video360: Video360,
     VideoLoop: VideoLoop
@@ -4343,4 +4362,4 @@ var LinkStyle = function LinkStyle(_ref) {
 LinkStyle.propTypes = propTypes;
 LinkStyle.defaultProps = defaultProps;
 
-export { BackButton, Breadcrumb, Button$1 as Button, Buttons, Card, Close, CollapsablePanel, Date$1 as Date, Detector, Dropdown as DropdownMenu, ElementComponent as Element, Empty, FieldForm, FontFaces, Form, FormPanel, HighlightStyle, Label, Link, LinkStyle, Media, Menu, Meta, Modal, ModalDialog, ModalPortal, Modals, Navbar, PaginationMenu as Pagination, Panel, PanelPortal, Panels, AdFrame as PlaceholderAdFrame, AdImage as PlaceholderAdImage, Audio as PlaceholderAudio, Button as PlaceholderButton, Image as PlaceholderImage, Line as PlaceholderLine, Map as PlaceholderMap, MapPath as PlaceholderMapPath, Quote as PlaceholderQuote, ShortText as PlaceholderShortText, Subtitle as PlaceholderSubtitle, TextPlaceholder as PlaceholderText, Timeline as PlaceholderTimeline, Title as PlaceholderTitle, Video as PlaceholderVideo, Video360 as PlaceholderVideo360, VideoLoop as PlaceholderVideoLoop, Screen$1 as Screen, ScreenElement, Placeholder as ScreenPlaceholder, Preview as ScreenPreview, ScreenSizer, Screens, Slideshow, Spinner, TabsMenu as Tabs, Transitions, TransitionsStagger, UploadModal };
+export { BackButton, Breadcrumb, Button$1 as Button, Buttons, Card, Close, CollapsablePanel, Date$1 as Date, Detector, Dropdown as DropdownMenu, ElementComponent as Element, Empty, FieldForm, FontFaces, Form, FormPanel, HighlightStyle, Label, Link, LinkStyle, Media, Menu, Meta, Modal, ModalDialog, ModalPortal, Modals, Navbar, PaginationMenu as Pagination, Panel, PanelPortal, Panels, AdFrame as PlaceholderAdFrame, AdImage as PlaceholderAdImage, Audio as PlaceholderAudio, Button as PlaceholderButton, Image as PlaceholderImage, Line as PlaceholderLine, Map as PlaceholderMap, MapPath as PlaceholderMapPath, Quote as PlaceholderQuote, ShortText as PlaceholderShortText, Subtitle as PlaceholderSubtitle, TextPlaceholder as PlaceholderText, Timeline as PlaceholderTimeline, Title$1 as PlaceholderTitle, Video as PlaceholderVideo, Video360 as PlaceholderVideo360, VideoLoop as PlaceholderVideoLoop, Screen$1 as Screen, ScreenElement, Placeholder as ScreenPlaceholder, Preview as ScreenPreview, ScreenSizer, Screens, Slideshow, Spinner, TabsMenu as Tabs, Transitions, TransitionsStagger, UploadModal };

package/es/hooks.js

@@ -961,16 +961,42 @@ var useMediaApi = function useMediaApi() {
   }, [setDataReady, onLoadedData]);
   useEffect(function () {
     var _ref$current = ref.current,
-        media = _ref$current === void 0 ? null : _ref$current;
+        media = _ref$current === void 0 ? null : _ref$current; // console.log('actions', url);
 
     if (media !== null) {
-      media.addEventListener('timeupdate', onCustomTimeUpdate);
-      media.addEventListener('durationchange', onCustomDurationChange);
       media.addEventListener('volumechange', onCustomVolumeChange);
       media.addEventListener('play', onCustomPlay);
       media.addEventListener('pause', onCustomPause);
       media.addEventListener('ended', onCustomEnded);
-      media.addEventListener('seeked', onCustomSeeked);
+      media.addEventListener('seeked', onCustomSeeked); // media.addEventListener('loadstart', onCustomLoadStart);
+      // media.addEventListener('canplaythrough', onCustomCanPlayThrough);
+      // media.addEventListener('canplay', onCustomCanPlay);
+      // media.addEventListener('loadedmetadata', onCustomLoadedMetadata);
+      // media.addEventListener('loadeddata', onCustomLoadedData);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('volumechange', onCustomVolumeChange);
+        media.removeEventListener('play', onCustomPlay);
+        media.removeEventListener('pause', onCustomPause);
+        media.removeEventListener('ended', onCustomEnded);
+        media.removeEventListener('seeked', onCustomSeeked); // media.removeEventListener('loadstart', onCustomLoadStart);
+        // media.removeEventListener('canplaythrough', onCustomCanPlayThrough);
+        // media.removeEventListener('canplay', onCustomCanPlay);
+        // media.removeEventListener('loadedmetadata', onCustomLoadedMetadata);
+      }
+    };
+  }, [url, onCustomVolumeChange, onCustomPlay, onCustomPause, onCustomEnded, onCustomSeeked // onCustomLoadStart,
+  // onCustomCanPlayThrough,
+  // onCustomCanPlay,
+  // onCustomLoadedMetadata,
+  ]);
+  useEffect(function () {
+    var _ref$current2 = ref.current,
+        media = _ref$current2 === void 0 ? null : _ref$current2;
+
+    if (media !== null) {
       media.addEventListener('loadstart', onCustomLoadStart);
       media.addEventListener('canplaythrough', onCustomCanPlayThrough);
       media.addEventListener('canplay', onCustomCanPlay);
@@ -980,23 +1006,46 @@ var useMediaApi = function useMediaApi() {
 
     return function () {
       if (media !== null) {
-        media.removeEventListener('timeupdate', onCustomTimeUpdate);
-        media.removeEventListener('durationchange', onCustomDurationChange);
-        media.removeEventListener('volumechange', onCustomVolumeChange);
-        media.removeEventListener('play', onCustomPlay);
-        media.removeEventListener('pause', onCustomPause);
-        media.removeEventListener('ended', onCustomEnded);
-        media.removeEventListener('seeked', onCustomSeeked);
         media.removeEventListener('loadstart', onCustomLoadStart);
         media.removeEventListener('canplaythrough', onCustomCanPlayThrough);
         media.removeEventListener('canplay', onCustomCanPlay);
         media.removeEventListener('loadedmetadata', onCustomLoadedMetadata);
       }
     };
-  }, [url, onCustomTimeUpdate, onCustomDurationChange, onCustomVolumeChange, onCustomPlay, onCustomPause, onCustomEnded, onCustomSeeked, onCustomLoadStart, onCustomCanPlayThrough, onCustomCanPlay, onCustomLoadedMetadata]);
+  }, [url, onCustomLoadStart, onCustomCanPlayThrough, onCustomCanPlay, onCustomLoadedMetadata]); // Duration
+
   useEffect(function () {
-    var _ref$current2 = ref.current,
-        media = _ref$current2 === void 0 ? null : _ref$current2;
+    var _ref$current3 = ref.current,
+        media = _ref$current3 === void 0 ? null : _ref$current3;
+
+    if (media !== null) {
+      media.addEventListener('durationchange', onCustomDurationChange);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('durationchange', onCustomDurationChange);
+      }
+    };
+  }, [url, onCustomDurationChange]); // Timeupdate
+
+  useEffect(function () {
+    var _ref$current4 = ref.current,
+        media = _ref$current4 === void 0 ? null : _ref$current4; // console.log('timeupdate', url);
+
+    if (media !== null) {
+      media.addEventListener('timeupdate', onCustomTimeUpdate);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('timeupdate', onCustomTimeUpdate);
+      }
+    };
+  }, [url, onCustomTimeUpdate, onCustomDurationChange]);
+  useEffect(function () {
+    var _ref$current5 = ref.current,
+        media = _ref$current5 === void 0 ? null : _ref$current5;
 
     if (media !== null && media.readyState > 1) {
       setDataReady(true);

package/lib/components.js

@@ -42,6 +42,7 @@ var size = require('@folklore/size');
 var faCommentDots = require('@fortawesome/free-solid-svg-icons/faCommentDots');
 var faCheck = require('@fortawesome/free-solid-svg-icons/faCheck');
 var faTimes = require('@fortawesome/free-solid-svg-icons/faTimes');
+var faCircle = require('@fortawesome/free-solid-svg-icons/faCircle');
 var faPercent = require('@fortawesome/free-solid-svg-icons/faPercent');
 var core$1 = require('@react-spring/core');
 var web = require('@react-spring/web');
@@ -3476,7 +3477,7 @@ var Timeline = function Timeline(props) {
 };
 
 /* eslint-disable react/jsx-props-no-spreading, react/destructuring-assignment, react/prop-types */
-var Title = function Title(props) {
+var Title$1 = function Title(props) {
   return /*#__PURE__*/React__default["default"].createElement(PlaceholderText, Object.assign({}, props, {
     className: classNames__default["default"]([props.className, styles$c.title]),
     height: 0.5,
@@ -3906,6 +3907,23 @@ var Answer$1 = function Answer(_ref) {
   })));
 };
 
+var Title = function Title(props) {
+  return /*#__PURE__*/React__default["default"].createElement(PlaceholderBlock, Object.assign({}, props, {
+    width: "100%",
+    height: "100%",
+    className: classNames__default["default"]([styles$c.container, _defineProperty__default["default"]({}, props.className, props.className !== null)])
+  }), /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: faCircle.faCircle,
+    className: styles$c.icon
+  }), /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: faCircle.faCircle,
+    className: styles$c.icon
+  }), /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: faCircle.faCircle,
+    className: styles$c.icon
+  }));
+};
+
 var styles$2 = {"container":"micromag-core-placeholders-survey-answer-container","block":"micromag-core-placeholders-survey-answer-block","percent":"micromag-core-placeholders-survey-answer-percent","percentIcon":"micromag-core-placeholders-survey-answer-percentIcon"};
 
 var Answer = function Answer(_ref) {
@@ -3946,12 +3964,13 @@ var Placeholders = /*#__PURE__*/Object.freeze({
     MapPath: MapPath,
     QuizAnswer: Answer$1,
     Quote: Quote,
+    ShareOptions: Title,
     ShortText: ShortText,
     Subtitle: Subtitle,
     SurveyAnswer: Answer,
     Text: TextPlaceholder,
     Timeline: Timeline,
-    Title: Title,
+    Title: Title$1,
     Video: Video,
     Video360: Video360,
     VideoLoop: VideoLoop
@@ -4429,7 +4448,7 @@ exports.PlaceholderShortText = ShortText;
 exports.PlaceholderSubtitle = Subtitle;
 exports.PlaceholderText = TextPlaceholder;
 exports.PlaceholderTimeline = Timeline;
-exports.PlaceholderTitle = Title;
+exports.PlaceholderTitle = Title$1;
 exports.PlaceholderVideo = Video;
 exports.PlaceholderVideo360 = Video360;
 exports.PlaceholderVideoLoop = VideoLoop;

package/lib/hooks.js

@@ -997,16 +997,42 @@ var useMediaApi = function useMediaApi() {
   }, [setDataReady, onLoadedData]);
   react.useEffect(function () {
     var _ref$current = ref.current,
-        media = _ref$current === void 0 ? null : _ref$current;
+        media = _ref$current === void 0 ? null : _ref$current; // console.log('actions', url);
 
     if (media !== null) {
-      media.addEventListener('timeupdate', onCustomTimeUpdate);
-      media.addEventListener('durationchange', onCustomDurationChange);
       media.addEventListener('volumechange', onCustomVolumeChange);
       media.addEventListener('play', onCustomPlay);
       media.addEventListener('pause', onCustomPause);
       media.addEventListener('ended', onCustomEnded);
-      media.addEventListener('seeked', onCustomSeeked);
+      media.addEventListener('seeked', onCustomSeeked); // media.addEventListener('loadstart', onCustomLoadStart);
+      // media.addEventListener('canplaythrough', onCustomCanPlayThrough);
+      // media.addEventListener('canplay', onCustomCanPlay);
+      // media.addEventListener('loadedmetadata', onCustomLoadedMetadata);
+      // media.addEventListener('loadeddata', onCustomLoadedData);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('volumechange', onCustomVolumeChange);
+        media.removeEventListener('play', onCustomPlay);
+        media.removeEventListener('pause', onCustomPause);
+        media.removeEventListener('ended', onCustomEnded);
+        media.removeEventListener('seeked', onCustomSeeked); // media.removeEventListener('loadstart', onCustomLoadStart);
+        // media.removeEventListener('canplaythrough', onCustomCanPlayThrough);
+        // media.removeEventListener('canplay', onCustomCanPlay);
+        // media.removeEventListener('loadedmetadata', onCustomLoadedMetadata);
+      }
+    };
+  }, [url, onCustomVolumeChange, onCustomPlay, onCustomPause, onCustomEnded, onCustomSeeked // onCustomLoadStart,
+  // onCustomCanPlayThrough,
+  // onCustomCanPlay,
+  // onCustomLoadedMetadata,
+  ]);
+  react.useEffect(function () {
+    var _ref$current2 = ref.current,
+        media = _ref$current2 === void 0 ? null : _ref$current2;
+
+    if (media !== null) {
       media.addEventListener('loadstart', onCustomLoadStart);
       media.addEventListener('canplaythrough', onCustomCanPlayThrough);
       media.addEventListener('canplay', onCustomCanPlay);
@@ -1016,23 +1042,46 @@ var useMediaApi = function useMediaApi() {
 
     return function () {
       if (media !== null) {
-        media.removeEventListener('timeupdate', onCustomTimeUpdate);
-        media.removeEventListener('durationchange', onCustomDurationChange);
-        media.removeEventListener('volumechange', onCustomVolumeChange);
-        media.removeEventListener('play', onCustomPlay);
-        media.removeEventListener('pause', onCustomPause);
-        media.removeEventListener('ended', onCustomEnded);
-        media.removeEventListener('seeked', onCustomSeeked);
         media.removeEventListener('loadstart', onCustomLoadStart);
         media.removeEventListener('canplaythrough', onCustomCanPlayThrough);
         media.removeEventListener('canplay', onCustomCanPlay);
         media.removeEventListener('loadedmetadata', onCustomLoadedMetadata);
       }
     };
-  }, [url, onCustomTimeUpdate, onCustomDurationChange, onCustomVolumeChange, onCustomPlay, onCustomPause, onCustomEnded, onCustomSeeked, onCustomLoadStart, onCustomCanPlayThrough, onCustomCanPlay, onCustomLoadedMetadata]);
+  }, [url, onCustomLoadStart, onCustomCanPlayThrough, onCustomCanPlay, onCustomLoadedMetadata]); // Duration
+
   react.useEffect(function () {
-    var _ref$current2 = ref.current,
-        media = _ref$current2 === void 0 ? null : _ref$current2;
+    var _ref$current3 = ref.current,
+        media = _ref$current3 === void 0 ? null : _ref$current3;
+
+    if (media !== null) {
+      media.addEventListener('durationchange', onCustomDurationChange);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('durationchange', onCustomDurationChange);
+      }
+    };
+  }, [url, onCustomDurationChange]); // Timeupdate
+
+  react.useEffect(function () {
+    var _ref$current4 = ref.current,
+        media = _ref$current4 === void 0 ? null : _ref$current4; // console.log('timeupdate', url);
+
+    if (media !== null) {
+      media.addEventListener('timeupdate', onCustomTimeUpdate);
+    }
+
+    return function () {
+      if (media !== null) {
+        media.removeEventListener('timeupdate', onCustomTimeUpdate);
+      }
+    };
+  }, [url, onCustomTimeUpdate, onCustomDurationChange]);
+  react.useEffect(function () {
+    var _ref$current5 = ref.current,
+        media = _ref$current5 === void 0 ? null : _ref$current5;
 
     if (media !== null && media.readyState > 1) {
       setDataReady(true);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/core",
-    "version": "0.3.119",
+    "version": "0.3.124",
     "description": "",
     "keywords": [
         "javascript"
@@ -132,5 +132,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "009841dc1641be98ddce6ed56cfcddc22509f342"
+    "gitHead": "9050944df1d66cae14e04a771f739e2743894fb8"
 }