@dr.pogodin/react-utils 1.47.0-alpha.1 → 1.47.0-alpha.11

package/build/production/shared/components/NavLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavLink.js","names":["_reactRouter","require","_GenericLink","_interopRequireDefault","_jsxRuntime","NavLink","props","_jsx","GenericLink","routerLinkType","RrNavLink","_default","exports","default"],"sources":["../../../../src/shared/components/NavLink.tsx"],"sourcesContent":["import { type NavLinkProps, NavLink as RrNavLink } from 'react-router';\n\nimport GenericLink, { type PropsT as GenericLinkPropsT } from './GenericLink';\n\ntype PropsT = Omit<GenericLinkPropsT, 'routerLinkType'> & NavLinkProps;\n\nconst NavLink: React.FunctionComponent<PropsT>\n  = (props) => (\n    <GenericLink\n      // TODO: I guess, we better re-write it to avoid the props spreading,\n      // but no need to spend time on it right now.\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n      routerLinkType={RrNavLink}\n    />\n  );\n\nexport default NavLink;\n"],"mappings":"gLAAA,IAAAA,YAAA,CAAAC,OAAA,iBAEA,IAAAC,YAAA,CAAAC,sBAAA,CAAAF,OAAA,mBAA8E,IAAAG,WAAA,CAAAH,OAAA,sBAI9E,KAAM,CAAAI,OAAwC,CACzCC,KAAK,eACN,GAAAC,eAAA,EAACC,oBACC;AACA;AACA;AAAA,KACIF,KAAK,CACTG,cAAc,CAAEC,oBAAU,CAC3B,CACF,KAAAC,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEYR,OAAO","ignoreList":[]}
+{"version":3,"file":"NavLink.js","names":["NavLink","RrNavLink","GenericLink","jsx","_jsx","props","routerLinkType"],"sources":["../../../../src/shared/components/NavLink.tsx"],"sourcesContent":["import { type NavLinkProps, NavLink as RrNavLink } from 'react-router';\n\nimport GenericLink, { type PropsT as GenericLinkPropsT } from './GenericLink';\n\ntype PropsT = Omit<GenericLinkPropsT, 'routerLinkType'> & NavLinkProps;\n\nconst NavLink: React.FunctionComponent<PropsT>\n  = (props) => (\n    <GenericLink\n      // TODO: I guess, we better re-write it to avoid the props spreading,\n      // but no need to spend time on it right now.\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n      routerLinkType={RrNavLink}\n    />\n  );\n\nexport default NavLink;\n"],"mappings":"AAAA,OAA4BA,OAAO,GAAI,CAAAC,SAAS,KAAQ,cAAc,OAE/D,CAAAC,WAAW,8BAA4D,OAAAC,GAAA,IAAAC,IAAA,yBAI9E,KAAM,CAAAJ,OAAwC,CACzCK,KAAK,eACND,IAAA,CAACF,WACC;AACA;AACA;AAAA,KACIG,KAAK,CACTC,cAAc,CAAEL,SAAU,CAC3B,CACF,CAEH,cAAe,CAAAD,OAAO","ignoreList":[]}

package/build/production/shared/components/PageLayout/index.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const baseTheme={"context":"zv9tdn","ad":"yr8hbI","hoc":"_01Mz0J","container":"blPmpk","mainPanel":"zPoY0u","sidePanel":"mRD159"};/**
+import themed from"@dr.pogodin/react-themes";const baseTheme={"context":"zv9tdn","ad":"yr8hbI","hoc":"_01Mz0J","container":"blPmpk","mainPanel":"zPoY0u","sidePanel":"mRD159"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";/**
  * Simple and themeable page layout. It keeps the main content centered in
  * a column of limited width, which fills entire viewport on small screens
  * (under `$screen-md = 1024px` size). At larger screens the column keeps
@@ -12,5 +12,5 @@
  * @param {PageLayoutTheme} [props.theme] _Ad hoc_ theme.
  * @param {...any} [props....]
  * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
- */const PageLayout=({children,leftSidePanelContent,rightSidePanelContent,theme})=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:[theme.sidePanel,theme.leftSidePanel].join(" "),children:leftSidePanelContent}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.mainPanel,children:children}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:[theme.sidePanel,theme.rightSidePanel].join(" "),children:rightSidePanelContent})]});var _default=exports.default=(0,_reactThemes.default)(PageLayout,"PageLayout",baseTheme);
+ */const PageLayout=({children,leftSidePanelContent,rightSidePanelContent,theme})=>/*#__PURE__*/_jsxs("div",{className:theme.container,children:[/*#__PURE__*/_jsx("div",{className:[theme.sidePanel,theme.leftSidePanel].join(" "),children:leftSidePanelContent}),/*#__PURE__*/_jsx("div",{className:theme.mainPanel,children:children}),/*#__PURE__*/_jsx("div",{className:[theme.sidePanel,theme.rightSidePanel].join(" "),children:rightSidePanelContent})]});export default/* #__PURE__ */themed(PageLayout,"PageLayout",baseTheme);
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/PageLayout/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_reactThemes","_interopRequireDefault","require","_jsxRuntime","baseTheme","PageLayout","children","leftSidePanelContent","rightSidePanelContent","theme","_jsxs","className","container","_jsx","sidePanel","leftSidePanel","join","mainPanel","rightSidePanel","_default","exports","default","themed"],"sources":["../../../../../src/shared/components/PageLayout/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\n\ntype ThemeKeyT = 'container' | 'leftSidePanel' | 'mainPanel' | 'rightSidePanel'\n  | 'sidePanel';\n\ntype PropsT = {\n  children?: ReactNode;\n  leftSidePanelContent?: ReactNode;\n  rightSidePanelContent?: ReactNode;\n  theme: Theme<ThemeKeyT>;\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: React.FunctionComponent<PropsT> = ({\n  children,\n  leftSidePanelContent,\n  rightSidePanelContent,\n  theme,\n}) => (\n  <div className={theme.container}>\n    <div className={[theme.sidePanel, theme.leftSidePanel].join(' ')}>\n      {leftSidePanelContent}\n    </div>\n    <div className={theme.mainPanel}>\n      {children}\n    </div>\n    <div className={[theme.sidePanel, theme.rightSidePanel].join(' ')}>\n      {rightSidePanelContent}\n    </div>\n  </div>\n);\n\nexport default themed(PageLayout, 'PageLayout', baseTheme);\n"],"mappings":"gLAEA,IAAAA,YAAA,CAAAC,sBAAA,CAAAC,OAAA,8BAE0C,IAAAC,WAAA,CAAAD,OAAA,4BAAAE,SAAA,mHAY1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,UAA2C,CAAGA,CAAC,CACnDC,QAAQ,CACRC,oBAAoB,CACpBC,qBAAqB,CACrBC,KACF,CAAC,gBACC,GAAAC,gBAAA,SAAKC,SAAS,CAAEF,KAAK,CAACG,SAAU,CAAAN,QAAA,eAC9B,GAAAO,eAAA,SAAKF,SAAS,CAAE,CAACF,KAAK,CAACK,SAAS,CAAEL,KAAK,CAACM,aAAa,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE,CAAAV,QAAA,CAC9DC,oBAAoB,CAClB,CAAC,cACN,GAAAM,eAAA,SAAKF,SAAS,CAAEF,KAAK,CAACQ,SAAU,CAAAX,QAAA,CAC7BA,QAAQ,CACN,CAAC,cACN,GAAAO,eAAA,SAAKF,SAAS,CAAE,CAACF,KAAK,CAACK,SAAS,CAAEL,KAAK,CAACS,cAAc,CAAC,CAACF,IAAI,CAAC,GAAG,CAAE,CAAAV,QAAA,CAC/DE,qBAAqB,CACnB,CAAC,EACH,CACN,KAAAW,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEc,GAAAC,oBAAM,EAACjB,UAAU,CAAE,YAAY,CAAED,SAAS,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["themed","baseTheme","jsx","_jsx","jsxs","_jsxs","PageLayout","children","leftSidePanelContent","rightSidePanelContent","theme","className","container","sidePanel","leftSidePanel","join","mainPanel","rightSidePanel"],"sources":["../../../../../src/shared/components/PageLayout/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\n\ntype ThemeKeyT = 'container' | 'leftSidePanel' | 'mainPanel' | 'rightSidePanel'\n  | 'sidePanel';\n\ntype PropsT = {\n  children?: ReactNode;\n  leftSidePanelContent?: ReactNode;\n  rightSidePanelContent?: ReactNode;\n  theme: Theme<ThemeKeyT>;\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: React.FunctionComponent<PropsT> = ({\n  children,\n  leftSidePanelContent,\n  rightSidePanelContent,\n  theme,\n}) => (\n  <div className={theme.container}>\n    <div className={[theme.sidePanel, theme.leftSidePanel].join(' ')}>\n      {leftSidePanelContent}\n    </div>\n    <div className={theme.mainPanel}>\n      {children}\n    </div>\n    <div className={[theme.sidePanel, theme.rightSidePanel].join(' ')}>\n      {rightSidePanelContent}\n    </div>\n  </div>\n);\n\nexport default /* #__PURE__ */ themed(PageLayout, 'PageLayout', baseTheme);\n"],"mappings":"AAEA,MAAO,CAAAA,MAAM,KAAsB,0BAA0B,OAAAC,SAAA,mHAEnB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAY1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,UAA2C,CAAGA,CAAC,CACnDC,QAAQ,CACRC,oBAAoB,CACpBC,qBAAqB,CACrBC,KACF,CAAC,gBACCL,KAAA,QAAKM,SAAS,CAAED,KAAK,CAACE,SAAU,CAAAL,QAAA,eAC9BJ,IAAA,QAAKQ,SAAS,CAAE,CAACD,KAAK,CAACG,SAAS,CAAEH,KAAK,CAACI,aAAa,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE,CAAAR,QAAA,CAC9DC,oBAAoB,CAClB,CAAC,cACNL,IAAA,QAAKQ,SAAS,CAAED,KAAK,CAACM,SAAU,CAAAT,QAAA,CAC7BA,QAAQ,CACN,CAAC,cACNJ,IAAA,QAAKQ,SAAS,CAAE,CAACD,KAAK,CAACG,SAAS,CAAEH,KAAK,CAACO,cAAc,CAAC,CAACF,IAAI,CAAC,GAAG,CAAE,CAAAR,QAAA,CAC/DE,qBAAqB,CACnB,CAAC,EACH,CACN,CAED,cAAe,eAAgBT,MAAM,CAACM,UAAU,CAAE,YAAY,CAAEL,SAAS,CAAC","ignoreList":[]}

package/build/production/shared/components/TextArea/index.js

