@uncinc/uncinc-react-kitchen-sink 2.4.0 → 2.4.2

package/dist/config/constants.js

@@ -1,24 +1,44 @@
-export const APP_ENV = process.env.REACT_APP_ENV;
-export const __DEBUG__ = APP_ENV !== 'production';
-export const DEFAULT_LANGUAGE = 'nl';
-export const SITE_NAME = 'Unc Inc';
-export const MAPBOX_API_TOKEN = 'pk.eyJ1IjoidW5jaW5jYnYiLCJhIjoiY2pxeHhxd2FlMDMyeTQzbWp1a3hleHRscCJ9.QMfmlryTLEyrSyjU7FfBiw';
-let API_URL = 'https://content.uncinc.nl';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.__DEBUG__ = exports.VIEW_ACTION_REPLACE = exports.VIEW_ACTION_APPEND = exports.SITE_NAME = exports.SCREEN_WIDE = exports.SCREEN_TABLET = exports.SCREEN_NORMAL = exports.SCREEN_MOBILE = exports.SCREEN_HUGE = exports.MAPBOX_API_TOKEN = exports.IS_SERVER = exports.IS_CLIENT = exports.DEFAULT_LANGUAGE = exports.APP_ENV = exports.API_URL = void 0;
+var APP_ENV = process.env.REACT_APP_ENV;
+exports.APP_ENV = APP_ENV;
+var __DEBUG__ = APP_ENV !== 'production';
+exports.__DEBUG__ = __DEBUG__;
+var DEFAULT_LANGUAGE = 'nl';
+exports.DEFAULT_LANGUAGE = DEFAULT_LANGUAGE;
+var SITE_NAME = 'Unc Inc';
+exports.SITE_NAME = SITE_NAME;
+var MAPBOX_API_TOKEN = 'pk.eyJ1IjoidW5jaW5jYnYiLCJhIjoiY2pxeHhxd2FlMDMyeTQzbWp1a3hleHRscCJ9.QMfmlryTLEyrSyjU7FfBiw';
+exports.MAPBOX_API_TOKEN = MAPBOX_API_TOKEN;
+var API_URL = 'https://content.uncinc.nl';
+exports.API_URL = API_URL;
 if (APP_ENV === 'development') {
-  API_URL = 'http://uncinc.docker.localhost';
+  exports.API_URL = API_URL = 'http://uncinc.docker.localhost';
 } else if (APP_ENV === 'staging') {
-  API_URL = 'https://staging.uncinc.nl';
+  exports.API_URL = API_URL = 'https://staging.uncinc.nl';
 }
-export const IS_SERVER = !(typeof window !== 'undefined' && window.document && window.document.createElement);
-export const IS_CLIENT = !IS_SERVER;
+var IS_SERVER = !(typeof window !== 'undefined' && window.document && window.document.createElement);
+exports.IS_SERVER = IS_SERVER;
+var IS_CLIENT = !IS_SERVER;
 
 // The value is where the breakpoint starts (mobile-first).
 // These values are taken from '/src/shared/styles/assets/_variables.scss'.
-export const SCREEN_MOBILE = 0;
-export const SCREEN_TABLET = 768;
-export const SCREEN_NORMAL = 992;
-export const SCREEN_WIDE = 1240;
-export const SCREEN_HUGE = 2000;
-export const VIEW_ACTION_REPLACE = 'replace';
-export const VIEW_ACTION_APPEND = 'append';
-export { API_URL };
+exports.IS_CLIENT = IS_CLIENT;
+var SCREEN_MOBILE = 0;
+exports.SCREEN_MOBILE = SCREEN_MOBILE;
+var SCREEN_TABLET = 768;
+exports.SCREEN_TABLET = SCREEN_TABLET;
+var SCREEN_NORMAL = 992;
+exports.SCREEN_NORMAL = SCREEN_NORMAL;
+var SCREEN_WIDE = 1240;
+exports.SCREEN_WIDE = SCREEN_WIDE;
+var SCREEN_HUGE = 2000;
+exports.SCREEN_HUGE = SCREEN_HUGE;
+var VIEW_ACTION_REPLACE = 'replace';
+exports.VIEW_ACTION_REPLACE = VIEW_ACTION_REPLACE;
+var VIEW_ACTION_APPEND = 'append';
+exports.VIEW_ACTION_APPEND = VIEW_ACTION_APPEND;

package/dist/config/i18next/index.js

