@uncinc/uncinc-react-kitchen-sink 2.3.6 → 2.4.1

package/dist/components/index.js

@@ -1,15 +1,111 @@
-export { default as Button } from './Button';
-export { default as WysiwygField } from './WysiwygField';
-export { default as FormikWrapper } from './Form/FormikWrapper';
-export { default as FormCheckbox } from './Form/Checkbox';
-export { default as FormCheckboxes } from './Form/Checkboxes';
-export { default as FormDate } from './Form/Date';
-export { default as FormDatePicker } from './Form/DatePicker';
-export { default as FormDateSelect } from './Form/DateSelect';
-export { default as FormEmail } from './Form/Email';
-export { default as FormNumber } from './Form/Number';
-export { default as FormRadioButtons } from './Form/RadioButtons';
-export { default as FormSearchField } from './Form/SearchField';
-export { default as FormSelect } from './Form/Select';
-export { default as FormTextarea } from './Form/Textarea';
-export { default as FormTextField } from './Form/TextField';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Button", {
+  enumerable: true,
+  get: function get() {
+    return _Button.default;
+  }
+});
+Object.defineProperty(exports, "FormCheckbox", {
+  enumerable: true,
+  get: function get() {
+    return _Checkbox.default;
+  }
+});
+Object.defineProperty(exports, "FormCheckboxes", {
+  enumerable: true,
+  get: function get() {
+    return _Checkboxes.default;
+  }
+});
+Object.defineProperty(exports, "FormDate", {
+  enumerable: true,
+  get: function get() {
+    return _Date.default;
+  }
+});
+Object.defineProperty(exports, "FormDatePicker", {
+  enumerable: true,
+  get: function get() {
+    return _DatePicker.default;
+  }
+});
+Object.defineProperty(exports, "FormDateSelect", {
+  enumerable: true,
+  get: function get() {
+    return _DateSelect.default;
+  }
+});
+Object.defineProperty(exports, "FormEmail", {
+  enumerable: true,
+  get: function get() {
+    return _Email.default;
+  }
+});
+Object.defineProperty(exports, "FormNumber", {
+  enumerable: true,
+  get: function get() {
+    return _Number.default;
+  }
+});
+Object.defineProperty(exports, "FormRadioButtons", {
+  enumerable: true,
+  get: function get() {
+    return _RadioButtons.default;
+  }
+});
+Object.defineProperty(exports, "FormSearchField", {
+  enumerable: true,
+  get: function get() {
+    return _SearchField.default;
+  }
+});
+Object.defineProperty(exports, "FormSelect", {
+  enumerable: true,
+  get: function get() {
+    return _Select.default;
+  }
+});
+Object.defineProperty(exports, "FormTextField", {
+  enumerable: true,
+  get: function get() {
+    return _TextField.default;
+  }
+});
+Object.defineProperty(exports, "FormTextarea", {
+  enumerable: true,
+  get: function get() {
+    return _Textarea.default;
+  }
+});
+Object.defineProperty(exports, "FormikWrapper", {
+  enumerable: true,
+  get: function get() {
+    return _FormikWrapper.default;
+  }
+});
+Object.defineProperty(exports, "WysiwygField", {
+  enumerable: true,
+  get: function get() {
+    return _WysiwygField.default;
+  }
+});
+var _Button = _interopRequireDefault(require("./Button"));
+var _WysiwygField = _interopRequireDefault(require("./WysiwygField"));
+var _FormikWrapper = _interopRequireDefault(require("./Form/FormikWrapper"));
+var _Checkbox = _interopRequireDefault(require("./Form/Checkbox"));
+var _Checkboxes = _interopRequireDefault(require("./Form/Checkboxes"));
+var _Date = _interopRequireDefault(require("./Form/Date"));
+var _DatePicker = _interopRequireDefault(require("./Form/DatePicker"));
+var _DateSelect = _interopRequireDefault(require("./Form/DateSelect"));
+var _Email = _interopRequireDefault(require("./Form/Email"));
+var _Number = _interopRequireDefault(require("./Form/Number"));
+var _RadioButtons = _interopRequireDefault(require("./Form/RadioButtons"));
+var _SearchField = _interopRequireDefault(require("./Form/SearchField"));
+var _Select = _interopRequireDefault(require("./Form/Select"));
+var _Textarea = _interopRequireDefault(require("./Form/Textarea"));
+var _TextField = _interopRequireDefault(require("./Form/TextField"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

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/config/i18next/locales/en.json

@@ -1,4 +1,8 @@
 {
+  "general": {
+    "open": "Open",
+    "close": "Close"
+  },
   "dateselect": {
     "months": {
       "jan": "January",

package/dist/config/i18next/locales/nl.json

@@ -1,4 +1,8 @@
 {
+  "general": {
+    "open": "Openen",
+    "close": "Sluiten"
+  },
   "dateselect" : {
     "months": {
       "jan": "Januari",
@@ -18,5 +22,8 @@
   "form": {
     "required": "vereist",
     "optional": "optioneel"
+  },
+  "searchkit": {
+    "reset_search": "Zoeken opnieuw instellen"
   }
 }

package/dist/helpers/date.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.parseDateWithTimezoneOffset = exports.isValidDate = void 0;
+var parseDateWithTimezoneOffset = function parseDateWithTimezoneOffset(date) {
+  var offset = date.getTimezoneOffset();
+  var dateWithTimezoneOffset = new Date(date.getTime() - offset * 60 * 1000);
+  return dateWithTimezoneOffset.toISOString();
+};
+exports.parseDateWithTimezoneOffset = parseDateWithTimezoneOffset;
+var isValidDate = function isValidDate(date) {
+  return date instanceof Date && !Number.isNaN(date);
+};
+exports.isValidDate = isValidDate;

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;
+    };
+};