@elastic/eui 63.0.0 → 63.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/eui_charts_theme.js +330 -330
- package/dist/eui_charts_theme.js.map +1 -1
- package/es/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js} +2 -12
- package/es/services/breakpoint/current_breakpoint_hook.js +20 -0
- package/es/services/breakpoint/index.js +2 -1
- package/es/services/breakpoint/useIsWithinBreakpoints.js +1 -1
- package/eui.d.ts +12 -5
- package/lib/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js} +5 -16
- package/lib/services/breakpoint/current_breakpoint_hook.js +31 -0
- package/lib/services/breakpoint/index.js +17 -4
- package/lib/services/breakpoint/useIsWithinBreakpoints.js +2 -2
- package/optimize/es/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js} +2 -11
- package/optimize/es/services/breakpoint/current_breakpoint_hook.js +20 -0
- package/optimize/es/services/breakpoint/index.js +2 -1
- package/optimize/es/services/breakpoint/useIsWithinBreakpoints.js +1 -1
- package/optimize/lib/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint.js} +5 -18
- package/optimize/lib/services/breakpoint/current_breakpoint_hook.js +31 -0
- package/optimize/lib/services/breakpoint/index.js +17 -4
- package/optimize/lib/services/breakpoint/useIsWithinBreakpoints.js +2 -2
- package/package.json +1 -1
- package/test-env/services/breakpoint/current_breakpoint.js +68 -0
- package/test-env/services/breakpoint/{currentEuiBreakpoint.js → current_breakpoint_hook.js} +3 -7
- package/test-env/services/breakpoint/index.js +17 -4
- package/test-env/services/breakpoint/useIsWithinBreakpoints.js +2 -2
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
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); }
|
|
2
|
-
|
|
3
1
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
2
|
|
|
5
3
|
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; }
|
|
|
19
17
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
20
18
|
* Side Public License, v 1.
|
|
21
19
|
*/
|
|
22
|
-
import React, { createContext,
|
|
20
|
+
import React, { createContext, useState, useEffect } from 'react';
|
|
23
21
|
import { useEuiTheme } from '../theme';
|
|
24
22
|
import { throttle } from '../throttle';
|
|
25
23
|
import { getBreakpoint } from './breakpoint';
|
|
@@ -36,7 +34,7 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
|
|
|
36
34
|
var _useEuiTheme = useEuiTheme(),
|
|
37
35
|
breakpoints = _useEuiTheme.euiTheme.breakpoint;
|
|
38
36
|
|
|
39
|
-
var _useState = useState(
|
|
37
|
+
var _useState = useState(typeof window !== 'undefined' ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
|
|
40
38
|
_useState2 = _slicedToArray(_useState, 2),
|
|
41
39
|
currentBreakpoint = _useState2[0],
|
|
42
40
|
setCurrentBreakpoint = _useState2[1];
|
|
@@ -53,12 +51,4 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
|
|
|
53
51
|
return ___EmotionJSX(CurrentEuiBreakpointContext.Provider, {
|
|
54
52
|
value: currentBreakpoint
|
|
55
53
|
}, children);
|
|
56
|
-
};
|
|
57
|
-
/**
|
|
58
|
-
* Hook util / syntactical sugar
|
|
59
|
-
*/
|
|
60
|
-
|
|
61
|
-
export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
62
|
-
var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
|
|
63
|
-
return currentBreakpoint;
|
|
64
54
|
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
+
* Side Public License, v 1.
|
|
7
|
+
*/
|
|
8
|
+
import { useContext } from 'react';
|
|
9
|
+
import { CurrentEuiBreakpointContext } from './current_breakpoint';
|
|
10
|
+
/**
|
|
11
|
+
* Hook util / syntactical sugar for useContext()
|
|
12
|
+
*
|
|
13
|
+
* This hook is in its own separate file to make mocking it
|
|
14
|
+
* as a testenv easy for Jest unit tests
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
18
|
+
var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
|
|
19
|
+
return currentBreakpoint;
|
|
20
|
+
};
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
6
|
* Side Public License, v 1.
|
|
7
7
|
*/
|
|
8
|
-
import { useCurrentEuiBreakpoint } from './
|
|
8
|
+
import { useCurrentEuiBreakpoint } from './current_breakpoint_hook';
|
|
9
9
|
/**
|
|
10
10
|
* Given the current window.innerWidth and an array of breakpoint keys,
|
|
11
11
|
* this hook stores state and returns true or false if the window.innerWidth
|
package/eui.d.ts
CHANGED
|
@@ -6655,7 +6655,7 @@ declare module '@elastic/eui/src/services/throttle' {
|
|
|
6655
6655
|
export const throttle: (fn: (...args: any[]) => void, wait?: number) => (...args: any[]) => void;
|
|
6656
6656
|
|
|
6657
6657
|
}
|
|
6658
|
-
declare module '@elastic/eui/src/services/breakpoint/
|
|
6658
|
+
declare module '@elastic/eui/src/services/breakpoint/current_breakpoint' {
|
|
6659
6659
|
import React, { FunctionComponent } from 'react';
|
|
6660
6660
|
import { _EuiThemeBreakpoint } from '@elastic/eui/src/global_styling/variables/breakpoint'; type CurrentEuiBreakpoint = _EuiThemeBreakpoint | undefined;
|
|
6661
6661
|
export const CurrentEuiBreakpointContext: React.Context<CurrentEuiBreakpoint>;
|
|
@@ -6664,11 +6664,17 @@ declare module '@elastic/eui/src/services/breakpoint/currentEuiBreakpoint' {
|
|
|
6664
6664
|
* resize listener that returns the current breakpoint based on window width
|
|
6665
6665
|
*/
|
|
6666
6666
|
export const CurrentEuiBreakpointProvider: FunctionComponent;
|
|
6667
|
+
export {};
|
|
6668
|
+
|
|
6669
|
+
}
|
|
6670
|
+
declare module '@elastic/eui/src/services/breakpoint/current_breakpoint_hook' {
|
|
6667
6671
|
/**
|
|
6668
|
-
* Hook util / syntactical sugar
|
|
6672
|
+
* Hook util / syntactical sugar for useContext()
|
|
6673
|
+
*
|
|
6674
|
+
* This hook is in its own separate file to make mocking it
|
|
6675
|
+
* as a testenv easy for Jest unit tests
|
|
6669
6676
|
*/
|
|
6670
|
-
export const useCurrentEuiBreakpoint: () =>
|
|
6671
|
-
export {};
|
|
6677
|
+
export const useCurrentEuiBreakpoint: () => "s" | "xs" | "m" | "l" | "xl" | undefined;
|
|
6672
6678
|
|
|
6673
6679
|
}
|
|
6674
6680
|
declare module '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints' {
|
|
@@ -6688,7 +6694,8 @@ declare module '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints' {
|
|
|
6688
6694
|
}
|
|
6689
6695
|
declare module '@elastic/eui/src/services/breakpoint' {
|
|
6690
6696
|
export * from '@elastic/eui/src/services/breakpoint/breakpoint';
|
|
6691
|
-
export * from '@elastic/eui/src/services/breakpoint/
|
|
6697
|
+
export * from '@elastic/eui/src/services/breakpoint/current_breakpoint';
|
|
6698
|
+
export * from '@elastic/eui/src/services/breakpoint/current_breakpoint_hook';
|
|
6692
6699
|
export * from '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints';
|
|
6693
6700
|
|
|
6694
6701
|
}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
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); }
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
|
-
exports.
|
|
8
|
+
exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
|
|
7
9
|
|
|
8
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
11
|
|
|
@@ -19,8 +21,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
19
21
|
|
|
20
22
|
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; }
|
|
21
23
|
|
|
22
|
-
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); }
|
|
23
|
-
|
|
24
24
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
25
25
|
|
|
26
26
|
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) {
|
|
|
47
47
|
var _useEuiTheme = (0, _theme.useEuiTheme)(),
|
|
48
48
|
breakpoints = _useEuiTheme.euiTheme.breakpoint;
|
|
49
49
|
|
|
50
|
-
var _useState = (0, _react.useState)(
|
|
50
|
+
var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
|
|
51
51
|
_useState2 = _slicedToArray(_useState, 2),
|
|
52
52
|
currentBreakpoint = _useState2[0],
|
|
53
53
|
setCurrentBreakpoint = _useState2[1];
|
|
@@ -65,16 +65,5 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
|
|
|
65
65
|
value: currentBreakpoint
|
|
66
66
|
}, children);
|
|
67
67
|
};
|
|
68
|
-
/**
|
|
69
|
-
* Hook util / syntactical sugar
|
|
70
|
-
*/
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
|
|
74
|
-
|
|
75
|
-
var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
76
|
-
var currentBreakpoint = (0, _react.useContext)(CurrentEuiBreakpointContext);
|
|
77
|
-
return currentBreakpoint;
|
|
78
|
-
};
|
|
79
68
|
|
|
80
|
-
exports.
|
|
69
|
+
exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useCurrentEuiBreakpoint = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
11
|
+
|
|
12
|
+
/*
|
|
13
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
14
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
15
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
16
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
17
|
+
* Side Public License, v 1.
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* Hook util / syntactical sugar for useContext()
|
|
22
|
+
*
|
|
23
|
+
* This hook is in its own separate file to make mocking it
|
|
24
|
+
* as a testenv easy for Jest unit tests
|
|
25
|
+
*/
|
|
26
|
+
var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
27
|
+
var currentBreakpoint = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
|
|
28
|
+
return currentBreakpoint;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;
|
|
@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
|
|
|
17
17
|
});
|
|
18
18
|
});
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
21
21
|
|
|
22
|
-
Object.keys(
|
|
22
|
+
Object.keys(_current_breakpoint).forEach(function (key) {
|
|
23
23
|
if (key === "default" || key === "__esModule") return;
|
|
24
|
-
if (key in exports && exports[key] ===
|
|
24
|
+
if (key in exports && exports[key] === _current_breakpoint[key]) return;
|
|
25
25
|
Object.defineProperty(exports, key, {
|
|
26
26
|
enumerable: true,
|
|
27
27
|
get: function get() {
|
|
28
|
-
return
|
|
28
|
+
return _current_breakpoint[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
34
|
+
|
|
35
|
+
Object.keys(_current_breakpoint_hook).forEach(function (key) {
|
|
36
|
+
if (key === "default" || key === "__esModule") return;
|
|
37
|
+
if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
|
|
38
|
+
Object.defineProperty(exports, key, {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _current_breakpoint_hook[key];
|
|
29
42
|
}
|
|
30
43
|
});
|
|
31
44
|
});
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.useIsWithinBreakpoints = void 0;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
9
9
|
|
|
10
10
|
/*
|
|
11
11
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
|
|
|
27
27
|
*/
|
|
28
28
|
var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
|
|
29
29
|
var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
30
|
-
var currentBreakpoint = (0,
|
|
30
|
+
var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
|
|
31
31
|
return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import _typeof from "@babel/runtime/helpers/typeof";
|
|
2
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
2
|
|
|
4
3
|
/*
|
|
@@ -8,7 +7,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
8
7
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
9
8
|
* Side Public License, v 1.
|
|
10
9
|
*/
|
|
11
|
-
import React, { createContext,
|
|
10
|
+
import React, { createContext, useState, useEffect } from 'react';
|
|
12
11
|
import { useEuiTheme } from '../theme';
|
|
13
12
|
import { throttle } from '../throttle';
|
|
14
13
|
import { getBreakpoint } from './breakpoint';
|
|
@@ -25,7 +24,7 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
|
|
|
25
24
|
var _useEuiTheme = useEuiTheme(),
|
|
26
25
|
breakpoints = _useEuiTheme.euiTheme.breakpoint;
|
|
27
26
|
|
|
28
|
-
var _useState = useState(
|
|
27
|
+
var _useState = useState(typeof window !== 'undefined' ? getBreakpoint(window.innerWidth, breakpoints) : undefined),
|
|
29
28
|
_useState2 = _slicedToArray(_useState, 2),
|
|
30
29
|
currentBreakpoint = _useState2[0],
|
|
31
30
|
setCurrentBreakpoint = _useState2[1];
|
|
@@ -42,12 +41,4 @@ export var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(
|
|
|
42
41
|
return ___EmotionJSX(CurrentEuiBreakpointContext.Provider, {
|
|
43
42
|
value: currentBreakpoint
|
|
44
43
|
}, children);
|
|
45
|
-
};
|
|
46
|
-
/**
|
|
47
|
-
* Hook util / syntactical sugar
|
|
48
|
-
*/
|
|
49
|
-
|
|
50
|
-
export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
51
|
-
var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
|
|
52
|
-
return currentBreakpoint;
|
|
53
44
|
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
+
* Side Public License, v 1.
|
|
7
|
+
*/
|
|
8
|
+
import { useContext } from 'react';
|
|
9
|
+
import { CurrentEuiBreakpointContext } from './current_breakpoint';
|
|
10
|
+
/**
|
|
11
|
+
* Hook util / syntactical sugar for useContext()
|
|
12
|
+
*
|
|
13
|
+
* This hook is in its own separate file to make mocking it
|
|
14
|
+
* as a testenv easy for Jest unit tests
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
export var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
18
|
+
var currentBreakpoint = useContext(CurrentEuiBreakpointContext);
|
|
19
|
+
return currentBreakpoint;
|
|
20
|
+
};
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
6
|
* Side Public License, v 1.
|
|
7
7
|
*/
|
|
8
|
-
import { useCurrentEuiBreakpoint } from './
|
|
8
|
+
import { useCurrentEuiBreakpoint } from './current_breakpoint_hook';
|
|
9
9
|
/**
|
|
10
10
|
* Given the current window.innerWidth and an array of breakpoint keys,
|
|
11
11
|
* this hook stores state and returns true or false if the window.innerWidth
|
|
@@ -2,14 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
6
|
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
10
|
-
exports.
|
|
11
|
-
|
|
12
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
10
|
+
exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
|
|
13
11
|
|
|
14
12
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
13
|
|
|
@@ -25,7 +23,7 @@ var _react2 = require("@emotion/react");
|
|
|
25
23
|
|
|
26
24
|
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); }
|
|
27
25
|
|
|
28
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null ||
|
|
26
|
+
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; }
|
|
29
27
|
|
|
30
28
|
/*
|
|
31
29
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
@@ -48,7 +46,7 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
|
|
|
48
46
|
var _useEuiTheme = (0, _theme.useEuiTheme)(),
|
|
49
47
|
breakpoints = _useEuiTheme.euiTheme.breakpoint;
|
|
50
48
|
|
|
51
|
-
var _useState = (0, _react.useState)(
|
|
49
|
+
var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
|
|
52
50
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
53
51
|
currentBreakpoint = _useState2[0],
|
|
54
52
|
setCurrentBreakpoint = _useState2[1];
|
|
@@ -66,16 +64,5 @@ var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
|
|
|
66
64
|
value: currentBreakpoint
|
|
67
65
|
}, children);
|
|
68
66
|
};
|
|
69
|
-
/**
|
|
70
|
-
* Hook util / syntactical sugar
|
|
71
|
-
*/
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
|
|
75
|
-
|
|
76
|
-
var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
77
|
-
var currentBreakpoint = (0, _react.useContext)(CurrentEuiBreakpointContext);
|
|
78
|
-
return currentBreakpoint;
|
|
79
|
-
};
|
|
80
67
|
|
|
81
|
-
exports.
|
|
68
|
+
exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useCurrentEuiBreakpoint = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
11
|
+
|
|
12
|
+
/*
|
|
13
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
14
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
15
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
16
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
17
|
+
* Side Public License, v 1.
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* Hook util / syntactical sugar for useContext()
|
|
22
|
+
*
|
|
23
|
+
* This hook is in its own separate file to make mocking it
|
|
24
|
+
* as a testenv easy for Jest unit tests
|
|
25
|
+
*/
|
|
26
|
+
var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
27
|
+
var currentBreakpoint = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
|
|
28
|
+
return currentBreakpoint;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;
|
|
@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
|
|
|
17
17
|
});
|
|
18
18
|
});
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
21
21
|
|
|
22
|
-
Object.keys(
|
|
22
|
+
Object.keys(_current_breakpoint).forEach(function (key) {
|
|
23
23
|
if (key === "default" || key === "__esModule") return;
|
|
24
|
-
if (key in exports && exports[key] ===
|
|
24
|
+
if (key in exports && exports[key] === _current_breakpoint[key]) return;
|
|
25
25
|
Object.defineProperty(exports, key, {
|
|
26
26
|
enumerable: true,
|
|
27
27
|
get: function get() {
|
|
28
|
-
return
|
|
28
|
+
return _current_breakpoint[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
34
|
+
|
|
35
|
+
Object.keys(_current_breakpoint_hook).forEach(function (key) {
|
|
36
|
+
if (key === "default" || key === "__esModule") return;
|
|
37
|
+
if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
|
|
38
|
+
Object.defineProperty(exports, key, {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _current_breakpoint_hook[key];
|
|
29
42
|
}
|
|
30
43
|
});
|
|
31
44
|
});
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.useIsWithinBreakpoints = void 0;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
9
9
|
|
|
10
10
|
/*
|
|
11
11
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
|
|
|
27
27
|
*/
|
|
28
28
|
var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
|
|
29
29
|
var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
30
|
-
var currentBreakpoint = (0,
|
|
30
|
+
var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
|
|
31
31
|
return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
|
|
32
32
|
};
|
|
33
33
|
|
package/package.json
CHANGED
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.CurrentEuiBreakpointProvider = exports.CurrentEuiBreakpointContext = void 0;
|
|
11
|
+
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
+
|
|
14
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
+
|
|
16
|
+
var _theme = require("../theme");
|
|
17
|
+
|
|
18
|
+
var _throttle = require("../throttle");
|
|
19
|
+
|
|
20
|
+
var _breakpoint = require("./breakpoint");
|
|
21
|
+
|
|
22
|
+
var _react2 = require("@emotion/react");
|
|
23
|
+
|
|
24
|
+
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); }
|
|
25
|
+
|
|
26
|
+
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; }
|
|
27
|
+
|
|
28
|
+
/*
|
|
29
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
30
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
31
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
32
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
33
|
+
* Side Public License, v 1.
|
|
34
|
+
*/
|
|
35
|
+
var CurrentEuiBreakpointContext = /*#__PURE__*/(0, _react.createContext)(undefined);
|
|
36
|
+
/**
|
|
37
|
+
* Top level provider (nested within EuiProvider) which provides a single
|
|
38
|
+
* resize listener that returns the current breakpoint based on window width
|
|
39
|
+
*/
|
|
40
|
+
|
|
41
|
+
exports.CurrentEuiBreakpointContext = CurrentEuiBreakpointContext;
|
|
42
|
+
|
|
43
|
+
var CurrentEuiBreakpointProvider = function CurrentEuiBreakpointProvider(_ref) {
|
|
44
|
+
var children = _ref.children;
|
|
45
|
+
|
|
46
|
+
var _useEuiTheme = (0, _theme.useEuiTheme)(),
|
|
47
|
+
breakpoints = _useEuiTheme.euiTheme.breakpoint;
|
|
48
|
+
|
|
49
|
+
var _useState = (0, _react.useState)(typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints) : undefined),
|
|
50
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
51
|
+
currentBreakpoint = _useState2[0],
|
|
52
|
+
setCurrentBreakpoint = _useState2[1];
|
|
53
|
+
|
|
54
|
+
(0, _react.useEffect)(function () {
|
|
55
|
+
var onWindowResize = (0, _throttle.throttle)(function () {
|
|
56
|
+
setCurrentBreakpoint((0, _breakpoint.getBreakpoint)(window.innerWidth, breakpoints));
|
|
57
|
+
}, 50);
|
|
58
|
+
window.addEventListener('resize', onWindowResize);
|
|
59
|
+
return function () {
|
|
60
|
+
return window.removeEventListener('resize', onWindowResize);
|
|
61
|
+
};
|
|
62
|
+
}, [breakpoints]);
|
|
63
|
+
return (0, _react2.jsx)(CurrentEuiBreakpointContext.Provider, {
|
|
64
|
+
value: currentBreakpoint
|
|
65
|
+
}, children);
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
exports.CurrentEuiBreakpointProvider = CurrentEuiBreakpointProvider;
|
|
@@ -1,19 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
6
|
exports.useCurrentEuiBreakpoint = void 0;
|
|
9
7
|
|
|
10
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
11
|
-
|
|
12
8
|
var _react = require("react");
|
|
13
9
|
|
|
14
10
|
var _breakpoint = require("./breakpoint");
|
|
15
11
|
|
|
16
|
-
var
|
|
12
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
17
13
|
|
|
18
14
|
/*
|
|
19
15
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
@@ -28,10 +24,10 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
|
|
|
28
24
|
* this test mock mimics CurrentEuiBreakpoint logic (w/o resize observers).
|
|
29
25
|
*/
|
|
30
26
|
var useCurrentEuiBreakpoint = function useCurrentEuiBreakpoint() {
|
|
31
|
-
var context = (0, _react.useContext)(
|
|
27
|
+
var context = (0, _react.useContext)(_current_breakpoint.CurrentEuiBreakpointContext);
|
|
32
28
|
if (context !== undefined) return context; // Component has been wrapped, everything is fine.
|
|
33
29
|
|
|
34
|
-
return
|
|
30
|
+
return typeof window !== 'undefined' ? (0, _breakpoint.getBreakpoint)(window.innerWidth) : undefined;
|
|
35
31
|
};
|
|
36
32
|
|
|
37
33
|
exports.useCurrentEuiBreakpoint = useCurrentEuiBreakpoint;
|
|
@@ -17,15 +17,28 @@ Object.keys(_breakpoint).forEach(function (key) {
|
|
|
17
17
|
});
|
|
18
18
|
});
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _current_breakpoint = require("./current_breakpoint");
|
|
21
21
|
|
|
22
|
-
Object.keys(
|
|
22
|
+
Object.keys(_current_breakpoint).forEach(function (key) {
|
|
23
23
|
if (key === "default" || key === "__esModule") return;
|
|
24
|
-
if (key in exports && exports[key] ===
|
|
24
|
+
if (key in exports && exports[key] === _current_breakpoint[key]) return;
|
|
25
25
|
Object.defineProperty(exports, key, {
|
|
26
26
|
enumerable: true,
|
|
27
27
|
get: function get() {
|
|
28
|
-
return
|
|
28
|
+
return _current_breakpoint[key];
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
34
|
+
|
|
35
|
+
Object.keys(_current_breakpoint_hook).forEach(function (key) {
|
|
36
|
+
if (key === "default" || key === "__esModule") return;
|
|
37
|
+
if (key in exports && exports[key] === _current_breakpoint_hook[key]) return;
|
|
38
|
+
Object.defineProperty(exports, key, {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _current_breakpoint_hook[key];
|
|
29
42
|
}
|
|
30
43
|
});
|
|
31
44
|
});
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.useIsWithinBreakpoints = void 0;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _current_breakpoint_hook = require("./current_breakpoint_hook");
|
|
9
9
|
|
|
10
10
|
/*
|
|
11
11
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
@@ -27,7 +27,7 @@ var _currentEuiBreakpoint = require("./currentEuiBreakpoint");
|
|
|
27
27
|
*/
|
|
28
28
|
var useIsWithinBreakpoints = function useIsWithinBreakpoints(sizes) {
|
|
29
29
|
var isResponsive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
30
|
-
var currentBreakpoint = (0,
|
|
30
|
+
var currentBreakpoint = (0, _current_breakpoint_hook.useCurrentEuiBreakpoint)();
|
|
31
31
|
return currentBreakpoint && isResponsive ? sizes.includes(currentBreakpoint) : false;
|
|
32
32
|
};
|
|
33
33
|
|