@micromag/core 0.4.71 → 0.4.74

package/es/hooks.js

@@ -1,811 +1,965 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef, useState, useEffect, useCallback, useMemo } from 'react';
+import { c } from 'react/compiler-runtime';
+import { useRef, useState, useEffect, useCallback, useMemo, startTransition } from 'react';
 import { EventsManager, MediasParser, StoryParser, ThemeParser } from '@micromag/core';
-import { createUseEvent, getMediaFilesAsArray } from '@micromag/core/utils';
-import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import { createUseEvent, getMediaIsBuffering, getMediaFilename, getMediaIsPlaying, getMediaIsMuted, getMediaSrc, getMediaTimestampOffset, getMediaCurrentTime, getMediaDuration } from '@micromag/core/utils';
 import { useSpringRef, useSpring, useSprings } from '@react-spring/core';
 import { useGesture, useDrag } from '@use-gesture/react';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { useForm as useForm$1 } from '@folklore/forms';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import classNames from 'classnames';
 import screenfull from 'screenfull';
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import isArray from 'lodash/isArray';
+import { useResizeObserver, useIntersectionObserver, useWindowSize } from '@folklore/hooks';
+export { useIntersectionObserver, useResizeObserver } from '@folklore/hooks';
 import isObject from 'lodash/isObject';
 import raf from 'raf';
 import createDebug from 'debug';
 import { useScreensManager, useFieldsManager, useTracking, useScreen } from '@micromag/core/contexts';
 import isEmpty from 'lodash/isEmpty';
-import { useWindowSize } from '@folklore/hooks';
 import { match } from 'css-mediaquery';
+import isArray from 'lodash/isArray';
 import dayjs from 'dayjs';
 import isString from 'lodash/isString';
 import { useIntl } from 'react-intl';
 import clamp from 'lodash/clamp';
 
