cozy-ui 131.1.0-beta.9 → 131.2.0

package/transpiled/react/helpers/withState.d.ts

@@ -0,0 +1,49 @@
+export default withState;
+/**
+ * Higher Order Component that wraps functional components into stateful components.
+ * Defining a stateful component becomes a matter of setting its initial state
+ * and writing a handful of reducers on that state. The state and the reducers will
+ * be passed as props to the wrapped functional component.
+ * Example:
+ * const ToggleButton = withState(initialState = {
+ *   on: false
+ * }, eventHandlers = setState => ({
+ *   toggle: () => {
+ *     setState(state => ({ on: !state.on })
+ *   }
+ * }))(
+ *   ({ on, toggle }) => (
+ *     <button class={on ? 'on' : 'off'} onClick={toggle}>Go!</button>
+ *   )
+ * )
+ */
+declare function withState(initialState: any, eventHandlers: any): (WrappedComponent: any) => {
+    new (props: any): {
+        state: any;
+        handlers: any;
+        render(): JSX.Element;
+        context: any;
+        setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
+        forceUpdate(callBack?: (() => void) | undefined): void;
+        readonly props: Readonly<any> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        componentDidMount?(): void;
+        shouldComponentUpdate?(nextProps: Readonly<any>, nextState: Readonly<any>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<any>, prevState: Readonly<any>): any;
+        componentDidUpdate?(prevProps: Readonly<any>, prevState: Readonly<any>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<any>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<any>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<any>, nextState: Readonly<any>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<any>, nextState: Readonly<any>, nextContext: any): void;
+    };
+    contextType?: React.Context<any> | undefined;
+};
+import React from "react";

package/transpiled/react/helpers/withState.js

@@ -0,0 +1,63 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React, { Component } from 'react';
+/**
+ * Higher Order Component that wraps functional components into stateful components.
+ * Defining a stateful component becomes a matter of setting its initial state
+ * and writing a handful of reducers on that state. The state and the reducers will
+ * be passed as props to the wrapped functional component.
+ * Example:
+ * const ToggleButton = withState(initialState = {
+ *   on: false
+ * }, eventHandlers = setState => ({
+ *   toggle: () => {
+ *     setState(state => ({ on: !state.on })
+ *   }
+ * }))(
+ *   ({ on, toggle }) => (
+ *     <button class={on ? 'on' : 'off'} onClick={toggle}>Go!</button>
+ *   )
+ * )
+ */
+
+var withState = function withState(initialState, eventHandlers) {
+  return function (WrappedComponent) {
+    return /*#__PURE__*/function (_Component) {
+      _inherits(StatefulComponent, _Component);
+
+      var _super = _createSuper(StatefulComponent);
+
+      function StatefulComponent(props) {
+        var _this;
+
+        _classCallCheck(this, StatefulComponent);
+
+        _this = _super.call(this, props);
+        _this.state = initialState;
+        _this.handlers = eventHandlers(_this.setState.bind(_assertThisInitialized(_this)));
+        return _this;
+      }
+
+      _createClass(StatefulComponent, [{
+        key: "render",
+        value: function render() {
+          return /*#__PURE__*/React.createElement(WrappedComponent, _extends({}, this.props, this.state, this.handlers));
+        }
+      }]);
+
+      return StatefulComponent;
+    }(Component);
+  };
+};
+
+export default withState;

package/transpiled/react/hooks/useBrowserOffline.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Checks if the browser is offline
+ *
+ * This is done through the browser API. It cannot garantees that the browser
+ * is able to contact the serveur, nor that the connection is stable enough.
+ *
+ * In Nodejs, where this API doesn't exists, always return `false`.
+ * @returns {boolean}
+ */
+export default function useBrowserOffline(): boolean;

package/transpiled/react/hooks/useBrowserOffline.js

