@dr.pogodin/react-utils 1.48.12 → 1.48.14

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useEffect","useRef","useState","useTheme","Tooltip","PLACEMENTS","defaultTheme","jsx","_jsx","jsxs","_jsxs","WithTooltip","children","placement","ABOVE_CURSOR","theme","tip","custom","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"],"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 { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n  PLACEMENTS,\n  type ThemeKeysT as TooltipThemeKeysT,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\ntype PropsT = {\n  children?: ReactNode;\n  placement?: PLACEMENTS;\n  theme?: Theme<'wrapper' | TooltipThemeKeysT>;\n  tip?: ReactNode;\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  timerId?: NodeJS.Timeout;\n  triggeredByTouch: boolean;\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 WithTooltip: FunctionComponent<PropsT> = ({\n  children,\n  placement = PLACEMENTS.ABOVE_CURSOR,\n  theme,\n  tip,\n}) => {\n  const custom = useTheme('WithTooltip', defaultTheme, 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={custom.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={custom}>{tip}</Tooltip>\n          : null\n      }\n      {children}\n    </div>\n  );\n};\n\ntype ExportT = {\n  PLACEMENTS: typeof PLACEMENTS;\n} & typeof WithTooltip;\n\nconst e: ExportT = WithTooltip 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","useTheme","Tooltip","PLACEMENTS","defaultTheme","jsx","_jsx","jsxs","_jsxs","WithTooltip","children","placement","ABOVE_CURSOR","theme","tip","custom","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"],"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 { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n  PLACEMENTS,\n  type ThemeKeysT as TooltipThemeKeysT,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\ntype PropsT = {\n  children?: ReactNode;\n  placement?: PLACEMENTS;\n  theme?: Theme<'wrapper' | TooltipThemeKeysT>;\n  tip?: ReactNode;\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  timerId?: NodeJS.Timeout;\n  triggeredByTouch: boolean;\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 WithTooltip: FunctionComponent<PropsT> = ({\n  children,\n  placement = PLACEMENTS.ABOVE_CURSOR,\n  theme,\n  tip,\n}) => {\n  const custom = useTheme('WithTooltip', defaultTheme, 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={custom.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={custom}>{tip}</Tooltip>\n          : null\n      }\n      {children}\n    </div>\n  );\n};\n\ntype ExportT = {\n  PLACEMENTS: typeof PLACEMENTS;\n} & typeof WithTooltip;\n\nconst e: ExportT = WithTooltip 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

@@ -15,5 +15,5 @@ import qs from"qs";import{useTheme}from"@dr.pogodin/react-themes";import Throbbe
  */const YouTubeVideo=({autoplay,src,theme,title})=>{const custom=useTheme("YouTubeVideo",defaultTheme,theme);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__*/_jsxs("div",{className:custom.container,children:[/*#__PURE__*/_jsx(Throbber,{theme:throbberTheme}),/*#__PURE__*/_jsx("iframe",{// eslint-disable-line react/iframe-missing-sandbox
-allow:"autoplay",allowFullScreen:true,className:custom.video,src:url,title:title})]})};export default YouTubeVideo;
+allow:"autoplay",allowFullScreen:true,className:custom.video,src:url,title:title})]});};export default YouTubeVideo;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["qs","useTheme","Throbber","defaultTheme","throbberTheme","jsx","_jsx","jsxs","_jsxs","YouTubeVideo","autoplay","src","theme","title","custom","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 type { FunctionComponent } from 'react';\n\nimport qs from 'qs';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport defaultTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\ntype ThemeT = Theme<'container' | 'video'>;\n\ntype PropsT = {\n  autoplay?: boolean;\n  src: string;\n  theme?: ThemeT;\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: FunctionComponent<PropsT> = ({\n  autoplay,\n  src,\n  theme,\n  title,\n}) => {\n  const custom = useTheme('YouTubeVideo', defaultTheme, theme);\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={custom.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={custom.video}\n        src={url}\n        title={title}\n      />\n    </div>\n  );\n};\n\nexport default YouTubeVideo;\n"],"mappings":"AAEA,MAAO,CAAAA,EAAE,KAAM,IAAI,CAEnB,OAAqBC,QAAQ,KAAQ,0BAA0B,OAExD,CAAAC,QAAQ,kCAAAC,YAAA,+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,YAAuC,CAAGA,CAAC,CAC/CC,QAAQ,CACRC,GAAG,CACHC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,MAAM,CAAGb,QAAQ,CAAC,cAAc,CAAEE,YAAY,CAAES,KAAK,CAAC,CAE5D,KAAM,CAAAG,QAAQ,CAAGJ,GAAG,CAACK,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,CAAGlB,EAAE,CAACoB,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,CAACT,QAAQ,CAAGA,QAAQ,CAAG,GAAG,CAAG,GAAG,CACrCO,GAAG,EAAI,IAAIjB,EAAE,CAACwB,SAAS,CAACL,KAAK,CAAC,EAAE,CAEhC;AACA;AAEA,mBACEX,KAAA,QAAKiB,SAAS,CAAEX,MAAM,CAACY,SAAU,CAAAC,QAAA,eAC/BrB,IAAA,CAACJ,QAAQ,EAACU,KAAK,CAAER,aAAc,CAAE,CAAC,cAKlCE,IAAA,WAAQ;AACNsB,KAAK,CAAC,UAAU,CAChBC,eAAe,MACfJ,SAAS,CAAEX,MAAM,CAACgB,KAAM,CACxBnB,GAAG,CAAEM,GAAI,CACTJ,KAAK,CAAEA,KAAM,CACd,CAAC,EACC,CAET,CAAC,CAED,cAAe,CAAAJ,YAAY","ignoreList":[]}
+{"version":3,"file":"index.js","names":["qs","useTheme","Throbber","defaultTheme","throbberTheme","jsx","_jsx","jsxs","_jsxs","YouTubeVideo","autoplay","src","theme","title","custom","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';\nimport type { FunctionComponent } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport defaultTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\ntype ThemeT = Theme<'container' | 'video'>;\n\ntype PropsT = {\n  autoplay?: boolean;\n  src: string;\n  theme?: ThemeT;\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: FunctionComponent<PropsT> = ({\n  autoplay,\n  src,\n  theme,\n  title,\n}) => {\n  const custom = useTheme('YouTubeVideo', defaultTheme, theme);\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={custom.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={custom.video}\n        src={url}\n        title={title}\n      />\n    </div>\n  );\n};\n\nexport default YouTubeVideo;\n"],"mappings":"AAAA,MAAO,CAAAA,EAAE,KAAM,IAAI,CAGnB,OAAqBC,QAAQ,KAAQ,0BAA0B,OAExD,CAAAC,QAAQ,kCAAAC,YAAA,+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,YAAuC,CAAGA,CAAC,CAC/CC,QAAQ,CACRC,GAAG,CACHC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,MAAM,CAAGb,QAAQ,CAAC,cAAc,CAAEE,YAAY,CAAES,KAAK,CAAC,CAE5D,KAAM,CAAAG,QAAQ,CAAGJ,GAAG,CAACK,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,CAAGlB,EAAE,CAACoB,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,CAACT,QAAQ,CAAGA,QAAQ,CAAG,GAAG,CAAG,GAAG,CACrCO,GAAG,EAAI,IAAIjB,EAAE,CAACwB,SAAS,CAACL,KAAK,CAAC,EAAE,CAEhC;AACA;AAEA,mBACEX,KAAA,QAAKiB,SAAS,CAAEX,MAAM,CAACY,SAAU,CAAAC,QAAA,eAC/BrB,IAAA,CAACJ,QAAQ,EAACU,KAAK,CAAER,aAAc,CAAE,CAAC,cAKlCE,IAAA,WAAQ;AACNsB,KAAK,CAAC,UAAU,CAChBC,eAAe,MACfJ,SAAS,CAAEX,MAAM,CAACgB,KAAM,CACxBnB,GAAG,CAAEM,GAAI,CACTJ,KAAK,CAAEA,KAAM,CACd,CAAC,EACC,CAAC,CAEV,CAAC,CAED,cAAe,CAAAJ,YAAY","ignoreList":[]}

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

@@ -1,7 +1,7 @@
-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.
+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__*/_jsx("div",{ref:opsRef,children:optionNodes})})};export 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":["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  onCancel: () => void;\n  onChange: (value: ValueT) => void;\n  optionClass: string;\n  options: Readonly<OptionsT<ReactNode>>;\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":"wLAAA,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":[]}
+{"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  onCancel: () => void;\n  onChange: (value: ValueT) => void;\n  optionClass: string;\n  options: Readonly<OptionsT<ReactNode>>;\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":[]}

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