@@ -1,12 +1,12 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=require("react");var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"tECG8C","ad":"epeH4O","hoc":"_2kFnSt","container":"lV5ZyX","label":"_7qDPW1","textarea":"gkaNJJ","error":"ObwtG4","errorMessage":"ikIw0x","hidden":"-UyujK"};const TextArea=({disabled,error,label,onBlur,onChange,onKeyDown,placeholder,testId,theme,value})=>{const hiddenAreaRef=(0,_react.useRef)(null);const[height,setHeight]=(0,_react.useState)();const textAreaRef=(0,_react.useRef)(null);const[localValue,setLocalValue]=(0,_react.useState)(value??"");if(value!==undefined&&localValue!==value)setLocalValue(value);// This resizes text area's height when its width is changed for any reason.
-(0,_react.useEffect)(()=>{const el=hiddenAreaRef.current;if(!el)return undefined;const cb=()=>{setHeight(el.scrollHeight)};const observer=new ResizeObserver(cb);observer.observe(el);return()=>{observer.disconnect()}},[]);// Resizes the text area when its content is modified.
+import{useEffect,useLayoutEffect,useRef,useState}from"react";import themed from"@dr.pogodin/react-themes";const defaultTheme={"context":"tECG8C","ad":"epeH4O","hoc":"_2kFnSt","container":"lV5ZyX","label":"_7qDPW1","textarea":"gkaNJJ","error":"ObwtG4","errorMessage":"ikIw0x","hidden":"-UyujK"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const TextArea=({disabled,error,label,onBlur,onChange,onKeyDown,placeholder,testId,theme,value})=>{const hiddenAreaRef=useRef(null);const[height,setHeight]=useState();const textAreaRef=useRef(null);const[localValue,setLocalValue]=useState(value??"");if(value!==undefined&&localValue!==value)setLocalValue(value);// This resizes text area's height when its width is changed for any reason.
+useEffect(()=>{const el=hiddenAreaRef.current;if(!el)return undefined;const cb=()=>{setHeight(el.scrollHeight)};const observer=new ResizeObserver(cb);observer.observe(el);return()=>{observer.disconnect()}},[]);// Resizes the text area when its content is modified.
 //
 // NOTE: useLayoutEffect() instead of useEffect() makes difference here,
 // as it helps to avoid visible "content/height" jumps (i.e. with just
 // useEffect() it becomes visible how the content is modified first,
 // and then input height is incremented, if necessary).
 // See: https://github.com/birdofpreyru/react-utils/issues/313
-(0,_react.useLayoutEffect)(()=>{const el=hiddenAreaRef.current;if(el)setHeight(el.scrollHeight)},[localValue]);let containerClassName=theme.container;if(error)containerClassName+=` ${theme.error}`;return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:containerClassName,onFocus:()=>{textAreaRef.current?.focus()},children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsx)("textarea",{className:`${theme.textarea} ${theme.hidden}`// This text area is hidden underneath the primary one below,
+useLayoutEffect(()=>{const el=hiddenAreaRef.current;if(el)setHeight(el.scrollHeight)},[localValue]);let containerClassName=theme.container;if(error)containerClassName+=` ${theme.error}`;return/*#__PURE__*/_jsxs("div",{className:containerClassName,onFocus:()=>{textAreaRef.current?.focus()},children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:theme.label,children:label}),/*#__PURE__*/_jsx("textarea",{className:`${theme.textarea} ${theme.hidden}`// This text area is hidden underneath the primary one below,
 // and it is used for text measurements, to implement auto-scaling
 // of the primary textarea's height.
 ,readOnly:true,ref:hiddenAreaRef// The "-1" value of "tabIndex" removes this hidden text area from
@@ -15,8 +15,8 @@
 // area is zero, thus collapsing <TextArea> height below the single line
 // input height. To avoid it we fallback to whitespace (" ") character
 // here.
-,value:localValue||" "}),/*#__PURE__*/(0,_jsxRuntime.jsx)("textarea",{className:theme.textarea,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,disabled:disabled,onBlur:onBlur// When value is "undefined" the text area is not-managed, and we should
+,value:localValue||" "}),/*#__PURE__*/_jsx("textarea",{className:theme.textarea,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,disabled:disabled,onBlur:onBlur// When value is "undefined" the text area is not-managed, and we should
 // manage it internally for the measurement / resizing functionality
 // to work.
-,onChange:value===undefined?e=>{setLocalValue(e.target.value)}:onChange,onKeyDown:onKeyDown,placeholder:placeholder,ref:textAreaRef,style:{height},value:localValue}),error&&error!==true?/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.errorMessage,children:error}):null]})};var _default=exports.default=(0,_reactThemes.default)(TextArea,"TextArea",defaultTheme);
+,onChange:value===undefined?e=>{setLocalValue(e.target.value)}:onChange,onKeyDown:onKeyDown,placeholder:placeholder,ref:textAreaRef,style:{height},value:localValue}),error&&error!==true?/*#__PURE__*/_jsx("div",{className:theme.errorMessage,children:error}):null]})};export default/* #__PURE__ */themed(TextArea,"TextArea",defaultTheme);
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/TextArea/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","require","_reactThemes","_interopRequireDefault","_jsxRuntime","defaultTheme","TextArea","disabled","error","label","onBlur","onChange","onKeyDown","placeholder","testId","theme","value","hiddenAreaRef","useRef","height","setHeight","useState","textAreaRef","localValue","setLocalValue","undefined","useEffect","el","current","cb","scrollHeight","observer","ResizeObserver","observe","disconnect","useLayoutEffect","containerClassName","container","_jsxs","className","onFocus","focus","children","_jsx","textarea","hidden","readOnly","ref","tabIndex","process","env","NODE_ENV","e","target","style","errorMessage","_default","exports","default","themed"],"sources":["../../../../../src/shared/components/TextArea/index.tsx"],"sourcesContent":["import {\n  type ChangeEventHandler,\n  type FocusEventHandler,\n  type FunctionComponent,\n  type KeyboardEventHandler,\n  type ReactNode,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\ntype ThemeKeyT = 'container' | 'error' | 'errorMessage' | 'hidden' | 'label'\n  | 'textarea';\n\ntype Props = {\n  disabled?: boolean;\n  error?: ReactNode;\n  label?: string;\n  onBlur?: FocusEventHandler<HTMLTextAreaElement>;\n  onChange?: ChangeEventHandler<HTMLTextAreaElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;\n  placeholder?: string;\n  testId?: string;\n  theme: Theme<ThemeKeyT>;\n  value?: string;\n};\n\nconst TextArea: FunctionComponent<Props> = ({\n  disabled,\n  error,\n  label,\n  onBlur,\n  onChange,\n  onKeyDown,\n  placeholder,\n  testId,\n  theme,\n  value,\n}) => {\n  const hiddenAreaRef = useRef<HTMLTextAreaElement>(null);\n  const [height, setHeight] = useState<number | undefined>();\n\n  const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n  const [localValue, setLocalValue] = 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  useEffect(() => {\n    const el = hiddenAreaRef.current;\n    if (!el) return undefined;\n\n    const cb = () => {\n      setHeight(el.scrollHeight);\n    };\n    const observer = new ResizeObserver(cb);\n    observer.observe(el);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, []);\n\n  // Resizes the text area when its content is modified.\n  //\n  // NOTE: useLayoutEffect() instead of useEffect() makes difference here,\n  // as it helps to avoid visible \"content/height\" jumps (i.e. with just\n  // useEffect() it becomes visible how the content is modified first,\n  // and then input height is incremented, if necessary).\n  // See: https://github.com/birdofpreyru/react-utils/issues/313\n  useLayoutEffect(() => {\n    const el = hiddenAreaRef.current;\n    if (el) setHeight(el.scrollHeight);\n  }, [localValue]);\n\n  let containerClassName = theme.container;\n  if (error) containerClassName += ` ${theme.error}`;\n\n  return (\n    <div\n      className={containerClassName}\n      onFocus={() => {\n        textAreaRef.current?.focus();\n      }}\n    >\n      {label === undefined ? null : <div className={theme.label}>{label}</div>}\n      <textarea\n        className={`${theme.textarea} ${theme.hidden}`}\n\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\n        ref={hiddenAreaRef}\n\n        // The \"-1\" value of \"tabIndex\" removes this hidden text area from\n        // the tab-focus-chain.\n        tabIndex={-1}\n\n        // NOTE: With empty string value (\"\") the scrolling height of this text\n        // area is zero, thus collapsing <TextArea> height below the single line\n        // input height. To avoid it we fallback to whitespace (\" \") character\n        // here.\n        value={localValue || ' '}\n      />\n      <textarea\n        className={theme.textarea}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        disabled={disabled}\n        onBlur={onBlur}\n\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={\n          value === undefined\n            ? (e) => {\n              setLocalValue(e.target.value);\n            } : onChange\n        }\n        onKeyDown={onKeyDown}\n        placeholder={placeholder}\n        ref={textAreaRef}\n        style={{ height }}\n        value={localValue}\n      />\n      {error && error !== true\n        ? <div className={theme.errorMessage}>{error}</div>\n        : null}\n    </div>\n  );\n};\n\nexport default themed(TextArea, 'TextArea', defaultTheme);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useEffect","useLayoutEffect","useRef","useState","themed","defaultTheme","jsx","_jsx","jsxs","_jsxs","TextArea","disabled","error","label","onBlur","onChange","onKeyDown","placeholder","testId","theme","value","hiddenAreaRef","height","setHeight","textAreaRef","localValue","setLocalValue","undefined","el","current","cb","scrollHeight","observer","ResizeObserver","observe","disconnect","containerClassName","container","className","onFocus","focus","children","textarea","hidden","readOnly","ref","tabIndex","process","env","NODE_ENV","e","target","style","errorMessage"],"sources":["../../../../../src/shared/components/TextArea/index.tsx"],"sourcesContent":["import {\n  type ChangeEventHandler,\n  type FocusEventHandler,\n  type FunctionComponent,\n  type KeyboardEventHandler,\n  type ReactNode,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './style.scss';\n\ntype ThemeKeyT = 'container' | 'error' | 'errorMessage' | 'hidden' | 'label'\n  | 'textarea';\n\ntype Props = {\n  disabled?: boolean;\n  error?: ReactNode;\n  label?: string;\n  onBlur?: FocusEventHandler<HTMLTextAreaElement>;\n  onChange?: ChangeEventHandler<HTMLTextAreaElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;\n  placeholder?: string;\n  testId?: string;\n  theme: Theme<ThemeKeyT>;\n  value?: string;\n};\n\nconst TextArea: FunctionComponent<Props> = ({\n  disabled,\n  error,\n  label,\n  onBlur,\n  onChange,\n  onKeyDown,\n  placeholder,\n  testId,\n  theme,\n  value,\n}) => {\n  const hiddenAreaRef = useRef<HTMLTextAreaElement>(null);\n  const [height, setHeight] = useState<number | undefined>();\n\n  const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n  const [localValue, setLocalValue] = 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  useEffect(() => {\n    const el = hiddenAreaRef.current;\n    if (!el) return undefined;\n\n    const cb = () => {\n      setHeight(el.scrollHeight);\n    };\n    const observer = new ResizeObserver(cb);\n    observer.observe(el);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, []);\n\n  // Resizes the text area when its content is modified.\n  //\n  // NOTE: useLayoutEffect() instead of useEffect() makes difference here,\n  // as it helps to avoid visible \"content/height\" jumps (i.e. with just\n  // useEffect() it becomes visible how the content is modified first,\n  // and then input height is incremented, if necessary).\n  // See: https://github.com/birdofpreyru/react-utils/issues/313\n  useLayoutEffect(() => {\n    const el = hiddenAreaRef.current;\n    if (el) setHeight(el.scrollHeight);\n  }, [localValue]);\n\n  let containerClassName = theme.container;\n  if (error) containerClassName += ` ${theme.error}`;\n\n  return (\n    <div\n      className={containerClassName}\n      onFocus={() => {\n        textAreaRef.current?.focus();\n      }}\n    >\n      {label === undefined ? null : <div className={theme.label}>{label}</div>}\n      <textarea\n        className={`${theme.textarea} ${theme.hidden}`}\n\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\n        ref={hiddenAreaRef}\n\n        // The \"-1\" value of \"tabIndex\" removes this hidden text area from\n        // the tab-focus-chain.\n        tabIndex={-1}\n\n        // NOTE: With empty string value (\"\") the scrolling height of this text\n        // area is zero, thus collapsing <TextArea> height below the single line\n        // input height. To avoid it we fallback to whitespace (\" \") character\n        // here.\n        value={localValue || ' '}\n      />\n      <textarea\n        className={theme.textarea}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        disabled={disabled}\n        onBlur={onBlur}\n\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={\n          value === undefined\n            ? (e) => {\n              setLocalValue(e.target.value);\n            } : onChange\n        }\n        onKeyDown={onKeyDown}\n        placeholder={placeholder}\n        ref={textAreaRef}\n        style={{ height }}\n        value={localValue}\n      />\n      {error && error !== true\n        ? <div className={theme.errorMessage}>{error}</div>\n        : null}\n    </div>\n  );\n};\n\nexport default /* #__PURE__ */ themed(TextArea, 'TextArea', defaultTheme);\n"],"mappings":"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","ignoreList":[]}

package/build/production/shared/components/Throbber/index.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _jsxRuntime=require("react/jsx-runtime");const defaultTheme={"context":"eVCJf-","ad":"CU2B6H","hoc":"_1V5iVx","bouncing":"h6ZYmQ","container":"VDVI-X","circle":"Y2rzbL"};/**
+import themed from"@dr.pogodin/react-themes";const defaultTheme={"context":"eVCJf-","ad":"CU2B6H","hoc":"_1V5iVx","bouncing":"h6ZYmQ","container":"VDVI-X","circle":"Y2rzbL"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";/**
  * Throbber is an "action in progress" indicator, which renders
  * three bouncing circles as a simple pending activity indicator,
  * and can be further themed to a certain degree.
@@ -6,5 +6,5 @@
  * @param {ThrobberTheme} [props.theme] _Ad hoc_ theme.
  * @param {...any} [props....]
  * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
- */const Throbber=({theme})=>/*#__PURE__*/(0,_jsxRuntime.jsxs)("span",{className:theme.container,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)("span",{className:theme.circle}),/*#__PURE__*/(0,_jsxRuntime.jsx)("span",{className:theme.circle}),/*#__PURE__*/(0,_jsxRuntime.jsx)("span",{className:theme.circle})]});var _default=exports.default=(0,_reactThemes.default)(Throbber,"Throbber",defaultTheme);
+ */const Throbber=({theme})=>/*#__PURE__*/_jsxs("span",{className:theme.container,children:[/*#__PURE__*/_jsx("span",{className:theme.circle}),/*#__PURE__*/_jsx("span",{className:theme.circle}),/*#__PURE__*/_jsx("span",{className:theme.circle})]});export default/* #__PURE__ */themed(Throbber,"Throbber",defaultTheme);
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/Throbber/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_reactThemes","_interopRequireDefault","require","_jsxRuntime","defaultTheme","Throbber","theme","_jsxs","className","container","children","_jsx","circle","_default","exports","default","themed"],"sources":["../../../../../src/shared/components/Throbber/index.tsx"],"sourcesContent":["import themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeKeyT = 'bouncing' | 'circle' | 'container';\n\ntype PropsT = {\n  theme: Theme<ThemeKeyT>;\n};\n\n/**\n * Throbber is an \"action in progress\" indicator, which renders\n * three bouncing circles as a simple pending activity indicator,\n * and can be further themed to a certain degree.\n * @param {object} [props] Component properties.\n * @param {ThrobberTheme} [props.theme] _Ad hoc_ theme.\n * @param {...any} [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Throbber: React.FunctionComponent<PropsT> = ({ theme }) => (\n  <span className={theme.container}>\n    <span className={theme.circle} />\n    <span className={theme.circle} />\n    <span className={theme.circle} />\n  </span>\n);\n\nexport default themed(Throbber, 'Throbber', defaultTheme);\n"],"mappings":"gLAAA,IAAAA,YAAA,CAAAC,sBAAA,CAAAC,OAAA,8BAEwC,IAAAC,WAAA,CAAAD,OAAA,4BAAAE,YAAA,+GAQxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,QAAyC,CAAGA,CAAC,CAAEC,KAAM,CAAC,gBAC1D,GAAAC,gBAAA,UAAMC,SAAS,CAAEF,KAAK,CAACG,SAAU,CAAAC,QAAA,eAC/B,GAAAC,eAAA,UAAMH,SAAS,CAAEF,KAAK,CAACM,MAAO,CAAE,CAAC,cACjC,GAAAD,eAAA,UAAMH,SAAS,CAAEF,KAAK,CAACM,MAAO,CAAE,CAAC,cACjC,GAAAD,eAAA,UAAMH,SAAS,CAAEF,KAAK,CAACM,MAAO,CAAE,CAAC,EAC7B,CACP,KAAAC,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEc,GAAAC,oBAAM,EAACX,QAAQ,CAAE,UAAU,CAAED,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["themed","defaultTheme","jsx","_jsx","jsxs","_jsxs","Throbber","theme","className","container","children","circle"],"sources":["../../../../../src/shared/components/Throbber/index.tsx"],"sourcesContent":["import themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeKeyT = 'bouncing' | 'circle' | 'container';\n\ntype PropsT = {\n  theme: Theme<ThemeKeyT>;\n};\n\n/**\n * Throbber is an \"action in progress\" indicator, which renders\n * three bouncing circles as a simple pending activity indicator,\n * and can be further themed to a certain degree.\n * @param {object} [props] Component properties.\n * @param {ThrobberTheme} [props.theme] _Ad hoc_ theme.\n * @param {...any} [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Throbber: React.FunctionComponent<PropsT> = ({ theme }) => (\n  <span className={theme.container}>\n    <span className={theme.circle} />\n    <span className={theme.circle} />\n    <span className={theme.circle} />\n  </span>\n);\n\nexport default /* #__PURE__ */ themed(Throbber, 'Throbber', defaultTheme);\n"],"mappings":"AAAA,MAAO,CAAAA,MAAM,KAAsB,0BAA0B,OAAAC,YAAA,+GAErB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAQxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,QAAyC,CAAGA,CAAC,CAAEC,KAAM,CAAC,gBAC1DF,KAAA,SAAMG,SAAS,CAAED,KAAK,CAACE,SAAU,CAAAC,QAAA,eAC/BP,IAAA,SAAMK,SAAS,CAAED,KAAK,CAACI,MAAO,CAAE,CAAC,cACjCR,IAAA,SAAMK,SAAS,CAAED,KAAK,CAACI,MAAO,CAAE,CAAC,cACjCR,IAAA,SAAMK,SAAS,CAAED,KAAK,CAACI,MAAO,CAAE,CAAC,EAC7B,CACP,CAED,cAAe,eAAgBX,MAAM,CAACM,QAAQ,CAAE,UAAU,CAAEL,YAAY,CAAC","ignoreList":[]}

package/build/production/shared/components/WithTooltip/Tooltip.js

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.PLACEMENTS=void 0;var _react=require("react");var _reactDom=require("react-dom");var _jsxRuntime=require("react/jsx-runtime");/**
+/**
  * The actual tooltip component. It is rendered outside the regular document
  * hierarchy, and with sub-components managed without React to achieve the best
  * performance during animation.
- *//**
+ */import{useImperativeHandle,useRef}from"react";import{createPortal}from"react-dom";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";/**
  * Valid placements of the rendered tooltip. They will be overriden when
  * necessary to fit the tooltip within the viewport.
- */let PLACEMENTS=exports.PLACEMENTS=/*#__PURE__*/function(PLACEMENTS){PLACEMENTS["ABOVE_CURSOR"]="ABOVE_CURSOR";PLACEMENTS["ABOVE_ELEMENT"]="ABOVE_ELEMENT";PLACEMENTS["BELOW_CURSOR"]="BELOW_CURSOR";PLACEMENTS["BELOW_ELEMENT"]="BELOW_ELEMENT";return PLACEMENTS}({});const ARROW_STYLE_DOWN=["border-bottom-color:transparent","border-left-color:transparent","border-right-color:transparent"].join(";");const ARROW_STYLE_UP=["border-top-color:transparent","border-left-color:transparent","border-right-color:transparent"].join(";");/**
+ */export let PLACEMENTS=/*#__PURE__*/function(PLACEMENTS){PLACEMENTS["ABOVE_CURSOR"]="ABOVE_CURSOR";PLACEMENTS["ABOVE_ELEMENT"]="ABOVE_ELEMENT";PLACEMENTS["BELOW_CURSOR"]="BELOW_CURSOR";PLACEMENTS["BELOW_ELEMENT"]="BELOW_ELEMENT";return PLACEMENTS}({});const ARROW_STYLE_DOWN=["border-bottom-color:transparent","border-left-color:transparent","border-right-color:transparent"].join(";");const ARROW_STYLE_UP=["border-top-color:transparent","border-left-color:transparent","border-right-color:transparent"].join(";");/**
  * Generates bounding client rectangles for tooltip components.
  * @ignore
  * @param tooltip DOM references to the tooltip components.
@@ -93,5 +93,5 @@ baseArrowStyle:ARROW_STYLE_DOWN}}// const HIT = {
 // rendering cycles, and only then it can be correctly measured and positioned.
 // Thus, when we create the <Tooltip> we have to record its target positioning
 // details, and then apply them when it is created.
-const arrowRef=(0,_react.useRef)(null);const containerRef=(0,_react.useRef)(null);const contentRef=(0,_react.useRef)(null);const pointTo=(pageX,pageY,placement,element)=>{if(!arrowRef.current||!containerRef.current||!contentRef.current){throw Error("Internal error")}setComponentPositions(pageX,pageY,placement,element,{arrow:arrowRef.current,container:containerRef.current,content:contentRef.current})};(0,_react.useImperativeHandle)(ref,()=>({pointTo}));return/*#__PURE__*/(0,_reactDom.createPortal)(/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,ref:containerRef,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.arrow,ref:arrowRef}),/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.content,ref:contentRef,children:children})]}),document.body)};var _default=exports.default=Tooltip;
+const arrowRef=useRef(null);const containerRef=useRef(null);const contentRef=useRef(null);const pointTo=(pageX,pageY,placement,element)=>{if(!arrowRef.current||!containerRef.current||!contentRef.current){throw Error("Internal error")}setComponentPositions(pageX,pageY,placement,element,{arrow:arrowRef.current,container:containerRef.current,content:contentRef.current})};useImperativeHandle(ref,()=>({pointTo}));return/*#__PURE__*/createPortal(/*#__PURE__*/_jsxs("div",{className:theme.container,ref:containerRef,children:[/*#__PURE__*/_jsx("div",{className:theme.arrow,ref:arrowRef}),/*#__PURE__*/_jsx("div",{className:theme.content,ref:contentRef,children:children})]}),document.body)};export default Tooltip;
 //# sourceMappingURL=Tooltip.js.map