@@ -0,0 +1,33 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useState, useCallback } from 'react';
+import useEventListener from "cozy-ui/transpiled/react/hooks/useEventListener";
+/**
+ * Checks if the browser is offline
+ *
+ * This is done through the browser API. It cannot garantees that the browser
+ * is able to contact the serveur, nor that the connection is stable enough.
+ *
+ * In Nodejs, where this API doesn't exists, always return `false`.
+ * @returns {boolean}
+ */
+
+export default function useBrowserOffline() {
+  function isOfflineNow() {
+    return window && window.navigator && window.navigator.onLine === false;
+  }
+
+  var _useState = useState(isOfflineNow),
+      _useState2 = _slicedToArray(_useState, 2),
+      isOffline = _useState2[0],
+      setOfflineSince = _useState2[1];
+
+  var setNavigatorOffline = useCallback(function () {
+    return setOfflineSince(new Date());
+  }, [setOfflineSince]);
+  var setNavigatorOnline = useCallback(function () {
+    return setOfflineSince(false);
+  }, [setOfflineSince]);
+  useEventListener(window, 'online', setNavigatorOnline);
+  useEventListener(window, 'offline', setNavigatorOffline);
+  return !!isOffline;
+}

package/transpiled/react/hooks/useBrowserOffline.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/hooks/useClientErrors.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Manages the client errors and allows to display them
+ *
+ * Returns a `ClientErrors` React component that takes care
+ * of how to display cozy-client errors (probably displaying a modal)
+ *
+ * Only Quota Errors are managed for now.
+ *
+ * @example
+ * ```
+ * const App = () => {
+ *   const { ClientErrors } = useClientErrors()
+ *
+ *   return <Layout>
+ *      <h1>My app</h1>
+ *      <ClientErrors />
+ *   </Layout>
+ * }
+ * ```
+ *
+ * @param {object} [props] - Props
+ * @param {boolean} [props.handleExceptions] - should cozy-client directly handle errors before forwarding them to the caller?
+ * @returns {{ClientErrors: Function}} React component
+ */
+export default function useClientErrors({ handleExceptions }?: {
+    handleExceptions?: boolean | undefined;
+} | undefined): {
+    ClientErrors: Function;
+};

package/transpiled/react/hooks/useClientErrors.js