@@ -1,8 +1,8 @@
-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{useTheme}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 CustomDropdown=({filter,label,onChange,options,theme,value})=>{const custom=useTheme("CustomDropdown",defaultTheme,theme);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
+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{useTheme}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 CustomDropdown=({filter,label,onChange,options,theme,value})=>{const custom=useTheme("CustomDropdown",defaultTheme,theme);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__*/_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=custom.container;if(active)containerClassName+=` ${custom.active}`;let opsContainerClass=custom.select??"";if(upward){containerClassName+=` ${custom.upward}`;opsContainerClass+=` ${custom.upward}`}return/*#__PURE__*/_jsxs("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:custom.label,children:label}),/*#__PURE__*/_jsxs("div",{className:custom.dropdown,onClick:openList,onKeyDown:e=>{if(e.key==="Enter")openList(e)},ref:dropdownRef,role:"listbox",tabIndex:0,children:[selected,/*#__PURE__*/_jsx("div",{className:custom.arrow})]}),active?/*#__PURE__*/_jsx(Options,{containerClass:opsContainerClass,containerStyle:opsPos,onCancel:()=>{setActive(false)},onChange:newValue=>{setActive(false);if(onChange)onChange(newValue)},optionClass:custom.option??"",options:options,ref:opsRef}):null]})};export default CustomDropdown;
+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=custom.container;if(active)containerClassName+=` ${custom.active}`;let opsContainerClass=custom.select??"";if(upward){containerClassName+=` ${custom.upward}`;opsContainerClass+=` ${custom.upward}`;}return/*#__PURE__*/_jsxs("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:custom.label,children:label}),/*#__PURE__*/_jsxs("div",{className:custom.dropdown,onClick:openList,onKeyDown:e=>{if(e.key==="Enter")openList(e);},ref:dropdownRef,role:"listbox",tabIndex:0,children:[selected,/*#__PURE__*/_jsx("div",{className:custom.arrow})]}),active?/*#__PURE__*/_jsx(Options,{containerClass:opsContainerClass,containerStyle:opsPos,onCancel:()=>{setActive(false);},onChange:newValue=>{setActive(false);if(onChange)onChange(newValue);},optionClass:custom.option??"",options:options,ref:opsRef}):null]});};export default CustomDropdown;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useEffect","useRef","useState","useTheme","optionValueName","Options","areEqual","defaultTheme","Fragment","_Fragment","jsx","_jsx","jsxs","_jsxs","CustomDropdown","filter","label","onChange","options","theme","value","custom","active","setActive","dropdownRef","opsRef","opsPos","setOpsPos","upward","setUpward","undefined","id","cb","anchor","current","getBoundingClientRect","opsRect","measure","fitsDown","bottom","height","window","visualViewport","fitsUp","top","up","pos","left","width","now","requestAnimationFrame","cancelAnimationFrame","openList","e","view","rect","stopPropagation","selected","children","option","iValue","iName","containerClassName","container","opsContainerClass","select","className","dropdown","onClick","onKeyDown","key","ref","role","tabIndex","arrow","containerClass","containerStyle","onCancel","newValue","optionClass"],"sources":["../../../../../../src/shared/components/selectors/CustomDropdown/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { useTheme } from '@dr.pogodin/react-themes';\n\nimport { type PropsT, type ValueT, optionValueName } from '../common';\n\nimport Options, { type ContainerPosT, type RefT, areEqual } from './Options';\n\nimport defaultTheme from './theme.scss';\n\nconst CustomDropdown: FunctionComponent<\n  PropsT<ReactNode, (value: ValueT) => void>\n> = ({\n  filter,\n  label,\n  onChange,\n  options,\n  theme,\n  value,\n}) => {\n  const custom = useTheme('CustomDropdown', defaultTheme, theme);\n\n  const [active, setActive] = useState(false);\n\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const opsRef = useRef<RefT>(null);\n\n  const [opsPos, setOpsPos] = useState<ContainerPosT>();\n  const [upward, setUpward] = useState(false);\n\n  useEffect(() => {\n    if (!active) return undefined;\n\n    let id: number;\n    const cb = () => {\n      const anchor = dropdownRef.current?.getBoundingClientRect();\n      const opsRect = opsRef.current?.measure();\n      if (anchor && opsRect) {\n        const fitsDown = anchor.bottom + opsRect.height\n          < (window.visualViewport?.height ?? 0);\n        const fitsUp = anchor.top - opsRect.height > 0;\n\n        const up = !fitsDown && fitsUp;\n        setUpward(up);\n\n        const pos = up ? {\n          left: anchor.left,\n          top: anchor.top - opsRect.height - 1,\n          width: anchor.width,\n        } : {\n          left: anchor.left,\n          top: anchor.bottom,\n          width: anchor.width,\n        };\n\n        setOpsPos((now) => (areEqual(now, pos) ? now : pos));\n      }\n      id = requestAnimationFrame(cb);\n    };\n    requestAnimationFrame(cb);\n\n    return () => {\n      cancelAnimationFrame(id);\n    };\n  }, [active]);\n\n  const openList = (\n    e: React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement>,\n  ) => {\n    const view = window.visualViewport;\n    const rect = dropdownRef.current!.getBoundingClientRect();\n    setActive(true);\n\n    // NOTE: This first opens the dropdown off-screen, where it is measured\n    // by an effect declared above, and then positioned below, or above\n    // the original dropdown element, depending where it fits best\n    // (if we first open it downward, it would flick if we immediately\n    // move it above, at least with the current position update via local\n    // react state, and not imperatively).\n    setOpsPos({\n      left: view?.width ?? 0,\n      top: view?.height ?? 0,\n      width: rect.width,\n    });\n\n    e.stopPropagation();\n  };\n\n  let selected: React.ReactNode = <>&zwnj;</>;\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      if (iValue === value) {\n        selected = iName;\n        break;\n      }\n    }\n  }\n\n  let containerClassName = custom.container;\n  if (active) containerClassName += ` ${custom.active}`;\n\n  let opsContainerClass = custom.select ?? '';\n  if (upward) {\n    containerClassName += ` ${custom.upward}`;\n    opsContainerClass += ` ${custom.upward}`;\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label === undefined ? null\n        : <div className={custom.label}>{label}</div>}\n      <div\n        className={custom.dropdown}\n        onClick={openList}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') openList(e);\n        }}\n        ref={dropdownRef}\n        role=\"listbox\"\n        tabIndex={0}\n      >\n        {selected}\n        <div className={custom.arrow} />\n      </div>\n      {\n        active ? (\n          <Options\n            containerClass={opsContainerClass}\n            containerStyle={opsPos}\n            onCancel={() => {\n              setActive(false);\n            }}\n            onChange={(newValue) => {\n              setActive(false);\n              if (onChange) onChange(newValue);\n            }}\n            optionClass={custom.option ?? ''}\n            options={options}\n            ref={opsRef}\n          />\n        ) : null\n      }\n    </div>\n  );\n};\n\nexport default CustomDropdown;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useEffect","useRef","useState","useTheme","optionValueName","Options","areEqual","defaultTheme","Fragment","_Fragment","jsx","_jsx","jsxs","_jsxs","CustomDropdown","filter","label","onChange","options","theme","value","custom","active","setActive","dropdownRef","opsRef","opsPos","setOpsPos","upward","setUpward","undefined","id","cb","anchor","current","getBoundingClientRect","opsRect","measure","fitsDown","bottom","height","window","visualViewport","fitsUp","top","up","pos","left","width","now","requestAnimationFrame","cancelAnimationFrame","openList","e","view","rect","stopPropagation","selected","children","option","iValue","iName","containerClassName","container","opsContainerClass","select","className","dropdown","onClick","onKeyDown","key","ref","role","tabIndex","arrow","containerClass","containerStyle","onCancel","newValue","optionClass"],"sources":["../../../../../../src/shared/components/selectors/CustomDropdown/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { useTheme } from '@dr.pogodin/react-themes';\n\nimport { type PropsT, type ValueT, optionValueName } from '../common';\n\nimport Options, { type ContainerPosT, type RefT, areEqual } from './Options';\n\nimport defaultTheme from './theme.scss';\n\nconst CustomDropdown: FunctionComponent<\n  PropsT<ReactNode, (value: ValueT) => void>\n> = ({\n  filter,\n  label,\n  onChange,\n  options,\n  theme,\n  value,\n}) => {\n  const custom = useTheme('CustomDropdown', defaultTheme, theme);\n\n  const [active, setActive] = useState(false);\n\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const opsRef = useRef<RefT>(null);\n\n  const [opsPos, setOpsPos] = useState<ContainerPosT>();\n  const [upward, setUpward] = useState(false);\n\n  useEffect(() => {\n    if (!active) return undefined;\n\n    let id: number;\n    const cb = () => {\n      const anchor = dropdownRef.current?.getBoundingClientRect();\n      const opsRect = opsRef.current?.measure();\n      if (anchor && opsRect) {\n        const fitsDown = anchor.bottom + opsRect.height\n          < (window.visualViewport?.height ?? 0);\n        const fitsUp = anchor.top - opsRect.height > 0;\n\n        const up = !fitsDown && fitsUp;\n        setUpward(up);\n\n        const pos = up ? {\n          left: anchor.left,\n          top: anchor.top - opsRect.height - 1,\n          width: anchor.width,\n        } : {\n          left: anchor.left,\n          top: anchor.bottom,\n          width: anchor.width,\n        };\n\n        setOpsPos((now) => (areEqual(now, pos) ? now : pos));\n      }\n      id = requestAnimationFrame(cb);\n    };\n    requestAnimationFrame(cb);\n\n    return () => {\n      cancelAnimationFrame(id);\n    };\n  }, [active]);\n\n  const openList = (\n    e: React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement>,\n  ) => {\n    const view = window.visualViewport;\n    const rect = dropdownRef.current!.getBoundingClientRect();\n    setActive(true);\n\n    // NOTE: This first opens the dropdown off-screen, where it is measured\n    // by an effect declared above, and then positioned below, or above\n    // the original dropdown element, depending where it fits best\n    // (if we first open it downward, it would flick if we immediately\n    // move it above, at least with the current position update via local\n    // react state, and not imperatively).\n    setOpsPos({\n      left: view?.width ?? 0,\n      top: view?.height ?? 0,\n      width: rect.width,\n    });\n\n    e.stopPropagation();\n  };\n\n  let selected: React.ReactNode = <>&zwnj;</>;\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      if (iValue === value) {\n        selected = iName;\n        break;\n      }\n    }\n  }\n\n  let containerClassName = custom.container;\n  if (active) containerClassName += ` ${custom.active}`;\n\n  let opsContainerClass = custom.select ?? '';\n  if (upward) {\n    containerClassName += ` ${custom.upward}`;\n    opsContainerClass += ` ${custom.upward}`;\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label === undefined ? null\n        : <div className={custom.label}>{label}</div>}\n      <div\n        className={custom.dropdown}\n        onClick={openList}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') openList(e);\n        }}\n        ref={dropdownRef}\n        role=\"listbox\"\n        tabIndex={0}\n      >\n        {selected}\n        <div className={custom.arrow} />\n      </div>\n      {\n        active ? (\n          <Options\n            containerClass={opsContainerClass}\n            containerStyle={opsPos}\n            onCancel={() => {\n              setActive(false);\n            }}\n            onChange={(newValue) => {\n              setActive(false);\n              if (onChange) onChange(newValue);\n            }}\n            optionClass={custom.option ?? ''}\n            options={options}\n            ref={opsRef}\n          />\n        ) : null\n      }\n    </div>\n  );\n};\n\nexport default CustomDropdown;\n"],"mappings":"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","ignoreList":[]}

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

@@ -17,9 +17,9 @@ import{useTheme}from"@dr.pogodin/react-themes";import{optionValueName}from"../co
  * @param [props.value] Currently selected value.
  * @param [props....]
  * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)
- */import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dropdown=({filter,label,onChange,options,testId,theme,value})=>{let isValidValue=false;const optionElements=[];const composed=useTheme("Dropdown",defaultTheme,theme);for(const option of options){if(!filter||filter(option)){const[iValue,iName]=optionValueName(option);isValidValue||=iValue===value;optionElements.push(/*#__PURE__*/_jsx("option",{className:composed.option,value:iValue,children:iName},iValue))}}// NOTE: This element represents the current `value` when it does not match
+ */import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Dropdown=({filter,label,onChange,options,testId,theme,value})=>{let isValidValue=false;const optionElements=[];const composed=useTheme("Dropdown",defaultTheme,theme);for(const option of options){if(!filter||filter(option)){const[iValue,iName]=optionValueName(option);isValidValue||=iValue===value;optionElements.push(/*#__PURE__*/_jsx("option",{className:composed.option,value:iValue,children:iName},iValue));}}// NOTE: This element represents the current `value` when it does not match
 // any valid option. In Chrome, and some other browsers, we are able to hide
 // it from the opened dropdown; in others, e.g. Safari, the best we can do is
 // to show it as disabled.
-const hiddenOption=isValidValue?null:/*#__PURE__*/_jsx("option",{className:composed.hiddenOption,disabled:true,value:value,children:value},"__reactUtilsHiddenOption");let selectClassName=composed.select;if(!isValidValue)selectClassName+=` ${composed.invalid}`;return/*#__PURE__*/_jsxs("div",{className:composed.container,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:composed.label,children:label}),/*#__PURE__*/_jsxs("div",{className:composed.dropdown,children:[/*#__PURE__*/_jsxs("select",{className:selectClassName,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,onChange:onChange,value:value,children:[hiddenOption,optionElements]}),/*#__PURE__*/_jsx("div",{className:composed.arrow})]})]})};export default Dropdown;
+const hiddenOption=isValidValue?null:/*#__PURE__*/_jsx("option",{className:composed.hiddenOption,disabled:true,value:value,children:value},"__reactUtilsHiddenOption");let selectClassName=composed.select;if(!isValidValue)selectClassName+=` ${composed.invalid}`;return/*#__PURE__*/_jsxs("div",{className:composed.container,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:composed.label,children:label}),/*#__PURE__*/_jsxs("div",{className:composed.dropdown,children:[/*#__PURE__*/_jsxs("select",{className:selectClassName,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,onChange:onChange,value:value,children:[hiddenOption,optionElements]}),/*#__PURE__*/_jsx("div",{className:composed.arrow})]})]});};export default Dropdown;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useTheme","optionValueName","defaultTheme","jsx","_jsx","jsxs","_jsxs","Dropdown","filter","label","onChange","options","testId","theme","value","isValidValue","optionElements","composed","option","iValue","iName","push","className","children","hiddenOption","disabled","selectClassName","select","invalid","container","undefined","dropdown","process","env","NODE_ENV","arrow"],"sources":["../../../../../../src/shared/components/selectors/NativeDropdown/index.tsx"],"sourcesContent":["// Implements dropdown based on the native HTML <select> element.\n\nimport type { FunctionComponent } from 'react';\n\nimport { useTheme } from '@dr.pogodin/react-themes';\n\nimport { type PropsT, optionValueName } from '../common';\n\nimport defaultTheme from './theme.scss';\n\n/**\n * Implements a themeable dropdown list. Internally it is rendered with help of\n * the standard HTML `<select>` element, thus the styling support is somewhat\n * limited.\n * @param [props] Component properties.\n * @param [props.filter] Options filter function. If provided, only\n * those elements of `options` list will be used by the dropdown, for which this\n * filter returns `true`.\n * @param [props.label] Dropdown label.\n * @param [props.onChange] Selection event handler.\n * @param [props.options=[]] Array of dropdown\n * options. For string elements the option value and name will be the same.\n * It is allowed to mix DropdownOption and string elements in the same option\n * list.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.value] Currently selected value.\n * @param [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Dropdown: FunctionComponent<PropsT<string>> = ({\n  filter,\n  label,\n  onChange,\n  options,\n  testId,\n  theme,\n  value,\n}) => {\n  let isValidValue = false;\n  const optionElements = [];\n\n  const composed = useTheme('Dropdown', defaultTheme, theme);\n\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      isValidValue ||= iValue === value;\n      optionElements.push(\n        <option className={composed.option} key={iValue} value={iValue}>\n          {iName}\n        </option>,\n      );\n    }\n  }\n\n  // NOTE: This element represents the current `value` when it does not match\n  // any valid option. In Chrome, and some other browsers, we are able to hide\n  // it from the opened dropdown; in others, e.g. Safari, the best we can do is\n  // to show it as disabled.\n  const hiddenOption = isValidValue ? null : (\n    <option\n      className={composed.hiddenOption}\n      disabled\n      key=\"__reactUtilsHiddenOption\"\n      value={value}\n    >\n      {value}\n    </option>\n  );\n\n  let selectClassName = composed.select;\n  if (!isValidValue) selectClassName += ` ${composed.invalid}`;\n\n  return (\n    <div className={composed.container}>\n      { label === undefined\n        ? null : <div className={composed.label}>{label}</div> }\n      <div className={composed.dropdown}>\n        <select\n          className={selectClassName}\n          data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n          onChange={onChange}\n          value={value}\n        >\n          {hiddenOption}\n          {optionElements}\n        </select>\n        <div className={composed.arrow} />\n      </div>\n    </div>\n  );\n};\n\nexport default Dropdown;\n"],"mappings":"wLAAA;AAIA,OAASA,QAAQ,KAAQ,0BAA0B,QAE7BC,eAAe,0BAAAC,YAAA,gOAIrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAlBA,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAmBA,KAAM,CAAAC,QAA2C,CAAGA,CAAC,CACnDC,MAAM,CACNC,KAAK,CACLC,QAAQ,CACRC,OAAO,CACPC,MAAM,CACNC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,GAAI,CAAAC,YAAY,CAAG,KAAK,CACxB,KAAM,CAAAC,cAAc,CAAG,EAAE,CAEzB,KAAM,CAAAC,QAAQ,CAAGjB,QAAQ,CAAC,UAAU,CAAEE,YAAY,CAAEW,KAAK,CAAC,CAE1D,IAAK,KAAM,CAAAK,MAAM,GAAI,CAAAP,OAAO,CAAE,CAC5B,GAAI,CAACH,MAAM,EAAIA,MAAM,CAACU,MAAM,CAAC,CAAE,CAC7B,KAAM,CAACC,MAAM,CAAEC,KAAK,CAAC,CAAGnB,eAAe,CAACiB,MAAM,CAAC,CAC/CH,YAAY,GAAKI,MAAM,GAAKL,KAAK,CACjCE,cAAc,CAACK,IAAI,cACjBjB,IAAA,WAAQkB,SAAS,CAAEL,QAAQ,CAACC,MAAO,CAAcJ,KAAK,CAAEK,MAAO,CAAAI,QAAA,CAC5DH,KAAK,EADiCD,MAEjC,CACV,CACF,CACF,CAEA;AACA;AACA;AACA;AACA,KAAM,CAAAK,YAAY,CAAGT,YAAY,CAAG,IAAI,cACtCX,IAAA,WACEkB,SAAS,CAAEL,QAAQ,CAACO,YAAa,CACjCC,QAAQ,MAERX,KAAK,CAAEA,KAAM,CAAAS,QAAA,CAEZT,KAAK,EAHF,0BAIE,CACT,CAED,GAAI,CAAAY,eAAe,CAAGT,QAAQ,CAACU,MAAM,CACrC,GAAI,CAACZ,YAAY,CAAEW,eAAe,EAAI,IAAIT,QAAQ,CAACW,OAAO,EAAE,CAE5D,mBACEtB,KAAA,QAAKgB,SAAS,CAAEL,QAAQ,CAACY,SAAU,CAAAN,QAAA,EAC/Bd,KAAK,GAAKqB,SAAS,CACjB,IAAI,cAAG1B,IAAA,QAAKkB,SAAS,CAAEL,QAAQ,CAACR,KAAM,CAAAc,QAAA,CAAEd,KAAK,CAAM,CAAC,cACxDH,KAAA,QAAKgB,SAAS,CAAEL,QAAQ,CAACc,QAAS,CAAAR,QAAA,eAChCjB,KAAA,WACEgB,SAAS,CAAEI,eAAgB,CAC3B,cAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,GAAK,YAAY,CAAGJ,SAAS,CAAGlB,MAAO,CACxEF,QAAQ,CAAEA,QAAS,CACnBI,KAAK,CAAEA,KAAM,CAAAS,QAAA,EAEZC,YAAY,CACZR,cAAc,EACT,CAAC,cACTZ,IAAA,QAAKkB,SAAS,CAAEL,QAAQ,CAACkB,KAAM,CAAE,CAAC,EAC/B,CAAC,EACH,CAET,CAAC,CAED,cAAe,CAAA5B,QAAQ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useTheme","optionValueName","defaultTheme","jsx","_jsx","jsxs","_jsxs","Dropdown","filter","label","onChange","options","testId","theme","value","isValidValue","optionElements","composed","option","iValue","iName","push","className","children","hiddenOption","disabled","selectClassName","select","invalid","container","undefined","dropdown","process","env","NODE_ENV","arrow"],"sources":["../../../../../../src/shared/components/selectors/NativeDropdown/index.tsx"],"sourcesContent":["// Implements dropdown based on the native HTML <select> element.\n\nimport type { FunctionComponent } from 'react';\n\nimport { useTheme } from '@dr.pogodin/react-themes';\n\nimport { type PropsT, optionValueName } from '../common';\n\nimport defaultTheme from './theme.scss';\n\n/**\n * Implements a themeable dropdown list. Internally it is rendered with help of\n * the standard HTML `<select>` element, thus the styling support is somewhat\n * limited.\n * @param [props] Component properties.\n * @param [props.filter] Options filter function. If provided, only\n * those elements of `options` list will be used by the dropdown, for which this\n * filter returns `true`.\n * @param [props.label] Dropdown label.\n * @param [props.onChange] Selection event handler.\n * @param [props.options=[]] Array of dropdown\n * options. For string elements the option value and name will be the same.\n * It is allowed to mix DropdownOption and string elements in the same option\n * list.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.value] Currently selected value.\n * @param [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst Dropdown: FunctionComponent<PropsT<string>> = ({\n  filter,\n  label,\n  onChange,\n  options,\n  testId,\n  theme,\n  value,\n}) => {\n  let isValidValue = false;\n  const optionElements = [];\n\n  const composed = useTheme('Dropdown', defaultTheme, theme);\n\n  for (const option of options) {\n    if (!filter || filter(option)) {\n      const [iValue, iName] = optionValueName(option);\n      isValidValue ||= iValue === value;\n      optionElements.push(\n        <option className={composed.option} key={iValue} value={iValue}>\n          {iName}\n        </option>,\n      );\n    }\n  }\n\n  // NOTE: This element represents the current `value` when it does not match\n  // any valid option. In Chrome, and some other browsers, we are able to hide\n  // it from the opened dropdown; in others, e.g. Safari, the best we can do is\n  // to show it as disabled.\n  const hiddenOption = isValidValue ? null : (\n    <option\n      className={composed.hiddenOption}\n      disabled\n      key=\"__reactUtilsHiddenOption\"\n      value={value}\n    >\n      {value}\n    </option>\n  );\n\n  let selectClassName = composed.select;\n  if (!isValidValue) selectClassName += ` ${composed.invalid}`;\n\n  return (\n    <div className={composed.container}>\n      { label === undefined\n        ? null : <div className={composed.label}>{label}</div> }\n      <div className={composed.dropdown}>\n        <select\n          className={selectClassName}\n          data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n          onChange={onChange}\n          value={value}\n        >\n          {hiddenOption}\n          {optionElements}\n        </select>\n        <div className={composed.arrow} />\n      </div>\n    </div>\n  );\n};\n\nexport default Dropdown;\n"],"mappings":"wLAAA;AAIA,OAASA,QAAQ,KAAQ,0BAA0B,QAE7BC,eAAe,0BAAAC,YAAA,gOAIrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAlBA,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAmBA,KAAM,CAAAC,QAA2C,CAAGA,CAAC,CACnDC,MAAM,CACNC,KAAK,CACLC,QAAQ,CACRC,OAAO,CACPC,MAAM,CACNC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,GAAI,CAAAC,YAAY,CAAG,KAAK,CACxB,KAAM,CAAAC,cAAc,CAAG,EAAE,CAEzB,KAAM,CAAAC,QAAQ,CAAGjB,QAAQ,CAAC,UAAU,CAAEE,YAAY,CAAEW,KAAK,CAAC,CAE1D,IAAK,KAAM,CAAAK,MAAM,GAAI,CAAAP,OAAO,CAAE,CAC5B,GAAI,CAACH,MAAM,EAAIA,MAAM,CAACU,MAAM,CAAC,CAAE,CAC7B,KAAM,CAACC,MAAM,CAAEC,KAAK,CAAC,CAAGnB,eAAe,CAACiB,MAAM,CAAC,CAC/CH,YAAY,GAAKI,MAAM,GAAKL,KAAK,CACjCE,cAAc,CAACK,IAAI,cACjBjB,IAAA,WAAQkB,SAAS,CAAEL,QAAQ,CAACC,MAAO,CAAcJ,KAAK,CAAEK,MAAO,CAAAI,QAAA,CAC5DH,KAAK,EADiCD,MAEjC,CACV,CAAC,CACH,CACF,CAEA;AACA;AACA;AACA;AACA,KAAM,CAAAK,YAAY,CAAGT,YAAY,CAAG,IAAI,cACtCX,IAAA,WACEkB,SAAS,CAAEL,QAAQ,CAACO,YAAa,CACjCC,QAAQ,MAERX,KAAK,CAAEA,KAAM,CAAAS,QAAA,CAEZT,KAAK,EAHF,0BAIE,CACT,CAED,GAAI,CAAAY,eAAe,CAAGT,QAAQ,CAACU,MAAM,CACrC,GAAI,CAACZ,YAAY,CAAEW,eAAe,EAAI,IAAIT,QAAQ,CAACW,OAAO,EAAE,CAE5D,mBACEtB,KAAA,QAAKgB,SAAS,CAAEL,QAAQ,CAACY,SAAU,CAAAN,QAAA,EAC/Bd,KAAK,GAAKqB,SAAS,CACjB,IAAI,cAAG1B,IAAA,QAAKkB,SAAS,CAAEL,QAAQ,CAACR,KAAM,CAAAc,QAAA,CAAEd,KAAK,CAAM,CAAC,cACxDH,KAAA,QAAKgB,SAAS,CAAEL,QAAQ,CAACc,QAAS,CAAAR,QAAA,eAChCjB,KAAA,WACEgB,SAAS,CAAEI,eAAgB,CAC3B,cAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,GAAK,YAAY,CAAGJ,SAAS,CAAGlB,MAAO,CACxEF,QAAQ,CAAEA,QAAS,CACnBI,KAAK,CAAEA,KAAM,CAAAS,QAAA,EAEZC,YAAY,CACZR,cAAc,EACT,CAAC,cACTZ,IAAA,QAAKkB,SAAS,CAAEL,QAAQ,CAACkB,KAAM,CAAE,CAAC,EAC/B,CAAC,EACH,CAAC,CAEV,CAAC,CAED,cAAe,CAAA5B,QAAQ","ignoreList":[]}

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