@@ -1,18 +1,25 @@
-import i18n from 'i18next';
-import LanguageDetector from 'i18next-browser-languagedetector';
-import { initReactI18next } from 'react-i18next';
-import NL from './locales/nl.json';
-import EN from './locales/en.json';
-const resources = {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _i18next = _interopRequireDefault(require("i18next"));
+var _i18nextBrowserLanguagedetector = _interopRequireDefault(require("i18next-browser-languagedetector"));
+var _reactI18next = require("react-i18next");
+var _nl = _interopRequireDefault(require("./locales/nl.json"));
+var _en = _interopRequireDefault(require("./locales/en.json"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var resources = {
   nl: {
-    translation: NL
+    translation: _nl.default
   },
   en: {
-    translation: EN
+    translation: _en.default
   }
 };
-i18n.use(LanguageDetector).use(initReactI18next).init({
-  resources,
+_i18next.default.use(_i18nextBrowserLanguagedetector.default).use(_reactI18next.initReactI18next).init({
+  resources: resources,
   lng: 'nl',
   fallbackLng: 'nl',
   debug: true,
@@ -20,4 +27,5 @@ i18n.use(LanguageDetector).use(initReactI18next).init({
     escapeValue: false
   }
 });
-export default i18n;
+var _default = _i18next.default;
+exports.default = _default;

package/dist/helpers/date.js

@@ -1,8 +1,28 @@
-export const parseDateWithTimezoneOffset = date => {
-  const offset = date.getTimezoneOffset();
-  const dateWithTimezoneOffset = new Date(date.getTime() - offset * 60 * 1000);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.parseDateWithTimezoneOffset = exports.isValidDate = exports.doubleDigits = void 0;
+var parseDateWithTimezoneOffset = function parseDateWithTimezoneOffset(date) {
+  var offset = date.getTimezoneOffset();
+  var dateWithTimezoneOffset = new Date(date.getTime() - offset * 60 * 1000);
   return dateWithTimezoneOffset.toISOString();
 };
-export const isValidDate = date => {
+exports.parseDateWithTimezoneOffset = parseDateWithTimezoneOffset;
+var isValidDate = function isValidDate(date) {
   return date instanceof Date && !Number.isNaN(date);
-};
+};
+
+/**
+ * Make a time string double digit. So make 9 in to 09.
+ *
+ * @param {int} number - The number.
+ *
+ * @returns {int} The double digit number.
+ */
+exports.isValidDate = isValidDate;
+var doubleDigits = function doubleDigits(number) {
+  return "0".concat(number).slice(-2);
+};
+exports.doubleDigits = doubleDigits;

package/dist/helpers/gtm.js

@@ -1,5 +1,11 @@
-import { IS_CLIENT, __DEBUG__ } from '../config/constants';
-const gtm = {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _constants = require("../config/constants");
+var gtm = {
   // Track wether events are binded already or not.
   hasEventsAttached: false,
   // If GTM is not loaded we will push all events to this variable. Once GTM is
@@ -21,7 +27,7 @@ const gtm = {
  * @return {bool}
  *   A boolean wether the GTM is loaded or not.
  */
-gtm.loaded = () => {
+gtm.loaded = function () {
   return typeof window.google_tag_manager !== 'undefined';
 };
 
@@ -37,12 +43,15 @@ gtm.loaded = () => {
  *   The callback of the function being registered.
  * @return {void}
  */
-gtm.register = (fn, callback) => {
-  gtm[fn] = (...args) => {
-    if (__DEBUG__) {
-      console.info(`GTM Event: ${fn}() with args`, args);
+gtm.register = function (fn, callback) {
+  gtm[fn] = function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    if (_constants.__DEBUG__) {
+      console.info("GTM Event: ".concat(fn, "() with args"), args);
     }
-    callback(...args);
+    callback.apply(void 0, args);
   };
 };
 
@@ -56,7 +65,7 @@ gtm.register = (fn, callback) => {
  * @return {array|bool}
  *   An array containing the new dataLayer result or `false`.
  */
-gtm.push = data => {
+gtm.push = function (data) {
   if (gtm.loaded()) {
     return window.dataLayer.push(data);
   } else {
@@ -72,10 +81,10 @@ gtm.push = data => {
  *   Attach event listeners related to GTM.
  * @return {void}
  */
-gtm.attachEventListeners = () => {
-  if (IS_CLIENT && !gtm.hasEventsAttached) {
-    window.addEventListener('GTM-Loaded', () => {
-      for (let i = 0, len = gtm.tempDataLayer.length; i < len; i++) {
+gtm.attachEventListeners = function () {
+  if (_constants.IS_CLIENT && !gtm.hasEventsAttached) {
+    window.addEventListener('GTM-Loaded', function () {
+      for (var i = 0, len = gtm.tempDataLayer.length; i < len; i++) {
         window.dataLayer.push(gtm.tempDataLayer[i]);
       }
       gtm.tempDataLayer = [];
@@ -89,7 +98,7 @@ gtm.attachEventListeners = () => {
 // Register our wrapper functions. We will use these throughout the app.
 //
 // -----------------------------------------------------------------------------
-gtm.register('trackPage', url => {
+gtm.register('trackPage', function (url) {
   if (url) {
     gtm.push({
       event: 'Track page',
@@ -97,7 +106,7 @@ gtm.register('trackPage', url => {
     });
   }
 });
-gtm.register('trackUserEvent', (category, action, label, value) => {
+gtm.register('trackUserEvent', function (category, action, label, value) {
   gtm.push({
     event: 'Track user event',
     eventCategory: category,
@@ -106,7 +115,7 @@ gtm.register('trackUserEvent', (category, action, label, value) => {
     eventValue: value
   });
 });
-gtm.register('loadConsentRequiredTags', () => {
+gtm.register('loadConsentRequiredTags', function () {
   gtm.push({
     event: 'Cookie consent: load tags on consent'
   });
@@ -114,4 +123,5 @@ gtm.register('loadConsentRequiredTags', () => {
 
 // Initialize GTM.
 gtm.attachEventListeners();
-export default gtm;
+var _default = gtm;
+exports.default = _default;

package/dist/helpers/link.js

@@ -1,15 +1,24 @@
-import config from 'react-global-configuration';
-export function isExternalLink(uri = '') {
-  const value = uri.trim().replace(/\/$/, '');
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isExternalLink = isExternalLink;
+exports.normalizeLink = normalizeLink;
+var _reactGlobalConfiguration = _interopRequireDefault(require("react-global-configuration"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function isExternalLink() {
+  var uri = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  var value = uri.trim().replace(/\/$/, '');
   if (/^(https?|mailto|tel):/g.test(value)) {
     return true;
   }
   return false;
 }
-export function normalizeLink(link) {
-  const API_URL = config.get('API_URL');
+function normalizeLink(link) {
+  var API_URL = _reactGlobalConfiguration.default.get('API_URL');
   if (/^\//g.test(link)) {
-    return `${API_URL}${link}`;
+    return "".concat(API_URL).concat(link);
   }
   return link;
 }

package/dist/helpers/useValueForCurrentViewPort.js

@@ -1,13 +1,28 @@
-import { useState, useEffect, useContext } from 'react';
-import ViewportContext from '../Context/ViewportContext';
-export default function useValueForCurrentViewPort(val1, val2, val3, val4, val5) {
-  const viewportContext = useContext(ViewportContext);
-  const [ValueForCurrentViewPort, setValueForCurrentViewPort] = useState(val1);
-  useEffect(() => {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useValueForCurrentViewPort;
+var _react = require("react");
+var _ViewportContext = _interopRequireDefault(require("../Context/ViewportContext"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function useValueForCurrentViewPort(val1, val2, val3, val4, val5) {
+  var viewportContext = (0, _react.useContext)(_ViewportContext.default);
+  var _useState = (0, _react.useState)(val1),
+    _useState2 = _slicedToArray(_useState, 2),
+    ValueForCurrentViewPort = _useState2[0],
+    setValueForCurrentViewPort = _useState2[1];
+  (0, _react.useEffect)(function () {
     function handleResize() {
-      const {
-        innerWidth: width
-      } = window;
+      var _window = window,
+        width = _window.innerWidth;
 
       // 0 & 768
       if (width >= viewportContext.screenSizes.SCREEN_MOBILE && width <= viewportContext.screenSizes.SCREEN_TABLET) {
@@ -38,7 +53,9 @@ export default function useValueForCurrentViewPort(val1, val2, val3, val4, val5)
     }
     window.addEventListener('resize', handleResize);
     handleResize();
-    return () => window.removeEventListener('resize', handleResize);
+    return function () {
+      return window.removeEventListener('resize', handleResize);
+    };
   }, [viewportContext, val1, val2, val3, val4, val5]);
   return ValueForCurrentViewPort;
 }

package/dist/hooks/useBoolean.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export default function useBoolean(defaultValue?: boolean): {
+    readonly value: boolean;
+    readonly setValue: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    readonly setTrue: () => void;
+    readonly setFalse: () => void;
+    readonly toggle: () => void;
+};

package/dist/hooks/useBoolean.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useBoolean;
+var _react = require("react");
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function useBoolean() {
+  var defaultValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  var _useState = (0, _react.useState)(defaultValue),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var toggle = (0, _react.useCallback)(function () {
+    setValue(function (current) {
+      return !current;
+    });
+  }, [setValue]);
+  var setTrue = (0, _react.useCallback)(function () {
+    setValue(true);
+  }, []);
+  var setFalse = (0, _react.useCallback)(function () {
+    setValue(false);
+  }, []);
+  return {
+    value: value,
+    setValue: setValue,
+    setTrue: setTrue,
+    setFalse: setFalse,
+    toggle: toggle
+  };
+}

package/dist/hooks/useClickOutside.d.ts

@@ -0,0 +1,8 @@
+import { MutableRefObject } from 'react';
+interface UseClickOutsideOptions {
+    refs: MutableRefObject<HTMLElement>[] | MutableRefObject<HTMLElement>;
+    unless?: boolean | ((e: globalThis.MouseEvent) => boolean);
+    onClick: (e: globalThis.MouseEvent) => void;
+}
+export default function useClickOutside({ refs, unless, onClick, }: UseClickOutsideOptions): void;
+export {};

package/dist/hooks/useClickOutside.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useClickOutside;
+var _react = require("react");
+function useClickOutside(_ref) {
+  var refs = _ref.refs,
+    _ref$unless = _ref.unless,
+    unless = _ref$unless === void 0 ? false : _ref$unless,
+    onClick = _ref.onClick;
+  var refsAsArray = Array.isArray(refs) ? refs : [refs];
+  (0, _react.useEffect)(function () {
+    function handleOutsideClick(e) {
+      var allRefsHaveCurrent = refsAsArray.every(function (ref) {
+        return !!ref.current;
+      });
+      var shouldNotExecute = typeof unless === 'function' ? unless(e) : unless;
+      if (!allRefsHaveCurrent || shouldNotExecute) {
+        return;
+      }
+      var isOutsideClick = refsAsArray.every(function (ref) {
+        return !ref.current.contains(e.target);
+      });
+      if (isOutsideClick) {
+        onClick(e);
+      }
+    }
+    document.addEventListener('mousedown', handleOutsideClick);
+    return function () {
+      document.removeEventListener('mousedown', handleOutsideClick);
+    };
+  }, [unless, onClick, refs]);
+}

package/dist/hooks/useDialog.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export default function useDialog(): {
+    readonly dialogIsOpen: boolean;
+    readonly openDialog: () => void;
+    readonly closeDialog: () => void;
+    readonly DialogComponent: ({ children, ...props }: {
+        [x: string]: any;
+        children: any;
+    }) => React.FunctionComponentElement<any>;
+};

package/dist/hooks/useDialog.js

@@ -0,0 +1,39 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useDialog;
+var _react = _interopRequireDefault(require("react"));
+var _Dialog = _interopRequireDefault(require("../components/Dialog"));
+var _useBoolean2 = _interopRequireDefault(require("./useBoolean"));
+var _excluded = ["children"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function useDialog() {
+  var _useBoolean = (0, _useBoolean2.default)(),
+    dialogIsOpen = _useBoolean.value,
+    openDialog = _useBoolean.setTrue,
+    closeDialog = _useBoolean.setFalse;
+  var DialogComponent = function DialogComponent(_ref) {
+    var children = _ref.children,
+      props = _objectWithoutProperties(_ref, _excluded);
+    return /*#__PURE__*/_react.default.createElement(_Dialog.default, _objectSpread(_objectSpread({}, props), {}, {
+      isOpen: dialogIsOpen,
+      closeFunction: closeDialog
+    }), children);
+  };
+  return {
+    dialogIsOpen: dialogIsOpen,
+    openDialog: openDialog,
+    closeDialog: closeDialog,
+    DialogComponent: DialogComponent
+  };
+}

package/dist/hooks/useDialogHelpers.d.ts

@@ -0,0 +1,20 @@
+import { MutableRefObject } from 'react';
+export interface UseDialogHelpersOptions<T extends HTMLElement> {
+    id?: string;
+    wrapperElement: MutableRefObject<T>;
+    closeFunction: () => void;
+    isOpen: boolean;
+}
+/**
+ * Hook to allow you to implement your own Dialog component.
+ * This takes care of focus, and closing the Dialog by
+ * click outside it, or hitting Escape.
+ */
+export default function useDialogHelpers<T extends HTMLElement>(options: UseDialogHelpersOptions<T>): {
+    readonly id: any;
+    readonly labelId: string;
+    readonly dialogHelpersProps: {
+        'aria-role': string;
+        'aria-labelledby': string;
+    };
+};

package/dist/hooks/{useDialogHelpers.ts → useDialogHelpers.js}

@@ -1,76 +1,68 @@
-import { useEffect, MutableRefObject } from 'react';
-import { v4 as uuidv4 } from 'uuid';
-
-import useClickOutside from './useClickOutside';
-import useEscape from './useEscape';
-import useTrapFocus from './useTrapFocus';
-
-export interface UseDialogHelpersOptions<T extends HTMLElement> {
-  id?: string;
-  wrapperElement: MutableRefObject<T>;
-  closeFunction: () => void;
-  isOpen: boolean;
-}
+"use strict";
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useDialogHelpers;
+var _react = require("react");
+var _uuid = require("uuid");
+var _useClickOutside = _interopRequireDefault(require("./useClickOutside"));
+var _useEscape = _interopRequireDefault(require("./useEscape"));
+var _useTrapFocus = _interopRequireDefault(require("./useTrapFocus"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Hook to allow you to implement your own Dialog component.
  * This takes care of focus, and closing the Dialog by
  * click outside it, or hitting Escape.
  */
-export default function useDialogHelpers<T extends HTMLElement>(
-  options: UseDialogHelpersOptions<T>,
-) {
-  const {
-    id = uuidv4(),
-    wrapperElement,
-    closeFunction,
-    isOpen,
-  } = options;
+function useDialogHelpers(options) {
+  var _options$id = options.id,
+    id = _options$id === void 0 ? (0, _uuid.v4)() : _options$id,
+    wrapperElement = options.wrapperElement,
+    closeFunction = options.closeFunction,
+    isOpen = options.isOpen;
 
   /**
    * Close the Dialog by pressing Escape.
    */
-  useClickOutside({
+  (0, _useClickOutside.default)({
     refs: [wrapperElement],
-    onClick: closeFunction,
+    onClick: closeFunction
   });
 
   /**
    * Close the Dialog by pressing Escape.
    */
-  useEscape({
-    onPress: closeFunction,
+  (0, _useEscape.default)({
+    onPress: closeFunction
   });
 
   /**
    * Make sure focus does not leave the Dialog while it's open.
    */
-  useTrapFocus({
+  (0, _useTrapFocus.default)({
     ref: wrapperElement,
-    isActive: isOpen,
+    isActive: isOpen
   });
 
   /**
    * Sets focus on the popup so that screen readers announce
    * that the user is currently on a dialog.
    */
-  useEffect(() => {
+  (0, _react.useEffect)(function () {
     if (isOpen && wrapperElement.current) {
       wrapperElement.current.setAttribute('tabindex', '-1');
       wrapperElement.current.focus();
     }
-
     function removeFocusProperties() {
       if (wrapperElement.current) {
         wrapperElement.current.removeAttribute('tabindex');
       }
     }
-
     if (wrapperElement.current) {
       wrapperElement.current.addEventListener('blur', removeFocusProperties);
     }
-
-    return () => {
+    return function () {
       if (wrapperElement.current) {
         wrapperElement.current.removeEventListener('blur', removeFocusProperties);
       }
@@ -80,16 +72,14 @@ export default function useDialogHelpers<T extends HTMLElement>(
   /**
    * Create a labelId for A11Y
    */
-  const labelId = `${id}-label`;
-
-  const dialogHelpersProps = {
+  var labelId = "".concat(id, "-label");
+  var dialogHelpersProps = {
     'aria-role': 'dialog',
-    'aria-labelledby': labelId,
+    'aria-labelledby': labelId
   };
-
   return {
-    id,
-    labelId,
-    dialogHelpersProps,
-  } as const;
-}
+    id: id,
+    labelId: labelId,
+    dialogHelpersProps: dialogHelpersProps
+  };
+}

package/dist/hooks/useEscape.d.ts

@@ -0,0 +1,6 @@
+interface UseEscapeOption {
+    unless?: boolean | ((e: KeyboardEvent) => boolean);
+    onPress: (e: KeyboardEvent) => void;
+}
+export default function useEscape({ unless, onPress }: UseEscapeOption): void;
+export {};

package/dist/hooks/useEscape.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useEscape;
+var _react = require("react");
+function useEscape(_ref) {
+  var unless = _ref.unless,
+    onPress = _ref.onPress;
+  (0, _react.useEffect)(function () {
+    function handleOnPress(e) {
+      var shouldNotExecute = typeof unless === 'function' ? unless(e) : unless;
+      if (shouldNotExecute || e.key !== 'Escape') {
+        return;
+      }
+      onPress(e);
+    }
+    document.addEventListener('keyup', handleOnPress);
+    return function () {
+      document.removeEventListener('keyup', handleOnPress);
+    };
+  }, [unless]);
+}