@elastic/eui 62.2.0 → 62.2.1

package/es/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js}

@@ -1,5 +1,3 @@
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(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."); }
@@ -19,7 +17,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import React, { createContext, useContext, useState, useEffect } from 'react';
+import React, { createContext, useState, useEffect } from 'react';
 import { useEuiTheme } from '../theme';
 import { throttle } from '../throttle';
 import { getBreakpoint } from './breakpoint';
@@ -36,7 +34,7 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
   var _useEuiTheme = useEuiTheme(),
       breakpoints = _useEuiTheme.euiTheme.breakpoint;
 
-  var _useState = useState((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
+  var _useState = useState(typeof window !== 'undefined' ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
       _useState2 = _slicedToArray(_useState, 2),
       currentBreakpoint = _useState2[0],
       setCurrentBreakpoint = _useState2[1];
@@ -53,12 +51,4 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
   return ___EmotionJSX(CurrentEuiBreakpointContext.Provider, {
     value: currentBreakpoint
   }, children);
-};
-/**
- * Hook util / syntactical sugar
- */
-
-export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
-  var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
-  return currentBreakpoint;
 };

package/es/services/breakpoint/current_breakpoint_hook.js

@@ -0,0 +1,20 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+import { useContext } from 'react';
+import { CurrentEuiBreakpointContext } from './current_breakpoint';
+/**
+ * Hook util / syntactical sugar for useContext()
+ *
+ * This hook is in its own separate file to make mocking it
+ * as a testenv easy for Jest unit tests
+ */
+
+export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
+  var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
+  return currentBreakpoint;
+};

package/es/services/breakpoint/index.js

@@ -6,5 +6,6 @@
  * Side Public License, v 1.
  */
 export * from './breakpoint';
-export * from './currentEuiBreakpoint';
+export * from './current_breakpoint';
+export * from './current_breakpoint_hook';
 export * from './useIsWithinBreakpoints';

package/es/services/breakpoint/useIsWithinBreakpoints.js

@@ -5,7 +5,7 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import { useCurrentEuiBreakpoint } from './currentEuiBreakpoint';
+import { useCurrentEuiBreakpoint } from './current_breakpoint_hook';
 /**
  * Given the current window.innerWidth and an array of breakpoint keys,
  * this hook stores state and returns true or false if the window.innerWidth

package/eui.d.ts

@@ -6652,7 +6652,7 @@ declare module '@elastic/eui/src/services/throttle' {
 	export const throttle: (fn: (...args: any[]) => void, wait?: number) => (...args: any[]) => void;
 
 }
-declare module '@elastic/eui/src/services/breakpoint/currentEuiBreakpoint' {
+declare module '@elastic/eui/src/services/breakpoint/current_breakpoint' {
 	import React, { FunctionComponent } from 'react';
 	import { _EuiThemeBreakpoint } from '@elastic/eui/src/global_styling/variables/breakpoint'; type CurrentEuiBreakpoint = _EuiThemeBreakpoint | undefined;
 	export const CurrentEuiBreakpointContext: React.Context<CurrentEuiBreakpoint>;
@@ -6661,11 +6661,17 @@ declare module '@elastic/eui/src/services/breakpoint/currentEuiBreakpoint' {
 	 * resize listener that returns the current breakpoint based on window width
 	 */
 	export const CurrentEuiBreakpointProvider: FunctionComponent;
+	export {};
+
+}
+declare module '@elastic/eui/src/services/breakpoint/current_breakpoint_hook' {
 	/**
-	 * Hook util / syntactical sugar
+	 * Hook util / syntactical sugar for useContext()
+	 *
+	 * This hook is in its own separate file to make mocking it
+	 * as a testenv easy for Jest unit tests
 	 */
-	export const useCurrentEuiBreakpoint: () => CurrentEuiBreakpoint;
-	export {};
+	export const useCurrentEuiBreakpoint: () => "s" | "xs" | "m" | "l" | "xl" | undefined;
 
 }
 declare module '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints' {
@@ -6685,7 +6691,8 @@ declare module '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints' {
 }
 declare module '@elastic/eui/src/services/breakpoint' {
 	export * from '@elastic/eui/src/services/breakpoint/breakpoint';
-	export * from '@elastic/eui/src/services/breakpoint/currentEuiBreakpoint';
+	export * from '@elastic/eui/src/services/breakpoint/current_breakpoint';
+	export * from '@elastic/eui/src/services/breakpoint/current_breakpoint_hook';
 	export * from '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints';
 
 }

package/lib/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js}

@@ -1,9 +1,11 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useCurrentEuiBreakpoint = exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
+exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -19,8 +21,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(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."); }
@@ -47,7 +47,7 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
   var _useEuiTheme = (0, _theme.useEuiTheme)(),
       breakpoints = _useEuiTheme.euiTheme.breakpoint;
 
-  var _useState = (0, _react.useState)((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
+  var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
       _useState2 = _slicedToArray(_useState, 2),
       currentBreakpoint = _useState2[0],
       setCurrentBreakpoint = _useState2[1];
@@ -65,16 +65,5 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
     value: currentBreakpoint
   }, children);
 };