package/build/production/shared/components/WithTooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["_react","require","_reactDom","_jsxRuntime","PLACEMENTS","exports","ARROW_STYLE_DOWN","join","ARROW_STYLE_UP","calcTooltipRects","tooltip","arrow","getBoundingClientRect","container","calcViewportRect","scrollX","scrollY","window","documentElement","clientHeight","clientWidth","document","bottom","left","right","top","calcPositionAboveXY","x","y","tooltipRects","arrowX","width","arrowY","height","containerX","containerY","baseArrowStyle","setComponentPositions","pageX","pageY","placement","element","viewportRect","pos","Math","max","maxX","min","containerStyle","setAttribute","arrowStyle","Tooltip","children","ref","theme","arrowRef","useRef","containerRef","contentRef","pointTo","current","Error","content","useImperativeHandle","createPortal","_jsxs","className","_jsx","body","_default","default"],"sources":["../../../../../src/shared/components/WithTooltip/Tooltip.tsx"],"sourcesContent":["/**\n * The actual tooltip component. It is rendered outside the regular document\n * hierarchy, and with sub-components managed without React to achieve the best\n * performance during animation.\n */\n\nimport {\n  type FunctionComponent,\n  type ReactNode,\n  type RefObject,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport type { Theme } from '@dr.pogodin/react-themes';\n\n/**\n * Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport.\n */\nexport enum PLACEMENTS {\n  ABOVE_CURSOR = 'ABOVE_CURSOR',\n  ABOVE_ELEMENT = 'ABOVE_ELEMENT',\n  BELOW_CURSOR = 'BELOW_CURSOR',\n  BELOW_ELEMENT = 'BELOW_ELEMENT',\n}\n\nconst ARROW_STYLE_DOWN = [\n  'border-bottom-color:transparent',\n  'border-left-color:transparent',\n  'border-right-color:transparent',\n].join(';');\n\nconst ARROW_STYLE_UP = [\n  'border-top-color:transparent',\n  'border-left-color:transparent',\n  'border-right-color:transparent',\n].join(';');\n\ntype ComponentsT = {\n  container: HTMLDivElement;\n  arrow: HTMLDivElement;\n  content: HTMLDivElement;\n};\n\nexport type ThemeKeysT = 'appearance' | 'arrow' | 'content' | 'container';\n\ntype TooltipThemeT = Theme<ThemeKeysT>;\n\ntype TooltipRectsT = {\n  arrow: DOMRect;\n  container: DOMRect;\n};\n\n/**\n * Generates bounding client rectangles for tooltip components.\n * @ignore\n * @param tooltip DOM references to the tooltip components.\n * @param tooltip.arrow\n * @param tooltip.container\n * @return Object holding tooltip rectangles in\n *  two fields.\n */\nfunction calcTooltipRects(tooltip: ComponentsT): TooltipRectsT {\n  return {\n    arrow: tooltip.arrow.getBoundingClientRect(),\n    container: tooltip.container.getBoundingClientRect(),\n  };\n}\n\n/**\n * Calculates the document viewport size.\n * @ignore\n * @return {{x, y, width, height}}\n */\nfunction calcViewportRect() {\n  const { scrollX, scrollY } = window;\n  const { documentElement: { clientHeight, clientWidth } } = document;\n  return {\n    bottom: scrollY + clientHeight,\n    left: scrollX,\n    right: scrollX + clientWidth,\n    top: scrollY,\n  };\n}\n\n/**\n * Calculates tooltip and arrow positions for the placement just above\n * the cursor.\n * @ignore\n * @param {number} x Cursor page-x position.\n * @param {number} y Cursor page-y position.\n * @param {object} tooltipRects Bounding client rectangles of tooltip parts.\n * @param {object} tooltipRects.arrow\n * @param {object} tooltipRects.container\n * @return {object} Contains the following fields:\n *  - {number} arrowX\n *  - {number} arrowY\n *  - {number} containerX\n *  - {number} containerY\n *  - {string} baseArrowStyle\n */\nfunction calcPositionAboveXY(\n  x: number,\n  y: number,\n  tooltipRects: TooltipRectsT,\n) {\n  const { arrow, container } = tooltipRects;\n  return {\n    arrowX: 0.5 * (container.width - arrow.width),\n    arrowY: container.height,\n    containerX: x - container.width / 2,\n    containerY: y - container.height - arrow.height / 1.5,\n\n    // TODO: Instead of already setting the base style here, we should\n    // introduce a set of constants for arrow directions, which will help\n    // to do checks dependant on the arrow direction.\n    baseArrowStyle: ARROW_STYLE_DOWN,\n  };\n}\n\n// const HIT = {\n//   NONE: false,\n//   LEFT: 'LEFT',\n//   RIGHT: 'RIGHT',\n//   TOP: 'TOP',\n//   BOTTOM: 'BOTTOM',\n// };\n\n/**\n * Checks whether\n * @param {object} pos\n * @param {object} tooltipRects\n * @param {object} viewportRect\n * @return {HIT}\n */\n// function 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 * 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// function 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 * Sets positions of tooltip components to point the tooltip to the specified\n * page point.\n * @ignore\n * @param pageX\n * @param pageY\n * @param placement\n * @param element DOM reference to the element wrapped by the tooltip.\n * @param tooltip\n * @param tooltip.arrow DOM reference to the tooltip arrow.\n * @param tooltip.container DOM reference to the tooltip container.\n */\nfunction setComponentPositions(\n  pageX: number,\n  pageY: number,\n  placement: PLACEMENTS | undefined,\n  element: HTMLElement | undefined,\n  tooltip: ComponentsT,\n) {\n  const tooltipRects = calcTooltipRects(tooltip);\n  const viewportRect = calcViewportRect();\n\n  /* Default container coords: tooltip at the top. */\n  const pos = calcPositionAboveXY(pageX, pageY, tooltipRects);\n\n  if (pos.containerX < viewportRect.left + 6) {\n    pos.containerX = viewportRect.left + 6;\n    pos.arrowX = Math.max(\n      6,\n      pageX - pos.containerX - tooltipRects.arrow.width / 2,\n    );\n  } else {\n    const maxX = viewportRect.right - 6 - tooltipRects.container.width;\n    if (pos.containerX > maxX) {\n      pos.containerX = maxX;\n      pos.arrowX = Math.min(\n        tooltipRects.container.width - 6,\n        pageX - pos.containerX - tooltipRects.arrow.width / 2,\n      );\n    }\n  }\n\n  /* If tooltip has not enough space on top - make it bottom tooltip. */\n  if (pos.containerY < viewportRect.top + 6) {\n    pos.containerY += tooltipRects.container.height\n      + 2 * tooltipRects.arrow.height;\n    pos.arrowY -= tooltipRects.container.height\n      + tooltipRects.arrow.height;\n    pos.baseArrowStyle = ARROW_STYLE_UP;\n  }\n\n  const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n  tooltip.container.setAttribute('style', containerStyle);\n\n  const arrowStyle = `${pos.baseArrowStyle};left:${pos.arrowX}px;top:${pos.arrowY}px`;\n  tooltip.arrow.setAttribute('style', arrowStyle);\n}\n\n/* The Tooltip component itself. */\nconst Tooltip: FunctionComponent<{\n  children?: ReactNode;\n  ref?: RefObject<unknown>;\n  theme: TooltipThemeT;\n}> = ({ children, ref, theme }) => {\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 arrowRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  const pointTo = (\n    pageX: number,\n    pageY: number,\n    placement: PLACEMENTS,\n    element: HTMLElement,\n  ) => {\n    if (!arrowRef.current || !containerRef.current || !contentRef.current) {\n      throw Error('Internal error');\n    }\n\n    setComponentPositions(pageX, pageY, placement, element, {\n      arrow: arrowRef.current,\n      container: containerRef.current,\n      content: contentRef.current,\n    });\n  };\n  useImperativeHandle(ref, () => ({ pointTo }));\n\n  return createPortal(\n    (\n      <div className={theme.container} ref={containerRef}>\n        <div className={theme.arrow} ref={arrowRef} />\n        <div className={theme.content} ref={contentRef}>{children}</div>\n      </div>\n    ),\n    document.body,\n  );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Tooltip.js","names":["useImperativeHandle","useRef","createPortal","jsx","_jsx","jsxs","_jsxs","PLACEMENTS","ARROW_STYLE_DOWN","join","ARROW_STYLE_UP","calcTooltipRects","tooltip","arrow","getBoundingClientRect","container","calcViewportRect","scrollX","scrollY","window","documentElement","clientHeight","clientWidth","document","bottom","left","right","top","calcPositionAboveXY","x","y","tooltipRects","arrowX","width","arrowY","height","containerX","containerY","baseArrowStyle","setComponentPositions","pageX","pageY","placement","element","viewportRect","pos","Math","max","maxX","min","containerStyle","setAttribute","arrowStyle","Tooltip","children","ref","theme","arrowRef","containerRef","contentRef","pointTo","current","Error","content","className","body"],"sources":["../../../../../src/shared/components/WithTooltip/Tooltip.tsx"],"sourcesContent":["/**\n * The actual tooltip component. It is rendered outside the regular document\n * hierarchy, and with sub-components managed without React to achieve the best\n * performance during animation.\n */\n\nimport {\n  type FunctionComponent,\n  type ReactNode,\n  type RefObject,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport type { Theme } from '@dr.pogodin/react-themes';\n\n/**\n * Valid placements of the rendered tooltip. They will be overriden when\n * necessary to fit the tooltip within the viewport.\n */\nexport enum PLACEMENTS {\n  ABOVE_CURSOR = 'ABOVE_CURSOR',\n  ABOVE_ELEMENT = 'ABOVE_ELEMENT',\n  BELOW_CURSOR = 'BELOW_CURSOR',\n  BELOW_ELEMENT = 'BELOW_ELEMENT',\n}\n\nconst ARROW_STYLE_DOWN = [\n  'border-bottom-color:transparent',\n  'border-left-color:transparent',\n  'border-right-color:transparent',\n].join(';');\n\nconst ARROW_STYLE_UP = [\n  'border-top-color:transparent',\n  'border-left-color:transparent',\n  'border-right-color:transparent',\n].join(';');\n\ntype ComponentsT = {\n  container: HTMLDivElement;\n  arrow: HTMLDivElement;\n  content: HTMLDivElement;\n};\n\nexport type ThemeKeysT = 'appearance' | 'arrow' | 'content' | 'container';\n\ntype TooltipThemeT = Theme<ThemeKeysT>;\n\ntype TooltipRectsT = {\n  arrow: DOMRect;\n  container: DOMRect;\n};\n\n/**\n * Generates bounding client rectangles for tooltip components.\n * @ignore\n * @param tooltip DOM references to the tooltip components.\n * @param tooltip.arrow\n * @param tooltip.container\n * @return Object holding tooltip rectangles in\n *  two fields.\n */\nfunction calcTooltipRects(tooltip: ComponentsT): TooltipRectsT {\n  return {\n    arrow: tooltip.arrow.getBoundingClientRect(),\n    container: tooltip.container.getBoundingClientRect(),\n  };\n}\n\n/**\n * Calculates the document viewport size.\n * @ignore\n * @return {{x, y, width, height}}\n */\nfunction calcViewportRect() {\n  const { scrollX, scrollY } = window;\n  const { documentElement: { clientHeight, clientWidth } } = document;\n  return {\n    bottom: scrollY + clientHeight,\n    left: scrollX,\n    right: scrollX + clientWidth,\n    top: scrollY,\n  };\n}\n\n/**\n * Calculates tooltip and arrow positions for the placement just above\n * the cursor.\n * @ignore\n * @param {number} x Cursor page-x position.\n * @param {number} y Cursor page-y position.\n * @param {object} tooltipRects Bounding client rectangles of tooltip parts.\n * @param {object} tooltipRects.arrow\n * @param {object} tooltipRects.container\n * @return {object} Contains the following fields:\n *  - {number} arrowX\n *  - {number} arrowY\n *  - {number} containerX\n *  - {number} containerY\n *  - {string} baseArrowStyle\n */\nfunction calcPositionAboveXY(\n  x: number,\n  y: number,\n  tooltipRects: TooltipRectsT,\n) {\n  const { arrow, container } = tooltipRects;\n  return {\n    arrowX: 0.5 * (container.width - arrow.width),\n    arrowY: container.height,\n    containerX: x - container.width / 2,\n    containerY: y - container.height - arrow.height / 1.5,\n\n    // TODO: Instead of already setting the base style here, we should\n    // introduce a set of constants for arrow directions, which will help\n    // to do checks dependant on the arrow direction.\n    baseArrowStyle: ARROW_STYLE_DOWN,\n  };\n}\n\n// const HIT = {\n//   NONE: false,\n//   LEFT: 'LEFT',\n//   RIGHT: 'RIGHT',\n//   TOP: 'TOP',\n//   BOTTOM: 'BOTTOM',\n// };\n\n/**\n * Checks whether\n * @param {object} pos\n * @param {object} tooltipRects\n * @param {object} viewportRect\n * @return {HIT}\n */\n// function 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 * 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// function 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 * Sets positions of tooltip components to point the tooltip to the specified\n * page point.\n * @ignore\n * @param pageX\n * @param pageY\n * @param placement\n * @param element DOM reference to the element wrapped by the tooltip.\n * @param tooltip\n * @param tooltip.arrow DOM reference to the tooltip arrow.\n * @param tooltip.container DOM reference to the tooltip container.\n */\nfunction setComponentPositions(\n  pageX: number,\n  pageY: number,\n  placement: PLACEMENTS | undefined,\n  element: HTMLElement | undefined,\n  tooltip: ComponentsT,\n) {\n  const tooltipRects = calcTooltipRects(tooltip);\n  const viewportRect = calcViewportRect();\n\n  /* Default container coords: tooltip at the top. */\n  const pos = calcPositionAboveXY(pageX, pageY, tooltipRects);\n\n  if (pos.containerX < viewportRect.left + 6) {\n    pos.containerX = viewportRect.left + 6;\n    pos.arrowX = Math.max(\n      6,\n      pageX - pos.containerX - tooltipRects.arrow.width / 2,\n    );\n  } else {\n    const maxX = viewportRect.right - 6 - tooltipRects.container.width;\n    if (pos.containerX > maxX) {\n      pos.containerX = maxX;\n      pos.arrowX = Math.min(\n        tooltipRects.container.width - 6,\n        pageX - pos.containerX - tooltipRects.arrow.width / 2,\n      );\n    }\n  }\n\n  /* If tooltip has not enough space on top - make it bottom tooltip. */\n  if (pos.containerY < viewportRect.top + 6) {\n    pos.containerY += tooltipRects.container.height\n      + 2 * tooltipRects.arrow.height;\n    pos.arrowY -= tooltipRects.container.height\n      + tooltipRects.arrow.height;\n    pos.baseArrowStyle = ARROW_STYLE_UP;\n  }\n\n  const containerStyle = `left:${pos.containerX}px;top:${pos.containerY}px`;\n  tooltip.container.setAttribute('style', containerStyle);\n\n  const arrowStyle = `${pos.baseArrowStyle};left:${pos.arrowX}px;top:${pos.arrowY}px`;\n  tooltip.arrow.setAttribute('style', arrowStyle);\n}\n\n/* The Tooltip component itself. */\nconst Tooltip: FunctionComponent<{\n  children?: ReactNode;\n  ref?: RefObject<unknown>;\n  theme: TooltipThemeT;\n}> = ({ children, ref, theme }) => {\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 arrowRef = useRef<HTMLDivElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  const pointTo = (\n    pageX: number,\n    pageY: number,\n    placement: PLACEMENTS,\n    element: HTMLElement,\n  ) => {\n    if (!arrowRef.current || !containerRef.current || !contentRef.current) {\n      throw Error('Internal error');\n    }\n\n    setComponentPositions(pageX, pageY, placement, element, {\n      arrow: arrowRef.current,\n      container: containerRef.current,\n      content: contentRef.current,\n    });\n  };\n  useImperativeHandle(ref, () => ({ pointTo }));\n\n  return createPortal(\n    (\n      <div className={theme.container} ref={containerRef}>\n        <div className={theme.arrow} ref={arrowRef} />\n        <div className={theme.content} ref={contentRef}>{children}</div>\n      </div>\n    ),\n    document.body,\n  );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}

package/build/production/shared/components/WithTooltip/index.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=require("react");var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _Tooltip=_interopRequireWildcard(require("./Tooltip"));var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}/* global window */const defaultTheme={"ad":"n6OiU9","hoc":"zwsjGc","context":"JVJPcU","appearance":"_9U4YiR","arrow":"_9n65k-","container":"uA1tHZ","wrapper":"JFVmGf"};/**
+/* global window */import{useEffect,useRef,useState}from"react";import themed from"@dr.pogodin/react-themes";import Tooltip,{PLACEMENTS}from"./Tooltip.js";const defaultTheme={"ad":"n6OiU9","hoc":"zwsjGc","context":"JVJPcU","appearance":"_9U4YiR","arrow":"_9n65k-","container":"uA1tHZ","wrapper":"JFVmGf"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";/**
  * Implements a simple to use and themeable tooltip component, _e.g._
  * ```js
  * <WithTooltip tip="This is example tooltip.">
@@ -11,15 +11,15 @@
  * @param tip &ndash; Anything React is able to render,
  * _e.g._ a tooltip text. This will be the tooltip content.
  * @param {WithTooltipTheme} props.theme _Ad hoc_ theme.
- */const Wrapper=({children,placement=_Tooltip.PLACEMENTS.ABOVE_CURSOR,tip,theme})=>{const{current:heap}=(0,_react.useRef)({lastCursorX:0,lastCursorY:0,timerId:undefined,triggeredByTouch:false});const tooltipRef=(0,_react.useRef)(null);const wrapperRef=(0,_react.useRef)(null);const[showTooltip,setShowTooltip]=(0,_react.useState)(false);const updatePortalPosition=(cursorX,cursorY)=>{if(showTooltip){const wrapperRect=wrapperRef.current.getBoundingClientRect();if(cursorX<wrapperRect.left||cursorX>wrapperRect.right||cursorY<wrapperRect.top||cursorY>wrapperRect.bottom){setShowTooltip(false)}else if(tooltipRef.current){tooltipRef.current.pointTo(cursorX+window.scrollX,cursorY+window.scrollY,placement,wrapperRef.current)}}else{heap.lastCursorX=cursorX;heap.lastCursorY=cursorY;// If tooltip was triggered by a touch, we delay its opening by a bit,
+ */const Wrapper=({children,placement=PLACEMENTS.ABOVE_CURSOR,tip,theme})=>{const{current:heap}=useRef({lastCursorX:0,lastCursorY:0,timerId:undefined,triggeredByTouch:false});const tooltipRef=useRef(null);const wrapperRef=useRef(null);const[showTooltip,setShowTooltip]=useState(false);const updatePortalPosition=(cursorX,cursorY)=>{if(showTooltip){const wrapperRect=wrapperRef.current.getBoundingClientRect();if(cursorX<wrapperRect.left||cursorX>wrapperRect.right||cursorY<wrapperRect.top||cursorY>wrapperRect.bottom){setShowTooltip(false)}else if(tooltipRef.current){tooltipRef.current.pointTo(cursorX+window.scrollX,cursorY+window.scrollY,placement,wrapperRef.current)}}else{heap.lastCursorX=cursorX;heap.lastCursorY=cursorY;// If tooltip was triggered by a touch, we delay its opening by a bit,
 // to ensure it was not a touch-click - in the case of touch click we
 // want to do the click, rather than show the tooltip, and the delay
 // gives click handler a chance to abort the tooltip openning.
 if(heap.triggeredByTouch){heap.timerId??=setTimeout(()=>{heap.triggeredByTouch=false;heap.timerId=undefined;setShowTooltip(true)},300);// Otherwise we can just open the tooltip right away.
-}else setShowTooltip(true)}};(0,_react.useEffect)(()=>{if(showTooltip&&tip!==null){// This is necessary to ensure that even when a single mouse event
+}else setShowTooltip(true)}};useEffect(()=>{if(showTooltip&&tip!==null){// This is necessary to ensure that even when a single mouse event
 // arrives to a tool-tipped component, the tooltip is correctly positioned
 // once opened (because similar call above does not have effect until
 // the tooltip is fully mounted, and that is delayed to future rendering
 // cycle due to the implementation).
-if(tooltipRef.current){tooltipRef.current.pointTo(heap.lastCursorX+window.scrollX,heap.lastCursorY+window.scrollY,placement,wrapperRef.current)}const listener=()=>{setShowTooltip(false)};window.addEventListener("scroll",listener);return()=>{window.removeEventListener("scroll",listener)}}return undefined},[heap.lastCursorX,heap.lastCursorY,placement,showTooltip,tip]);return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.wrapper,onClick:()=>{if(heap.timerId){clearTimeout(heap.timerId);heap.timerId=undefined;heap.triggeredByTouch=false}},onMouseLeave:()=>{setShowTooltip(false)},onMouseMove:e=>{updatePortalPosition(e.clientX,e.clientY)},onTouchStart:()=>{heap.triggeredByTouch=true},ref:wrapperRef,role:"presentation",children:[showTooltip&&tip!==null?/*#__PURE__*/(0,_jsxRuntime.jsx)(_Tooltip.default,{ref:tooltipRef,theme:theme,children:tip}):null,children]})};const ThemedWrapper=(0,_reactThemes.default)(Wrapper,"WithTooltip",defaultTheme);const e=ThemedWrapper;e.PLACEMENTS=_Tooltip.PLACEMENTS;var _default=exports.default=e;
+if(tooltipRef.current){tooltipRef.current.pointTo(heap.lastCursorX+window.scrollX,heap.lastCursorY+window.scrollY,placement,wrapperRef.current)}const listener=()=>{setShowTooltip(false)};window.addEventListener("scroll",listener);return()=>{window.removeEventListener("scroll",listener)}}return undefined},[heap.lastCursorX,heap.lastCursorY,placement,showTooltip,tip]);return/*#__PURE__*/_jsxs("div",{className:theme.wrapper,onClick:()=>{if(heap.timerId){clearTimeout(heap.timerId);heap.timerId=undefined;heap.triggeredByTouch=false}},onMouseLeave:()=>{setShowTooltip(false)},onMouseMove:e=>{updatePortalPosition(e.clientX,e.clientY)},onTouchStart:()=>{heap.triggeredByTouch=true},ref:wrapperRef,role:"presentation",children:[showTooltip&&tip!==null?/*#__PURE__*/_jsx(Tooltip,{ref:tooltipRef,theme:theme,children:tip}):null,children]})};const ThemedWrapper=/* #__PURE__ */themed(Wrapper,"WithTooltip",defaultTheme);const e=ThemedWrapper;e.PLACEMENTS=PLACEMENTS;export default e;
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/WithTooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","require","_reactThemes","_interopRequireDefault","_Tooltip","_interopRequireWildcard","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","defaultTheme","Wrapper","children","placement","PLACEMENTS","ABOVE_CURSOR","tip","theme","current","heap","useRef","lastCursorX","lastCursorY","timerId","undefined","triggeredByTouch","tooltipRef","wrapperRef","showTooltip","setShowTooltip","useState","updatePortalPosition","cursorX","cursorY","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","setTimeout","useEffect","listener","addEventListener","removeEventListener","_jsxs","className","wrapper","onClick","clearTimeout","onMouseLeave","onMouseMove","clientX","clientY","onTouchStart","ref","role","_jsx","Tooltip","ThemedWrapper","themed","_default","exports"],"sources":["../../../../../src/shared/components/WithTooltip/index.tsx"],"sourcesContent":["/* global window */\n\nimport {\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n  type ThemeKeysT as TooltipThemeKeysT,\n  PLACEMENTS,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\ntype PropsT = {\n  children?: ReactNode;\n  placement?: PLACEMENTS;\n  tip?: ReactNode;\n  theme: Theme<'wrapper' | TooltipThemeKeysT>;\n};\n\ntype TooltipRefT = {\n  pointTo: (\n    x: number,\n    y: number,\n    placement: PLACEMENTS,\n    wrapperRef: HTMLDivElement,\n  ) => void;\n};\n\ntype HeapT = {\n  lastCursorX: number;\n  lastCursorY: number;\n  triggeredByTouch: boolean;\n  timerId?: NodeJS.Timeout;\n};\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n *   <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param tip &ndash; 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: FunctionComponent<PropsT> = ({\n  children,\n  placement = PLACEMENTS.ABOVE_CURSOR,\n  tip,\n  theme,\n}) => {\n  const { current: heap } = useRef<HeapT>({\n    lastCursorX: 0,\n    lastCursorY: 0,\n    timerId: undefined,\n    triggeredByTouch: false,\n  });\n  const tooltipRef = useRef<TooltipRefT>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [showTooltip, setShowTooltip] = useState(false);\n\n  const updatePortalPosition = (cursorX: number, cursorY: number) => {\n    if (showTooltip) {\n      const wrapperRect = wrapperRef.current!.getBoundingClientRect();\n      if (\n        cursorX < wrapperRect.left\n        || cursorX > wrapperRect.right\n        || cursorY < wrapperRect.top\n        || cursorY > wrapperRect.bottom\n      ) {\n        setShowTooltip(false);\n      } else if (tooltipRef.current) {\n        tooltipRef.current.pointTo(\n          cursorX + window.scrollX,\n          cursorY + window.scrollY,\n          placement,\n          wrapperRef.current!,\n        );\n      }\n    } else {\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        heap.timerId ??= setTimeout(() => {\n          heap.triggeredByTouch = false;\n          heap.timerId = undefined;\n          setShowTooltip(true);\n        }, 300);\n\n      // Otherwise we can just open the tooltip right away.\n      } else setShowTooltip(true);\n    }\n  };\n\n  useEffect(() => {\n    if (showTooltip && tip !== null) {\n      // This is necessary to ensure that even when a single mouse event\n      // arrives to a tool-tipped component, the tooltip is correctly positioned\n      // once opened (because similar call above does not have effect until\n      // the tooltip is fully mounted, and that is delayed to future rendering\n      // cycle due to the implementation).\n      if (tooltipRef.current) {\n        tooltipRef.current.pointTo(\n          heap.lastCursorX + window.scrollX,\n          heap.lastCursorY + window.scrollY,\n          placement,\n          wrapperRef.current!,\n        );\n      }\n\n      const listener = () => {\n        setShowTooltip(false);\n      };\n      window.addEventListener('scroll', listener);\n      return () => {\n        window.removeEventListener('scroll', listener);\n      };\n    }\n    return undefined;\n  }, [\n    heap.lastCursorX,\n    heap.lastCursorY,\n    placement,\n    showTooltip,\n    tip,\n  ]);\n\n  return (\n    <div\n      className={theme.wrapper}\n      onClick={() => {\n        if (heap.timerId) {\n          clearTimeout(heap.timerId);\n          heap.timerId = undefined;\n          heap.triggeredByTouch = false;\n        }\n      }}\n      onMouseLeave={() => {\n        setShowTooltip(false);\n      }}\n      onMouseMove={(e) => {\n        updatePortalPosition(e.clientX, e.clientY);\n      }}\n      onTouchStart={() => {\n        heap.triggeredByTouch = true;\n      }}\n      ref={wrapperRef}\n      role=\"presentation\"\n    >\n      {\n        showTooltip && tip !== null\n          ? <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n          : null\n      }\n      {children}\n    </div>\n  );\n};\n\nconst ThemedWrapper = themed(Wrapper, 'WithTooltip', defaultTheme);\n\ntype ExportT = typeof ThemedWrapper & {\n  PLACEMENTS: typeof PLACEMENTS;\n};\n\nconst e: ExportT = ThemedWrapper as ExportT;\n\ne.PLACEMENTS = PLACEMENTS;\n\nexport default e;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useEffect","useRef","useState","themed","Tooltip","PLACEMENTS","defaultTheme","jsx","_jsx","jsxs","_jsxs","Wrapper","children","placement","ABOVE_CURSOR","tip","theme","current","heap","lastCursorX","lastCursorY","timerId","undefined","triggeredByTouch","tooltipRef","wrapperRef","showTooltip","setShowTooltip","updatePortalPosition","cursorX","cursorY","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","setTimeout","listener","addEventListener","removeEventListener","className","wrapper","onClick","clearTimeout","onMouseLeave","onMouseMove","e","clientX","clientY","onTouchStart","ref","role","ThemedWrapper"],"sources":["../../../../../src/shared/components/WithTooltip/index.tsx"],"sourcesContent":["/* global window */\n\nimport {\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n  type ThemeKeysT as TooltipThemeKeysT,\n  PLACEMENTS,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\ntype PropsT = {\n  children?: ReactNode;\n  placement?: PLACEMENTS;\n  tip?: ReactNode;\n  theme: Theme<'wrapper' | TooltipThemeKeysT>;\n};\n\ntype TooltipRefT = {\n  pointTo: (\n    x: number,\n    y: number,\n    placement: PLACEMENTS,\n    wrapperRef: HTMLDivElement,\n  ) => void;\n};\n\ntype HeapT = {\n  lastCursorX: number;\n  lastCursorY: number;\n  triggeredByTouch: boolean;\n  timerId?: NodeJS.Timeout;\n};\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n *   <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param tip &ndash; 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: FunctionComponent<PropsT> = ({\n  children,\n  placement = PLACEMENTS.ABOVE_CURSOR,\n  tip,\n  theme,\n}) => {\n  const { current: heap } = useRef<HeapT>({\n    lastCursorX: 0,\n    lastCursorY: 0,\n    timerId: undefined,\n    triggeredByTouch: false,\n  });\n  const tooltipRef = useRef<TooltipRefT>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const [showTooltip, setShowTooltip] = useState(false);\n\n  const updatePortalPosition = (cursorX: number, cursorY: number) => {\n    if (showTooltip) {\n      const wrapperRect = wrapperRef.current!.getBoundingClientRect();\n      if (\n        cursorX < wrapperRect.left\n        || cursorX > wrapperRect.right\n        || cursorY < wrapperRect.top\n        || cursorY > wrapperRect.bottom\n      ) {\n        setShowTooltip(false);\n      } else if (tooltipRef.current) {\n        tooltipRef.current.pointTo(\n          cursorX + window.scrollX,\n          cursorY + window.scrollY,\n          placement,\n          wrapperRef.current!,\n        );\n      }\n    } else {\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        heap.timerId ??= setTimeout(() => {\n          heap.triggeredByTouch = false;\n          heap.timerId = undefined;\n          setShowTooltip(true);\n        }, 300);\n\n      // Otherwise we can just open the tooltip right away.\n      } else setShowTooltip(true);\n    }\n  };\n\n  useEffect(() => {\n    if (showTooltip && tip !== null) {\n      // This is necessary to ensure that even when a single mouse event\n      // arrives to a tool-tipped component, the tooltip is correctly positioned\n      // once opened (because similar call above does not have effect until\n      // the tooltip is fully mounted, and that is delayed to future rendering\n      // cycle due to the implementation).\n      if (tooltipRef.current) {\n        tooltipRef.current.pointTo(\n          heap.lastCursorX + window.scrollX,\n          heap.lastCursorY + window.scrollY,\n          placement,\n          wrapperRef.current!,\n        );\n      }\n\n      const listener = () => {\n        setShowTooltip(false);\n      };\n      window.addEventListener('scroll', listener);\n      return () => {\n        window.removeEventListener('scroll', listener);\n      };\n    }\n    return undefined;\n  }, [\n    heap.lastCursorX,\n    heap.lastCursorY,\n    placement,\n    showTooltip,\n    tip,\n  ]);\n\n  return (\n    <div\n      className={theme.wrapper}\n      onClick={() => {\n        if (heap.timerId) {\n          clearTimeout(heap.timerId);\n          heap.timerId = undefined;\n          heap.triggeredByTouch = false;\n        }\n      }}\n      onMouseLeave={() => {\n        setShowTooltip(false);\n      }}\n      onMouseMove={(e) => {\n        updatePortalPosition(e.clientX, e.clientY);\n      }}\n      onTouchStart={() => {\n        heap.triggeredByTouch = true;\n      }}\n      ref={wrapperRef}\n      role=\"presentation\"\n    >\n      {\n        showTooltip && tip !== null\n          ? <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n          : null\n      }\n      {children}\n    </div>\n  );\n};\n\nconst ThemedWrapper = /* #__PURE__ */ themed(Wrapper, 'WithTooltip', defaultTheme);\n\ntype ExportT = typeof ThemedWrapper & {\n  PLACEMENTS: typeof PLACEMENTS;\n};\n\nconst e: ExportT = ThemedWrapper as ExportT;\n\ne.PLACEMENTS = PLACEMENTS;\n\nexport default e;\n"],"mappings":"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","ignoreList":[]}

package/build/production/shared/components/YouTubeVideo/index.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _qs=_interopRequireDefault(require("qs"));var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _Throbber=_interopRequireDefault(require("../Throbber"));var _jsxRuntime=require("react/jsx-runtime");const baseTheme={"context":"Pa7GiX","ad":"NikZ57","hoc":"FydyFQ","container":"pQTzJV","video":"iFTALT"};const throbberTheme={"context":"_0Piy3R","ad":"GD-lgk","hoc":"T5TGzT","container":"IgN6Uf"};/**
+import qs from"qs";import themed from"@dr.pogodin/react-themes";import Throbber from"../Throbber/index.js";const baseTheme={"context":"Pa7GiX","ad":"NikZ57","hoc":"FydyFQ","container":"pQTzJV","video":"iFTALT"};const throbberTheme={"context":"_0Piy3R","ad":"GD-lgk","hoc":"T5TGzT","container":"IgN6Uf"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";/**
  * A component for embeding a YouTube video.
  * @param [props] Component properties.
  * @param [props.autoplay] If `true` the video will start to play
@@ -12,8 +12,8 @@
  * @param [props.theme] _Ad hoc_ theme.
  * @param [props.title] The `title` attribute to add to the player
  * IFrame.
- */const YouTubeVideo=({autoplay,src,theme,title})=>{const srcParts=src.split("?");let[url]=srcParts;const[,queryString]=srcParts;const query=queryString?_qs.default.parse(queryString):{};const videoId=query.v??url?.match(/\/([a-zA-Z0-9-_]*)$/)?.[1];url=`https://www.youtube.com/embed/${videoId}`;delete query.v;query.autoplay=autoplay?"1":"0";url+=`?${_qs.default.stringify(query)}`;// TODO: https://developers.google.com/youtube/player_parameters
+ */const YouTubeVideo=({autoplay,src,theme,title})=>{const srcParts=src.split("?");let[url]=srcParts;const[,queryString]=srcParts;const query=queryString?qs.parse(queryString):{};const videoId=query.v??url?.match(/\/([a-zA-Z0-9-_]*)$/)?.[1];url=`https://www.youtube.com/embed/${videoId}`;delete query.v;query.autoplay=autoplay?"1":"0";url+=`?${qs.stringify(query)}`;// TODO: https://developers.google.com/youtube/player_parameters
 // More query parameters can be exposed via the component props.
-return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.container,children:[/*#__PURE__*/(0,_jsxRuntime.jsx)(_Throbber.default,{theme:throbberTheme}),/*#__PURE__*/(0,_jsxRuntime.jsx)("iframe",{// eslint-disable-line react/iframe-missing-sandbox
-allow:"autoplay",allowFullScreen:true,className:theme.video,src:url,title:title})]})};var _default=exports.default=(0,_reactThemes.default)(YouTubeVideo,"YouTubeVideo",baseTheme);
+return/*#__PURE__*/_jsxs("div",{className:theme.container,children:[/*#__PURE__*/_jsx(Throbber,{theme:throbberTheme}),/*#__PURE__*/_jsx("iframe",{// eslint-disable-line react/iframe-missing-sandbox
+allow:"autoplay",allowFullScreen:true,className:theme.video,src:url,title:title})]})};export default/* #__PURE__ */themed(YouTubeVideo,"YouTubeVideo",baseTheme);
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/YouTubeVideo/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_qs","_interopRequireDefault","require","_reactThemes","_Throbber","_jsxRuntime","baseTheme","throbberTheme","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","qs","parse","videoId","v","match","stringify","_jsxs","className","container","children","_jsx","Throbber","allow","allowFullScreen","video","_default","exports","default","themed"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\ntype ComponentThemeT = Theme<'container' | 'video'>;\n\ntype PropsT = {\n  autoplay?: boolean;\n  src: string;\n  theme: ComponentThemeT;\n  title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n  autoplay,\n  src,\n  theme,\n  title,\n}) => {\n  const srcParts = src.split('?');\n  let [url] = srcParts;\n  const [, queryString] = srcParts;\n  const query = queryString ? qs.parse(queryString) : {};\n\n  const videoId = query.v ?? url?.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n  url = `https://www.youtube.com/embed/${videoId as string}`;\n\n  delete query.v;\n  query.autoplay = autoplay ? '1' : '0';\n  url += `?${qs.stringify(query)}`;\n\n  // TODO: https://developers.google.com/youtube/player_parameters\n  // More query parameters can be exposed via the component props.\n\n  return (\n    <div className={theme.container}>\n      <Throbber theme={throbberTheme} />\n      {/* TODO: I guess, we better add the sanbox, but right now I don't have\n          time to carefully explore which restrictions should be lifted to allow\n          embed YouTube player to work... sometime later we'll take care of it */\n      }\n      <iframe // eslint-disable-line react/iframe-missing-sandbox\n        allow=\"autoplay\"\n        allowFullScreen\n        className={theme.video}\n        src={url}\n        title={title}\n      />\n    </div>\n  );\n};\n\nexport default themed(YouTubeVideo, 'YouTubeVideo', baseTheme);\n"],"mappings":"gLAAA,IAAAA,GAAA,CAAAC,sBAAA,CAAAC,OAAA,QAEA,IAAAC,YAAA,CAAAF,sBAAA,CAAAC,OAAA,8BAEA,IAAAE,SAAA,CAAAH,sBAAA,CAAAC,OAAA,iBAG4C,IAAAG,WAAA,CAAAH,OAAA,4BAAAI,SAAA,+FAAAC,aAAA,yEAW5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,YAA6C,CAAGA,CAAC,CACrDC,QAAQ,CACRC,GAAG,CACHC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,QAAQ,CAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC,CAC/B,GAAI,CAACC,GAAG,CAAC,CAAGF,QAAQ,CACpB,KAAM,EAAGG,WAAW,CAAC,CAAGH,QAAQ,CAChC,KAAM,CAAAI,KAAK,CAAGD,WAAW,CAAGE,WAAE,CAACC,KAAK,CAACH,WAAW,CAAC,CAAG,CAAC,CAAC,CAEtD,KAAM,CAAAI,OAAO,CAAGH,KAAK,CAACI,CAAC,EAAIN,GAAG,EAAEO,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC,CACjEP,GAAG,CAAG,iCAAiCK,OAAO,EAAY,CAE1D,MAAO,CAAAH,KAAK,CAACI,CAAC,CACdJ,KAAK,CAACR,QAAQ,CAAGA,QAAQ,CAAG,GAAG,CAAG,GAAG,CACrCM,GAAG,EAAI,IAAIG,WAAE,CAACK,SAAS,CAACN,KAAK,CAAC,EAAE,CAEhC;AACA;AAEA,mBACE,GAAAO,gBAAA,SAAKC,SAAS,CAAEd,KAAK,CAACe,SAAU,CAAAC,QAAA,eAC9B,GAAAC,eAAA,EAACC,iBAAQ,EAAClB,KAAK,CAAEJ,aAAc,CAAE,CAAC,cAKlC,GAAAqB,eAAA,YAAQ;AACNE,KAAK,CAAC,UAAU,CAChBC,eAAe,MACfN,SAAS,CAAEd,KAAK,CAACqB,KAAM,CACvBtB,GAAG,CAAEK,GAAI,CACTH,KAAK,CAAEA,KAAM,CACd,CAAC,EACC,CAET,CAAC,KAAAqB,QAAA,CAAAC,OAAA,CAAAC,OAAA,CAEc,GAAAC,oBAAM,EAAC5B,YAAY,CAAE,cAAc,CAAEF,SAAS,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["qs","themed","Throbber","baseTheme","throbberTheme","jsx","_jsx","jsxs","_jsxs","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","parse","videoId","v","match","stringify","className","container","children","allow","allowFullScreen","video"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\ntype ComponentThemeT = Theme<'container' | 'video'>;\n\ntype PropsT = {\n  autoplay?: boolean;\n  src: string;\n  theme: ComponentThemeT;\n  title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n  autoplay,\n  src,\n  theme,\n  title,\n}) => {\n  const srcParts = src.split('?');\n  let [url] = srcParts;\n  const [, queryString] = srcParts;\n  const query = queryString ? qs.parse(queryString) : {};\n\n  const videoId = query.v ?? url?.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n  url = `https://www.youtube.com/embed/${videoId as string}`;\n\n  delete query.v;\n  query.autoplay = autoplay ? '1' : '0';\n  url += `?${qs.stringify(query)}`;\n\n  // TODO: https://developers.google.com/youtube/player_parameters\n  // More query parameters can be exposed via the component props.\n\n  return (\n    <div className={theme.container}>\n      <Throbber theme={throbberTheme} />\n      {/* TODO: I guess, we better add the sanbox, but right now I don't have\n          time to carefully explore which restrictions should be lifted to allow\n          embed YouTube player to work... sometime later we'll take care of it */\n      }\n      <iframe // eslint-disable-line react/iframe-missing-sandbox\n        allow=\"autoplay\"\n        allowFullScreen\n        className={theme.video}\n        src={url}\n        title={title}\n      />\n    </div>\n  );\n};\n\nexport default /* #__PURE__ */ themed(YouTubeVideo, 'YouTubeVideo', baseTheme);\n"],"mappings":"AAAA,MAAO,CAAAA,EAAE,KAAM,IAAI,CAEnB,MAAO,CAAAC,MAAM,KAAsB,0BAA0B,OAEtD,CAAAC,QAAQ,kCAAAC,SAAA,+FAAAC,aAAA,yEAG6B,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAW5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,KAAM,CAAAC,YAA6C,CAAGA,CAAC,CACrDC,QAAQ,CACRC,GAAG,CACHC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,QAAQ,CAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC,CAC/B,GAAI,CAACC,GAAG,CAAC,CAAGF,QAAQ,CACpB,KAAM,EAAGG,WAAW,CAAC,CAAGH,QAAQ,CAChC,KAAM,CAAAI,KAAK,CAAGD,WAAW,CAAGjB,EAAE,CAACmB,KAAK,CAACF,WAAW,CAAC,CAAG,CAAC,CAAC,CAEtD,KAAM,CAAAG,OAAO,CAAGF,KAAK,CAACG,CAAC,EAAIL,GAAG,EAAEM,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC,CACjEN,GAAG,CAAG,iCAAiCI,OAAO,EAAY,CAE1D,MAAO,CAAAF,KAAK,CAACG,CAAC,CACdH,KAAK,CAACR,QAAQ,CAAGA,QAAQ,CAAG,GAAG,CAAG,GAAG,CACrCM,GAAG,EAAI,IAAIhB,EAAE,CAACuB,SAAS,CAACL,KAAK,CAAC,EAAE,CAEhC;AACA;AAEA,mBACEV,KAAA,QAAKgB,SAAS,CAAEZ,KAAK,CAACa,SAAU,CAAAC,QAAA,eAC9BpB,IAAA,CAACJ,QAAQ,EAACU,KAAK,CAAER,aAAc,CAAE,CAAC,cAKlCE,IAAA,WAAQ;AACNqB,KAAK,CAAC,UAAU,CAChBC,eAAe,MACfJ,SAAS,CAAEZ,KAAK,CAACiB,KAAM,CACvBlB,GAAG,CAAEK,GAAI,CACTH,KAAK,CAAEA,KAAM,CACd,CAAC,EACC,CAET,CAAC,CAED,cAAe,eAAgBZ,MAAM,CAACQ,YAAY,CAAE,cAAc,CAAEN,SAAS,CAAC","ignoreList":[]}

