@dr.pogodin/react-utils 1.25.6 → 1.26.0
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/babel.config.js +3 -1
- package/bin/build.js +18 -4
- package/build/development/client/getInj.js +9 -8
- package/build/development/client/getInj.js.map +1 -1
- package/build/development/client/index.js +6 -3
- package/build/development/client/index.js.map +1 -1
- package/build/development/client/init.js +4 -0
- package/build/development/client/init.js.map +1 -1
- package/build/development/index.js +166 -38
- package/build/development/index.js.map +1 -1
- package/build/development/server/Cache.js +13 -13
- package/build/development/server/Cache.js.map +1 -1
- package/build/development/server/index.js +16 -23
- package/build/development/server/index.js.map +1 -1
- package/build/development/server/renderer.js +56 -43
- package/build/development/server/renderer.js.map +1 -1
- package/build/development/server/server.js +9 -5
- package/build/development/server/server.js.map +1 -1
- package/build/development/server/utils/errors.js +12 -9
- package/build/development/server/utils/errors.js.map +1 -1
- package/build/development/server/utils/index.js +2 -2
- package/build/development/server/utils/index.js.map +1 -1
- package/build/development/shared/components/Button/index.js +7 -5
- package/build/development/shared/components/Button/index.js.map +1 -1
- package/build/development/shared/components/Checkbox/index.js +24 -26
- package/build/development/shared/components/Checkbox/index.js.map +1 -1
- package/build/development/shared/components/Dropdown/index.js +24 -17
- package/build/development/shared/components/Dropdown/index.js.map +1 -1
- package/build/development/shared/components/GenericLink/index.js +44 -37
- package/build/development/shared/components/GenericLink/index.js.map +1 -1
- package/build/development/shared/components/Input/index.js +7 -7
- package/build/development/shared/components/Input/index.js.map +1 -1
- package/build/development/shared/components/Link.js +10 -9
- package/build/development/shared/components/Link.js.map +1 -1
- package/build/development/shared/components/MetaTags.js +22 -18
- package/build/development/shared/components/MetaTags.js.map +1 -1
- package/build/development/shared/components/Modal/index.js +16 -16
- package/build/development/shared/components/Modal/index.js.map +1 -1
- package/build/development/shared/components/NavLink.js +10 -9
- package/build/development/shared/components/NavLink.js.map +1 -1
- package/build/development/shared/components/PageLayout/index.js +16 -18
- package/build/development/shared/components/PageLayout/index.js.map +1 -1
- package/build/development/shared/components/ScalableRect/index.js +27 -7
- package/build/development/shared/components/ScalableRect/index.js.map +1 -1
- package/build/development/shared/components/Throbber/index.js +14 -22
- package/build/development/shared/components/Throbber/index.js.map +1 -1
- package/build/development/shared/components/WithTooltip/Tooltip.js +19 -21
- package/build/development/shared/components/WithTooltip/Tooltip.js.map +1 -1
- package/build/development/shared/components/WithTooltip/index.js +11 -10
- package/build/development/shared/components/WithTooltip/index.js.map +1 -1
- package/build/development/shared/components/YouTubeVideo/index.js +15 -13
- package/build/development/shared/components/YouTubeVideo/index.js.map +1 -1
- package/build/development/shared/components/index.js +2 -2
- package/build/development/shared/components/index.js.map +1 -1
- package/build/development/shared/utils/config.js.map +1 -1
- package/build/development/shared/utils/globalState.js +15 -0
- package/build/development/shared/utils/globalState.js.map +1 -0
- package/build/development/shared/utils/index.js +13 -10
- package/build/development/shared/utils/index.js.map +1 -1
- package/build/development/shared/utils/isomorphy/buildInfo.js +7 -3
- package/build/development/shared/utils/isomorphy/buildInfo.js.map +1 -1
- package/build/development/shared/utils/isomorphy/environment-check.js.map +1 -1
- package/build/development/shared/utils/isomorphy/index.js.map +1 -1
- package/build/development/shared/utils/jest/E2eSsrEnv.js +35 -28
- package/build/development/shared/utils/jest/E2eSsrEnv.js.map +1 -1
- package/build/development/shared/utils/jest/global.js +17 -0
- package/build/development/shared/utils/jest/global.js.map +1 -0
- package/build/development/shared/utils/jest/index.js +17 -9
- package/build/development/shared/utils/jest/index.js.map +1 -1
- package/build/development/shared/utils/splitComponent.js +25 -34
- package/build/development/shared/utils/splitComponent.js.map +1 -1
- package/build/development/shared/utils/time.js +16 -12
- package/build/development/shared/utils/time.js.map +1 -1
- package/build/development/shared/utils/webpack.js +3 -3
- package/build/development/shared/utils/webpack.js.map +1 -1
- package/build/development/web.bundle.js +92 -82
- package/build/production/client/getInj.js +1 -1
- package/build/production/client/getInj.js.map +1 -1
- package/build/production/client/index.js +4 -4
- package/build/production/client/index.js.map +1 -1
- package/build/production/client/init.js +3 -1
- package/build/production/client/init.js.map +1 -1
- package/build/production/index.js +1 -1
- package/build/production/index.js.map +1 -1
- package/build/production/server/Cache.js +7 -8
- package/build/production/server/Cache.js.map +1 -1
- package/build/production/server/index.js +5 -4
- package/build/production/server/index.js.map +1 -1
- package/build/production/server/renderer.js +32 -30
- package/build/production/server/renderer.js.map +1 -1
- package/build/production/server/server.js +7 -5
- package/build/production/server/server.js.map +1 -1
- package/build/production/server/utils/errors.js +9 -10
- package/build/production/server/utils/errors.js.map +1 -1
- package/build/production/server/utils/index.js +1 -1
- package/build/production/server/utils/index.js.map +1 -1
- package/build/production/shared/components/Button/index.js +3 -3
- package/build/production/shared/components/Button/index.js.map +1 -1
- package/build/production/shared/components/Checkbox/index.js +11 -11
- package/build/production/shared/components/Checkbox/index.js.map +1 -1
- package/build/production/shared/components/Dropdown/index.js +11 -11
- package/build/production/shared/components/Dropdown/index.js.map +1 -1
- package/build/production/shared/components/GenericLink/index.js +25 -20
- package/build/production/shared/components/GenericLink/index.js.map +1 -1
- package/build/production/shared/components/Input/index.js +7 -7
- package/build/production/shared/components/Input/index.js.map +1 -1
- package/build/production/shared/components/Link.js +2 -2
- package/build/production/shared/components/Link.js.map +1 -1
- package/build/production/shared/components/MetaTags.js +10 -10
- package/build/production/shared/components/MetaTags.js.map +1 -1
- package/build/production/shared/components/Modal/index.js +2 -2
- package/build/production/shared/components/Modal/index.js.map +1 -1
- package/build/production/shared/components/NavLink.js +1 -1
- package/build/production/shared/components/NavLink.js.map +1 -1
- package/build/production/shared/components/PageLayout/index.js +2 -2
- package/build/production/shared/components/PageLayout/index.js.map +1 -1
- package/build/production/shared/components/ScalableRect/index.js +7 -3
- package/build/production/shared/components/ScalableRect/index.js.map +1 -1
- package/build/production/shared/components/Throbber/index.js +2 -2
- package/build/production/shared/components/Throbber/index.js.map +1 -1
- package/build/production/shared/components/WithTooltip/Tooltip.js +13 -13
- package/build/production/shared/components/WithTooltip/Tooltip.js.map +1 -1
- package/build/production/shared/components/WithTooltip/index.js +3 -3
- package/build/production/shared/components/WithTooltip/index.js.map +1 -1
- package/build/production/shared/components/YouTubeVideo/index.js +7 -7
- package/build/production/shared/components/YouTubeVideo/index.js.map +1 -1
- package/build/production/shared/components/index.js +1 -1
- package/build/production/shared/components/index.js.map +1 -1
- package/build/production/shared/utils/config.js.map +1 -1
- package/build/production/shared/utils/globalState.js +3 -0
- package/build/production/shared/utils/globalState.js.map +1 -0
- package/build/production/shared/utils/index.js +2 -2
- package/build/production/shared/utils/index.js.map +1 -1
- package/build/production/shared/utils/isomorphy/buildInfo.js +7 -4
- package/build/production/shared/utils/isomorphy/buildInfo.js.map +1 -1
- package/build/production/shared/utils/isomorphy/environment-check.js.map +1 -1
- package/build/production/shared/utils/isomorphy/index.js.map +1 -1
- package/build/production/shared/utils/jest/E2eSsrEnv.js +9 -9
- package/build/production/shared/utils/jest/E2eSsrEnv.js.map +1 -1
- package/build/production/shared/utils/jest/global.js +2 -0
- package/build/production/shared/utils/jest/global.js.map +1 -0
- package/build/production/shared/utils/jest/index.js +5 -5
- package/build/production/shared/utils/jest/index.js.map +1 -1
- package/build/production/shared/utils/splitComponent.js +16 -16
- package/build/production/shared/utils/splitComponent.js.map +1 -1
- package/build/production/shared/utils/time.js +12 -8
- package/build/production/shared/utils/time.js.map +1 -1
- package/build/production/shared/utils/webpack.js +3 -3
- package/build/production/shared/utils/webpack.js.map +1 -1
- package/build/production/web.bundle.js +1 -1
- package/build/production/web.bundle.js.map +1 -1
- package/build/types-code/client/getInj.d.ts +3 -0
- package/build/types-code/client/index.d.ts +11 -0
- package/build/types-code/client/init.d.ts +9 -0
- package/build/types-code/index.d.ts +10 -0
- package/build/types-code/server/Cache.d.ts +37 -0
- package/build/types-code/server/index.d.ts +145 -0
- package/build/types-code/server/renderer.d.ts +106 -0
- package/build/types-code/server/server.d.ts +41 -0
- package/build/types-code/server/utils/errors.d.ts +104 -0
- package/build/types-code/server/utils/index.d.ts +1 -0
- package/build/types-code/shared/components/Button/index.d.ts +27 -0
- package/build/types-code/shared/components/Checkbox/index.d.ts +21 -0
- package/build/types-code/shared/components/Dropdown/index.d.ts +23 -0
- package/build/types-code/shared/components/GenericLink/index.d.ts +61 -0
- package/build/types-code/shared/components/Input/index.d.ts +11 -0
- package/build/types-code/shared/components/Link.d.ts +12 -0
- package/build/types-code/shared/components/MetaTags.d.ts +68 -0
- package/build/types-code/shared/components/Modal/index.d.ts +26 -0
- package/build/types-code/shared/components/NavLink.d.ts +5 -0
- package/build/types-code/shared/components/PageLayout/index.d.ts +16 -0
- package/build/types-code/shared/components/ScalableRect/index.d.ts +19 -0
- package/build/types-code/shared/components/Throbber/index.d.ts +9 -0
- package/build/types-code/shared/components/WithTooltip/Tooltip.d.ts +23 -0
- package/build/types-code/shared/components/WithTooltip/index.d.ts +17 -0
- package/build/types-code/shared/components/YouTubeVideo/index.d.ts +13 -0
- package/build/types-code/shared/components/index.d.ts +16 -0
- package/build/types-code/shared/utils/config.d.ts +2 -0
- package/build/types-code/shared/utils/globalState.d.ts +20 -0
- package/build/types-code/shared/utils/index.d.ts +52 -0
- package/build/types-code/shared/utils/isomorphy/buildInfo.d.ts +23 -0
- package/build/types-code/shared/utils/isomorphy/environment-check.d.ts +11 -0
- package/build/types-code/shared/utils/isomorphy/index.d.ts +20 -0
- package/build/types-code/shared/utils/jest/E2eSsrEnv.d.ts +31 -0
- package/build/types-code/shared/utils/jest/global.d.ts +12 -0
- package/build/types-code/shared/utils/jest/index.d.ts +85 -0
- package/build/types-code/shared/utils/splitComponent.d.ts +41 -0
- package/build/types-code/shared/utils/time.d.ts +62 -0
- package/build/types-code/shared/utils/webpack.d.ts +18 -0
- package/build/types-scss/__tests__/js/config/publicPath support/__assets__/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/config/stylename-generation/__assets__/MockPackageA/TestComponent/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/config/stylename-generation/__assets__/MockPackageB/TestComponent/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/config/stylename-generation/__assets__/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/shared/components/NavLink/styles.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/shared/utils/splitComponent/__assets__/SampleScene/ComponentA/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/shared/utils/splitComponent/__assets__/SampleScene/ComponentB/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/shared/utils/splitComponent/__assets__/SampleScene/ComponentC/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/js/shared/utils/splitComponent/__assets__/SampleScene/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/config/publicPath support/__assets__/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/config/stylename-generation/__assets__/MockPackageA/TestComponent/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/config/stylename-generation/__assets__/MockPackageB/TestComponent/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/config/stylename-generation/__assets__/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/shared/components/NavLink/styles.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/shared/utils/splitComponent/__assets__/SampleScene/ComponentA/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/shared/utils/splitComponent/__assets__/SampleScene/ComponentB/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/shared/utils/splitComponent/__assets__/SampleScene/ComponentC/style.scss.d.ts +1 -0
- package/build/types-scss/__tests__/ts/shared/utils/splitComponent/__assets__/SampleScene/style.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/Button/style.scss.d.ts +6 -0
- package/build/types-scss/src/shared/components/Checkbox/theme.scss.d.ts +6 -0
- package/build/types-scss/src/shared/components/Dropdown/theme.scss.d.ts +9 -0
- package/build/types-scss/src/shared/components/GenericLink/style.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/Input/theme.scss.d.ts +6 -0
- package/build/types-scss/src/shared/components/Modal/base-theme.scss.d.ts +5 -0
- package/build/types-scss/src/shared/components/PageLayout/base-theme.scss.d.ts +6 -0
- package/build/types-scss/src/shared/components/ScalableRect/style.scss.d.ts +2 -0
- package/build/types-scss/src/shared/components/Throbber/theme.scss.d.ts +6 -0
- package/build/types-scss/src/shared/components/WithTooltip/default-theme.scss.d.ts +7 -0
- package/build/types-scss/src/shared/components/YouTubeVideo/base.scss.d.ts +5 -0
- package/build/types-scss/src/shared/components/YouTubeVideo/throbber.scss.d.ts +4 -0
- package/config/eslint/jest.json +3 -2
- package/config/eslint/typescript.js +34 -0
- package/config/jest/default.js +3 -3
- package/package.json +74 -32
- package/src/client/getInj.ts +43 -0
- package/src/client/index.tsx +40 -0
- package/src/client/init.ts +47 -0
- package/src/index.ts +58 -0
- package/src/server/Cache.ts +68 -0
- package/src/server/index.ts +230 -0
- package/src/server/renderer.tsx +604 -0
- package/src/server/server.ts +309 -0
- package/src/server/utils/errors.ts +135 -0
- package/src/server/utils/index.ts +3 -0
- package/src/shared/components/Button/index.tsx +146 -0
- package/src/shared/components/Button/style.scss +53 -0
- package/src/shared/components/Checkbox/index.tsx +71 -0
- package/src/shared/components/Checkbox/theme.scss +43 -0
- package/src/shared/components/Dropdown/index.tsx +144 -0
- package/src/shared/components/Dropdown/theme.scss +63 -0
- package/src/shared/components/GenericLink/index.tsx +157 -0
- package/src/shared/components/GenericLink/style.scss +3 -0
- package/src/shared/components/Input/index.tsx +59 -0
- package/src/shared/components/Input/theme.scss +27 -0
- package/src/shared/components/Link.tsx +21 -0
- package/src/shared/components/MetaTags.tsx +170 -0
- package/src/shared/components/Modal/base-theme.scss +38 -0
- package/src/shared/components/Modal/index.tsx +144 -0
- package/src/shared/components/Modal/styles.scss +5 -0
- package/src/shared/components/NavLink.tsx +13 -0
- package/src/shared/components/PageLayout/base-theme.scss +30 -0
- package/src/shared/components/PageLayout/index.tsx +76 -0
- package/src/shared/components/ScalableRect/index.tsx +84 -0
- package/src/shared/components/ScalableRect/style.scss +10 -0
- package/src/shared/components/Throbber/index.tsx +43 -0
- package/src/shared/components/Throbber/theme.scss +26 -0
- package/src/shared/components/WithTooltip/Tooltip.tsx +353 -0
- package/src/shared/components/WithTooltip/default-theme.scss +36 -0
- package/src/shared/components/WithTooltip/index.tsx +204 -0
- package/src/shared/components/YouTubeVideo/base.scss +13 -0
- package/src/shared/components/YouTubeVideo/index.tsx +96 -0
- package/src/shared/components/YouTubeVideo/throbber.scss +11 -0
- package/src/shared/components/index.ts +17 -0
- package/src/shared/utils/config.ts +21 -0
- package/src/shared/utils/globalState.ts +29 -0
- package/src/shared/utils/index.ts +105 -0
- package/src/shared/utils/isomorphy/buildInfo.ts +54 -0
- package/src/shared/utils/isomorphy/environment-check.ts +18 -0
- package/src/shared/utils/isomorphy/index.ts +38 -0
- package/src/shared/utils/jest/E2eSsrEnv.ts +250 -0
- package/src/shared/utils/jest/global.ts +19 -0
- package/src/shared/utils/jest/index.tsx +157 -0
- package/src/shared/utils/splitComponent.tsx +255 -0
- package/src/shared/utils/time.ts +118 -0
- package/src/shared/utils/webpack.ts +45 -0
- package/src/styles/_global/reset.css +52 -0
- package/src/styles/global.scss +11 -0
- package/tsconfig.configs.json +18 -0
- package/tsconfig.json +27 -0
- package/tsconfig.types.json +53 -0
- package/typed-scss-modules.config.ts +9 -0
- package/types.d.ts +37 -0
- package/{webpack.config.js → webpack.config.ts} +7 -3
- package/config/babel/node-ssr.js +0 -85
- package/config/babel/webpack.js +0 -123
- package/config/webpack/app-base.js +0 -330
- package/config/webpack/app-development.js +0 -80
- package/config/webpack/app-production.js +0 -60
- package/config/webpack/lib-base.js +0 -155
- package/config/webpack/lib-development.js +0 -45
- package/config/webpack/lib-production.js +0 -44
|
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = void 0;
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
8
|
var _reactThemes = _interopRequireDefault(require("@dr.pogodin/react-themes"));
|
|
10
9
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
10
|
const defaultTheme = {
|
|
@@ -25,28 +24,21 @@ const defaultTheme = {
|
|
|
25
24
|
* @param {...any} [props....]
|
|
26
25
|
* [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
|
|
27
26
|
*/
|
|
28
|
-
|
|
27
|
+
const Throbber = ({
|
|
29
28
|
theme
|
|
30
|
-
}) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
}
|
|
42
|
-
Throbber.defaultProps = {
|
|
43
|
-
theme: {}
|
|
44
|
-
};
|
|
29
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
30
|
+
className: (theme.container ? theme.container + " " : "") + "-dr-pogodin-react-utils___src-shared-components-Throbber-theme___container___7zdld4",
|
|
31
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
32
|
+
className: (theme.circle ? theme.circle + " " : "") + "-dr-pogodin-react-utils___src-shared-components-Throbber-theme___circle___dBrB4g"
|
|
33
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
34
|
+
className: (theme.circle ? theme.circle + " " : "") + "-dr-pogodin-react-utils___src-shared-components-Throbber-theme___circle___dBrB4g"
|
|
35
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
36
|
+
className: (theme.circle ? theme.circle + " " : "") + "-dr-pogodin-react-utils___src-shared-components-Throbber-theme___circle___dBrB4g"
|
|
37
|
+
})]
|
|
38
|
+
});
|
|
39
|
+
const ThemedThrobber = (0, _reactThemes.default)(Throbber, 'Throbber', ['circle', 'container'], defaultTheme);
|
|
45
40
|
Throbber.propTypes = {
|
|
46
|
-
theme:
|
|
47
|
-
container: _propTypes.default.string,
|
|
48
|
-
circle: _propTypes.default.string
|
|
49
|
-
})
|
|
41
|
+
theme: ThemedThrobber.themeType.isRequired
|
|
50
42
|
};
|
|
51
|
-
var _default = exports.default =
|
|
43
|
+
var _default = exports.default = ThemedThrobber;
|
|
52
44
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["
|
|
1
|
+
{"version":3,"file":"index.js","names":["_reactThemes","_interopRequireDefault","require","_jsxRuntime","defaultTheme","Throbber","theme","jsxs","className","container","children","jsx","circle","ThemedThrobber","themed","propTypes","themeType","isRequired","_default","exports","default"],"sources":["../../../../../src/shared/components/Throbber/index.tsx"],"sourcesContent":["import themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropsT = {\n theme: Theme & {\n container?: string;\n circle?: string;\n };\n};\n\n/**\n * Throbber is an \"action in progress\" indicator, which renders\n * three bouncing circles as a simple pending activity indicator,\n * and can be further themed to a certain degree.\n * @param {object} [props] Component properties.\n * @param {ThrobberTheme} [props.theme] _Ad hoc_ theme.\n * @param {...any} [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Throbber: React.FunctionComponent<PropsT> = ({ theme }) => (\n <span className={theme.container} styleName=\"container\">\n <span className={theme.circle} styleName=\"circle\" />\n <span className={theme.circle} styleName=\"circle\" />\n <span className={theme.circle} styleName=\"circle\" />\n </span>\n);\n\nconst ThemedThrobber = themed(\n Throbber,\n 'Throbber',\n [\n 'circle',\n 'container',\n ],\n defaultTheme,\n);\n\nThrobber.propTypes = {\n theme: ThemedThrobber.themeType.isRequired,\n};\n\nexport default ThemedThrobber;\n"],"mappings":";;;;;;;AAAA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA8D,IAAAC,WAAA,GAAAD,OAAA;AAAA,MAAAE,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAW9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,QAAyC,GAAGA,CAAC;EAAEC;AAAM,CAAC,kBAC1D,IAAAH,WAAA,CAAAI,IAAA;EAAMC,SAAS,GAAEF,KAAK,CAACG,SAAS,GAAfH,KAAK,CAACG,SAAS,oGAAC;EAAAC,QAAA,gBAC/B,IAAAP,WAAA,CAAAQ,GAAA;IAAMH,SAAS,GAAEF,KAAK,CAACM,MAAM,GAAZN,KAAK,CAACM,MAAM;EAAC,CAAqB,CAAC,eACpD,IAAAT,WAAA,CAAAQ,GAAA;IAAMH,SAAS,GAAEF,KAAK,CAACM,MAAM,GAAZN,KAAK,CAACM,MAAM;EAAC,CAAqB,CAAC,eACpD,IAAAT,WAAA,CAAAQ,GAAA;IAAMH,SAAS,GAAEF,KAAK,CAACM,MAAM,GAAZN,KAAK,CAACM,MAAM;EAAC,CAAqB,CAAC;AAAA,CAChD,CACP;AAED,MAAMC,cAAc,GAAG,IAAAC,oBAAM,EAC3BT,QAAQ,EACR,UAAU,EACV,CACE,QAAQ,EACR,WAAW,CACZ,EACDD,YACF,CAAC;AAEDC,QAAQ,CAACU,SAAS,GAAG;EACnBT,KAAK,EAAEO,cAAc,CAACG,SAAS,CAACC;AAClC,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEaP,cAAc"}
|
|
@@ -14,18 +14,17 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
14
14
|
* performance during animation.
|
|
15
15
|
*/
|
|
16
16
|
/* global document, window */
|
|
17
|
-
|
|
18
17
|
/* Valid placements of the rendered tooltip. They will be overriden when
|
|
19
18
|
* necessary to fit the tooltip within the viewport. */
|
|
20
|
-
|
|
21
|
-
ABOVE_CURSOR
|
|
22
|
-
ABOVE_ELEMENT
|
|
23
|
-
BELOW_CURSOR
|
|
24
|
-
BELOW_ELEMENT
|
|
25
|
-
|
|
19
|
+
let PLACEMENTS = exports.PLACEMENTS = /*#__PURE__*/function (PLACEMENTS) {
|
|
20
|
+
PLACEMENTS["ABOVE_CURSOR"] = "ABOVE_CURSOR";
|
|
21
|
+
PLACEMENTS["ABOVE_ELEMENT"] = "ABOVE_ELEMENT";
|
|
22
|
+
PLACEMENTS["BELOW_CURSOR"] = "BELOW_CURSOR";
|
|
23
|
+
PLACEMENTS["BELOW_ELEMENT"] = "BELOW_ELEMENT";
|
|
24
|
+
return PLACEMENTS;
|
|
25
|
+
}({});
|
|
26
26
|
const ARROW_STYLE_DOWN = ['border-bottom-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');
|
|
27
27
|
const ARROW_STYLE_UP = ['border-top-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');
|
|
28
|
-
|
|
29
28
|
/**
|
|
30
29
|
* Creates tooltip components.
|
|
31
30
|
* @ignore
|
|
@@ -50,14 +49,13 @@ function createTooltipComponents(theme) {
|
|
|
50
49
|
content
|
|
51
50
|
};
|
|
52
51
|
}
|
|
53
|
-
|
|
54
52
|
/**
|
|
55
53
|
* Generates bounding client rectangles for tooltip components.
|
|
56
54
|
* @ignore
|
|
57
|
-
* @param
|
|
58
|
-
* @param
|
|
59
|
-
* @param
|
|
60
|
-
* @return
|
|
55
|
+
* @param tooltip DOM references to the tooltip components.
|
|
56
|
+
* @param tooltip.arrow
|
|
57
|
+
* @param tooltip.container
|
|
58
|
+
* @return Object holding tooltip rectangles in
|
|
61
59
|
* two fields.
|
|
62
60
|
*/
|
|
63
61
|
function calcTooltipRects(tooltip) {
|
|
@@ -181,13 +179,13 @@ function xPageFitCorrection(x, y, pos, pageXOffset, pageXWidth) {
|
|
|
181
179
|
* Sets positions of tooltip components to point the tooltip to the specified
|
|
182
180
|
* page point.
|
|
183
181
|
* @ignore
|
|
184
|
-
* @param
|
|
185
|
-
* @param
|
|
186
|
-
* @param
|
|
187
|
-
* @param
|
|
188
|
-
* @param
|
|
189
|
-
* @param
|
|
190
|
-
* @param
|
|
182
|
+
* @param pageX
|
|
183
|
+
* @param pageY
|
|
184
|
+
* @param placement
|
|
185
|
+
* @param element DOM reference to the element wrapped by the tooltip.
|
|
186
|
+
* @param tooltip
|
|
187
|
+
* @param tooltip.arrow DOM reference to the tooltip arrow.
|
|
188
|
+
* @param tooltip.container DOM reference to the tooltip container.
|
|
191
189
|
*/
|
|
192
190
|
function setComponentPositions(pageX, pageY, placement, element, tooltip) {
|
|
193
191
|
const tooltipRects = calcTooltipRects(tooltip);
|
|
@@ -276,7 +274,7 @@ const Tooltip = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
276
274
|
});
|
|
277
275
|
Tooltip.propTypes = {
|
|
278
276
|
children: _propTypes.default.node,
|
|
279
|
-
theme: _propTypes.default.shape().isRequired
|
|
277
|
+
theme: _propTypes.default.shape({}).isRequired
|
|
280
278
|
};
|
|
281
279
|
Tooltip.defaultProps = {
|
|
282
280
|
children: null
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","names":["_react","require","_reactDom","_propTypes","_interopRequireDefault","PLACEMENTS","exports","ABOVE_CURSOR","ABOVE_ELEMENT","BELOW_CURSOR","BELOW_ELEMENT","ARROW_STYLE_DOWN","join","ARROW_STYLE_UP","createTooltipComponents","theme","arrow","document","createElement","setAttribute","content","container","appendChild","body","calcTooltipRects","tooltip","getBoundingClientRect","calcViewportRect","scrollX","scrollY","window","documentElement","clientHeight","clientWidth","left","right","top","bottom","calcPositionAboveXY","x","y","tooltipRects","arrowX","width","arrowY","height","containerX","containerY","baseArrowStyle","setComponentPositions","pageX","pageY","placement","element","viewportRect","pos","Math","max","maxX","min","containerStyle","arrowStyle","Tooltip","forwardRef","children","ref","current","heap","useRef","lastElement","undefined","lastPageX","lastPageY","lastPlacement","components","setComponents","useState","pointTo","useImperativeHandle","useEffect","removeChild","createPortal","propTypes","PT","node","shape","isRequired","defaultProps","_default","default"],"sources":["../../../../../src/shared/components/WithTooltip/Tooltip.jsx"],"sourcesContent":["/**\n * The actual tooltip component. It is rendered outside the regular document\n * hierarchy, and with sub-components managed without React to achieve the best\n * performance during animation.\n */\n/* global document, window */\n\nimport {\n forwardRef,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport PT from 'prop-types';\n\n/* Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport. */\nexport const PLACEMENTS = {\n ABOVE_CURSOR: 'ABOVE_CURSOR',\n ABOVE_ELEMENT: 'ABOVE_ELEMENT',\n BELOW_CURSOR: 'BELOW_CURSOR',\n BELOW_ELEMENT: 'BELOW_ELEMENT',\n};\n\nconst ARROW_STYLE_DOWN = [\n 'border-bottom-color:transparent',\n 'border-left-color:transparent',\n 'border-right-color:transparent',\n].join(';');\n\nconst ARROW_STYLE_UP = [\n 'border-top-color:transparent',\n 'border-left-color:transparent',\n 'border-right-color:transparent',\n].join(';');\n\n/**\n * Creates tooltip components.\n * @ignore\n * @param {object} theme Themes to use for tooltip container, arrow,\n * and content.\n * @return {object} Object with DOM references to the container components:\n * container, arrow, content.\n */\nfunction createTooltipComponents(theme) {\n const arrow = document.createElement('div');\n if (theme.arrow) arrow.setAttribute('class', theme.arrow);\n\n const content = document.createElement('div');\n if (theme.content) content.setAttribute('class', theme.content);\n\n const container = document.createElement('div');\n if (theme.container) container.setAttribute('class', theme.container);\n\n container.appendChild(arrow);\n container.appendChild(content);\n document.body.appendChild(container);\n\n return { container, arrow, content };\n}\n\n/**\n * Generates bounding client rectangles for tooltip components.\n * @ignore\n * @param {object} tooltip DOM references to the tooltip components.\n * @param {object} tooltip.arrow\n * @param {object} tooltip.container\n * @return {{ arrow: object, container}} Object holding tooltip rectangles in\n * two fields.\n */\nfunction calcTooltipRects(tooltip) {\n return {\n arrow: tooltip.arrow.getBoundingClientRect(),\n container: tooltip.container.getBoundingClientRect(),\n };\n}\n\n/**\n * Calculates the document viewport size.\n * @ignore\n * @return {{x, y, width, height}}\n */\nfunction calcViewportRect() {\n const { scrollX, scrollY } = window;\n const { documentElement: { clientHeight, clientWidth } } = document;\n return {\n left: scrollX,\n right: scrollX + clientWidth,\n top: scrollY,\n bottom: scrollY + clientHeight,\n };\n}\n\n/**\n * Calculates tooltip and arrow positions for the placement just above\n * the cursor.\n * @ignore\n * @param {number} x Cursor page-x position.\n * @param {number} y Cursor page-y position.\n * @param {object} tooltipRects Bounding client rectangles of tooltip parts.\n * @param {object} tooltipRects.arrow\n * @param {object} tooltipRects.container\n * @return {object} Contains the following fields:\n * - {number} arrowX\n * - {number} arrowY\n * - {number} containerX\n * - {number} containerY\n * - {string} baseArrowStyle\n */\nfunction calcPositionAboveXY(x, y, tooltipRects) {\n const { arrow, container } = tooltipRects;\n return {\n arrowX: 0.5 * (container.width - arrow.width),\n arrowY: container.height,\n containerX: x - container.width / 2,\n containerY: y - container.height - arrow.height / 1.5,\n\n // TODO: Instead of already setting the base style here, we should\n // introduce a set of constants for arrow directions, which will help\n // to do checks dependant on the arrow direction.\n baseArrowStyle: ARROW_STYLE_DOWN,\n };\n}\n\n/*\nconst HIT = {\n NONE: false,\n LEFT: 'LEFT',\n RIGHT: 'RIGHT',\n TOP: 'TOP',\n BOTTOM: 'BOTTOM',\n};\n*/\n\n/**\n * Checks whether\n * @param {object} pos\n * @param {object} tooltipRects\n * @param {object} viewportRect\n * @return {HIT}\n */\n/*\nfunction checkViewportFit(pos, tooltipRects, viewportRect) {\n const { containerX, containerY } = pos;\n if (containerX < viewportRect.left + 6) return HIT.LEFT;\n if (containerX > viewportRect.right - 6) return HIT.RIGHT;\n return HIT.NONE;\n}\n*/\n\n/**\n * Shifts tooltip horizontally to fit into the viewport, while keeping\n * the arrow pointed to the XY point.\n * @param {number} x\n * @param {number} y\n * @param {object} pos\n * @param {number} pageXOffset\n * @param {number} pageXWidth\n */\n/*\nfunction xPageFitCorrection(x, y, pos, pageXOffset, pageXWidth) {\n if (pos.containerX < pageXOffset + 6) {\n pos.containerX = pageXOffset + 6;\n pos.arrowX = Math.max(6, pageX - containerX - arrowRect.width / 2);\n } else {\n const maxX = pageXOffset + docRect.width - containerRect.width - 6;\n if (containerX > maxX) {\n containerX = maxX;\n arrowX = Math.min(\n containerRect.width - 6,\n pageX - containerX - arrowRect.width / 2,\n );\n }\n }\n}\n*/\n\n/**\n * Sets positions of tooltip components to point the tooltip to the specified\n * page point.\n * @ignore\n * @param {number} pageX\n * @param {number} pageY\n * @param {PLACEMENTS} placement\n * @param {object} element DOM reference to the element wrapped by the tooltip.\n * @param {object} tooltip\n * @param {object} tooltip.arrow DOM reference to the tooltip arrow.\n * @param {object} tooltip.container DOM reference to the tooltip container.\n */\nfunction setComponentPositions(\n pageX,\n pageY,\n placement,\n element,\n tooltip,\n) {\n const tooltipRects = calcTooltipRects(tooltip);\n const viewportRect = calcViewportRect();\n\n /* Default container coords: tooltip at the top. */\n const pos = calcPositionAboveXY(pageX, pageY, tooltipRects);\n\n if (pos.containerX < viewportRect.left + 6) {\n pos.containerX = viewportRect.left + 6;\n pos.arrowX = Math.max(\n 6,\n pageX - pos.containerX - tooltipRects.arrow.width / 2,\n );\n } else {\n const maxX = viewportRect.right - 6 - tooltipRects.container.width;\n if (pos.containerX > maxX) {\n pos.containerX = maxX;\n pos.arrowX = Math.min(\n tooltipRects.container.width - 6,\n pageX - pos.containerX - tooltipRects.arrow.width / 2,\n );\n }\n }\n\n /* If tooltip has not enough space on top - make it bottom tooltip. */\n if (pos.containerY < viewportRect.top + 6) {\n pos.containerY += tooltipRects.container.height\n + 2 * tooltipRects.arrow.height;\n pos.arrowY -= tooltipRects.container.height\n + tooltipRects.arrow.height;\n pos.baseArrowStyle = ARROW_STYLE_UP;\n }\n\n const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n tooltip.container.setAttribute('style', containerStyle);\n\n const arrowStyle = `${pos.baseArrowStyle};left:${pos.arrowX}px;top:${pos.arrowY}px`;\n tooltip.arrow.setAttribute('style', arrowStyle);\n}\n\n/* The Tooltip component itself. */\nconst Tooltip = forwardRef(({ children, theme }, ref) => {\n // NOTE: The way it has to be implemented, for clean mounting and unmounting\n // at the client side, the <Tooltip> is fully mounted into DOM in the next\n // rendering cycles, and only then it can be correctly measured and positioned.\n // Thus, when we create the <Tooltip> we have to record its target positioning\n // details, and then apply them when it is created.\n\n const { current: heap } = useRef({\n lastElement: undefined,\n lastPageX: 0,\n lastPageY: 0,\n lastPlacement: undefined,\n });\n\n const [components, setComponents] = useState(null);\n\n const pointTo = (pageX, pageY, placement, element) => {\n heap.lastElement = element;\n heap.lastPageX = pageX;\n heap.lastPageY = pageY;\n heap.lastPlacement = placement;\n\n if (components) {\n setComponentPositions(pageX, pageY, placement, element, components);\n }\n };\n useImperativeHandle(ref, () => ({ pointTo }));\n\n /* Inits and destroys tooltip components. */\n useEffect(() => {\n const x = createTooltipComponents(theme);\n setComponents(x);\n return () => {\n document.body.removeChild(x.container);\n setComponents(null);\n };\n }, [theme]);\n\n useEffect(() => {\n if (components) {\n setComponentPositions(\n heap.lastPageX,\n heap.lastPageY,\n heap.lastPlacement,\n heap.lastElement,\n components,\n );\n }\n }, [\n components,\n // BEWARE: Careful about these dependencies - they are updated when mouse\n // is moved over the tool-tipped element, thus potentially may cause\n // unnecessary firing of this effect on each mouse event. It does not\n // happen now just because the mouse movements themselves are not causing\n // the component re-rendering, thus dependencies of this effect are not\n // really re-evaluated.\n heap.lastPageX,\n heap.lastPageY,\n heap.lastPlacement,\n heap.lastElement,\n ]);\n\n return components ? createPortal(children, components.content) : null;\n});\n\nTooltip.propTypes = {\n children: PT.node,\n theme: PT.shape().isRequired,\n};\n\nTooltip.defaultProps = {\n children: null,\n};\n\nexport default Tooltip;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":["_react","require","_reactDom","_propTypes","_interopRequireDefault","PLACEMENTS","exports","ARROW_STYLE_DOWN","join","ARROW_STYLE_UP","createTooltipComponents","theme","arrow","document","createElement","setAttribute","content","container","appendChild","body","calcTooltipRects","tooltip","getBoundingClientRect","calcViewportRect","scrollX","scrollY","window","documentElement","clientHeight","clientWidth","left","right","top","bottom","calcPositionAboveXY","x","y","tooltipRects","arrowX","width","arrowY","height","containerX","containerY","baseArrowStyle","setComponentPositions","pageX","pageY","placement","element","viewportRect","pos","Math","max","maxX","min","containerStyle","arrowStyle","Tooltip","forwardRef","children","ref","current","heap","useRef","lastElement","undefined","lastPageX","lastPageY","lastPlacement","components","setComponents","useState","pointTo","useImperativeHandle","useEffect","removeChild","createPortal","propTypes","PT","node","shape","isRequired","defaultProps","_default","default"],"sources":["../../../../../src/shared/components/WithTooltip/Tooltip.tsx"],"sourcesContent":["/**\n * The actual tooltip component. It is rendered outside the regular document\n * hierarchy, and with sub-components managed without React to achieve the best\n * performance during animation.\n */\n/* global document, window */\n\nimport {\n type ReactNode,\n forwardRef,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport PT from 'prop-types';\n\n/* Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport. */\nexport enum PLACEMENTS {\n ABOVE_CURSOR = 'ABOVE_CURSOR',\n ABOVE_ELEMENT = 'ABOVE_ELEMENT',\n BELOW_CURSOR = 'BELOW_CURSOR',\n BELOW_ELEMENT = 'BELOW_ELEMENT',\n}\n\nconst ARROW_STYLE_DOWN = [\n 'border-bottom-color:transparent',\n 'border-left-color:transparent',\n 'border-right-color:transparent',\n].join(';');\n\nconst ARROW_STYLE_UP = [\n 'border-top-color:transparent',\n 'border-left-color:transparent',\n 'border-right-color:transparent',\n].join(';');\n\ntype ComponentsT = {\n container: HTMLDivElement;\n arrow: HTMLDivElement;\n content: HTMLDivElement;\n};\n\ntype HeapT = {\n lastElement?: HTMLElement;\n lastPageX: number;\n lastPageY: number;\n lastPlacement?: PLACEMENTS | undefined;\n};\n\nexport interface TooltipThemeT {\n appearance?: string;\n arrow?: string;\n content?: string;\n container?: string;\n}\n\n/**\n * Creates tooltip components.\n * @ignore\n * @param {object} theme Themes to use for tooltip container, arrow,\n * and content.\n * @return {object} Object with DOM references to the container components:\n * container, arrow, content.\n */\nfunction createTooltipComponents(theme: TooltipThemeT): ComponentsT {\n const arrow = document.createElement('div');\n if (theme.arrow) arrow.setAttribute('class', theme.arrow);\n\n const content = document.createElement('div');\n if (theme.content) content.setAttribute('class', theme.content);\n\n const container = document.createElement('div');\n if (theme.container) container.setAttribute('class', theme.container);\n\n container.appendChild(arrow);\n container.appendChild(content);\n document.body.appendChild(container);\n\n return { container, arrow, content };\n}\n\ntype TooltipRectsT = {\n arrow: DOMRect;\n container: DOMRect;\n};\n\n/**\n * Generates bounding client rectangles for tooltip components.\n * @ignore\n * @param tooltip DOM references to the tooltip components.\n * @param tooltip.arrow\n * @param tooltip.container\n * @return Object holding tooltip rectangles in\n * two fields.\n */\nfunction calcTooltipRects(tooltip: ComponentsT): TooltipRectsT {\n return {\n arrow: tooltip.arrow.getBoundingClientRect(),\n container: tooltip.container.getBoundingClientRect(),\n };\n}\n\n/**\n * Calculates the document viewport size.\n * @ignore\n * @return {{x, y, width, height}}\n */\nfunction calcViewportRect() {\n const { scrollX, scrollY } = window;\n const { documentElement: { clientHeight, clientWidth } } = document;\n return {\n left: scrollX,\n right: scrollX + clientWidth,\n top: scrollY,\n bottom: scrollY + clientHeight,\n };\n}\n\n/**\n * Calculates tooltip and arrow positions for the placement just above\n * the cursor.\n * @ignore\n * @param {number} x Cursor page-x position.\n * @param {number} y Cursor page-y position.\n * @param {object} tooltipRects Bounding client rectangles of tooltip parts.\n * @param {object} tooltipRects.arrow\n * @param {object} tooltipRects.container\n * @return {object} Contains the following fields:\n * - {number} arrowX\n * - {number} arrowY\n * - {number} containerX\n * - {number} containerY\n * - {string} baseArrowStyle\n */\nfunction calcPositionAboveXY(\n x: number,\n y: number,\n tooltipRects: TooltipRectsT,\n) {\n const { arrow, container } = tooltipRects;\n return {\n arrowX: 0.5 * (container.width - arrow.width),\n arrowY: container.height,\n containerX: x - container.width / 2,\n containerY: y - container.height - arrow.height / 1.5,\n\n // TODO: Instead of already setting the base style here, we should\n // introduce a set of constants for arrow directions, which will help\n // to do checks dependant on the arrow direction.\n baseArrowStyle: ARROW_STYLE_DOWN,\n };\n}\n\n/*\nconst HIT = {\n NONE: false,\n LEFT: 'LEFT',\n RIGHT: 'RIGHT',\n TOP: 'TOP',\n BOTTOM: 'BOTTOM',\n};\n*/\n\n/**\n * Checks whether\n * @param {object} pos\n * @param {object} tooltipRects\n * @param {object} viewportRect\n * @return {HIT}\n */\n/*\nfunction checkViewportFit(pos, tooltipRects, viewportRect) {\n const { containerX, containerY } = pos;\n if (containerX < viewportRect.left + 6) return HIT.LEFT;\n if (containerX > viewportRect.right - 6) return HIT.RIGHT;\n return HIT.NONE;\n}\n*/\n\n/**\n * Shifts tooltip horizontally to fit into the viewport, while keeping\n * the arrow pointed to the XY point.\n * @param {number} x\n * @param {number} y\n * @param {object} pos\n * @param {number} pageXOffset\n * @param {number} pageXWidth\n */\n/*\nfunction xPageFitCorrection(x, y, pos, pageXOffset, pageXWidth) {\n if (pos.containerX < pageXOffset + 6) {\n pos.containerX = pageXOffset + 6;\n pos.arrowX = Math.max(6, pageX - containerX - arrowRect.width / 2);\n } else {\n const maxX = pageXOffset + docRect.width - containerRect.width - 6;\n if (containerX > maxX) {\n containerX = maxX;\n arrowX = Math.min(\n containerRect.width - 6,\n pageX - containerX - arrowRect.width / 2,\n );\n }\n }\n}\n*/\n\n/**\n * Sets positions of tooltip components to point the tooltip to the specified\n * page point.\n * @ignore\n * @param pageX\n * @param pageY\n * @param placement\n * @param element DOM reference to the element wrapped by the tooltip.\n * @param tooltip\n * @param tooltip.arrow DOM reference to the tooltip arrow.\n * @param tooltip.container DOM reference to the tooltip container.\n */\nfunction setComponentPositions(\n pageX: number,\n pageY: number,\n placement: PLACEMENTS | undefined,\n element: HTMLElement | undefined,\n tooltip: ComponentsT,\n) {\n const tooltipRects = calcTooltipRects(tooltip);\n const viewportRect = calcViewportRect();\n\n /* Default container coords: tooltip at the top. */\n const pos = calcPositionAboveXY(pageX, pageY, tooltipRects);\n\n if (pos.containerX < viewportRect.left + 6) {\n pos.containerX = viewportRect.left + 6;\n pos.arrowX = Math.max(\n 6,\n pageX - pos.containerX - tooltipRects.arrow.width / 2,\n );\n } else {\n const maxX = viewportRect.right - 6 - tooltipRects.container.width;\n if (pos.containerX > maxX) {\n pos.containerX = maxX;\n pos.arrowX = Math.min(\n tooltipRects.container.width - 6,\n pageX - pos.containerX - tooltipRects.arrow.width / 2,\n );\n }\n }\n\n /* If tooltip has not enough space on top - make it bottom tooltip. */\n if (pos.containerY < viewportRect.top + 6) {\n pos.containerY += tooltipRects.container.height\n + 2 * tooltipRects.arrow.height;\n pos.arrowY -= tooltipRects.container.height\n + tooltipRects.arrow.height;\n pos.baseArrowStyle = ARROW_STYLE_UP;\n }\n\n const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n tooltip.container.setAttribute('style', containerStyle);\n\n const arrowStyle = `${pos.baseArrowStyle};left:${pos.arrowX}px;top:${pos.arrowY}px`;\n tooltip.arrow.setAttribute('style', arrowStyle);\n}\n\n/* The Tooltip component itself. */\nconst Tooltip = forwardRef<unknown, {\n children?: ReactNode;\n theme: any;\n}>(({ children, theme }, ref) => {\n // NOTE: The way it has to be implemented, for clean mounting and unmounting\n // at the client side, the <Tooltip> is fully mounted into DOM in the next\n // rendering cycles, and only then it can be correctly measured and positioned.\n // Thus, when we create the <Tooltip> we have to record its target positioning\n // details, and then apply them when it is created.\n\n const { current: heap } = useRef<HeapT>({\n lastElement: undefined,\n lastPageX: 0,\n lastPageY: 0,\n lastPlacement: undefined,\n });\n\n const [components, setComponents] = useState<ComponentsT | null>(null);\n\n const pointTo = (\n pageX: number,\n pageY: number,\n placement: PLACEMENTS,\n element: HTMLElement,\n ) => {\n heap.lastElement = element;\n heap.lastPageX = pageX;\n heap.lastPageY = pageY;\n heap.lastPlacement = placement;\n\n if (components) {\n setComponentPositions(pageX, pageY, placement, element, components);\n }\n };\n useImperativeHandle(ref, () => ({ pointTo }));\n\n /* Inits and destroys tooltip components. */\n useEffect(() => {\n const x = createTooltipComponents(theme);\n setComponents(x);\n return () => {\n document.body.removeChild(x.container);\n setComponents(null);\n };\n }, [theme]);\n\n useEffect(() => {\n if (components) {\n setComponentPositions(\n heap.lastPageX,\n heap.lastPageY,\n heap.lastPlacement,\n heap.lastElement,\n components,\n );\n }\n }, [\n components,\n // BEWARE: Careful about these dependencies - they are updated when mouse\n // is moved over the tool-tipped element, thus potentially may cause\n // unnecessary firing of this effect on each mouse event. It does not\n // happen now just because the mouse movements themselves are not causing\n // the component re-rendering, thus dependencies of this effect are not\n // really re-evaluated.\n heap.lastPageX,\n heap.lastPageY,\n heap.lastPlacement,\n heap.lastElement,\n ]);\n\n return components ? createPortal(children, components.content) : null;\n});\n\nTooltip.propTypes = {\n children: PT.node,\n theme: PT.shape({}).isRequired,\n};\n\nTooltip.defaultProps = {\n children: null,\n};\n\nexport default Tooltip;\n"],"mappings":"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"}
|
|
@@ -7,11 +7,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _react = require("react");
|
|
10
|
-
var
|
|
10
|
+
var _reactThemes = _interopRequireDefault(require("@dr.pogodin/react-themes"));
|
|
11
11
|
var _Tooltip = _interopRequireWildcard(require("./Tooltip"));
|
|
12
12
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
14
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
15
|
/* global window */
|
|
16
16
|
const defaultTheme = {
|
|
17
17
|
"ad": "-dr-pogodin-react-utils___src-shared-components-WithTooltip-default-theme___ad___4xT7zE",
|
|
@@ -37,12 +37,12 @@ const defaultTheme = {
|
|
|
37
37
|
* _e.g._ a tooltip text. This will be the tooltip content.
|
|
38
38
|
* @param {WithTooltipTheme} props.theme _Ad hoc_ theme.
|
|
39
39
|
*/
|
|
40
|
-
|
|
40
|
+
const Wrapper = ({
|
|
41
41
|
children,
|
|
42
42
|
placement,
|
|
43
43
|
tip,
|
|
44
44
|
theme
|
|
45
|
-
}) {
|
|
45
|
+
}) => {
|
|
46
46
|
const {
|
|
47
47
|
current: heap
|
|
48
48
|
} = (0, _react.useRef)({
|
|
@@ -52,7 +52,7 @@ function Wrapper({
|
|
|
52
52
|
timerId: undefined
|
|
53
53
|
});
|
|
54
54
|
const tooltipRef = (0, _react.useRef)();
|
|
55
|
-
const wrapperRef = (0, _react.useRef)();
|
|
55
|
+
const wrapperRef = (0, _react.useRef)(null);
|
|
56
56
|
const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
|
|
57
57
|
const updatePortalPosition = (cursorX, cursorY) => {
|
|
58
58
|
if (!showTooltip) {
|
|
@@ -121,9 +121,10 @@ function Wrapper({
|
|
|
121
121
|
children: tip
|
|
122
122
|
}) : null, children]
|
|
123
123
|
});
|
|
124
|
-
}
|
|
125
|
-
const ThemedWrapper = (0,
|
|
126
|
-
|
|
124
|
+
};
|
|
125
|
+
const ThemedWrapper = (0, _reactThemes.default)(Wrapper, 'WithTooltip', ['appearance', 'arrow', 'container', 'content', 'wrapper'], defaultTheme);
|
|
126
|
+
const e = ThemedWrapper;
|
|
127
|
+
e.PLACEMENTS = _Tooltip.PLACEMENTS;
|
|
127
128
|
Wrapper.propTypes = {
|
|
128
129
|
children: _propTypes.default.node,
|
|
129
130
|
placement: _propTypes.default.oneOf(Object.values(_Tooltip.PLACEMENTS)),
|
|
@@ -135,5 +136,5 @@ Wrapper.defaultProps = {
|
|
|
135
136
|
placement: _Tooltip.PLACEMENTS.ABOVE_CURSOR,
|
|
136
137
|
tip: null
|
|
137
138
|
};
|
|
138
|
-
var _default = exports.default =
|
|
139
|
+
var _default = exports.default = e;
|
|
139
140
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_utils","_Tooltip","_interopRequireWildcard","_jsxRuntime","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","defaultTheme","Wrapper","children","placement","tip","theme","current","heap","useRef","lastCursorX","lastCursorY","triggeredByTouch","timerId","undefined","tooltipRef","wrapperRef","showTooltip","setShowTooltip","useState","updatePortalPosition","cursorX","cursorY","setTimeout","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","useEffect","listener","addEventListener","removeEventListener","jsxs","className","wrapper","onMouseLeave","onMouseMove","e","clientX","clientY","onClick","clearTimeout","onTouchStart","ref","role","jsx","ThemedWrapper","themed","PLACEMENTS","propTypes","PT","node","oneOf","values","themeType","isRequired","defaultProps","ABOVE_CURSOR","_default","exports"],"sources":["../../../../../src/shared/components/WithTooltip/index.jsx"],"sourcesContent":["/* global window */\n\nimport PT from 'prop-types';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { themed } from 'utils';\n\nimport Tooltip, { PLACEMENTS } from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n * <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param {object} props Component properties.\n * @param {React.node} props.tip – Anything React is able to render,\n * _e.g._ a tooltip text. This will be the tooltip content.\n * @param {WithTooltipTheme} props.theme _Ad hoc_ theme.\n */\nfunction Wrapper({\n children,\n placement,\n tip,\n theme,\n}) {\n const { current: heap } = useRef({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined,\n });\n const tooltipRef = useRef();\n const wrapperRef = useRef();\n const [showTooltip, setShowTooltip] = useState(false);\n\n const updatePortalPosition = (cursorX, cursorY) => {\n if (!showTooltip) {\n heap.lastCursorX = cursorX;\n heap.lastCursorY = cursorY;\n\n // If tooltip was triggered by a touch, we delay its opening by a bit,\n // to ensure it was not a touch-click - in the case of touch click we\n // want to do the click, rather than show the tooltip, and the delay\n // gives click handler a chance to abort the tooltip openning.\n if (heap.triggeredByTouch) {\n if (!heap.timerId) {\n heap.timerId = setTimeout(() => {\n heap.triggeredByTouch = false;\n heap.timerId = undefined;\n setShowTooltip(true);\n }, 300);\n }\n\n // Otherwise we can just open the tooltip right away.\n } else setShowTooltip(true);\n } else {\n const wrapperRect = wrapperRef.current.getBoundingClientRect();\n if (\n cursorX < wrapperRect.left\n || cursorX > wrapperRect.right\n || cursorY < wrapperRect.top\n || cursorY > wrapperRect.bottom\n ) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n cursorX + window.scrollX,\n cursorY + window.scrollY,\n placement,\n wrapperRef.current,\n );\n }\n }\n };\n\n useEffect(() => {\n if (showTooltip && tip !== null) {\n // This is necessary to ensure that even when a single mouse event\n // arrives to a tool-tipped component, the tooltip is correctly positioned\n // once opened (because similar call above does not have effect until\n // the tooltip is fully mounted, and that is delayed to future rendering\n // cycle due to the implementation).\n if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n heap.lastCursorX + window.scrollX,\n heap.lastCursorY + window.scrollY,\n placement,\n wrapperRef.current,\n );\n }\n\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [\n heap.lastCursorX,\n heap.lastCursorY,\n placement,\n showTooltip,\n tip,\n ]);\n\n return (\n <div\n className={theme.wrapper}\n onMouseLeave={() => setShowTooltip(false)}\n onMouseMove={(e) => updatePortalPosition(e.clientX, e.clientY)}\n onClick={() => {\n if (heap.timerId) {\n clearTimeout(heap.timerId);\n heap.timerId = undefined;\n heap.triggeredByTouch = false;\n }\n }}\n onTouchStart={() => {\n heap.triggeredByTouch = true;\n }}\n ref={wrapperRef}\n role=\"presentation\"\n >\n {\n showTooltip && tip !== null ? (\n <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n ) : null\n }\n {children}\n </div>\n );\n}\n\nconst ThemedWrapper = themed(\n 'WithTooltip',\n [\n 'appearance',\n 'arrow',\n 'container',\n 'content',\n 'wrapper',\n ],\n defaultTheme,\n)(Wrapper);\n\nThemedWrapper.PLACEMENTS = PLACEMENTS;\n\nWrapper.propTypes = {\n children: PT.node,\n placement: PT.oneOf(Object.values(PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: PT.node,\n};\n\nWrapper.defaultProps = {\n children: null,\n placement: PLACEMENTS.ABOVE_CURSOR,\n tip: null,\n};\n\nexport default ThemedWrapper;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Tooltip","_interopRequireWildcard","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","defaultTheme","Wrapper","children","placement","tip","theme","current","heap","useRef","lastCursorX","lastCursorY","triggeredByTouch","timerId","undefined","tooltipRef","wrapperRef","showTooltip","setShowTooltip","useState","updatePortalPosition","cursorX","cursorY","setTimeout","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","useEffect","listener","addEventListener","removeEventListener","jsxs","className","wrapper","onMouseLeave","onMouseMove","clientX","clientY","onClick","clearTimeout","onTouchStart","ref","role","jsx","ThemedWrapper","themed","PLACEMENTS","propTypes","PT","node","oneOf","values","themeType","isRequired","defaultProps","ABOVE_CURSOR","_default","exports"],"sources":["../../../../../src/shared/components/WithTooltip/index.tsx"],"sourcesContent":["/* global window */\n\nimport PT from 'prop-types';\nimport {\n type ReactNode,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, { PLACEMENTS, type TooltipThemeT } from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\ntype PropsT = {\n children?: ReactNode;\n placement?: PLACEMENTS;\n tip?: ReactNode;\n theme: Theme & TooltipThemeT & {\n wrapper?: string;\n };\n};\n\ntype TooltipRefT = {\n pointTo: (\n x: number,\n y: number,\n placement: PLACEMENTS,\n wrapperRef: HTMLDivElement,\n ) => void;\n};\n\ntype HeapT = {\n lastCursorX: number;\n lastCursorY: number;\n triggeredByTouch: boolean;\n timerId?: NodeJS.Timeout;\n};\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n * <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param {object} props Component properties.\n * @param {React.node} props.tip – Anything React is able to render,\n * _e.g._ a tooltip text. This will be the tooltip content.\n * @param {WithTooltipTheme} props.theme _Ad hoc_ theme.\n */\nconst Wrapper: React.FunctionComponent<PropsT> = ({\n children,\n placement,\n tip,\n theme,\n}) => {\n const { current: heap } = useRef<HeapT>({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined,\n });\n const tooltipRef = useRef<TooltipRefT>();\n const wrapperRef = useRef<HTMLDivElement>(null);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const updatePortalPosition = (cursorX: number, cursorY: number) => {\n if (!showTooltip) {\n heap.lastCursorX = cursorX;\n heap.lastCursorY = cursorY;\n\n // If tooltip was triggered by a touch, we delay its opening by a bit,\n // to ensure it was not a touch-click - in the case of touch click we\n // want to do the click, rather than show the tooltip, and the delay\n // gives click handler a chance to abort the tooltip openning.\n if (heap.triggeredByTouch) {\n if (!heap.timerId) {\n heap.timerId = setTimeout(() => {\n heap.triggeredByTouch = false;\n heap.timerId = undefined;\n setShowTooltip(true);\n }, 300);\n }\n\n // Otherwise we can just open the tooltip right away.\n } else setShowTooltip(true);\n } else {\n const wrapperRect = wrapperRef.current!.getBoundingClientRect();\n if (\n cursorX < wrapperRect.left\n || cursorX > wrapperRect.right\n || cursorY < wrapperRect.top\n || cursorY > wrapperRect.bottom\n ) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n cursorX + window.scrollX,\n cursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n }\n };\n\n useEffect(() => {\n if (showTooltip && tip !== null) {\n // This is necessary to ensure that even when a single mouse event\n // arrives to a tool-tipped component, the tooltip is correctly positioned\n // once opened (because similar call above does not have effect until\n // the tooltip is fully mounted, and that is delayed to future rendering\n // cycle due to the implementation).\n if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n heap.lastCursorX + window.scrollX,\n heap.lastCursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [\n heap.lastCursorX,\n heap.lastCursorY,\n placement,\n showTooltip,\n tip,\n ]);\n\n return (\n <div\n className={theme.wrapper}\n onMouseLeave={() => setShowTooltip(false)}\n onMouseMove={(e) => updatePortalPosition(e.clientX, e.clientY)}\n onClick={() => {\n if (heap.timerId) {\n clearTimeout(heap.timerId);\n heap.timerId = undefined;\n heap.triggeredByTouch = false;\n }\n }}\n onTouchStart={() => {\n heap.triggeredByTouch = true;\n }}\n ref={wrapperRef}\n role=\"presentation\"\n >\n {\n showTooltip && tip !== null ? (\n <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n ) : null\n }\n {children}\n </div>\n );\n};\n\nconst ThemedWrapper = themed(\n Wrapper,\n 'WithTooltip',\n [\n 'appearance',\n 'arrow',\n 'container',\n 'content',\n 'wrapper',\n ],\n defaultTheme,\n);\n\ntype ExportT = typeof ThemedWrapper & {\n PLACEMENTS: typeof PLACEMENTS;\n};\n\nconst e: ExportT = ThemedWrapper as ExportT;\n\ne.PLACEMENTS = PLACEMENTS;\n\nWrapper.propTypes = {\n children: PT.node,\n placement: PT.oneOf(Object.values(PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: PT.node,\n};\n\nWrapper.defaultProps = {\n children: null,\n placement: PLACEMENTS.ABOVE_CURSOR,\n tip: null,\n};\n\nexport default e;\n"],"mappings":"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"}
|
|
@@ -26,31 +26,33 @@ const throbberTheme = {
|
|
|
26
26
|
};
|
|
27
27
|
/**
|
|
28
28
|
* A component for embeding a YouTube video.
|
|
29
|
-
* @param
|
|
30
|
-
* @param
|
|
29
|
+
* @param [props] Component properties.
|
|
30
|
+
* @param [props.autoplay] If `true` the video will start to play
|
|
31
31
|
* automatically once loaded.
|
|
32
|
-
* @param
|
|
32
|
+
* @param [props.src] URL of the video to play. Can be in any of
|
|
33
33
|
* the following formats, and keeps any additional query parameters understood
|
|
34
34
|
* by the YouTube IFrame player:
|
|
35
35
|
* - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`
|
|
36
36
|
* - `https://youtu.be/NdF6Rmt6Ado`
|
|
37
37
|
* - `https://www.youtube.com/embed/NdF6Rmt6Ado`
|
|
38
|
-
* @param
|
|
39
|
-
* @param
|
|
38
|
+
* @param [props.theme] _Ad hoc_ theme.
|
|
39
|
+
* @param [props.title] The `title` attribute to add to the player
|
|
40
40
|
* IFrame.
|
|
41
41
|
*/
|
|
42
|
-
|
|
42
|
+
const YouTubeVideo = ({
|
|
43
43
|
autoplay,
|
|
44
44
|
src,
|
|
45
45
|
theme,
|
|
46
46
|
title
|
|
47
|
-
}) {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
const
|
|
47
|
+
}) => {
|
|
48
|
+
const srcParts = src.split('?');
|
|
49
|
+
let url = srcParts[0];
|
|
50
|
+
const queryString = srcParts[1];
|
|
51
|
+
const query = queryString ? _qs.default.parse(queryString) : {};
|
|
52
|
+
const videoId = query.v || url.match(/\/([a-zA-Z0-9-_]*)$/)?.[1];
|
|
51
53
|
url = `https://www.youtube.com/embed/${videoId}`;
|
|
52
54
|
delete query.v;
|
|
53
|
-
query.autoplay = autoplay ? 1 : 0;
|
|
55
|
+
query.autoplay = autoplay ? '1' : '0';
|
|
54
56
|
url += `?${_qs.default.stringify(query)}`;
|
|
55
57
|
|
|
56
58
|
// TODO: https://developers.google.com/youtube/player_parameters
|
|
@@ -69,8 +71,8 @@ function YouTubeVideo({
|
|
|
69
71
|
title: title
|
|
70
72
|
})]
|
|
71
73
|
});
|
|
72
|
-
}
|
|
73
|
-
const ThemedYouTubeVideo = (0, _reactThemes.default)('YouTubeVideo', ['container', 'video'], baseTheme)
|
|
74
|
+
};
|
|
75
|
+
const ThemedYouTubeVideo = (0, _reactThemes.default)(YouTubeVideo, 'YouTubeVideo', ['container', 'video'], baseTheme);
|
|
74
76
|
YouTubeVideo.propTypes = {
|
|
75
77
|
autoplay: _propTypes.default.bool,
|
|
76
78
|
src: _propTypes.default.string.isRequired,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","_ScalableRect","_Throbber","_jsxRuntime","baseTheme","throbberTheme","YouTubeVideo","autoplay","src","theme","title","url","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","_ScalableRect","_Throbber","_jsxRuntime","baseTheme","throbberTheme","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","qs","parse","videoId","v","match","stringify","jsxs","default","className","container","ratio","children","jsx","allow","allowFullScreen","video","ThemedYouTubeVideo","themed","propTypes","PT","bool","string","isRequired","themeType","defaultProps","_default","exports"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport ScalableRect from 'components/ScalableRect';\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\ntype ComponentThemeT = Theme & {\n container?: string;\n video?: string;\n};\n\ntype PropsT = {\n autoplay?: boolean;\n src: string;\n theme: ComponentThemeT,\n title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n autoplay,\n src,\n theme,\n title,\n}) => {\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs.parse(queryString) : {};\n\n const videoId = query.v || url.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n url = `https://www.youtube.com/embed/${videoId}`;\n\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs.stringify(query)}`;\n\n // TODO: https://developers.google.com/youtube/player_parameters\n // More query parameters can be exposed via the component props.\n\n return (\n <ScalableRect className={theme.container} ratio=\"16:9\">\n <Throbber theme={throbberTheme} />\n <iframe\n allow=\"autoplay\"\n allowFullScreen\n className={theme.video}\n src={url}\n title={title}\n />\n </ScalableRect>\n );\n};\n\nconst ThemedYouTubeVideo = themed(\n YouTubeVideo,\n 'YouTubeVideo',\n [\n 'container',\n 'video',\n ],\n baseTheme,\n);\n\nYouTubeVideo.propTypes = {\n autoplay: PT.bool,\n src: PT.string.isRequired,\n theme: ThemedYouTubeVideo.themeType.isRequired,\n title: PT.string,\n};\n\nYouTubeVideo.defaultProps = {\n autoplay: false,\n title: '',\n};\n\nexport default ThemedYouTubeVideo;\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,GAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,YAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,aAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,SAAA,GAAAL,sBAAA,CAAAC,OAAA;AAA2C,IAAAK,WAAA,GAAAL,OAAA;AAAA,MAAAM,SAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAAA,MAAAC,aAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAiB3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAA6C,GAAGA,CAAC;EACrDC,QAAQ;EACRC,GAAG;EACHC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC;EAC/B,IAAIC,GAAG,GAAGF,QAAQ,CAAC,CAAC,CAAC;EACrB,MAAMG,WAAW,GAAGH,QAAQ,CAAC,CAAC,CAAC;EAC/B,MAAMI,KAAK,GAAGD,WAAW,GAAGE,WAAE,CAACC,KAAK,CAACH,WAAW,CAAC,GAAG,CAAC,CAAC;EAEtD,MAAMI,OAAO,GAAGH,KAAK,CAACI,CAAC,IAAIN,GAAG,CAACO,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;EAChEP,GAAG,GAAI,iCAAgCK,OAAQ,EAAC;EAEhD,OAAOH,KAAK,CAACI,CAAC;EACdJ,KAAK,CAACR,QAAQ,GAAGA,QAAQ,GAAG,GAAG,GAAG,GAAG;EACrCM,GAAG,IAAK,IAAGG,WAAE,CAACK,SAAS,CAACN,KAAK,CAAE,EAAC;;EAEhC;EACA;;EAEA,oBACE,IAAAZ,WAAA,CAAAmB,IAAA,EAACrB,aAAA,CAAAsB,OAAY;IAACC,SAAS,EAAEf,KAAK,CAACgB,SAAU;IAACC,KAAK,EAAC,MAAM;IAAAC,QAAA,gBACpD,IAAAxB,WAAA,CAAAyB,GAAA,EAAC1B,SAAA,CAAAqB,OAAQ;MAACd,KAAK,EAAEJ;IAAc,CAAE,CAAC,eAClC,IAAAF,WAAA,CAAAyB,GAAA;MACEC,KAAK,EAAC,UAAU;MAChBC,eAAe;MACfN,SAAS,EAAEf,KAAK,CAACsB,KAAM;MACvBvB,GAAG,EAAEK,GAAI;MACTH,KAAK,EAAEA;IAAM,CACd,CAAC;EAAA,CACU,CAAC;AAEnB,CAAC;AAED,MAAMsB,kBAAkB,GAAG,IAAAC,oBAAM,EAC/B3B,YAAY,EACZ,cAAc,EACd,CACE,WAAW,EACX,OAAO,CACR,EACDF,SACF,CAAC;AAEDE,YAAY,CAAC4B,SAAS,GAAG;EACvB3B,QAAQ,EAAE4B,kBAAE,CAACC,IAAI;EACjB5B,GAAG,EAAE2B,kBAAE,CAACE,MAAM,CAACC,UAAU;EACzB7B,KAAK,EAAEuB,kBAAkB,CAACO,SAAS,CAACD,UAAU;EAC9C5B,KAAK,EAAEyB,kBAAE,CAACE;AACZ,CAAC;AAED/B,YAAY,CAACkC,YAAY,GAAG;EAC1BjC,QAAQ,EAAE,KAAK;EACfG,KAAK,EAAE;AACT,CAAC;AAAC,IAAA+B,QAAA,GAAAC,OAAA,CAAAnB,OAAA,GAEaS,kBAAkB"}
|
|
@@ -101,6 +101,6 @@ var _ScalableRect = _interopRequireDefault(require("./ScalableRect"));
|
|
|
101
101
|
var _Throbber = _interopRequireDefault(require("./Throbber"));
|
|
102
102
|
var _WithTooltip = _interopRequireDefault(require("./WithTooltip"));
|
|
103
103
|
var _YouTubeVideo = _interopRequireDefault(require("./YouTubeVideo"));
|
|
104
|
-
function _getRequireWildcardCache(
|
|
105
|
-
function _interopRequireWildcard(
|
|
104
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
105
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
106
106
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Button","_interopRequireDefault","require","_Checkbox","_Dropdown","_Input","_Link","_PageLayout","_MetaTags","_Modal","_interopRequireWildcard","_NavLink","_ScalableRect","_Throbber","_WithTooltip","_YouTubeVideo","_getRequireWildcardCache","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Button","_interopRequireDefault","require","_Checkbox","_Dropdown","_Input","_Link","_PageLayout","_MetaTags","_Modal","_interopRequireWildcard","_NavLink","_ScalableRect","_Throbber","_WithTooltip","_YouTubeVideo","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set"],"sources":["../../../../src/shared/components/index.ts"],"sourcesContent":["/**\n * Just an aggregation of all exported components into a single module.\n */\n\nexport { default as Button } from 'components/Button';\nexport { default as Checkbox } from 'components/Checkbox';\nexport { default as Dropdown } from 'components/Dropdown';\nexport { default as Input } from 'components/Input';\nexport { default as Link } from 'components/Link';\nexport { default as PageLayout } from 'components/PageLayout';\nexport { default as MetaTags } from 'components/MetaTags';\nexport { default as Modal, BaseModal } from 'components/Modal';\nexport { default as NavLink } from 'components/NavLink';\nexport { default as ScalableRect } from 'components/ScalableRect';\nexport { default as Throbber } from 'components/Throbber';\nexport { default as WithTooltip } from 'components/WithTooltip';\nexport { default as YouTubeVideo } from 'components/YouTubeVideo';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,SAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,MAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,KAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,WAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,SAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,MAAA,GAAAC,uBAAA,CAAAR,OAAA;AACA,IAAAS,QAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,aAAA,GAAAX,sBAAA,CAAAC,OAAA;AACA,IAAAW,SAAA,GAAAZ,sBAAA,CAAAC,OAAA;AACA,IAAAY,YAAA,GAAAb,sBAAA,CAAAC,OAAA;AACA,IAAAa,aAAA,GAAAd,sBAAA,CAAAC,OAAA;AAAkE,SAAAc,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAP,wBAAAO,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.js","names":["_environmentCheck","require","_webpack","config","IS_CLIENT_SIDE","default","CONFIG","requireWeak","document","cookie","CSRF","parse","csrfToken","_default","exports"],"sources":["../../../../src/shared/utils/config.
|
|
1
|
+
{"version":3,"file":"config.js","names":["_environmentCheck","require","_webpack","config","IS_CLIENT_SIDE","default","CONFIG","requireWeak","document","cookie","CSRF","parse","csrfToken","_default","exports"],"sources":["../../../../src/shared/utils/config.ts"],"sourcesContent":["/* global document */\n\nimport { IS_CLIENT_SIDE } from './isomorphy/environment-check';\nimport { requireWeak } from './webpack';\n\nconst config = (\n IS_CLIENT_SIDE\n // eslint-disable-next-line global-require\n ? require('client/getInj').default().CONFIG\n : requireWeak('config')\n) || {};\n\n// The safeguard for \"document\" is necessary because in non-Node environments,\n// like React Native, IS_CLIENT_SIDE is \"true\", however \"document\" and a bunch\n// of other browser-world features are not available.\nif (IS_CLIENT_SIDE && typeof document !== 'undefined') {\n const cookie = require('cookie'); // eslint-disable-line global-require\n config.CSRF = cookie.parse(document.cookie).csrfToken;\n}\n\nexport default config;\n"],"mappings":";;;;;;AAEA,IAAAA,iBAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAHA;;AAKA,MAAME,MAAM,GAAG,CACbC;AACE;AAAA,EACEH,OAAO,sBAAgB,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,MAAM,GACzC,IAAAC,oBAAW,EAAC,QAAQ,CAAC,KACtB,CAAC,CAAC;;AAEP;AACA;AACA;AACA,IAAIH,gCAAc,IAAI,OAAOI,QAAQ,KAAK,WAAW,EAAE;EACrD,MAAMC,MAAM,GAAGR,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC;EAClCE,MAAM,CAACO,IAAI,GAAGD,MAAM,CAACE,KAAK,CAACH,QAAQ,CAACC,MAAM,CAAC,CAACG,SAAS;AACvD;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAT,OAAA,GAEcF,MAAM"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.getSsrContext = void 0;
|
|
8
|
+
var _reactGlobalState = _interopRequireDefault(require("@dr.pogodin/react-global-state"));
|
|
9
|
+
// The type of data object injected by server into generated markup.
|
|
10
|
+
|
|
11
|
+
const {
|
|
12
|
+
getSsrContext
|
|
13
|
+
} = _reactGlobalState.default;
|
|
14
|
+
exports.getSsrContext = getSsrContext;
|
|
15
|
+
//# sourceMappingURL=globalState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"globalState.js","names":["_reactGlobalState","_interopRequireDefault","require","getSsrContext","RGS","exports"],"sources":["../../../../src/shared/utils/globalState.ts"],"sourcesContent":["import type { Request } from 'express';\n\nimport RGS, { type API, type SsrContext } from '@dr.pogodin/react-global-state';\n\nexport type ChunkGroupsT = {\n [chunkName: string]: string[];\n};\n\n// The type of data object injected by server into generated markup.\nexport type InjT = {\n CHUNK_GROUPS?: ChunkGroupsT;\n CONFIG?: { [key: string]: any },\n ISTATE?: unknown;\n};\n\nexport interface SsrContextT<StateT> extends SsrContext<StateT> {\n chunkGroups: ChunkGroupsT;\n chunks: string[];\n req: Request,\n status: number;\n}\n\nconst {\n getSsrContext,\n} = (RGS as unknown) as API<unknown, SsrContextT<unknown>>;\n\nexport {\n getSsrContext,\n};\n"],"mappings":";;;;;;;AAEA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAMA;;AAcA,MAAM;EACJC;AACF,CAAC,GAAIC,yBAAqD;AAACC,OAAA,CAAAF,aAAA,GAAAA,aAAA"}
|
|
@@ -35,19 +35,20 @@ Object.defineProperty(exports, "config", {
|
|
|
35
35
|
return _config.default;
|
|
36
36
|
}
|
|
37
37
|
});
|
|
38
|
-
exports
|
|
39
|
-
Object.defineProperty(exports, "splitComponent", {
|
|
38
|
+
Object.defineProperty(exports, "getSsrContext", {
|
|
40
39
|
enumerable: true,
|
|
41
40
|
get: function () {
|
|
42
|
-
return
|
|
41
|
+
return _globalState.getSsrContext;
|
|
43
42
|
}
|
|
44
43
|
});
|
|
45
|
-
|
|
44
|
+
exports.isomorphy = void 0;
|
|
45
|
+
Object.defineProperty(exports, "splitComponent", {
|
|
46
46
|
enumerable: true,
|
|
47
47
|
get: function () {
|
|
48
|
-
return
|
|
48
|
+
return _splitComponent.default;
|
|
49
49
|
}
|
|
50
50
|
});
|
|
51
|
+
exports.themed = void 0;
|
|
51
52
|
Object.defineProperty(exports, "time", {
|
|
52
53
|
enumerable: true,
|
|
53
54
|
get: function () {
|
|
@@ -64,11 +65,13 @@ var _time = _interopRequireDefault(require("./time"));
|
|
|
64
65
|
var webpack = _interopRequireWildcard(require("./webpack"));
|
|
65
66
|
exports.webpack = webpack;
|
|
66
67
|
var _jsUtils = require("@dr.pogodin/js-utils");
|
|
68
|
+
var _globalState = require("./globalState");
|
|
67
69
|
var _splitComponent = _interopRequireDefault(require("./splitComponent"));
|
|
68
|
-
function _getRequireWildcardCache(
|
|
69
|
-
function _interopRequireWildcard(
|
|
70
|
-
|
|
71
|
-
|
|
70
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
71
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
72
|
+
const themed = exports.themed = _reactThemes.default;
|
|
73
|
+
themed.COMPOSE = _reactThemes.COMPOSE;
|
|
74
|
+
themed.PRIORITY = _reactThemes.PRIORITY;
|
|
72
75
|
|
|
73
76
|
// Note: it should be done this way, as in some environments
|
|
74
77
|
// "process" might not exist, and process.env.NODE_CONFIG_ENV
|
|
@@ -78,7 +81,7 @@ try {
|
|
|
78
81
|
NODE_CONFIG_ENV = process.env.NODE_CONFIG_ENV;
|
|
79
82
|
} catch {/* noop */}
|
|
80
83
|
const env = NODE_CONFIG_ENV || process.env.NODE_ENV;
|
|
81
|
-
const JU = exports.JU = env !== 'production'
|
|
84
|
+
const JU = exports.JU = env !== 'production' ? webpack.requireWeak("./jest", __dirname) : null;
|
|
82
85
|
|
|
83
86
|
/**
|
|
84
87
|
* @category Utilities
|