@panneau/core 1.0.1-alpha.0 → 1.0.3-alpha.0

package/es/contexts.js

@@ -0,0 +1,1740 @@
+import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import React, { useContext, useMemo, useState, useEffect, useRef, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import isString from 'lodash/isString';
+import { ComponentsManager, PropTypes as PropTypes$1, FieldsManager, Tracking } from '@panneau/core';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import uniqBy from 'lodash/uniqBy';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import isObject from 'lodash/isObject';
+import { getJSON } from '@folklore/fetch';
+import { loadGoogleApi, loadGoogleMaps } from '@folklore/services';
+import { useIntl } from 'react-intl';
+import { getDisplayName } from '@panneau/core/utils';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { generatePath, useNavigate } from 'react-router';
+import { TrackingContext, TrackingContainer } from '@folklore/tracking';
+export { TrackingContext } from '@folklore/tracking';
+import { v1 } from 'uuid';
+
+var MODALS_NAMESPACE = 'modals';
+var FIELDS_NAMESPACE = 'fields';
+var FORMS_NAMESPACE = 'forms';
+var FILTERS_NAMESPACE = 'filters';
+var LISTS_NAMESPACE = 'lists';
+var DISPLAYS_NAMESPACE = 'displays';
+var APP_NAMESPACE = 'app';
+var ComponentsContext = /*#__PURE__*/React.createContext(null);
+/**
+ * Hooks
+ */
+
+var useComponentsManager = function useComponentsManager() {
+  var namespace = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+  var manager = useContext(ComponentsContext);
+  var finalManager = useMemo(function () {
+    return namespace !== null ? new ComponentsManager(manager.getComponents(namespace)) : manager;
+  }, [manager, namespace]);
+  return finalManager;
+};
+var useComponents = function useComponents() {
+  var namespace = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+  var defaultComponents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var manager = useComponentsManager();
+  return manager.getComponents(namespace) || defaultComponents;
+};
+var useComponent = function useComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  var namespace = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+
+  if (!isString(name)) {
+    return name || defaultComponent;
+  }
+
+  var manager = useComponentsManager(namespace);
+  return useMemo(function () {
+    return manager.getComponent(name) || defaultComponent;
+  }, [manager, name, defaultComponent]);
+};
+/**
+ * Fields hooks
+ */
+
+var useFieldsComponentsManager = function useFieldsComponentsManager() {
+  return useComponentsManager(FIELDS_NAMESPACE);
+};
+var useFieldsComponents = function useFieldsComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(FIELDS_NAMESPACE, defaultComponents);
+};
+var useFieldComponent = function useFieldComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, FIELDS_NAMESPACE);
+};
+/**
+ * Forms hooks
+ */
+
+var useFormsComponentsManager = function useFormsComponentsManager() {
+  return useComponentsManager(FORMS_NAMESPACE);
+};
+var useFormsComponents = function useFormsComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(FORMS_NAMESPACE, defaultComponents);
+};
+var useFormComponent = function useFormComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, FORMS_NAMESPACE);
+};
+/**
+ * Modals hooks
+ */
+
+var useModalsComponentsManager = function useModalsComponentsManager() {
+  return useComponentsManager(MODALS_NAMESPACE);
+};
+var useModalsComponents = function useModalsComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(MODALS_NAMESPACE, defaultComponents);
+};
+var useModalComponent = function useModalComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, MODALS_NAMESPACE);
+};
+/**
+ * Filters hooks
+ */
+
+var useFiltersComponentsManager = function useFiltersComponentsManager() {
+  return useComponentsManager(FILTERS_NAMESPACE);
+};
+var useFiltersComponents = function useFiltersComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(FILTERS_NAMESPACE, defaultComponents);
+};
+var useFilterComponent = function useFilterComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, FILTERS_NAMESPACE);
+};
+/**
+ * Lists hooks
+ */
+
+var useListsComponentsManager = function useListsComponentsManager() {
+  return useComponentsManager(LISTS_NAMESPACE);
+};
+var useListsComponents = function useListsComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(LISTS_NAMESPACE, defaultComponents);
+};
+var useListComponent = function useListComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, LISTS_NAMESPACE);
+};
+/**
+ * Displays hooks
+ */
+
+var useDisplaysComponentsManager = function useDisplaysComponentsManager() {
+  return useComponentsManager(DISPLAYS_NAMESPACE);
+};
+var useDisplaysComponents = function useDisplaysComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(DISPLAYS_NAMESPACE, defaultComponents);
+};
+var useDisplayComponent = function useDisplayComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, DISPLAYS_NAMESPACE);
+};
+/**
+ * App hooks
+ */
+
+var useAppComponentsManager = function useAppComponentsManager() {
+  return useComponentsManager(APP_NAMESPACE);
+};
+var useAppComponents = function useAppComponents() {
+  var defaultComponents = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return useComponents(APP_NAMESPACE, defaultComponents);
+};
+var useAppComponent = function useAppComponent(name) {
+  var defaultComponent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  return useComponent(name, defaultComponent, APP_NAMESPACE);
+};
+/**
+ * Provider
+ */
+
+var propTypes$f = {
+  children: PropTypes.node.isRequired,
+  namespace: PropTypes.string,
+  manager: PropTypes.instanceOf(ComponentsManager),
+  components: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.object, PropTypes.func]))
+};
+var defaultProps$f = {
+  namespace: null,
+  components: {},
+  manager: null
+};
+var ComponentsProvider = function ComponentsProvider(_ref) {
+  var components = _ref.components,
+      manager = _ref.manager,
+      namespace = _ref.namespace,
+      children = _ref.children;
+  var previousManager = useComponentsManager() || null;
+  var finalManager = useMemo(function () {
+    return new ComponentsManager(_objectSpread(_objectSpread(_objectSpread({}, previousManager !== null ? previousManager.getComponents() : null), manager !== null ? manager.getComponents() : null), new ComponentsManager(components).addNamespace(namespace).getComponents()));
+  }, [previousManager, manager, components, namespace]);
+  return /*#__PURE__*/React.createElement(ComponentsContext.Provider, {
+    value: finalManager
+  }, children);
+};
+ComponentsProvider.propTypes = propTypes$f;
+ComponentsProvider.defaultProps = defaultProps$f;
+
+var message = PropTypes.shape({
+  id: PropTypes.string.isRequired,
+  defaultMessage: PropTypes.string
+});
+var label = PropTypes.oneOfType([message, PropTypes.node]);
+PropTypes.oneOfType([PropTypes.number, PropTypes.string]);
+/**
+ * Core
+ */
+
+var menuItem = PropTypes.shape({
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  label: label,
+  url: PropTypes.string,
+  external: PropTypes.bool,
+  active: PropTypes.bool
+});
+PropTypes.arrayOf(menuItem);
+var button = PropTypes.shape({
+  id: PropTypes.string,
+  label: label,
+  onClick: PropTypes.func
+});
+PropTypes.arrayOf(button);
+PropTypes.oneOf(['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark', null]);
+PropTypes.oneOf(['lg', 'sm', null]);
+PropTypes.oneOf(['button', 'submit']);
+PropTypes.oneOf(['start', 'end']);
+PropTypes.oneOf(['lg', 'sm', null]);
+PropTypes.oneOf(['loading', 'success', 'error', null]);
+var fieldOption = PropTypes.shape({
+  value: PropTypes.string,
+  label: PropTypes.string
+});
+PropTypes.arrayOf(fieldOption);
+var toggle = PropTypes.shape({
+  key: PropTypes.string,
+  label: PropTypes.string
+});
+PropTypes.arrayOf(toggle);
+var tableColumn = PropTypes.shape({
+  id: PropTypes.string,
+  component: PropTypes.string,
+  path: PropTypes.string,
+  field: PropTypes.string,
+  columnClassName: PropTypes.string
+});
+PropTypes.arrayOf(tableColumn);
+/**
+ * Panneau Definitions
+ */
+
+var routes = PropTypes.shape({
+  'resources.index': PropTypes.string.isRequired,
+  'resources.create': PropTypes.string.isRequired,
+  'resources.store': PropTypes.string.isRequired,
+  'resources.show': PropTypes.string.isRequired,
+  'resources.edit': PropTypes.string.isRequired,
+  'resources.update': PropTypes.string.isRequired,
+  'resources.delete': PropTypes.string.isRequired,
+  'resources.destroy': PropTypes.string.isRequired
+});
+var intl = PropTypes.shape({
+  locale: PropTypes.string,
+  messages: PropTypes.objectOf(PropTypes.string),
+  values: PropTypes.objectOf(PropTypes.string)
+});
+var page = PropTypes.shape({
+  component: PropTypes.string.isRequired
+});
+var pages = PropTypes.objectOf(page);
+var field = PropTypes.shape({
+  name: PropTypes.string.isRequired,
+  type: PropTypes.string,
+  component: PropTypes.string,
+  label: PropTypes.node
+});
+var fields = PropTypes.arrayOf(field);
+var form = PropTypes.shape({
+  // type: PropTypes.string.isRequired,
+  title: PropTypes.isRequired,
+  fields: fields
+});
+PropTypes.arrayOf(form);
+var resource = PropTypes.shape({
+  id: PropTypes.string.isRequired,
+  name: PropTypes.string.isRequired,
+  intl: intl,
+  fields: fields,
+  forms: PropTypes.shape({}),
+  shows_in_navbar: PropTypes.bool
+});
+var resources = PropTypes.arrayOf(resource);
+var panneauDefinition = PropTypes.shape({
+  name: PropTypes.string,
+  resources: resources,
+  routes: routes,
+  pages: pages,
+  intl: intl // intl,
+
+});
+var definition = PropTypes.shape({
+  name: PropTypes.string // resources,
+  // routes,
+  // intl,
+
+});
+var item = PropTypes.shape({
+  id: PropTypes.string.isRequired
+});
+PropTypes.arrayOf(item);
+var user = PropTypes.shape({
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+});
+PropTypes.arrayOf(user);
+var selectOption = PropTypes.oneOfType([PropTypes.string, PropTypes.shape({
+  value: PropTypes.any,
+  // eslint-disable-line
+  label: label
+})]);
+PropTypes.arrayOf(selectOption);
+PropTypes.oneOf(['valid', 'invalid', 'loading', null]);
+var formError = PropTypes.shape({
+  message: PropTypes.string
+});
+PropTypes.arrayOf(formError);
+PropTypes.shape({
+  tus: PropTypes.object
+}); // eslint-disable-line
+
+PropTypes.string;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var DefinitionContext = /*#__PURE__*/React.createContext(null);
+var useDefinitionContext = function useDefinitionContext() {
+  return useContext(DefinitionContext);
+};
+var useDefinition = function useDefinition() {
+  var _useDefinitionContext = useDefinitionContext(),
+      _useDefinitionContext2 = _useDefinitionContext.definition,
+      definition = _useDefinitionContext2 === void 0 ? null : _useDefinitionContext2;
+
+  return definition;
+};
+var propTypes$e = {
+  definition: definition.isRequired,
+  children: PropTypes.node.isRequired
+};
+var defaultProps$e = {};
+var DefinitionProvider = function DefinitionProvider(_ref) {
+  var definition = _ref.definition,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement(DefinitionContext.Provider, {
+    value: definition
+  }, children);
+};
+DefinitionProvider.propTypes = propTypes$e;
+DefinitionProvider.defaultProps = defaultProps$e;
+
+var FieldsContext = /*#__PURE__*/React.createContext(null);
+var useFieldsManager = function useFieldsManager() {
+  return useContext(FieldsContext);
+};
+var useField = function useField(id) {
+  var manager = useFieldsManager();
+  return manager.getDefinition(id);
+};
+var useFields = function useFields() {
+  var manager = useFieldsManager();
+  return manager.getDefinitions();
+};
+var propTypes$d = {
+  fields: PropTypes$1.fields,
+  manager: PropTypes.instanceOf(FieldsManager),
+  children: PropTypes.node.isRequired
+};
+var defaultProps$d = {
+  fields: null,
+  manager: null
+};
+var FieldsProvider = function FieldsProvider(_ref) {
+  var fields = _ref.fields,
+      manager = _ref.manager,
+      children = _ref.children;
+  var previousManager = useFieldsManager() || null;
+  var finalManager = useMemo(function () {
+    var newFields = uniqBy([].concat(_toConsumableArray(fields || []), _toConsumableArray(manager !== null ? manager.getDefinitions() : []), _toConsumableArray(previousManager !== null ? previousManager.getDefinitions() : [])), function (_ref2) {
+      var id = _ref2.id;
+      return id;
+    }).reverse();
+    return new FieldsManager(newFields);
+  }, [previousManager, manager, fields]);
+  var components = useMemo(function () {
+    var newComponents = finalManager.getComponents();
+    return Object.keys(newComponents).reduce(function (map, id) {
+      var component = newComponents[id];
+      return isString(component) ? map : _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, id, component));
+    }, {});
+  }, [finalManager]);
+  return /*#__PURE__*/React.createElement(FieldsContext.Provider, {
+    value: finalManager
+  }, /*#__PURE__*/React.createElement(ComponentsProvider, {
+    namespace: FIELDS_NAMESPACE,
+    components: components
+  }, children));
+};
+FieldsProvider.propTypes = propTypes$d;
+FieldsProvider.defaultProps = defaultProps$d;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var GoogleKeysContext = /*#__PURE__*/React.createContext({
+  apiKey: null
+});
+var useGoogleKeys = function useGoogleKeys() {
+  return useContext(GoogleKeysContext);
+};
+var propTypes$c = {
+  children: PropTypes.node.isRequired,
+  apiKey: PropTypes.string // .isRequired,
+
+};
+var defaultProps$c = {
+  apiKey: null
+};
+var GoogleKeysProvider = function GoogleKeysProvider(_ref) {
+  var children = _ref.children,
+      apiKey = _ref.apiKey;
+
+  var _useGoogleKeys = useGoogleKeys(),
+      previousApiKey = _useGoogleKeys.apiKey;
+
+  return /*#__PURE__*/React.createElement(GoogleKeysContext.Provider, {
+    value: {
+      apiKey: apiKey || previousApiKey
+    }
+  }, children);
+};
+GoogleKeysProvider.propTypes = propTypes$c;
+GoogleKeysProvider.defaultProps = defaultProps$c;
+
+var FontsContext = /*#__PURE__*/React.createContext({
+  systemFonts: null,
+  googleFonts: null,
+  customFonts: null
+});
+var useGoogleFonts = function useGoogleFonts() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$setFonts = _ref.setFonts,
+      setFonts = _ref$setFonts === void 0 ? null : _ref$setFonts;
+
+  var _useGoogleKeys = useGoogleKeys(),
+      apiKey = _useGoogleKeys.apiKey;
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      googleFonts = _useState2[0],
+      setGoogleFonts = _useState2[1];
+
+  useEffect(function () {
+    var canceled = false;
+
+    if (apiKey !== null && !disabled) {
+      getJSON("https://www.googleapis.com/webfonts/v1/webfonts?key=".concat(apiKey, "&sort=popularity")).then(function (_ref2) {
+        var _ref2$items = _ref2.items,
+            items = _ref2$items === void 0 ? [] : _ref2$items;
+
+        if (!canceled) {
+          var newFonts = items.map(function (it) {
+            return {
+              type: 'google',
+              name: it.family,
+              variants: it.variants
+            };
+          });
+
+          if (setFonts !== null) {
+            setFonts(newFonts);
+          } else {
+            setGoogleFonts(newFonts);
+          }
+        }
+      });
+    }
+
+    return function () {
+      canceled = true;
+    };
+  }, [apiKey, disabled, setFonts, setGoogleFonts]);
+  return googleFonts;
+};
+var useFonts = function useFonts() {
+  var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref3$withoutGoogleFo = _ref3.withoutGoogleFonts,
+      withoutGoogleFonts = _ref3$withoutGoogleFo === void 0 ? false : _ref3$withoutGoogleFo;
+
+  var _useContext = useContext(FontsContext),
+      _useContext$setGoogle = _useContext.setGoogleFonts,
+      setGoogleFonts = _useContext$setGoogle === void 0 ? null : _useContext$setGoogle,
+      _useContext$systemFon = _useContext.systemFonts,
+      systemFonts = _useContext$systemFon === void 0 ? null : _useContext$systemFon,
+      _useContext$googleFon = _useContext.googleFonts,
+      googleFonts = _useContext$googleFon === void 0 ? null : _useContext$googleFon,
+      _useContext$customFon = _useContext.customFonts,
+      customFonts = _useContext$customFon === void 0 ? null : _useContext$customFon;
+
+  useGoogleFonts({
+    disabled: withoutGoogleFonts || googleFonts !== null && googleFonts.length > 0,
+    setFonts: setGoogleFonts
+  });
+  var fonts = useMemo(function () {
+    return {
+      systemFonts: systemFonts,
+      googleFonts: googleFonts,
+      customFonts: customFonts
+    };
+  }, [systemFonts, googleFonts, customFonts]);
+  return fonts;
+};
+var propTypes$b = {
+  children: PropTypes.node.isRequired,
+  systemFonts: PropTypes$1.fonts,
+  customFonts: PropTypes$1.fonts
+};
+var defaultProps$b = {
+  systemFonts: ['Arial', 'Courier', 'Georgia', 'Times New Roman', 'Verdana'],
+  customFonts: null
+};
+var FontsProvider = function FontsProvider(_ref4) {
+  var systemFonts = _ref4.systemFonts,
+      customFonts = _ref4.customFonts,
+      children = _ref4.children;
+
+  var _useFonts = useFonts(),
+      _useFonts$systemFonts = _useFonts.systemFonts,
+      previousSystemFonts = _useFonts$systemFonts === void 0 ? null : _useFonts$systemFonts,
+      _useFonts$googleFonts = _useFonts.googleFonts,
+      previousGoogleFonts = _useFonts$googleFonts === void 0 ? null : _useFonts$googleFonts,
+      previousCustomFonts = _useFonts.customFonts;
+
+  var _useState3 = useState(null),
+      _useState4 = _slicedToArray(_useState3, 2),
+      googleFonts = _useState4[0],
+      setGoogleFonts = _useState4[1];
+
+  var fonts = useMemo(function () {
+    return {
+      systemFonts: uniqBy([].concat(_toConsumableArray(previousSystemFonts || []), _toConsumableArray(systemFonts || [])), function (font) {
+        return isObject(font) ? font.name : font;
+      }),
+      googleFonts: uniqBy([].concat(_toConsumableArray(previousGoogleFonts || []), _toConsumableArray(googleFonts || [])), function (font) {
+        return isObject(font) ? font.name : font;
+      }),
+      customFonts: uniqBy([].concat(_toConsumableArray(previousCustomFonts || []), _toConsumableArray(customFonts || [])), function (font) {
+        return isObject(font) ? font.name : font;
+      }),
+      setGoogleFonts: setGoogleFonts
+    };
+  }, [previousSystemFonts, previousGoogleFonts, previousCustomFonts, customFonts, systemFonts, googleFonts, setGoogleFonts]);
+  return /*#__PURE__*/React.createElement(FontsContext.Provider, {
+    value: fonts
+  }, children);
+};
+FontsProvider.propTypes = propTypes$b;
+FontsProvider.defaultProps = defaultProps$b;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var FormContext = /*#__PURE__*/React.createContext(null);
+var useForm = function useForm() {
+  return useContext(FormContext);
+};
+var useFormValue = function useFormValue() {
+  var _useForm = useForm(),
+      value = _useForm.value;
+
+  return value;
+};
+var useFormSetValue = function useFormSetValue() {
+  var _useForm2 = useForm(),
+      setValue = _useForm2.setValue;
+
+  return setValue;
+};
+var propTypes$a = {
+  value: PropTypes.object.isRequired,
+  // eslint-disable-line react/forbid-prop-types
+  setValue: PropTypes.func.isRequired,
+  children: PropTypes.node.isRequired
+};
+var defaultProps$a = {};
+var FormProvider = function FormProvider(_ref) {
+  var value = _ref.value,
+      setValue = _ref.setValue,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
+    value: {
+      value: value,
+      setValue: setValue
+    }
+  }, children);
+};
+FormProvider.propTypes = propTypes$a;
+FormProvider.defaultProps = defaultProps$a;
+
+var GoogleApiClientContext = /*#__PURE__*/React.createContext(null);
+var useGoogleApiClient = function useGoogleApiClient() {
+  return useContext(GoogleApiClientContext);
+};
+var withGoogleApiClient = function withGoogleApiClient(WrappedComponent) {
+  var getDisplayName = function getDisplayName(_ref) {
+    var _ref$displayName = _ref.displayName,
+        displayName = _ref$displayName === void 0 ? null : _ref$displayName,
+        _ref$name = _ref.name,
+        name = _ref$name === void 0 ? null : _ref$name;
+    return displayName || name || 'Component';
+  };
+
+  var WithGoogleApiClientComponent = function WithGoogleApiClientComponent(props) {
+    return /*#__PURE__*/React.createElement(GoogleApiClientContext.Consumer, null, function (client) {
+      return /*#__PURE__*/React.createElement(WrappedComponent, Object.assign({
+        googleApiClient: client
+      }, props));
+    });
+  };
+
+  WithGoogleApiClientComponent.displayName = "WithGoogleApiClient(".concat(getDisplayName(WrappedComponent), ")");
+  return WithGoogleApiClientComponent;
+};
+var propTypes$9 = {
+  children: PropTypes.node.isRequired
+};
+var defaultProps$9 = {};
+var GoogleApiClientProvider = function GoogleApiClientProvider(_ref2) {
+  var children = _ref2.children;
+
+  var _useGoogleKeys = useGoogleKeys(),
+      apiKey = _useGoogleKeys.apiKey;
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      client = _useState2[0],
+      setClient = _useState2[1];
+
+  useEffect(function () {
+    loadGoogleApi().then(function (gapi) {
+      return gapi.client.init({
+        apiKey: apiKey
+      }).then(function () {
+        return gapi;
+      });
+    }).then(function (gapi) {
+      return setClient(gapi);
+    });
+  }, [apiKey, setClient]);
+  return /*#__PURE__*/React.createElement(GoogleApiClientContext.Provider, {
+    value: client
+  }, children);
+};
+GoogleApiClientProvider.propTypes = propTypes$9;
+GoogleApiClientProvider.defaultProps = defaultProps$9;
+
+var GoogleMapsClientContext = /*#__PURE__*/React.createContext(null);
+var useGoogleMapsClient = function useGoogleMapsClient() {
+  return useContext(GoogleMapsClientContext);
+};
+var withGoogleMapsClient = function withGoogleMapsClient(WrappedComponent) {
+  var getDisplayName = function getDisplayName(_ref) {
+    var _ref$displayName = _ref.displayName,
+        displayName = _ref$displayName === void 0 ? null : _ref$displayName,
+        _ref$name = _ref.name,
+        name = _ref$name === void 0 ? null : _ref$name;
+    return displayName || name || 'Component';
+  };
+
+  var WithGoogleMapsClientComponent = function WithGoogleMapsClientComponent(props) {
+    return /*#__PURE__*/React.createElement(GoogleMapsClientContext.Consumer, null, function (client) {
+      return /*#__PURE__*/React.createElement(WrappedComponent, Object.assign({
+        googleApiClient: client
+      }, props));
+    });
+  };
+
+  WithGoogleMapsClientComponent.displayName = "WithGoogleMapsClient(".concat(getDisplayName(WrappedComponent), ")");
+  return WithGoogleMapsClientComponent;
+};
+var propTypes$8 = {
+  children: PropTypes.node.isRequired,
+  locale: PropTypes.string,
+  libraries: PropTypes.arrayOf(PropTypes.string)
+};
+var defaultProps$8 = {
+  locale: 'fr',
+  libraries: null
+};
+var GoogleMapsClientProvider = function GoogleMapsClientProvider(_ref2) {
+  var children = _ref2.children,
+      locale = _ref2.locale,
+      libraries = _ref2.libraries;
+
+  var _useGoogleKeys = useGoogleKeys(),
+      apiKey = _useGoogleKeys.apiKey;
+
+  var exisitingClient = useGoogleMapsClient();
+
+  var _useState = useState(exisitingClient),
+      _useState2 = _slicedToArray(_useState, 2),
+      client = _useState2[0],
+      setClient = _useState2[1];
+
+  useEffect(function () {
+    if (exisitingClient === null) {
+      loadGoogleMaps({
+        apiKey: apiKey,
+        locale: locale,
+        libraries: libraries
+      }).then(function (newClient) {
+        setClient(newClient);
+      });
+    }
+  }, [apiKey, locale, libraries, setClient, exisitingClient]);
+  return /*#__PURE__*/React.createElement(GoogleMapsClientContext.Provider, {
+    value: client
+  }, children);
+};
+GoogleMapsClientProvider.propTypes = propTypes$8;
+GoogleMapsClientProvider.defaultProps = defaultProps$8;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var defaultLocales = ['en', 'fr'];
+var LocalesContext = /*#__PURE__*/React.createContext({
+  locales: defaultLocales
+});
+var useLocales = function useLocales() {
+  var _useContext = useContext(LocalesContext),
+      locales = _useContext.locales;
+
+  return locales;
+};
+var useOtherLocales = function useOtherLocales() {
+  var _useLocales = useLocales(),
+      locales = _useLocales.locales;
+
+  var _useIntl = useIntl(),
+      locale = _useIntl.locale;
+
+  var otherLocales = useMemo(function () {
+    return locales.filter(function (it) {
+      return it !== locale;
+    });
+  }, [locales, locale]);
+  return otherLocales;
+};
+var propTypes$7 = {
+  locales: PropTypes.arrayOf(PropTypes.string),
+  children: PropTypes.node.isRequired
+};
+var defaultProps$7 = {
+  locales: []
+};
+var LocalesProvider = function LocalesProvider(_ref) {
+  var locales = _ref.locales,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement(LocalesContext.Provider, {
+    value: {
+      locales: locales
+    }
+  }, children);
+};
+LocalesProvider.propTypes = propTypes$7;
+LocalesProvider.defaultProps = defaultProps$7;
+
+var ModalsContext = /*#__PURE__*/React.createContext({
+  container: null
+});
+var useModals = function useModals() {
+  return useContext(ModalsContext) || {};
+};
+var withModals = function withModals(WrappedComponent) {
+  var WithModalsComponent = function WithModalsComponent(props) {
+    return /*#__PURE__*/React.createElement(ModalsContext.Consumer, null, function (_ref) {
+      var modals = _ref.modals,
+          container = _ref.container,
+          setContainer = _ref.setContainer,
+          register = _ref.register,
+          unregister = _ref.unregister;
+      return /*#__PURE__*/React.createElement(WrappedComponent, Object.assign({
+        modalsContainer: container,
+        setModalsContainer: setContainer,
+        modals: modals,
+        registerModal: register,
+        unregisterModal: unregister
+      }, props));
+    });
+  };
+
+  WithModalsComponent.displayName = "WithModals(".concat(getDisplayName(WrappedComponent), ")");
+  return WithModalsComponent;
+};
+var propTypes$6 = {
+  children: PropTypes.node.isRequired,
+  container: PropTypes.object // eslint-disable-line
+
+};
+var defaultProps$6 = {
+  container: null
+};
+var ModalsProvider = function ModalsProvider(_ref2) {
+  var children = _ref2.children,
+      initialContainer = _ref2.container;
+
+  var _useState = useState(initialContainer),
+      _useState2 = _slicedToArray(_useState, 2),
+      container = _useState2[0],
+      setContainer = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      modals = _useState4[0],
+      setModals = _useState4[1];
+
+  var modalsRef = useRef(modals);
+  var register = useCallback(function (id) {
+    var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+    var currentModals = modalsRef.current;
+    var newModals = [].concat(_toConsumableArray(currentModals), [_objectSpread({
+      id: id
+    }, data)]);
+    setModals(newModals);
+    modalsRef.current = newModals;
+  }, [modals, setModals]);
+  var unregister = useCallback(function (id) {
+    var currentModals = modalsRef.current;
+    var foundIndex = currentModals.findIndex(function (_ref3) {
+      var modalId = _ref3.id;
+      return modalId === id;
+    });
+
+    if (foundIndex !== -1) {
+      var newModals = currentModals.filter(function (_ref4) {
+        var modalId = _ref4.id;
+        return modalId !== id;
+      });
+      setModals(newModals);
+      modalsRef.current = newModals;
+    }
+  }, [modals, setModals]);
+  return /*#__PURE__*/React.createElement(ModalsContext.Provider, {
+    value: {
+      modals: modals,
+      container: container,
+      setContainer: setContainer,
+      register: register,
+      unregister: unregister
+    }
+  }, children);
+};
+ModalsProvider.propTypes = propTypes$6;
+ModalsProvider.defaultProps = defaultProps$6;
+
+var PanelsContext = /*#__PURE__*/React.createContext({
+  container: null
+});
+var usePanels = function usePanels() {
+  return useContext(PanelsContext) || {};
+};
+var withPanels = function withPanels(WrappedComponent) {
+  var WithPanelsComponent = function WithPanelsComponent(props) {
+    return /*#__PURE__*/React.createElement(PanelsContext.Consumer, null, function (_ref) {
+      var panels = _ref.panels,
+          setContainer = _ref.setContainer,
+          container = _ref.container,
+          register = _ref.register,
+          unregister = _ref.unregister;
+      return /*#__PURE__*/React.createElement(WrappedComponent, Object.assign({
+        panelsContainer: container,
+        setPanelsContainer: setContainer,
+        panels: panels,
+        registerPanel: register,
+        unregisterPanel: unregister
+      }, props));
+    });
+  };
+
+  WithPanelsComponent.displayName = "WithPanels(".concat(getDisplayName(WrappedComponent), ")");
+  return WithPanelsComponent;
+};
+var propTypes$5 = {
+  children: PropTypes.node.isRequired,
+  container: PropTypes.object // eslint-disable-line
+
+};
+var defaultProps$5 = {
+  container: null
+};
+var PanelsProvider = function PanelsProvider(_ref2) {
+  var children = _ref2.children,
+      initialContainer = _ref2.container;
+
+  var _useState = useState(initialContainer),
+      _useState2 = _slicedToArray(_useState, 2),
+      container = _useState2[0],
+      setContainer = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      panels = _useState4[0],
+      setPanels = _useState4[1];
+
+  var panelsRef = useRef(panels);
+  var register = useCallback(function (id) {
+    var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+    var currentPanels = panelsRef.current;
+    var newPanels = [].concat(_toConsumableArray(currentPanels), [_objectSpread({
+      id: id
+    }, data)]);
+    setPanels(newPanels);
+    panelsRef.current = newPanels;
+  }, [panels, setPanels]);
+  var unregister = useCallback(function (id) {
+    var currentPanels = panelsRef.current;
+    var foundIndex = currentPanels.findIndex(function (_ref3) {
+      var modalId = _ref3.id;
+      return modalId === id;
+    });
+
+    if (foundIndex !== -1) {
+      var newPanels = currentPanels.filter(function (_ref4) {
+        var modalId = _ref4.id;
+        return modalId !== id;
+      });
+      setPanels(newPanels);
+      panelsRef.current = newPanels;
+    }
+  }, [panels, setPanels]);
+  return /*#__PURE__*/React.createElement(PanelsContext.Provider, {
+    value: {
+      panels: panels,
+      setContainer: setContainer,
+      container: container,
+      register: register,
+      unregister: unregister
+    }
+  }, children);
+};
+PanelsProvider.propTypes = propTypes$5;
+PanelsProvider.defaultProps = defaultProps$5;
+
+var _excluded$3 = ["component"];
+var PanneauContext = /*#__PURE__*/React.createContext(null);
+var usePanneau = function usePanneau() {
+  return useContext(PanneauContext);
+};
+var usePanneauResources = function usePanneauResources() {
+  var _ref = usePanneau() || {},
+      _ref$resources = _ref.resources,
+      resources = _ref$resources === void 0 ? [] : _ref$resources;
+
+  return resources;
+};
+var usePanneauResource = function usePanneauResource(id) {
+  var resources = usePanneauResources();
+  return resources.find(function (it) {
+    return it.id === id;
+  }) || null;
+};
+var usePanneauColorScheme = function usePanneauColorScheme() {
+  var _ref2 = usePanneau() || {},
+      _ref2$theme = _ref2.theme,
+      theme = _ref2$theme === void 0 ? {} : _ref2$theme;
+
+  var _ref3 = theme || {},
+      _ref3$colorScheme = _ref3.colorScheme,
+      colorScheme = _ref3$colorScheme === void 0 ? 'light' : _ref3$colorScheme;
+
+  return colorScheme === 'dark' ? {
+    background: 'dark',
+    text: 'light'
+  } : {
+    background: 'light',
+    text: 'dark'
+  };
+};
+var usePanneauComponents = function usePanneauComponents() {
+  var _ref4 = usePanneau() || {},
+      _ref4$components = _ref4.components,
+      components = _ref4$components === void 0 ? {} : _ref4$components;
+
+  return components;
+};
+var usePanneauComponent = function usePanneauComponent(namespace, name) {
+  var _ref5 = usePanneau() || {},
+      _ref5$components = _ref5.components,
+      components = _ref5$components === void 0 ? {} : _ref5$components;
+
+  var path = namespace !== null ? "".concat(namespace, ".").concat(name) : name || null;
+  var component = components[path] || null;
+
+  if (isString(component)) {
+    return component;
+  }
+
+  if (isObject(component) && isString(component === null || component === void 0 ? void 0 : component.componnent)) {
+    // eslint-disable-next-line no-unused-vars
+    component.component;
+        _objectWithoutProperties(component, _excluded$3);
+
+    return component.component;
+  }
+
+  return null;
+};
+var usePanneauAuth = function usePanneauAuth() {
+  var _ref6 = usePanneau() || {},
+      _ref6$auth = _ref6.auth,
+      auth = _ref6$auth === void 0 ? {} : _ref6$auth;
+
+  return auth;
+};
+var usePanneauSettings = function usePanneauSettings() {
+  var _ref7 = usePanneau() || {},
+      _ref7$settings = _ref7.settings,
+      settings = _ref7$settings === void 0 ? {} : _ref7$settings;
+
+  return settings;
+};
+var propTypes$4 = {
+  definition: panneauDefinition.isRequired,
+  children: PropTypes.node.isRequired
+};
+var defaultProps$4 = {};
+var PanneauProvider = function PanneauProvider(_ref8) {
+  var definition = _ref8.definition,
+      children = _ref8.children;
+  return /*#__PURE__*/React.createElement(PanneauContext.Provider, {
+    value: definition
+  }, children);
+};
+PanneauProvider.propTypes = propTypes$4;
+PanneauProvider.defaultProps = defaultProps$4;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var ResourceContext = /*#__PURE__*/React.createContext(null);
+var useResource = function useResource() {
+  return useContext(ResourceContext);
+};
+var propTypes$3 = {
+  resource: resource.isRequired,
+  children: PropTypes.node.isRequired
+};
+var defaultProps$3 = {};
+var ResourceProvider = function ResourceProvider(_ref) {
+  var resource = _ref.resource,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement(ResourceContext.Provider, {
+    value: resource
+  }, children);
+};
+ResourceProvider.propTypes = propTypes$3;
+ResourceProvider.defaultProps = defaultProps$3;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var RoutesContext = /*#__PURE__*/React.createContext(null);
+var useRoutes = function useRoutes() {
+  var _useContext = useContext(RoutesContext),
+      routes = _useContext.routes;
+
+  return routes;
+};
+var useUrlGenerator = function useUrlGenerator() {
+  var _useContext2 = useContext(RoutesContext),
+      routes = _useContext2.routes,
+      basePath = _useContext2.basePath;
+
+  var urlGenerator = useCallback(function (key, data) {
+    var url = generatePath(routes[key], data); // console.log('urlGenerator', basePath, routes[key], url, data);
+
+    return basePath !== null ? "".concat(basePath.replace(/\/$/, ''), "/").concat(url.replace(/^\//, '')) : url;
+  }, [generatePath, routes, basePath]);
+  return urlGenerator;
+};
+var useRoutePush = function useRoutePush() {
+  var url = useUrlGenerator();
+  var navigate = useNavigate();
+  var push = useCallback(function (route, data) {
+    for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+      args[_key - 2] = arguments[_key];
+    }
+
+    if (isString(route)) {
+      var _history;
+
+      (_history = history).push.apply(_history, [url(route, data)].concat(args));
+    } else {
+      var _ref = route || {},
+          _ref$pathname = _ref.pathname,
+          pathname = _ref$pathname === void 0 ? null : _ref$pathname,
+          _ref$search = _ref.search,
+          search = _ref$search === void 0 ? null : _ref$search;
+
+      navigate.apply(void 0, [{
+        pathname: url(pathname, data),
+        search: search
+      }].concat(args));
+    }
+  }, [navigate, url]);
+  return push;
+};
+var useRouteBack = function useRouteBack() {
+  var url = useUrlGenerator();
+  var navigate = useNavigate();
+  var back = useCallback(function () {
+    return navigate(-1);
+  }, [navigate, url]);
+  return back;
+};
+var propTypes$2 = {
+  children: PropTypes.node.isRequired,
+  routes: PropTypes.objectOf(PropTypes.string),
+  // .isRequired,
+  basePath: PropTypes.string
+};
+var defaultProps$2 = {
+  routes: null,
+  basePath: null
+};
+var RoutesProvider = function RoutesProvider(_ref2) {
+  var routes = _ref2.routes,
+      basePath = _ref2.basePath,
+      children = _ref2.children;
+  return /*#__PURE__*/React.createElement(RoutesContext.Provider, {
+    value: {
+      routes: routes,
+      basePath: basePath
+    }
+  }, children);
+};
+RoutesProvider.propTypes = propTypes$2;
+RoutesProvider.defaultProps = defaultProps$2;
+
+/* eslint-disable react/jsx-props-no-spreading */
+var useTracking = function useTracking() {
+  return useContext(TrackingContext);
+};
+var propTypes$1 = {
+  children: PropTypes.node.isRequired,
+  variables: PropTypes$1.trackingVariables
+};
+var defaultProps$1 = {
+  variables: null
+};
+var TrackingProvider = function TrackingProvider(_ref) {
+  var variables = _ref.variables,
+      children = _ref.children;
+  var contextTracking = useTracking() || null;
+  var tracking = useMemo(function () {
+    if (contextTracking !== null) {
+      contextTracking.setVariables(variables);
+      return contextTracking;
+    }
+
+    return new Tracking({
+      variables: variables
+    });
+  }, [contextTracking, variables]);
+  return /*#__PURE__*/React.createElement(TrackingContainer, {
+    tracking: tracking
+  }, children);
+};
+TrackingProvider.propTypes = propTypes$1;
+TrackingProvider.defaultProps = defaultProps$1;
+
+/**
+ * Locale loader
+ */
+
+var packageCache = null;
+
+var useUppyCore = function useUppyCore() {
+  // transport
+  var _useState = useState({
+    "package": packageCache
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      loadedPackage = _useState2[0]["package"],
+      setLoadedPackage = _useState2[1];
+
+  useEffect(function () {
+    var canceled = false;
+
+    if (loadedPackage !== null) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    import('@uppy/core').then(function (_ref) {
+      var Uppy = _ref["default"];
+      packageCache = Uppy;
+
+      if (!canceled) {
+        setLoadedPackage({
+          "package": Uppy
+        });
+      }
+    });
+    return function () {
+      canceled = true;
+    };
+  }, [loadedPackage, setLoadedPackage]);
+  return loadedPackage;
+};
+
+/**
+ * Locale loader
+ */
+
+var packagesCache$2 = {};
+var defaultPackagesMap$2 = {
+  fr: function fr() {
+    return import('@uppy/locales/lib/fr_FR');
+  },
+  en: function en() {
+    return import('@uppy/locales/lib/en_US');
+  }
+};
+
+var useUppyLocale = function useUppyLocale(locale) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      _ref$packagesMap = _ref.packagesMap,
+      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap$2 : _ref$packagesMap;
+
+  var _useState = useState({
+    "package": packagesCache$2[locale] || null
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      loadedPackage = _useState2[0]["package"],
+      setLoadedPackage = _useState2[1];
+
+  var packageLoader = packagesMap[locale] || null;
+  useEffect(function () {
+    var canceled = false;
+
+    if (loadedPackage !== null || packageLoader === null) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    packageLoader().then(function (_ref2) {
+      var dep = _ref2["default"];
+
+      // packagesCache[locale] = dep;
+      if (!canceled) {
+        setLoadedPackage({
+          "package": dep
+        });
+      }
+    });
+    return function () {
+      canceled = true;
+    };
+  }, [packageLoader, loadedPackage, setLoadedPackage]);
+  return loadedPackage;
+};
+
+var _excluded$2 = ["default"];
+/**
+ * Locale loader
+ */
+
+var packagesCache$1 = {};
+var defaultPackagesMap$1 = {
+  webcam: function webcam() {
+    return import('@uppy/webcam');
+  },
+  facebook: function facebook() {
+    return import('@uppy/facebook');
+  },
+  instagram: function instagram() {
+    return import('@uppy/instagram');
+  },
+  dropbox: function dropbox() {
+    return import('@uppy/dropbox');
+  },
+  'google-drive': function googleDrive() {
+    return import('@uppy/google-drive');
+  }
+};
+
+var useUppySources = function useUppySources(sources) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      _ref$packagesMap = _ref.packagesMap,
+      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap$1 : _ref$packagesMap;
+
+  // transport
+  var _useState = useState({
+    packages: sources.reduce(function (map, source) {
+      var sourcePackage = packagesCache$1[source] || null;
+
+      if (sourcePackage === null) {
+        return map;
+      }
+
+      return _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, source, sourcePackage));
+    }, null)
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      loadedPackages = _useState2[0].packages,
+      setLoadedPackages = _useState2[1];
+
+  var sourcesToLoad = useMemo(function () {
+    if (loadedPackages === null) {
+      return sources;
+    }
+
+    var sourcesLoaded = Object.keys(loadedPackages);
+    return sources.filter(function (source) {
+      return sourcesLoaded.indexOf(source) === -1;
+    });
+  }, [sources, loadedPackages]);
+  useEffect(function () {
+    var canceled = false;
+
+    if (sourcesToLoad.length === 0) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    Promise.all(sourcesToLoad.map(function (source) {
+      return packagesMap[source] || null;
+    }).filter(function (it) {
+      return it !== null;
+    }).map(function (promise) {
+      return promise();
+    })).then(function (packagesLoaded) {
+      var newLoadedPackages = sourcesToLoad.reduce(function (map, source, index) {
+        var _packagesLoaded$index = packagesLoaded[index],
+            pack = _packagesLoaded$index["default"],
+            others = _objectWithoutProperties(_packagesLoaded$index, _excluded$2);
+
+        return _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, source, Object.keys(others).reduce(function (otherMap, key) {
+          otherMap[key] = others[key]; // eslint-disable-line no-param-reassign
+
+          return otherMap;
+        }, pack)));
+      }, {});
+      packagesCache$1 = _objectSpread(_objectSpread({}, packagesCache$1), newLoadedPackages);
+
+      if (!canceled) {
+        setLoadedPackages({
+          packages: newLoadedPackages
+        });
+      }
+    });
+    return function () {
+      canceled = true;
+    };
+  }, [sourcesToLoad, packagesMap, loadedPackages, setLoadedPackages]);
+  return sourcesToLoad.length === 0 ? loadedPackages : null;
+};
+
+var _excluded$1 = ["default"];
+/**
+ * Locale loader
+ */
+
+var packagesCache = {};
+var defaultPackagesMap = {
+  transloadit: function transloadit() {
+    return import('@uppy/transloadit');
+  },
+  tus: function tus() {
+    return import('@uppy/tus');
+  },
+  xhr: function xhr() {
+    return import('@uppy/xhr-upload');
+  }
+};
+
+var useUppyTransport = function useUppyTransport(transport) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      _ref$packagesMap = _ref.packagesMap,
+      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap : _ref$packagesMap;
+
+  // transport
+  var _useState = useState({
+    "package": packagesCache[transport] || null
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      loadedPackage = _useState2[0]["package"],
+      setLoadedPackage = _useState2[1];
+
+  var packageLoader = packagesMap[transport] || null;
+  useEffect(function () {
+    var canceled = false;
+
+    if (loadedPackage !== null || packageLoader === null) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    packageLoader().then(function (_ref2) {
+      var pack = _ref2["default"],
+          others = _objectWithoutProperties(_ref2, _excluded$1);
+
+      var dep = Object.keys(others).reduce(function (map, key) {
+        map[key] = others[key]; // eslint-disable-line no-param-reassign
+
+        return map;
+      }, pack);
+      packagesCache[transport] = dep;
+
+      if (!canceled) {
+        setLoadedPackage({
+          "package": dep
+        });
+      }
+    });
+    return function () {
+      canceled = true;
+    };
+  }, [packageLoader, loadedPackage, setLoadedPackage]);
+  return loadedPackage;
+};
+
+var convertToMedia = function convertToMedia(it) {
+  // console.log('upload', it);
+  var type = it.data.type.split('/')[0];
+  var thumbnail = it.transloadit["".concat(type, "_thumbnail")] || null;
+  var original = it.transloadit["".concat(type, "_original")] || null;
+  return {
+    handle: it.id,
+    type: type,
+    name: it.meta.name,
+    mime: it.data.type,
+    size: it.data.size,
+    url: original !== null ? original.ssl_url || original.url : null,
+    thumbnail_url: thumbnail !== null ? thumbnail.ssl_url || thumbnail.url : null,
+    metadata: _objectSpread(_objectSpread(_objectSpread({}, original !== null ? original.meta || null : null), it.meta.user ? {
+      user: it.meta.user
+    } || null : null), {}, {
+      filename: it.meta.filename,
+      transloadit: it.transloadit.results || null
+    })
+  };
+};
+
+var getTransloaditMediasFromResponse = function getTransloaditMediasFromResponse(response) {
+  return response.successful.map(function (it) {
+    var transloadit = response.transloadit.find(function (subIt) {
+      return subIt.assembly_id === it.transloadit.assembly;
+    }) || null;
+    var results = transloadit !== null ? transloadit.results || null : null;
+    return _objectSpread(_objectSpread({}, it), {}, {
+      transloadit: results !== null ? Object.keys(results).reduce(function (map, resultKey) {
+        var result = results[resultKey].find(function (itResult) {
+          return itResult.name === it.name;
+        });
+        return result !== null ? _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, resultKey, result)) : map;
+      }, null) : null
+    });
+  }).filter(function (it) {
+    return it.transloadit !== null;
+  }).map(function (it) {
+    return convertToMedia(it);
+  });
+};
+
+var _excluded = ["sources"],
+    _excluded2 = ["key", "templateId", "waitForEncoding"];
+var UppyContext = /*#__PURE__*/React.createContext(null);
+var useUppy = function useUppy() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref$onComplete = _ref.onComplete,
+      onComplete = _ref$onComplete === void 0 ? null : _ref$onComplete,
+      _ref$onFail = _ref.onFail,
+      onFail = _ref$onFail === void 0 ? null : _ref$onFail,
+      _ref$getFileName = _ref.getFileName,
+      getFileName = _ref$getFileName === void 0 ? function (_ref2) {
+    var _ref2$extension = _ref2.extension,
+        extension = _ref2$extension === void 0 ? null : _ref2$extension;
+    return "".concat(v1()).concat(extension !== null ? ".".concat(extension) : '');
+  } : _ref$getFileName,
+      _ref$meta = _ref.meta,
+      meta = _ref$meta === void 0 ? null : _ref$meta,
+      _ref$allowMultipleUpl = _ref.allowMultipleUploads,
+      allowMultipleUploads = _ref$allowMultipleUpl === void 0 ? false : _ref$allowMultipleUpl,
+      _ref$maxNumberOfFiles = _ref.maxNumberOfFiles,
+      maxNumberOfFiles = _ref$maxNumberOfFiles === void 0 ? 1 : _ref$maxNumberOfFiles,
+      _ref$allowedFileTypes = _ref.allowedFileTypes,
+      allowedFileTypes = _ref$allowedFileTypes === void 0 ? null : _ref$allowedFileTypes,
+      _ref$autoProceed = _ref.autoProceed,
+      autoProceed = _ref$autoProceed === void 0 ? false : _ref$autoProceed,
+      _ref$debug = _ref.debug,
+      debug = _ref$debug === void 0 ? false : _ref$debug;
+
+  var _ref3 = useContext(UppyContext) || null,
+      buildUppy = _ref3.buildUppy,
+      transport = _ref3.transport;
+
+  var uppy = useMemo(function () {
+    return buildUppy !== null ? buildUppy({
+      meta: meta,
+      allowMultipleUploads: allowMultipleUploads,
+      restrictions: {
+        maxNumberOfFiles: maxNumberOfFiles,
+        allowedFileTypes: allowedFileTypes
+      },
+      autoProceed: autoProceed,
+      debug: debug
+    }) : null;
+  }, [buildUppy, meta, allowMultipleUploads, debug, maxNumberOfFiles, allowedFileTypes, autoProceed]);
+  useEffect(function () {
+    if (uppy === null) {
+      return function () {};
+    }
+
+    var onUppyComplete = function onUppyComplete(response) {
+      var _response$successful = response.successful,
+          successful = _response$successful === void 0 ? [] : _response$successful,
+          _response$failed = response.failed,
+          failed = _response$failed === void 0 ? null : _response$failed;
+      var finalSuccessful = transport === 'transloadit' ? getTransloaditMediasFromResponse(response) : successful;
+
+      if (onComplete !== null) {
+        onComplete(finalSuccessful);
+      }
+
+      if (onFail !== null) {
+        onFail(failed);
+      }
+    };
+
+    uppy.on('complete', onUppyComplete);
+    return function () {
+      uppy.off('complete', onUppyComplete);
+    };
+  }, [uppy, transport, onComplete]);
+  useEffect(function () {
+    if (uppy === null) {
+      return function () {};
+    }
+
+    var onUpload = function onUpload(_ref4) {
+      var _ref4$fileIDs = _ref4.fileIDs,
+          ids = _ref4$fileIDs === void 0 ? [] : _ref4$fileIDs;
+      ids.forEach(function (id) {
+        var file = uppy.getFile(id);
+        var newName = getFileName(file);
+
+        if (newName !== null) {
+          uppy.setFileMeta(id, {
+            name: newName
+          });
+        }
+      });
+    };
+
+    uppy.on('upload', onUpload);
+    return function () {
+      uppy.off('upload', onUpload);
+    };
+  }, [uppy]);
+  useEffect(function () {
+    return function () {
+      if (uppy !== null) {
+        uppy.close();
+      }
+    };
+  }, [uppy]);
+  return uppy;
+};
+var propTypes = {
+  id: PropTypes.string,
+  children: PropTypes.node.isRequired,
+  transport: PropTypes.oneOf(['xhr', 'transloadit', 'tus']),
+  locale: PropTypes.string,
+  sources: PropTypes.arrayOf(PropTypes.oneOf(['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'])),
+  transloadit: PropTypes.shape({
+    key: PropTypes.string.isRequired,
+    templateId: PropTypes.string,
+    waitForEncoding: PropTypes.bool
+  }),
+  companion: PropTypes.shape({
+    url: PropTypes.string.isRequired,
+    allowedHosts: PropTypes.string.isRequired
+  }),
+  tus: PropTypes.oneOfType([PropTypes.string, PropTypes.shape({
+    endpoint: PropTypes.string.isRequired
+  })]),
+  xhr: PropTypes.oneOfType([PropTypes.string, PropTypes.shape({
+    endpoint: PropTypes.string.isRequired
+  })])
+};
+var defaultProps = {
+  id: 'uppy',
+  transport: null,
+  locale: null,
+  sources: null,
+  transloadit: null,
+  companion: null,
+  tus: null,
+  xhr: null
+};
+var UppyProvider = function UppyProvider(_ref5) {
+  var id = _ref5.id,
+      children = _ref5.children,
+      providedTransport = _ref5.transport,
+      providedLocale = _ref5.locale,
+      providedSources = _ref5.sources,
+      providedTransloadit = _ref5.transloadit,
+      providedCompanion = _ref5.companion,
+      providedTus = _ref5.tus,
+      providedXhr = _ref5.xhr;
+
+  var _useIntl = useIntl(),
+      intlLocale = _useIntl.locale;
+
+  var _ref6 = useContext(UppyContext) || {},
+      _ref6$transport = _ref6.transport,
+      contextTransport = _ref6$transport === void 0 ? null : _ref6$transport,
+      _ref6$locale = _ref6.locale,
+      contextLocale = _ref6$locale === void 0 ? null : _ref6$locale,
+      _ref6$sources = _ref6.sources,
+      contextSources = _ref6$sources === void 0 ? null : _ref6$sources,
+      _ref6$transloadit = _ref6.transloadit,
+      contextTransloadit = _ref6$transloadit === void 0 ? null : _ref6$transloadit,
+      _ref6$companion = _ref6.companion,
+      contextCompanion = _ref6$companion === void 0 ? null : _ref6$companion,
+      _ref6$tus = _ref6.tus,
+      contextTus = _ref6$tus === void 0 ? null : _ref6$tus,
+      _ref6$xhr = _ref6.xhr,
+      contextXhr = _ref6$xhr === void 0 ? null : _ref6$xhr;
+
+  var transport = providedTransport || contextTransport || 'xhr';
+  var locale = providedLocale || contextLocale || intlLocale;
+  var sources = providedSources || contextSources || ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'];
+  var transloadit = providedTransloadit || contextTransloadit;
+  var companion = providedCompanion || contextCompanion;
+  var tus = providedTus || contextTus;
+  var xhr = providedXhr || contextXhr;
+  var Uppy = useUppyCore();
+  var uppyTransport = useUppyTransport(transport);
+  var uppySources = useUppySources(sources);
+  var uppyLocale = useUppyLocale(locale || intlLocale);
+  var buildUppy = useMemo(function () {
+    if (Uppy === null || uppyLocale === null || uppyTransport === null || uppySources === null) {
+      return null;
+    }
+
+    return function () {
+      var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+      var _ref7 = opts || {},
+          _ref7$sources = _ref7.sources,
+          customSources = _ref7$sources === void 0 ? sources : _ref7$sources,
+          uppyOpts = _objectWithoutProperties(_ref7, _excluded);
+
+      var newUppy = new Uppy(_objectSpread({
+        id: id,
+        locale: uppyLocale
+      }, uppyOpts));
+
+      if (transport === 'transloadit') {
+        var key = transloadit.key,
+            templateId = transloadit.templateId,
+            _transloadit$waitForE = transloadit.waitForEncoding,
+            waitForEncoding = _transloadit$waitForE === void 0 ? true : _transloadit$waitForE,
+            transloaditOpts = _objectWithoutProperties(transloadit, _excluded2);
+
+        newUppy.use(uppyTransport, {
+          params: _objectSpread({
+            auth: {
+              key: key
+            },
+            template_id: templateId
+          }, transloaditOpts),
+          waitForEncoding: waitForEncoding
+        });
+      } else if (transport === 'tus') {
+        newUppy.use(uppyTransport, _objectSpread({
+          endpoint: '/tus',
+          resume: true,
+          retryDelays: [0, 1000, 3000, 5000]
+        }, tus));
+      } else if (transport === 'xhr') {
+        newUppy.use(uppyTransport, _objectSpread({
+          endpoint: isString(xhr) ? xhr : '/upload'
+        }, isObject(xhr) ? xhr : null));
+      }
+
+      if (transport === 'transloadit' || companion !== null) {
+        return customSources.reduce(function (currentUppy, sourceId) {
+          var source = uppySources[sourceId] || null;
+
+          if (source === null) {
+            return currentUppy;
+          }
+
+          var _ref8 = companion || {
+            url: uppyTransport.COMPANION || null,
+            allowedHosts: uppyTransport.COMPANION_PATTERN || null
+          },
+              companionUrl = _ref8.url,
+              companionAllowedHosts = _ref8.allowedHosts;
+
+          return newUppy.use(source, {
+            id: sourceId,
+            companionUrl: companionUrl,
+            companionAllowedHosts: companionAllowedHosts
+          });
+        }, newUppy);
+      }
+
+      return newUppy;
+    };
+  }, [id, Uppy, uppyLocale, uppyTransport, uppySources, transport, sources, transloadit, companion, tus, xhr]);
+  var value = useMemo(function () {
+    return {
+      id: id,
+      transport: transport,
+      locale: locale,
+      sources: sources,
+      transloadit: transloadit,
+      companion: companion,
+      tus: tus,
+      xhr: xhr,
+      Uppy: Uppy,
+      uppyTransport: uppyTransport,
+      uppySources: uppySources,
+      uppyLocale: uppyLocale,
+      buildUppy: buildUppy
+    };
+  }, [id, transport, locale, sources, transloadit, companion, tus, xhr, Uppy, uppyTransport, uppySources, uppyLocale, buildUppy]);
+  return /*#__PURE__*/React.createElement(UppyContext.Provider, {
+    value: value
+  }, children);
+};
+UppyProvider.propTypes = propTypes;
+UppyProvider.defaultProps = defaultProps;
+
+export { APP_NAMESPACE, ComponentsContext, ComponentsProvider, DISPLAYS_NAMESPACE, DefinitionProvider, FIELDS_NAMESPACE, FILTERS_NAMESPACE, FORMS_NAMESPACE, FieldsContext, FieldsProvider, FontsContext, FontsProvider, FormProvider, GoogleApiClientContext, GoogleApiClientProvider, GoogleKeysContext, GoogleKeysProvider, GoogleMapsClientContext, GoogleMapsClientProvider, LISTS_NAMESPACE, LocalesContext, LocalesProvider, MODALS_NAMESPACE, ModalsContext, ModalsProvider, PanelsContext, PanelsProvider, PanneauProvider, ResourceProvider, RoutesContext, RoutesProvider, TrackingProvider, UppyContext, UppyProvider, useAppComponent, useAppComponents, useAppComponentsManager, useComponent, useComponents, useComponentsManager, useDefinition, useDefinitionContext, useDisplayComponent, useDisplaysComponents, useDisplaysComponentsManager, useField, useFieldComponent, useFields, useFieldsComponents, useFieldsComponentsManager, useFieldsManager, useFilterComponent, useFiltersComponents, useFiltersComponentsManager, useFonts, useForm, useFormComponent, useFormSetValue, useFormValue, useFormsComponents, useFormsComponentsManager, useGoogleApiClient, useGoogleFonts, useGoogleKeys, useGoogleMapsClient, useListComponent, useListsComponents, useListsComponentsManager, useLocales, useModalComponent, useModals, useModalsComponents, useModalsComponentsManager, useOtherLocales, usePanels, usePanneau, usePanneauAuth, usePanneauColorScheme, usePanneauComponent, usePanneauComponents, usePanneauResource, usePanneauResources, usePanneauSettings, useResource, useRouteBack, useRoutePush, useRoutes, useTracking, useUppy, useUrlGenerator, withGoogleApiClient, withGoogleMapsClient, withModals, withPanels };