package/build/production/shared/components/index.js

@@ -1,2 +1,4 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={MetaTags:true,Button:true,BaseButton:true,Checkbox:true,Input:true,Link:true,PageLayout:true,Modal:true,BaseModal:true,NavLink:true,Throbber:true,WithTooltip:true,YouTubeVideo:true,TextArea:true};Object.defineProperty(exports,"BaseButton",{enumerable:true,get:function(){return _Button.BaseButton}});Object.defineProperty(exports,"BaseModal",{enumerable:true,get:function(){return _Modal.BaseModal}});Object.defineProperty(exports,"Button",{enumerable:true,get:function(){return _Button.default}});Object.defineProperty(exports,"Checkbox",{enumerable:true,get:function(){return _Checkbox.default}});Object.defineProperty(exports,"Input",{enumerable:true,get:function(){return _Input.default}});Object.defineProperty(exports,"Link",{enumerable:true,get:function(){return _Link.default}});Object.defineProperty(exports,"MetaTags",{enumerable:true,get:function(){return _reactHelmet.MetaTags}});Object.defineProperty(exports,"Modal",{enumerable:true,get:function(){return _Modal.default}});Object.defineProperty(exports,"NavLink",{enumerable:true,get:function(){return _NavLink.default}});Object.defineProperty(exports,"PageLayout",{enumerable:true,get:function(){return _PageLayout.default}});Object.defineProperty(exports,"TextArea",{enumerable:true,get:function(){return _TextArea.default}});Object.defineProperty(exports,"Throbber",{enumerable:true,get:function(){return _Throbber.default}});Object.defineProperty(exports,"WithTooltip",{enumerable:true,get:function(){return _WithTooltip.default}});Object.defineProperty(exports,"YouTubeVideo",{enumerable:true,get:function(){return _YouTubeVideo.default}});var _reactHelmet=require("@dr.pogodin/react-helmet");var _selectors=require("./selectors");Object.keys(_selectors).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_selectors[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function(){return _selectors[key]}})});var _Button=_interopRequireWildcard(require("./Button"));var _Checkbox=_interopRequireDefault(require("./Checkbox"));var _Input=_interopRequireDefault(require("./Input"));var _Link=_interopRequireDefault(require("./Link"));var _PageLayout=_interopRequireDefault(require("./PageLayout"));var _Modal=_interopRequireWildcard(require("./Modal"));var _NavLink=_interopRequireDefault(require("./NavLink"));var _Throbber=_interopRequireDefault(require("./Throbber"));var _WithTooltip=_interopRequireDefault(require("./WithTooltip"));var _YouTubeVideo=_interopRequireDefault(require("./YouTubeVideo"));var _TextArea=_interopRequireDefault(require("./TextArea"));function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}
+/**
+ * Just an aggregation of all exported components into a single module.
+ */export{MetaTags}from"@dr.pogodin/react-helmet";export*from"./selectors/index.js";export{default as Button,BaseButton}from"./Button/index.js";export{default as Checkbox}from"./Checkbox/index.js";export{default as Input}from"./Input/index.js";export{default as Link}from"./Link.js";export{default as PageLayout}from"./PageLayout/index.js";export{default as Modal,BaseModal}from"./Modal/index.js";export{default as NavLink}from"./NavLink.js";export{default as Throbber}from"./Throbber/index.js";export{default as WithTooltip}from"./WithTooltip/index.js";export{default as YouTubeVideo}from"./YouTubeVideo/index.js";export{default as TextArea}from"./TextArea/index.js";
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_reactHelmet","require","_selectors","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get","_Button","_interopRequireWildcard","_Checkbox","_interopRequireDefault","_Input","_Link","_PageLayout","_Modal","_NavLink","_Throbber","_WithTooltip","_YouTubeVideo","_TextArea","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","set","getOwnPropertyDescriptor"],"sources":["../../../../src/shared/components/index.ts"],"sourcesContent":["/**\n * Just an aggregation of all exported components into a single module.\n */\n\nexport { MetaTags } from '@dr.pogodin/react-helmet';\n\nexport * from 'components/selectors';\n\nexport { default as Button, BaseButton } from 'components/Button';\nexport { default as Checkbox } from 'components/Checkbox';\nexport { default as Input } from 'components/Input';\nexport { default as Link } from 'components/Link';\nexport { default as PageLayout } from 'components/PageLayout';\nexport { default as Modal, BaseModal } from 'components/Modal';\nexport { default as NavLink } from 'components/NavLink';\nexport { default as Throbber } from 'components/Throbber';\nexport { default as WithTooltip } from 'components/WithTooltip';\nexport { default as YouTubeVideo } from 'components/YouTubeVideo';\n\nexport { default as TextArea } from './TextArea';\n"],"mappings":"ovDAIA,IAAAA,YAAA,CAAAC,OAAA,6BAEA,IAAAC,UAAA,CAAAD,OAAA,gBAAAE,MAAA,CAAAC,IAAA,CAAAF,UAAA,EAAAG,OAAA,UAAAC,GAAA,KAAAA,GAAA,cAAAA,GAAA,0BAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,CAAAJ,GAAA,YAAAA,GAAA,IAAAK,OAAA,EAAAA,OAAA,CAAAL,GAAA,IAAAJ,UAAA,CAAAI,GAAA,SAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,CAAAL,GAAA,EAAAO,UAAA,MAAAC,GAAA,SAAAA,CAAA,SAAAZ,UAAA,CAAAI,GAAA,OAEA,IAAAS,OAAA,CAAAC,uBAAA,CAAAf,OAAA,cACA,IAAAgB,SAAA,CAAAC,sBAAA,CAAAjB,OAAA,gBACA,IAAAkB,MAAA,CAAAD,sBAAA,CAAAjB,OAAA,aACA,IAAAmB,KAAA,CAAAF,sBAAA,CAAAjB,OAAA,YACA,IAAAoB,WAAA,CAAAH,sBAAA,CAAAjB,OAAA,kBACA,IAAAqB,MAAA,CAAAN,uBAAA,CAAAf,OAAA,aACA,IAAAsB,QAAA,CAAAL,sBAAA,CAAAjB,OAAA,eACA,IAAAuB,SAAA,CAAAN,sBAAA,CAAAjB,OAAA,gBACA,IAAAwB,YAAA,CAAAP,sBAAA,CAAAjB,OAAA,mBACA,IAAAyB,aAAA,CAAAR,sBAAA,CAAAjB,OAAA,oBAEA,IAAA0B,SAAA,CAAAT,sBAAA,CAAAjB,OAAA,gBAA4B,SAAAe,wBAAAY,CAAA,CAAAC,CAAA,wBAAAC,OAAA,KAAAC,CAAA,KAAAD,OAAA,CAAAE,CAAA,KAAAF,OAAA,QAAAd,uBAAA,SAAAA,CAAAY,CAAA,CAAAC,CAAA,MAAAA,CAAA,EAAAD,CAAA,EAAAA,CAAA,CAAAK,UAAA,QAAAL,CAAA,KAAAM,CAAA,CAAAC,CAAA,CAAAC,CAAA,EAAAC,SAAA,MAAAC,OAAA,CAAAV,CAAA,YAAAA,CAAA,mBAAAA,CAAA,qBAAAA,CAAA,QAAAQ,CAAA,IAAAF,CAAA,CAAAL,CAAA,CAAAG,CAAA,CAAAD,CAAA,KAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,SAAAM,CAAA,CAAApB,GAAA,CAAAc,CAAA,EAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,CAAAQ,CAAA,YAAAP,CAAA,IAAAD,CAAA,aAAAC,CAAA,KAAArB,cAAA,CAAAC,IAAA,CAAAmB,CAAA,CAAAC,CAAA,KAAAM,CAAA,EAAAD,CAAA,CAAA/B,MAAA,CAAAS,cAAA,GAAAT,MAAA,CAAAsC,wBAAA,CAAAb,CAAA,CAAAC,CAAA,KAAAM,CAAA,CAAArB,GAAA,EAAAqB,CAAA,CAAAK,GAAA,EAAAN,CAAA,CAAAE,CAAA,CAAAP,CAAA,CAAAM,CAAA,EAAAC,CAAA,CAAAP,CAAA,EAAAD,CAAA,CAAAC,CAAA,UAAAO,CAAA,GAAAR,CAAA,CAAAC,CAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["MetaTags","default","Button","BaseButton","Checkbox","Input","Link","PageLayout","Modal","BaseModal","NavLink","Throbber","WithTooltip","YouTubeVideo","TextArea"],"sources":["../../../../src/shared/components/index.ts"],"sourcesContent":["/**\n * Just an aggregation of all exported components into a single module.\n */\n\nexport { MetaTags } from '@dr.pogodin/react-helmet';\n\nexport * from 'components/selectors';\n\nexport { default as Button, BaseButton } from 'components/Button';\nexport { default as Checkbox } from 'components/Checkbox';\nexport { default as Input } from 'components/Input';\nexport { default as Link } from 'components/Link';\nexport { default as PageLayout } from 'components/PageLayout';\nexport { default as Modal, BaseModal } from 'components/Modal';\nexport { default as NavLink } from 'components/NavLink';\nexport { default as Throbber } from 'components/Throbber';\nexport { default as WithTooltip } from 'components/WithTooltip';\nexport { default as YouTubeVideo } from 'components/YouTubeVideo';\n\nexport { default as TextArea } from './TextArea';\n"],"mappings":"AAAA;AACA;AACA,GAEA,OAASA,QAAQ,KAAQ,0BAA0B,0CAI1CC,OAAO,GAAI,CAAAC,MAAM,CAAEC,UAAU,gCAC7BF,OAAO,GAAI,CAAAG,QAAQ,kCACnBH,OAAO,GAAI,CAAAI,KAAK,+BAChBJ,OAAO,GAAI,CAAAK,IAAI,wBACfL,OAAO,GAAI,CAAAM,UAAU,oCACrBN,OAAO,GAAI,CAAAO,KAAK,CAAEC,SAAS,+BAC3BR,OAAO,GAAI,CAAAS,OAAO,2BAClBT,OAAO,GAAI,CAAAU,QAAQ,kCACnBV,OAAO,GAAI,CAAAW,WAAW,qCACtBX,OAAO,GAAI,CAAAY,YAAY,sCAEvBZ,OAAO,GAAI,CAAAa,QAAQ","ignoreList":[]}