@@ -0,0 +1,167 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import filter from 'lodash/filter';
+import React, { useCallback, useState, useEffect } from 'react';
+import { useClient } from 'cozy-client';
+import { FetchError } from 'cozy-stack-client';
+import QuotaAlert from "cozy-ui/transpiled/react/deprecated/QuotaAlert";
+/**
+ * Rendering functions for client fetch errors by status code
+ *
+ * @private
+ * @type {object}
+ */
+
+var byHttpStatus = {
+  413: QuotaError // <QuotaError />
+
+};
+/**
+ * Display for a quota error from the client
+ *
+ * @see QuotaAlert
+ * @private
+ * @param {object} props - Props
+ * @param {Function} props.dismiss - remove the error from the stack to display
+ * @returns {React.ReactElement}
+ */
+
+function QuotaError(_ref) {
+  var dismiss = _ref.dismiss;
+  return /*#__PURE__*/React.createElement(QuotaAlert, {
+    onClose: dismiss
+  });
+}
+/**
+ * Returns the handler for an error
+ *
+ * @param {import("../types").ClientError} error - The error
+ * @returns {Function|null} React Component
+ */
+
+
+function getErrorComponent(error) {
+  if (error instanceof Response || error instanceof FetchError) {
+    var status = error.status || '';
+    return byHttpStatus[status] || null;
+  }
+
+  return null;
+}
+/**
+ * Renders a stack of errors
+ *
+ * @private
+ * @see ClientErrors
+ * @param {import("../types").ClientError[]} errorStack - array of errors/exceptions
+ * @param {Function} setErrorStack - mutates the array of errors
+ * @returns {Array<React.ReactElement>} React rendering
+ */
+
+
+function renderErrors(errorStack, setErrorStack) {
+  var errors = errorStack.map(function (error, key) {
+    var Component = getErrorComponent(error);
+
+    if (Component) {
+      var dismiss = function dismiss() {
+        return setErrorStack(function (stack) {
+          return filter(stack, function (e) {
+            return e !== error;
+          });
+        });
+      };
+
+      return /*#__PURE__*/React.createElement(Component, {
+        key: key,
+        error: error,
+        dismiss: dismiss
+      });
+    } else {
+      return null;
+    }
+  });
+  return errors;
+}
+/**
+ * Manages the client errors and allows to display them
+ *
+ * Returns a `ClientErrors` React component that takes care
+ * of how to display cozy-client errors (probably displaying a modal)
+ *
+ * Only Quota Errors are managed for now.
+ *
+ * @example
+ * ```
+ * const App = () => {
+ *   const { ClientErrors } = useClientErrors()
+ *
+ *   return <Layout>
+ *      <h1>My app</h1>
+ *      <ClientErrors />
+ *   </Layout>
+ * }
+ * ```
+ *
+ * @param {object} [props] - Props
+ * @param {boolean} [props.handleExceptions] - should cozy-client directly handle errors before forwarding them to the caller?
+ * @returns {{ClientErrors: Function}} React component
+ */
+
+
+export default function useClientErrors() {
+  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref2$handleException = _ref2.handleExceptions,
+      handleExceptions = _ref2$handleException === void 0 ? true : _ref2$handleException;
+
+  var client = useClient();
+
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      errorStack = _useState2[0],
+      setErrorStack = _useState2[1];
+  /**
+   * Handle client errors, add them to the error stack
+   *
+   * @param {import("../types").ClientError} error -
+   * @returns {boolean} true if the error was manager, false otherwise
+   */
+
+
+  var handleError = useCallback(function (error) {
+    // `isErrorManaged` is there to avoid the same error to be added twice
+    // once the error has been added once, the `isErrorManaged`is set to true
+    // and any future push is ignored
+    if (error.isErrorManaged) return false;
+    var isManageable = !!getErrorComponent(error);
+
+    if (isManageable) {
+      error.isErrorManaged = true;
+      setErrorStack(function (stack) {
+        return stack.concat(error);
+      });
+      return true;
+    } else {
+      error.isErrorManaged = false;
+      return false;
+    }
+  }, [setErrorStack]);
+  useEffect(function () {
+    if (handleExceptions) {
+      client.on('error', handleError);
+      return function () {
+        return client.removeListener('error', handleError);
+      };
+    } else {
+      return undefined;
+    }
+  }, [client, handleError, handleExceptions]); // @ts-ignore
+
+  var ClientErrors = useCallback(function () {
+    return renderErrors(errorStack, setErrorStack);
+  }, [errorStack, setErrorStack]); // @ts-ignore
+
+  ClientErrors.displayName = 'ClientErrors';
+  return {
+    ClientErrors: ClientErrors
+  };
+}

package/transpiled/react/hooks/useClientErrors.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/hooks/useConfirmExit/index.d.ts

@@ -0,0 +1,41 @@
+/**
+ * @typedef useConfirmExitResponse
+ * @property {function} requestToLeave - gets an URL or function,
+ * triggers a confirmation modal and redirect the browser to this URL
+ * or call this function if the user confirms.
+ * @property {function} exitConfirmationModal - React component
+ * that will show a confirmation modal when requested by requestToLeave
+ * and nothing otherwise
+ */
+/**
+ * When provided a message, will warn the user before exiting the page
+ *
+ * When the browser detects a page unload (go to another website or
+ * leave the window/tab), it will show a native popup asking for
+ * confirmation. This popup may show the `message` but will usually
+ * use a native message from the browser.
+ *
+ * If the user confirm he wants to leave, `onLeave` will be executed.
+ * This function may not be able to execute async code.
+ *
+ * @param {bool|function} activate - (return) falsy to deactivate the behaviour
+ * @param {string} message - Confirmation message
+ * @param {string} title - Title of the modal
+ * @param {function} onLeave - will be executed before returning
+ * @returns {useConfirmExitResponse}
+ */
+export default function useConfirmExit({ activate, onLeave, message, title, leaveLabel, cancelLabel }?: bool | Function): useConfirmExitResponse;
+export type useConfirmExitResponse = {
+    /**
+     * - gets an URL or function,
+     * triggers a confirmation modal and redirect the browser to this URL
+     * or call this function if the user confirms.
+     */
+    requestToLeave: Function;
+    /**
+     * - React component
+     * that will show a confirmation modal when requested by requestToLeave
+     * and nothing otherwise
+     */
+    exitConfirmationModal: Function;
+};