@@ -1,2 +1,2 @@
-import"core-js/modules/es.array.push.js";import{useTheme}from"@dr.pogodin/react-themes";import{optionValueName}from"../common.js";const defaultTheme={"context":"akD3dQ","ad":"xcXtdE","hoc":"N3iziJ","container":"BYeWyJ","option":"_7MFXEN","selected":"CDbWAd","options":"_9-eOZo"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const Switch=({label,onChange,options,theme,value})=>{const composed=useTheme("Switch",defaultTheme,theme);if(!options||!composed.option)throw Error("Internal error");const optionNodes=[];for(const option of options){const[iValue,iName]=optionValueName(option);let className=composed.option;let onPress;if(iValue===value)className+=` ${composed.selected}`;else if(onChange){onPress=()=>{onChange(iValue)}}optionNodes.push(onPress?/*#__PURE__*/_jsx("div",{className:className,onClick:onPress,onKeyDown:e=>{if(e.key==="Enter")onPress()},role:"button",tabIndex:0,children:iName},iValue):/*#__PURE__*/_jsx("div",{className:className,children:iName},iValue))}return/*#__PURE__*/_jsxs("div",{className:composed.container,children:[label?/*#__PURE__*/_jsx("div",{className:composed.label,children:label}):null,/*#__PURE__*/_jsx("div",{className:composed.options,children:optionNodes})]})};
+import"core-js/modules/es.array.push.js";import{useTheme}from"@dr.pogodin/react-themes";import{optionValueName}from"../common.js";const defaultTheme={"context":"akD3dQ","ad":"xcXtdE","hoc":"N3iziJ","container":"BYeWyJ","option":"_7MFXEN","selected":"CDbWAd","options":"_9-eOZo"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const Switch=({label,onChange,options,theme,value})=>{const composed=useTheme("Switch",defaultTheme,theme);if(!options||!composed.option)throw Error("Internal error");const optionNodes=[];for(const option of options){const[iValue,iName]=optionValueName(option);let className=composed.option;let onPress;if(iValue===value)className+=` ${composed.selected}`;else if(onChange){onPress=()=>{onChange(iValue);};}optionNodes.push(onPress?/*#__PURE__*/_jsx("div",{className:className,onClick:onPress,onKeyDown:e=>{if(e.key==="Enter")onPress();},role:"button",tabIndex:0,children:iName},iValue):/*#__PURE__*/_jsx("div",{className:className,children:iName},iValue));}return/*#__PURE__*/_jsxs("div",{className:composed.container,children:[label?/*#__PURE__*/_jsx("div",{className:composed.label,children:label}):null,/*#__PURE__*/_jsx("div",{className:composed.options,children:optionNodes})]});};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useTheme","optionValueName","defaultTheme","jsx","_jsx","jsxs","_jsxs","Switch","label","onChange","options","theme","value","composed","option","Error","optionNodes","iValue","iName","className","onPress","selected","push","onClick","onKeyDown","e","key","role","tabIndex","children","container"],"sources":["../../../../../../src/shared/components/selectors/Switch/index.tsx"],"sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport {\n  type OptionsT,\n  type ValueT,\n  optionValueName,\n} from '../common';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeT = Theme<'container' | 'label' | 'option' | 'options' | 'selected'>;\n\ntype PropsT = {\n  label?: ReactNode;\n  onChange?: (value: ValueT) => void;\n  options?: Readonly<OptionsT<ReactNode>>;\n  theme?: ThemeT;\n  value?: ValueT;\n};\n\nexport const Switch: FunctionComponent<PropsT> = ({\n  label,\n  onChange,\n  options,\n  theme,\n  value,\n}) => {\n  const composed = useTheme('Switch', defaultTheme, theme);\n\n  if (!options || !composed.option) throw Error('Internal error');\n\n  const optionNodes: React.ReactNode[] = [];\n  for (const option of options) {\n    const [iValue, iName] = optionValueName(option);\n\n    let className: string = composed.option;\n    let onPress: (() => void) | undefined;\n    if (iValue === value) className += ` ${composed.selected}`;\n    else if (onChange) {\n      onPress = () => {\n        onChange(iValue);\n      };\n    }\n\n    optionNodes.push(\n      onPress\n        ? (\n          <div\n            className={className}\n            key={iValue}\n            onClick={onPress}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') onPress();\n            }}\n            role=\"button\"\n            tabIndex={0}\n          >\n            {iName}\n          </div>\n        )\n        : <div className={className} key={iValue}>{iName}</div>,\n    );\n  }\n\n  return (\n    <div className={composed.container}>\n      {label ? <div className={composed.label}>{label}</div> : null}\n\n      <div className={composed.options}>\n        {optionNodes}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"yCAEA,OAAqBA,QAAQ,KAAQ,0BAA0B,QAK7DC,eAAe,0BAAAC,YAAA,mIAGuB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAYxC,MAAO,MAAM,CAAAC,MAAiC,CAAGA,CAAC,CAChDC,KAAK,CACLC,QAAQ,CACRC,OAAO,CACPC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,QAAQ,CAAGb,QAAQ,CAAC,QAAQ,CAAEE,YAAY,CAAES,KAAK,CAAC,CAExD,GAAI,CAACD,OAAO,EAAI,CAACG,QAAQ,CAACC,MAAM,CAAE,KAAM,CAAAC,KAAK,CAAC,gBAAgB,CAAC,CAE/D,KAAM,CAAAC,WAA8B,CAAG,EAAE,CACzC,IAAK,KAAM,CAAAF,MAAM,GAAI,CAAAJ,OAAO,CAAE,CAC5B,KAAM,CAACO,MAAM,CAAEC,KAAK,CAAC,CAAGjB,eAAe,CAACa,MAAM,CAAC,CAE/C,GAAI,CAAAK,SAAiB,CAAGN,QAAQ,CAACC,MAAM,CACvC,GAAI,CAAAM,OAAiC,CACrC,GAAIH,MAAM,GAAKL,KAAK,CAAEO,SAAS,EAAI,IAAIN,QAAQ,CAACQ,QAAQ,EAAE,CAAC,IACtD,IAAIZ,QAAQ,CAAE,CACjBW,OAAO,CAAGA,CAAA,GAAM,CACdX,QAAQ,CAACQ,MAAM,CACjB,CACF,CAEAD,WAAW,CAACM,IAAI,CACdF,OAAO,cAEHhB,IAAA,QACEe,SAAS,CAAEA,SAAU,CAErBI,OAAO,CAAEH,OAAQ,CACjBI,SAAS,CAAGC,CAAC,EAAK,CAChB,GAAIA,CAAC,CAACC,GAAG,GAAK,OAAO,CAAEN,OAAO,CAAC,CACjC,CAAE,CACFO,IAAI,CAAC,QAAQ,CACbC,QAAQ,CAAE,CAAE,CAAAC,QAAA,CAEXX,KAAK,EARDD,MASF,CAAC,cAENb,IAAA,QAAKe,SAAS,CAAEA,SAAU,CAAAU,QAAA,CAAeX,KAAK,EAAdD,MAAoB,CAC1D,CACF,CAEA,mBACEX,KAAA,QAAKa,SAAS,CAAEN,QAAQ,CAACiB,SAAU,CAAAD,QAAA,EAChCrB,KAAK,cAAGJ,IAAA,QAAKe,SAAS,CAAEN,QAAQ,CAACL,KAAM,CAAAqB,QAAA,CAAErB,KAAK,CAAM,CAAC,CAAG,IAAI,cAE7DJ,IAAA,QAAKe,SAAS,CAAEN,QAAQ,CAACH,OAAQ,CAAAmB,QAAA,CAC9Bb,WAAW,CACT,CAAC,EACH,CAET,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useTheme","optionValueName","defaultTheme","jsx","_jsx","jsxs","_jsxs","Switch","label","onChange","options","theme","value","composed","option","Error","optionNodes","iValue","iName","className","onPress","selected","push","onClick","onKeyDown","e","key","role","tabIndex","children","container"],"sources":["../../../../../../src/shared/components/selectors/Switch/index.tsx"],"sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport {\n  type OptionsT,\n  type ValueT,\n  optionValueName,\n} from '../common';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeT = Theme<'container' | 'label' | 'option' | 'options' | 'selected'>;\n\ntype PropsT = {\n  label?: ReactNode;\n  onChange?: (value: ValueT) => void;\n  options?: Readonly<OptionsT<ReactNode>>;\n  theme?: ThemeT;\n  value?: ValueT;\n};\n\nexport const Switch: FunctionComponent<PropsT> = ({\n  label,\n  onChange,\n  options,\n  theme,\n  value,\n}) => {\n  const composed = useTheme('Switch', defaultTheme, theme);\n\n  if (!options || !composed.option) throw Error('Internal error');\n\n  const optionNodes: React.ReactNode[] = [];\n  for (const option of options) {\n    const [iValue, iName] = optionValueName(option);\n\n    let className: string = composed.option;\n    let onPress: (() => void) | undefined;\n    if (iValue === value) className += ` ${composed.selected}`;\n    else if (onChange) {\n      onPress = () => {\n        onChange(iValue);\n      };\n    }\n\n    optionNodes.push(\n      onPress\n        ? (\n          <div\n            className={className}\n            key={iValue}\n            onClick={onPress}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') onPress();\n            }}\n            role=\"button\"\n            tabIndex={0}\n          >\n            {iName}\n          </div>\n        )\n        : <div className={className} key={iValue}>{iName}</div>,\n    );\n  }\n\n  return (\n    <div className={composed.container}>\n      {label ? <div className={composed.label}>{label}</div> : null}\n\n      <div className={composed.options}>\n        {optionNodes}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"yCAEA,OAAqBA,QAAQ,KAAQ,0BAA0B,QAK7DC,eAAe,0BAAAC,YAAA,mIAGuB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAYxC,MAAO,MAAM,CAAAC,MAAiC,CAAGA,CAAC,CAChDC,KAAK,CACLC,QAAQ,CACRC,OAAO,CACPC,KAAK,CACLC,KACF,CAAC,GAAK,CACJ,KAAM,CAAAC,QAAQ,CAAGb,QAAQ,CAAC,QAAQ,CAAEE,YAAY,CAAES,KAAK,CAAC,CAExD,GAAI,CAACD,OAAO,EAAI,CAACG,QAAQ,CAACC,MAAM,CAAE,KAAM,CAAAC,KAAK,CAAC,gBAAgB,CAAC,CAE/D,KAAM,CAAAC,WAA8B,CAAG,EAAE,CACzC,IAAK,KAAM,CAAAF,MAAM,GAAI,CAAAJ,OAAO,CAAE,CAC5B,KAAM,CAACO,MAAM,CAAEC,KAAK,CAAC,CAAGjB,eAAe,CAACa,MAAM,CAAC,CAE/C,GAAI,CAAAK,SAAiB,CAAGN,QAAQ,CAACC,MAAM,CACvC,GAAI,CAAAM,OAAiC,CACrC,GAAIH,MAAM,GAAKL,KAAK,CAAEO,SAAS,EAAI,IAAIN,QAAQ,CAACQ,QAAQ,EAAE,CAAC,IACtD,IAAIZ,QAAQ,CAAE,CACjBW,OAAO,CAAGA,CAAA,GAAM,CACdX,QAAQ,CAACQ,MAAM,CAAC,CAClB,CAAC,CACH,CAEAD,WAAW,CAACM,IAAI,CACdF,OAAO,cAEHhB,IAAA,QACEe,SAAS,CAAEA,SAAU,CAErBI,OAAO,CAAEH,OAAQ,CACjBI,SAAS,CAAGC,CAAC,EAAK,CAChB,GAAIA,CAAC,CAACC,GAAG,GAAK,OAAO,CAAEN,OAAO,CAAC,CAAC,CAClC,CAAE,CACFO,IAAI,CAAC,QAAQ,CACbC,QAAQ,CAAE,CAAE,CAAAC,QAAA,CAEXX,KAAK,EARDD,MASF,CAAC,cAENb,IAAA,QAAKe,SAAS,CAAEA,SAAU,CAAAU,QAAA,CAAeX,KAAK,EAAdD,MAAoB,CAC1D,CAAC,CACH,CAEA,mBACEX,KAAA,QAAKa,SAAS,CAAEN,QAAQ,CAACiB,SAAU,CAAAD,QAAA,EAChCrB,KAAK,cAAGJ,IAAA,QAAKe,SAAS,CAAEN,QAAQ,CAACL,KAAM,CAAAqB,QAAA,CAAErB,KAAK,CAAM,CAAC,CAAG,IAAI,cAE7DJ,IAAA,QAAKe,SAAS,CAAEN,QAAQ,CAACH,OAAQ,CAAAmB,QAAA,CAC9Bb,WAAW,CACT,CAAC,EACH,CAAC,CAEV,CAAC","ignoreList":[]}

package/build/production/shared/components/selectors/common.js

@@ -1,3 +1,3 @@
 // The stuff common between different dropdown implementations.
-function isValue(x){const type=typeof x;return type==="number"||type==="string"}/** Returns option value and name as a tuple. */export function optionValueName(option){return isValue(option)?[option,option]:[option.value,option.name??option.value]}
+function isValue(x){const type=typeof x;return type==="number"||type==="string";}/** Returns option value and name as a tuple. */export function optionValueName(option){return isValue(option)?[option,option]:[option.value,option.name??option.value];}
 //# sourceMappingURL=common.js.map

package/build/production/shared/components/selectors/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","names":["isValue","x","type","optionValueName","option","value","name"],"sources":["../../../../../src/shared/components/selectors/common.ts"],"sourcesContent":["// The stuff common between different dropdown implementations.\n\nimport type { Theme } from '@dr.pogodin/react-themes';\n\nexport type ThemeT = Theme<\n  | 'active'\n  | 'arrow'\n  | 'container'\n  | 'dropdown'\n  | 'hiddenOption'\n  | 'label'\n  | 'option'\n  | 'select'\n\n  // TODO: This is currently only valid for (native) <Dropdown>,\n  // other kinds of selectors should be evaluated, and aligned with this\n  // feature, if appropriate.\n  | 'invalid'\n\n  // TODO: This is only valid for <CustomDropdown>, thus we need to re-factor it\n  // into a separate theme spec for that component.\n  | 'upward'\n>;\n\nexport type ValueT = number | string;\n\nexport type OptionT<NameT> = {\n  name?: NameT | null;\n  value: ValueT;\n};\n\nexport type OptionsT<NameT> = Readonly<Array<OptionT<NameT> | ValueT>>;\n\nexport type PropsT<\n  NameT,\n  OnChangeT = React.ChangeEventHandler<HTMLSelectElement>,\n> = {\n  filter?: (item: OptionT<NameT> | ValueT) => boolean;\n  label?: React.ReactNode;\n  onChange?: OnChangeT;\n  options: Readonly<OptionsT<NameT>>;\n  testId?: string;\n  theme?: ThemeT;\n  value?: ValueT;\n};\n\nfunction isValue<T>(x: OptionT<T> | ValueT): x is ValueT {\n  const type = typeof x;\n  return type === 'number' || type === 'string';\n}\n\n/** Returns option value and name as a tuple. */\nexport function optionValueName<NameT>(\n  option: OptionT<NameT> | ValueT,\n): [ValueT, NameT | ValueT] {\n  return isValue(option)\n    ? [option, option]\n    : [option.value, option.name ?? option.value];\n}\n"],"mappings":"AAAA;AA8CA,QAAS,CAAAA,OAAOA,CAAIC,CAAsB,CAAe,CACvD,KAAM,CAAAC,IAAI,CAAG,MAAO,CAAAD,CAAC,CACrB,MAAO,CAAAC,IAAI,GAAK,QAAQ,EAAIA,IAAI,GAAK,QACvC,CAEA,gDACA,MAAO,SAAS,CAAAC,eAAeA,CAC7BC,MAA+B,CACL,CAC1B,MAAO,CAAAJ,OAAO,CAACI,MAAM,CAAC,CAClB,CAACA,MAAM,CAAEA,MAAM,CAAC,CAChB,CAACA,MAAM,CAACC,KAAK,CAAED,MAAM,CAACE,IAAI,EAAIF,MAAM,CAACC,KAAK,CAChD","ignoreList":[]}
+{"version":3,"file":"common.js","names":["isValue","x","type","optionValueName","option","value","name"],"sources":["../../../../../src/shared/components/selectors/common.ts"],"sourcesContent":["// The stuff common between different dropdown implementations.\n\nimport type { Theme } from '@dr.pogodin/react-themes';\n\nexport type ThemeT = Theme<\n  | 'active'\n  | 'arrow'\n  | 'container'\n  | 'dropdown'\n  | 'hiddenOption'\n  | 'label'\n  | 'option'\n  | 'select'\n\n  // TODO: This is currently only valid for (native) <Dropdown>,\n  // other kinds of selectors should be evaluated, and aligned with this\n  // feature, if appropriate.\n  | 'invalid'\n\n  // TODO: This is only valid for <CustomDropdown>, thus we need to re-factor it\n  // into a separate theme spec for that component.\n  | 'upward'\n>;\n\nexport type ValueT = number | string;\n\nexport type OptionT<NameT> = {\n  name?: NameT | null;\n  value: ValueT;\n};\n\nexport type OptionsT<NameT> = Readonly<Array<OptionT<NameT> | ValueT>>;\n\nexport type PropsT<\n  NameT,\n  OnChangeT = React.ChangeEventHandler<HTMLSelectElement>,\n> = {\n  filter?: (item: OptionT<NameT> | ValueT) => boolean;\n  label?: React.ReactNode;\n  onChange?: OnChangeT;\n  options: Readonly<OptionsT<NameT>>;\n  testId?: string;\n  theme?: ThemeT;\n  value?: ValueT;\n};\n\nfunction isValue<T>(x: OptionT<T> | ValueT): x is ValueT {\n  const type = typeof x;\n  return type === 'number' || type === 'string';\n}\n\n/** Returns option value and name as a tuple. */\nexport function optionValueName<NameT>(\n  option: OptionT<NameT> | ValueT,\n): [ValueT, NameT | ValueT] {\n  return isValue(option)\n    ? [option, option]\n    : [option.value, option.name ?? option.value];\n}\n"],"mappings":"AAAA;AA8CA,QAAS,CAAAA,OAAOA,CAAIC,CAAsB,CAAe,CACvD,KAAM,CAAAC,IAAI,CAAG,MAAO,CAAAD,CAAC,CACrB,MAAO,CAAAC,IAAI,GAAK,QAAQ,EAAIA,IAAI,GAAK,QAAQ,CAC/C,CAEA,gDACA,MAAO,SAAS,CAAAC,eAAeA,CAC7BC,MAA+B,CACL,CAC1B,MAAO,CAAAJ,OAAO,CAACI,MAAM,CAAC,CAClB,CAACA,MAAM,CAAEA,MAAM,CAAC,CAChB,CAACA,MAAM,CAACC,KAAK,CAAED,MAAM,CAACE,IAAI,EAAIF,MAAM,CAACC,KAAK,CAAC,CACjD","ignoreList":[]}

package/build/production/shared/utils/config.js

@@ -7,5 +7,5 @@
 // like React Native, IS_CLIENT_SIDE is "true", however "document" and a bunch
 // of other browser-world features are not available.
 if(IS_CLIENT_SIDE&&typeof document!=="undefined"){// eslint-disable-next-line no-param-reassign
-cfg.CSRF=parse(document.cookie).csrfToken}return cfg}export function getConfig(sync){if(!config){if(IS_CLIENT_SIDE){const inj=clientGetInj();config=inj instanceof Promise?inj.then(injection=>{const res=injectCsrfToken(injection.CONFIG??{});config=res;return res}):injectCsrfToken(inj.CONFIG??{})}else{const weak=requireWeak("config");if(!weak)throw Error("Internal error");config=weak}}if(sync&&config instanceof Promise){throw Error("The config is not available yet")}return config}
+cfg.CSRF=parse(document.cookie).csrfToken;}return cfg;}export function getConfig(sync){if(!config){if(IS_CLIENT_SIDE){const inj=clientGetInj();config=inj instanceof Promise?inj.then(injection=>{const res=injectCsrfToken(injection.CONFIG??{});config=res;return res;}):injectCsrfToken(inj.CONFIG??{});}else{const weak=requireWeak("config");if(!weak)throw Error("Internal error");config=weak;}}if(sync&&config instanceof Promise){throw Error("The config is not available yet");}return config;}
 //# sourceMappingURL=config.js.map

