@dr.pogodin/react-utils 1.28.1 → 1.29.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/build/development/index.js +36 -84
- package/build/development/index.js.map +1 -1
- package/build/development/shared/components/Button/index.js +2 -1
- package/build/development/shared/components/Button/index.js.map +1 -1
- package/build/development/shared/components/Checkbox/index.js +2 -1
- package/build/development/shared/components/Checkbox/index.js.map +1 -1
- package/build/development/shared/components/Dropdown/index.js +14 -9
- package/build/development/shared/components/Dropdown/index.js.map +1 -1
- package/build/development/shared/components/Input/index.js +2 -1
- package/build/development/shared/components/Input/index.js.map +1 -1
- package/build/development/shared/components/Modal/index.js +2 -1
- package/build/development/shared/components/Modal/index.js.map +1 -1
- package/build/development/shared/components/PageLayout/index.js +2 -1
- package/build/development/shared/components/PageLayout/index.js.map +1 -1
- package/build/development/shared/components/TextArea/index.js +94 -0
- package/build/development/shared/components/TextArea/index.js.map +1 -0
- package/build/development/shared/components/Throbber/index.js +2 -1
- package/build/development/shared/components/Throbber/index.js.map +1 -1
- package/build/development/shared/components/WithTooltip/Tooltip.js +2 -1
- package/build/development/shared/components/WithTooltip/Tooltip.js.map +1 -1
- package/build/development/shared/components/WithTooltip/index.js +1 -0
- package/build/development/shared/components/WithTooltip/index.js.map +1 -1
- package/build/development/shared/components/YouTubeVideo/index.js +2 -1
- package/build/development/shared/components/YouTubeVideo/index.js.map +1 -1
- package/build/development/shared/components/index.js +7 -0
- package/build/development/shared/components/index.js.map +1 -1
- package/build/development/style.css +89 -0
- package/build/development/web.bundle.js +33 -13
- package/build/production/index.js +1 -1
- package/build/production/index.js.map +1 -1
- package/build/production/shared/components/Button/index.js +2 -2
- package/build/production/shared/components/Button/index.js.map +1 -1
- package/build/production/shared/components/Checkbox/index.js +2 -2
- package/build/production/shared/components/Checkbox/index.js.map +1 -1
- package/build/production/shared/components/Dropdown/index.js +2 -2
- package/build/production/shared/components/Dropdown/index.js.map +1 -1
- package/build/production/shared/components/Input/index.js +2 -2
- package/build/production/shared/components/Input/index.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/PageLayout/index.js +2 -2
- package/build/production/shared/components/PageLayout/index.js.map +1 -1
- package/build/production/shared/components/TextArea/index.js +10 -0
- package/build/production/shared/components/TextArea/index.js.map +1 -0
- 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 +2 -2
- package/build/production/shared/components/WithTooltip/Tooltip.js.map +1 -1
- package/build/production/shared/components/WithTooltip/index.js +1 -1
- package/build/production/shared/components/WithTooltip/index.js.map +1 -1
- package/build/production/shared/components/YouTubeVideo/index.js +2 -2
- 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/style.css +1 -1
- package/build/production/style.css.map +1 -1
- package/build/production/web.bundle.js +1 -1
- package/build/production/web.bundle.js.map +1 -1
- package/build/types-code/index.d.ts +1 -1
- package/build/types-code/shared/components/Button/index.d.ts +2 -5
- package/build/types-code/shared/components/Checkbox/index.d.ts +2 -5
- package/build/types-code/shared/components/Dropdown/index.d.ts +2 -8
- package/build/types-code/shared/components/Input/index.d.ts +2 -5
- package/build/types-code/shared/components/Modal/index.d.ts +2 -4
- package/build/types-code/shared/components/PageLayout/index.d.ts +2 -7
- package/build/types-code/shared/components/TextArea/index.d.ts +12 -0
- package/build/types-code/shared/components/Throbber/index.d.ts +2 -5
- package/build/types-code/shared/components/WithTooltip/Tooltip.d.ts +1 -6
- package/build/types-code/shared/components/WithTooltip/index.d.ts +3 -4
- package/build/types-code/shared/components/YouTubeVideo/index.d.ts +2 -4
- package/build/types-code/shared/components/index.d.ts +1 -0
- package/build/types-scss/src/shared/components/Dropdown/theme.scss.d.ts +1 -0
- package/build/types-scss/src/shared/components/TextArea/style.scss.d.ts +6 -0
- package/package.json +33 -33
- package/src/index.ts +1 -16
- package/src/shared/components/Button/index.tsx +4 -10
- package/src/shared/components/Checkbox/index.tsx +9 -10
- package/src/shared/components/Dropdown/index.tsx +28 -25
- package/src/shared/components/Dropdown/theme.scss +6 -0
- package/src/shared/components/Input/index.tsx +8 -10
- package/src/shared/components/Modal/index.tsx +4 -8
- package/src/shared/components/PageLayout/index.tsx +15 -14
- package/src/shared/components/TextArea/index.tsx +107 -0
- package/src/shared/components/TextArea/style.scss +37 -0
- package/src/shared/components/Throbber/index.tsx +8 -10
- package/src/shared/components/WithTooltip/Tooltip.tsx +10 -6
- package/src/shared/components/WithTooltip/index.tsx +7 -4
- package/src/shared/components/YouTubeVideo/index.tsx +4 -8
- package/src/shared/components/index.ts +2 -0
|
@@ -46,7 +46,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
46
46
|
\**********************/
|
|
47
47
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
48
48
|
|
|
49
|
-
eval("var __dirname = \"/\";\n__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Barrier: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Barrier; },\n/* harmony export */ BaseModal: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.BaseModal; },\n/* harmony export */ Button: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Button; },\n/* harmony export */ Checkbox: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Checkbox; },\n/* harmony export */ Dropdown: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Dropdown; },\n/* harmony export */ Emitter: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Emitter; },\n/* harmony export */ GlobalStateProvider: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.GlobalStateProvider; },\n/* harmony export */ Input: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Input; },\n/* harmony export */ JU: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.JU; },\n/* harmony export */ Link: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Link; },\n/* harmony export */ MetaTags: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.MetaTags; },\n/* harmony export */ Modal: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Modal; },\n/* harmony export */ NavLink: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.NavLink; },\n/* harmony export */ PT: function() { return /* reexport module object */ prop_types__WEBPACK_IMPORTED_MODULE_3__; },\n/* harmony export */ PageLayout: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.PageLayout; },\n/* harmony export */ ScalableRect: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.ScalableRect; },\n/* harmony export */ Semaphore: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Semaphore; },\n/* harmony export */ ThemeProvider: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.ThemeProvider; },\n/* harmony export */ Throbber: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Throbber; },\n/* harmony export */ WithTooltip: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.WithTooltip; },\n/* harmony export */ YouTubeVideo: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.YouTubeVideo; },\n/* harmony export */ api: function() { return /* reexport default from dynamic */ axios__WEBPACK_IMPORTED_MODULE_2___default.a; },\n/* harmony export */ client: function() { return /* binding */ client; },\n/* harmony export */ config: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.config; },\n/* harmony export */ getGlobalState: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.getGlobalState; },\n/* harmony export */ getSsrContext: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.getSsrContext; },\n/* harmony export */ isomorphy: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.isomorphy; },\n/* harmony export */ server: function() { return /* binding */ server; },\n/* harmony export */ splitComponent: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.splitComponent; },\n/* harmony export */ themed: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.themed; },\n/* harmony export */ time: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.time; },\n/* harmony export */ useAsyncCollection: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useAsyncCollection; },\n/* harmony export */ useAsyncData: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useAsyncData; },\n/* harmony export */ useGlobalState: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useGlobalState; },\n/* harmony export */ webpack: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.webpack; },\n/* harmony export */ withGlobalStateType: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.withGlobalStateType; },\n/* harmony export */ withRetries: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.withRetries; }\n/* harmony export */ });\n/* harmony import */ var _styles_global_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./styles/global.scss */ \"./src/styles/global.scss\");\n/* harmony import */ var _shared_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./shared/utils */ \"./src/shared/utils/index.ts\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ \"axios\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dr.pogodin/react-global-state */ \"@dr.pogodin/react-global-state\");\n/* harmony import */ var _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _shared_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./shared/components */ \"./src/shared/components/index.ts\");\n\n\nconst server = _shared_utils__WEBPACK_IMPORTED_MODULE_1__.webpack.requireWeak('./server', __dirname);\nconst client = server ? undefined : (__webpack_require__(/*! ./client */ \"./src/client/index.tsx\")[\"default\"]);\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/index.ts?");
|
|
49
|
+
eval("var __dirname = \"/\";\n__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Barrier: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Barrier; },\n/* harmony export */ BaseModal: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.BaseModal; },\n/* harmony export */ Button: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Button; },\n/* harmony export */ Checkbox: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Checkbox; },\n/* harmony export */ Dropdown: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Dropdown; },\n/* harmony export */ Emitter: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Emitter; },\n/* harmony export */ GlobalStateProvider: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.GlobalStateProvider; },\n/* harmony export */ Input: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Input; },\n/* harmony export */ JU: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.JU; },\n/* harmony export */ Link: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Link; },\n/* harmony export */ MetaTags: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.MetaTags; },\n/* harmony export */ Modal: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Modal; },\n/* harmony export */ NavLink: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.NavLink; },\n/* harmony export */ PT: function() { return /* reexport module object */ prop_types__WEBPACK_IMPORTED_MODULE_3__; },\n/* harmony export */ PageLayout: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.PageLayout; },\n/* harmony export */ ScalableRect: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.ScalableRect; },\n/* harmony export */ Semaphore: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.Semaphore; },\n/* harmony export */ TextArea: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.TextArea; },\n/* harmony export */ ThemeProvider: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.ThemeProvider; },\n/* harmony export */ Throbber: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.Throbber; },\n/* harmony export */ WithTooltip: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.WithTooltip; },\n/* harmony export */ YouTubeVideo: function() { return /* reexport safe */ _shared_components__WEBPACK_IMPORTED_MODULE_5__.YouTubeVideo; },\n/* harmony export */ api: function() { return /* reexport default from dynamic */ axios__WEBPACK_IMPORTED_MODULE_2___default.a; },\n/* harmony export */ client: function() { return /* binding */ client; },\n/* harmony export */ config: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.config; },\n/* harmony export */ getGlobalState: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.getGlobalState; },\n/* harmony export */ getSsrContext: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.getSsrContext; },\n/* harmony export */ isomorphy: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.isomorphy; },\n/* harmony export */ server: function() { return /* binding */ server; },\n/* harmony export */ splitComponent: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.splitComponent; },\n/* harmony export */ themed: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.themed; },\n/* harmony export */ time: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.time; },\n/* harmony export */ useAsyncCollection: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useAsyncCollection; },\n/* harmony export */ useAsyncData: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useAsyncData; },\n/* harmony export */ useGlobalState: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.useGlobalState; },\n/* harmony export */ webpack: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.webpack; },\n/* harmony export */ withGlobalStateType: function() { return /* reexport safe */ _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__.withGlobalStateType; },\n/* harmony export */ withRetries: function() { return /* reexport safe */ _shared_utils__WEBPACK_IMPORTED_MODULE_1__.withRetries; }\n/* harmony export */ });\n/* harmony import */ var _styles_global_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./styles/global.scss */ \"./src/styles/global.scss\");\n/* harmony import */ var _shared_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./shared/utils */ \"./src/shared/utils/index.ts\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ \"axios\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dr.pogodin/react-global-state */ \"@dr.pogodin/react-global-state\");\n/* harmony import */ var _dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_global_state__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _shared_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./shared/components */ \"./src/shared/components/index.ts\");\n\n\nconst server = _shared_utils__WEBPACK_IMPORTED_MODULE_1__.webpack.requireWeak('./server', __dirname);\nconst client = server ? undefined : (__webpack_require__(/*! ./client */ \"./src/client/index.tsx\")[\"default\"]);\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/index.ts?");
|
|
50
50
|
|
|
51
51
|
/***/ }),
|
|
52
52
|
|
|
@@ -56,7 +56,7 @@ eval("var __dirname = \"/\";\n__webpack_require__.r(__webpack_exports__);\n/* ha
|
|
|
56
56
|
\************************************************/
|
|
57
57
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
58
58
|
|
|
59
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _Link__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Link */ \"./src/shared/components/Link.tsx\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./style.scss */ \"./src/shared/components/Button/style.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n// The <Button> component implements a standard button / button-like link.\n\n\n\n\n\n\n\n/* eslint-disable react/function-component-definition */\nconst BaseButton = _ref => {\n let {\n active,\n children,\n disabled,\n enforceA,\n onClick,\n onMouseDown,\n openNewTab,\n replace,\n theme,\n to\n } = _ref;\n let className = theme.button;\n if (active && theme.active) className += ` ${theme.active}`;\n if (disabled) {\n if (theme.disabled) className += ` ${theme.disabled}`;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(\"div\", {\n className: className,\n children: children\n });\n }\n if (to) {\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Link__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n className: className,\n enforceA: enforceA,\n onClick: onClick,\n onMouseDown: onMouseDown,\n openNewTab: openNewTab,\n replace: replace,\n to: to,\n children: children\n });\n }\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(\"div\", {\n className: className,\n onClick: onClick,\n onKeyDown: onClick && (e => {\n if (e.key === 'Enter') onClick(e);\n }),\n onMouseDown: onMouseDown,\n role: \"button\",\n tabIndex: 0,\n children: children\n });\n};\n\n/**\n * Button component theme: a map of CSS\n * class names to append to button elements:\n * @prop {string} [active] to the root element of active button.\n * @prop {string} [button] to the root element of any button.\n * @prop {string} [disabled] to the root element of disabled button.\n */\nconst ThemedButton = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3___default()(BaseButton, 'Button',
|
|
59
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _Link__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Link */ \"./src/shared/components/Link.tsx\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./style.scss */ \"./src/shared/components/Button/style.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n// The <Button> component implements a standard button / button-like link.\n\n\n\n\n\n\n\nconst validThemeKeys = ['active', 'button', 'disabled'];\n/* eslint-disable react/function-component-definition */\nconst BaseButton = _ref => {\n let {\n active,\n children,\n disabled,\n enforceA,\n onClick,\n onMouseDown,\n openNewTab,\n replace,\n theme,\n to\n } = _ref;\n let className = theme.button;\n if (active && theme.active) className += ` ${theme.active}`;\n if (disabled) {\n if (theme.disabled) className += ` ${theme.disabled}`;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(\"div\", {\n className: className,\n children: children\n });\n }\n if (to) {\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Link__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n className: className,\n enforceA: enforceA,\n onClick: onClick,\n onMouseDown: onMouseDown,\n openNewTab: openNewTab,\n replace: replace,\n to: to,\n children: children\n });\n }\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(\"div\", {\n className: className,\n onClick: onClick,\n onKeyDown: onClick && (e => {\n if (e.key === 'Enter') onClick(e);\n }),\n onMouseDown: onMouseDown,\n role: \"button\",\n tabIndex: 0,\n children: children\n });\n};\n\n/**\n * Button component theme: a map of CSS\n * class names to append to button elements:\n * @prop {string} [active] to the root element of active button.\n * @prop {string} [button] to the root element of any button.\n * @prop {string} [disabled] to the root element of disabled button.\n */\nconst ThemedButton = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_3___default()(BaseButton, 'Button', validThemeKeys, _style_scss__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\n\n/**\n * Implements themeable buttons, and button-line links (elements which look\n * like buttons, but behave as links) in the same uniform manner.\n * @param {object} [props] Component props.\n * @param {boolean} [props.active] Set `true` to render the button as\n * active, even if it is not active otherwise.\n * @param {boolean} [props.disabled] Set `true` to disable the button.\n * @param {boolean} [props.enforceA] When the button is rendered as `<Link>`\n * component, this prop enforces it to be rendered as a simple `<a>` element\n * (external link), rather than the React router's internal link.\n * See `<Link>` documentation to learn when links are rendered as `<a>`\n * by default.\n * @param {function} [props.onClick] Click event handler.\n * @param {function} [props.onMouseDown] Mouse down event handler.\n * @param {boolean} [props.openNewTab] Set `true` to open link in the new tab.\n * @param {boolean} [props.replace] When the button is rendered as\n * `<Link>`, and the target URL is internal, this property tells that\n * the new route should replace the last record in the browser's history,\n * rather than to be pushed as a new entry into the history stack.\n * @param {ButtonTheme} [props.theme] _Ad hoc_ button theme.\n * @param {object|string} [props.to] If specified, the button will be rendered\n * as `<Link>` (if not disabled), and it will point to the specified location\n * or URL.\n * @param {...any} [props....]\n * [Other properties of themeable components](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nBaseButton.defaultProps = {\n active: false,\n children: undefined,\n disabled: false,\n enforceA: false,\n onClick: undefined,\n onMouseDown: undefined,\n openNewTab: false,\n replace: false,\n to: undefined\n};\nBaseButton.propTypes = {\n active: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n disabled: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n enforceA: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n onClick: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),\n onMouseDown: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),\n openNewTab: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n replace: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n theme: ThemedButton.themeType.isRequired,\n to: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([(prop_types__WEBPACK_IMPORTED_MODULE_0___default().object), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)])\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedButton);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Button/index.tsx?");
|
|
60
60
|
|
|
61
61
|
/***/ }),
|
|
62
62
|
|
|
@@ -66,7 +66,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
66
66
|
\**************************************************/
|
|
67
67
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
68
68
|
|
|
69
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Checkbox/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\nconst Checkbox = _ref => {\n let {\n checked,\n label,\n onChange,\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"input\", {\n checked: checked,\n className: theme.checkbox,\n onChange: onChange,\n type: \"checkbox\"\n })]\n });\n};\n\n/**\n * Checkbox component theme: a map of\n * CSS classes to append to its elements:\n * @prop [checkbox] to the underlying checkbox `<input>` element.\n * @prop [container] to the root checkbox element.\n * @prop [label] to the checkbox label element.\n */\nconst ThemedCheckbox = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default()(Checkbox, 'Checkbox',
|
|
69
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Checkbox/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\nconst validThemeKeys = ['checkbox', 'container', 'label'];\nconst Checkbox = _ref => {\n let {\n checked,\n label,\n onChange,\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"input\", {\n checked: checked,\n className: theme.checkbox,\n onChange: onChange,\n type: \"checkbox\"\n })]\n });\n};\n\n/**\n * Checkbox component theme: a map of\n * CSS classes to append to its elements:\n * @prop [checkbox] to the underlying checkbox `<input>` element.\n * @prop [container] to the root checkbox element.\n * @prop [label] to the checkbox label element.\n */\nconst ThemedCheckbox = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default()(Checkbox, 'Checkbox', validThemeKeys, _theme_scss__WEBPACK_IMPORTED_MODULE_2__[\"default\"]);\n\n/**\n * The `<Checkbox>` component implements themeable checkboxes.\n * @param [props] Component properties.\n * @param [props.checked] Checkbox value.\n * @param [props.label] Checkbox label.\n * @param [props.onChange] State change handler.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props....]\n * [Other properties of themeable components](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties).\n */\nCheckbox.propTypes = {\n checked: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n label: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),\n onChange: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),\n theme: ThemedCheckbox.themeType.isRequired\n};\nCheckbox.defaultProps = {\n checked: undefined,\n label: undefined,\n onChange: undefined\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedCheckbox);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Checkbox/index.tsx?");
|
|
70
70
|
|
|
71
71
|
/***/ }),
|
|
72
72
|
|
|
@@ -76,7 +76,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
76
76
|
\**************************************************/
|
|
77
77
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
78
78
|
|
|
79
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Dropdown/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n/**\n * Implements a themeable dropdown list. Internally it is rendered with help of\n * the standard HTML `<select>` element, thus the styling support is somewhat\n * limited.\n * @param [props] Component properties.\n * @param [props.filter] Options filter function. If provided, only\n * those elements of `options` list will be used by the dropdown, for which this\n * filter returns `true`.\n * @param [props.label] Dropdown label.\n * @param [props.onChange] Selection event handler.\n * @param [props.options=[]] Array of dropdown\n * options. For string elements the option value and name will be the same.\n * It is allowed to mix DropdownOption and string elements in the same option\n * list.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.value] Currently selected value.\n * @param [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Dropdown = _ref => {\n let {\n filter,\n label,\n onChange,\n options = [],\n theme,\n value\n } = _ref;\n let isValidValue = false;\n const optionElements = [];\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n let optionValue;\n let optionName;\n if (typeof option === 'string') {\n optionName = option;\n optionValue = option;\n } else {\n optionName = option.name || option.value;\n optionValue = option.value;\n }\n isValidValue || (isValidValue = optionValue === value);\n optionElements.push( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"option\", {\n className: theme.option,\n value: optionValue,\n children: optionName\n }, optionValue));\n }\n }\n\n // NOTE: This element represents the current `value` when it does not match\n // any valid option. In Chrome, and some other browsers, we are able to hide\n // it from the opened dropdown; in others, e.g. Safari, the best we can do is\n // to show it as disabled.\n const hiddenOption = isValidValue ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"option\", {\n disabled: true,\n className: theme.hiddenOption,\n value: value,\n children: value\n }, \"__reactUtilsHiddenOption\");\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"
|
|
79
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Dropdown/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\nconst validThemeKeys = ['arrow', 'container', 'dropdown', 'hiddenOption', 'label', 'option', 'select'];\n/**\n * Implements a themeable dropdown list. Internally it is rendered with help of\n * the standard HTML `<select>` element, thus the styling support is somewhat\n * limited.\n * @param [props] Component properties.\n * @param [props.filter] Options filter function. If provided, only\n * those elements of `options` list will be used by the dropdown, for which this\n * filter returns `true`.\n * @param [props.label] Dropdown label.\n * @param [props.onChange] Selection event handler.\n * @param [props.options=[]] Array of dropdown\n * options. For string elements the option value and name will be the same.\n * It is allowed to mix DropdownOption and string elements in the same option\n * list.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.value] Currently selected value.\n * @param [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Dropdown = _ref => {\n let {\n filter,\n label,\n onChange,\n options = [],\n theme,\n value\n } = _ref;\n let isValidValue = false;\n const optionElements = [];\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n let optionValue;\n let optionName;\n if (typeof option === 'string') {\n optionName = option;\n optionValue = option;\n } else {\n optionName = option.name || option.value;\n optionValue = option.value;\n }\n isValidValue || (isValidValue = optionValue === value);\n optionElements.push( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"option\", {\n className: theme.option,\n value: optionValue,\n children: optionName\n }, optionValue));\n }\n }\n\n // NOTE: This element represents the current `value` when it does not match\n // any valid option. In Chrome, and some other browsers, we are able to hide\n // it from the opened dropdown; in others, e.g. Safari, the best we can do is\n // to show it as disabled.\n const hiddenOption = isValidValue ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"option\", {\n disabled: true,\n className: theme.hiddenOption,\n value: value,\n children: value\n }, \"__reactUtilsHiddenOption\");\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.dropdown,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"select\", {\n className: theme.select,\n onChange: onChange,\n value: value,\n children: [hiddenOption, optionElements]\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: theme.arrow,\n children: \"\\u25BC\"\n })]\n })]\n });\n};\nconst ThemedDropdown = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default()(Dropdown, 'Dropdown', validThemeKeys, _theme_scss__WEBPACK_IMPORTED_MODULE_2__[\"default\"]);\nDropdown.propTypes = {\n filter: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),\n label: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),\n onChange: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),\n options: prop_types__WEBPACK_IMPORTED_MODULE_0___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_0___default().shape({\n name: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),\n value: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired\n }), (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)]).isRequired),\n theme: ThemedDropdown.themeType.isRequired,\n value: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)\n};\nDropdown.defaultProps = {\n filter: undefined,\n label: undefined,\n onChange: undefined,\n options: [],\n value: ''\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedDropdown);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Dropdown/index.tsx?");
|
|
80
80
|
|
|
81
81
|
/***/ }),
|
|
82
82
|
|
|
@@ -96,7 +96,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
96
96
|
\***********************************************/
|
|
97
97
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
98
98
|
|
|
99
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Input/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n\n/**\n * Themeable input field, based on the standard HTML `<input>` element.\n * @param [props]\n * @param [props.label] Input label.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n * @param [props...] Any other properties are passed to the underlying\n * `<input>` element.\n */\nconst Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)((_ref, ref) => {\n let {\n label,\n theme,\n ...rest\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"span\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"input\", {\n className: theme.input,\n ref: ref,\n ...rest\n })]\n });\n});\nconst ThemedInput = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(Input, 'Input',
|
|
99
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Input/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n\nconst validThemeKeys = ['container', 'input', 'label'];\n/**\n * Themeable input field, based on the standard HTML `<input>` element.\n * @param [props]\n * @param [props.label] Input label.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n * @param [props...] Any other properties are passed to the underlying\n * `<input>` element.\n */\nconst Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)((_ref, ref) => {\n let {\n label,\n theme,\n ...rest\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"span\", {\n className: theme.container,\n children: [label === undefined ? null : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"p\", {\n className: theme.label,\n children: label\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"input\", {\n className: theme.input,\n ref: ref,\n ...rest\n })]\n });\n});\nconst ThemedInput = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(Input, 'Input', validThemeKeys, _theme_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"]);\nInput.propTypes = {\n label: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),\n theme: ThemedInput.themeType.isRequired\n};\nInput.defaultProps = {\n label: undefined\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedInput);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Input/index.tsx?");
|
|
100
100
|
|
|
101
101
|
/***/ }),
|
|
102
102
|
|
|
@@ -126,7 +126,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
126
126
|
\***********************************************/
|
|
127
127
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
128
128
|
|
|
129
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BaseModal: function() { return /* binding */ BaseModal; }\n/* harmony export */ });\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash */ \"lodash\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _base_theme_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./base-theme.scss */ \"./src/shared/components/Modal/base-theme.scss\");\n/* harmony import */ var _styles_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./styles.scss */ \"./src/shared/components/Modal/styles.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* global document */\n\n\n\n\n\n\n\n\n\n\n\n/**\n * The `<Modal>` component implements a simple themeable modal window, wrapped\n * into the default theme. `<BaseModal>` exposes the base non-themed component.\n * **Children:** Component children are rendered as the modal content.\n * @param {object} props Component properties. Beside props documented below,\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties) are supported as well.\n * @param {function} [props.onCancel] The callback to trigger when user\n * clicks outside the modal, or presses Escape. It is expected to hide the\n * modal.\n * @param {ModalTheme} [props.theme] _Ad hoc_ theme.\n */\nconst BaseModal = _ref => {\n let {\n children,\n onCancel,\n theme\n } = _ref;\n const containerRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const overlayRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [portal, setPortal] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)();\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const p = document.createElement('div');\n document.body.classList.add('scrolling-disabled-by-modal');\n document.body.appendChild(p);\n setPortal(p);\n return () => {\n document.body.classList.remove('scrolling-disabled-by-modal');\n document.body.removeChild(p);\n };\n }, []);\n const focusLast = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n onFocus: () => {\n var _containerRef$current, _overlayRef$current;\n const elems = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelectorAll('*');\n for (let i = elems.length - 1; i >= 0; --i) {\n elems[i].focus();\n if (document.activeElement === elems[i]) return;\n }\n (_overlayRef$current = overlayRef.current) === null || _overlayRef$current === void 0 || _overlayRef$current.focus();\n }\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */,\n tabIndex: 0\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n }), []);\n return portal ? /*#__PURE__*/react_dom__WEBPACK_IMPORTED_MODULE_2___default().createPortal( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {\n children: [focusLast, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n \"aria-label\": \"Cancel\",\n className: theme.overlay,\n onClick: () => onCancel && onCancel(),\n onKeyDown: e => {\n if (e.key === 'Escape' && onCancel) onCancel();\n },\n ref: node => {\n if (node && node !== overlayRef.current) {\n overlayRef.current = node;\n node.focus();\n }\n },\n role: \"button\",\n tabIndex: 0\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n \"aria-modal\": \"true\",\n className: theme.container,\n onWheel: event => event.stopPropagation(),\n ref: containerRef,\n role: \"dialog\",\n children: children\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n onFocus: () => {\n var _overlayRef$current2;\n (_overlayRef$current2 = overlayRef.current) === null || _overlayRef$current2 === void 0 || _overlayRef$current2.focus();\n }\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */,\n tabIndex: 0\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n }), focusLast]\n }), portal) : null;\n};\nconst ThemedModal = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4___default()(BaseModal, 'Modal',
|
|
129
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BaseModal: function() { return /* binding */ BaseModal; }\n/* harmony export */ });\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash */ \"lodash\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _base_theme_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./base-theme.scss */ \"./src/shared/components/Modal/base-theme.scss\");\n/* harmony import */ var _styles_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./styles.scss */ \"./src/shared/components/Modal/styles.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* global document */\n\n\n\n\n\n\n\n\n\n\n\nconst validThemeKeys = ['container', 'overlay'];\n/**\n * The `<Modal>` component implements a simple themeable modal window, wrapped\n * into the default theme. `<BaseModal>` exposes the base non-themed component.\n * **Children:** Component children are rendered as the modal content.\n * @param {object} props Component properties. Beside props documented below,\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties) are supported as well.\n * @param {function} [props.onCancel] The callback to trigger when user\n * clicks outside the modal, or presses Escape. It is expected to hide the\n * modal.\n * @param {ModalTheme} [props.theme] _Ad hoc_ theme.\n */\nconst BaseModal = _ref => {\n let {\n children,\n onCancel,\n theme\n } = _ref;\n const containerRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const overlayRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [portal, setPortal] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)();\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const p = document.createElement('div');\n document.body.classList.add('scrolling-disabled-by-modal');\n document.body.appendChild(p);\n setPortal(p);\n return () => {\n document.body.classList.remove('scrolling-disabled-by-modal');\n document.body.removeChild(p);\n };\n }, []);\n const focusLast = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n onFocus: () => {\n var _containerRef$current, _overlayRef$current;\n const elems = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelectorAll('*');\n for (let i = elems.length - 1; i >= 0; --i) {\n elems[i].focus();\n if (document.activeElement === elems[i]) return;\n }\n (_overlayRef$current = overlayRef.current) === null || _overlayRef$current === void 0 || _overlayRef$current.focus();\n }\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */,\n tabIndex: 0\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n }), []);\n return portal ? /*#__PURE__*/react_dom__WEBPACK_IMPORTED_MODULE_2___default().createPortal( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {\n children: [focusLast, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n \"aria-label\": \"Cancel\",\n className: theme.overlay,\n onClick: () => onCancel && onCancel(),\n onKeyDown: e => {\n if (e.key === 'Escape' && onCancel) onCancel();\n },\n ref: node => {\n if (node && node !== overlayRef.current) {\n overlayRef.current = node;\n node.focus();\n }\n },\n role: \"button\",\n tabIndex: 0\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n \"aria-modal\": \"true\",\n className: theme.container,\n onWheel: event => event.stopPropagation(),\n ref: containerRef,\n role: \"dialog\",\n children: children\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n onFocus: () => {\n var _overlayRef$current2;\n (_overlayRef$current2 = overlayRef.current) === null || _overlayRef$current2 === void 0 || _overlayRef$current2.focus();\n }\n /* eslint-disable jsx-a11y/no-noninteractive-tabindex */,\n tabIndex: 0\n /* eslint-enable jsx-a11y/no-noninteractive-tabindex */\n }), focusLast]\n }), portal) : null;\n};\nconst ThemedModal = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_4___default()(BaseModal, 'Modal', validThemeKeys, _base_theme_scss__WEBPACK_IMPORTED_MODULE_5__[\"default\"]);\nBaseModal.propTypes = {\n onCancel: (prop_types__WEBPACK_IMPORTED_MODULE_3___default().func),\n children: (prop_types__WEBPACK_IMPORTED_MODULE_3___default().node),\n theme: ThemedModal.themeType.isRequired\n};\nBaseModal.defaultProps = {\n onCancel: lodash__WEBPACK_IMPORTED_MODULE_0__.noop,\n children: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedModal);\n\n/* Non-themed version of the Modal. */\n\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Modal/index.tsx?");
|
|
130
130
|
|
|
131
131
|
/***/ }),
|
|
132
132
|
|
|
@@ -146,7 +146,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
|
|
|
146
146
|
\****************************************************/
|
|
147
147
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
148
148
|
|
|
149
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _base_theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./base-theme.scss */ \"./src/shared/components/PageLayout/base-theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n/**\n * Simple and themeable page layout. It keeps the main content centered in\n * a column of limited width, which fills entire viewport on small screens\n * (under `$screen-md = 1024px` size). At larger screens the column keeps\n * `$screen-md` size, and it is centered at the page, surrounded by side\n * panels, where additional content can be displayed.\n *\n * **Children:** Component children are rendered as the content of main panel.\n * @param {object} [props] Component properties.\n * @param {Node} [props.leftSidePanelContent] The content for left side panel.\n * @param {Node} [props.rightSidePanelContent] The content for right side panel.\n * @param {PageLayoutTheme} [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 PageLayout = _ref => {\n let {\n children,\n leftSidePanelContent,\n rightSidePanelContent,\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: [theme.sidePanel, theme.leftSidePanel].join(' '),\n children: leftSidePanelContent\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: theme.mainPanel,\n children: children\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: [theme.sidePanel, theme.rightSidePanel].join(' '),\n children: rightSidePanelContent\n })]\n });\n};\nconst ThemedPageLayout = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default()(PageLayout, 'PageLayout',
|
|
149
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _base_theme_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./base-theme.scss */ \"./src/shared/components/PageLayout/base-theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\nconst validThemeKeys = ['container', 'leftSidePanel', 'mainPanel', 'rightSidePanel', 'sidePanel'];\n/**\n * Simple and themeable page layout. It keeps the main content centered in\n * a column of limited width, which fills entire viewport on small screens\n * (under `$screen-md = 1024px` size). At larger screens the column keeps\n * `$screen-md` size, and it is centered at the page, surrounded by side\n * panels, where additional content can be displayed.\n *\n * **Children:** Component children are rendered as the content of main panel.\n * @param {object} [props] Component properties.\n * @param {Node} [props.leftSidePanelContent] The content for left side panel.\n * @param {Node} [props.rightSidePanelContent] The content for right side panel.\n * @param {PageLayoutTheme} [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 PageLayout = _ref => {\n let {\n children,\n leftSidePanelContent,\n rightSidePanelContent,\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n className: theme.container,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: [theme.sidePanel, theme.leftSidePanel].join(' '),\n children: leftSidePanelContent\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: theme.mainPanel,\n children: children\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n className: [theme.sidePanel, theme.rightSidePanel].join(' '),\n children: rightSidePanelContent\n })]\n });\n};\nconst ThemedPageLayout = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_1___default()(PageLayout, 'PageLayout', validThemeKeys, _base_theme_scss__WEBPACK_IMPORTED_MODULE_2__[\"default\"]);\nPageLayout.propTypes = {\n children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n leftSidePanelContent: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n rightSidePanelContent: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n theme: ThemedPageLayout.themeType.isRequired\n};\nPageLayout.defaultProps = {\n children: null,\n leftSidePanelContent: null,\n rightSidePanelContent: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedPageLayout);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/PageLayout/index.tsx?");
|
|
150
150
|
|
|
151
151
|
/***/ }),
|
|
152
152
|
|
|
@@ -160,13 +160,23 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
160
160
|
|
|
161
161
|
/***/ }),
|
|
162
162
|
|
|
163
|
+
/***/ "./src/shared/components/TextArea/index.tsx":
|
|
164
|
+
/*!**************************************************!*\
|
|
165
|
+
!*** ./src/shared/components/TextArea/index.tsx ***!
|
|
166
|
+
\**************************************************/
|
|
167
|
+
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
168
|
+
|
|
169
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style.scss */ \"./src/shared/components/TextArea/style.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n\nconst validThemeKeys = ['container', 'hidden', 'textarea'];\nconst TextArea = _ref => {\n let {\n onChange,\n onKeyDown,\n placeholder,\n theme,\n value\n } = _ref;\n const hiddenAreaRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n const [height, setHeight] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)();\n const [localValue, setLocalValue] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(value || '');\n if (value !== undefined && localValue !== value) setLocalValue(value);\n\n // This resizes text area's height when its width is changed for any reason.\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n const el = hiddenAreaRef.current;\n if (!el) return undefined;\n const cb = () => {\n setHeight(el.scrollHeight);\n };\n const observer = new ResizeObserver(cb);\n observer.observe(el);\n return () => {\n observer.disconnect();\n };\n }, []);\n\n // This resizes the text area when its content is modified.\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n const el = hiddenAreaRef.current;\n if (el) setHeight(el.scrollHeight);\n }, [localValue]);\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n className: theme.container,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"textarea\", {\n // This text area is hidden underneath the primary one below,\n // and it is used for text measurements, to implement auto-scaling\n // of the primary textarea's height.\n readOnly: true,\n ref: hiddenAreaRef,\n className: `${theme.textarea} ${theme.hidden}`,\n value: localValue\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"textarea\", {\n // When value is \"undefined\" the text area is not-managed, and we should\n // manage it internally for the measurement / resizing functionality\n // to work.\n onChange: value === undefined ? e => {\n setLocalValue(e.target.value);\n } : onChange,\n onKeyDown: onKeyDown,\n placeholder: placeholder,\n style: {\n height\n },\n className: theme.textarea,\n value: localValue\n })]\n });\n};\nconst ThemedTextArea = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(TextArea, 'TextArea', validThemeKeys, _style_scss__WEBPACK_IMPORTED_MODULE_3__[\"default\"]);\nTextArea.propTypes = {\n onChange: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),\n onKeyDown: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func),\n placeholder: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),\n theme: ThemedTextArea.themeType.isRequired,\n value: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)\n};\nTextArea.defaultProps = {\n onChange: undefined,\n onKeyDown: undefined,\n placeholder: '',\n value: undefined\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedTextArea);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/TextArea/index.tsx?");
|
|
170
|
+
|
|
171
|
+
/***/ }),
|
|
172
|
+
|
|
163
173
|
/***/ "./src/shared/components/Throbber/index.tsx":
|
|
164
174
|
/*!**************************************************!*\
|
|
165
175
|
!*** ./src/shared/components/Throbber/index.tsx ***!
|
|
166
176
|
\**************************************************/
|
|
167
177
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
168
178
|
|
|
169
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Throbber/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\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 = _ref => {\n let {\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"span\", {\n className: theme.container,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n })]\n });\n};\nconst ThemedThrobber = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0___default()(Throbber, 'Throbber',
|
|
179
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _theme_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./theme.scss */ \"./src/shared/components/Throbber/theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\nconst validThemeKeys = ['bouncing', 'circle', 'container'];\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 = _ref => {\n let {\n theme\n } = _ref;\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"span\", {\n className: theme.container,\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"span\", {\n className: theme.circle\n })]\n });\n};\nconst ThemedThrobber = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_0___default()(Throbber, 'Throbber', validThemeKeys, _theme_scss__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\nThrobber.propTypes = {\n theme: ThemedThrobber.themeType.isRequired\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedThrobber);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Throbber/index.tsx?");
|
|
170
180
|
|
|
171
181
|
/***/ }),
|
|
172
182
|
|
|
@@ -176,7 +186,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _dr_
|
|
|
176
186
|
\*******************************************************/
|
|
177
187
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
178
188
|
|
|
179
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PLACEMENTS: function() { return /* binding */ PLACEMENTS; }\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);\n/**\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\n\n\n\n\n/* Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport. */\nlet PLACEMENTS = /*#__PURE__*/function (PLACEMENTS) {\n PLACEMENTS[\"ABOVE_CURSOR\"] = \"ABOVE_CURSOR\";\n PLACEMENTS[\"ABOVE_ELEMENT\"] = \"ABOVE_ELEMENT\";\n PLACEMENTS[\"BELOW_CURSOR\"] = \"BELOW_CURSOR\";\n PLACEMENTS[\"BELOW_ELEMENT\"] = \"BELOW_ELEMENT\";\n return PLACEMENTS;\n}({});\nconst ARROW_STYLE_DOWN = ['border-bottom-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');\nconst ARROW_STYLE_UP = ['border-top-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');\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 const content = document.createElement('div');\n if (theme.content) content.setAttribute('class', theme.content);\n const container = document.createElement('div');\n if (theme.container) container.setAttribute('class', theme.container);\n container.appendChild(arrow);\n container.appendChild(content);\n document.body.appendChild(container);\n return {\n container,\n arrow,\n content\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) {\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 {\n scrollX,\n scrollY\n } = window;\n const {\n documentElement: {\n clientHeight,\n clientWidth\n }\n } = 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 {\n arrow,\n container\n } = 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 // 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(pageX, pageY, placement, element, tooltip) {\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 if (pos.containerX < viewportRect.left + 6) {\n pos.containerX = viewportRect.left + 6;\n pos.arrowX = Math.max(6, pageX - pos.containerX - tooltipRects.arrow.width / 2);\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(tooltipRects.container.width - 6, pageX - pos.containerX - tooltipRects.arrow.width / 2);\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 + 2 * tooltipRects.arrow.height;\n pos.arrowY -= tooltipRects.container.height + tooltipRects.arrow.height;\n pos.baseArrowStyle = ARROW_STYLE_UP;\n }\n const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n tooltip.container.setAttribute('style', containerStyle);\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 = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)((_ref, ref) => {\n let {\n children,\n theme\n } = _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 {\n current: heap\n } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({\n lastElement: undefined,\n lastPageX: 0,\n lastPageY: 0,\n lastPlacement: undefined\n });\n const [components, setComponents] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);\n const pointTo = (pageX, pageY, placement, element) => {\n heap.lastElement = element;\n heap.lastPageX = pageX;\n heap.lastPageY = pageY;\n heap.lastPlacement = placement;\n if (components) {\n setComponentPositions(pageX, pageY, placement, element, components);\n }\n };\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useImperativeHandle)(ref, () => ({\n pointTo\n }));\n\n /* Inits and destroys tooltip components. */\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n const x = createTooltipComponents(theme);\n setComponents(x);\n return () => {\n document.body.removeChild(x.container);\n setComponents(null);\n };\n }, [theme]);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n if (components) {\n setComponentPositions(heap.lastPageX, heap.lastPageY, heap.lastPlacement, heap.lastElement, components);\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, heap.lastPageY, heap.lastPlacement, heap.lastElement]);\n return components ? /*#__PURE__*/(0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(children, components.content) : null;\n});\nTooltip.propTypes = {\n children: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().node),\n theme: prop_types__WEBPACK_IMPORTED_MODULE_2___default().shape({}).isRequired\n};\nTooltip.defaultProps = {\n children: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (Tooltip);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/WithTooltip/Tooltip.tsx?");
|
|
189
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PLACEMENTS: function() { return /* binding */ PLACEMENTS; },\n/* harmony export */ validThemeKeys: function() { return /* binding */ validThemeKeys; }\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);\n/**\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\n\n\n\n/* Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport. */\nlet PLACEMENTS = /*#__PURE__*/function (PLACEMENTS) {\n PLACEMENTS[\"ABOVE_CURSOR\"] = \"ABOVE_CURSOR\";\n PLACEMENTS[\"ABOVE_ELEMENT\"] = \"ABOVE_ELEMENT\";\n PLACEMENTS[\"BELOW_CURSOR\"] = \"BELOW_CURSOR\";\n PLACEMENTS[\"BELOW_ELEMENT\"] = \"BELOW_ELEMENT\";\n return PLACEMENTS;\n}({});\nconst ARROW_STYLE_DOWN = ['border-bottom-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');\nconst ARROW_STYLE_UP = ['border-top-color:transparent', 'border-left-color:transparent', 'border-right-color:transparent'].join(';');\nconst validThemeKeys = ['appearance', 'arrow', 'content', 'container'];\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 const content = document.createElement('div');\n if (theme.content) content.setAttribute('class', theme.content);\n const container = document.createElement('div');\n if (theme.container) container.setAttribute('class', theme.container);\n container.appendChild(arrow);\n container.appendChild(content);\n document.body.appendChild(container);\n return {\n container,\n arrow,\n content\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) {\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 {\n scrollX,\n scrollY\n } = window;\n const {\n documentElement: {\n clientHeight,\n clientWidth\n }\n } = 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 {\n arrow,\n container\n } = 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 // 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(pageX, pageY, placement, element, tooltip) {\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 if (pos.containerX < viewportRect.left + 6) {\n pos.containerX = viewportRect.left + 6;\n pos.arrowX = Math.max(6, pageX - pos.containerX - tooltipRects.arrow.width / 2);\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(tooltipRects.container.width - 6, pageX - pos.containerX - tooltipRects.arrow.width / 2);\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 + 2 * tooltipRects.arrow.height;\n pos.arrowY -= tooltipRects.container.height + tooltipRects.arrow.height;\n pos.baseArrowStyle = ARROW_STYLE_UP;\n }\n const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n tooltip.container.setAttribute('style', containerStyle);\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 = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)((_ref, ref) => {\n let {\n children,\n theme\n } = _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 {\n current: heap\n } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({\n lastElement: undefined,\n lastPageX: 0,\n lastPageY: 0,\n lastPlacement: undefined\n });\n const [components, setComponents] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);\n const pointTo = (pageX, pageY, placement, element) => {\n heap.lastElement = element;\n heap.lastPageX = pageX;\n heap.lastPageY = pageY;\n heap.lastPlacement = placement;\n if (components) {\n setComponentPositions(pageX, pageY, placement, element, components);\n }\n };\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useImperativeHandle)(ref, () => ({\n pointTo\n }));\n\n /* Inits and destroys tooltip components. */\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n const x = createTooltipComponents(theme);\n setComponents(x);\n return () => {\n document.body.removeChild(x.container);\n setComponents(null);\n };\n }, [theme]);\n (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {\n if (components) {\n setComponentPositions(heap.lastPageX, heap.lastPageY, heap.lastPlacement, heap.lastElement, components);\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, heap.lastPageY, heap.lastPlacement, heap.lastElement]);\n return components ? /*#__PURE__*/(0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(children, components.content) : null;\n});\nTooltip.propTypes = {\n children: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().node),\n theme: prop_types__WEBPACK_IMPORTED_MODULE_2___default().shape({}).isRequired\n};\nTooltip.defaultProps = {\n children: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (Tooltip);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/WithTooltip/Tooltip.tsx?");
|
|
180
190
|
|
|
181
191
|
/***/ }),
|
|
182
192
|
|
|
@@ -186,7 +196,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
186
196
|
\*****************************************************/
|
|
187
197
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
188
198
|
|
|
189
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _Tooltip__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Tooltip */ \"./src/shared/components/WithTooltip/Tooltip.tsx\");\n/* harmony import */ var _default_theme_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default-theme.scss */ \"./src/shared/components/WithTooltip/default-theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* global window */\n\n\n\n\n\n\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 = _ref => {\n let {\n children,\n placement,\n tip,\n theme\n } = _ref;\n const {\n current: heap\n } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined\n });\n const tooltipRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();\n const wrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [showTooltip, setShowTooltip] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);\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 (cursorX < wrapperRect.left || cursorX > wrapperRect.right || cursorY < wrapperRect.top || cursorY > wrapperRect.bottom) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(cursorX + window.scrollX, cursorY + window.scrollY, placement, wrapperRef.current);\n }\n }\n };\n (0,react__WEBPACK_IMPORTED_MODULE_1__.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(heap.lastCursorX + window.scrollX, heap.lastCursorY + window.scrollY, placement, wrapperRef.current);\n }\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [heap.lastCursorX, heap.lastCursorY, placement, showTooltip, tip]);\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(\"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 children: [showTooltip && tip !== null ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Tooltip__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n ref: tooltipRef,\n theme: theme,\n children: tip\n }) : null, children]\n });\n};\nconst ThemedWrapper = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(Wrapper, 'WithTooltip', ['appearance', 'arrow', 'container', 'content', 'wrapper'], _default_theme_scss__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\nconst e = ThemedWrapper;\ne.PLACEMENTS = _Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS;\nWrapper.propTypes = {\n children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(Object.values(_Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node)\n};\nWrapper.defaultProps = {\n children: null,\n placement: _Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS.ABOVE_CURSOR,\n tip: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (e);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/WithTooltip/index.tsx?");
|
|
199
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _Tooltip__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Tooltip */ \"./src/shared/components/WithTooltip/Tooltip.tsx\");\n/* harmony import */ var _default_theme_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./default-theme.scss */ \"./src/shared/components/WithTooltip/default-theme.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* global window */\n\n\n\n\n\n\n\n\nconst validThemeKeys = [..._Tooltip__WEBPACK_IMPORTED_MODULE_3__.validThemeKeys, 'wrapper'];\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 = _ref => {\n let {\n children,\n placement,\n tip,\n theme\n } = _ref;\n const {\n current: heap\n } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined\n });\n const tooltipRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();\n const wrapperRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [showTooltip, setShowTooltip] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);\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 (cursorX < wrapperRect.left || cursorX > wrapperRect.right || cursorY < wrapperRect.top || cursorY > wrapperRect.bottom) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(cursorX + window.scrollX, cursorY + window.scrollY, placement, wrapperRef.current);\n }\n }\n };\n (0,react__WEBPACK_IMPORTED_MODULE_1__.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(heap.lastCursorX + window.scrollX, heap.lastCursorY + window.scrollY, placement, wrapperRef.current);\n }\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [heap.lastCursorX, heap.lastCursorY, placement, showTooltip, tip]);\n return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(\"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 children: [showTooltip && tip !== null ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Tooltip__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n ref: tooltipRef,\n theme: theme,\n children: tip\n }) : null, children]\n });\n};\nconst ThemedWrapper = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(Wrapper, 'WithTooltip', ['appearance', 'arrow', 'container', 'content', 'wrapper'], _default_theme_scss__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\nconst e = ThemedWrapper;\ne.PLACEMENTS = _Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS;\nWrapper.propTypes = {\n children: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),\n placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(Object.values(_Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node)\n};\nWrapper.defaultProps = {\n children: null,\n placement: _Tooltip__WEBPACK_IMPORTED_MODULE_3__.PLACEMENTS.ABOVE_CURSOR,\n tip: null\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (e);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/WithTooltip/index.tsx?");
|
|
190
200
|
|
|
191
201
|
/***/ }),
|
|
192
202
|
|
|
@@ -196,7 +206,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
196
206
|
\******************************************************/
|
|
197
207
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
198
208
|
|
|
199
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var qs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! qs */ \"qs\");\n/* harmony import */ var qs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(qs__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _ScalableRect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ScalableRect */ \"./src/shared/components/ScalableRect/index.tsx\");\n/* harmony import */ var _Throbber__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Throbber */ \"./src/shared/components/Throbber/index.tsx\");\n/* harmony import */ var _base_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./base.scss */ \"./src/shared/components/YouTubeVideo/base.scss\");\n/* harmony import */ var _throbber_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./throbber.scss */ \"./src/shared/components/YouTubeVideo/throbber.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n\n\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 = _ref => {\n var _url$match;\n let {\n autoplay,\n src,\n theme,\n title\n } = _ref;\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs__WEBPACK_IMPORTED_MODULE_1___default().parse(queryString) : {};\n const videoId = query.v || ((_url$match = url.match(/\\/([a-zA-Z0-9-_]*)$/)) === null || _url$match === void 0 ? void 0 : _url$match[1]);\n url = `https://www.youtube.com/embed/${videoId}`;\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs__WEBPACK_IMPORTED_MODULE_1___default().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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_ScalableRect__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n className: theme.container,\n ratio: \"16:9\",\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_Throbber__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n theme: _throbber_scss__WEBPACK_IMPORTED_MODULE_6__[\"default\"]\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"iframe\", {\n allow: \"autoplay\",\n allowFullScreen: true,\n className: theme.video,\n src: url,\n title: title\n })]\n });\n};\nconst ThemedYouTubeVideo = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(YouTubeVideo, 'YouTubeVideo',
|
|
209
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ \"prop-types\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var qs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! qs */ \"qs\");\n/* harmony import */ var qs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(qs__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dr.pogodin/react-themes */ \"@dr.pogodin/react-themes\");\n/* harmony import */ var _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _ScalableRect__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ScalableRect */ \"./src/shared/components/ScalableRect/index.tsx\");\n/* harmony import */ var _Throbber__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Throbber */ \"./src/shared/components/Throbber/index.tsx\");\n/* harmony import */ var _base_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./base.scss */ \"./src/shared/components/YouTubeVideo/base.scss\");\n/* harmony import */ var _throbber_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./throbber.scss */ \"./src/shared/components/YouTubeVideo/throbber.scss\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\n\n\n\n\n\n\nconst validThemeKeys = ['container', 'video'];\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 = _ref => {\n var _url$match;\n let {\n autoplay,\n src,\n theme,\n title\n } = _ref;\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs__WEBPACK_IMPORTED_MODULE_1___default().parse(queryString) : {};\n const videoId = query.v || ((_url$match = url.match(/\\/([a-zA-Z0-9-_]*)$/)) === null || _url$match === void 0 ? void 0 : _url$match[1]);\n url = `https://www.youtube.com/embed/${videoId}`;\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs__WEBPACK_IMPORTED_MODULE_1___default().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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_ScalableRect__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n className: theme.container,\n ratio: \"16:9\",\n children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_Throbber__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n theme: _throbber_scss__WEBPACK_IMPORTED_MODULE_6__[\"default\"]\n }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"iframe\", {\n allow: \"autoplay\",\n allowFullScreen: true,\n className: theme.video,\n src: url,\n title: title\n })]\n });\n};\nconst ThemedYouTubeVideo = _dr_pogodin_react_themes__WEBPACK_IMPORTED_MODULE_2___default()(YouTubeVideo, 'YouTubeVideo', validThemeKeys, _base_scss__WEBPACK_IMPORTED_MODULE_5__[\"default\"]);\nYouTubeVideo.propTypes = {\n autoplay: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),\n src: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string).isRequired,\n theme: ThemedYouTubeVideo.themeType.isRequired,\n title: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string)\n};\nYouTubeVideo.defaultProps = {\n autoplay: false,\n title: ''\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (ThemedYouTubeVideo);\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/YouTubeVideo/index.tsx?");
|
|
200
210
|
|
|
201
211
|
/***/ }),
|
|
202
212
|
|
|
@@ -206,7 +216,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var prop
|
|
|
206
216
|
\****************************************/
|
|
207
217
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
208
218
|
|
|
209
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BaseModal: function() { return /* reexport safe */ _Modal__WEBPACK_IMPORTED_MODULE_7__.BaseModal; },\n/* harmony export */ Button: function() { return /* reexport safe */ _Button__WEBPACK_IMPORTED_MODULE_0__[\"default\"]; },\n/* harmony export */ Checkbox: function() { return /* reexport safe */ _Checkbox__WEBPACK_IMPORTED_MODULE_1__[\"default\"]; },\n/* harmony export */ Dropdown: function() { return /* reexport safe */ _Dropdown__WEBPACK_IMPORTED_MODULE_2__[\"default\"]; },\n/* harmony export */ Input: function() { return /* reexport safe */ _Input__WEBPACK_IMPORTED_MODULE_3__[\"default\"]; },\n/* harmony export */ Link: function() { return /* reexport safe */ _Link__WEBPACK_IMPORTED_MODULE_4__[\"default\"]; },\n/* harmony export */ MetaTags: function() { return /* reexport safe */ _MetaTags__WEBPACK_IMPORTED_MODULE_6__[\"default\"]; },\n/* harmony export */ Modal: function() { return /* reexport safe */ _Modal__WEBPACK_IMPORTED_MODULE_7__[\"default\"]; },\n/* harmony export */ NavLink: function() { return /* reexport safe */ _NavLink__WEBPACK_IMPORTED_MODULE_8__[\"default\"]; },\n/* harmony export */ PageLayout: function() { return /* reexport safe */ _PageLayout__WEBPACK_IMPORTED_MODULE_5__[\"default\"]; },\n/* harmony export */ ScalableRect: function() { return /* reexport safe */ _ScalableRect__WEBPACK_IMPORTED_MODULE_9__[\"default\"]; },\n/* harmony export */ Throbber: function() { return /* reexport safe */ _Throbber__WEBPACK_IMPORTED_MODULE_10__[\"default\"]; },\n/* harmony export */ WithTooltip: function() { return /* reexport safe */ _WithTooltip__WEBPACK_IMPORTED_MODULE_11__[\"default\"]; },\n/* harmony export */ YouTubeVideo: function() { return /* reexport safe */ _YouTubeVideo__WEBPACK_IMPORTED_MODULE_12__[\"default\"]; }\n/* harmony export */ });\n/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Button */ \"./src/shared/components/Button/index.tsx\");\n/* harmony import */ var _Checkbox__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Checkbox */ \"./src/shared/components/Checkbox/index.tsx\");\n/* harmony import */ var _Dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Dropdown */ \"./src/shared/components/Dropdown/index.tsx\");\n/* harmony import */ var _Input__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Input */ \"./src/shared/components/Input/index.tsx\");\n/* harmony import */ var _Link__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Link */ \"./src/shared/components/Link.tsx\");\n/* harmony import */ var _PageLayout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./PageLayout */ \"./src/shared/components/PageLayout/index.tsx\");\n/* harmony import */ var _MetaTags__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./MetaTags */ \"./src/shared/components/MetaTags.tsx\");\n/* harmony import */ var _Modal__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Modal */ \"./src/shared/components/Modal/index.tsx\");\n/* harmony import */ var _NavLink__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./NavLink */ \"./src/shared/components/NavLink.tsx\");\n/* harmony import */ var _ScalableRect__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./ScalableRect */ \"./src/shared/components/ScalableRect/index.tsx\");\n/* harmony import */ var _Throbber__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Throbber */ \"./src/shared/components/Throbber/index.tsx\");\n/* harmony import */ var _WithTooltip__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./WithTooltip */ \"./src/shared/components/WithTooltip/index.tsx\");\n/* harmony import */ var _YouTubeVideo__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./YouTubeVideo */ \"./src/shared/components/YouTubeVideo/index.tsx\");\n/**\n * Just an aggregation of all exported components into a single module.\n */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/index.ts?");
|
|
219
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ BaseModal: function() { return /* reexport safe */ _Modal__WEBPACK_IMPORTED_MODULE_7__.BaseModal; },\n/* harmony export */ Button: function() { return /* reexport safe */ _Button__WEBPACK_IMPORTED_MODULE_0__[\"default\"]; },\n/* harmony export */ Checkbox: function() { return /* reexport safe */ _Checkbox__WEBPACK_IMPORTED_MODULE_1__[\"default\"]; },\n/* harmony export */ Dropdown: function() { return /* reexport safe */ _Dropdown__WEBPACK_IMPORTED_MODULE_2__[\"default\"]; },\n/* harmony export */ Input: function() { return /* reexport safe */ _Input__WEBPACK_IMPORTED_MODULE_3__[\"default\"]; },\n/* harmony export */ Link: function() { return /* reexport safe */ _Link__WEBPACK_IMPORTED_MODULE_4__[\"default\"]; },\n/* harmony export */ MetaTags: function() { return /* reexport safe */ _MetaTags__WEBPACK_IMPORTED_MODULE_6__[\"default\"]; },\n/* harmony export */ Modal: function() { return /* reexport safe */ _Modal__WEBPACK_IMPORTED_MODULE_7__[\"default\"]; },\n/* harmony export */ NavLink: function() { return /* reexport safe */ _NavLink__WEBPACK_IMPORTED_MODULE_8__[\"default\"]; },\n/* harmony export */ PageLayout: function() { return /* reexport safe */ _PageLayout__WEBPACK_IMPORTED_MODULE_5__[\"default\"]; },\n/* harmony export */ ScalableRect: function() { return /* reexport safe */ _ScalableRect__WEBPACK_IMPORTED_MODULE_9__[\"default\"]; },\n/* harmony export */ TextArea: function() { return /* reexport safe */ _TextArea__WEBPACK_IMPORTED_MODULE_13__[\"default\"]; },\n/* harmony export */ Throbber: function() { return /* reexport safe */ _Throbber__WEBPACK_IMPORTED_MODULE_10__[\"default\"]; },\n/* harmony export */ WithTooltip: function() { return /* reexport safe */ _WithTooltip__WEBPACK_IMPORTED_MODULE_11__[\"default\"]; },\n/* harmony export */ YouTubeVideo: function() { return /* reexport safe */ _YouTubeVideo__WEBPACK_IMPORTED_MODULE_12__[\"default\"]; }\n/* harmony export */ });\n/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Button */ \"./src/shared/components/Button/index.tsx\");\n/* harmony import */ var _Checkbox__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Checkbox */ \"./src/shared/components/Checkbox/index.tsx\");\n/* harmony import */ var _Dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Dropdown */ \"./src/shared/components/Dropdown/index.tsx\");\n/* harmony import */ var _Input__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Input */ \"./src/shared/components/Input/index.tsx\");\n/* harmony import */ var _Link__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Link */ \"./src/shared/components/Link.tsx\");\n/* harmony import */ var _PageLayout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./PageLayout */ \"./src/shared/components/PageLayout/index.tsx\");\n/* harmony import */ var _MetaTags__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./MetaTags */ \"./src/shared/components/MetaTags.tsx\");\n/* harmony import */ var _Modal__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Modal */ \"./src/shared/components/Modal/index.tsx\");\n/* harmony import */ var _NavLink__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./NavLink */ \"./src/shared/components/NavLink.tsx\");\n/* harmony import */ var _ScalableRect__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./ScalableRect */ \"./src/shared/components/ScalableRect/index.tsx\");\n/* harmony import */ var _Throbber__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Throbber */ \"./src/shared/components/Throbber/index.tsx\");\n/* harmony import */ var _WithTooltip__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./WithTooltip */ \"./src/shared/components/WithTooltip/index.tsx\");\n/* harmony import */ var _YouTubeVideo__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./YouTubeVideo */ \"./src/shared/components/YouTubeVideo/index.tsx\");\n/* harmony import */ var _TextArea__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./TextArea */ \"./src/shared/components/TextArea/index.tsx\");\n/**\n * Just an aggregation of all exported components into a single module.\n */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/index.ts?");
|
|
210
220
|
|
|
211
221
|
/***/ }),
|
|
212
222
|
|
|
@@ -336,7 +346,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
|
|
|
336
346
|
\***************************************************/
|
|
337
347
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
338
348
|
|
|
339
|
-
eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\"
|
|
349
|
+
eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\"dropdown\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___dropdown___-LiQj8\",\"context\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___context___haRIry\",\"ad\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___ad___D4XHG2\",\"hoc\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___hoc___N3nd34\",\"arrow\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___arrow___-zPK7Y\",\"container\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___container___9CQpeA\",\"label\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___label___Gv0kyu\",\"option\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___option___xmsujA\",\"hiddenOption\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___hiddenOption___RdW3yR\",\"select\":\"-dr-pogodin-react-utils___src-shared-components-Dropdown-theme___select___JXK1uw\"});\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/Dropdown/theme.scss?");
|
|
340
350
|
|
|
341
351
|
/***/ }),
|
|
342
352
|
|
|
@@ -400,6 +410,16 @@ eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extr
|
|
|
400
410
|
|
|
401
411
|
/***/ }),
|
|
402
412
|
|
|
413
|
+
/***/ "./src/shared/components/TextArea/style.scss":
|
|
414
|
+
/*!***************************************************!*\
|
|
415
|
+
!*** ./src/shared/components/TextArea/style.scss ***!
|
|
416
|
+
\***************************************************/
|
|
417
|
+
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
418
|
+
|
|
419
|
+
eval("__webpack_require__.r(__webpack_exports__);\n// extracted by mini-css-extract-plugin\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\"container\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___container___dzMVIB\",\"context\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___context___KVPc7g\",\"ad\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___ad___z2GQ0Z\",\"hoc\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___hoc___8R1Qdj\",\"textarea\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___textarea___zd-OFg\",\"hidden\":\"-dr-pogodin-react-utils___src-shared-components-TextArea-style___hidden___GiHBXI\"});\n\n//# sourceURL=webpack://@dr.pogodin/react-utils/./src/shared/components/TextArea/style.scss?");
|
|
420
|
+
|
|
421
|
+
/***/ }),
|
|
422
|
+
|
|
403
423
|
/***/ "./src/shared/components/Throbber/theme.scss":
|
|
404
424
|
/*!***************************************************!*\
|
|
405
425
|
!*** ./src/shared/components/Throbber/theme.scss ***!
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});
|
|
1
|
+
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={client:true,server:true,config:true,Barrier:true,Emitter:true,isomorphy:true,getSsrContext:true,JU:true,Semaphore:true,splitComponent:true,themed:true,ThemeProvider:true,time:true,webpack:true,withRetries:true,api:true,PT:true,getGlobalState:true,GlobalStateProvider:true,useAsyncCollection:true,useAsyncData:true,useGlobalState:true,withGlobalStateType:true};Object.defineProperty(exports,"Barrier",{enumerable:true,get:function(){return _utils.Barrier}});Object.defineProperty(exports,"Emitter",{enumerable:true,get:function(){return _utils.Emitter}});Object.defineProperty(exports,"GlobalStateProvider",{enumerable:true,get:function(){return _reactGlobalState.GlobalStateProvider}});Object.defineProperty(exports,"JU",{enumerable:true,get:function(){return _utils.JU}});exports.PT=void 0;Object.defineProperty(exports,"Semaphore",{enumerable:true,get:function(){return _utils.Semaphore}});Object.defineProperty(exports,"ThemeProvider",{enumerable:true,get:function(){return _utils.ThemeProvider}});Object.defineProperty(exports,"api",{enumerable:true,get:function(){return _axios.default}});exports.client=void 0;Object.defineProperty(exports,"config",{enumerable:true,get:function(){return _utils.config}});Object.defineProperty(exports,"getGlobalState",{enumerable:true,get:function(){return _reactGlobalState.getGlobalState}});Object.defineProperty(exports,"getSsrContext",{enumerable:true,get:function(){return _utils.getSsrContext}});Object.defineProperty(exports,"isomorphy",{enumerable:true,get:function(){return _utils.isomorphy}});exports.server=void 0;Object.defineProperty(exports,"splitComponent",{enumerable:true,get:function(){return _utils.splitComponent}});Object.defineProperty(exports,"themed",{enumerable:true,get:function(){return _utils.themed}});Object.defineProperty(exports,"time",{enumerable:true,get:function(){return _utils.time}});Object.defineProperty(exports,"useAsyncCollection",{enumerable:true,get:function(){return _reactGlobalState.useAsyncCollection}});Object.defineProperty(exports,"useAsyncData",{enumerable:true,get:function(){return _reactGlobalState.useAsyncData}});Object.defineProperty(exports,"useGlobalState",{enumerable:true,get:function(){return _reactGlobalState.useGlobalState}});Object.defineProperty(exports,"webpack",{enumerable:true,get:function(){return _utils.webpack}});Object.defineProperty(exports,"withGlobalStateType",{enumerable:true,get:function(){return _reactGlobalState.withGlobalStateType}});Object.defineProperty(exports,"withRetries",{enumerable:true,get:function(){return _utils.withRetries}});var _utils=require("./shared/utils");var _axios=_interopRequireDefault(require("axios"));var _PT=_interopRequireWildcard(require("prop-types"));exports.PT=_PT;var _reactGlobalState=require("@dr.pogodin/react-global-state");var _components=require("./shared/components");Object.keys(_components).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_components[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function(){return _components[key]}})});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)}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}const server=exports.server=_utils.webpack.requireWeak("./server",__dirname);const client=exports.client=server?undefined:require("./client").default;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_utils","require","_axios","_interopRequireDefault","_PT","_interopRequireWildcard","exports","PT","_reactGlobalState","_components","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_utils","require","_axios","_interopRequireDefault","_PT","_interopRequireWildcard","exports","PT","_reactGlobalState","_components","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","defineProperty","enumerable","get","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","n","__proto__","a","getOwnPropertyDescriptor","u","i","set","server","webpack","requireWeak","__dirname","client","undefined"],"sources":["../../src/index.ts"],"sourcesContent":["import 'styles/global.scss';\n\nimport { webpack } from 'utils';\n\nimport type ServerT from './server';\n\nconst server = webpack.requireWeak('./server', __dirname) as (typeof ServerT) | null;\n\nconst client = server ? undefined : require('./client').default;\n\nexport { default as api } from 'axios';\nexport * as PT from 'prop-types';\n\nexport {\n type AsyncCollectionLoaderT,\n type AsyncDataEnvelopeT,\n type AsyncDataLoaderT,\n type ForceT,\n type UseAsyncDataOptionsT,\n type UseAsyncDataResT,\n type UseGlobalStateResT,\n type ValueOrInitializerT,\n getGlobalState,\n GlobalStateProvider,\n useAsyncCollection,\n useAsyncData,\n useGlobalState,\n withGlobalStateType,\n} from '@dr.pogodin/react-global-state';\n\nexport * from 'components';\n\nexport {\n type Theme,\n config,\n Barrier,\n Emitter,\n isomorphy,\n getSsrContext,\n JU,\n Semaphore,\n splitComponent,\n themed,\n ThemeProvider,\n time,\n webpack,\n withRetries,\n} from 'utils';\n\nexport { client, server };\n"],"mappings":"irFAEA,IAAAA,MAAA,CAAAC,OAAA,mBAQA,IAAAC,MAAA,CAAAC,sBAAA,CAAAF,OAAA,WAAuC,IAAAG,GAAA,CAAAC,uBAAA,CAAAJ,OAAA,gBAAAK,OAAA,CAAAC,EAAA,CAAAH,GAAA,CAGvC,IAAAI,iBAAA,CAAAP,OAAA,mCAiBA,IAAAQ,WAAA,CAAAR,OAAA,wBAAAS,MAAA,CAAAC,IAAA,CAAAF,WAAA,EAAAG,OAAA,UAAAC,GAAA,KAAAA,GAAA,cAAAA,GAAA,0BAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,CAAAJ,GAAA,YAAAA,GAAA,IAAAP,OAAA,EAAAA,OAAA,CAAAO,GAAA,IAAAJ,WAAA,CAAAI,GAAA,SAAAH,MAAA,CAAAQ,cAAA,CAAAZ,OAAA,CAAAO,GAAA,EAAAM,UAAA,MAAAC,GAAA,SAAAA,CAAA,SAAAX,WAAA,CAAAI,GAAA,OAA2B,SAAAQ,yBAAAC,CAAA,wBAAAC,OAAA,iBAAAC,CAAA,KAAAD,OAAA,CAAAE,CAAA,KAAAF,OAAA,QAAAF,wBAAA,SAAAA,CAAAC,CAAA,SAAAA,CAAA,CAAAG,CAAA,CAAAD,CAAA,GAAAF,CAAA,WAAAjB,wBAAAiB,CAAA,CAAAE,CAAA,MAAAA,CAAA,EAAAF,CAAA,EAAAA,CAAA,CAAAI,UAAA,QAAAJ,CAAA,WAAAA,CAAA,mBAAAA,CAAA,qBAAAA,CAAA,QAAAK,OAAA,CAAAL,CAAA,MAAAG,CAAA,CAAAJ,wBAAA,CAAAG,CAAA,KAAAC,CAAA,EAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,SAAAG,CAAA,CAAAL,GAAA,CAAAE,CAAA,MAAAO,CAAA,EAAAC,SAAA,OAAAC,CAAA,CAAArB,MAAA,CAAAQ,cAAA,EAAAR,MAAA,CAAAsB,wBAAA,SAAAC,CAAA,IAAAX,CAAA,gBAAAW,CAAA,EAAAvB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAM,CAAA,CAAAW,CAAA,OAAAC,CAAA,CAAAH,CAAA,CAAArB,MAAA,CAAAsB,wBAAA,CAAAV,CAAA,CAAAW,CAAA,OAAAC,CAAA,GAAAA,CAAA,CAAAd,GAAA,EAAAc,CAAA,CAAAC,GAAA,EAAAzB,MAAA,CAAAQ,cAAA,CAAAW,CAAA,CAAAI,CAAA,CAAAC,CAAA,EAAAL,CAAA,CAAAI,CAAA,EAAAX,CAAA,CAAAW,CAAA,SAAAJ,CAAA,CAAAF,OAAA,CAAAL,CAAA,CAAAG,CAAA,EAAAA,CAAA,CAAAU,GAAA,CAAAb,CAAA,CAAAO,CAAA,EAAAA,CAAA,CAxB3B,KAAM,CAAAO,MAAM,CAAA9B,OAAA,CAAA8B,MAAA,CAAGC,cAAO,CAACC,WAAW,YAAaC,SAAS,CAA4B,CAEpF,KAAM,CAAAC,MAAM,CAAAlC,OAAA,CAAAkC,MAAA,CAAGJ,MAAM,CAAGK,SAAS,CAAGxC,OAAO,WAAW,CAAC,CAAC0B,OAAO"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _propTypes=_interopRequireDefault(require("prop-types"));require("react");var _Link=_interopRequireDefault(require("../Link"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");// The <Button> component implements a standard button / button-like link.
|
|
2
|
-
const defaultTheme={"context":"KM0v4f","ad":"_3jm1-Q","hoc":"_0plpDL","button":"E1FNQT","active":"MAe9O6","disabled":"Br9IWV"};/* eslint-disable react/function-component-definition */const BaseButton=({active,children,disabled,enforceA,onClick,onMouseDown,openNewTab,replace,theme,to})=>{let className=theme.button;if(active&&theme.active)className+=` ${theme.active}`;if(disabled){if(theme.disabled)className+=` ${theme.disabled}`;return/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,children:children})}if(to){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_Link.default,{className:className,enforceA:enforceA,onClick:onClick,onMouseDown:onMouseDown,openNewTab:openNewTab,replace:replace,to:to,children:children})}return/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,onClick:onClick,onKeyDown:onClick&&(e=>{if(e.key==="Enter")onClick(e)}),onMouseDown:onMouseDown,role:"button",tabIndex:0,children:children})};/**
|
|
2
|
+
const defaultTheme={"context":"KM0v4f","ad":"_3jm1-Q","hoc":"_0plpDL","button":"E1FNQT","active":"MAe9O6","disabled":"Br9IWV"};const validThemeKeys=["active","button","disabled"];/* eslint-disable react/function-component-definition */const BaseButton=({active,children,disabled,enforceA,onClick,onMouseDown,openNewTab,replace,theme,to})=>{let className=theme.button;if(active&&theme.active)className+=` ${theme.active}`;if(disabled){if(theme.disabled)className+=` ${theme.disabled}`;return/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,children:children})}if(to){return/*#__PURE__*/(0,_jsxRuntime.jsx)(_Link.default,{className:className,enforceA:enforceA,onClick:onClick,onMouseDown:onMouseDown,openNewTab:openNewTab,replace:replace,to:to,children:children})}return/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:className,onClick:onClick,onKeyDown:onClick&&(e=>{if(e.key==="Enter")onClick(e)}),onMouseDown:onMouseDown,role:"button",tabIndex:0,children:children})};/**
|
|
3
3
|
* Button component theme: a map of CSS
|
|
4
4
|
* class names to append to button elements:
|
|
5
5
|
* @prop {string} [active] to the root element of active button.
|
|
6
6
|
* @prop {string} [button] to the root element of any button.
|
|
7
7
|
* @prop {string} [disabled] to the root element of disabled button.
|
|
8
|
-
*/const ThemedButton=(0,_reactThemes.default)(BaseButton,"Button",
|
|
8
|
+
*/const ThemedButton=(0,_reactThemes.default)(BaseButton,"Button",validThemeKeys,defaultTheme);/**
|
|
9
9
|
* Implements themeable buttons, and button-line links (elements which look
|
|
10
10
|
* like buttons, but behave as links) in the same uniform manner.
|
|
11
11
|
* @param {object} [props] Component props.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_Link","_reactThemes","_jsxRuntime","defaultTheme","BaseButton","active","children","disabled","enforceA","onClick","onMouseDown","openNewTab","replace","theme","to","className","button","jsx","default","onKeyDown","e","key","role","tabIndex","ThemedButton","themed","defaultProps","undefined","propTypes","PT","bool","node","func","themeType","isRequired","oneOfType","object","string","_default","exports"],"sources":["../../../../../src/shared/components/Button/index.tsx"],"sourcesContent":["// The <Button> component implements a standard button / button-like link.\n\nimport PT from 'prop-types';\nimport { type ReactNode } from 'react';\n\nimport Link from 'components/Link';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\ntype PropsT = {\n active?: boolean;\n children?: ReactNode;\n disabled?: boolean;\n enforceA?: boolean;\n onClick?: React.MouseEventHandler & React.KeyboardEventHandler;\n onMouseDown?: React.MouseEventHandler;\n openNewTab?: boolean;\n replace?: boolean;\n theme: Theme
|
|
1
|
+
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_Link","_reactThemes","_jsxRuntime","defaultTheme","validThemeKeys","BaseButton","active","children","disabled","enforceA","onClick","onMouseDown","openNewTab","replace","theme","to","className","button","jsx","default","onKeyDown","e","key","role","tabIndex","ThemedButton","themed","defaultProps","undefined","propTypes","PT","bool","node","func","themeType","isRequired","oneOfType","object","string","_default","exports"],"sources":["../../../../../src/shared/components/Button/index.tsx"],"sourcesContent":["// The <Button> component implements a standard button / button-like link.\n\nimport PT from 'prop-types';\nimport { type ReactNode } from 'react';\n\nimport Link from 'components/Link';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\nconst validThemeKeys = ['active', 'button', 'disabled'] as const;\n\ntype PropsT = {\n active?: boolean;\n children?: ReactNode;\n disabled?: boolean;\n enforceA?: boolean;\n onClick?: React.MouseEventHandler & React.KeyboardEventHandler;\n onMouseDown?: React.MouseEventHandler;\n openNewTab?: boolean;\n replace?: boolean;\n theme: Theme<typeof validThemeKeys>;\n // TODO: It needs a more precise typing of the object option.\n to?: object | string;\n};\n\n/* eslint-disable react/function-component-definition */\nconst BaseButton: React.FunctionComponent<PropsT> = ({\n active,\n children,\n disabled,\n enforceA,\n onClick,\n onMouseDown,\n openNewTab,\n replace,\n theme,\n to,\n}) => {\n let className = theme.button;\n if (active && theme.active) className += ` ${theme.active}`;\n if (disabled) {\n if (theme.disabled) className += ` ${theme.disabled}`;\n return (\n <div className={className}>\n {children}\n </div>\n );\n }\n if (to) {\n return (\n <Link\n className={className}\n enforceA={enforceA}\n onClick={onClick}\n onMouseDown={onMouseDown}\n openNewTab={openNewTab}\n replace={replace}\n to={to}\n >\n {children}\n </Link>\n );\n }\n\n return (\n <div\n className={className}\n onClick={onClick}\n onKeyDown={onClick && ((e) => {\n if (e.key === 'Enter') onClick(e);\n })}\n onMouseDown={onMouseDown}\n role=\"button\"\n tabIndex={0}\n >\n {children}\n </div>\n );\n};\n\n/**\n * Button component theme: a map of CSS\n * class names to append to button elements:\n * @prop {string} [active] to the root element of active button.\n * @prop {string} [button] to the root element of any button.\n * @prop {string} [disabled] to the root element of disabled button.\n */\nconst ThemedButton = themed(BaseButton, 'Button', validThemeKeys, defaultTheme);\n\n/**\n * Implements themeable buttons, and button-line links (elements which look\n * like buttons, but behave as links) in the same uniform manner.\n * @param {object} [props] Component props.\n * @param {boolean} [props.active] Set `true` to render the button as\n * active, even if it is not active otherwise.\n * @param {boolean} [props.disabled] Set `true` to disable the button.\n * @param {boolean} [props.enforceA] When the button is rendered as `<Link>`\n * component, this prop enforces it to be rendered as a simple `<a>` element\n * (external link), rather than the React router's internal link.\n * See `<Link>` documentation to learn when links are rendered as `<a>`\n * by default.\n * @param {function} [props.onClick] Click event handler.\n * @param {function} [props.onMouseDown] Mouse down event handler.\n * @param {boolean} [props.openNewTab] Set `true` to open link in the new tab.\n * @param {boolean} [props.replace] When the button is rendered as\n * `<Link>`, and the target URL is internal, this property tells that\n * the new route should replace the last record in the browser's history,\n * rather than to be pushed as a new entry into the history stack.\n * @param {ButtonTheme} [props.theme] _Ad hoc_ button theme.\n * @param {object|string} [props.to] If specified, the button will be rendered\n * as `<Link>` (if not disabled), and it will point to the specified location\n * or URL.\n * @param {...any} [props....]\n * [Other properties of themeable components](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nBaseButton.defaultProps = {\n active: false,\n children: undefined,\n disabled: false,\n enforceA: false,\n onClick: undefined,\n onMouseDown: undefined,\n openNewTab: false,\n replace: false,\n to: undefined,\n};\n\nBaseButton.propTypes = {\n active: PT.bool,\n children: PT.node,\n disabled: PT.bool,\n enforceA: PT.bool,\n onClick: PT.func,\n onMouseDown: PT.func,\n openNewTab: PT.bool,\n replace: PT.bool,\n theme: ThemedButton.themeType.isRequired,\n to: PT.oneOfType([PT.object, PT.string]),\n};\n\nexport default ThemedButton;\n"],"mappings":"gLAEA,IAAAA,UAAA,CAAAC,sBAAA,CAAAC,OAAA,gBACAA,OAAA,UAEA,IAAAC,KAAA,CAAAF,sBAAA,CAAAC,OAAA,aAEA,IAAAE,YAAA,CAAAH,sBAAA,CAAAC,OAAA,8BAA8D,IAAAG,WAAA,CAAAH,OAAA,sBAP9D;AAAA,MAAAI,YAAA,6GAWA,KAAM,CAAAC,cAAc,CAAG,CAAC,QAAQ,CAAE,QAAQ,CAAE,UAAU,CAAU,CAgBhE,wDACA,KAAM,CAAAC,UAA2C,CAAGA,CAAC,CACnDC,MAAM,CACNC,QAAQ,CACRC,QAAQ,CACRC,QAAQ,CACRC,OAAO,CACPC,WAAW,CACXC,UAAU,CACVC,OAAO,CACPC,KAAK,CACLC,EACF,CAAC,GAAK,CACJ,GAAI,CAAAC,SAAS,CAAGF,KAAK,CAACG,MAAM,CAC5B,GAAIX,MAAM,EAAIQ,KAAK,CAACR,MAAM,CAAEU,SAAS,EAAK,IAAGF,KAAK,CAACR,MAAO,EAAC,CAC3D,GAAIE,QAAQ,CAAE,CACZ,GAAIM,KAAK,CAACN,QAAQ,CAAEQ,SAAS,EAAK,IAAGF,KAAK,CAACN,QAAS,EAAC,CACrD,mBACE,GAAAN,WAAA,CAAAgB,GAAA,SAAKF,SAAS,CAAEA,SAAU,CAAAT,QAAA,CACvBA,QAAQ,CACN,CAET,CACA,GAAIQ,EAAE,CAAE,CACN,mBACE,GAAAb,WAAA,CAAAgB,GAAA,EAAClB,KAAA,CAAAmB,OAAI,EACHH,SAAS,CAAEA,SAAU,CACrBP,QAAQ,CAAEA,QAAS,CACnBC,OAAO,CAAEA,OAAQ,CACjBC,WAAW,CAAEA,WAAY,CACzBC,UAAU,CAAEA,UAAW,CACvBC,OAAO,CAAEA,OAAQ,CACjBE,EAAE,CAAEA,EAAG,CAAAR,QAAA,CAENA,QAAQ,CACL,CAEV,CAEA,mBACE,GAAAL,WAAA,CAAAgB,GAAA,SACEF,SAAS,CAAEA,SAAU,CACrBN,OAAO,CAAEA,OAAQ,CACjBU,SAAS,CAAEV,OAAO,GAAMW,CAAC,EAAK,CAC5B,GAAIA,CAAC,CAACC,GAAG,GAAK,OAAO,CAAEZ,OAAO,CAACW,CAAC,CAClC,CAAC,CAAE,CACHV,WAAW,CAAEA,WAAY,CACzBY,IAAI,CAAC,QAAQ,CACbC,QAAQ,CAAE,CAAE,CAAAjB,QAAA,CAEXA,QAAQ,CACN,CAET,CAAC,CAED;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAkB,YAAY,CAAG,GAAAC,oBAAM,EAACrB,UAAU,CAAE,QAAQ,CAAED,cAAc,CAAED,YAAY,CAAC,CAE/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACAE,UAAU,CAACsB,YAAY,CAAG,CACxBrB,MAAM,CAAE,KAAK,CACbC,QAAQ,CAAEqB,SAAS,CACnBpB,QAAQ,CAAE,KAAK,CACfC,QAAQ,CAAE,KAAK,CACfC,OAAO,CAAEkB,SAAS,CAClBjB,WAAW,CAAEiB,SAAS,CACtBhB,UAAU,CAAE,KAAK,CACjBC,OAAO,CAAE,KAAK,CACdE,EAAE,CAAEa,SACN,CAAC,CAEDvB,UAAU,CAACwB,SAAS,CAAG,CACrBvB,MAAM,CAAEwB,kBAAE,CAACC,IAAI,CACfxB,QAAQ,CAAEuB,kBAAE,CAACE,IAAI,CACjBxB,QAAQ,CAAEsB,kBAAE,CAACC,IAAI,CACjBtB,QAAQ,CAAEqB,kBAAE,CAACC,IAAI,CACjBrB,OAAO,CAAEoB,kBAAE,CAACG,IAAI,CAChBtB,WAAW,CAAEmB,kBAAE,CAACG,IAAI,CACpBrB,UAAU,CAAEkB,kBAAE,CAACC,IAAI,CACnBlB,OAAO,CAAEiB,kBAAE,CAACC,IAAI,CAChBjB,KAAK,CAAEW,YAAY,CAACS,SAAS,CAACC,UAAU,CACxCpB,EAAE,CAAEe,kBAAE,CAACM,SAAS,CAAC,CAACN,kBAAE,CAACO,MAAM,CAAEP,kBAAE,CAACQ,MAAM,CAAC,CACzC,CAAC,CAAC,IAAAC,QAAA,CAAAC,OAAA,CAAArB,OAAA,CAEaM,YAAY"}
|