-function useActivityDetector() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$element = _ref.element,
-    providedElement = _ref$element === void 0 ? null : _ref$element,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$timeout = _ref.timeout,
-    timeoutDelay = _ref$timeout === void 0 ? 2000 : _ref$timeout;
-  var ref = useRef(providedElement);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    detected = _useState2[0],
-    setDetected = _useState2[1];
-  var detectedRef = useRef(detected);
-  if (providedElement !== null && providedElement !== ref.current) {
-    ref.current = providedElement;
-  }
-  useEffect(function () {
-    var _ref$current = ref.current,
-      element = _ref$current === void 0 ? null : _ref$current;
-    if (element === null || disabled) {
-      return function () {};
-    }
-    var timeout = null;
-    function onActivity() {
-      if (timeout !== null) {
-        clearTimeout(timeout);
-        timeout = null;
-      }
-      if (!detectedRef.current) {
-        detectedRef.current = true;
-        setDetected(true);
-      }
-      timeout = setTimeout(function () {
-        detectedRef.current = false;
-        setDetected(false);
-      }, timeoutDelay);
-    }
-    element.addEventListener('keydown', onActivity);
-    element.addEventListener('mousedown', onActivity);
-    element.addEventListener('mousemove', onActivity);
-    element.addEventListener('mouseup', onActivity);
-    element.addEventListener('pointerdown', onActivity);
-    element.addEventListener('pointermove', onActivity);
-    element.addEventListener('pointerup', onActivity);
-    element.addEventListener('touchmove', onActivity);
-    element.addEventListener('touchstart', onActivity);
-    return function () {
-      if (timeout !== null) {
-        clearTimeout(timeout);
-        timeout = null;
+function useActivityDetector(t0) {
+  const $ = c(8);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    disabled: t2,
+    timeout: t3
+  } = t1;
+  const disabled = t2 === undefined ? false : t2;
+  const timeoutDelay = t3 === undefined ? 2000 : t3;
+  const ref = useRef(null);
+  const [detected, setDetected] = useState(false);
+  const detectedRef = useRef(detected);
+  let t4;
+  let t5;
+  if ($[2] !== disabled || $[3] !== timeoutDelay) {
+    t4 = () => {
+      const {
+        current: t6
+      } = ref;
+      const element = t6 === undefined ? null : t6;
+      if (element === null || disabled) {
+        return _temp$a;
       }
-      element.removeEventListener('keydown', onActivity);
-      element.removeEventListener('mousedown', onActivity);
-      element.removeEventListener('mousemove', onActivity);
-      element.removeEventListener('mouseup', onActivity);
-      element.removeEventListener('pointerdown', onActivity);
-      element.removeEventListener('pointermove', onActivity);
-      element.removeEventListener('pointerup', onActivity);
-      element.removeEventListener('touchmove', onActivity);
-      element.removeEventListener('touchstart', onActivity);
+      let timeout = null;
+      const onActivity = function onActivity() {
+        if (timeout !== null) {
+          clearTimeout(timeout);
+          timeout = null;
+        }
+        if (!detectedRef.current) {
+          detectedRef.current = true;
+          setDetected(true);
+        }
+        timeout = setTimeout(() => {
+          detectedRef.current = false;
+          setDetected(false);
+        }, timeoutDelay);
+      };
+      element.addEventListener("keydown", onActivity);
+      element.addEventListener("mousedown", onActivity);
+      element.addEventListener("mousemove", onActivity);
+      element.addEventListener("mouseup", onActivity);
+      element.addEventListener("pointerdown", onActivity);
+      element.addEventListener("pointermove", onActivity);
+      element.addEventListener("pointerup", onActivity);
+      element.addEventListener("touchmove", onActivity);
+      element.addEventListener("touchstart", onActivity);
+      return () => {
+        if (timeout !== null) {
+          clearTimeout(timeout);
+          timeout = null;
+        }
+        element.removeEventListener("keydown", onActivity);
+        element.removeEventListener("mousedown", onActivity);
+        element.removeEventListener("mousemove", onActivity);
+        element.removeEventListener("mouseup", onActivity);
+        element.removeEventListener("pointerdown", onActivity);
+        element.removeEventListener("pointermove", onActivity);
+        element.removeEventListener("pointerup", onActivity);
+        element.removeEventListener("touchmove", onActivity);
+        element.removeEventListener("touchstart", onActivity);
+      };
     };
-  }, [providedElement, disabled, timeoutDelay]);
-  return {
-    ref: ref,
-    detected: detected
-  };
+    t5 = [disabled, timeoutDelay];
+    $[2] = disabled;
+    $[3] = timeoutDelay;
+    $[4] = t4;
+    $[5] = t5;
+  } else {
+    t4 = $[4];
+    t5 = $[5];
+  }
+  useEffect(t4, t5);
+  let t6;
+  if ($[6] !== detected) {
+    t6 = {
+      ref,
+      detected
+    };
+    $[6] = detected;
+    $[7] = t6;
+  } else {
+    t6 = $[7];
+  }
+  return t6;
 }
-
-var useAnimationFrame = function useAnimationFrame(onFrame) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
-  var requestRef = useRef(null);
-  var startTimeRef = useRef(null);
-  var _callback = function callback(time) {
-    if (!startTimeRef.current) {
-      startTimeRef.current = time;
-    }
-    var progress = time - startTimeRef.current;
-    onFrame(progress);
-    requestRef.current = requestAnimationFrame(_callback);
-  };
-  useEffect(function () {
-    if (!disabled) {
-      requestRef.current = requestAnimationFrame(_callback);
-    }
-    return function () {
-      if (requestRef.current !== null) {
-        cancelAnimationFrame(requestRef.current);
+function _temp$a() {}
+
+const useAnimationFrame = (onFrame, t0) => {
+  const $ = c(9);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    disabled: t2
+  } = t1;
+  const disabled = t2 === undefined ? false : t2;
+  const requestRef = useRef(null);
+  const startTimeRef = useRef(null);
+  let callback;
+  if ($[2] !== onFrame) {
+    callback = time => {
+      if (!startTimeRef.current) {
+        startTimeRef.current = time;
+      }
+      const progress = time - startTimeRef.current;
+      onFrame(progress);
+      requestRef.current = requestAnimationFrame(callback);
+    };
+    $[2] = onFrame;
+    $[3] = callback;
+  } else {
+    callback = $[3];
+  }
+  let t3;
+  if ($[4] !== callback || $[5] !== disabled) {
+    t3 = () => {
+      if (!disabled) {
+        requestRef.current = requestAnimationFrame(callback);
       }
+      return () => {
+        if (requestRef.current !== null) {
+          cancelAnimationFrame(requestRef.current);
+        }
+      };
     };
-  }, [disabled]);
+    $[4] = callback;
+    $[5] = disabled;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  let t4;
+  if ($[7] !== disabled) {
+    t4 = [disabled];
+    $[7] = disabled;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  useEffect(t3, t4);
 };
 
-var useFormattedDate = function useFormattedDate() {
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _ref = options || {},
-    _ref$format = _ref.format,
-    format = _ref$format === void 0 ? null : _ref$format,
-    _ref$showToday = _ref.showToday,
-    showToday = _ref$showToday === void 0 ? true : _ref$showToday;
-  var intl = useIntl();
-  var today = dayjs();
-  return useCallback(function (date) {
-    var dateToFormat = isString(date) ? dayjs(date) : date;
+const useFormattedDate = (options = null) => {
+  const {
+    format = null,
+    showToday = true
+  } = options || {};
+  const intl = useIntl();
+  const today = dayjs();
+  return useCallback(date => {
+    const dateToFormat = isString(date) ? dayjs(date) : date;
     if (showToday && dateToFormat.format('YYYY-MM-DD') === today.format('YYYY-MM-DD')) {
       return intl.formatMessage({
         id: "v4Qtl9",
-        defaultMessage: [{
-          "type": 0,
-          "value": "Today"
-        }]
+        defaultMessage: "Today"
       });
     }
-    return intl.formatDate(dayjs(date).toDate(), _objectSpread({
+    return intl.formatDate(dayjs(date).toDate(), {
       year: 'numeric',
       month: 'long',
-      day: '2-digit'
-    }, format));
+      day: '2-digit',
+      ...format
+    });
   }, [today, showToday, format]);
 };
-var useFormattedTime = function useFormattedTime() {
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _ref2 = options || {},
-    _ref2$format = _ref2.format,
-    format = _ref2$format === void 0 ? null : _ref2$format,
-    _ref2$showNow = _ref2.showNow,
-    showNow = _ref2$showNow === void 0 ? true : _ref2$showNow,
-    _ref2$timeGap = _ref2.timeGap,
-    timeGap = _ref2$timeGap === void 0 ? 2 : _ref2$timeGap;
-  var intl = useIntl();
-  var now = dayjs();
-  return useCallback(function (date) {
-    var dateToFormat = isString(date) ? dayjs(date) : date;
+const useFormattedTime = (options = null) => {
+  const {
+    format = null,
+    showNow = true,
+    timeGap = 2
+  } = options || {};
+  const intl = useIntl();
+  const now = dayjs();
+  return useCallback(date => {
+    const dateToFormat = isString(date) ? dayjs(date) : date;
     if (showNow && dateToFormat.format('YYYY-MM-DD') === now.format('YYYY-MM-DD') && dateToFormat.hour() === now.hour() && dateToFormat.minute() > now.minute() - timeGap && dateToFormat.minute() < now.minute() + timeGap) {
       return intl.formatMessage({
         id: "3na7F8",
-        defaultMessage: [{
-          "type": 0,
-          "value": "Now"
-        }]
+        defaultMessage: "Now"
       });
     }
-    return intl.formatTime(dateToFormat.toDate(), _objectSpread({
+    return intl.formatTime(dateToFormat.toDate(), {
       hour: 'numeric',
-      minute: 'numeric'
-    }, format));
+      minute: 'numeric',
+      ...format
+    });
   }, [now, showNow, timeGap, format]);
 };
 
-var useDebounced = function useDebounced(handler, watchedValue) {
-  var delay = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 300;
-  useEffect(function () {
-    var timeoutHandler = setTimeout(function () {
-      if (handler !== null) {
-        handler(watchedValue);
-      }
-    }, delay);
-    return function () {
-      clearTimeout(timeoutHandler);
+const useDebounced = (handler, watchedValue, t0) => {
+  const $ = c(7);
+  const delay = t0 === undefined ? 300 : t0;
+  let t1;
+  if ($[0] !== delay || $[1] !== handler || $[2] !== watchedValue) {
+    t1 = () => {
+      const timeoutHandler = setTimeout(() => {
+        if (handler !== null) {
+          handler(watchedValue);
+        }
+      }, delay);
+      return () => {
+        clearTimeout(timeoutHandler);
+      };
     };
-  }, [watchedValue, delay]);
+    $[0] = delay;
+    $[1] = handler;
+    $[2] = watchedValue;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  let t2;
+  if ($[4] !== delay || $[5] !== watchedValue) {
+    t2 = [watchedValue, delay];
+    $[4] = delay;
+    $[5] = watchedValue;
+    $[6] = t2;
+  } else {
+    t2 = $[6];
+  }
+  useEffect(t1, t2);
 };
 
-var eventsManager$1 = typeof document !== 'undefined' ? new EventsManager(document) : null;
-var useDocumentEvent = createUseEvent(eventsManager$1);
+const eventsManager$1 = typeof document !== 'undefined' ? new EventsManager(document) : null;
+const useDocumentEvent = createUseEvent(eventsManager$1);
 
-function useDragProgress(_ref) {
-  var wantedProgress = _ref.progress,
-    _ref$onTap = _ref.onTap,
-    onTap = _ref$onTap === void 0 ? null : _ref$onTap,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$dragDisabled = _ref.dragDisabled,
-    dragDisabled = _ref$dragDisabled === void 0 ? false : _ref$dragDisabled,
-    _ref$computeProgress = _ref.computeProgress,
-    computeProgress = _ref$computeProgress === void 0 ? null : _ref$computeProgress,
-    _ref$onProgress = _ref.onProgress,
-    onProgress = _ref$onProgress === void 0 ? null : _ref$onProgress,
-    _ref$onPointerDown = _ref.onPointerDown,
-    onPointerDown = _ref$onPointerDown === void 0 ? null : _ref$onPointerDown,
-    _ref$onResolve = _ref.onResolve,
-    _onResolve = _ref$onResolve === void 0 ? null : _ref$onResolve,
-    _ref$onScroll = _ref.onScroll,
-    onScroll = _ref$onScroll === void 0 ? null : _ref$onScroll,
-    _ref$springParams = _ref.springParams,
-    springParams = _ref$springParams === void 0 ? undefined : _ref$springParams,
-    _ref$dragOptions = _ref.dragOptions,
-    dragOptions = _ref$dragOptions === void 0 ? {
-      filterTaps: true
-    } : _ref$dragOptions;
-  var draggingRef = useRef(false);
-  var progressRef = useRef(wantedProgress);
-  var wantedProgressRef = useRef(wantedProgress);
-  if (wantedProgress !== wantedProgressRef.current) {
-    wantedProgressRef.current = wantedProgress;
-  }
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    dragging = _useState2[0],
-    setDragging = _useState2[1];
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    direction = _useState4[0],
-    setDirection = _useState4[1];
-
-  // In react-spring v10, useSpring(fn) without deps stores the initial update and
-  // re-applies it via ctrl.start() in a layout effect on EVERY render, resetting the
-  // spring to its initial value. To prevent this, we pass a dummy SpringRef as `ref`
-  // in the props — when ctrl.ref is set, the layout effect queues updates instead of
-  // starting them, so our imperative api.start() calls are not overridden.
-  var imperativeRef = useSpringRef();
-  var _useSpring = useSpring(function () {
-      return _objectSpread({
-        ref: imperativeRef,
-        from: {
-          progress: wantedProgress
-        }
-      }, springParams);
-    }),
-    _useSpring2 = _slicedToArray(_useSpring, 2),
-    progress = _useSpring2[0].progress,
-    api = _useSpring2[1];
-  var onDrag = useCallback(function (gestureState) {
-    var active = gestureState.active,
-      tap = gestureState.tap;
-    if (disabled) {
-      draggingRef.current = false;
-      return;
-    }
-    if (tap) {
-      draggingRef.current = false;
-      if (onTap !== null) onTap(gestureState);
-      return;
-    }
-    if (dragDisabled) {
-      draggingRef.current = false;
-      return;
-    }
-    var newProgress = computeProgress(gestureState);
-    draggingRef.current = active;
-    setDirection(newProgress < wantedProgressRef.current ? -1 : 1);
-    progressRef.current = newProgress;
-    if (active !== dragging) {
-      setDragging(active);
-    }
-    api.start(_objectSpread({
-      progress: newProgress,
-      immediate: active,
-      onResolve: !active ? function (e) {
-        setDirection(0);
-        if (_onResolve !== null) _onResolve(e);
-      } : function (e) {
-        if (_onResolve !== null) _onResolve(e);
+const defaultDragOptions = {
+  filterTaps: true
+};
+function useDragProgress(t0) {
+  const $ = c(41);
+  const {
+    progress: wantedProgress,
+    onTap: t1,
+    disabled: t2,
+    dragDisabled: t3,
+    computeProgress: t4,
+    onProgress: t5,
+    onPointerDown: t6,
+    onResolve: t7,
+    onScroll: t8,
+    springParams: t9,
+    dragOptions: t10
+  } = t0;
+  const onTap = t1 === undefined ? null : t1;
+  const disabled = t2 === undefined ? false : t2;
+  const dragDisabled = t3 === undefined ? false : t3;
+  const computeProgress = t4 === undefined ? null : t4;
+  const onProgress = t5 === undefined ? null : t5;
+  const onPointerDown = t6 === undefined ? null : t6;
+  const onResolve = t7 === undefined ? null : t7;
+  const onScroll = t8 === undefined ? null : t8;
+  const springParams = t9 === undefined ? undefined : t9;
+  const dragOptions = t10 === undefined ? defaultDragOptions : t10;
+  const draggingRef = useRef(false);
+  const progressRef = useRef(wantedProgress);
+  const [dragging, setDragging] = useState(false);
+  const [direction, setDirection] = useState(0);
+  const [transitioned, setTransitioned] = useState(true);
+  let t11;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t11 = () => {
+      setTransitioned(false);
+    };
+    $[0] = t11;
+  } else {
+    t11 = $[0];
+  }
+  const onTransitionStart = t11;
+  let t12;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t12 = () => {
+      setTransitioned(true);
+    };
+    $[1] = t12;
+  } else {
+    t12 = $[1];
+  }
+  const onTransitionComplete = t12;
+  const imperativeRef = useSpringRef();
+  let t13;
+  if ($[2] !== imperativeRef || $[3] !== springParams || $[4] !== wantedProgress) {
+    t13 = () => ({
+      ref: imperativeRef,
+      from: {
+        progress: wantedProgress
+      },
+      onStart: onTransitionStart,
+      onRest: onTransitionComplete,
+      ...springParams
+    });
+    $[2] = imperativeRef;
+    $[3] = springParams;
+    $[4] = wantedProgress;
+    $[5] = t13;
+  } else {
+    t13 = $[5];
+  }
+  const [t14, api] = useSpring(t13);
+  const {
+    progress
+  } = t14;
+  let t15;
+  if ($[6] !== api || $[7] !== computeProgress || $[8] !== disabled || $[9] !== dragDisabled || $[10] !== dragging || $[11] !== onProgress || $[12] !== onResolve || $[13] !== onTap || $[14] !== springParams || $[15] !== wantedProgress) {
+    t15 = gestureState => {
+      const {
+        active,
+        tap,
+        first
+      } = gestureState;
+      console.log("DRAG");
+      if (disabled) {
+        draggingRef.current = false;
+        return;
       }
-    }, springParams));
-    if (onProgress !== null) {
-      onProgress(newProgress, gestureState);
-    }
-  }, [setDragging, disabled, onTap, computeProgress, dragging, onProgress, _onResolve]);
-  var bind = useGesture({
-    onDrag: onDrag,
-    onPointerDown: onPointerDown !== null ? onPointerDown : function () {},
-    onScroll: onScroll !== null ? onScroll : function () {}
-  }, {
-    drag: dragOptions
-  });
-  useEffect(function () {
-    if (!draggingRef.current && wantedProgress !== progressRef.current) {
-      setDirection(wantedProgress < progressRef.current ? -1 : 1);
-      progressRef.current = wantedProgress;
-      api.start(_objectSpread({
-        progress: wantedProgress,
-        immediate: disabled,
-        onResolve: function onResolve(e) {
-          setDirection(0);
-          if (_onResolve !== null) _onResolve(e);
+      if (tap) {
+        draggingRef.current = false;
+        if (onTap !== null) {
+          onTap(gestureState);
         }
-      }, springParams));
-    }
-  }, [wantedProgress, disabled]);
-  var transitioning = useMemo(function () {
-    return wantedProgress !== progress.get() || progress.isAnimating || dragging;
-  }, [wantedProgress, progress.isAnimating, dragging]);
-  return {
-    transitioning: transitioning,
-    bind: bind,
-    dragging: dragging,
-    progress: progress,
-    direction: direction
-  };
+        return;
+      }
+      if (dragDisabled) {
+        draggingRef.current = false;
+        return;
+      }
+      const newProgress = computeProgress(gestureState);
+      draggingRef.current = active;
+      setDirection(newProgress < wantedProgress ? -1 : 1);
+      progressRef.current = newProgress;
+      if (active !== dragging) {
+        setDragging(active);
+      }
+      api.start({
+        progress: newProgress,
+        immediate: active,
+        onResolve: e => {
+          if (!active) {
+            setDirection(0);
+          }
+          if (onResolve !== null) {
+            onResolve(e);
+          }
+        },
+        onStart: first ? onTransitionStart : undefined,
+        onRest: !active ? onTransitionComplete : undefined,
+        ...springParams
+      });
+      if (onProgress !== null) {
+        onProgress(newProgress, gestureState);
+      }
+    };
+    $[6] = api;
+    $[7] = computeProgress;
+    $[8] = disabled;
+    $[9] = dragDisabled;
+    $[10] = dragging;
+    $[11] = onProgress;
+    $[12] = onResolve;
+    $[13] = onTap;
+    $[14] = springParams;
+    $[15] = wantedProgress;
+    $[16] = t15;
+  } else {
+    t15 = $[16];
+  }
+  const onDrag = t15;
+  const t16 = onPointerDown !== null ? onPointerDown : undefined;
+  const t17 = onScroll !== null ? onScroll : undefined;
+  let t18;
+  if ($[17] !== onDrag || $[18] !== t16 || $[19] !== t17) {
+    t18 = {
+      onDrag,
+      onPointerDown: t16,
+      onScroll: t17
+    };
+    $[17] = onDrag;
+    $[18] = t16;
+    $[19] = t17;
+    $[20] = t18;
+  } else {
+    t18 = $[20];
+  }
+  let t19;
+  if ($[21] !== dragOptions) {
+    t19 = {
+      drag: dragOptions
+    };
+    $[21] = dragOptions;
+    $[22] = t19;
+  } else {
+    t19 = $[22];
+  }
+  const bind = useGesture(t18, t19);
+  const [lastWantedProgress, setLastWantedProgress] = useState(wantedProgress);
+  let t20;
+  let t21;
+  if ($[23] !== api || $[24] !== disabled || $[25] !== onResolve || $[26] !== springParams || $[27] !== wantedProgress) {
+    t20 = () => {
+      if (!draggingRef.current && wantedProgress !== progressRef.current) {
+        setDirection(wantedProgress < progressRef.current ? -1 : 1);
+        setLastWantedProgress(wantedProgress);
+        progressRef.current = wantedProgress;
+        api.start({
+          progress: wantedProgress,
+          immediate: disabled,
+          onResolve: e_0 => {
+            setDirection(0);
+            if (onResolve !== null) {
+              onResolve(e_0);
+            }
+          },
+          onStart: onTransitionStart,
+          onRest: onTransitionComplete,
+          ...springParams
+        });
+      }
+    };
+    t21 = [api, wantedProgress, disabled, onResolve, springParams, onTransitionStart, onTransitionComplete];
+    $[23] = api;
+    $[24] = disabled;
+    $[25] = onResolve;
+    $[26] = springParams;
+    $[27] = wantedProgress;
+    $[28] = t20;
+    $[29] = t21;
+  } else {
+    t20 = $[28];
+    t21 = $[29];
+  }
+  useEffect(t20, t21);
+  let t22;
+  if ($[30] !== dragging || $[31] !== progress || $[32] !== transitioned || $[33] !== wantedProgress) {
+    t22 = wantedProgress !== progress.get() || progress.isAnimating || dragging || !transitioned;
+    $[30] = dragging;
+    $[31] = progress;
+    $[32] = transitioned;
+    $[33] = wantedProgress;
+    $[34] = t22;
+  } else {
+    t22 = $[34];
+  }
+  const transitioning = t22;
+  const t23 = wantedProgress !== lastWantedProgress ? wantedProgress < lastWantedProgress ? -1 : 1 : direction;
+  let t24;
+  if ($[35] !== bind || $[36] !== dragging || $[37] !== progress || $[38] !== t23 || $[39] !== transitioning) {
+    t24 = {
+      transitioning,
+      bind,
+      dragging,
+      progress,
+      direction: t23
+    };
+    $[35] = bind;
+    $[36] = dragging;
+    $[37] = progress;
+    $[38] = t23;
+    $[39] = transitioning;
+    $[40] = t24;
+  } else {
+    t24 = $[40];
+  }
+  return t24;
 }
 
-var _excluded$3 = ["fields", "injectInFields"],
-  _excluded2 = ["fields"];
-
-// eslint-disable-next-line
-var useForm = function useForm() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$fields = _ref.fields,
-    providedFields = _ref$fields === void 0 ? [] : _ref$fields,
-    _ref$injectInFields = _ref.injectInFields,
-    injectInFields = _ref$injectInFields === void 0 ? false : _ref$injectInFields,
-    opts = _objectWithoutProperties(_ref, _excluded$3);
-  var fieldsNames = useMemo(function () {
-    return providedFields.length > 0 ? providedFields.map(function (_ref2) {
-      var name = _ref2.name;
-      return name;
-    }) : [];
-  }, [providedFields]);
-  var _useBaseForm = useForm$1(_objectSpread({
-      fields: fieldsNames
-    }, opts)),
-    fields = _useBaseForm.fields,
-    form = _objectWithoutProperties(_useBaseForm, _excluded2);
-  return _objectSpread(_objectSpread({}, form), {}, {
-    fields: injectInFields ? providedFields.map(function (it) {
-      return _objectSpread(_objectSpread({}, it), fields[it.name] || null);
-    }) : providedFields
-  });
-};
+function useForm(t0) {
+  const $ = c(23);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let opts;
+  let t2;
+  let t3;
+  if ($[2] !== t1) {
+    ({
+      fields: t2,
+      injectInFields: t3,
+      ...opts
+    } = t1);
+    $[2] = t1;
+    $[3] = opts;
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    opts = $[3];
+    t2 = $[4];
+    t3 = $[5];
+  }
+  let t4;
+  if ($[6] !== t2) {
+    t4 = t2 === undefined ? [] : t2;
+    $[6] = t2;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  const providedFields = t4;
+  const injectInFields = t3 === undefined ? false : t3;
+  let t5;
+  if ($[8] !== providedFields) {
+    t5 = providedFields.length > 0 ? providedFields.map(_temp$9) : [];
+    $[8] = providedFields;
+    $[9] = t5;
+  } else {
+    t5 = $[9];
+  }
+  const fieldsNames = t5;
+  let t6;
+  if ($[10] !== fieldsNames || $[11] !== opts) {
+    t6 = {
+      fields: fieldsNames,
+      ...opts
+    };
+    $[10] = fieldsNames;
+    $[11] = opts;
+    $[12] = t6;
+  } else {
+    t6 = $[12];
+  }
+  const t7 = useForm$1(t6);
+  let fields;
+  let form;
+  if ($[13] !== t7) {
+    ({
+      fields,
+      ...form
+    } = t7);
+    $[13] = t7;
+    $[14] = fields;
+    $[15] = form;
+  } else {
+    fields = $[14];
+    form = $[15];
+  }
+  let t8;
+  if ($[16] !== fields || $[17] !== injectInFields || $[18] !== providedFields) {
+    t8 = injectInFields ? providedFields.map(it => ({
+      ...it,
+      ...(fields[it.name] || null)
+    })) : providedFields;
+    $[16] = fields;
+    $[17] = injectInFields;
+    $[18] = providedFields;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  let t9;
+  if ($[20] !== form || $[21] !== t8) {
+    t9 = {
+      ...form,
+      fields: t8
+    };
+    $[20] = form;
+    $[21] = t8;
+    $[22] = t9;
+  } else {
+    t9 = $[22];
+  }
+  return t9;
+}
+function _temp$9(t0) {
+  const {
+    name
+  } = t0;
+  return name;
+}
 
-var useFormTransition = function useFormTransition() {
-  var initialPaths = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var initialStyles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var paths = initialPaths || [];
-  var styles = initialStyles || {};
-  var lastPageRef = useRef(paths || []);
-  var direction = useMemo(function () {
-    var currentPartsCount = paths.length;
+const useFormTransition = (initialPaths = null, initialStyles = {}) => {
+  const paths = initialPaths || [];
+  const styles = initialStyles || {};
+  const lastPageRef = useRef(paths || []);
+  const direction = useMemo(() => {
+    const currentPartsCount = paths.length;
     if (lastPageRef.current) {
-      var previousPartsCount = lastPageRef.current.length;
+      const previousPartsCount = lastPageRef.current.length;
       lastPageRef.current = paths || [];
       return currentPartsCount > previousPartsCount ? 'right' : 'left';
     }
     return null;
   }, [paths]);
-  var name = useMemo(function () {
-    return {
-      enter: classNames(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles.enterRight, direction === 'right'), styles.enterLeft, direction === 'left'), styles.enterTop, direction === 'top'), styles.enterBottom, direction === 'bottom')) || 'none',
-      enterActive: classNames(_defineProperty(_defineProperty({}, styles.enterActiveHorizontal, direction === 'left' || direction === 'right'), styles.enterActiveVertical, direction === 'top' || direction === 'bottom')) || 'none',
-      leave: styles.leave || 'none',
-      leaveActive: classNames(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles.leaveActiveRight, direction === 'right'), styles.leaveActiveLeft, direction === 'left'), styles.leaveActiveTop, direction === 'top'), styles.leaveActiveBottom, direction === 'bottom')) || 'none'
-    };
-  }, [direction]);
+  const name = useMemo(() => ({
+    enter: classNames({
+      [styles.enterRight]: direction === 'right',
+      [styles.enterLeft]: direction === 'left',
+      [styles.enterTop]: direction === 'top',
+      [styles.enterBottom]: direction === 'bottom'
+    }) || 'none',
+    enterActive: classNames({
+      [styles.enterActiveHorizontal]: direction === 'left' || direction === 'right',
+      [styles.enterActiveVertical]: direction === 'top' || direction === 'bottom'
+    }) || 'none',
+    leave: styles.leave || 'none',
+    leaveActive: classNames({
+      [styles.leaveActiveRight]: direction === 'right',
+      [styles.leaveActiveLeft]: direction === 'left',
+      [styles.leaveActiveTop]: direction === 'top',
+      [styles.leaveActiveBottom]: direction === 'bottom'
+    }) || 'none'
+  }), [direction]);
   return {
-    direction: direction,
-    name: name,
+    direction,
+    name,
     timeout: direction === 'left' || direction === 'right' ? 300 : 10
   };
 };
 
-var useFullscreen = function useFullscreen(element) {
-  var enabled = screenfull.isEnabled;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    active = _useState2[0],
-    setActive = _useState2[1];
-  var fullscreen = useCallback(function () {
-    if (screenfull.isEnabled) {
-      if (typeof element !== 'undefined' && element !== null) {
-        screenfull.request(element);
+const useFullscreen = () => {
+  const $ = c(9);
+  const ref = useRef(null);
+  const [enabled, setEnabled] = useState(_temp$8);
+  const [active, setActive] = useState(false);
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = () => {
+      const {
+        current: t1
+      } = ref;
+      const element = t1 === undefined ? null : t1;
+      if (screenfull.isEnabled) {
+        if (element !== null) {
+          screenfull.request(element);
+        } else {
+          screenfull.request();
+        }
+      }
+    };
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const fullscreen = t0;
+  const unFullscreen = _temp2$2;
+  let t1;
+  if ($[1] !== active) {
+    t1 = () => {
+      if (!active) {
+        fullscreen();
       } else {
-        screenfull.request();
+        unFullscreen();
       }
-    }
-  }, [element]);
-  var unFullscreen = useCallback(function () {
-    if (screenfull.isEnabled) {
-      screenfull.exit();
-    }
-  }, []);
-  var toggle = useCallback(function () {
-    if (!active) {
-      fullscreen();
-    } else {
-      unFullscreen();
-    }
-  }, [active, fullscreen, unFullscreen]);
-  useEffect(function () {
-    var onChange = function onChange() {
-      setActive(screenfull.isFullscreen);
     };
-    if (screenfull.isEnabled) {
-      screenfull.on('change', onChange);
-    }
-    return function () {
+    $[1] = active;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const toggle = t1;
+  let t2;
+  let t3;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setEnabled(screenfull.isEnabled);
+      const onChange = () => {
+        setActive(screenfull.isFullscreen);
+      };
       if (screenfull.isEnabled) {
-        screenfull.off('change', onChange);
+        screenfull.on("change", onChange);
       }
-    };
-  }, []);
-  return {
-    toggle: toggle,
-    fullscreen: fullscreen,
-    unFullscreen: unFullscreen,
-    active: active,
-    enabled: enabled
-  };
-};
-
-var _excluded$2 = ["entry"];
-var buildThresholdArray = function buildThresholdArray() {
-  return [0, 1.0];
-};
-var observersCache = new Map();
-var getOptionsKey = function getOptionsKey(_ref) {
-  var _ref$root = _ref.root,
-    root = _ref$root === void 0 ? null : _ref$root,
-    rootMargin = _ref.rootMargin,
-    _ref$threshold = _ref.threshold,
-    threshold = _ref$threshold === void 0 ? null : _ref$threshold;
-  return "root_".concat(root, "_rootMargin_").concat(rootMargin || null, "_threshold_").concat(threshold);
-};
-var createObserver = function createObserver(Observer) {
-  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var subscribers = [];
-  var addSubscriber = function addSubscriber(element, callback) {
-    var currentSubscriber = subscribers.find(function (it) {
-      return it.element === element;
-    }) || null;
-    if (currentSubscriber !== null) {
-      return subscribers.map(function (it) {
-        return it.element === element && it.callbacks.indexOf(callback) === -1 ? _objectSpread(_objectSpread({}, it), {}, {
-          callbacks: [].concat(_toConsumableArray(it.callbacks), [callback])
-        }) : it;
-      }).filter(function (it) {
-        return it.callbacks.length > 0;
-      });
-    }
-    return [].concat(_toConsumableArray(subscribers), [{
-      element: element,
-      callbacks: [callback]
-    }]);
-  };
-  var removeSubscriber = function removeSubscriber(element, callback) {
-    return subscribers.map(function (it) {
-      return it.element === element ? _objectSpread(_objectSpread({}, it), {}, {
-        callbacks: it.callbacks.filter(function (subCallback) {
-          return subCallback !== callback;
-        })
-      }) : it;
-    }).filter(function (it) {
-      return it.callbacks.length > 0;
-    });
-  };
-  var onUpdate = function onUpdate(entries) {
-    entries.forEach(function (entry) {
-      subscribers.forEach(function (_ref2) {
-        var element = _ref2.element,
-          callbacks = _ref2.callbacks;
-        if (element === entry.target) {
-          callbacks.forEach(function (callback) {
-            callback(entry);
-          });
-        }
-      });
-    });
-  };
-  var observer = new Observer(onUpdate, options);
-  var unsubscribe = function unsubscribe(element) {
-    var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    subscribers = removeSubscriber(element, callback);
-    if (typeof observer.unobserve === 'undefined') {
-      observer.disconnect();
-      subscribers.forEach(function (subscriber) {
-        observer.observe(subscriber.element);
-      });
-      return;
-    }
-    var currentSubscriber = subscribers.find(function (it) {
-      return it.element === element;
-    }) || null;
-    if (currentSubscriber === null) {
-      observer.unobserve(element);
-    }
-  };
-  var subscribe = function subscribe(element, callback) {
-    var currentSubscriber = subscribers.find(function (it) {
-      return it.element === element;
-    }) || null;
-    subscribers = addSubscriber(element, callback);
-    if (currentSubscriber === null) {
-      observer.observe(element);
-    }
-  };
-  return {
-    subscribe: subscribe,
-    unsubscribe: unsubscribe,
-    observer: observer
-  };
-};
-var getObserver = function getObserver(Observer) {
-  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var observerKey = getOptionsKey(options);
-  if (!observersCache.has(Observer)) {
-    observersCache.set(Observer, {});
-  }
-  var observers = observersCache.get(Observer);
-  if (typeof observers[observerKey] === 'undefined') {
-    observers[observerKey] = createObserver(Observer, options);
-    observersCache.set(Observer, observers);
-  }
-  return observers[observerKey];
-};
-var useObserver = function useObserver(Observer) {
-  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  var initialEntry = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-  var _ref3 = opts || {},
-    _ref3$root = _ref3.root,
-    root = _ref3$root === void 0 ? null : _ref3$root,
-    _ref3$rootMargin = _ref3.rootMargin,
-    rootMargin = _ref3$rootMargin === void 0 ? null : _ref3$rootMargin,
-    _ref3$threshold = _ref3.threshold,
-    threshold = _ref3$threshold === void 0 ? null : _ref3$threshold,
-    _ref3$disabled = _ref3.disabled,
-    disabled = _ref3$disabled === void 0 ? false : _ref3$disabled;
-  var _useState = useState(initialEntry),
-    _useState2 = _slicedToArray(_useState, 2),
-    entry = _useState2[0],
-    setEntry = _useState2[1];
-  var nodeRef = useRef(null);
-  var currentElement = useRef(null);
-  var elementChanged = nodeRef.current !== currentElement.current;
-  useEffect(function () {
-    var nodeElement = nodeRef.current;
-    var callback = function callback(newEntry) {
-      return setEntry(function (prev) {
-        // Avoid re-renders when ResizeObserver fires with unchanged dimensions
-        if (prev !== null && prev !== void 0 && prev.contentRect && newEntry !== null && newEntry !== void 0 && newEntry.contentRect) {
-          var p = prev.contentRect;
-          var n = newEntry.contentRect;
-          if (p.width === n.width && p.height === n.height) {
-            return prev;
-          }
+      return () => {
+        if (screenfull.isEnabled) {
+          screenfull.off("change", onChange);
         }
-        return newEntry;
-      });
+      };
     };
-    var unsubscribe = null;
-    if (nodeElement !== null) {
-      var newOpts = {};
-      if (root !== null) {
-        newOpts.root = root;
-      }
-      if (rootMargin !== null) {
-        newOpts.rootMargin = rootMargin;
-      }
-      if (threshold !== null) {
-        newOpts.threshold = threshold;
-      }
-      var _getObserver = getObserver(Observer, newOpts),
-        subscribe = _getObserver.subscribe,
-        localUnsubscribe = _getObserver.unsubscribe;
-      unsubscribe = localUnsubscribe;
-      subscribe(nodeElement, callback);
-    }
-    currentElement.current = nodeElement;
-    return function () {
-      if (unsubscribe !== null) {
-        unsubscribe(nodeElement, callback);
-      }
+    t3 = [];
+    $[3] = t2;
+    $[4] = t3;
+  } else {
+    t2 = $[3];
+    t3 = $[4];
+  }
+  useEffect(t2, t3);
+  let t4;
+  if ($[5] !== active || $[6] !== enabled || $[7] !== toggle) {
+    t4 = {
+      ref,
+      toggle,
+      fullscreen,
+      unFullscreen,
+      active,
+      enabled
     };
-  }, [Observer, elementChanged, disabled, root, rootMargin, threshold]);
-  return {
-    ref: nodeRef,
-    entry: entry
-  };
-};
-
-/**
- * Intersection Observer
- */
-var thresholdArray = buildThresholdArray();
-var intersectionObserverInitialEntry = {
-  target: null,
-  time: null,
-  isVisible: false,
-  isIntersecting: false,
-  intersectionRatio: 0,
-  intersectionRect: null,
-  boundingClientRect: null,
-  rootBounds: null
-};
-var useIntersectionObserver = function useIntersectionObserver() {
-  var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref4$root = _ref4.root,
-    root = _ref4$root === void 0 ? null : _ref4$root,
-    _ref4$rootMargin = _ref4.rootMargin,
-    rootMargin = _ref4$rootMargin === void 0 ? '0px' : _ref4$rootMargin,
-    _ref4$threshold = _ref4.threshold,
-    threshold = _ref4$threshold === void 0 ? thresholdArray : _ref4$threshold,
-    _ref4$disabled = _ref4.disabled,
-    disabled = _ref4$disabled === void 0 ? false : _ref4$disabled;
-  return useObserver(typeof window !== 'undefined' ? IntersectionObserver : null, {
-    root: root,
-    rootMargin: rootMargin,
-    threshold: threshold,
-    disabled: disabled
-  }, intersectionObserverInitialEntry);
+    $[5] = active;
+    $[6] = enabled;
+    $[7] = toggle;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  return t4;
 };
+function _temp$8() {
+  return screenfull.isEnabled;
+}
+function _temp2$2() {
+  if (screenfull.isEnabled) {
+    screenfull.exit();
+  }
+}
 
-/**
- * Resize Observer
- */
-var resizeObserverInitialEntry = {
-  target: null,
-  contentRect: null,
-  contentBoxSize: null,
-  borderBoxSize: null
-};
-var useResizeObserver = function useResizeObserver() {
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _ref5 = options || {},
-    _ref5$disabled = _ref5.disabled,
-    disabled = _ref5$disabled === void 0 ? false : _ref5$disabled;
-  return useObserver(typeof window !== 'undefined' ? ResizeObserver : null, {
-    disabled: disabled
-  }, resizeObserverInitialEntry);
-};
-var useDimensionObserver = function useDimensionObserver() {
-  var _useResizeObserver = useResizeObserver.apply(void 0, arguments),
-    entry = _useResizeObserver.entry,
-    rest = _objectWithoutProperties(_useResizeObserver, _excluded$2);
-  var _ref6 = entry || {},
-    _ref6$contentRect = _ref6.contentRect,
-    contentRect = _ref6$contentRect === void 0 ? null : _ref6$contentRect,
-    _ref6$borderBoxSize = _ref6.borderBoxSize,
-    borderBoxSize = _ref6$borderBoxSize === void 0 ? null : _ref6$borderBoxSize;
-  var _ref7 = contentRect || {},
-    _ref7$width = _ref7.width,
-    width = _ref7$width === void 0 ? 0 : _ref7$width,
-    _ref7$height = _ref7.height,
-    height = _ref7$height === void 0 ? 0 : _ref7$height;
-  var _ref8 = isArray(borderBoxSize) ? borderBoxSize[0] || {} : borderBoxSize || {},
-    _ref8$blockSize = _ref8.blockSize,
-    blockSize = _ref8$blockSize === void 0 ? null : _ref8$blockSize,
-    _ref8$inlineSize = _ref8.inlineSize,
-    inlineSize = _ref8$inlineSize === void 0 ? null : _ref8$inlineSize;
-  return _objectSpread(_objectSpread({}, rest), {}, {
-    entry: entry,
-    width: inlineSize || width,
-    height: blockSize || height
-  });
-};
+function useDimensionObserver(t0) {
+  const $ = c(16);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const opts = t1;
+  const t2 = useResizeObserver(opts);
+  let entry;
+  let rest;
+  if ($[2] !== t2) {
+    ({
+      entry,
+      ...rest
+    } = t2);
+    $[2] = t2;
+    $[3] = entry;
+    $[4] = rest;
+  } else {
+    entry = $[3];
+    rest = $[4];
+  }
+  let t3;
+  if ($[5] !== entry) {
+    t3 = entry || {};
+    $[5] = entry;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  const {
+    contentRect: t4,
+    borderBoxSize: t5
+  } = t3;
+  const contentRect = t4 === undefined ? null : t4;
+  const borderBoxSize = t5 === undefined ? null : t5;
+  let t6;
+  if ($[7] !== contentRect) {
+    t6 = contentRect || {};
+    $[7] = contentRect;
+    $[8] = t6;
+  } else {
+    t6 = $[8];
+  }
+  const {
+    width: t7,
+    height: t8
+  } = t6;
+  const width = t7 === undefined ? 0 : t7;
+  const height = t8 === undefined ? 0 : t8;
+  let t9;
+  if ($[9] !== borderBoxSize) {
+    t9 = isArray(borderBoxSize) ? borderBoxSize[0] || {} : borderBoxSize || {};
+    $[9] = borderBoxSize;
+    $[10] = t9;
+  } else {
+    t9 = $[10];
+  }
+  const {
+    blockSize: t10,
+    inlineSize: t11
+  } = t9;
+  const blockSize = t10 === undefined ? null : t10;
+  const inlineSize = t11 === undefined ? null : t11;
+  const t12 = inlineSize || width;
+  const t13 = blockSize || height;
+  let t14;
+  if ($[11] !== entry || $[12] !== rest || $[13] !== t12 || $[14] !== t13) {
+    t14 = {
+      ...rest,
+      entry,
+      width: t12,
+      height: t13
+    };
+    $[11] = entry;
+    $[12] = rest;
+    $[13] = t12;
+    $[14] = t13;
+    $[15] = t14;
+  } else {
+    t14 = $[15];
+  }
+  return t14;
+}
 
-var useIsVisible = function useIsVisible() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    rootMargin = _ref.rootMargin,
-    _ref$persist = _ref.persist,
-    persist = _ref$persist === void 0 ? false : _ref$persist,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
-  var _useIntersectionObser = useIntersectionObserver({
-      rootMargin: rootMargin,
-      disabled: disabled
-    }),
-    ref = _useIntersectionObser.ref,
-    isIntersecting = _useIntersectionObser.entry.isIntersecting;
-  var wasIntersecting = useRef(isIntersecting);
-  if (isIntersecting && !wasIntersecting.current) {
-    wasIntersecting.current = isIntersecting;
-  }
-  var isVisible = !persist && isIntersecting || persist && wasIntersecting.current;
-  return {
-    ref: ref,
-    visible: isVisible
-  };
+const useIsVisible = t0 => {
+  const $ = c(8);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    rootMargin,
+    persist: t2,
+    disabled: t3
+  } = t1;
+  const persist = t2 === undefined ? false : t2;
+  const disabled = t3 === undefined ? false : t3;
+  let t4;
+  if ($[2] !== disabled || $[3] !== rootMargin) {
+    t4 = {
+      rootMargin,
+      disabled
+    };
+    $[2] = disabled;
+    $[3] = rootMargin;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  const {
+    ref,
+    entry: t5
+  } = useIntersectionObserver(t4);
+  const {
+    isIntersecting
+  } = t5;
+  const [wasIntersecting, setWasIntersecting] = useState(isIntersecting);
+  if (isIntersecting && !wasIntersecting) {
+    setWasIntersecting(isIntersecting);
+  }
+  const isVisible = !persist && isIntersecting || persist && wasIntersecting;
+  let t6;
+  if ($[5] !== isVisible || $[6] !== ref) {
+    t6 = {
+      ref,
+      visible: isVisible
+    };
+    $[5] = isVisible;
+    $[6] = ref;
+    $[7] = t6;
+  } else {
+    t6 = $[7];
+  }
+  return t6;
 };
 
-var fontsMap = {
+const fontsMap = {
   loading: [],
   active: []
 };
-var isFontLoading = function isFontLoading(name) {
-  return fontsMap.loading.indexOf(name) !== -1;
+const isFontLoading = name => fontsMap.loading.indexOf(name) !== -1;
+const isFontActive = name => fontsMap.active.indexOf(name) !== -1;
+const addFontLoading = name => {
+  fontsMap.active = fontsMap.active.filter(it => it !== name);
+  fontsMap.loading = [...fontsMap.loading, name];
 };
-var isFontActive = function isFontActive(name) {
-  return fontsMap.active.indexOf(name) !== -1;
+const removeFontLoading = name => {
+  fontsMap.loading = fontsMap.loading.filter(it => it !== name);
 };
-var addFontLoading = function addFontLoading(name) {
-  fontsMap.active = fontsMap.active.filter(function (it) {
-    return it !== name;
-  });
-  fontsMap.loading = [].concat(_toConsumableArray(fontsMap.loading), [name]);
-};
-var removeFontLoading = function removeFontLoading(name) {
-  fontsMap.loading = fontsMap.loading.filter(function (it) {
-    return it !== name;
-  });
+const addFontActive = name => {
+  fontsMap.loading = fontsMap.loading.filter(it => it !== name);
+  fontsMap.active = [...fontsMap.active, name];
 };
-var addFontActive = function addFontActive(name) {
-  fontsMap.loading = fontsMap.loading.filter(function (it) {
-    return it !== name;
-  });
-  fontsMap.active = [].concat(_toConsumableArray(fontsMap.active), [name]);
-};
-var useLoadedFonts = function useLoadedFonts(fonts) {
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    loaded = _useState2[0],
-    setLoaded = _useState2[1];
-  useEffect(function () {
-    var config = fonts.reduce(function (newConfig, font) {
-      var _ref = isObject(font) ? font : {
-          type: 'system',
-          name: font
-        },
-        type = _ref.type,
-        name = _ref.name,
-        _ref$variants = _ref.variants,
-        variants = _ref$variants === void 0 ? [] : _ref$variants;
+const useLoadedFonts = fonts => {
+  const [loaded, setLoaded] = useState(false);
+  useEffect(() => {
+    const config = fonts.reduce((newConfig, font) => {
+      const {
+        type,
+        name,
+        variants = []
+      } = isObject(font) ? font : {
+        type: 'system',
+        name: font
+      };
       if ((type === 'google' || type === 'custom') && !isFontLoading(name) && !isFontActive(name)) {
-        return _objectSpread(_objectSpread({}, newConfig), {}, _defineProperty({}, type, {
-          families: [].concat(_toConsumableArray(newConfig !== null ? (newConfig[type] || {}).families || [] : []), [type === 'google' ? [name, (variants || []).filter(function (it) {
-            return it !== null;
-          }).join(',')].filter(function (it) {
-            return it !== null && it.length > 0;
-          }).join(':') : [name, (variants !== null ? [{
-            fvd: 'n4'
-          }].concat(_toConsumableArray(variants)) : []).map(function (_ref2) {
-            var _ref2$fvd = _ref2.fvd,
-              fvd = _ref2$fvd === void 0 ? null : _ref2$fvd,
-              _ref2$weight = _ref2.weight,
-              weight = _ref2$weight === void 0 ? null : _ref2$weight,
-              _ref2$style = _ref2.style,
-              style = _ref2$style === void 0 ? null : _ref2$style;
-            return fvd || [style, weight].filter(function (it) {
-              return it !== null;
-            }).map(function (it) {
-              return "".concat(it).substr(0, 1);
-            }).join('');
-          }).filter(function (it) {
-            return it !== null && it.length > 0;
-          }).join(',')].filter(function (it) {
-            return it !== null && it.length > 0;
-          }).join(':')])
-        }));
+        return {
+          ...newConfig,
+          [type]: {
+            families: [...(newConfig !== null ? (newConfig[type] || {}).families || [] : []), type === 'google' ? [name, (variants || []).filter(it => it !== null).join(',')].filter(it_0 => it_0 !== null && it_0.length > 0).join(':') : [name, (variants !== null ? [{
+              fvd: 'n4'
+            }, ...variants] : []).map(({
+              fvd = null,
+              weight = null,
+              style = null
+            }) => fvd || [style, weight].filter(it_1 => it_1 !== null).map(it_2 => `${it_2}`.substr(0, 1)).join('')).filter(it_3 => it_3 !== null && it_3.length > 0).join(',')].filter(it_4 => it_4 !== null && it_4.length > 0).join(':')]
+          }
+        };
       }
       return newConfig;
     }, null);
-    var hasConfig = config !== null;
+    const hasConfig = config !== null;
     if (hasConfig && typeof window !== 'undefined') {
-      import('webfontloader').then(function (_ref3) {
-        var WebFont = _ref3["default"];
-        return WebFont.load(_objectSpread(_objectSpread({}, config), {}, {
-          timeout: 3000,
-          active: function active() {
-            return setLoaded(true);
-          },
-          fontloading: function fontloading(name) {
-            return addFontLoading(name);
-          },
-          fontactive: function fontactive(name) {
-            return addFontActive(name);
-          },
-          fontinactive: function fontinactive(name) {
-            return removeFontLoading(name);
-          }
-        }));
-      });
+      import('webfontloader').then(({
+        default: WebFont
+      }) => WebFont.load({
+        ...config,
+        timeout: 3000,
+        active: () => setLoaded(true),
+        fontloading: name_0 => addFontLoading(name_0),
+        fontactive: name_1 => addFontActive(name_1),
+        fontinactive: name_2 => removeFontLoading(name_2)
+      }));
     } else {
       setLoaded(true);
     }
   }, [fonts, setLoaded]);
   return {
-    loaded: loaded
+    loaded
   };
 };
 
-var isTouchEvent = function isTouchEvent(event) {
-  return 'touches' in event;
-};
-var preventDefault = function preventDefault(event) {
+const isTouchEvent = event => 'touches' in event;
+const preventDefault = event => {
   if (!isTouchEvent(event)) return false;
   if (event.touches.length < 2 && event.preventDefault) {
     event.preventDefault();
   }
   return false;
 };
-var preventClickDefault = function preventClickDefault(e) {
+const preventClickDefault = e => {
   if (e.preventDefault) {
     e.preventDefault();
   }
@@ -813,35 +967,22 @@ var preventClickDefault = function preventClickDefault(e) {
     e.stopPropagation();
   }
 };
-var useLongPress = function useLongPress() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$onLongPress = _ref.onLongPress,
-    onLongPress = _ref$onLongPress === void 0 ? null : _ref$onLongPress,
-    _ref$onLongPressStart = _ref.onLongPressStart,
-    onLongPressStart = _ref$onLongPressStart === void 0 ? null : _ref$onLongPressStart,
-    _ref$onLongPressEnd = _ref.onLongPressEnd,
-    onLongPressEnd = _ref$onLongPressEnd === void 0 ? null : _ref$onLongPressEnd,
-    _ref$onClick = _ref.onClick,
-    onClick = _ref$onClick === void 0 ? null : _ref$onClick,
-    _ref$shouldPreventDef = _ref.shouldPreventDefault,
-    shouldPreventDefault = _ref$shouldPreventDef === void 0 ? true : _ref$shouldPreventDef,
-    _ref$shouldStopPropag = _ref.shouldStopPropagation,
-    shouldStopPropagation = _ref$shouldStopPropag === void 0 ? false : _ref$shouldStopPropag,
-    _ref$preventClick = _ref.preventClick,
-    preventClick = _ref$preventClick === void 0 ? false : _ref$preventClick,
-    _ref$delay = _ref.delay,
-    delay = _ref$delay === void 0 ? 350 : _ref$delay;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    pressed = _useState2[0],
-    setPressed = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    triggered = _useState4[0],
-    setTriggered = _useState4[1];
-  var timeout = useRef(null);
-  var target = useRef(null);
-  var start = useCallback(function (event, props) {
+const useLongPress = ({
+  onLongPress = null,
+  onLongPressStart = null,
+  onLongPressEnd = null,
+  onClick = null,
+  shouldPreventDefault = true,
+  shouldStopPropagation = false,
+  preventClick = false,
+  // lockOnceTriggered = false,
+  delay = 350
+} = {}) => {
+  const [pressed, setPressed] = useState(false);
+  const [triggered, setTriggered] = useState(false);
+  const timeout = useRef(null);
+  const target = useRef(null);
+  const start = useCallback((event, props) => {
     setPressed(true);
     if (shouldStopPropagation) {
       event.stopPropagation();
@@ -852,7 +993,7 @@ var useLongPress = function useLongPress() {
     if (onLongPressStart !== null) {
       onLongPressStart(event, props);
     }
-    timeout.current = setTimeout(function () {
+    timeout.current = setTimeout(() => {
       if (shouldPreventDefault && target.current !== null) {
         target.current.addEventListener('touchend', preventDefault, {
           passive: false
@@ -869,8 +1010,7 @@ var useLongPress = function useLongPress() {
       timeout.current = null;
     }, delay);
   }, [onLongPress, onLongPressStart, delay, setPressed, shouldPreventDefault]);
-  var clear = useCallback(function (event, props) {
-    var shouldTriggerClick = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  const clear = useCallback((event_0, props_0, shouldTriggerClick = true) => {
     setPressed(false);
     if (preventClick && triggered) {
       return;
@@ -878,1408 +1018,1575 @@ var useLongPress = function useLongPress() {
     if (timeout.current !== null) {
       clearTimeout(timeout.current);
     } else if (shouldPreventDefault && target.current !== null) {
-      preventDefault(event);
+      preventDefault(event_0);
       target.current.removeEventListener('touchend', preventDefault);
-      setTimeout(function () {
+      setTimeout(() => {
         target.current.removeEventListener('click', preventClickDefault);
       }, 10);
     }
     if (shouldTriggerClick && !triggered && onClick !== null) {
-      onClick(props);
+      onClick(props_0);
     }
-    onLongPressEnd(event, props, triggered);
+    onLongPressEnd(event_0, props_0, triggered);
     setTriggered(false);
   }, [shouldPreventDefault, onClick, onLongPressEnd, setPressed, triggered, preventClick]);
-  var bind = function bind() {
-    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    return {
-      onMouseDown: function onMouseDown(e) {
-        return start(e, props);
-      },
-      onTouchStart: function onTouchStart(e) {
-        return start(e, props);
-      },
-      onMouseUp: function onMouseUp(e) {
-        return clear(e, props);
-      },
-      onMouseLeave: function onMouseLeave(e) {
-        return clear(e, props, false);
-      },
-      onTouchEnd: function onTouchEnd(e) {
-        return clear(e, props);
-      }
-    };
-  };
+  const bind = (props_1 = null) => ({
+    onMouseDown: e => start(e, props_1),
+    onTouchStart: e_0 => start(e_0, props_1),
+    onMouseUp: e_1 => clear(e_1, props_1),
+    onMouseLeave: e_2 => clear(e_2, props_1, false),
+    onTouchEnd: e_3 => clear(e_3, props_1)
+  });
   return {
-    bind: bind,
-    pressed: pressed,
-    triggered: triggered
+    bind,
+    pressed,
+    triggered
   };
 };
 
-var progressSteps = [0.1, 0.25, 0.5, 0.75, 0.9];
-var useMediaApi = function useMediaApi() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$url = _ref.url,
-    url = _ref$url === void 0 ? null : _ref$url,
-    _ref$onTimeUpdate = _ref.onTimeUpdate,
-    onTimeUpdate = _ref$onTimeUpdate === void 0 ? null : _ref$onTimeUpdate,
-    _ref$onProgressStep = _ref.onProgressStep,
-    onProgressStep = _ref$onProgressStep === void 0 ? null : _ref$onProgressStep,
-    _ref$onDurationChange = _ref.onDurationChange,
-    onDurationChange = _ref$onDurationChange === void 0 ? null : _ref$onDurationChange,
-    _ref$onVolumeChange = _ref.onVolumeChange,
-    onVolumeChange = _ref$onVolumeChange === void 0 ? null : _ref$onVolumeChange,
-    _ref$onPlay = _ref.onPlay,
-    onPlay = _ref$onPlay === void 0 ? null : _ref$onPlay,
-    _ref$onPause = _ref.onPause,
-    onPause = _ref$onPause === void 0 ? null : _ref$onPause,
-    _ref$onEnded = _ref.onEnded,
-    onEnded = _ref$onEnded === void 0 ? null : _ref$onEnded,
-    _ref$onSeeked = _ref.onSeeked,
-    onSeeked = _ref$onSeeked === void 0 ? null : _ref$onSeeked,
-    _ref$onSuspend = _ref.onSuspend,
-    onSuspend = _ref$onSuspend === void 0 ? null : _ref$onSuspend,
-    _ref$onLoadStart = _ref.onLoadStart,
-    onLoadStart = _ref$onLoadStart === void 0 ? null : _ref$onLoadStart,
-    _ref$onCanPlayThough = _ref.onCanPlayThough,
-    onCanPlayThough = _ref$onCanPlayThough === void 0 ? null : _ref$onCanPlayThough,
-    _ref$onCanPlay = _ref.onCanPlay,
-    onCanPlay = _ref$onCanPlay === void 0 ? null : _ref$onCanPlay,
-    _ref$onLoadedData = _ref.onLoadedData,
-    onLoadedData = _ref$onLoadedData === void 0 ? null : _ref$onLoadedData,
-    _ref$onLoadedMetadata = _ref.onLoadedMetadata,
-    onLoadedMetadata = _ref$onLoadedMetadata === void 0 ? null : _ref$onLoadedMetadata;
-  var ref = useRef(null);
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    currentTime = _useState2[0],
-    setCurrentTime = _useState2[1];
-  var _useState3 = useState(null),
-    _useState4 = _slicedToArray(_useState3, 2),
-    duration = _useState4[0],
-    setDuration = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    playing = _useState6[0],
-    setPlaying = _useState6[1];
-  var _useState7 = useState(false),
-    _useState8 = _slicedToArray(_useState7, 2),
-    ready = _useState8[0],
-    setReady = _useState8[1];
-  var _useState9 = useState(false),
-    _useState0 = _slicedToArray(_useState9, 2),
-    dataReady = _useState0[0],
-    setDataReady = _useState0[1];
-  var _useState1 = useState(true),
-    _useState10 = _slicedToArray(_useState1, 2),
-    initialPlay = _useState10[0],
-    setInitialPlay = _useState10[1];
-  var _useState11 = useState(false),
-    _useState12 = _slicedToArray(_useState11, 2),
-    suspended = _useState12[0],
-    setSuspended = _useState12[1];
-  var progressStepsReached = useRef({});
-  var paused = !playing;
-
-  // Exposed methods
-
-  var play = useCallback(function () {
-    var media = ref.current;
-    if (media !== null) {
-      media.play();
-    }
-  }, []);
-  var pause = useCallback(function () {
-    var media = ref.current;
-    if (media !== null) {
-      media.pause();
-    }
-  }, []);
-  var stop = useCallback(function () {
-    var media = ref.current;
-    if (media !== null) {
-      media.pause();
-      media.currentTime = 0;
-    }
-  }, []);
-  var seek = useCallback(function (time) {
-    var media = ref.current;
-    if (media !== null) {
-      media.currentTime = time;
-    }
-  }, []);
-
-  // const mute = useCallback(() => {
-  //     const { current: media } = ref;
-  //     if (media !== null) {
-  //         media.muted = true;
-  //     }
-  // }, []);
-
-  // const unMute = useCallback(() => {
-  //     const { current: media } = ref;
-  //     if (media !== null) {
-  //         media.muted = false;
-  //     }
-  // }, []);
-
-  // Media events callbacks
-
-  var onCustomPlay = useCallback(function () {
-    if (onPlay !== null) {
-      onPlay({
-        initial: initialPlay
-      });
-    }
-    if (initialPlay) {
-      setInitialPlay(false);
-    }
-    setPlaying(true);
-    setSuspended(false);
-  }, [initialPlay, setPlaying, onPlay]);
-  var onCustomPlaying = useCallback(function () {
-    setPlaying(true);
-    setSuspended(false);
-  }, []);
-  var onCustomPause = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-    setPlaying(false);
-    if (onPause !== null) {
-      onPause({
-        midway: eventMedia.currentTime > 0 && eventMedia.currentTime < eventMedia.duration
-      });
-    }
-  }, [setPlaying, onPause]);
-  var onCustomEnded = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-    eventMedia.currentTime = 0;
-    if (onEnded !== null) {
-      onEnded();
-    }
-    setInitialPlay(true);
-  }, [setInitialPlay, onEnded]);
-  var onCustomTimeUpdate = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-    setCurrentTime(eventMedia.currentTime);
-    if (onTimeUpdate !== null) {
-      onTimeUpdate(eventMedia.currentTime);
-    }
-    var progress = eventMedia.currentTime / eventMedia.duration;
-    var currentSteps = progressStepsReached.current;
-    var stepsToTrack = progressSteps.filter(function (step) {
-      return progress > step && typeof currentSteps[step] === 'undefined';
-    });
-    stepsToTrack.forEach(function (step) {
-      if (onProgressStep !== null) {
-        onProgressStep(step);
-      }
-      currentSteps[step] = true;
-    });
-  }, [setCurrentTime, onTimeUpdate, onProgressStep]);
-  var onCustomDurationChange = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-    setDuration(eventMedia.duration);
-    if (onDurationChange !== null) {
-      onDurationChange(eventMedia.duration);
-    }
-  }, [setDuration, onDurationChange]);
-  var onCustomSeeked = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-    if (onSeeked !== null) {
-      onSeeked(eventMedia.currentTime);
-    }
-  }, [onSeeked]);
-  var onCustomVolumeChange = useCallback(function (e) {
-    var eventMedia = e.currentTarget;
-
-    // setMuted(eventMedia.muted);
-    if (onVolumeChange !== null) {
-      onVolumeChange(eventMedia.volume);
-    }
-  }, [onVolumeChange]);
-  var onCustomLoadStart = useCallback(function () {
-    if (onLoadStart !== null) {
-      onLoadStart();
-    }
-  }, [setReady, onLoadStart]);
-  var onCustomCanPlayThrough = useCallback(function () {
-    setReady(true);
-    if (onCanPlayThough !== null) {
-      onCanPlayThough();
-    }
-  }, [setReady, onCanPlayThough]);
-  var onCustomCanPlay = useCallback(function () {
-    setReady(true);
-    if (onCanPlay !== null) {
-      onCanPlay();
-    }
-  }, [setReady, onCanPlay]);
-  var onCustomLoadedMetadata = useCallback(function () {
-    setReady(true);
-    if (onLoadedMetadata !== null) {
-      onLoadedMetadata();
-    }
-  }, [setReady, onLoadedMetadata]);
-  var onCustomLoadedData = useCallback(function () {
-    setDataReady(true);
-    if (onLoadedData !== null) {
-      onLoadedData();
-    }
-  }, [setDataReady, onLoadedData]);
-  var onCustomSuspended = useCallback(function () {
-    setSuspended(true);
-    if (onSuspend !== null) {
-      onSuspend();
-    }
-  }, [setSuspended, onSuspended]);
-  useEffect(function () {
-    var _ref$current = ref.current,
-      media = _ref$current === void 0 ? null : _ref$current;
-
-    // console.log('actions', url);
-
-    if (media !== null) {
-      media.addEventListener('volumechange', onCustomVolumeChange);
-      media.addEventListener('play', onCustomPlay);
-      media.addEventListener('playing', onCustomPlaying);
-      media.addEventListener('pause', onCustomPause);
-      media.addEventListener('ended', onCustomEnded);
-      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('playing', onCustomPlaying);
-        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, onCustomSuspended
-  // 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);
-      media.addEventListener('loadedmetadata', onCustomLoadedMetadata);
-      media.addEventListener('loadeddata', onCustomLoadedData);
-      media.addEventListener('suspend', onCustomSuspended);
-    }
-    return function () {
-      if (media !== null) {
-        media.removeEventListener('loadstart', onCustomLoadStart);
-        media.removeEventListener('canplaythrough', onCustomCanPlayThrough);
-        media.removeEventListener('canplay', onCustomCanPlay);
-        media.removeEventListener('loadedmetadata', onCustomLoadedMetadata);
-        media.removeEventListener('suspend', onCustomSuspended);
-      }
-    };
-  }, [url, onCustomLoadStart, onCustomCanPlayThrough, onCustomCanPlay, onCustomLoadedMetadata, onCustomSuspended]);
-
-  // Duration
-  useEffect(function () {
-    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);
+const useMediaBuffering = t0 => {
+  const $ = c(7);
+  const media = t0 === undefined ? null : t0;
+  let t1;
+  if ($[0] !== media) {
+    t1 = () => getMediaIsBuffering(media);
+    $[0] = media;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const [buffering, setBuffering] = useState(t1);
+  let t2;
+  let t3;
+  if ($[2] !== media) {
+    t2 = () => {
+      if (media === null) {
+        return _temp$7;
       }
+      const onBufferingEvent = function onBufferingEvent(e) {
+        setBuffering(getMediaIsBuffering(e.currentTarget));
+      };
+      media.addEventListener("canplay", onBufferingEvent);
+      media.addEventListener("waiting", onBufferingEvent);
+      media.addEventListener("stalled", onBufferingEvent);
+      media.addEventListener("play", onBufferingEvent);
+      media.addEventListener("playing", onBufferingEvent);
+      media.addEventListener("pause", onBufferingEvent);
+      media.addEventListener("ended", onBufferingEvent);
+      return () => {
+        media.removeEventListener("canplay", onBufferingEvent);
+        media.removeEventListener("waiting", onBufferingEvent);
+        media.removeEventListener("stalled", onBufferingEvent);
+        media.removeEventListener("play", onBufferingEvent);
+        media.removeEventListener("playing", onBufferingEvent);
+        media.removeEventListener("pause", onBufferingEvent);
+        media.removeEventListener("ended", onBufferingEvent);
+      };
     };
-  }, [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);
-    } else {
-      setDataReady(false);
-    }
-    if (media !== null && media.readyState > 3) {
-      setReady(true);
-    } else {
-      setReady(false);
-    }
-  }, [url]);
-  return {
-    ref: ref,
-    play: play,
-    pause: pause,
-    stop: stop,
-    seek: seek,
-    currentTime: currentTime,
-    duration: duration,
-    playing: playing,
-    paused: paused,
-    ready: ready,
-    dataReady: dataReady,
-    suspended: suspended
-  };
-};
-
-var useMediaBuffering = function useMediaBuffering() {
-  var mediaElement = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    buffering = _useState2[0],
-    setBuffering = _useState2[1];
-  useEffect(function () {
-    if (mediaElement === null) {
-      return function () {};
-    }
-    function onBufferingEvent(e) {
-      // networkstate
-      if (mediaElement.networkState === mediaElement.NETWORK_LOADING) {
-        // The user agent is actively trying to download data.
-        setBuffering(true);
-      }
-
-      // readystate
-      if (mediaElement.readyState < mediaElement.HAVE_FUTURE_DATA) {
-        // There is not enough data to keep playing from this point
-        setBuffering(true);
-      }
-    }
-    function onPlay() {
-      setBuffering(false);
-    }
-    function onPlaying() {
-      setBuffering(false);
-    }
-    function onPause() {
-      setBuffering(false);
-    }
-    function onEnded() {
-      setBuffering(false);
-    }
-    mediaElement.addEventListener('waiting', onBufferingEvent);
-    mediaElement.addEventListener('stalled', onBufferingEvent);
-    mediaElement.addEventListener('play', onPlay);
-    mediaElement.addEventListener('playing', onPlaying);
-    mediaElement.addEventListener('pause', onPause);
-    mediaElement.addEventListener('ended', onEnded);
-    return function () {
-      mediaElement.removeEventListener('waiting', onBufferingEvent);
-      mediaElement.removeEventListener('stalled', onBufferingEvent);
-      mediaElement.removeEventListener('play', onPlay);
-      mediaElement.removeEventListener('playing', onPlaying);
-      mediaElement.removeEventListener('pause', onPause);
-      mediaElement.removeEventListener('ended', onEnded);
+    t3 = [media];
+    $[2] = media;
+    $[3] = t2;
+    $[4] = t3;
+  } else {
+    t2 = $[3];
+    t3 = $[4];
+  }
+  useEffect(t2, t3);
+  let t4;
+  if ($[5] !== buffering) {
+    t4 = {
+      buffering
     };
-  }, [mediaElement]);
-
-  // useEffect(() => {
-  //     if (mediaElement === null) {
-  //         return () => {};
-  //     }
-  //     let lastPlayPos = 0;
-  //     let currentPlayPos = 0;
-  //     let bufferingDetected = false;
-
-  //     function checkBuffering(player, checkInterval) {
-  //         currentPlayPos = player.currentTime;
-
-  //         // checking offset should be at most the check interval
-  //         // but allow for some margin
-  //         const offset = (checkInterval - 20) / 1000;
-
-  //         // if no buffering is currently detected,
-  //         // and the position does not seem to increase
-  //         // and the player isn't manually paused...
-  //         if (!bufferingDetected && currentPlayPos < lastPlayPos + offset && !player.paused) {
-  //             console.log('buffering!');
-  //             bufferingDetected = true;
-  //         }
-
-  //         // if we were buffering but the player has advanced,
-  //         // then there is no buffering
-  //         if (bufferingDetected && currentPlayPos > lastPlayPos + offset && !player.paused) {
-  //             console.log('not buffering anymore!');
-  //             bufferingDetected = false;
-  //         }
-  //         lastPlayPos = currentPlayPos;
-
-  //         return bufferingDetected;
-  //     }
-
-  //     const id = setInterval(() => {
-  //         setBuffering(checkBuffering(mediaElement, interval));
-  //     }, interval);
-
-  //     return () => {
-  //         clearInterval(id);
-  //     };
-  // }, [mediaElement, interval]);
-
-  return {
-    buffering: buffering
-  };
+    $[5] = buffering;
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  return t4;
 };
-
-var useMediaState = function useMediaState() {
-  var mediaElement = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$playing = _ref.playing,
-    wantedPlaying = _ref$playing === void 0 ? false : _ref$playing,
-    _ref$muted = _ref.muted,
-    wantedMuted = _ref$muted === void 0 ? false : _ref$muted;
-  var src = mediaElement !== null ? mediaElement.currentSrc || mediaElement.src : null;
-  var debug = useMemo(function () {
-    var mediaKey = src !== null ? src.split('/')[src.split('/').length - 1].split('#')[0] || null : null;
-    return createDebug(mediaKey !== null ? "micromag:media:".concat(mediaKey) : 'micromag:media');
-  }, [src]);
-  var _useState = useState(wantedPlaying),
-    _useState2 = _slicedToArray(_useState, 2),
-    playing = _useState2[0],
-    setPlaying = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    buffering = _useState4[0],
-    setBuffering = _useState4[1];
-  var _useState5 = useState(mediaElement !== null && (mediaElement.muted || mediaElement.volume === 0) || wantedMuted),
-    _useState6 = _slicedToArray(_useState5, 2),
-    muted = _useState6[0],
-    setMuted = _useState6[1];
-  useEffect(function () {
-    debug('State change %o', {
-      playing: playing,
-      buffering: buffering,
-      muted: muted
-    });
-  }, [playing, buffering, muted, debug]);
-  useEffect(function () {
-    if (mediaElement === null) {
-      setPlaying(wantedPlaying);
-      setBuffering(false);
-      setMuted(wantedMuted);
-      debug('Unset media: %o', {
-        wantedPlaying: wantedPlaying,
-        wantedMuted: wantedMuted
-      });
-    }
-  }, [mediaElement, src, debug, wantedPlaying, wantedMuted]);
-  useEffect(function () {
-    if (mediaElement === null) {
-      return function () {};
-    }
-    function onBufferingEvent(e) {
-      // networkstate
-      if (mediaElement !== null && mediaElement.networkState === mediaElement.NETWORK_LOADING) {
-        debug('onBufferingEvent: NETWORK_LOADING');
-        setBuffering(true);
-      }
-
-      // readystate
-      if (mediaElement !== null && mediaElement.readyState < mediaElement.HAVE_FUTURE_DATA) {
-        debug('onBufferingEvent: HAVE_FUTURE_DATA');
-        setBuffering(true);
-      }
-    }
-    function onPlay() {
-      debug('onPlay');
-      setPlaying(true);
-      setBuffering(false);
-    }
-    function onPlaying() {
-      debug('onPlaying');
-      setPlaying(true);
-      setBuffering(false);
-    }
-    function onTimeUpdate(e) {
-      debug('onTimeUpdate');
-      setPlaying(!e.currentTarget.paused && !e.currentTarget.ended);
-      setBuffering(false);
-    }
-    function onPause() {
-      debug('onPause');
-      setPlaying(false);
-      setBuffering(false);
-    }
-    function onEnded() {
-      debug('onEnded');
-      setPlaying(false);
-      setBuffering(false);
-    }
-    function onSuspend(e) {
-      debug('onSuspend');
-      setPlaying(!e.currentTarget.paused && !e.currentTarget.ended);
+function _temp$7() {}
+
+function useMediaState(t0, t1) {
+  const $ = c(35);
+  const media = t0 === undefined ? null : t0;
+  let t2;
+  if ($[0] !== t1) {
+    t2 = t1 === undefined ? {} : t1;
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const {
+    playing: t3,
+    muted: t4
+  } = t2;
+  const wantedPlaying = t3 === undefined ? false : t3;
+  const wantedMuted = t4 === undefined ? false : t4;
+  const [currentMediaElement, setCurrentMediaElement] = useState(media);
+  let t5;
+  if ($[2] !== media) {
+    t5 = () => getMediaSrc(media);
+    $[2] = media;
+    $[3] = t5;
+  } else {
+    t5 = $[3];
+  }
+  const [src, setSrc] = useState(t5);
+  let t6;
+  if ($[4] !== media || $[5] !== wantedPlaying) {
+    t6 = () => getMediaIsPlaying(media) || wantedPlaying;
+    $[4] = media;
+    $[5] = wantedPlaying;
+    $[6] = t6;
+  } else {
+    t6 = $[6];
+  }
+  const [playing, setPlaying] = useState(t6);
+  const [buffering, setBuffering] = useState(false);
+  let t7;
+  if ($[7] !== media || $[8] !== wantedMuted) {
+    t7 = () => getMediaIsMuted(media) || wantedMuted;
+    $[7] = media;
+    $[8] = wantedMuted;
+    $[9] = t7;
+  } else {
+    t7 = $[9];
+  }
+  const [muted, setMuted] = useState(t7);
+  let t8;
+  if ($[10] !== src) {
+    t8 = getMediaFilename(src);
+    $[10] = src;
+    $[11] = t8;
+  } else {
+    t8 = $[11];
+  }
+  const mediaKey = t8;
+  let debug;
+  if ($[12] !== currentMediaElement || $[13] !== media || $[14] !== mediaKey || $[15] !== wantedMuted || $[16] !== wantedPlaying) {
+    debug = createDebug(mediaKey !== null ? `micromag:media:${mediaKey}` : "micromag:media");
+    if (media !== currentMediaElement) {
+      setPlaying(getMediaIsPlaying(media) || wantedPlaying);
       setBuffering(false);
+      setMuted(getMediaIsMuted(media) || wantedMuted);
+      setCurrentMediaElement(media);
+      setSrc(getMediaSrc(media));
+      debug("Unset media: %o", {
+        wantedPlaying,
+        wantedMuted
+      });
     }
-    function onVolumeChange() {
-      setMuted(mediaElement.muted || mediaElement.volume === 0);
-    }
-    if (mediaElement.paused || mediaElement.ended) {
-      setPlaying(false);
-    }
-    if (muted !== mediaElement.muted) {
-      setMuted(mediaElement.muted);
-    }
-    mediaElement.addEventListener('waiting', onBufferingEvent);
-    mediaElement.addEventListener('stalled', onBufferingEvent);
-    mediaElement.addEventListener('timeupdate', onTimeUpdate);
-    mediaElement.addEventListener('play', onPlay);
-    mediaElement.addEventListener('playing', onPlaying);
-    mediaElement.addEventListener('pause', onPause);
-    mediaElement.addEventListener('suspend', onSuspend);
-    mediaElement.addEventListener('ended', onEnded);
-    mediaElement.addEventListener('volumechange', onVolumeChange);
-    return function () {
-      mediaElement.removeEventListener('waiting', onBufferingEvent);
-      mediaElement.removeEventListener('stalled', onBufferingEvent);
-      mediaElement.removeEventListener('timeupdate', onTimeUpdate);
-      mediaElement.removeEventListener('play', onPlay);
-      mediaElement.removeEventListener('playing', onPlaying);
-      mediaElement.removeEventListener('pause', onPause);
-      mediaElement.removeEventListener('suspend', onSuspend);
-      mediaElement.removeEventListener('ended', onEnded);
-      mediaElement.removeEventListener('volumechange', onVolumeChange);
+    $[12] = currentMediaElement;
+    $[13] = media;
+    $[14] = mediaKey;
+    $[15] = wantedMuted;
+    $[16] = wantedPlaying;
+    $[17] = debug;
+  } else {
+    debug = $[17];
+  }
+  let t10;
+  let t9;
+  if ($[18] !== buffering || $[19] !== debug || $[20] !== muted || $[21] !== playing) {
+    t9 = () => {
+      debug("State change %o", {
+        playing,
+        buffering,
+        muted
+      });
     };
-  }, [mediaElement, debug, src]);
-  return {
-    playing: playing,
-    muted: muted,
-    buffering: buffering
-  };
-};
-
-function useMediaTimestampOffset(element) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$attributeName = _ref.attributeName,
-    attributeName = _ref$attributeName === void 0 ? 'data-ts-offset' : _ref$attributeName;
-  var getTimestampOffset = function getTimestampOffset() {
-    return element !== null && element.hasAttribute(attributeName) ? parseFloat(element.getAttribute(attributeName)) : 0;
-  };
-  var _useState = useState(getTimestampOffset()),
-    _useState2 = _slicedToArray(_useState, 2),
-    timestampOffset = _useState2[0],
-    setTimestampOffset = _useState2[1];
-  var observerRef = useRef(null);
-  useEffect(function () {
-    if (element !== null) {
-      observerRef.current = new MutationObserver(function (mutations) {
-        mutations.forEach(function (_ref2) {
-          var mutationType = _ref2.type;
-          if (mutationType === 'attributes') {
-            setTimestampOffset(getTimestampOffset());
+    t10 = [playing, buffering, muted, debug];
+    $[18] = buffering;
+    $[19] = debug;
+    $[20] = muted;
+    $[21] = playing;
+    $[22] = t10;
+    $[23] = t9;
+  } else {
+    t10 = $[22];
+    t9 = $[23];
+  }
+  useEffect(t9, t10);
+  let t11;
+  if ($[24] !== debug || $[25] !== media) {
+    t11 = () => {
+      if (media === null) {
+        return _temp$6;
+      }
+      const onBufferingEvent = function onBufferingEvent(e) {
+        if (e.currentTarget.networkState === e.currentTarget.NETWORK_LOADING) {
+          debug("onBufferingEvent: NETWORK_LOADING");
+        } else {
+          if (e.currentTarget.readyState < e.currentTarget.HAVE_FUTURE_DATA) {
+            debug("onBufferingEvent: HAVE_FUTURE_DATA");
           }
+        }
+        setBuffering(getMediaIsBuffering(e.currentTarget));
+      };
+      let timeUpdated = false;
+      const onPlay = function onPlay() {
+        timeUpdated = false;
+        debug("onPlay");
+        setPlaying(true);
+        setBuffering(false);
+      };
+      const onPlaying = function onPlaying() {
+        timeUpdated = false;
+        debug("onPlaying");
+        setPlaying(true);
+        setBuffering(false);
+      };
+      const onTimeUpdate = function onTimeUpdate(e_0) {
+        if (!timeUpdated) {
+          debug("onTimeUpdate");
+          timeUpdated = true;
+        }
+        setPlaying(true);
+        setBuffering(false);
+      };
+      const onPause = function onPause() {
+        timeUpdated = false;
+        debug("onPause");
+        setPlaying(false);
+        setBuffering(false);
+      };
+      const onEnded = function onEnded() {
+        timeUpdated = false;
+        debug("onEnded");
+        setPlaying(false);
+        setBuffering(false);
+      };
+      const onSuspend = function onSuspend(e_1) {
+        timeUpdated = false;
+        debug("onSuspend");
+        setPlaying(getMediaIsPlaying(e_1.currentTarget));
+        setBuffering(getMediaIsBuffering(e_1.currentTarget));
+      };
+      const onVolumeChange = function onVolumeChange(e_2) {
+        debug("onVolumeChange");
+        setMuted(getMediaIsMuted(e_2.currentTarget));
+      };
+      const onLoadChange = function onLoadChange(e_3) {
+        debug("onLoadChange %s", e_3.type);
+        setSrc(getMediaSrc(e_3.currentTarget));
+        setBuffering(getMediaIsBuffering(e_3.currentTarget));
+      };
+      media.addEventListener("canplay", onLoadChange);
+      media.addEventListener("loadstart", onLoadChange);
+      media.addEventListener("loadeddata", onLoadChange);
+      media.addEventListener("loadedmetadata", onLoadChange);
+      media.addEventListener("waiting", onBufferingEvent);
+      media.addEventListener("stalled", onBufferingEvent);
+      media.addEventListener("timeupdate", onTimeUpdate);
+      media.addEventListener("play", onPlay);
+      media.addEventListener("playing", onPlaying);
+      media.addEventListener("pause", onPause);
+      media.addEventListener("suspend", onSuspend);
+      media.addEventListener("ended", onEnded);
+      media.addEventListener("volumechange", onVolumeChange);
+      return () => {
+        media.removeEventListener("canplay", onLoadChange);
+        media.removeEventListener("loadstart", onLoadChange);
+        media.removeEventListener("loadeddata", onLoadChange);
+        media.removeEventListener("loadedmetadata", onLoadChange);
+        media.removeEventListener("waiting", onBufferingEvent);
+        media.removeEventListener("stalled", onBufferingEvent);
+        media.removeEventListener("timeupdate", onTimeUpdate);
+        media.removeEventListener("play", onPlay);
+        media.removeEventListener("playing", onPlaying);
+        media.removeEventListener("pause", onPause);
+        media.removeEventListener("suspend", onSuspend);
+        media.removeEventListener("ended", onEnded);
+        media.removeEventListener("volumechange", onVolumeChange);
+      };
+    };
+    $[24] = debug;
+    $[25] = media;
+    $[26] = t11;
+  } else {
+    t11 = $[26];
+  }
+  let t12;
+  if ($[27] !== debug || $[28] !== media || $[29] !== src) {
+    t12 = [media, debug, src];
+    $[27] = debug;
+    $[28] = media;
+    $[29] = src;
+    $[30] = t12;
+  } else {
+    t12 = $[30];
+  }
+  useEffect(t11, t12);
+  let t13;
+  if ($[31] !== buffering || $[32] !== muted || $[33] !== playing) {
+    t13 = {
+      playing,
+      muted,
+      buffering
+    };
+    $[31] = buffering;
+    $[32] = muted;
+    $[33] = playing;
+    $[34] = t13;
+  } else {
+    t13 = $[34];
+  }
+  return t13;
+}
+function _temp$6() {}
+
+function useMediaTimestampOffset(element, t0) {
+  const $ = c(9);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    attributeName: t2
+  } = t1;
+  const attributeName = t2 === undefined ? "data-ts-offset" : t2;
+  let t3;
+  if ($[2] !== attributeName || $[3] !== element) {
+    t3 = () => getMediaTimestampOffset(element, attributeName);
+    $[2] = attributeName;
+    $[3] = element;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  const [timestampOffset, setTimestampOffset] = useState(t3);
+  const observerRef = useRef(null);
+  let t4;
+  let t5;
+  if ($[5] !== attributeName || $[6] !== element) {
+    t4 = () => {
+      if (element !== null) {
+        observerRef.current = new MutationObserver(mutations => {
+          mutations.forEach(t6 => {
+            const {
+              type: mutationType
+            } = t6;
+            if (mutationType === "attributes") {
+              setTimestampOffset(getMediaTimestampOffset(element, attributeName));
+            }
+          });
+        });
+        observerRef.current.observe(element, {
+          attributes: true,
+          attributeFilter: [attributeName]
         });
-      });
-      observerRef.current.observe(element, {
-        attributes: true,
-        attributeFilter: [attributeName]
-      });
-    }
-    return function () {
-      if (observerRef.current !== null) {
-        observerRef.current.disconnect();
       }
+      return () => {
+        if (observerRef.current !== null) {
+          observerRef.current.disconnect();
+        }
+      };
     };
-  }, [element]);
+    t5 = [element, attributeName];
+    $[5] = attributeName;
+    $[6] = element;
+    $[7] = t4;
+    $[8] = t5;
+  } else {
+    t4 = $[7];
+    t5 = $[8];
+  }
+  useEffect(t4, t5);
   return timestampOffset;
 }
 
-function useMediaCurrentTime(element) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$id = _ref.id,
-    id = _ref$id === void 0 ? null : _ref$id,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$updateInterval = _ref.updateInterval,
-    updateInterval = _ref$updateInterval === void 0 ? 1000 : _ref$updateInterval,
-    _ref$onUpdate = _ref.onUpdate,
-    customOnUpdate = _ref$onUpdate === void 0 ? null : _ref$onUpdate;
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    currentTime = _useState2[0],
-    setCurrentTime = _useState2[1];
-  var realCurrentTime = useRef(currentTime);
-  var tsOffset = useMediaTimestampOffset(element);
-  var finalId = id || element;
-  var lastIdRef = useRef(finalId);
-  var idChanged = lastIdRef.current !== finalId;
-  var disabledRef = useRef(disabled);
-  var disabledChanged = disabledRef.current !== disabled;
-  if (idChanged || disabledChanged) {
-    realCurrentTime.current = element !== null ? Math.max((element.currentTime || 0) - tsOffset, 0) : 0;
-    lastIdRef.current = finalId;
-    disabledRef.current = disabled;
+function useMediaCurrentTime(media, t0) {
+  const $ = c(17);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
   }
-
-  // Check time update
-  useEffect(function () {
-    if (element === null) {
-      return function () {};
-    }
-    function updateTime() {
-      var time = Math.max((element.currentTime || 0) - tsOffset, 0);
-      if (time !== realCurrentTime.current) {
-        realCurrentTime.current = time;
-        setCurrentTime(time);
-        if (customOnUpdate !== null) {
-          customOnUpdate(time);
-        }
-      }
-      return time;
-    }
-    if (disabled) {
-      updateTime();
-      return function () {};
-    }
-    var timeout = null;
-    function loop() {
-      var _element$duration = element.duration,
-        duration = _element$duration === void 0 ? 0 : _element$duration;
-      var time = updateTime();
-      var remainingTime = Math.floor(((duration || 0) - time) * 1000);
-      timeout = setTimeout(loop, Math.max(Math.min(updateInterval, remainingTime), updateInterval));
+  const {
+    id: t2,
+    disabled: t3,
+    updateInterval: t4,
+    onUpdate: t5
+  } = t1;
+  const id = t2 === undefined ? null : t2;
+  const disabled = t3 === undefined ? false : t3;
+  const updateInterval = t4 === undefined ? 1000 : t4;
+  const customOnUpdate = t5 === undefined ? null : t5;
+  const tsOffset = useMediaTimestampOffset(media);
+  let t6;
+  if ($[2] !== media || $[3] !== tsOffset) {
+    t6 = () => getMediaCurrentTime(media, tsOffset);
+    $[2] = media;
+    $[3] = tsOffset;
+    $[4] = t6;
+  } else {
+    t6 = $[4];
+  }
+  const [currentTime, setCurrentTime] = useState(t6);
+  const [currentDisabled, setCurrentDisabled] = useState(disabled);
+  const finalId = id || media;
+  const [identifier, setIdentifier] = useState(finalId);
+  if (finalId !== identifier) {
+    setCurrentTime(getMediaCurrentTime(media, tsOffset));
+    setIdentifier(finalId);
+  } else {
+    if (disabled !== currentDisabled) {
+      setCurrentTime(getMediaCurrentTime(media, tsOffset));
+      setCurrentDisabled(disabled);
     }
-    loop();
-    return function () {
-      if (element !== null) {
-        realCurrentTime.current = element.currentTime - tsOffset;
+  }
+  let t7;
+  if ($[5] !== customOnUpdate || $[6] !== media || $[7] !== tsOffset || $[8] !== updateInterval) {
+    t7 = () => {
+      if (media === null) {
+        return _temp$5;
       }
-      if (timeout !== null) {
-        clearInterval(timeout);
+      let lastTime = getMediaCurrentTime(media, tsOffset);
+      const updateTime = function updateTime() {
+        const newTime = getMediaCurrentTime(media, tsOffset);
+        if (newTime !== lastTime) {
+          lastTime = newTime;
+          setCurrentTime(newTime);
+          if (customOnUpdate !== null) {
+            customOnUpdate(newTime);
+          }
+        }
+        return newTime;
+      };
+      let timeout = null;
+      function loop() {
+        const duration = getMediaDuration(media, tsOffset);
+        const time = updateTime();
+        const remainingTime = Math.floor(((duration || 0) - time) * 1000);
+        timeout = setTimeout(loop, Math.max(Math.min(updateInterval, remainingTime), updateInterval));
       }
+      timeout = setTimeout(loop, updateInterval);
+      return () => {
+        if (timeout !== null) {
+          clearTimeout(timeout);
+        }
+      };
     };
-  }, [id, element, setCurrentTime, disabled, updateInterval]);
-  return realCurrentTime.current;
+    $[5] = customOnUpdate;
+    $[6] = media;
+    $[7] = tsOffset;
+    $[8] = updateInterval;
+    $[9] = t7;
+  } else {
+    t7 = $[9];
+  }
+  let t8;
+  if ($[10] !== customOnUpdate || $[11] !== disabled || $[12] !== identifier || $[13] !== media || $[14] !== tsOffset || $[15] !== updateInterval) {
+    t8 = [identifier, media, tsOffset, setCurrentTime, disabled, updateInterval, customOnUpdate];
+    $[10] = customOnUpdate;
+    $[11] = disabled;
+    $[12] = identifier;
+    $[13] = media;
+    $[14] = tsOffset;
+    $[15] = updateInterval;
+    $[16] = t8;
+  } else {
+    t8 = $[16];
+  }
+  useEffect(t7, t8);
+  return currentTime;
 }
-
-function useMediaDuration(element) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$id = _ref.id,
-    id = _ref$id === void 0 ? null : _ref$id;
-  var _useState = useState(element !== null ? element.duration || 0 : 0),
-    _useState2 = _slicedToArray(_useState, 2),
-    duration = _useState2[0],
-    setDuration = _useState2[1];
-  var tsOffset = useMediaTimestampOffset(element);
-  var realDuration = useRef(duration);
-  var finalId = id || element;
-  var lastIdRef = useRef(finalId);
-  var idChanged = lastIdRef.current !== finalId;
-  if (idChanged) {
-    realDuration.current = element !== null ? Math.max((element.duration || 0) - tsOffset, 0) : 0;
-    lastIdRef.current = finalId;
-  }
-  useEffect(function () {
-    if (element === null) {
-      realDuration.current = 0;
+function _temp$5() {}
+
+function useMediaDuration(media, t0) {
+  const $ = c(12);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    id: t2
+  } = t1;
+  const id = t2 === undefined ? null : t2;
+  const tsOffset = useMediaTimestampOffset(media);
+  let t3;
+  if ($[2] !== media || $[3] !== tsOffset) {
+    t3 = () => getMediaDuration(media, tsOffset);
+    $[2] = media;
+    $[3] = tsOffset;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  const [duration, setDuration] = useState(t3);
+  const finalId = id || media;
+  const [identifier, setIdentifier] = useState(finalId);
+  if (finalId !== identifier) {
+    setDuration(getMediaDuration(media, tsOffset));
+    setIdentifier(finalId);
+  } else {
+    if (media === null && duration !== 0) {
       setDuration(0);
-      return function () {};
-    }
-    function updateDuration() {
-      var newDuration = Math.max((element.duration || 0) - tsOffset, 0);
-      if (newDuration !== realDuration.current) {
-        realDuration.current = newDuration;
-        setDuration(newDuration);
+    } else {
+      if (duration === 0 && getMediaDuration(media, tsOffset) > 0) {
+        setDuration(getMediaDuration(media, tsOffset));
       }
     }
-    updateDuration();
-    element.addEventListener('canplay', updateDuration);
-    element.addEventListener('loadedmetadata', updateDuration);
-    element.addEventListener('durationchange', updateDuration);
-    return function () {
-      element.removeEventListener('canplay', updateDuration);
-      element.removeEventListener('loadedmetadata', updateDuration);
-      element.removeEventListener('durationchange', updateDuration);
+  }
+  let t4;
+  if ($[5] !== media || $[6] !== tsOffset) {
+    t4 = () => {
+      if (media === null) {
+        return _temp$4;
+      }
+      const updateDuration = function updateDuration(e) {
+        setDuration(getMediaDuration(e.currentTarget, tsOffset));
+      };
+      media.addEventListener("canplay", updateDuration);
+      media.addEventListener("loadedmetadata", updateDuration);
+      media.addEventListener("durationchange", updateDuration);
+      return () => {
+        media.removeEventListener("canplay", updateDuration);
+        media.removeEventListener("loadedmetadata", updateDuration);
+        media.removeEventListener("durationchange", updateDuration);
+      };
     };
-  }, [element, id, setDuration]);
-  return realDuration.current;
+    $[5] = media;
+    $[6] = tsOffset;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== identifier || $[9] !== media || $[10] !== tsOffset) {
+    t5 = [identifier, media, setDuration, tsOffset];
+    $[8] = identifier;
+    $[9] = media;
+    $[10] = tsOffset;
+    $[11] = t5;
+  } else {
+    t5 = $[11];
+  }
+  useEffect(t4, t5);
+  return duration;
 }
-
-function useMediaLoad(element) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$preload = _ref.preload,
-    preload = _ref$preload === void 0 ? 'auto' : _ref$preload,
-    _ref$shouldLoad = _ref.shouldLoad,
-    shouldLoad = _ref$shouldLoad === void 0 ? false : _ref$shouldLoad;
-  var firstPreloadRef = useRef(preload);
-  var firstShouldLoadRef = useRef(shouldLoad);
-  var hasLoadedRef = useRef(preload !== 'none' && preload !== 'metadata' && shouldLoad);
-  useEffect(function () {
-    var canLoad = preload !== 'none' && preload !== 'metadata' && shouldLoad;
-    var preloadHasChanged = firstPreloadRef.current !== preload;
-    var shouldLoadHasChanged = firstShouldLoadRef.current !== shouldLoad;
-    if (canLoad && (preloadHasChanged || shouldLoadHasChanged) && !hasLoadedRef.current && element !== null && typeof element.load !== 'undefined') {
-      hasLoadedRef.current = true;
-      element.load();
-    }
-  }, [element, shouldLoad, preload]);
+function _temp$4() {}
+
+function useMediaLoad(element, t0) {
+  const $ = c(7);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    preload: t2,
+    shouldLoad: t3
+  } = t1;
+  const preload = t2 === undefined ? "auto" : t2;
+  const shouldLoad = t3 === undefined ? false : t3;
+  const firstPreloadRef = useRef(preload);
+  const firstShouldLoadRef = useRef(shouldLoad);
+  const hasLoadedRef = useRef(preload !== "none" && preload !== "metadata" && shouldLoad);
+  let t4;
+  let t5;
+  if ($[2] !== element || $[3] !== preload || $[4] !== shouldLoad) {
+    t4 = () => {
+      const canLoad = preload !== "none" && preload !== "metadata" && shouldLoad;
+      const preloadHasChanged = firstPreloadRef.current !== preload;
+      const shouldLoadHasChanged = firstShouldLoadRef.current !== shouldLoad;
+      if (canLoad && (preloadHasChanged || shouldLoadHasChanged) && !hasLoadedRef.current && element !== null && typeof element.load !== "undefined") {
+        hasLoadedRef.current = true;
+        element.load();
+      }
+    };
+    t5 = [element, shouldLoad, preload];
+    $[2] = element;
+    $[3] = preload;
+    $[4] = shouldLoad;
+    $[5] = t4;
+    $[6] = t5;
+  } else {
+    t4 = $[5];
+    t5 = $[6];
+  }
+  useEffect(t4, t5);
 }
 
-var _excluded$1 = ["disabled"];
-function useMediaProgress() {
-  var media = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  var _ref = options || {},
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    props = _objectWithoutProperties(_ref, _excluded$1);
-  var _useState = useState(!disabled),
-    _useState2 = _slicedToArray(_useState, 2),
-    playing = _useState2[0],
-    setPlaying = _useState2[1];
-  var duration = useMediaDuration(media, _objectSpread({
-    disabled: disabled || !playing
-  }, props));
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    progress = _useState4[0],
-    setProgress = _useState4[1];
-  var realProgressRef = useRef(progress);
-  var updateTimeRef = useRef(Date.now() / 1000);
-  var updateProgress = useCallback(function (newProgress) {
-    updateTimeRef.current = Date.now() / 1000;
-    realProgressRef.current = newProgress;
+function useMediaProgress(t0, t1) {
+  const $ = c(28);
+  const media = t0 === undefined ? null : t0;
+  const options = t1 === undefined ? null : t1;
+  let t2;
+  if ($[0] !== options) {
+    t2 = options || {};
+    $[0] = options;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  let props;
+  let t3;
+  if ($[2] !== t2) {
+    ({
+      disabled: t3,
+      ...props
+    } = t2);
+    $[2] = t2;
+    $[3] = props;
+    $[4] = t3;
+  } else {
+    props = $[3];
+    t3 = $[4];
+  }
+  const disabled = t3 === undefined ? false : t3;
+  let t4;
+  if ($[5] !== disabled || $[6] !== media) {
+    t4 = () => !disabled && getMediaIsPlaying(media);
+    $[5] = disabled;
+    $[6] = media;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  const [playing, setPlaying] = useState(t4);
+  const t5 = disabled || !playing;
+  let t6;
+  if ($[8] !== props || $[9] !== t5) {
+    t6 = {
+      disabled: t5,
+      ...props
+    };
+    $[8] = props;
+    $[9] = t5;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  const duration = useMediaDuration(media, t6);
+  const [progressMedia, setProgressMedia] = useState(media);
+  const [progress, setProgress] = useState(0);
+  const [updateTime, setUpdateTime] = useState(_temp$3);
+  if (media !== progressMedia) {
+    const newProgress = media !== null && (media?.currentTime || 0) > 0 && (media?.duration || 0) > 0 ? media.currentTime / media.duration : 0;
+    setUpdateTime(Date.now() / 1000);
     setProgress(newProgress);
-  }, [setProgress]);
-  useEffect(function () {
-    if (media !== null) {
-      var value = (media.currentTime || 0) > 0 && media.duration > 0 ? media.currentTime / media.duration : 0;
-      updateProgress(value);
-      setPlaying(!media.paused && media.readyState === 4);
-    } else {
-      updateProgress(0);
-      setPlaying(false);
-    }
-  }, [media, disabled, setPlaying]);
-  useEffect(function () {
-    if (media === null) {
-      return function () {};
-    }
-    function onResume(e) {
-      setPlaying(true);
-      var newProgress = media.currentTime / media.duration;
-      updateProgress(newProgress);
-    }
-    function onUpdate(e) {
-      setPlaying(!e.currentTarget.paused && !e.currentTarget.ended);
-      var newProgress = media.currentTime / media.duration;
-      updateProgress(newProgress);
-    }
-    function onPause() {
-      setPlaying(false);
-      var newProgress = media.currentTime / media.duration;
-      updateProgress(newProgress);
-    }
-    media.addEventListener('play', onResume);
-    media.addEventListener('playing', onResume);
-    media.addEventListener('seeked', onUpdate);
-    // media.addEventListener('timeupdate', onUpdate);
-    media.addEventListener('pause', onPause);
-    media.addEventListener('ended', onPause);
-    media.addEventListener('waiting', onPause);
-    media.addEventListener('stalled', onPause);
-    media.addEventListener('seeking', onPause);
-    media.addEventListener('suspend', onUpdate);
-    // if (media.paused) {
-    //     onPause();
-    // } else {
-    //     onResume();
-    // }
-    return function () {
-      media.removeEventListener('play', onResume);
-      media.removeEventListener('seeked', onResume);
-      media.removeEventListener('playing', onResume);
-      // media.removeEventListener('timeupdate', onResume);
-      media.removeEventListener('pause', onPause);
-      media.removeEventListener('ended', onPause);
-      media.removeEventListener('waiting', onPause);
-      media.removeEventListener('stalled', onPause);
-      media.removeEventListener('seeking', onPause);
-      media.removeEventListener('suspend', onUpdate);
+    setPlaying(getMediaIsPlaying(media));
+    setProgressMedia(media);
+  }
+  let t7;
+  if ($[11] !== media) {
+    t7 = () => {
+      if (media === null) {
+        return _temp2$1;
+      }
+      const onUpdate = function onUpdate(e) {
+        setPlaying(getMediaIsPlaying(e.currentTarget));
+        const newProgress_0 = e.currentTarget.currentTime / e.currentTarget.duration;
+        startTransition(() => {
+          setUpdateTime(Date.now() / 1000);
+          setProgress(newProgress_0);
+        });
+      };
+      media.addEventListener("play", onUpdate);
+      media.addEventListener("playing", onUpdate);
+      media.addEventListener("seeked", onUpdate);
+      media.addEventListener("pause", onUpdate);
+      media.addEventListener("ended", onUpdate);
+      media.addEventListener("waiting", onUpdate);
+      media.addEventListener("stalled", onUpdate);
+      media.addEventListener("seeking", onUpdate);
+      media.addEventListener("suspend", onUpdate);
+      return () => {
+        media.removeEventListener("play", onUpdate);
+        media.removeEventListener("playing", onUpdate);
+        media.removeEventListener("seeked", onUpdate);
+        media.removeEventListener("pause", onUpdate);
+        media.removeEventListener("ended", onUpdate);
+        media.removeEventListener("waiting", onUpdate);
+        media.removeEventListener("stalled", onUpdate);
+        media.removeEventListener("seeking", onUpdate);
+        media.removeEventListener("suspend", onUpdate);
+      };
     };
-  }, [media, updateProgress, setPlaying, playing]);
-  useEffect(function () {
-    if (media === null || !playing || disabled) {
-      return function () {};
-    }
-    var handle;
-    var canceled = false;
-    function tick() {
-      if (canceled) {
-        return;
+    $[11] = media;
+    $[12] = t7;
+  } else {
+    t7 = $[12];
+  }
+  let t8;
+  if ($[13] !== media || $[14] !== playing) {
+    t8 = [media, setPlaying, playing];
+    $[13] = media;
+    $[14] = playing;
+    $[15] = t8;
+  } else {
+    t8 = $[15];
+  }
+  useEffect(t7, t8);
+  let t9;
+  if ($[16] !== disabled || $[17] !== duration || $[18] !== media || $[19] !== playing || $[20] !== progress || $[21] !== updateTime) {
+    t9 = () => {
+      if (media === null || !playing || disabled) {
+        return _temp3$1;
       }
-      var newTime = Date.now() / 1000;
-      var elapsed = newTime - updateTimeRef.current;
-      var step = elapsed / duration;
-      var newProgress = realProgressRef.current < 0.1 ? media.currentTime / media.duration : realProgressRef.current + step;
-      updateProgress(newProgress);
-      handle = raf(tick);
-    }
-    tick();
-    return function () {
-      canceled = true;
-      raf.cancel(handle);
+      let handle;
+      let canceled = false;
+      let currentProgress = progress;
+      let currentUpdateTime = updateTime;
+      function tick() {
+        if (canceled) {
+          return;
+        }
+        const newTime = Date.now() / 1000;
+        const elapsed = newTime - currentUpdateTime;
+        const step = elapsed / duration;
+        const newProgress_1 = currentProgress < 0.1 ? media.currentTime / media.duration : currentProgress + step;
+        startTransition(() => {
+          setUpdateTime(Date.now() / 1000);
+          setProgress(newProgress_1);
+        });
+        currentUpdateTime = newTime;
+        currentProgress = newProgress_1;
+        handle = raf(tick);
+      }
+      tick();
+      return () => {
+        canceled = true;
+        raf.cancel(handle);
+      };
     };
-  }, [media, playing, disabled, duration, updateProgress]);
-  return realProgressRef.current;
+    $[16] = disabled;
+    $[17] = duration;
+    $[18] = media;
+    $[19] = playing;
+    $[20] = progress;
+    $[21] = updateTime;
+    $[22] = t9;
+  } else {
+    t9 = $[22];
+  }
+  let t10;
+  if ($[23] !== disabled || $[24] !== duration || $[25] !== media || $[26] !== playing) {
+    t10 = [media, playing, disabled, duration, setProgress];
+    $[23] = disabled;
+    $[24] = duration;
+    $[25] = media;
+    $[26] = playing;
+    $[27] = t10;
+  } else {
+    t10 = $[27];
+  }
+  useEffect(t9, t10);
+  return progress;
+}
+function _temp3$1() {}
+function _temp2$1() {}
+function _temp$3() {
+  return Date.now() / 1000;
 }
 
-function useMediaReady(element) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$id = _ref.id,
-    id = _ref$id === void 0 ? null : _ref$id;
-  var _useState = useState(element !== null && element.readyState > 0),
-    _useState2 = _slicedToArray(_useState, 2),
-    ready = _useState2[0],
-    setReady = _useState2[1];
-  var realReady = useRef(ready);
-  var lastIdRef = useRef(id);
-  var idChanged = lastIdRef.current !== id;
-  if (idChanged) {
-    realReady.current = false;
-    lastIdRef.current = id;
-  }
-  useEffect(function () {
-    if (element === null) {
-      return function () {};
-    }
-    function updateReady() {
-      var currentReady = ready;
-      if (element !== null && element.readyState > 0 && !ready) {
+function useMediaReady(media, t0) {
+  const $ = c(11);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    id: t2
+  } = t1;
+  const id = t2 === undefined ? null : t2;
+  let t3;
+  if ($[2] !== media) {
+    t3 = () => media !== null && media.readyState > 0;
+    $[2] = media;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  const [ready, setReady] = useState(t3);
+  const finalId = id || media;
+  const [identifier, setIdentifier] = useState(finalId);
+  if (finalId !== identifier) {
+    setReady(media !== null && media.readyState > 0);
+    setIdentifier(finalId);
+  } else {
+    if (media === null && ready) {
+      setReady(false);
+    } else {
+      if (!ready && media !== null && media.readyState > 0) {
         setReady(true);
-        currentReady = true;
-      } else if (ready && element !== null && element.readyState === 0) {
-        setReady(false);
-        currentReady = false;
       }
-      realReady.current = currentReady;
-      return currentReady;
-    }
-    var currentReady = updateReady();
-    if (currentReady) {
-      return function () {};
     }
-    element.addEventListener('loadstart', updateReady);
-    element.addEventListener('loadeddata', updateReady);
-    element.addEventListener('loadedmetadata', updateReady);
-    element.addEventListener('canplay', updateReady);
-    element.addEventListener('canplaythrough', updateReady);
-    return function () {
-      element.removeEventListener('loadstart', updateReady);
-      element.removeEventListener('loadeddata', updateReady);
-      element.removeEventListener('loadedmetadata', updateReady);
-      element.removeEventListener('canplay', updateReady);
-      element.removeEventListener('canplaythrough', updateReady);
+  }
+  let t4;
+  if ($[4] !== media || $[5] !== ready) {
+    t4 = () => {
+      if (media === null || ready) {
+        return _temp$2;
+      }
+      const updateReady = function updateReady() {
+        setReady(media.readyState > 0);
+      };
+      media.addEventListener("loadstart", updateReady);
+      media.addEventListener("loadeddata", updateReady);
+      media.addEventListener("loadedmetadata", updateReady);
+      media.addEventListener("canplay", updateReady);
+      media.addEventListener("canplaythrough", updateReady);
+      return () => {
+        media.removeEventListener("loadstart", updateReady);
+        media.removeEventListener("loadeddata", updateReady);
+        media.removeEventListener("loadedmetadata", updateReady);
+        media.removeEventListener("canplay", updateReady);
+        media.removeEventListener("canplaythrough", updateReady);
+      };
     };
-  }, [element, id]);
-  return realReady.current;
+    $[4] = media;
+    $[5] = ready;
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  let t5;
+  if ($[7] !== id || $[8] !== media || $[9] !== ready) {
+    t5 = [media, id, ready];
+    $[7] = id;
+    $[8] = media;
+    $[9] = ready;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  useEffect(t4, t5);
+  return ready;
 }
-
-var useMediasParser = function useMediasParser() {
-  var screensManager = useScreensManager();
-  var fieldsManager = useFieldsManager();
-
-  // Convert medias object to path
-  var parser = useMemo(function () {
-    return new MediasParser({
-      screensManager: screensManager,
-      fieldsManager: fieldsManager
+function _temp$2() {}
+
+const useMediasParser = () => {
+  const $ = c(11);
+  const screensManager = useScreensManager();
+  const fieldsManager = useFieldsManager();
+  let t0;
+  if ($[0] !== fieldsManager || $[1] !== screensManager) {
+    t0 = new MediasParser({
+      screensManager,
+      fieldsManager
     });
-  }, [screensManager, fieldsManager]);
-  var toPath = useCallback(function (story) {
-    return parser.toPath(story);
-  }, [parser]);
-  var fromPath = useCallback(function (story) {
-    return parser.fromPath(story);
-  }, [parser]);
-  return {
-    toPath: toPath,
-    fromPath: fromPath,
-    parser: parser
-  };
+    $[0] = fieldsManager;
+    $[1] = screensManager;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  const parser = t0;
+  let t1;
+  if ($[3] !== parser) {
+    t1 = story => parser.toPath(story);
+    $[3] = parser;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  const toPath = t1;
+  let t2;
+  if ($[5] !== parser) {
+    t2 = story_0 => parser.fromPath(story_0);
+    $[5] = parser;
+    $[6] = t2;
+  } else {
+    t2 = $[6];
+  }
+  const fromPath = t2;
+  let t3;
+  if ($[7] !== fromPath || $[8] !== parser || $[9] !== toPath) {
+    t3 = {
+      toPath,
+      fromPath,
+      parser
+    };
+    $[7] = fromPath;
+    $[8] = parser;
+    $[9] = toPath;
+    $[10] = t3;
+  } else {
+    t3 = $[10];
+  }
+  return t3;
 };
 
-function useMediaThumbnail(media) {
-  var file = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  var thumbnail = useMemo(function () {
-    if (isObject(file)) {
-      return file;
-    }
-    var _ref = media || {},
-      _ref$thumbnail_url = _ref.thumbnail_url,
-      defaultThumbnailUrl = _ref$thumbnail_url === void 0 ? null : _ref$thumbnail_url,
-      _ref$files = _ref.files,
-      files = _ref$files === void 0 ? null : _ref$files,
-      _ref$metadata = _ref.metadata,
-      metadata = _ref$metadata === void 0 ? null : _ref$metadata;
-    var _ref2 = metadata || {},
-      mediaWidth = _ref2.width,
-      mediaHeight = _ref2.height;
-    var filesArray = getMediaFilesAsArray(files) || [];
-    var _ref3 = (file !== null ? filesArray.find(function (_ref4) {
-        var handle = _ref4.handle;
-        return handle === file;
-      }) || null : null) || {},
-      _ref3$url = _ref3.url,
-      url = _ref3$url === void 0 ? null : _ref3$url;
-    return url !== null || defaultThumbnailUrl !== null ? {
-      url: url || defaultThumbnailUrl,
-      metadata: {
-        width: mediaWidth,
-        height: mediaHeight
-      }
-    } : null;
-  }, [media, file]);
-  return thumbnail;
-}
-
-function useMediaWaveform(media) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$fake = _ref.fake,
-    fake = _ref$fake === void 0 ? false : _ref$fake,
-    _ref$reduceBufferFact = _ref.reduceBufferFactor,
-    reduceBufferFactor = _ref$reduceBufferFact === void 0 ? 100 : _ref$reduceBufferFact;
-  var _ref2 = media || {},
-    _ref2$url = _ref2.url,
-    url = _ref2$url === void 0 ? null : _ref2$url,
-    _ref2$metadata = _ref2.metadata,
-    metadata = _ref2$metadata === void 0 ? null : _ref2$metadata;
-  var _ref3 = metadata || {},
-    _ref3$waveform = _ref3.waveform,
-    waveform = _ref3$waveform === void 0 ? null : _ref3$waveform;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    audioLevels = _useState2[0],
-    setAudioLevels = _useState2[1];
-  useEffect(function () {
-    var canceled = false;
-    var AudioContext = typeof window !== 'undefined' ? window.AudioContext || window.webkitAudioContext : null;
-    if (waveform !== null) {
-      setAudioLevels(waveform.map(function (it) {
-        return (it + 256 / 2) / 256;
-      }));
-    } else if (url !== null && fake) {
-      var fakeLength = 1000;
-      setAudioLevels(_toConsumableArray(new Array(fakeLength)).map(function () {
-        return Math.random();
-      }));
-    } else if (url !== null && AudioContext !== null) {
-      fetch(url, {
-        mode: 'cors'
-      }).then(function (response) {
-        if (canceled) {
-          throw new Error('Audio loading canceled');
-        }
-        return response.arrayBuffer();
-      }).then(function (arrayBuffer) {
-        if (canceled) {
-          throw new Error('Audio loading canceled');
-        }
-        var audioCtx = new AudioContext();
-        return audioCtx.decodeAudioData(arrayBuffer);
-      }).then(function (buffer) {
-        var channelsCount = buffer.numberOfChannels;
-        if (channelsCount > 0) {
-          var leftChannelData = buffer.getChannelData(0);
-          setAudioLevels(leftChannelData.reduce(function (newArray, level) {
-            // eslint-disable-next-line no-param-reassign
-            newArray[newArray.length] = Math.abs(level);
-            return newArray;
-          }, []));
+function useMediaWaveform(media, t0) {
+  const $ = c(15);
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const {
+    fake: t2,
+    reduceBufferFactor: t3
+  } = t1;
+  const fake = t2 === undefined ? false : t2;
+  const reduceBufferFactor = t3 === undefined ? 100 : t3;
+  let t4;
+  if ($[2] !== media) {
+    t4 = media || {};
+    $[2] = media;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  const {
+    url: t5,
+    metadata: t6
+  } = t4;
+  const url = t5 === undefined ? null : t5;
+  const metadata = t6 === undefined ? null : t6;
+  let t7;
+  if ($[4] !== metadata) {
+    t7 = metadata || {};
+    $[4] = metadata;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  const {
+    waveform: t8
+  } = t7;
+  const waveform = t8 === undefined ? null : t8;
+  const [audioLevels, setAudioLevels] = useState(null);
+  let t9;
+  if ($[6] !== fake || $[7] !== url || $[8] !== waveform) {
+    t9 = () => {
+      let canceled = false;
+      const AudioContext = typeof window !== "undefined" ? window.AudioContext || window.webkitAudioContext : null;
+      if (waveform !== null) {
+        setAudioLevels(waveform.map(_temp$1));
+      } else {
+        if (url !== null && fake) {
+          setAudioLevels([...new Array(1000)].map(_temp2));
+        } else {
+          if (url !== null && AudioContext !== null) {
+            fetch(url, {
+              mode: "cors"
+            }).then(response => {
+              if (canceled) {
+                throw new Error("Audio loading canceled");
+              }
+              return response.arrayBuffer();
+            }).then(arrayBuffer => {
+              if (canceled) {
+                throw new Error("Audio loading canceled");
+              }
+              const audioCtx = new AudioContext();
+              return audioCtx.decodeAudioData(arrayBuffer);
+            }).then(buffer => {
+              const channelsCount = buffer.numberOfChannels;
+              if (channelsCount > 0) {
+                const leftChannelData = buffer.getChannelData(0);
+                setAudioLevels(leftChannelData.reduce(_temp3, []));
+              }
+            }).catch(_temp4);
+          }
         }
-      })["catch"](function (e) {
-        throw e;
-      });
-    }
-    return function () {
-      if (url === null) {
-        canceled = true;
       }
+      return () => {
+        if (url === null) {
+          canceled = true;
+        }
+      };
     };
-  }, [url, waveform, setAudioLevels, reduceBufferFactor, fake]);
+    $[6] = fake;
+    $[7] = url;
+    $[8] = waveform;
+    $[9] = t9;
+  } else {
+    t9 = $[9];
+  }
+  let t10;
+  if ($[10] !== fake || $[11] !== reduceBufferFactor || $[12] !== url || $[13] !== waveform) {
+    t10 = [url, waveform, setAudioLevels, reduceBufferFactor, fake];
+    $[10] = fake;
+    $[11] = reduceBufferFactor;
+    $[12] = url;
+    $[13] = waveform;
+    $[14] = t10;
+  } else {
+    t10 = $[14];
+  }
+  useEffect(t9, t10);
   return audioLevels;
 }
+function _temp4(e) {
+  throw e;
+}
+function _temp3(newArray, level) {
+  newArray[newArray.length] = Math.abs(level);
+  return newArray;
+}
+function _temp2() {
+  return Math.random();
+}
+function _temp$1(it) {
+  return (it + 128) / 256;
+}
 
 // const debug = createDebug('core:useParsedStory');
 
-var useParsedStory = function useParsedStory(story) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$withTheme = _ref.withTheme,
-    withTheme = _ref$withTheme === void 0 ? true : _ref$withTheme,
-    _ref$withMedias = _ref.withMedias,
-    withMedias = _ref$withMedias === void 0 ? true : _ref$withMedias,
-    _ref$withFonts = _ref.withFonts,
-    withFonts = _ref$withFonts === void 0 ? true : _ref$withFonts,
-    _ref$withMigrations = _ref.withMigrations,
-    withMigrations = _ref$withMigrations === void 0 ? true : _ref$withMigrations;
-  var screensManager = useScreensManager();
-  var fieldsManager = useFieldsManager();
-  var parser = useMemo(function () {
-    return new StoryParser({
-      screensManager: screensManager,
-      fieldsManager: fieldsManager,
-      fieldsPattern: screensManager.getFieldsPattern()
-    });
-  }, [screensManager, fieldsManager]);
-  var newStory = useMemo(function () {
+const useParsedStory = (story, {
+  disabled = false,
+  withTheme = true,
+  withMedias = true,
+  withFonts = true,
+  withMigrations = true
+} = {}) => {
+  const screensManager = useScreensManager();
+  const fieldsManager = useFieldsManager();
+  const [parser] = useState(() => new StoryParser({
+    screensManager,
+    fieldsManager,
+    fieldsPattern: screensManager.getFieldsPattern()
+  }));
+  const newStory = useMemo(() => {
     if (disabled) {
       return story;
     }
     return parser.parse(story, {
-      withMedias: withMedias,
-      withTheme: withTheme,
-      withFonts: withFonts,
-      withMigrations: withMigrations
+      withMedias,
+      withTheme,
+      withFonts,
+      withMigrations
     });
   }, [parser, disabled, withMedias, withTheme, withFonts, story]);
   return newStory;
 };
 
 function usePlaceholderStyle(selector, placeholderStyle) {
-  var styles = placeholderStyle !== null ? Object.keys(placeholderStyle).reduce(function (styles, key) {
-    var value = placeholderStyle[key];
-    return !isEmpty(value) ? _objectSpread(_objectSpread({}, styles), {}, _defineProperty({}, key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase(), value)) : styles;
+  const styles = placeholderStyle !== null ? Object.keys(placeholderStyle).reduce((styles, key) => {
+    const value = placeholderStyle[key];
+    return !isEmpty(value) ? {
+      ...styles,
+      [key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase()]: value
+    } : styles;
   }, {}) : null;
-  return styles !== null && Object.keys(styles).length > 0 ? "\n        ".concat(selector, "::placeholder {\n            ").concat(Object.keys(styles).map(function (key) {
-    return "".concat(key, ": ").concat(styles[key], ";");
-  }).join('\n'), "\n        }\n    ") : null;
+  return styles !== null && Object.keys(styles).length > 0 ? `
+        ${selector}::placeholder {
+            ${Object.keys(styles).map(key => `${key}: ${styles[key]};`).join('\n')}
+        }
+    ` : null;
 }
 
-function useProgressSteps() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    currentTime = _ref.currentTime,
-    duration = _ref.duration,
-    _ref$onStep = _ref.onStep,
-    onStep = _ref$onStep === void 0 ? null : _ref$onStep,
-    _ref$steps = _ref.steps,
-    steps = _ref$steps === void 0 ? [0.1, 0.25, 0.5, 0.75, 0.9] : _ref$steps;
-  var progressStepsReached = useRef({});
-  useEffect(function () {
-    if (duration === 0 || disabled) {
-      return;
-    }
-    var progress = currentTime / duration;
-    var currentSteps = progressStepsReached.current;
-    var stepsToTrack = steps.filter(function (step) {
-      return progress > step && typeof currentSteps[step] === 'undefined';
-    });
-    stepsToTrack.forEach(function (step) {
-      if (onStep !== null) {
-        onStep(step, {
-          duration: duration,
-          currentTime: currentTime
-        });
+const defaultSteps = [0.1, 0.25, 0.5, 0.75, 0.9];
+function useProgressSteps(t0) {
+  const $ = c(8);
+  const {
+    disabled: t1,
+    currentTime,
+    duration,
+    onStep: t2,
+    steps: t3
+  } = t0;
+  const disabled = t1 === undefined ? false : t1;
+  const onStep = t2 === undefined ? null : t2;
+  const steps = t3 === undefined ? defaultSteps : t3;
+  let t4;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = {};
+    $[0] = t4;
+  } else {
+    t4 = $[0];
+  }
+  const progressStepsReachedRef = useRef(t4);
+  let t5;
+  let t6;
+  if ($[1] !== currentTime || $[2] !== disabled || $[3] !== duration || $[4] !== onStep || $[5] !== steps) {
+    t5 = () => {
+      if (duration === 0 || disabled) {
+        return;
       }
-      currentSteps[step] = true;
-    });
-  }, [duration, currentTime, disabled]);
+      const progress = currentTime / duration;
+      const currentSteps = progressStepsReachedRef.current;
+      const stepsToTrack = steps.filter(step => progress > step && typeof currentSteps[step] === "undefined");
+      stepsToTrack.forEach(step_0 => {
+        if (onStep !== null) {
+          onStep(step_0, {
+            duration,
+            currentTime
+          });
+        }
+        currentSteps[step_0] = true;
+      });
+    };
+    t6 = [duration, currentTime, disabled, onStep, steps];
+    $[1] = currentTime;
+    $[2] = disabled;
+    $[3] = duration;
+    $[4] = onStep;
+    $[5] = steps;
+    $[6] = t5;
+    $[7] = t6;
+  } else {
+    t5 = $[6];
+    t6 = $[7];
+  }
+  useEffect(t5, t6);
 }
 
-var _excluded = ["width", "height"];
-var useDevicePixelRatio = function useDevicePixelRatio() {
-  var _useState = useState(1),
-    _useState2 = _slicedToArray(_useState, 2),
-    pixelRatio = _useState2[0],
-    setPixelRatio = _useState2[1];
-  useEffect(function () {
-    setPixelRatio(typeof window !== 'undefined' ? window.devicePixelRatio || 1 : 1);
-  }, [setPixelRatio]);
+const useDevicePixelRatio = () => {
+  const $ = c(2);
+  const [pixelRatio, setPixelRatio] = useState(1);
+  let t0;
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = () => {
+      setPixelRatio(typeof window !== "undefined" ? window.devicePixelRatio || 1 : 1);
+      const media = window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`);
+      const onChange = function onChange() {
+        setPixelRatio(window.devicePixelRatio || 1);
+      };
+      media.addEventListener("change", onChange, {
+        once: true
+      });
+      return () => {
+        media.removeEventListener("change", onChange);
+      };
+    };
+    t1 = [setPixelRatio];
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t0 = $[0];
+    t1 = $[1];
+  }
+  useEffect(t0, t1);
   return pixelRatio;
 };
-var useScreenSize = function useScreenSize(_ref) {
-  var _ref$width = _ref.width,
-    width = _ref$width === void 0 ? null : _ref$width,
-    _ref$height = _ref.height,
-    height = _ref$height === void 0 ? null : _ref$height,
-    _ref$landscape = _ref.landscape,
-    landscape = _ref$landscape === void 0 ? false : _ref$landscape,
-    _ref$menuOverScreen = _ref.menuOverScreen,
-    menuOverScreen = _ref$menuOverScreen === void 0 ? false : _ref$menuOverScreen,
-    _ref$screens = _ref.screens,
-    initialScreens = _ref$screens === void 0 ? null : _ref$screens,
-    _ref$mediaType = _ref.mediaType,
-    mediaType = _ref$mediaType === void 0 ? 'screen' : _ref$mediaType,
-    _ref$media = _ref.media,
-    providedMedia = _ref$media === void 0 ? null : _ref$media,
-    _ref$scale = _ref.scale,
-    scale = _ref$scale === void 0 ? null : _ref$scale;
-  var devicePixelRatio = useDevicePixelRatio();
-  var screens = initialScreens || [];
-  var screenSize = useMemo(function () {
-    var media = providedMedia !== null ? providedMedia : {
-      type: mediaType,
-      width: "".concat(width, "px"),
-      height: "".concat(height, "px")
-    };
-    var matchingScreens = _toConsumableArray(screens).reverse().filter(function (_ref2) {
-      var _ref2$mediaQuery = _ref2.mediaQuery,
-        mediaQuery = _ref2$mediaQuery === void 0 ? null : _ref2$mediaQuery;
-      return mediaQuery === null || match(mediaQuery, media);
-    });
-    return {
-      screen: matchingScreens.length > 0 ? matchingScreens[0].name : null,
-      screens: _toConsumableArray(matchingScreens).reverse().map(function (_ref3) {
-        var name = _ref3.name;
-        return name;
-      }),
-      width: width,
-      height: height,
-      landscape: landscape,
-      menuOverScreen: menuOverScreen,
-      resolution: scale !== null ? scale * devicePixelRatio : devicePixelRatio,
-      imageResolution: scale !== null ? Math.max(scale, devicePixelRatio) : devicePixelRatio
+const useScreenSize = t0 => {
+  const $ = c(23);
+  const {
+    width: t1,
+    height: t2,
+    landscape: t3,
+    menuOverScreen: t4,
+    screens: t5,
+    mediaType: t6,
+    media: t7,
+    scale: t8
+  } = t0;
+  const width = t1 === undefined ? null : t1;
+  const height = t2 === undefined ? null : t2;
+  const landscape = t3 === undefined ? false : t3;
+  const menuOverScreen = t4 === undefined ? false : t4;
+  const initialScreens = t5 === undefined ? null : t5;
+  const mediaType = t6 === undefined ? "screen" : t6;
+  const providedMedia = t7 === undefined ? null : t7;
+  const scale = t8 === undefined ? null : t8;
+  const devicePixelRatio = useDevicePixelRatio();
+  let t10;
+  let t9;
+  if ($[0] !== height || $[1] !== initialScreens || $[2] !== mediaType || $[3] !== providedMedia || $[4] !== width) {
+    const screens = initialScreens || [];
+    let t11;
+    if ($[7] !== height || $[8] !== mediaType || $[9] !== providedMedia || $[10] !== width) {
+      t11 = providedMedia !== null ? providedMedia : {
+        type: mediaType,
+        width: `${width}px`,
+        height: `${height}px`
+      };
+      $[7] = height;
+      $[8] = mediaType;
+      $[9] = providedMedia;
+      $[10] = width;
+      $[11] = t11;
+    } else {
+      t11 = $[11];
+    }
+    const media = t11;
+    let t12;
+    if ($[12] !== media) {
+      t12 = t13 => {
+        const {
+          mediaQuery: t14
+        } = t13;
+        const mediaQuery = t14 === undefined ? null : t14;
+        return mediaQuery === null || match(mediaQuery, media);
+      };
+      $[12] = media;
+      $[13] = t12;
+    } else {
+      t12 = $[13];
+    }
+    const matchingScreens = [...screens].reverse().filter(t12);
+    t9 = matchingScreens.length > 0 ? matchingScreens[0].name : null;
+    t10 = [...matchingScreens].reverse().map(_temp);
+    $[0] = height;
+    $[1] = initialScreens;
+    $[2] = mediaType;
+    $[3] = providedMedia;
+    $[4] = width;
+    $[5] = t10;
+    $[6] = t9;
+  } else {
+    t10 = $[5];
+    t9 = $[6];
+  }
+  const t11 = scale !== null ? scale * devicePixelRatio : devicePixelRatio;
+  const t12 = scale !== null ? Math.max(scale, devicePixelRatio) : devicePixelRatio;
+  let t13;
+  if ($[14] !== height || $[15] !== landscape || $[16] !== menuOverScreen || $[17] !== t10 || $[18] !== t11 || $[19] !== t12 || $[20] !== t9 || $[21] !== width) {
+    t13 = {
+      screen: t9,
+      screens: t10,
+      width,
+      height,
+      landscape,
+      menuOverScreen,
+      resolution: t11,
+      imageResolution: t12
     };
-  }, [screens, providedMedia, mediaType, width, height, landscape, menuOverScreen]);
-  return screenSize;
+    $[14] = height;
+    $[15] = landscape;
+    $[16] = menuOverScreen;
+    $[17] = t10;
+    $[18] = t11;
+    $[19] = t12;
+    $[20] = t9;
+    $[21] = width;
+    $[22] = t13;
+  } else {
+    t13 = $[22];
+  }
+  return t13;
 };
-var useScreenSizeFromElement = function useScreenSizeFromElement() {
-  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var _ref4 = options || {},
-    _ref4$width = _ref4.width,
-    width = _ref4$width === void 0 ? null : _ref4$width,
-    _ref4$height = _ref4.height,
-    height = _ref4$height === void 0 ? null : _ref4$height,
-    opts = _objectWithoutProperties(_ref4, _excluded);
-  var _useDimensionObserver = useDimensionObserver(),
-    ref = _useDimensionObserver.ref,
-    _useDimensionObserver2 = _useDimensionObserver.width,
-    calculatedWidth = _useDimensionObserver2 === void 0 ? 0 : _useDimensionObserver2,
-    _useDimensionObserver3 = _useDimensionObserver.height,
-    calculatedHeight = _useDimensionObserver3 === void 0 ? 0 : _useDimensionObserver3;
-  var devicePixelRatio = useDevicePixelRatio();
-  var fullWidth = width !== null ? width : calculatedWidth;
-  var fullHeight = height !== null ? height : calculatedHeight;
-  var _ref5 = opts || {},
-    _ref5$screenWidth = _ref5.screenWidth,
-    screenWidth = _ref5$screenWidth === void 0 ? 320 : _ref5$screenWidth,
-    _ref5$screenHeight = _ref5.screenHeight,
-    screenHeight = _ref5$screenHeight === void 0 ? 480 : _ref5$screenHeight,
-    _ref5$withoutMaxSize = _ref5.withoutMaxSize,
-    withoutMaxSize = _ref5$withoutMaxSize === void 0 ? false : _ref5$withoutMaxSize,
-    _ref5$landscapeMinHei = _ref5.landscapeMinHeight,
-    landscapeMinHeight = _ref5$landscapeMinHei === void 0 ? 600 : _ref5$landscapeMinHei,
-    _ref5$menuAlwaysOverS = _ref5.menuAlwaysOverScreen,
-    menuAlwaysOverScreen = _ref5$menuAlwaysOverS === void 0 ? true : _ref5$menuAlwaysOverS,
-    _ref5$landscapeMinRat = _ref5.landscapeMinRatio,
-    landscapeMinRatio = _ref5$landscapeMinRat === void 0 ? 2 / 3 : _ref5$landscapeMinRat,
-    _ref5$withoutScale = _ref5.withoutScale,
-    withoutScale = _ref5$withoutScale === void 0 ? false : _ref5$withoutScale;
-  var screenRatio = screenWidth / screenHeight;
-  var elementRatio = fullWidth / fullHeight;
-  var landscape = fullHeight > 0 && elementRatio > (landscapeMinRatio || screenRatio);
-  var landscapeWithMaxSize = landscape && !withoutMaxSize;
-  var finalWidth = fullWidth;
-  var finalHeight = fullHeight;
-  var menuOverScreen = !landscape;
+const defaultLandscapeMinRatio = 2 / 3;
+const useScreenSizeFromElement = t0 => {
+  const $ = c(25);
+  const options = t0 === undefined ? null : t0;
+  let t1;
+  if ($[0] !== options) {
+    t1 = options || {};
+    $[0] = options;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let opts;
+  let t2;
+  let t3;
+  if ($[2] !== t1) {
+    ({
+      width: t2,
+      height: t3,
+      ...opts
+    } = t1);
+    $[2] = t1;
+    $[3] = opts;
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    opts = $[3];
+    t2 = $[4];
+    t3 = $[5];
+  }
+  const width = t2 === undefined ? null : t2;
+  const height = t3 === undefined ? null : t3;
+  const {
+    ref,
+    width: t4,
+    height: t5
+  } = useDimensionObserver();
+  const calculatedWidth = t4 === undefined ? 0 : t4;
+  const calculatedHeight = t5 === undefined ? 0 : t5;
+  const devicePixelRatio = useDevicePixelRatio();
+  const fullWidth = width !== null ? width : calculatedWidth;
+  const fullHeight = height !== null ? height : calculatedHeight;
+  let t6;
+  if ($[6] !== opts) {
+    t6 = opts || {};
+    $[6] = opts;
+    $[7] = t6;
+  } else {
+    t6 = $[7];
+  }
+  const {
+    screenWidth: t7,
+    screenHeight: t8,
+    withoutMaxSize: t9,
+    landscapeMinHeight: t10,
+    menuAlwaysOverScreen: t11,
+    landscapeMinRatio: t12,
+    withoutScale: t13
+  } = t6;
+  const screenWidth = t7 === undefined ? 320 : t7;
+  const screenHeight = t8 === undefined ? 480 : t8;
+  const withoutMaxSize = t9 === undefined ? false : t9;
+  const landscapeMinHeight = t10 === undefined ? 600 : t10;
+  const menuAlwaysOverScreen = t11 === undefined ? true : t11;
+  const landscapeMinRatio = t12 === undefined ? defaultLandscapeMinRatio : t12;
+  const withoutScale = t13 === undefined ? false : t13;
+  const screenRatio = screenWidth / screenHeight;
+  const elementRatio = fullWidth / fullHeight;
+  const landscape = fullHeight > 0 && elementRatio > (landscapeMinRatio || screenRatio);
+  const landscapeWithMaxSize = landscape && !withoutMaxSize;
+  let finalWidth = fullWidth;
+  let finalHeight = fullHeight;
+  let menuOverScreen = !landscape;
   if (landscapeWithMaxSize) {
     if (fullHeight < landscapeMinHeight || menuAlwaysOverScreen) {
       menuOverScreen = true;
     } else {
       finalHeight = fullHeight - 100;
     }
-    finalWidth = Math.round(finalHeight * screenRatio);
+    let t14;
+    if ($[8] !== finalHeight || $[9] !== screenRatio) {
+      t14 = Math.round(finalHeight * screenRatio);
+      $[8] = finalHeight;
+      $[9] = screenRatio;
+      $[10] = t14;
+    } else {
+      t14 = $[10];
+    }
+    finalWidth = t14;
   }
   if (finalWidth % 2 === 1) {
-    finalWidth -= 1;
+    finalWidth = finalWidth - 1;
   }
   if (finalHeight % 2 === 1) {
-    finalHeight -= 1;
-  }
-  var scale = finalWidth > 0 ? finalWidth / screenWidth : null;
-  var screenSize = useScreenSize(_objectSpread({
-    width: withoutScale || scale === null ? finalWidth : screenWidth,
-    height: withoutScale || scale === null ? finalHeight : finalHeight / scale,
-    landscape: landscape,
-    menuOverScreen: menuOverScreen,
-    scale: !withoutScale ? scale : null
-  }, opts));
-  return {
-    ref: ref,
-    fullWidth: fullWidth,
-    fullHeight: fullHeight,
-    screenSize: screenSize,
-    scale: !withoutScale ? scale : null,
-    resolution: !withoutScale ? scale * devicePixelRatio : devicePixelRatio
-  };
+    finalHeight = finalHeight - 1;
+  }
+  const scale = finalWidth > 0 ? finalWidth / screenWidth : null;
+  const t14 = withoutScale || scale === null ? finalWidth : screenWidth;
+  const t15 = withoutScale || scale === null ? finalHeight : finalHeight / scale;
+  const t16 = !withoutScale ? scale : null;
+  let t17;
+  if ($[11] !== landscape || $[12] !== menuOverScreen || $[13] !== opts || $[14] !== t14 || $[15] !== t15 || $[16] !== t16) {
+    t17 = {
+      width: t14,
+      height: t15,
+      landscape,
+      menuOverScreen,
+      scale: t16,
+      ...opts
+    };
+    $[11] = landscape;
+    $[12] = menuOverScreen;
+    $[13] = opts;
+    $[14] = t14;
+    $[15] = t15;
+    $[16] = t16;
+    $[17] = t17;
+  } else {
+    t17 = $[17];
+  }
+  const screenSize = useScreenSize(t17);
+  const t18 = !withoutScale ? scale : null;
+  const t19 = !withoutScale ? scale * devicePixelRatio : devicePixelRatio;
+  let t20;
+  if ($[18] !== fullHeight || $[19] !== fullWidth || $[20] !== ref || $[21] !== screenSize || $[22] !== t18 || $[23] !== t19) {
+    t20 = {
+      ref,
+      fullWidth,
+      fullHeight,
+      screenSize,
+      scale: t18,
+      resolution: t19
+    };
+    $[18] = fullHeight;
+    $[19] = fullWidth;
+    $[20] = ref;
+    $[21] = screenSize;
+    $[22] = t18;
+    $[23] = t19;
+    $[24] = t20;
+  } else {
+    t20 = $[24];
+  }
+  return t20;
 };
-var useScreenSizeFromWindow = function useScreenSizeFromWindow(opts) {
-  var windowSize = useWindowSize();
-  return useScreenSize(_objectSpread(_objectSpread({}, opts), windowSize));
+const useScreenSizeFromWindow = opts => {
+  const $ = c(3);
+  const windowSize = useWindowSize();
+  let t0;
+  if ($[0] !== opts || $[1] !== windowSize) {
+    t0 = {
+      ...opts,
+      ...windowSize
+    };
+    $[0] = opts;
+    $[1] = windowSize;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  return useScreenSize(t0);
 };
+function _temp(t0) {
+  const {
+    name
+  } = t0;
+  return name;
+}
 
-var getValueFromSpring = function getValueFromSpring(s) {
-  var _ref = s || {},
-    _ref$value = _ref.value,
-    v = _ref$value === void 0 ? null : _ref$value;
-  var _ref2 = v || {},
-    p = _ref2.progress;
+const getValueFromSpring = s => {
+  const {
+    value: v = null
+  } = s || {};
+  const {
+    progress: p
+  } = v || {};
   return p;
 };
 function useSpringValue(wantedProgress, immediate, params) {
-  var _useState = useState(wantedProgress),
-    _useState2 = _slicedToArray(_useState, 2),
-    progress = _useState2[0],
-    setProgress = _useState2[1];
-  var onChange = useCallback(function (spring) {
-    return setProgress(getValueFromSpring(spring));
-  }, [setProgress]);
-  useSpring(_objectSpread({
-    progress: wantedProgress,
-    onChange: onChange,
-    immediate: immediate
-  }, params));
+  const $ = c(5);
+  const [progress, setProgress] = useState(wantedProgress);
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = spring => setProgress(getValueFromSpring(spring));
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const onChange = t0;
+  let t1;
+  if ($[1] !== immediate || $[2] !== params || $[3] !== wantedProgress) {
+    t1 = {
+      progress: wantedProgress,
+      onChange,
+      immediate,
+      ...params
+    };
+    $[1] = immediate;
+    $[2] = params;
+    $[3] = wantedProgress;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  useSpring(t1);
   return immediate ? wantedProgress : progress;
 }
 
 function checkWebpSupport() {
-  return new Promise(function (resolve) {
-    var img = document.createElement('img');
-    img.onload = function () {
+  return new Promise(resolve => {
+    const img = document.createElement('img');
+    img.onload = () => {
       resolve(img.width > 0 && img.height > 0);
     };
-    img.onerror = function () {
+    img.onerror = () => {
       resolve(false);
     };
     img.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA=';
   });
 }
-function useSupportsWebp() {
-  var defaultValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-  var _useState = useState(defaultValue),
-    _useState2 = _slicedToArray(_useState, 2),
-    supportsWebp = _useState2[0],
-    setSupportsWebp = _useState2[1];
-  useEffect(function () {
-    var canceled = false;
-    checkWebpSupport().then(function (newSupport) {
-      if (!canceled && newSupport !== supportsWebp) {
-        setSupportsWebp(newSupport);
-      }
-    });
-    return function () {
-      canceled = true;
+function useSupportsWebp(t0) {
+  const $ = c(3);
+  const defaultValue = t0 === undefined ? true : t0;
+  const [supportsWebp, setSupportsWebp] = useState(defaultValue);
+  let t1;
+  if ($[0] !== supportsWebp) {
+    t1 = () => {
+      let canceled = false;
+      checkWebpSupport().then(newSupport => {
+        if (!canceled && newSupport !== supportsWebp) {
+          setSupportsWebp(newSupport);
+        }
+      });
+      return () => {
+        canceled = true;
+      };
     };
-  }, []);
+    $[0] = supportsWebp;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = [];
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  useEffect(t1, t2);
   return supportsWebp;
 }
 
-var useSwipe = function useSwipe() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-    _ref$width = _ref.width,
-    width = _ref$width === void 0 ? null : _ref$width,
-    _ref$items = _ref.items,
-    initialItems = _ref$items === void 0 ? null : _ref$items,
-    _ref$withSpring = _ref.withSpring,
-    withSpring = _ref$withSpring === void 0 ? true : _ref$withSpring,
-    _ref$swipeWidthThresh = _ref.swipeWidthThreshold,
-    swipeWidthThreshold = _ref$swipeWidthThresh === void 0 ? 3 : _ref$swipeWidthThresh,
-    _ref$animateScale = _ref.animateScale,
-    animateScale = _ref$animateScale === void 0 ? false : _ref$animateScale,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$lockAxis = _ref.lockAxis,
-    lockAxis = _ref$lockAxis === void 0 ? false : _ref$lockAxis,
-    _ref$onSwipeStart = _ref.onSwipeStart,
-    onSwipeStart = _ref$onSwipeStart === void 0 ? null : _ref$onSwipeStart,
-    _ref$onSwipeEnd = _ref.onSwipeEnd,
-    onSwipeEnd = _ref$onSwipeEnd === void 0 ? null : _ref$onSwipeEnd,
-    _ref$onSwipeCancel = _ref.onSwipeCancel,
-    onSwipeCancel = _ref$onSwipeCancel === void 0 ? null : _ref$onSwipeCancel,
-    _ref$onTap = _ref.onTap,
-    onTap = _ref$onTap === void 0 ? null : _ref$onTap;
-  var items = initialItems || [];
-  var swipingIndex = useRef(null);
-  var index = useRef(0);
-  var lockedAxis = useRef(null);
-  var hasWidth = width !== null;
-  var _useWindowSize = useWindowSize(),
-    windowWidth = _useWindowSize.width;
-  var currentWidth = hasWidth ? width : windowWidth;
-  var count = items.length;
-  var getItem = useCallback(function () {
-    var x = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-    var idx = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    var scale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
-    return {
-      x: x,
-      zIndex: idx,
-      scale: scale
-    };
-  });
-  var getItems = useCallback(function () {
-    var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-      _ref2$down = _ref2.down,
-      down = _ref2$down === void 0 ? false : _ref2$down,
-      _ref2$mx = _ref2.mx,
-      mx = _ref2$mx === void 0 ? 0 : _ref2$mx;
-    return items.map(function (item, i) {
-      var x = disabled ? 0 : (i - index.current) * currentWidth + (down ? mx : 0);
-      var scale = !animateScale || disabled || !down ? 1 : 1 - Math.abs(mx) / currentWidth / 2;
-      return getItem(x, i, scale);
-    });
-  }, [disabled, items, index, currentWidth, animateScale]);
+const useSwipe = ({
+  width = null,
+  items: initialItems = null,
+  withSpring = true,
+  swipeWidthThreshold = 3,
+  animateScale = false,
+  disabled = false,
+  lockAxis = false,
+  onSwipeStart = null,
+  onSwipeEnd = null,
+  onSwipeCancel = null,
+  onTap = null
+} = {}) => {
+  const items = initialItems || [];
+  const swipingIndex = useRef(null);
+  const index = useRef(0);
+  const lockedAxis = useRef(null);
+  const hasWidth = width !== null;
+  const {
+    width: windowWidth
+  } = useWindowSize();
+  const currentWidth = hasWidth ? width : windowWidth;
+  const count = items.length;
+  const getItem = useCallback((x = 0, idx = 0, scale = 1) => ({
+    x,
+    zIndex: idx,
+    scale
+  }));
+  const getItems = useCallback(({
+    down = false,
+    mx = 0
+  } = {}) => items.map((item, i) => {
+    const x_0 = disabled ? 0 : (i - index.current) * currentWidth + (down ? mx : 0);
+    const scale_0 = !animateScale || disabled || !down ? 1 : 1 - Math.abs(mx) / currentWidth / 2;
+    return getItem(x_0, i, scale_0);
+  }), [disabled, items, index, currentWidth, animateScale]);
 
   // Initial items state
-  var _useSprings = useSprings(items.length, function (i) {
-      return {
-        x: disabled ? 0 : i * currentWidth,
-        y: 0,
-        zIndex: i,
-        config: _objectSpread({}, !withSpring ? {
-          duration: 1
-        } : null)
-      };
-    }),
-    _useSprings2 = _slicedToArray(_useSprings, 2),
-    itemsWithProps = _useSprings2[0],
-    set = _useSprings2[1];
-  var bind = useDrag(function (_ref3) {
-    var down = _ref3.down,
-      _ref3$movement = _slicedToArray(_ref3.movement, 2),
-      mx = _ref3$movement[0],
-      my = _ref3$movement[1],
-      _ref3$direction = _slicedToArray(_ref3.direction, 1),
-      xDir = _ref3$direction[0],
-      cancel = _ref3.cancel,
-      tap = _ref3.tap;
+  const [itemsWithProps, set] = useSprings(items.length, i_0 => ({
+    x: disabled ? 0 : i_0 * currentWidth,
+    y: 0,
+    zIndex: i_0,
+    config: {
+      ...(!withSpring ? {
+        duration: 1
+      } : null)
+    }
+  }));
+  const bind = useDrag(({
+    down: down_0,
+    movement: [mx_0, my],
+    direction: [xDir],
+    cancel,
+    tap
+  }) => {
     if (disabled) {
       cancel();
       return;
     }
-    if (!down && swipingIndex.current === index.current) {
+    if (!down_0 && swipingIndex.current === index.current) {
       lockedAxis.current = null;
       if (onSwipeCancel !== null) {
         onSwipeCancel(index.current);
@@ -2298,9 +2605,9 @@ var useSwipe = function useSwipe() {
     }
     */
 
-    var movementX = !lockAxis || lockedAxis.current === 'x' ? mx : 0;
-    var movementY = !lockAxis || lockedAxis.current === 'y' ? my : 0;
-    if (down) {
+    const movementX = !lockAxis || lockedAxis.current === 'x' ? mx_0 : 0;
+    const movementY = !lockAxis || lockedAxis.current === 'y' ? my : 0;
+    if (down_0) {
       // Snap to next slide
       if (Math.abs(movementX) > currentWidth / swipeWidthThreshold) {
         index.current = clamp(index.current + (xDir > 0 ? -1 : 1), 0, count - 1);
@@ -2313,19 +2620,19 @@ var useSwipe = function useSwipe() {
       }
     }
     set(getItems({
-      down: down,
+      down: down_0,
       mx: movementX,
       my: movementY
     }));
 
     // saving current swiping index in a ref in order to have a section called only once when swipe just started or a tap was detected
     if (swipingIndex.current !== index.current) {
-      if (down && !tap) {
+      if (down_0 && !tap) {
         if (onSwipeStart !== null) {
           onSwipeStart(index.current);
         }
       }
-      if (!down && tap) {
+      if (!down_0 && tap) {
         if (onTap !== null) {
           onTap();
         }
@@ -2333,153 +2640,216 @@ var useSwipe = function useSwipe() {
     }
 
     // lock swiping on axis from initial 3 pixels distance (Y axis requires to swipe down)
-    if (lockAxis && down && lockedAxis.current === null) {
-      var distanceX = Math.abs(mx);
-      var distanceY = Math.abs(my);
+    if (lockAxis && down_0 && lockedAxis.current === null) {
+      const distanceX = Math.abs(mx_0);
+      const distanceY = Math.abs(my);
       if (distanceX !== distanceY && (distanceY > 2 || distanceX > 2)) {
         lockedAxis.current = distanceY > distanceX ? 'y' : 'x';
       }
     }
-    swipingIndex.current = down && !tap ? index.current : null;
+    swipingIndex.current = down_0 && !tap ? index.current : null;
   }, {
     filterTaps: true
   });
-  var reset = useCallback(function () {
+  const reset = useCallback(() => {
     set(getItems());
   }, [disabled, items, index, currentWidth]);
-  var setIndex = useCallback(function (idx) {
-    index.current = idx;
+  const setIndex = useCallback(idx_0 => {
+    index.current = idx_0;
     reset();
   }, [reset]);
 
   // Reset on resize or others
-  useEffect(function () {
+  useEffect(() => {
     set(getItems());
   }, [items, width, set, disabled]);
   return {
     items: itemsWithProps,
-    bind: bind,
+    bind,
     index: index.current,
-    setIndex: setIndex
+    setIndex
   };
 };
 
-var useThemeParser = function useThemeParser() {
-  var screensManager = useScreensManager();
-  var parser = useMemo(function () {
-    return new ThemeParser({
-      screensManager: screensManager
+const useThemeParser = () => {
+  const $ = c(4);
+  const screensManager = useScreensManager();
+  let t0;
+  if ($[0] !== screensManager) {
+    t0 = new ThemeParser({
+      screensManager
     });
-  }, [screensManager]);
-  var parse = useCallback(function (story) {
-    return parser.parse(story);
-  }, [parser]);
+    $[0] = screensManager;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  const parser = t0;
+  let t1;
+  if ($[2] !== parser) {
+    t1 = story => parser.parse(story);
+    $[2] = parser;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  const parse = t1;
   return parse;
 };
 
-var getScreenOptions = function getScreenOptions(screenContext, opts) {
-  var _ref = screenContext || {},
-    _ref$data = _ref.data,
-    ctxData = _ref$data === void 0 ? null : _ref$data;
-  var _ref2 = ctxData || {},
-    _ref2$id = _ref2.id,
-    ctxScreenId = _ref2$id === void 0 ? null : _ref2$id,
-    ctxScreenType = _ref2.type;
-  var _ref3 = opts || {},
-    _ref3$screenId = _ref3.screenId,
-    optsScreenId = _ref3$screenId === void 0 ? null : _ref3$screenId,
-    _ref3$screenType = _ref3.screenType,
-    optsScreenType = _ref3$screenType === void 0 ? null : _ref3$screenType;
-  var screenId = ctxScreenId !== null ? ctxScreenId : optsScreenId;
-  var screenType = ctxScreenType !== null ? ctxScreenType : optsScreenType;
+const getScreenOptions = (screenContext, opts) => {
+  const {
+    data: ctxData = null
+  } = screenContext || {};
+  const {
+    id: ctxScreenId = null,
+    type: ctxScreenType
+  } = ctxData || {};
+  const {
+    screenId: optsScreenId = null,
+    screenType: optsScreenType = null
+  } = opts || {};
+  const screenId = ctxScreenId !== null ? ctxScreenId : optsScreenId;
+  const screenType = ctxScreenType !== null ? ctxScreenType : optsScreenType;
   return {
-    screenId: screenId,
-    screenType: screenType
+    screenId,
+    screenType
   };
 };
-var hasTracking = function hasTracking(tracking) {
-  return typeof tracking !== 'undefined' && tracking !== null;
-};
-var useTrackScreenView = function useTrackScreenView() {
-  var tracking = useTracking();
-  return useCallback(function () {
-    var screen = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    if (!hasTracking(tracking)) {
-      return;
-    }
-    if (screen !== null && index !== null) {
-      tracking.trackScreenView(screen, index);
-    }
-  }, [tracking]);
+const hasTracking = tracking => typeof tracking !== 'undefined' && tracking !== null;
+const useTrackScreenView = () => {
+  const $ = c(2);
+  const tracking = useTracking();
+  let t0;
+  if ($[0] !== tracking) {
+    t0 = (t1, t2) => {
+      const screen = t1 === undefined ? null : t1;
+      const index = t2 === undefined ? null : t2;
+      if (!hasTracking(tracking)) {
+        return;
+      }
+      if (screen !== null && index !== null) {
+        tracking.trackScreenView(screen, index);
+      }
+    };
+    $[0] = tracking;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  return t0;
 };
-var useTrackScreenEvent = function useTrackScreenEvent() {
-  var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var tracking = useTracking();
-  if (!hasTracking(tracking)) {
-    return function () {};
-  }
-  var screenContext = useScreen();
-  if (screenContext.renderContext !== 'view') {
-    return function () {};
-  }
-  return useCallback(function () {
-    var action = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    var label = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-    if (type !== null && action !== null) {
-      tracking.trackEvent("screen_".concat(type), action, label, _objectSpread(_objectSpread({}, opts), getScreenOptions(screenContext, opts)));
-    }
-  }, [screenContext]);
+const useTrackScreenEvent = t0 => {
+  const $ = c(4);
+  const type = t0 === undefined ? null : t0;
+  const tracking = useTracking();
+  const screenContext = useScreen();
+  let t1;
+  if ($[0] !== screenContext || $[1] !== tracking || $[2] !== type) {
+    t1 = (t2, t3, t4) => {
+      const action = t2 === undefined ? null : t2;
+      const label = t3 === undefined ? null : t3;
+      const opts = t4 === undefined ? null : t4;
+      if (!hasTracking(tracking) || screenContext.renderContext !== "view") {
+        return;
+      }
+      if (type !== null && action !== null) {
+        tracking.trackEvent(`screen_${type}`, action, label, {
+          ...opts,
+          ...getScreenOptions(screenContext, opts)
+        });
+      }
+    };
+    $[0] = screenContext;
+    $[1] = tracking;
+    $[2] = type;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
 };
-var useTrackScreenMedia = function useTrackScreenMedia() {
-  var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var tracking = useTracking();
-  var screenContext = useScreen();
-  return useCallback(function () {
-    var media = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    var action = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-    if (!hasTracking(tracking) || screenContext.renderContext !== 'view') {
-      return;
-    }
-    if (type !== null && media !== null && action !== null) {
-      tracking.trackMedia("screen_".concat(type), media, action, _objectSpread(_objectSpread({}, opts), getScreenOptions(screenContext, opts)));
-    }
-  }, [tracking, screenContext, type]);
+const useTrackScreenMedia = t0 => {
+  const $ = c(4);
+  const type = t0 === undefined ? null : t0;
+  const tracking = useTracking();
+  const screenContext = useScreen();
+  let t1;
+  if ($[0] !== screenContext || $[1] !== tracking || $[2] !== type) {
+    t1 = (t2, t3, t4) => {
+      const media = t2 === undefined ? null : t2;
+      const action = t3 === undefined ? null : t3;
+      const opts = t4 === undefined ? null : t4;
+      if (!hasTracking(tracking) || screenContext.renderContext !== "view") {
+        return;
+      }
+      if (type !== null && media !== null && action !== null) {
+        tracking.trackMedia(`screen_${type}`, media, action, {
+          ...opts,
+          ...getScreenOptions(screenContext, opts)
+        });
+      }
+    };
+    $[0] = screenContext;
+    $[1] = tracking;
+    $[2] = type;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
 };
-var useTrackEvent = function useTrackEvent() {
-  var tracking = useTracking();
-  return useCallback(function () {
-    var category = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    var action = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    var label = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-    var opts = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
-    if (!hasTracking(tracking)) {
-      return;
-    }
-    if (category !== null && action !== null) {
-      tracking.trackEvent(category, action, label, opts);
-    }
-  }, [tracking]);
+const useTrackEvent = () => {
+  const $ = c(2);
+  const tracking = useTracking();
+  let t0;
+  if ($[0] !== tracking) {
+    t0 = (t1, t2, t3, t4) => {
+      const category = t1 === undefined ? null : t1;
+      const action = t2 === undefined ? null : t2;
+      const label = t3 === undefined ? null : t3;
+      const opts = t4 === undefined ? null : t4;
+      if (!hasTracking(tracking)) {
+        return;
+      }
+      if (category !== null && action !== null) {
+        tracking.trackEvent(category, action, label, opts);
+      }
+    };
+    $[0] = tracking;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  return t0;
 };
-var useTrackMedia = function useTrackMedia() {
-  var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  var tracking = useTracking();
-  return useCallback(function () {
-    var media = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    var action = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-    var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-    if (!hasTracking(tracking)) {
-      return;
-    }
-    if (type !== null && media !== null && action !== null) {
-      tracking.trackMedia(type, media, action, opts);
-    }
-  }, []);
+const useTrackMedia = t0 => {
+  const $ = c(3);
+  const type = t0 === undefined ? null : t0;
+  const tracking = useTracking();
+  let t1;
+  if ($[0] !== tracking || $[1] !== type) {
+    t1 = (t2, t3, t4) => {
+      const media = t2 === undefined ? null : t2;
+      const action = t3 === undefined ? null : t3;
+      const opts = t4 === undefined ? null : t4;
+      if (!hasTracking(tracking)) {
+        return;
+      }
+      if (type !== null && media !== null && action !== null) {
+        tracking.trackMedia(type, media, action, opts);
+      }
+    };
+    $[0] = tracking;
+    $[1] = type;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
 };
 
-var eventsManager = typeof window !== 'undefined' ? new EventsManager(window) : null;
-var useWindowEvent = createUseEvent(eventsManager);
+const eventsManager = typeof window !== 'undefined' ? new EventsManager(window) : null;
+const useWindowEvent = createUseEvent(eventsManager);
 
-export { getObserver, useActivityDetector, useAnimationFrame, useDebounced as useDebounce, useDevicePixelRatio, useDimensionObserver, useDocumentEvent, useDragProgress, useForm, useFormTransition, useFormattedDate, useFormattedTime, useFullscreen, useIntersectionObserver, useIsVisible, useLoadedFonts, useLongPress, useMediaApi, useMediaBuffering, useMediaCurrentTime, useMediaDuration, useMediaLoad, useMediaProgress, useMediaReady, useMediaState, useMediaThumbnail, useMediaTimestampOffset, useMediaWaveform, useMediasParser, useObserver, useParsedStory, usePlaceholderStyle, useProgressSteps, useResizeObserver, useScreenSizeFromElement, useScreenSizeFromWindow, useSpringValue, useSupportsWebp, useSwipe, useThemeParser, useTrackEvent, useTrackMedia, useTrackScreenEvent, useTrackScreenMedia, useTrackScreenView, useWindowEvent };
+export { useActivityDetector, useAnimationFrame, useDebounced as useDebounce, useDevicePixelRatio, useDimensionObserver, useDocumentEvent, useDragProgress, useForm, useFormTransition, useFormattedDate, useFormattedTime, useFullscreen, useIsVisible, useLoadedFonts, useLongPress, useMediaBuffering, useMediaCurrentTime, useMediaDuration, useMediaLoad, useMediaProgress, useMediaReady, useMediaState, useMediaTimestampOffset, useMediaWaveform, useMediasParser, useParsedStory, usePlaceholderStyle, useProgressSteps, useScreenSizeFromElement, useScreenSizeFromWindow, useSpringValue, useSupportsWebp, useSwipe, useThemeParser, useTrackEvent, useTrackMedia, useTrackScreenEvent, useTrackScreenMedia, useTrackScreenView, useWindowEvent };