package/build/production/shared/utils/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","names":["parse","clientGetInj","IS_CLIENT_SIDE","requireWeak","config","injectCsrfToken","cfg","document","CSRF","cookie","csrfToken","getConfig","sync","inj","Promise","then","injection","res","CONFIG","weak","Error"],"sources":["../../../../src/shared/utils/config.ts"],"sourcesContent":["/* global document */\n\nimport { parse } from 'cookie';\n\nimport clientGetInj from '../../client/getInj';\n\nimport { IS_CLIENT_SIDE } from './isomorphy/environment-check';\nimport { requireWeak } from './webpack';\n\ntype ConfigT = Record<string, unknown>;\n\nlet config: ConfigT | Promise<ConfigT> | undefined;\n\n/**\n * Injects CSRF token into config (on client-side only).\n *\n * BEWARE: It mutates the argument, and also returns it as the result,\n * for chaining.\n */\nfunction injectCsrfToken(cfg: ConfigT): ConfigT {\n  // The safeguard for \"document\" is necessary because in non-Node environments,\n  // like React Native, IS_CLIENT_SIDE is \"true\", however \"document\" and a bunch\n  // of other browser-world features are not available.\n  if (IS_CLIENT_SIDE && typeof document !== 'undefined') {\n    // eslint-disable-next-line no-param-reassign\n    cfg.CSRF = parse(document.cookie).csrfToken;\n  }\n\n  return cfg;\n}\n\nexport function getConfig<T extends ConfigT>(sync: true): T;\n\nexport function getConfig<T extends ConfigT>(sync?: boolean): Promise<T> | T;\n\nexport function getConfig<T extends ConfigT>(sync?: boolean): Promise<T> | T {\n  if (!config) {\n    if (IS_CLIENT_SIDE) {\n      const inj = clientGetInj();\n      config = inj instanceof Promise\n        ? inj.then((injection) => {\n          const res = injectCsrfToken(injection.CONFIG ?? {});\n          config = res;\n          return res;\n        })\n        : injectCsrfToken(inj.CONFIG ?? {});\n    } else {\n      const weak = requireWeak<ConfigT>('config');\n      if (!weak) throw Error('Internal error');\n      config = weak;\n    }\n  }\n\n  if (sync && (config instanceof Promise)) {\n    throw Error('The config is not available yet');\n  }\n\n  return config as T;\n}\n"],"mappings":"AAAA,qBAEA,OAASA,KAAK,KAAQ,QAAQ,OAEvB,CAAAC,YAAY,qCAEVC,cAAc,+CACdC,WAAW,oBAIpB,GAAI,CAAAC,MAA8C,CAElD;AACA;AACA;AACA;AACA;AACA,GACA,QAAS,CAAAC,eAAeA,CAACC,GAAY,CAAW,CAC9C;AACA;AACA;AACA,GAAIJ,cAAc,EAAI,MAAO,CAAAK,QAAQ,GAAK,WAAW,CAAE,CACrD;AACAD,GAAG,CAACE,IAAI,CAAGR,KAAK,CAACO,QAAQ,CAACE,MAAM,CAAC,CAACC,SACpC,CAEA,MAAO,CAAAJ,GACT,CAMA,MAAO,SAAS,CAAAK,SAASA,CAAoBC,IAAc,CAAkB,CAC3E,GAAI,CAACR,MAAM,CAAE,CACX,GAAIF,cAAc,CAAE,CAClB,KAAM,CAAAW,GAAG,CAAGZ,YAAY,CAAC,CAAC,CAC1BG,MAAM,CAAGS,GAAG,WAAY,CAAAC,OAAO,CAC3BD,GAAG,CAACE,IAAI,CAAEC,SAAS,EAAK,CACxB,KAAM,CAAAC,GAAG,CAAGZ,eAAe,CAACW,SAAS,CAACE,MAAM,EAAI,CAAC,CAAC,CAAC,CACnDd,MAAM,CAAGa,GAAG,CACZ,MAAO,CAAAA,GACT,CAAC,CAAC,CACAZ,eAAe,CAACQ,GAAG,CAACK,MAAM,EAAI,CAAC,CAAC,CACtC,CAAC,IAAM,CACL,KAAM,CAAAC,IAAI,CAAGhB,WAAW,CAAU,QAAQ,CAAC,CAC3C,GAAI,CAACgB,IAAI,CAAE,KAAM,CAAAC,KAAK,CAAC,gBAAgB,CAAC,CACxChB,MAAM,CAAGe,IACX,CACF,CAEA,GAAIP,IAAI,EAAKR,MAAM,WAAY,CAAAU,OAAQ,CAAE,CACvC,KAAM,CAAAM,KAAK,CAAC,iCAAiC,CAC/C,CAEA,MAAO,CAAAhB,MACT","ignoreList":[]}
+{"version":3,"file":"config.js","names":["parse","clientGetInj","IS_CLIENT_SIDE","requireWeak","config","injectCsrfToken","cfg","document","CSRF","cookie","csrfToken","getConfig","sync","inj","Promise","then","injection","res","CONFIG","weak","Error"],"sources":["../../../../src/shared/utils/config.ts"],"sourcesContent":["/* global document */\n\nimport { parse } from 'cookie';\n\nimport clientGetInj from '../../client/getInj';\n\nimport { IS_CLIENT_SIDE } from './isomorphy/environment-check';\nimport { requireWeak } from './webpack';\n\ntype ConfigT = Record<string, unknown>;\n\nlet config: ConfigT | Promise<ConfigT> | undefined;\n\n/**\n * Injects CSRF token into config (on client-side only).\n *\n * BEWARE: It mutates the argument, and also returns it as the result,\n * for chaining.\n */\nfunction injectCsrfToken(cfg: ConfigT): ConfigT {\n  // The safeguard for \"document\" is necessary because in non-Node environments,\n  // like React Native, IS_CLIENT_SIDE is \"true\", however \"document\" and a bunch\n  // of other browser-world features are not available.\n  if (IS_CLIENT_SIDE && typeof document !== 'undefined') {\n    // eslint-disable-next-line no-param-reassign\n    cfg.CSRF = parse(document.cookie).csrfToken;\n  }\n\n  return cfg;\n}\n\nexport function getConfig<T extends ConfigT>(sync: true): T;\n\nexport function getConfig<T extends ConfigT>(sync?: boolean): Promise<T> | T;\n\nexport function getConfig<T extends ConfigT>(sync?: boolean): Promise<T> | T {\n  if (!config) {\n    if (IS_CLIENT_SIDE) {\n      const inj = clientGetInj();\n      config = inj instanceof Promise\n        ? inj.then((injection) => {\n          const res = injectCsrfToken(injection.CONFIG ?? {});\n          config = res;\n          return res;\n        })\n        : injectCsrfToken(inj.CONFIG ?? {});\n    } else {\n      const weak = requireWeak<ConfigT>('config');\n      if (!weak) throw Error('Internal error');\n      config = weak;\n    }\n  }\n\n  if (sync && (config instanceof Promise)) {\n    throw Error('The config is not available yet');\n  }\n\n  return config as T;\n}\n"],"mappings":"AAAA,qBAEA,OAASA,KAAK,KAAQ,QAAQ,OAEvB,CAAAC,YAAY,qCAEVC,cAAc,+CACdC,WAAW,oBAIpB,GAAI,CAAAC,MAA8C,CAElD;AACA;AACA;AACA;AACA;AACA,GACA,QAAS,CAAAC,eAAeA,CAACC,GAAY,CAAW,CAC9C;AACA;AACA;AACA,GAAIJ,cAAc,EAAI,MAAO,CAAAK,QAAQ,GAAK,WAAW,CAAE,CACrD;AACAD,GAAG,CAACE,IAAI,CAAGR,KAAK,CAACO,QAAQ,CAACE,MAAM,CAAC,CAACC,SAAS,CAC7C,CAEA,MAAO,CAAAJ,GAAG,CACZ,CAMA,MAAO,SAAS,CAAAK,SAASA,CAAoBC,IAAc,CAAkB,CAC3E,GAAI,CAACR,MAAM,CAAE,CACX,GAAIF,cAAc,CAAE,CAClB,KAAM,CAAAW,GAAG,CAAGZ,YAAY,CAAC,CAAC,CAC1BG,MAAM,CAAGS,GAAG,WAAY,CAAAC,OAAO,CAC3BD,GAAG,CAACE,IAAI,CAAEC,SAAS,EAAK,CACxB,KAAM,CAAAC,GAAG,CAAGZ,eAAe,CAACW,SAAS,CAACE,MAAM,EAAI,CAAC,CAAC,CAAC,CACnDd,MAAM,CAAGa,GAAG,CACZ,MAAO,CAAAA,GAAG,CACZ,CAAC,CAAC,CACAZ,eAAe,CAACQ,GAAG,CAACK,MAAM,EAAI,CAAC,CAAC,CAAC,CACvC,CAAC,IAAM,CACL,KAAM,CAAAC,IAAI,CAAGhB,WAAW,CAAU,QAAQ,CAAC,CAC3C,GAAI,CAACgB,IAAI,CAAE,KAAM,CAAAC,KAAK,CAAC,gBAAgB,CAAC,CACxChB,MAAM,CAAGe,IAAI,CACf,CACF,CAEA,GAAIP,IAAI,EAAKR,MAAM,WAAY,CAAAU,OAAQ,CAAE,CACvC,KAAM,CAAAM,KAAK,CAAC,iCAAiC,CAAC,CAChD,CAEA,MAAO,CAAAhB,MAAM,CACf","ignoreList":[]}

package/build/production/shared/utils/isomorphy/buildInfo.js

@@ -16,8 +16,8 @@ if(typeof BUILD_INFO!=="undefined")buildInfo=BUILD_INFO;/**
  * set already, unless `force` flag is explicitly set.
  * @param info
  * @param force
- */export function setBuildInfo(info,force=false){if(buildInfo!==undefined&&!force){throw Error("\"Build Info\" is already initialized")}buildInfo=info}/**
+ */export function setBuildInfo(info,force=false){if(buildInfo!==undefined&&!force){throw Error("\"Build Info\" is already initialized");}buildInfo=info;}/**
  * Returns "Build Info" object; throws if it has not been initialized yet.
  * @returns
- */export function getBuildInfo(){if(buildInfo===undefined){throw Error("\"Build Info\" has not been initialized yet")}return buildInfo}
+ */export function getBuildInfo(){if(buildInfo===undefined){throw Error("\"Build Info\" has not been initialized yet");}return buildInfo;}
 //# sourceMappingURL=buildInfo.js.map

package/build/production/shared/utils/isomorphy/buildInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"buildInfo.js","names":["buildInfo","BUILD_INFO","setBuildInfo","info","force","undefined","Error","getBuildInfo"],"sources":["../../../../../src/shared/utils/isomorphy/buildInfo.ts"],"sourcesContent":["// Encapsulates access to \"Build Info\" data.\n\n// BEWARE: This should match the type of build info object generated by\n// Webpack build (see \"/config/webpack/app-base.js\"), and currently this\n// match is not checked automatically.\nexport type BuildInfoT = {\n  key: string;\n  publicPath: string;\n  timestamp: string;\n  useServiceWorker: boolean;\n};\n\n// Depending on the build mode & environment, BUILD_INFO is either a global\n// variable defined at the app launch, or it is replaced by the actual value\n// by the Webpack build.\ndeclare const BUILD_INFO: BuildInfoT | undefined;\n\nlet buildInfo: BuildInfoT | undefined;\n\n// On the client side \"BUILD_INFO\" should be injected by Webpack. Note, however,\n// that in test environment we may need situations were environment is mocked as\n// client-side, although no proper Webpack compilation is executed, thus no info\n// injected; because of this we don't do a hard environment check here.\nif (typeof BUILD_INFO !== 'undefined') buildInfo = BUILD_INFO;\n\n/**\n * In scenarious where \"BUILD_INFO\" is not injected by Webpack (server-side,\n * tests, etc.) we expect the host codebase to explicitly set it before it is\n * ever requested. As a precaution, this function throws if build info has been\n * set already, unless `force` flag is explicitly set.\n * @param info\n * @param force\n */\nexport function setBuildInfo(info?: BuildInfoT, force = false): void {\n  if (buildInfo !== undefined && !force) {\n    throw Error('\"Build Info\" is already initialized');\n  }\n  buildInfo = info;\n}\n\n/**\n * Returns \"Build Info\" object; throws if it has not been initialized yet.\n * @returns\n */\nexport function getBuildInfo(): BuildInfoT {\n  if (buildInfo === undefined) {\n    throw Error('\"Build Info\" has not been initialized yet');\n  }\n  return buildInfo;\n}\n"],"mappings":"AAAA;AAEA;AACA;AACA;AAQA;AACA;AACA;AAGA,GAAI,CAAAA,SAAiC,CAErC;AACA;AACA;AACA;AACA,GAAI,MAAO,CAAAC,UAAU,GAAK,WAAW,CAAED,SAAS,CAAGC,UAAU,CAE7D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAC,YAAYA,CAACC,IAAiB,CAAEC,KAAK,CAAG,KAAK,CAAQ,CACnE,GAAIJ,SAAS,GAAKK,SAAS,EAAI,CAACD,KAAK,CAAE,CACrC,KAAM,CAAAE,KAAK,CAAC,uCAAqC,CACnD,CACAN,SAAS,CAAGG,IACd,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAI,YAAYA,CAAA,CAAe,CACzC,GAAIP,SAAS,GAAKK,SAAS,CAAE,CAC3B,KAAM,CAAAC,KAAK,CAAC,6CAA2C,CACzD,CACA,MAAO,CAAAN,SACT","ignoreList":[]}
+{"version":3,"file":"buildInfo.js","names":["buildInfo","BUILD_INFO","setBuildInfo","info","force","undefined","Error","getBuildInfo"],"sources":["../../../../../src/shared/utils/isomorphy/buildInfo.ts"],"sourcesContent":["// Encapsulates access to \"Build Info\" data.\n\n// BEWARE: This should match the type of build info object generated by\n// Webpack build (see \"/config/webpack/app-base.js\"), and currently this\n// match is not checked automatically.\nexport type BuildInfoT = {\n  key: string;\n  publicPath: string;\n  timestamp: string;\n  useServiceWorker: boolean;\n};\n\n// Depending on the build mode & environment, BUILD_INFO is either a global\n// variable defined at the app launch, or it is replaced by the actual value\n// by the Webpack build.\ndeclare const BUILD_INFO: BuildInfoT | undefined;\n\nlet buildInfo: BuildInfoT | undefined;\n\n// On the client side \"BUILD_INFO\" should be injected by Webpack. Note, however,\n// that in test environment we may need situations were environment is mocked as\n// client-side, although no proper Webpack compilation is executed, thus no info\n// injected; because of this we don't do a hard environment check here.\nif (typeof BUILD_INFO !== 'undefined') buildInfo = BUILD_INFO;\n\n/**\n * In scenarious where \"BUILD_INFO\" is not injected by Webpack (server-side,\n * tests, etc.) we expect the host codebase to explicitly set it before it is\n * ever requested. As a precaution, this function throws if build info has been\n * set already, unless `force` flag is explicitly set.\n * @param info\n * @param force\n */\nexport function setBuildInfo(info?: BuildInfoT, force = false): void {\n  if (buildInfo !== undefined && !force) {\n    throw Error('\"Build Info\" is already initialized');\n  }\n  buildInfo = info;\n}\n\n/**\n * Returns \"Build Info\" object; throws if it has not been initialized yet.\n * @returns\n */\nexport function getBuildInfo(): BuildInfoT {\n  if (buildInfo === undefined) {\n    throw Error('\"Build Info\" has not been initialized yet');\n  }\n  return buildInfo;\n}\n"],"mappings":"AAAA;AAEA;AACA;AACA;AAQA;AACA;AACA;AAGA,GAAI,CAAAA,SAAiC,CAErC;AACA;AACA;AACA;AACA,GAAI,MAAO,CAAAC,UAAU,GAAK,WAAW,CAAED,SAAS,CAAGC,UAAU,CAE7D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAC,YAAYA,CAACC,IAAiB,CAAEC,KAAK,CAAG,KAAK,CAAQ,CACnE,GAAIJ,SAAS,GAAKK,SAAS,EAAI,CAACD,KAAK,CAAE,CACrC,KAAM,CAAAE,KAAK,CAAC,uCAAqC,CAAC,CACpD,CACAN,SAAS,CAAGG,IAAI,CAClB,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAI,YAAYA,CAAA,CAAe,CACzC,GAAIP,SAAS,GAAKK,SAAS,CAAE,CAC3B,KAAM,CAAAC,KAAK,CAAC,6CAA2C,CAAC,CAC1D,CACA,MAAO,CAAAN,SAAS,CAClB","ignoreList":[]}