package/build/production/shared/components/selectors/CustomDropdown/Options/index.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.areEqual=areEqual;exports.default=void 0;var _react=require("react");var _Modal=require("../../../Modal");var _common=require("../../common");var _jsxRuntime=require("react/jsx-runtime");const S={"overlay":"ntZ5My"};function areEqual(a,b){return a?.left===b?.left&&a?.top===b?.top&&a?.width===b?.width}const Options=({containerClass,containerStyle,filter,onCancel,onChange,optionClass,options,ref})=>{const opsRef=(0,_react.useRef)(null);(0,_react.useImperativeHandle)(ref,()=>({measure:()=>{const e=opsRef.current?.parentElement;if(!e)return undefined;const rect=opsRef.current.getBoundingClientRect();const style=window.getComputedStyle(e);const mBottom=parseFloat(style.marginBottom);const mTop=parseFloat(style.marginTop);rect.height+=mBottom+mTop;return rect}}),[]);const optionNodes=[];for(const option of options){if(!filter||filter(option)){const[iValue,iName]=(0,_common.optionValueName)(option);optionNodes.push(/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:optionClass,onClick:e=>{onChange(iValue);e.stopPropagation()},onKeyDown:e=>{if(e.key==="Enter"){onChange(iValue);e.stopPropagation()}},role:"button",tabIndex:0,children:iName},iValue))}}return/*#__PURE__*/(0,_jsxRuntime.jsx)(_Modal.BaseModal// Closes the dropdown (cancels the selection) on any page scrolling attempt.
+import"core-js/modules/es.array.push.js";import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.filter.js";import"core-js/modules/es.array.push.js";import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.filter.js";import{useImperativeHandle,useRef}from"react";import{BaseModal}from"../../../Modal/index.js";import{optionValueName}from"../../common.js";const S={"overlay":"ntZ5My"};import{jsx as _jsx}from"react/jsx-runtime";export function areEqual(a,b){return a?.left===b?.left&&a?.top===b?.top&&a?.width===b?.width}const Options=({containerClass,containerStyle,filter,onCancel,onChange,optionClass,options,ref})=>{const opsRef=useRef(null);useImperativeHandle(ref,()=>({measure:()=>{const e=opsRef.current?.parentElement;if(!e)return undefined;const rect=opsRef.current.getBoundingClientRect();const style=window.getComputedStyle(e);const mBottom=parseFloat(style.marginBottom);const mTop=parseFloat(style.marginTop);rect.height+=mBottom+mTop;return rect}}),[]);const optionNodes=[];for(const option of options){if(!filter||filter(option)){const[iValue,iName]=optionValueName(option);optionNodes.push(/*#__PURE__*/_jsx("div",{className:optionClass,onClick:e=>{onChange(iValue);e.stopPropagation()},onKeyDown:e=>{if(e.key==="Enter"){onChange(iValue);e.stopPropagation()}},role:"button",tabIndex:0,children:iName},iValue))}}return/*#__PURE__*/_jsx(BaseModal// Closes the dropdown (cancels the selection) on any page scrolling attempt.
 // This is the same native <select> elements do on scrolling, and at least for
 // now we have no reason to deal with complications needed to support open
 // dropdowns during the scrolling (that would need to re-position it in
 // response to the position changes of the root dropdown element).
-,{cancelOnScrolling:true,dontDisableScrolling:true,onCancel:onCancel,style:containerStyle,theme:{ad:"",container:containerClass,context:"",hoc:"",overlay:S.overlay},children:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{ref:opsRef,children:optionNodes})})};var _default=exports.default=Options;
+,{cancelOnScrolling:true,dontDisableScrolling:true,onCancel:onCancel,style:containerStyle,theme:{ad:"",container:containerClass,context:"",hoc:"",overlay:S.overlay},children:/*#__PURE__*/_jsx("div",{ref:opsRef,children:optionNodes})})};export default Options;
 //# sourceMappingURL=index.js.map