-/**
- * Hook util / syntactical sugar
- */
-
-
-exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
-
-var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
-  var currentBreakpoint = (0, _react.useContext)(CurrentEuiBreakpointContext);
-  return currentBreakpoint;
-};
 
-exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;
+exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;

package/lib/services/breakpoint/current_breakpoint_hook.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCurrentEuiBreakpoint = void 0;
+
+var _react = require("react");
+
+var _current_breakpoint = require("./current_breakpoint");
+
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Hook util / syntactical sugar for useContext()
+ *
+ * This hook is in its own separate file to make mocking it
+ * as a testenv easy for Jest unit tests
+ */
+var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
+  var currentBreakpoint = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
+  return currentBreakpoint;
+};
+
+exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;

package/lib/services/breakpoint/index.js

@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
   });
 });
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint = require("./current_breakpoint");
 
-Object.keys(_currentEuiBreakpoint).forEach(function (key) {
+Object.keys(_current_breakpoint).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _currentEuiBreakpoint[key]) return;
+  if (key in exports && exports[key] === _current_breakpoint[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _currentEuiBreakpoint[key];
+      return _current_breakpoint[key];
+    }
+  });
+});
+
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
+
+Object.keys(_current_breakpoint_hook).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _current_breakpoint_hook[key];
     }
   });
 });

package/lib/services/breakpoint/useIsWithinBreakpoints.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useIsWithinBreakpoints = void 0;
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
  */
 var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
   var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-  var currentBreakpoint = (0, _currentEuiBreakpoint.useCurrentEuiBreakpoint)();
+  var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
   return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
 };
 

package/optimize/es/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js}

@@ -1,4 +1,3 @@
-import _typeof from "@babel/runtime/helpers/typeof";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 
 /*
@@ -8,7 +7,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import React, { createContext, useContext, useState, useEffect } from 'react';
+import React, { createContext, useState, useEffect } from 'react';
 import { useEuiTheme } from '../theme';
 import { throttle } from '../throttle';
 import { getBreakpoint } from './breakpoint';
@@ -25,7 +24,7 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
   var _useEuiTheme = useEuiTheme(),
       breakpoints = _useEuiTheme.euiTheme.breakpoint;
 
-  var _useState = useState((typeof window === "undefined" ? "undefined" : _typeof(window)) !== undefined ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
+  var _useState = useState(typeof window !== 'undefined' ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
       _useState2 = _slicedToArray(_useState, 2),
       currentBreakpoint = _useState2[0],
       setCurrentBreakpoint = _useState2[1];
@@ -42,12 +41,4 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
   return ___EmotionJSX(CurrentEuiBreakpointContext.Provider, {
     value: currentBreakpoint
   }, children);
-};
-/**
- * Hook util / syntactical sugar
- */
-
-export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
-  var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
-  return currentBreakpoint;
 };

package/optimize/es/services/breakpoint/current_breakpoint_hook.js

@@ -0,0 +1,20 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+import { useContext } from 'react';
+import { CurrentEuiBreakpointContext } from './current_breakpoint';
+/**
+ * Hook util / syntactical sugar for useContext()
+ *
+ * This hook is in its own separate file to make mocking it
+ * as a testenv easy for Jest unit tests
+ */
+
+export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
+  var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
+  return currentBreakpoint;
+};

package/optimize/es/services/breakpoint/index.js

@@ -6,5 +6,6 @@
  * Side Public License, v 1.
  */
 export * from './breakpoint';
-export * from './currentEuiBreakpoint';
+export * from './current_breakpoint';
+export * from './current_breakpoint_hook';
 export * from './useIsWithinBreakpoints';

package/optimize/es/services/breakpoint/useIsWithinBreakpoints.js

@@ -5,7 +5,7 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import { useCurrentEuiBreakpoint } from './currentEuiBreakpoint';
+import { useCurrentEuiBreakpoint } from './current_breakpoint_hook';
 /**
  * Given the current window.innerWidth and an array of breakpoint keys,
  * this hook stores state and returns true or false if the window.innerWidth

package/optimize/lib/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js}

@@ -2,14 +2,12 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _typeof3 = require("@babel/runtime/helpers/typeof");
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useCurrentEuiBreakpoint = exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
@@ -25,7 +23,7 @@ var _react2 = require("@emotion/react");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -48,7 +46,7 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
   var _useEuiTheme = (0, _theme.useEuiTheme)(),
       breakpoints = _useEuiTheme.euiTheme.breakpoint;
 
-  var _useState = (0, _react.useState)((typeof window === "undefined" ? "undefined" : (0, _typeof2.default)(window)) !== undefined ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
+  var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       currentBreakpoint = _useState2[0],
       setCurrentBreakpoint = _useState2[1];
@@ -66,16 +64,5 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
     value: currentBreakpoint
   }, children);
 };
-/**
- * Hook util / syntactical sugar
- */
-
-
-exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
-
-var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
-  var currentBreakpoint = (0, _react.useContext)(CurrentEuiBreakpointContext);
-  return currentBreakpoint;
-};
 
-exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;
+exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;

package/optimize/lib/services/breakpoint/current_breakpoint_hook.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCurrentEuiBreakpoint = void 0;
+
+var _react = require("react");
+
+var _current_breakpoint = require("./current_breakpoint");
+
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * Hook util / syntactical sugar for useContext()
+ *
+ * This hook is in its own separate file to make mocking it
+ * as a testenv easy for Jest unit tests
+ */
+var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
+  var currentBreakpoint = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
+  return currentBreakpoint;
+};
+
+exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;

package/optimize/lib/services/breakpoint/index.js

@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
   });
 });
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint = require("./current_breakpoint");
 
-Object.keys(_currentEuiBreakpoint).forEach(function (key) {
+Object.keys(_current_breakpoint).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _currentEuiBreakpoint[key]) return;
+  if (key in exports && exports[key] === _current_breakpoint[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _currentEuiBreakpoint[key];
+      return _current_breakpoint[key];
+    }
+  });
+});
+
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
+
+Object.keys(_current_breakpoint_hook).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _current_breakpoint_hook[key];
     }
   });
 });

package/optimize/lib/services/breakpoint/useIsWithinBreakpoints.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useIsWithinBreakpoints = void 0;
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
  */
 var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
   var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-  var currentBreakpoint = (0, _currentEuiBreakpoint.useCurrentEuiBreakpoint)();
+  var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
   return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
 };
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elastic/eui",
   "description": "Elastic UI Component Library",
-  "version": "62.2.0",
+  "version": "62.2.1",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "lib",
   "module": "es",

package/test-env/services/breakpoint/current_breakpoint.js

@@ -0,0 +1,68 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _theme = require("../theme");
+
+var _throttle = require("../throttle");
+
+var _breakpoint = require("./breakpoint");
+
+var _react2 = require("@emotion/react");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+var CurrentEuiBreakpointContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+/**
+ * Top level provider (nested within EuiProvider) which provides a single
+ * resize listener that returns the current breakpoint based on window width
+ */
+
+exports.CurrentEuiBreakpointContext = CurrentEuiBreakpointContext;
+
+var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
+  var children = _ref.children;
+
+  var _useEuiTheme = (0, _theme.useEuiTheme)(),
+      breakpoints = _useEuiTheme.euiTheme.breakpoint;
+
+  var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      currentBreakpoint = _useState2[0],
+      setCurrentBreakpoint = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    var onWindowResize = (0, _throttle.throttle)(function () {
+      setCurrentBreakpoint((0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints));
+    }, 50);
+    window.addEventListener('resize', onWindowResize);
+    return function () {
+      return window.removeEventListener('resize', onWindowResize);
+    };
+  }, [breakpoints]);
+  return (0, _react2.jsx)(CurrentEuiBreakpointContext.Provider, {
+    value: currentBreakpoint
+  }, children);
+};
+
+exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;

package/test-env/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint_hook.js}

@@ -1,19 +1,15 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useCurrentEuiBreakpoint = void 0;
 
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _react = require("react");
 
 var _breakpoint = require("./breakpoint");
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint = require("./current_breakpoint");
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -28,10 +24,10 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
  * this test mock mimics CurrentEuiBreakpoint logic (w/o resize observers).
  */
 var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
-  var context = (0, _react.useContext)(_currentEuiBreakpoint.CurrentEuiBreakpointContext);
+  var context = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
   if (context !== undefined) return context; // Component has been wrapped, everything is fine.
 
-  return (typeof window === "undefined" ? "undefined" : (0, _typeof2.default)(window)) !== undefined ? (0, _breakpoint.getBreakpoint)(window.innerWidth) : undefined;
+  return typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth) : undefined;
 };
 
 exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;

package/test-env/services/breakpoint/index.js

@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
   });
 });
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint = require("./current_breakpoint");
 
-Object.keys(_currentEuiBreakpoint).forEach(function (key) {
+Object.keys(_current_breakpoint).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _currentEuiBreakpoint[key]) return;
+  if (key in exports && exports[key] === _current_breakpoint[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _currentEuiBreakpoint[key];
+      return _current_breakpoint[key];
+    }
+  });
+});
+
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
+
+Object.keys(_current_breakpoint_hook).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _current_breakpoint_hook[key];
     }
   });
 });

package/test-env/services/breakpoint/useIsWithinBreakpoints.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useIsWithinBreakpoints = void 0;
 
-var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
+var _current_breakpoint_hook = require("./current_breakpoint_hook");
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
  */
 var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
   var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-  var currentBreakpoint = (0, _currentEuiBreakpoint.useCurrentEuiBreakpoint)();
+  var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
   return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
 };