package/build/production/shared/utils/isomorphy/index.js

@@ -1,14 +1,14 @@
 import{getBuildInfo}from"./buildInfo.js";import{IS_CLIENT_SIDE,IS_SERVER_SIDE}from"./environment-check.js";/**
  * @ignore
  * @return {string} Code mode: "development" or "production".
- */function getMode(){return process.env.NODE_ENV}/**
+ */function getMode(){return process.env.NODE_ENV;}/**
  * Returns `true` if development version of the code is running;
  * `false` otherwise.
- */export function isDevBuild(){return getMode()==="development"}/**
+ */export function isDevBuild(){return getMode()==="development";}/**
  * Returns `true` if production build of the code is running;
  * `false` otherwise.
- */export function isProdBuild(){return getMode()==="production"}/**
+ */export function isProdBuild(){return getMode()==="production";}/**
  * Returns build timestamp of the front-end JS bundle.
  * @return ISO date/time string.
- */export function buildTimestamp(){return getBuildInfo().timestamp}export{IS_CLIENT_SIDE,IS_SERVER_SIDE,getBuildInfo};
+ */export function buildTimestamp(){return getBuildInfo().timestamp;}export{IS_CLIENT_SIDE,IS_SERVER_SIDE,getBuildInfo};
 //# sourceMappingURL=index.js.map