package/build/production/shared/components/selectors/CustomDropdown/Options/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","require","_Modal","_common","_jsxRuntime","S","areEqual","a","b","left","top","width","Options","containerClass","containerStyle","filter","onCancel","onChange","optionClass","options","ref","opsRef","useRef","useImperativeHandle","measure","e","current","parentElement","undefined","rect","getBoundingClientRect","style","window","getComputedStyle","mBottom","parseFloat","marginBottom","mTop","marginTop","height","optionNodes","option","iValue","iName","optionValueName","push","_jsx","className","onClick","stopPropagation","onKeyDown","key","role","tabIndex","children","BaseModal","cancelOnScrolling","dontDisableScrolling","theme","ad","container","context","hoc","overlay","_default","exports","default"],"sources":["../../../../../../../src/shared/components/selectors/CustomDropdown/Options/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  type RefObject,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { BaseModal } from 'components/Modal';\n\nimport {\n  type OptionT,\n  type OptionsT,\n  type ValueT,\n  optionValueName,\n} from '../../common';\n\nimport S from './style.scss';\n\nexport type ContainerPosT = {\n  left: number;\n  top: number;\n  width: number;\n};\n\nexport function areEqual(a?: ContainerPosT, b?: ContainerPosT): boolean {\n  return a?.left === b?.left && a?.top === b?.top && a?.width === b?.width;\n}\n\nexport type RefT = {\n  measure: () => DOMRect | undefined;\n};\n\ntype PropsT = {\n  containerClass: string;\n  containerStyle?: ContainerPosT;\n  filter?: (item: OptionT<ReactNode> | ValueT) => boolean;\n  optionClass: string;\n  options: Readonly<OptionsT<ReactNode>>;\n  onCancel: () => void;\n  onChange: (value: ValueT) => void;\n  ref?: RefObject<RefT | null>;\n};\n\nconst Options: FunctionComponent<PropsT> = ({\n  containerClass,\n  containerStyle,\n  filter,\n  onCancel,\n  onChange,\n  optionClass,\n  options,\n  ref,\n}) => {\n  const opsRef = useRef<HTMLDivElement>(null);\n\n  useImperativeHandle(ref, () => ({\n    measure: () => {\n      const e = opsRef.current?.parentElement;\n      if (!e) return undefined;\n\n      const rect = opsRef.current!.getBoundingClientRect();\n      const style = window.getComputedStyle(e);\n      const mBottom = parseFloat(style.marginBottom);\n      const mTop = parseFloat(style.marginTop);\n\n      rect.height += mBottom + mTop;\n\n      return rect;\n    },\n  }), []);\n\n  const optionNodes: ReactNode[] = [];\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      optionNodes.push(\n        <div\n          className={optionClass}\n          key={iValue}\n          onClick={(e) => {\n            onChange(iValue);\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') {\n              onChange(iValue);\n              e.stopPropagation();\n            }\n          }}\n          role=\"button\"\n          tabIndex={0}\n        >\n          {iName}\n        </div>,\n      );\n    }\n  }\n\n  return (\n    <BaseModal\n      // Closes the dropdown (cancels the selection) on any page scrolling attempt.\n      // This is the same native <select> elements do on scrolling, and at least for\n      // now we have no reason to deal with complications needed to support open\n      // dropdowns during the scrolling (that would need to re-position it in\n      // response to the position changes of the root dropdown element).\n      cancelOnScrolling\n      dontDisableScrolling\n      onCancel={onCancel}\n      style={containerStyle}\n      theme={{\n        ad: '',\n        container: containerClass,\n        context: '',\n        hoc: '',\n        overlay: S.overlay,\n      }}\n    >\n      <div ref={opsRef}>{optionNodes}</div>\n    </BaseModal>\n  );\n};\n\nexport default Options;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useImperativeHandle","useRef","BaseModal","optionValueName","S","jsx","_jsx","areEqual","a","b","left","top","width","Options","containerClass","containerStyle","filter","onCancel","onChange","optionClass","options","ref","opsRef","measure","e","current","parentElement","undefined","rect","getBoundingClientRect","style","window","getComputedStyle","mBottom","parseFloat","marginBottom","mTop","marginTop","height","optionNodes","option","iValue","iName","push","className","onClick","stopPropagation","onKeyDown","key","role","tabIndex","children","cancelOnScrolling","dontDisableScrolling","theme","ad","container","context","hoc","overlay"],"sources":["../../../../../../../src/shared/components/selectors/CustomDropdown/Options/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  type RefObject,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { BaseModal } from 'components/Modal';\n\nimport {\n  type OptionT,\n  type OptionsT,\n  type ValueT,\n  optionValueName,\n} from '../../common';\n\nimport S from './style.scss';\n\nexport type ContainerPosT = {\n  left: number;\n  top: number;\n  width: number;\n};\n\nexport function areEqual(a?: ContainerPosT, b?: ContainerPosT): boolean {\n  return a?.left === b?.left && a?.top === b?.top && a?.width === b?.width;\n}\n\nexport type RefT = {\n  measure: () => DOMRect | undefined;\n};\n\ntype PropsT = {\n  containerClass: string;\n  containerStyle?: ContainerPosT;\n  filter?: (item: OptionT<ReactNode> | ValueT) => boolean;\n  optionClass: string;\n  options: Readonly<OptionsT<ReactNode>>;\n  onCancel: () => void;\n  onChange: (value: ValueT) => void;\n  ref?: RefObject<RefT | null>;\n};\n\nconst Options: FunctionComponent<PropsT> = ({\n  containerClass,\n  containerStyle,\n  filter,\n  onCancel,\n  onChange,\n  optionClass,\n  options,\n  ref,\n}) => {\n  const opsRef = useRef<HTMLDivElement>(null);\n\n  useImperativeHandle(ref, () => ({\n    measure: () => {\n      const e = opsRef.current?.parentElement;\n      if (!e) return undefined;\n\n      const rect = opsRef.current!.getBoundingClientRect();\n      const style = window.getComputedStyle(e);\n      const mBottom = parseFloat(style.marginBottom);\n      const mTop = parseFloat(style.marginTop);\n\n      rect.height += mBottom + mTop;\n\n      return rect;\n    },\n  }), []);\n\n  const optionNodes: ReactNode[] = [];\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      optionNodes.push(\n        <div\n          className={optionClass}\n          key={iValue}\n          onClick={(e) => {\n            onChange(iValue);\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') {\n              onChange(iValue);\n              e.stopPropagation();\n            }\n          }}\n          role=\"button\"\n          tabIndex={0}\n        >\n          {iName}\n        </div>,\n      );\n    }\n  }\n\n  return (\n    <BaseModal\n      // Closes the dropdown (cancels the selection) on any page scrolling attempt.\n      // This is the same native <select> elements do on scrolling, and at least for\n      // now we have no reason to deal with complications needed to support open\n      // dropdowns during the scrolling (that would need to re-position it in\n      // response to the position changes of the root dropdown element).\n      cancelOnScrolling\n      dontDisableScrolling\n      onCancel={onCancel}\n      style={containerStyle}\n      theme={{\n        ad: '',\n        container: containerClass,\n        context: '',\n        hoc: '',\n        overlay: S.overlay,\n      }}\n    >\n      <div ref={opsRef}>{optionNodes}</div>\n    </BaseModal>\n  );\n};\n\nexport default Options;\n"],"mappings":"oRAAA,OAIEA,mBAAmB,CACnBC,MAAM,KACD,OAAO,QAELC,SAAS,sCAMhBC,eAAe,6BAAAC,CAAA,sBAGY,OAAAC,GAAA,IAAAC,IAAA,yBAQ7B,MAAO,SAAS,CAAAC,QAAQA,CAACC,CAAiB,CAAEC,CAAiB,CAAW,CACtE,MAAO,CAAAD,CAAC,EAAEE,IAAI,GAAKD,CAAC,EAAEC,IAAI,EAAIF,CAAC,EAAEG,GAAG,GAAKF,CAAC,EAAEE,GAAG,EAAIH,CAAC,EAAEI,KAAK,GAAKH,CAAC,EAAEG,KACrE,CAiBA,KAAM,CAAAC,OAAkC,CAAGA,CAAC,CAC1CC,cAAc,CACdC,cAAc,CACdC,MAAM,CACNC,QAAQ,CACRC,QAAQ,CACRC,WAAW,CACXC,OAAO,CACPC,GACF,CAAC,GAAK,CACJ,KAAM,CAAAC,MAAM,CAAGrB,MAAM,CAAiB,IAAI,CAAC,CAE3CD,mBAAmB,CAACqB,GAAG,CAAE,KAAO,CAC9BE,OAAO,CAAEA,CAAA,GAAM,CACb,KAAM,CAAAC,CAAC,CAAGF,MAAM,CAACG,OAAO,EAAEC,aAAa,CACvC,GAAI,CAACF,CAAC,CAAE,MAAO,CAAAG,SAAS,CAExB,KAAM,CAAAC,IAAI,CAAGN,MAAM,CAACG,OAAO,CAAEI,qBAAqB,CAAC,CAAC,CACpD,KAAM,CAAAC,KAAK,CAAGC,MAAM,CAACC,gBAAgB,CAACR,CAAC,CAAC,CACxC,KAAM,CAAAS,OAAO,CAAGC,UAAU,CAACJ,KAAK,CAACK,YAAY,CAAC,CAC9C,KAAM,CAAAC,IAAI,CAAGF,UAAU,CAACJ,KAAK,CAACO,SAAS,CAAC,CAExCT,IAAI,CAACU,MAAM,EAAIL,OAAO,CAAGG,IAAI,CAE7B,MAAO,CAAAR,IACT,CACF,CAAC,CAAC,CAAE,EAAE,CAAC,CAEP,KAAM,CAAAW,WAAwB,CAAG,EAAE,CACnC,IAAK,KAAM,CAAAC,MAAM,GAAI,CAAApB,OAAO,CAAE,CAC5B,GAAI,CAACJ,MAAM,EAAIA,MAAM,CAACwB,MAAM,CAAC,CAAE,CAC7B,KAAM,CAACC,MAAM,CAAEC,KAAK,CAAC,CAAGvC,eAAe,CAACqC,MAAM,CAAC,CAC/CD,WAAW,CAACI,IAAI,cACdrC,IAAA,QACEsC,SAAS,CAAEzB,WAAY,CAEvB0B,OAAO,CAAGrB,CAAC,EAAK,CACdN,QAAQ,CAACuB,MAAM,CAAC,CAChBjB,CAAC,CAACsB,eAAe,CAAC,CACpB,CAAE,CACFC,SAAS,CAAGvB,CAAC,EAAK,CAChB,GAAIA,CAAC,CAACwB,GAAG,GAAK,OAAO,CAAE,CACrB9B,QAAQ,CAACuB,MAAM,CAAC,CAChBjB,CAAC,CAACsB,eAAe,CAAC,CACpB,CACF,CAAE,CACFG,IAAI,CAAC,QAAQ,CACbC,QAAQ,CAAE,CAAE,CAAAC,QAAA,CAEXT,KAAK,EAdDD,MAeF,CACP,CACF,CACF,CAEA,mBACEnC,IAAA,CAACJ,SACC;AACA;AACA;AACA;AACA;AAAA,EACAkD,iBAAiB,MACjBC,oBAAoB,MACpBpC,QAAQ,CAAEA,QAAS,CACnBa,KAAK,CAAEf,cAAe,CACtBuC,KAAK,CAAE,CACLC,EAAE,CAAE,EAAE,CACNC,SAAS,CAAE1C,cAAc,CACzB2C,OAAO,CAAE,EAAE,CACXC,GAAG,CAAE,EAAE,CACPC,OAAO,CAAEvD,CAAC,CAACuD,OACb,CAAE,CAAAR,QAAA,cAEF7C,IAAA,QAAKe,GAAG,CAAEC,MAAO,CAAA6B,QAAA,CAAEZ,WAAW,CAAM,CAAC,CAC5B,CAEf,CAAC,CAED,cAAe,CAAA1B,OAAO","ignoreList":[]}