package/transpiled/react/hooks/useConfirmExit/index.js

@@ -0,0 +1,204 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import PropTypes from 'prop-types';
+import React, { useCallback, useRef, useState } from 'react';
+var en = {
+  useConfirmExit: {
+    back: "Cancel",
+    leave: "Leave without saving",
+    title: "Abandon your changes?",
+    message: "Some changes may not be saved yet. Do you really want to leave and lose these changes?"
+  }
+};
+var fr = {
+  useConfirmExit: {
+    back: "Retour",
+    leave: "Quitter",
+    title: "Abandonner les modifications\xA0?",
+    message: "Des modifications n'ont pas encore pu \xEAtre enregistr\xE9es. Voulez-vous vraiment quitter et perdre ces modifications\xA0?"
+  }
+};
+var ru = {
+  useConfirmExit: {
+    back: "\u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C",
+    leave: "\u0423\u0439\u0442\u0438 \u0431\u0435\u0437 \u0441\u043E\u0445\u0440\u0430\u043D\u0435\u043D\u0438\u044F",
+    title: "\u041E\u0442\u043A\u0430\u0437\u0430\u0442\u044C\u0441\u044F \u043E\u0442 \u0438\u0437\u043C\u0435\u043D\u0435\u043D\u0438\u0439?",
+    message: "\u041D\u0435\u043A\u043E\u0442\u043E\u0440\u044B\u0435 \u0438\u0437\u043C\u0435\u043D\u0435\u043D\u0438\u044F \u043C\u043E\u0433\u043B\u0438 \u043D\u0435 \u0441\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C\u0441\u044F. \u0412\u044B \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043B\u044C\u043D\u043E \u0445\u043E\u0442\u0438\u0442\u0435 \u0443\u0439\u0442\u0438 \u0438 \u043F\u043E\u0442\u0435\u0440\u044F\u0442\u044C \u044D\u0442\u0438 \u0438\u0437\u043C\u0435\u043D\u0435\u043D\u0438\u044F?"
+  }
+};
+var vi = {
+  useConfirmExit: {
+    back: "H\u1EE7y",
+    leave: "R\u1EDDi kh\u1ECFi m\xE0 kh\xF4ng l\u01B0u",
+    title: "B\u1ECF c\xE1c thay \u0111\u1ED5i c\u1EE7a b\u1EA1n?",
+    message: "M\u1ED9t s\u1ED1 thay \u0111\u1ED5i c\xF3 th\u1EC3 ch\u01B0a \u0111\u01B0\u1EE3c l\u01B0u. B\u1EA1n c\xF3 th\u1EF1c s\u1EF1 mu\u1ED1n r\u1EDDi kh\u1ECFi v\xE0 m\u1EA5t c\xE1c thay \u0111\u1ED5i n\xE0y kh\xF4ng?"
+  }
+};
+import { ConfirmDialog } from "cozy-ui/transpiled/react/CozyDialogs";
+import Button from "cozy-ui/transpiled/react/deprecated/Button";
+import withLocales from "cozy-ui/transpiled/react/providers/I18n/withLocales";
+import useEventListener from "cozy-ui/transpiled/react/hooks/useEventListener";
+/**
+ * Confirmation modal
+ * @private
+ * @param {string} message - Confirmation message
+ * @param {string} title - Title of the modal
+ * @param {function} onConfirm - will be executed on confirmation
+ * @param {function} onCancel - will be executed on cancelation
+ */
+
+function ConfirmModal(_ref) {
+  var t = _ref.t,
+      title = _ref.title,
+      message = _ref.message,
+      onConfirm = _ref.onConfirm,
+      onCancel = _ref.onCancel,
+      cancelLabel = _ref.cancelLabel,
+      confirmLabel = _ref.confirmLabel;
+  return /*#__PURE__*/React.createElement(ConfirmDialog, {
+    open: true,
+    actions: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+      label: confirmLabel || t('useConfirmExit.leave'),
+      onClick: onConfirm,
+      theme: "danger"
+    }), /*#__PURE__*/React.createElement(Button, {
+      label: cancelLabel || t('useConfirmExit.back'),
+      onClick: onCancel,
+      theme: "secondary"
+    })),
+    content: message || t('useConfirmExit.message'),
+    title: title || t('useConfirmExit.title')
+  });
+}
+
+ConfirmModal.propTypes = {
+  message: PropTypes.string,
+  title: PropTypes.string,
+  onConfirm: PropTypes.func.isRequired,
+  onCancel: PropTypes.func.isRequired,
+  cancelLabel: PropTypes.string,
+  confirmLabel: PropTypes.string
+};
+var dictRequire = {
+  en: en,
+  fr: fr,
+  ru: ru,
+  vi: vi
+};
+var LocalizedConfirmModal = withLocales(dictRequire)(ConfirmModal);
+/**
+ * Go to the requested destination (URL or function)
+ *
+ * @param {string|function} destination
+ */
+
+function go(destination) {
+  if (typeof destination === 'function') {
+    destination();
+  } else if (typeof destination === 'string') {
+    document.location = destination;
+  } else {
+    throw new Error("Unknown location where to jump to");
+  }
+}
+
+function isActivated(activate) {
+  return typeof activate === 'function' ? activate() : activate;
+}
+/**
+ * @typedef useConfirmExitResponse
+ * @property {function} requestToLeave - gets an URL or function,
+ * triggers a confirmation modal and redirect the browser to this URL
+ * or call this function if the user confirms.
+ * @property {function} exitConfirmationModal - React component
+ * that will show a confirmation modal when requested by requestToLeave
+ * and nothing otherwise
+ */
+
+/**
+ * When provided a message, will warn the user before exiting the page
+ *
+ * When the browser detects a page unload (go to another website or
+ * leave the window/tab), it will show a native popup asking for
+ * confirmation. This popup may show the `message` but will usually
+ * use a native message from the browser.
+ *
+ * If the user confirm he wants to leave, `onLeave` will be executed.
+ * This function may not be able to execute async code.
+ *
+ * @param {bool|function} activate - (return) falsy to deactivate the behaviour
+ * @param {string} message - Confirmation message
+ * @param {string} title - Title of the modal
+ * @param {function} onLeave - will be executed before returning
+ * @returns {useConfirmExitResponse}
+ */
+
+
+export default function useConfirmExit() {
+  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref2$activate = _ref2.activate,
+      activate = _ref2$activate === void 0 ? true : _ref2$activate,
+      onLeave = _ref2.onLeave,
+      message = _ref2.message,
+      title = _ref2.title,
+      leaveLabel = _ref2.leaveLabel,
+      cancelLabel = _ref2.cancelLabel;
+
+  // `onbeforeunload` event on the browser:
+  // Using a ref in order to have an event listener that does not
+  // need to be deregistered, recreated and registered again at each
+  // message or callback change. If not, the lag introduced by the
+  // useEffect inside useEventListener may create wrong behaviours
+  // for fast changing calls to useConfirmExit.
+  var state = useRef();
+  state.current = {
+    message: message,
+    onLeave: onLeave,
+    activate: activate
+  };
+  var beforeunload = useCallback(function (event) {
+    var activated = isActivated(state.current.activate);
+    activated && state.current.onLeave && state.current.onLeave();
+    var returnValue = activated ? state.current.message : null;
+    if (returnValue) event.returnValue = returnValue;
+    return returnValue;
+  }, []);
+  useEventListener(window, 'beforeunload', beforeunload); // contains an URL of function given to `requestToLeave`
+  // any truthy value will trigger the ExitConfirmationModal
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      modalDest = _useState2[0],
+      setModalDest = _useState2[1];
+
+  var onCloseModalRequest = useCallback(function () {
+    setModalDest(false);
+  }, [setModalDest]); // call this with an URL or a function to trigger the ExitConfirmationModal
+
+  var requestToLeave = useCallback(function (where) {
+    if (isActivated(state.current.activate)) {
+      setModalDest(function () {
+        return where;
+      });
+    } else {
+      go(where);
+    }
+  }, [state, setModalDest]); // null when the modal is closed, a Modal otherwise
+
+  var onConfirm = useCallback(function () {
+    onLeave && onLeave();
+    go(modalDest);
+  }, [modalDest, onLeave]); // return the modal if opened
+
+  var modal = modalDest && /*#__PURE__*/React.createElement(LocalizedConfirmModal, {
+    message: message,
+    title: title,
+    onCancel: onCloseModalRequest,
+    onConfirm: onConfirm,
+    confirmLabel: leaveLabel,
+    cancelLabel: cancelLabel
+  });
+  return {
+    requestToLeave: requestToLeave,
+    exitConfirmationModal: modal
+  };
+}