package/build/production/shared/utils/isomorphy/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getBuildInfo","IS_CLIENT_SIDE","IS_SERVER_SIDE","getMode","process","env","NODE_ENV","isDevBuild","isProdBuild","buildTimestamp","timestamp"],"sources":["../../../../../src/shared/utils/isomorphy/index.ts"],"sourcesContent":["import { getBuildInfo } from './buildInfo';\nimport { IS_CLIENT_SIDE, IS_SERVER_SIDE } from './environment-check';\n\n/**\n * @ignore\n * @return {string} Code mode: \"development\" or \"production\".\n */\nfunction getMode() {\n  return process.env.NODE_ENV;\n}\n\n/**\n * Returns `true` if development version of the code is running;\n * `false` otherwise.\n */\nexport function isDevBuild(): boolean {\n  return getMode() === 'development';\n}\n\n/**\n * Returns `true` if production build of the code is running;\n * `false` otherwise.\n */\nexport function isProdBuild(): boolean {\n  return getMode() === 'production';\n}\n\n/**\n * Returns build timestamp of the front-end JS bundle.\n * @return ISO date/time string.\n */\nexport function buildTimestamp(): string {\n  return getBuildInfo().timestamp;\n}\n\nexport { IS_CLIENT_SIDE, IS_SERVER_SIDE, getBuildInfo };\n"],"mappings":"OAASA,YAAY,6BACZC,cAAc,CAAEC,cAAc,8BAEvC;AACA;AACA;AACA,GACA,QAAS,CAAAC,OAAOA,CAAA,CAAG,CACjB,MAAO,CAAAC,OAAO,CAACC,GAAG,CAACC,QACrB,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAC,UAAUA,CAAA,CAAY,CACpC,MAAO,CAAAJ,OAAO,CAAC,CAAC,GAAK,aACvB,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAK,WAAWA,CAAA,CAAY,CACrC,MAAO,CAAAL,OAAO,CAAC,CAAC,GAAK,YACvB,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAM,cAAcA,CAAA,CAAW,CACvC,MAAO,CAAAT,YAAY,CAAC,CAAC,CAACU,SACxB,CAEA,OAAST,cAAc,CAAEC,cAAc,CAAEF,YAAY","ignoreList":[]}
+{"version":3,"file":"index.js","names":["getBuildInfo","IS_CLIENT_SIDE","IS_SERVER_SIDE","getMode","process","env","NODE_ENV","isDevBuild","isProdBuild","buildTimestamp","timestamp"],"sources":["../../../../../src/shared/utils/isomorphy/index.ts"],"sourcesContent":["import { getBuildInfo } from './buildInfo';\nimport { IS_CLIENT_SIDE, IS_SERVER_SIDE } from './environment-check';\n\n/**\n * @ignore\n * @return {string} Code mode: \"development\" or \"production\".\n */\nfunction getMode() {\n  return process.env.NODE_ENV;\n}\n\n/**\n * Returns `true` if development version of the code is running;\n * `false` otherwise.\n */\nexport function isDevBuild(): boolean {\n  return getMode() === 'development';\n}\n\n/**\n * Returns `true` if production build of the code is running;\n * `false` otherwise.\n */\nexport function isProdBuild(): boolean {\n  return getMode() === 'production';\n}\n\n/**\n * Returns build timestamp of the front-end JS bundle.\n * @return ISO date/time string.\n */\nexport function buildTimestamp(): string {\n  return getBuildInfo().timestamp;\n}\n\nexport { IS_CLIENT_SIDE, IS_SERVER_SIDE, getBuildInfo };\n"],"mappings":"OAASA,YAAY,6BACZC,cAAc,CAAEC,cAAc,8BAEvC;AACA;AACA;AACA,GACA,QAAS,CAAAC,OAAOA,CAAA,CAAG,CACjB,MAAO,CAAAC,OAAO,CAACC,GAAG,CAACC,QAAQ,CAC7B,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAC,UAAUA,CAAA,CAAY,CACpC,MAAO,CAAAJ,OAAO,CAAC,CAAC,GAAK,aAAa,CACpC,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAK,WAAWA,CAAA,CAAY,CACrC,MAAO,CAAAL,OAAO,CAAC,CAAC,GAAK,YAAY,CACnC,CAEA;AACA;AACA;AACA,GACA,MAAO,SAAS,CAAAM,cAAcA,CAAA,CAAW,CACvC,MAAO,CAAAT,YAAY,CAAC,CAAC,CAACU,SAAS,CACjC,CAEA,OAAST,cAAc,CAAEC,cAAc,CAAEF,YAAY","ignoreList":[]}