package/build/production/shared/components/selectors/CustomDropdown/index.js

@@ -1,8 +1,8 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=require("react");var _reactThemes=_interopRequireDefault(require("@dr.pogodin/react-themes"));var _common=require("../common");var _Options=_interopRequireWildcard(require("./Options"));var _jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}const defaultTheme={"context":"SNj3wp","ad":"T6eOJ-","hoc":"KG-OKN","container":"SzHHPE","label":"KTG4ai","dropdown":"xdotm7","option":"y-WCDM","select":"PP5Siy","arrow":"_7-A7Lh","active":"RoOAZK","upward":"_--5Xpy"};const BaseCustomDropdown=({filter,label,onChange,options,theme,value})=>{const[active,setActive]=(0,_react.useState)(false);const dropdownRef=(0,_react.useRef)(null);const opsRef=(0,_react.useRef)(null);const[opsPos,setOpsPos]=(0,_react.useState)();const[upward,setUpward]=(0,_react.useState)(false);(0,_react.useEffect)(()=>{if(!active)return undefined;let id;const cb=()=>{const anchor=dropdownRef.current?.getBoundingClientRect();const opsRect=opsRef.current?.measure();if(anchor&&opsRect){const fitsDown=anchor.bottom+opsRect.height<(window.visualViewport?.height??0);const fitsUp=anchor.top-opsRect.height>0;const up=!fitsDown&&fitsUp;setUpward(up);const pos=up?{left:anchor.left,top:anchor.top-opsRect.height-1,width:anchor.width}:{left:anchor.left,top:anchor.bottom,width:anchor.width};setOpsPos(now=>(0,_Options.areEqual)(now,pos)?now:pos)}id=requestAnimationFrame(cb)};requestAnimationFrame(cb);return()=>{cancelAnimationFrame(id)}},[active]);const openList=e=>{const view=window.visualViewport;const rect=dropdownRef.current.getBoundingClientRect();setActive(true);// NOTE: This first opens the dropdown off-screen, where it is measured
+import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.filter.js";import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.filter.js";import{useEffect,useRef,useState}from"react";import themed from"@dr.pogodin/react-themes";import{optionValueName}from"../common.js";import Options,{areEqual}from"./Options/index.js";const defaultTheme={"context":"SNj3wp","ad":"T6eOJ-","hoc":"KG-OKN","container":"SzHHPE","label":"KTG4ai","dropdown":"xdotm7","option":"y-WCDM","select":"PP5Siy","arrow":"_7-A7Lh","active":"RoOAZK","upward":"_--5Xpy"};import{Fragment as _Fragment,jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const BaseCustomDropdown=({filter,label,onChange,options,theme,value})=>{const[active,setActive]=useState(false);const dropdownRef=useRef(null);const opsRef=useRef(null);const[opsPos,setOpsPos]=useState();const[upward,setUpward]=useState(false);useEffect(()=>{if(!active)return undefined;let id;const cb=()=>{const anchor=dropdownRef.current?.getBoundingClientRect();const opsRect=opsRef.current?.measure();if(anchor&&opsRect){const fitsDown=anchor.bottom+opsRect.height<(window.visualViewport?.height??0);const fitsUp=anchor.top-opsRect.height>0;const up=!fitsDown&&fitsUp;setUpward(up);const pos=up?{left:anchor.left,top:anchor.top-opsRect.height-1,width:anchor.width}:{left:anchor.left,top:anchor.bottom,width:anchor.width};setOpsPos(now=>areEqual(now,pos)?now:pos)}id=requestAnimationFrame(cb)};requestAnimationFrame(cb);return()=>{cancelAnimationFrame(id)}},[active]);const openList=e=>{const view=window.visualViewport;const rect=dropdownRef.current.getBoundingClientRect();setActive(true);// NOTE: This first opens the dropdown off-screen, where it is measured
 // by an effect declared above, and then positioned below, or above
 // the original dropdown element, depending where it fits best
 // (if we first open it downward, it would flick if we immediately
 // move it above, at least with the current position update via local
 // react state, and not imperatively).
-setOpsPos({left:view?.width??0,top:view?.height??0,width:rect.width});e.stopPropagation()};let selected=/*#__PURE__*/(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:"\u200C"});for(const option of options){if(!filter||filter(option)){const[iValue,iName]=(0,_common.optionValueName)(option);if(iValue===value){selected=iName;break}}}let containerClassName=theme.container;if(active)containerClassName+=` ${theme.active}`;let opsContainerClass=theme.select??"";if(upward){containerClassName+=` ${theme.upward}`;opsContainerClass+=` ${theme.upward}`}return/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.label,children:label}),/*#__PURE__*/(0,_jsxRuntime.jsxs)("div",{className:theme.dropdown,onClick:openList,onKeyDown:e=>{if(e.key==="Enter")openList(e)},ref:dropdownRef,role:"listbox",tabIndex:0,children:[selected,/*#__PURE__*/(0,_jsxRuntime.jsx)("div",{className:theme.arrow})]}),active?/*#__PURE__*/(0,_jsxRuntime.jsx)(_Options.default,{containerClass:opsContainerClass,containerStyle:opsPos,onCancel:()=>{setActive(false)},onChange:newValue=>{setActive(false);if(onChange)onChange(newValue)},optionClass:theme.option??"",options:options,ref:opsRef}):null]})};var _default=exports.default=(0,_reactThemes.default)(BaseCustomDropdown,"CustomDropdown",defaultTheme);
+setOpsPos({left:view?.width??0,top:view?.height??0,width:rect.width});e.stopPropagation()};let selected=/*#__PURE__*/_jsx(_Fragment,{children:"\u200C"});for(const option of options){if(!filter||filter(option)){const[iValue,iName]=optionValueName(option);if(iValue===value){selected=iName;break}}}let containerClassName=theme.container;if(active)containerClassName+=` ${theme.active}`;let opsContainerClass=theme.select??"";if(upward){containerClassName+=` ${theme.upward}`;opsContainerClass+=` ${theme.upward}`}return/*#__PURE__*/_jsxs("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:theme.label,children:label}),/*#__PURE__*/_jsxs("div",{className:theme.dropdown,onClick:openList,onKeyDown:e=>{if(e.key==="Enter")openList(e)},ref:dropdownRef,role:"listbox",tabIndex:0,children:[selected,/*#__PURE__*/_jsx("div",{className:theme.arrow})]}),active?/*#__PURE__*/_jsx(Options,{containerClass:opsContainerClass,containerStyle:opsPos,onCancel:()=>{setActive(false)},onChange:newValue=>{setActive(false);if(onChange)onChange(newValue)},optionClass:theme.option??"",options:options,ref:opsRef}):null]})};export default/* #__PURE__ */themed(BaseCustomDropdown,"CustomDropdown",defaultTheme);
 //# sourceMappingURL=index.js.map