package/transpiled/react/hooks/useConfirmExit/index.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/hooks/useCycle.d.ts

@@ -0,0 +1,12 @@
+export default useCycle;
+/**
+ * When calling setPrev when we are at index min, goes to max
+ * When calling setNext when we are at index max, goes to min
+ *
+ * @param  {number} initialState - If initialState becomes defined (undefined -> value),
+ * index will be set to value (useful when the initial state is not known yet)
+ * @param  {number} min
+ * @param  {number} max
+ * @return {Array} - [index, setPrev, setNext]
+ */
+declare function useCycle(initialState: number, min: number, max: number): any[];

package/transpiled/react/hooks/useCycle.js

@@ -0,0 +1,38 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useState, useCallback, useEffect } from 'react';
+/**
+ * When calling setPrev when we are at index min, goes to max
+ * When calling setNext when we are at index max, goes to min
+ *
+ * @param  {number} initialState - If initialState becomes defined (undefined -> value),
+ * index will be set to value (useful when the initial state is not known yet)
+ * @param  {number} min
+ * @param  {number} max
+ * @return {Array} - [index, setPrev, setNext]
+ */
+
+var useCycle = function useCycle(initialState, min, max) {
+  var _useState = useState(initialState),
+      _useState2 = _slicedToArray(_useState, 2),
+      curIndex = _useState2[0],
+      setIndex = _useState2[1];
+
+  var handlePrev = useCallback(function () {
+    var prev = curIndex - 1;
+    setIndex(prev < min ? max : prev);
+  }, [curIndex, min, max]);
+  var handleNext = useCallback(function () {
+    var next = curIndex + 1;
+    setIndex(next > max ? min : next);
+  }, [curIndex, max, min]); // If the initialState is not initially set, the index will be undefined and
+  // when it becomes defined, index will be set to the defined initialState value
+
+  useEffect(function () {
+    if (curIndex === undefined && initialState !== undefined) {
+      setIndex(initialState);
+    }
+  }, [curIndex, initialState]);
+  return [curIndex, handlePrev, handleNext];
+};
+
+export default useCycle;

package/transpiled/react/hooks/useCycle.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/hooks/useEventListener.d.ts

@@ -0,0 +1,2 @@
+export default useEventListener;
+declare function useEventListener(element: any, event: any, cb: any): void;