package/build/production/shared/utils/jest/E2eSsrEnv.js

@@ -1,4 +1,4 @@
-import"core-js/modules/es.iterator.for-each.js";import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.for-each.js";/**
+import"core-js/modules/es.iterator.for-each.js";import"core-js/modules/es.iterator.constructor.js";import"core-js/modules/es.iterator.for-each.js";import"core-js/modules/es.json.parse.js";/**
  * Jest environment for end-to-end SSR and client-side testing. It relies on
  * the standard react-utils mechanics to execute SSR of given scene, and also
  * Webpack build of the code for client-side execution, it further exposes
@@ -12,43 +12,43 @@ import"core-js/modules/es.iterator.for-each.js";import"core-js/modules/es.iterat
 //      probably some sort of a require-loop, or some issues with weak
 //      require in that scenario.
 // TODO: We need to add correct typing for environment options.
-import path from"node:path";import{defaults,set}from"lodash-es";// As this environment is a part of the Jest testing utils,
+// As this environment is a part of the Jest testing utils,
 // we assume development dependencies are available when it is used.
-/* eslint-disable import/no-extraneous-dependencies */import register from"@babel/register/experimental-worker";import JsdomEnv from"jest-environment-jsdom";import{Volume,createFsFromVolume}from"memfs";import webpack from"webpack";/* eslint-enable import/no-extraneous-dependencies */function noop(){// NOOP
+/* eslint-disable import/no-extraneous-dependencies */import path from"node:path";import JsdomEnv from"jest-environment-jsdom";import{defaults,set}from"lodash-es";import{Volume,createFsFromVolume}from"memfs";import webpack from"webpack";import register from"@babel/register/experimental-worker";function noop(){// NOOP
 }export default class E2eSsrEnv extends JsdomEnv{/**
    * Loads Webpack config, and exposes it to the environment via global
    * webpackConfig object.
-   */async loadWebpackConfig(){const optionsString=this.pragmas["webpack-config-options"];const options=optionsString?JSON.parse(optionsString):{};defaults(options,{context:this.testFolder,fs:this.global.webpackOutputFs});const factoryPath=this.pragmas["webpack-config-factory"];let factory=await import(/* webpackChunkName: "not-a-valid-chunk" */path.resolve(this.rootDir,factoryPath));factory="default"in factory?factory.default:factory;this.global.webpackConfig=factory(options);const fs=this.global.webpackOutputFs;let buildInfo=`${options.context}/.build-info`;if(fs.existsSync(buildInfo)){buildInfo=fs.readFileSync(buildInfo,"utf8");this.global.buildInfo=JSON.parse(buildInfo)}}/**
+   */async loadWebpackConfig(){const optionsString=this.pragmas["webpack-config-options"];const options=optionsString?JSON.parse(optionsString):{};defaults(options,{context:this.testFolder,fs:this.global.webpackOutputFs});const factoryPath=this.pragmas["webpack-config-factory"];let factory=await import(/* webpackChunkName: "not-a-valid-chunk" */path.resolve(this.rootDir,factoryPath));factory="default"in factory?factory.default:factory;this.global.webpackConfig=factory(options);const fs=this.global.webpackOutputFs;let buildInfo=`${options.context}/.build-info`;if(fs.existsSync(buildInfo)){buildInfo=fs.readFileSync(buildInfo,"utf8");this.global.buildInfo=JSON.parse(buildInfo);}}/**
    * Executes Webpack build.
    * @return {Promise}
    */async runWebpack(){await this.loadWebpackConfig();if(!this.global.webpackConfig)throw Error("Failed to load Webpack config");const compiler=webpack(this.global.webpackConfig);// TODO: The "as typeof compiler.outputFileSystem" piece below is
 // a workaround for the Webpack regression:
 // https://github.com/webpack/webpack/issues/18242
 compiler.outputFileSystem=this.global.webpackOutputFs;return new Promise((done,fail)=>{compiler.run((err,stats)=>{if(err)fail(err);if(stats?.hasErrors()){// eslint-disable-next-line no-console
-console.error(stats.toJson().errors);fail(Error("Webpack compilation failed"))}this.global.webpackStats=stats?.toJson();// Keeps reference to the raw Webpack stats object, which should be
+console.error(stats.toJson().errors);fail(Error("Webpack compilation failed"));}this.global.webpackStats=stats?.toJson();// Keeps reference to the raw Webpack stats object, which should be
 // explicitly passed to the server-side renderer alongside the request,
 // so that it can to pick up asset paths for different named chunks.
-this.webpackStats=stats;done()})})}async runSsr(){const optionsString=this.pragmas["ssr-options"];const options=optionsString?JSON.parse(optionsString):{};// TODO: This is temporary to shortcut the logging added to SSR.
-options.logger??={debug:noop,info:noop,log:noop,warn:noop};options.buildInfo??=this.global.buildInfo;let cleanup;if(options.entry){const p=path.resolve(this.testFolder,options.entry);const module=await import(/* webpackChunkName: "not-a-valid-chunk" */p);if("cleanup"in module)cleanup=module.cleanup;const exportName=options.entryExportName||"default";if(exportName in module){options.Application=module[exportName]}}const{default:ssrFactory}=await import(/* webpackChunkName: "not-a-valid-chunk" */"../../../server/renderer");const renderer=ssrFactory(this.global.webpackConfig,options);let status=200;// OK
+this.webpackStats=stats;done();});});}async runSsr(){const optionsString=this.pragmas["ssr-options"];const options=optionsString?JSON.parse(optionsString):{};// TODO: This is temporary to shortcut the logging added to SSR.
+options.logger??={debug:noop,info:noop,log:noop,warn:noop};options.buildInfo??=this.global.buildInfo;let cleanup;if(options.entry){const p=path.resolve(this.testFolder,options.entry);const module=await import(/* webpackChunkName: "not-a-valid-chunk" */p);if("cleanup"in module)cleanup=module.cleanup;const exportName=options.entryExportName||"default";if(exportName in module){options.Application=module[exportName];}}const{default:ssrFactory}=await import(/* webpackChunkName: "not-a-valid-chunk" */"../../../server/renderer");const renderer=ssrFactory(this.global.webpackConfig,options);let status=200;// OK
 const markup=await new Promise((done,fail)=>{void renderer(this.ssrRequest,// TODO: This will do for now, with the current implementation of
 // the renderer, but it will require a rework once the renderer is
 // updated to do streaming.
-{cookie:noop,send:done,set:noop,status:value=>{status=value},// This is how up-to-date Webpack stats are passed to the server in
+{cookie:noop,send:done,set:noop,status:value=>{status=value;},// This is how up-to-date Webpack stats are passed to the server in
 // development mode, and we use this here always, instead of having
 // to pass some information via filesystem.
 locals:{webpack:{devMiddleware:{stats:this.webpackStats}}}},error=>{// TODO: Strictly speaking, that error as Error casting is not all
 // correct, but it works, so no need to spend time on it right now.
-if(error)fail(error);else done("")})});this.global.ssrMarkup=markup;this.global.ssrOptions=options;this.global.ssrStatus=status;if(cleanup)cleanup()}constructor(config,context){const pragmas=context.docblockPragmas;const requestString=pragmas["ssr-request"];const request=requestString?JSON.parse(requestString):{};request.url??="/";request.csrfToken=noop;// This ensures the initial JsDom URL matches the value we use for SSR.
+if(error)fail(error);else done("");});});this.global.ssrMarkup=markup;this.global.ssrOptions=options;this.global.ssrStatus=status;if(cleanup)cleanup();}constructor(config,context){const pragmas=context.docblockPragmas;const requestString=pragmas["ssr-request"];const request=requestString?JSON.parse(requestString):{};request.url??="/";request.csrfToken=noop;// This ensures the initial JsDom URL matches the value we use for SSR.
 set(config.projectConfig,"testEnvironmentOptions.url",`http://localhost${request.url}`);super(config,context);this.global.dom=this.dom;this.global.webpackOutputFs=createFsFromVolume(new Volume);// Extracts necessary settings from config and context.
 const{projectConfig}=config;this.rootDir=projectConfig.rootDir;this.testFolder=path.dirname(context.testPath);this.withSsr=!pragmas["no-ssr"];this.ssrRequest=request;this.pragmas=pragmas;// The usual "babel-jest" transformation setup does not apply to
 // the environment code and imports from it, this workaround enables it.
-const optionsString=this.pragmas["ssr-options"];const options=optionsString?JSON.parse(optionsString):{};let root;switch(options.root){case"TEST":root=this.testFolder;break;default:root=process.cwd()}// BEWARE: Anything imported prior to this register() call seems to be
+const optionsString=this.pragmas["ssr-options"];const options=optionsString?JSON.parse(optionsString):{};let root;switch(options.root){case"TEST":root=this.testFolder;break;default:root=process.cwd();}// BEWARE: Anything imported prior to this register() call seems to be
 // transpiled again by Babel if loaded after this call. This causes very
 // confusing errors when testing the code dependent on some sort of contexts
 // (because loading a module again effectively creates a new context object,
 // which is not recognized by the code expecting another context instance).
 // That's why below we prefer dynamic imports for some React Utils methods.
-register({envName:options.babelEnv,extensions:[".js",".jsx",".ts",".tsx",".svg"],root})}async setup(){await super.setup();await this.runWebpack();// NOTE: It is possible that the Webpack run above, and the SSR run below
+register({envName:options.babelEnv,extensions:[".js",".jsx",".ts",".tsx",".svg"],root});}async setup(){await super.setup();await this.runWebpack();// NOTE: It is possible that the Webpack run above, and the SSR run below
 // load different versions of the same module (CommonJS, and ES), and it may
 // cause very confusing problems (e.g. see:
 // https://github.com/birdofpreyru/react-utils/issues/413).
@@ -60,11 +60,11 @@ register({envName:options.babelEnv,extensions:[".js",".jsx",".ts",".tsx",".svg"]
 // build info to undefined, because ES module version not beeing reset
 // triggers an error on the subsequent test using the environment.
 // TODO: Look for a cleaner solution.
-require.cache={};const{setBuildInfo}=await import(/* webpackChunkName: "not-a-valid-chunk" */"../isomorphy/buildInfo");setBuildInfo(undefined,true);if(this.withSsr)await this.runSsr();this.global.REACT_UTILS_FORCE_CLIENT_SIDE=true}async teardown(){delete this.global.REACT_UTILS_FORCE_CLIENT_SIDE;// Resets module cache and @babel/register. Effectively this ensures that
+require.cache={};const{setBuildInfo}=await import(/* webpackChunkName: "not-a-valid-chunk" */"../isomorphy/buildInfo");setBuildInfo(undefined,true);if(this.withSsr)await this.runSsr();this.global.REACT_UTILS_FORCE_CLIENT_SIDE=true;}async teardown(){delete this.global.REACT_UTILS_FORCE_CLIENT_SIDE;// Resets module cache and @babel/register. Effectively this ensures that
 // the next time an instance of this environment is set up, all modules are
 // transformed by Babel from scratch, thus taking into account the latest
 // Babel config (which may change between different environment instances,
 // which does not seem to be taken into account by Babel / Node caches
 // automatically).
-Object.keys(require.cache).forEach(key=>{delete require.cache[key]});register.revert();await super.teardown()}}
+Object.keys(require.cache).forEach(key=>{delete require.cache[key];});register.revert();await super.teardown();}}
 //# sourceMappingURL=E2eSsrEnv.js.map