@dr.pogodin/react-utils 1.33.4 → 1.34.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/build/development/shared/components/Button/index.js +0 -38
  2. package/build/development/shared/components/Button/index.js.map +1 -1
  3. package/build/development/shared/components/Checkbox/index.js +0 -5
  4. package/build/development/shared/components/Checkbox/index.js.map +1 -1
  5. package/build/development/shared/components/GenericLink/index.js +0 -12
  6. package/build/development/shared/components/GenericLink/index.js.map +1 -1
  7. package/build/development/shared/components/Input/index.js +0 -3
  8. package/build/development/shared/components/Input/index.js.map +1 -1
  9. package/build/development/shared/components/MetaTags.js +0 -8
  10. package/build/development/shared/components/MetaTags.js.map +1 -1
  11. package/build/development/shared/components/Modal/index.js +0 -8
  12. package/build/development/shared/components/Modal/index.js.map +1 -1
  13. package/build/development/shared/components/PageLayout/index.js +0 -5
  14. package/build/development/shared/components/PageLayout/index.js.map +1 -1
  15. package/build/development/shared/components/TextArea/index.js +0 -7
  16. package/build/development/shared/components/TextArea/index.js.map +1 -1
  17. package/build/development/shared/components/WithTooltip/Tooltip.js +0 -3
  18. package/build/development/shared/components/WithTooltip/Tooltip.js.map +1 -1
  19. package/build/development/shared/components/WithTooltip/index.js +1 -6
  20. package/build/development/shared/components/WithTooltip/index.js.map +1 -1
  21. package/build/development/shared/components/YouTubeVideo/index.js +0 -4
  22. package/build/development/shared/components/YouTubeVideo/index.js.map +1 -1
  23. package/build/development/shared/components/selectors/CustomDropdown/Options/index.js +0 -4
  24. package/build/development/shared/components/selectors/CustomDropdown/Options/index.js.map +1 -1
  25. package/build/development/shared/components/selectors/CustomDropdown/index.js +0 -7
  26. package/build/development/shared/components/selectors/CustomDropdown/index.js.map +1 -1
  27. package/build/development/shared/components/selectors/NativeDropdown/index.js +0 -7
  28. package/build/development/shared/components/selectors/NativeDropdown/index.js.map +1 -1
  29. package/build/development/shared/components/selectors/Switch/index.js +0 -6
  30. package/build/development/shared/components/selectors/Switch/index.js.map +1 -1
  31. package/build/development/shared/utils/jest/index.js +16 -75
  32. package/build/development/shared/utils/jest/index.js.map +1 -1
  33. package/build/development/shared/utils/splitComponent.js +0 -3
  34. package/build/development/shared/utils/splitComponent.js.map +1 -1
  35. package/build/development/web.bundle.js +22 -32
  36. package/build/production/shared/components/Button/index.js +1 -26
  37. package/build/production/shared/components/Button/index.js.map +1 -1
  38. package/build/production/shared/components/Checkbox/index.js +1 -1
  39. package/build/production/shared/components/Checkbox/index.js.map +1 -1
  40. package/build/production/shared/components/GenericLink/index.js +1 -1
  41. package/build/production/shared/components/GenericLink/index.js.map +1 -1
  42. package/build/production/shared/components/Input/index.js +1 -1
  43. package/build/production/shared/components/Input/index.js.map +1 -1
  44. package/build/production/shared/components/MetaTags.js +1 -1
  45. package/build/production/shared/components/MetaTags.js.map +1 -1
  46. package/build/production/shared/components/Modal/index.js +2 -2
  47. package/build/production/shared/components/Modal/index.js.map +1 -1
  48. package/build/production/shared/components/PageLayout/index.js +1 -1
  49. package/build/production/shared/components/PageLayout/index.js.map +1 -1
  50. package/build/production/shared/components/TextArea/index.js +1 -1
  51. package/build/production/shared/components/TextArea/index.js.map +1 -1
  52. package/build/production/shared/components/WithTooltip/Tooltip.js +1 -1
  53. package/build/production/shared/components/WithTooltip/Tooltip.js.map +1 -1
  54. package/build/production/shared/components/WithTooltip/index.js +2 -2
  55. package/build/production/shared/components/WithTooltip/index.js.map +1 -1
  56. package/build/production/shared/components/YouTubeVideo/index.js +1 -1
  57. package/build/production/shared/components/YouTubeVideo/index.js.map +1 -1
  58. package/build/production/shared/components/selectors/CustomDropdown/Options/index.js +1 -1
  59. package/build/production/shared/components/selectors/CustomDropdown/Options/index.js.map +1 -1
  60. package/build/production/shared/components/selectors/CustomDropdown/index.js +1 -1
  61. package/build/production/shared/components/selectors/CustomDropdown/index.js.map +1 -1
  62. package/build/production/shared/components/selectors/NativeDropdown/index.js +1 -1
  63. package/build/production/shared/components/selectors/NativeDropdown/index.js.map +1 -1
  64. package/build/production/shared/components/selectors/Switch/index.js +1 -1
  65. package/build/production/shared/components/selectors/Switch/index.js.map +1 -1
  66. package/build/production/shared/utils/jest/index.js +7 -33
  67. package/build/production/shared/utils/jest/index.js.map +1 -1
  68. package/build/production/shared/utils/splitComponent.js +1 -1
  69. package/build/production/shared/utils/splitComponent.js.map +1 -1
  70. package/build/production/web.bundle.js +1 -1
  71. package/build/production/web.bundle.js.map +1 -1
  72. package/build/types-code/shared/utils/jest/index.d.ts +3 -43
  73. package/config/eslint/default.json +2 -1
  74. package/config/eslint/jest.json +2 -1
  75. package/config/eslint/typescript.js +5 -0
  76. package/package.json +42 -40
  77. package/src/shared/components/Button/index.tsx +0 -38
  78. package/src/shared/components/Checkbox/index.tsx +0 -6
  79. package/src/shared/components/GenericLink/index.tsx +0 -13
  80. package/src/shared/components/Input/index.tsx +0 -4
  81. package/src/shared/components/MetaTags.tsx +0 -9
  82. package/src/shared/components/Modal/index.tsx +0 -10
  83. package/src/shared/components/PageLayout/index.tsx +0 -6
  84. package/src/shared/components/TextArea/index.tsx +0 -8
  85. package/src/shared/components/WithTooltip/Tooltip.tsx +0 -4
  86. package/src/shared/components/WithTooltip/index.tsx +1 -7
  87. package/src/shared/components/YouTubeVideo/index.tsx +0 -5
  88. package/src/shared/components/selectors/CustomDropdown/Options/index.tsx +0 -5
  89. package/src/shared/components/selectors/CustomDropdown/index.tsx +0 -8
  90. package/src/shared/components/selectors/NativeDropdown/index.tsx +0 -8
  91. package/src/shared/components/selectors/Switch/index.tsx +0 -7
  92. package/src/shared/utils/jest/index.tsx +14 -64
  93. package/src/shared/utils/splitComponent.tsx +1 -5
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Tooltip","_interopRequireWildcard","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultTheme","validThemeKeys","validTooltipThemeKeys","Wrapper","children","placement","tip","theme","current","heap","useRef","lastCursorX","lastCursorY","triggeredByTouch","timerId","undefined","tooltipRef","wrapperRef","showTooltip","setShowTooltip","useState","updatePortalPosition","cursorX","cursorY","setTimeout","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","useEffect","listener","addEventListener","removeEventListener","jsxs","className","wrapper","onMouseLeave","onMouseMove","clientX","clientY","onClick","clearTimeout","onTouchStart","ref","role","jsx","ThemedWrapper","themed","PLACEMENTS","propTypes","PT","node","oneOf","values","themeType","isRequired","defaultProps","ABOVE_CURSOR","_default","exports"],"sources":["../../../../../src/shared/components/WithTooltip/index.tsx"],"sourcesContent":["/* global window */\n\nimport PT from 'prop-types';\nimport {\n type ReactNode,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n PLACEMENTS,\n validThemeKeys as validTooltipThemeKeys,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\nconst validThemeKeys = [...validTooltipThemeKeys, 'wrapper'] as const;\n\ntype PropsT = {\n children?: ReactNode;\n placement?: PLACEMENTS;\n tip?: ReactNode;\n theme: Theme<typeof validThemeKeys>;\n};\n\ntype TooltipRefT = {\n pointTo: (\n x: number,\n y: number,\n placement: PLACEMENTS,\n wrapperRef: HTMLDivElement,\n ) => void;\n};\n\ntype HeapT = {\n lastCursorX: number;\n lastCursorY: number;\n triggeredByTouch: boolean;\n timerId?: NodeJS.Timeout;\n};\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n * <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param {object} props Component properties.\n * @param {React.node} props.tip &ndash; Anything React is able to render,\n * _e.g._ a tooltip text. This will be the tooltip content.\n * @param {WithTooltipTheme} props.theme _Ad hoc_ theme.\n */\nconst Wrapper: React.FunctionComponent<PropsT> = ({\n children,\n placement,\n tip,\n theme,\n}) => {\n const { current: heap } = useRef<HeapT>({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined,\n });\n const tooltipRef = useRef<TooltipRefT>();\n const wrapperRef = useRef<HTMLDivElement>(null);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const updatePortalPosition = (cursorX: number, cursorY: number) => {\n if (!showTooltip) {\n heap.lastCursorX = cursorX;\n heap.lastCursorY = cursorY;\n\n // If tooltip was triggered by a touch, we delay its opening by a bit,\n // to ensure it was not a touch-click - in the case of touch click we\n // want to do the click, rather than show the tooltip, and the delay\n // gives click handler a chance to abort the tooltip openning.\n if (heap.triggeredByTouch) {\n if (!heap.timerId) {\n heap.timerId = setTimeout(() => {\n heap.triggeredByTouch = false;\n heap.timerId = undefined;\n setShowTooltip(true);\n }, 300);\n }\n\n // Otherwise we can just open the tooltip right away.\n } else setShowTooltip(true);\n } else {\n const wrapperRect = wrapperRef.current!.getBoundingClientRect();\n if (\n cursorX < wrapperRect.left\n || cursorX > wrapperRect.right\n || cursorY < wrapperRect.top\n || cursorY > wrapperRect.bottom\n ) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n cursorX + window.scrollX,\n cursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n }\n };\n\n useEffect(() => {\n if (showTooltip && tip !== null) {\n // This is necessary to ensure that even when a single mouse event\n // arrives to a tool-tipped component, the tooltip is correctly positioned\n // once opened (because similar call above does not have effect until\n // the tooltip is fully mounted, and that is delayed to future rendering\n // cycle due to the implementation).\n if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n heap.lastCursorX + window.scrollX,\n heap.lastCursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [\n heap.lastCursorX,\n heap.lastCursorY,\n placement,\n showTooltip,\n tip,\n ]);\n\n return (\n <div\n className={theme.wrapper}\n onMouseLeave={() => setShowTooltip(false)}\n onMouseMove={(e) => updatePortalPosition(e.clientX, e.clientY)}\n onClick={() => {\n if (heap.timerId) {\n clearTimeout(heap.timerId);\n heap.timerId = undefined;\n heap.triggeredByTouch = false;\n }\n }}\n onTouchStart={() => {\n heap.triggeredByTouch = true;\n }}\n ref={wrapperRef}\n role=\"presentation\"\n >\n {\n showTooltip && tip !== null ? (\n <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n ) : null\n }\n {children}\n </div>\n );\n};\n\nconst ThemedWrapper = themed(\n Wrapper,\n 'WithTooltip',\n [\n 'appearance',\n 'arrow',\n 'container',\n 'content',\n 'wrapper',\n ],\n defaultTheme,\n);\n\ntype ExportT = typeof ThemedWrapper & {\n PLACEMENTS: typeof PLACEMENTS;\n};\n\nconst e: ExportT = ThemedWrapper as ExportT;\n\ne.PLACEMENTS = PLACEMENTS;\n\nWrapper.propTypes = {\n children: PT.node,\n placement: PT.oneOf(Object.values(PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: PT.node,\n};\n\nWrapper.defaultProps = {\n children: null,\n placement: PLACEMENTS.ABOVE_CURSOR,\n tip: null,\n};\n\nexport default e;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Tooltip","_interopRequireWildcard","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultTheme","validThemeKeys","validTooltipThemeKeys","Wrapper","children","placement","PLACEMENTS","ABOVE_CURSOR","tip","theme","current","heap","useRef","lastCursorX","lastCursorY","triggeredByTouch","timerId","undefined","tooltipRef","wrapperRef","showTooltip","setShowTooltip","useState","updatePortalPosition","cursorX","cursorY","setTimeout","wrapperRect","getBoundingClientRect","left","right","top","bottom","pointTo","window","scrollX","scrollY","useEffect","listener","addEventListener","removeEventListener","jsxs","className","wrapper","onMouseLeave","onMouseMove","clientX","clientY","onClick","clearTimeout","onTouchStart","ref","role","jsx","ThemedWrapper","themed","propTypes","PT","node","oneOf","values","themeType","isRequired","_default","exports"],"sources":["../../../../../src/shared/components/WithTooltip/index.tsx"],"sourcesContent":["/* global window */\n\nimport PT from 'prop-types';\nimport {\n type ReactNode,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Tooltip, {\n PLACEMENTS,\n validThemeKeys as validTooltipThemeKeys,\n} from './Tooltip';\n\nimport defaultTheme from './default-theme.scss';\n\nconst validThemeKeys = [...validTooltipThemeKeys, 'wrapper'] as const;\n\ntype PropsT = {\n children?: ReactNode;\n placement?: PLACEMENTS;\n tip?: ReactNode;\n theme: Theme<typeof validThemeKeys>;\n};\n\ntype TooltipRefT = {\n pointTo: (\n x: number,\n y: number,\n placement: PLACEMENTS,\n wrapperRef: HTMLDivElement,\n ) => void;\n};\n\ntype HeapT = {\n lastCursorX: number;\n lastCursorY: number;\n triggeredByTouch: boolean;\n timerId?: NodeJS.Timeout;\n};\n\n/**\n * Implements a simple to use and themeable tooltip component, _e.g._\n * ```js\n * <WithTooltip tip=\"This is example tooltip.\">\n * <p>Hover to see the tooltip.</p>\n * </WithTooltip>\n * ```\n * **Children:** Children are rendered in the place of `<WithTooltip>`,\n * and when hovered the tooltip is shown. By default the wrapper itself is\n * `<div>` block with `display: inline-block`.\n * @param {object} props Component properties.\n * @param {React.node} props.tip &ndash; Anything React is able to render,\n * _e.g._ a tooltip text. This will be the tooltip content.\n * @param {WithTooltipTheme} props.theme _Ad hoc_ theme.\n */\nconst Wrapper: React.FunctionComponent<PropsT> = ({\n children,\n placement = PLACEMENTS.ABOVE_CURSOR,\n tip,\n theme,\n}) => {\n const { current: heap } = useRef<HeapT>({\n lastCursorX: 0,\n lastCursorY: 0,\n triggeredByTouch: false,\n timerId: undefined,\n });\n const tooltipRef = useRef<TooltipRefT>();\n const wrapperRef = useRef<HTMLDivElement>(null);\n const [showTooltip, setShowTooltip] = useState(false);\n\n const updatePortalPosition = (cursorX: number, cursorY: number) => {\n if (!showTooltip) {\n heap.lastCursorX = cursorX;\n heap.lastCursorY = cursorY;\n\n // If tooltip was triggered by a touch, we delay its opening by a bit,\n // to ensure it was not a touch-click - in the case of touch click we\n // want to do the click, rather than show the tooltip, and the delay\n // gives click handler a chance to abort the tooltip openning.\n if (heap.triggeredByTouch) {\n if (!heap.timerId) {\n heap.timerId = setTimeout(() => {\n heap.triggeredByTouch = false;\n heap.timerId = undefined;\n setShowTooltip(true);\n }, 300);\n }\n\n // Otherwise we can just open the tooltip right away.\n } else setShowTooltip(true);\n } else {\n const wrapperRect = wrapperRef.current!.getBoundingClientRect();\n if (\n cursorX < wrapperRect.left\n || cursorX > wrapperRect.right\n || cursorY < wrapperRect.top\n || cursorY > wrapperRect.bottom\n ) {\n setShowTooltip(false);\n } else if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n cursorX + window.scrollX,\n cursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n }\n };\n\n useEffect(() => {\n if (showTooltip && tip !== null) {\n // This is necessary to ensure that even when a single mouse event\n // arrives to a tool-tipped component, the tooltip is correctly positioned\n // once opened (because similar call above does not have effect until\n // the tooltip is fully mounted, and that is delayed to future rendering\n // cycle due to the implementation).\n if (tooltipRef.current) {\n tooltipRef.current.pointTo(\n heap.lastCursorX + window.scrollX,\n heap.lastCursorY + window.scrollY,\n placement!,\n wrapperRef.current!,\n );\n }\n\n const listener = () => setShowTooltip(false);\n window.addEventListener('scroll', listener);\n return () => window.removeEventListener('scroll', listener);\n }\n return undefined;\n }, [\n heap.lastCursorX,\n heap.lastCursorY,\n placement,\n showTooltip,\n tip,\n ]);\n\n return (\n <div\n className={theme.wrapper}\n onMouseLeave={() => setShowTooltip(false)}\n onMouseMove={(e) => updatePortalPosition(e.clientX, e.clientY)}\n onClick={() => {\n if (heap.timerId) {\n clearTimeout(heap.timerId);\n heap.timerId = undefined;\n heap.triggeredByTouch = false;\n }\n }}\n onTouchStart={() => {\n heap.triggeredByTouch = true;\n }}\n ref={wrapperRef}\n role=\"presentation\"\n >\n {\n showTooltip && tip !== null ? (\n <Tooltip ref={tooltipRef} theme={theme}>{tip}</Tooltip>\n ) : null\n }\n {children}\n </div>\n );\n};\n\nconst ThemedWrapper = themed(\n Wrapper,\n 'WithTooltip',\n [\n 'appearance',\n 'arrow',\n 'container',\n 'content',\n 'wrapper',\n ],\n defaultTheme,\n);\n\ntype ExportT = typeof ThemedWrapper & {\n PLACEMENTS: typeof PLACEMENTS;\n};\n\nconst e: ExportT = ThemedWrapper as ExportT;\n\ne.PLACEMENTS = PLACEMENTS;\n\nWrapper.propTypes = {\n children: PT.node,\n placement: PT.oneOf(Object.values(PLACEMENTS)),\n theme: ThemedWrapper.themeType.isRequired,\n tip: PT.node,\n};\n\nexport default e;\n"],"mappings":";;;;;;;AAEA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAOA,IAAAE,YAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,QAAA,GAAAC,uBAAA,CAAAJ,OAAA;AAGmB,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAM,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAfnB;AAAA,MAAAW,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAmBA,MAAMC,cAAc,GAAG,CAAC,GAAGC,uBAAqB,EAAE,SAAS,CAAU;AAyBrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,OAAwC,GAAGA,CAAC;EAChDC,QAAQ;EACRC,SAAS,GAAGC,mBAAU,CAACC,YAAY;EACnCC,GAAG;EACHC;AACF,CAAC,KAAK;EACJ,MAAM;IAAEC,OAAO,EAAEC;EAAK,CAAC,GAAG,IAAAC,aAAM,EAAQ;IACtCC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,CAAC;IACdC,gBAAgB,EAAE,KAAK;IACvBC,OAAO,EAAEC;EACX,CAAC,CAAC;EACF,MAAMC,UAAU,GAAG,IAAAN,aAAM,EAAc,CAAC;EACxC,MAAMO,UAAU,GAAG,IAAAP,aAAM,EAAiB,IAAI,CAAC;EAC/C,MAAM,CAACQ,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EAErD,MAAMC,oBAAoB,GAAGA,CAACC,OAAe,EAAEC,OAAe,KAAK;IACjE,IAAI,CAACL,WAAW,EAAE;MAChBT,IAAI,CAACE,WAAW,GAAGW,OAAO;MAC1Bb,IAAI,CAACG,WAAW,GAAGW,OAAO;;MAE1B;MACA;MACA;MACA;MACA,IAAId,IAAI,CAACI,gBAAgB,EAAE;QACzB,IAAI,CAACJ,IAAI,CAACK,OAAO,EAAE;UACjBL,IAAI,CAACK,OAAO,GAAGU,UAAU,CAAC,MAAM;YAC9Bf,IAAI,CAACI,gBAAgB,GAAG,KAAK;YAC7BJ,IAAI,CAACK,OAAO,GAAGC,SAAS;YACxBI,cAAc,CAAC,IAAI,CAAC;UACtB,CAAC,EAAE,GAAG,CAAC;QACT;;QAEF;MACA,CAAC,MAAMA,cAAc,CAAC,IAAI,CAAC;IAC7B,CAAC,MAAM;MACL,MAAMM,WAAW,GAAGR,UAAU,CAACT,OAAO,CAAEkB,qBAAqB,CAAC,CAAC;MAC/D,IACEJ,OAAO,GAAGG,WAAW,CAACE,IAAI,IACvBL,OAAO,GAAGG,WAAW,CAACG,KAAK,IAC3BL,OAAO,GAAGE,WAAW,CAACI,GAAG,IACzBN,OAAO,GAAGE,WAAW,CAACK,MAAM,EAC/B;QACAX,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,MAAM,IAAIH,UAAU,CAACR,OAAO,EAAE;QAC7BQ,UAAU,CAACR,OAAO,CAACuB,OAAO,CACxBT,OAAO,GAAGU,MAAM,CAACC,OAAO,EACxBV,OAAO,GAAGS,MAAM,CAACE,OAAO,EACxB/B,SAAS,EACTc,UAAU,CAACT,OACb,CAAC;MACH;IACF;EACF,CAAC;EAED,IAAA2B,gBAAS,EAAC,MAAM;IACd,IAAIjB,WAAW,IAAIZ,GAAG,KAAK,IAAI,EAAE;MAC/B;MACA;MACA;MACA;MACA;MACA,IAAIU,UAAU,CAACR,OAAO,EAAE;QACtBQ,UAAU,CAACR,OAAO,CAACuB,OAAO,CACxBtB,IAAI,CAACE,WAAW,GAAGqB,MAAM,CAACC,OAAO,EACjCxB,IAAI,CAACG,WAAW,GAAGoB,MAAM,CAACE,OAAO,EACjC/B,SAAS,EACTc,UAAU,CAACT,OACb,CAAC;MACH;MAEA,MAAM4B,QAAQ,GAAGA,CAAA,KAAMjB,cAAc,CAAC,KAAK,CAAC;MAC5Ca,MAAM,CAACK,gBAAgB,CAAC,QAAQ,EAAED,QAAQ,CAAC;MAC3C,OAAO,MAAMJ,MAAM,CAACM,mBAAmB,CAAC,QAAQ,EAAEF,QAAQ,CAAC;IAC7D;IACA,OAAOrB,SAAS;EAClB,CAAC,EAAE,CACDN,IAAI,CAACE,WAAW,EAChBF,IAAI,CAACG,WAAW,EAChBT,SAAS,EACTe,WAAW,EACXZ,GAAG,CACJ,CAAC;EAEF,oBACE,IAAA7B,WAAA,CAAA8D,IAAA;IACEC,SAAS,EAAEjC,KAAK,CAACkC,OAAQ;IACzBC,YAAY,EAAEA,CAAA,KAAMvB,cAAc,CAAC,KAAK,CAAE;IAC1CwB,WAAW,EAAGhE,CAAC,IAAK0C,oBAAoB,CAAC1C,CAAC,CAACiE,OAAO,EAAEjE,CAAC,CAACkE,OAAO,CAAE;IAC/DC,OAAO,EAAEA,CAAA,KAAM;MACb,IAAIrC,IAAI,CAACK,OAAO,EAAE;QAChBiC,YAAY,CAACtC,IAAI,CAACK,OAAO,CAAC;QAC1BL,IAAI,CAACK,OAAO,GAAGC,SAAS;QACxBN,IAAI,CAACI,gBAAgB,GAAG,KAAK;MAC/B;IACF,CAAE;IACFmC,YAAY,EAAEA,CAAA,KAAM;MAClBvC,IAAI,CAACI,gBAAgB,GAAG,IAAI;IAC9B,CAAE;IACFoC,GAAG,EAAEhC,UAAW;IAChBiC,IAAI,EAAC,cAAc;IAAAhD,QAAA,GAGjBgB,WAAW,IAAIZ,GAAG,KAAK,IAAI,gBACzB,IAAA7B,WAAA,CAAA0E,GAAA,EAAC5E,QAAA,CAAAS,OAAO;MAACiE,GAAG,EAAEjC,UAAW;MAACT,KAAK,EAAEA,KAAM;MAAAL,QAAA,EAAEI;IAAG,CAAU,CAAC,GACrD,IAAI,EAETJ,QAAQ;EAAA,CACN,CAAC;AAEV,CAAC;AAED,MAAMkD,aAAa,GAAG,IAAAC,oBAAM,EAC1BpD,OAAO,EACP,aAAa,EACb,CACE,YAAY,EACZ,OAAO,EACP,WAAW,EACX,SAAS,EACT,SAAS,CACV,EACDH,YACF,CAAC;AAMD,MAAMnB,CAAU,GAAGyE,aAAwB;AAE3CzE,CAAC,CAACyB,UAAU,GAAGA,mBAAU;AAEzBH,OAAO,CAACqD,SAAS,GAAG;EAClBpD,QAAQ,EAAEqD,kBAAE,CAACC,IAAI;EACjBrD,SAAS,EAAEoD,kBAAE,CAACE,KAAK,CAACnE,MAAM,CAACoE,MAAM,CAACtD,mBAAU,CAAC,CAAC;EAC9CG,KAAK,EAAE6C,aAAa,CAACO,SAAS,CAACC,UAAU;EACzCtD,GAAG,EAAEiD,kBAAE,CAACC;AACV,CAAC;AAAC,IAAAK,QAAA,GAAAC,OAAA,CAAA9E,OAAA,GAEaL,CAAC","ignoreList":[]}
@@ -78,9 +78,5 @@ YouTubeVideo.propTypes = {
78
78
  theme: ThemedYouTubeVideo.themeType.isRequired,
79
79
  title: _propTypes.default.string
80
80
  };
81
- YouTubeVideo.defaultProps = {
82
- autoplay: false,
83
- title: ''
84
- };
85
81
  var _default = exports.default = ThemedYouTubeVideo;
86
82
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","_Throbber","_jsxRuntime","baseTheme","throbberTheme","validThemeKeys","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","qs","parse","videoId","v","match","stringify","jsxs","className","container","children","jsx","default","allow","allowFullScreen","video","ThemedYouTubeVideo","themed","propTypes","PT","bool","string","isRequired","themeType","defaultProps","_default","exports"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\nconst validThemeKeys = ['container', 'video'] as const;\n\ntype ComponentThemeT = Theme<typeof validThemeKeys>;\n\ntype PropsT = {\n autoplay?: boolean;\n src: string;\n theme: ComponentThemeT,\n title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n autoplay,\n src,\n theme,\n title,\n}) => {\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs.parse(queryString) : {};\n\n const videoId = query.v || url.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n url = `https://www.youtube.com/embed/${videoId}`;\n\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs.stringify(query)}`;\n\n // TODO: https://developers.google.com/youtube/player_parameters\n // More query parameters can be exposed via the component props.\n\n return (\n <div className={theme.container}>\n <Throbber theme={throbberTheme} />\n <iframe\n allow=\"autoplay\"\n allowFullScreen\n className={theme.video}\n src={url}\n title={title}\n />\n </div>\n );\n};\n\nconst ThemedYouTubeVideo = themed(\n YouTubeVideo,\n 'YouTubeVideo',\n validThemeKeys,\n baseTheme,\n);\n\nYouTubeVideo.propTypes = {\n autoplay: PT.bool,\n src: PT.string.isRequired,\n theme: ThemedYouTubeVideo.themeType.isRequired,\n title: PT.string,\n};\n\nYouTubeVideo.defaultProps = {\n autoplay: false,\n title: '',\n};\n\nexport default ThemedYouTubeVideo;\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,GAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,YAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,SAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA2C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,MAAAK,SAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAAA,MAAAC,aAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAK3C,MAAMC,cAAc,GAAG,CAAC,WAAW,EAAE,OAAO,CAAU;AAWtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAA6C,GAAGA,CAAC;EACrDC,QAAQ;EACRC,GAAG;EACHC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC;EAC/B,IAAIC,GAAG,GAAGF,QAAQ,CAAC,CAAC,CAAC;EACrB,MAAMG,WAAW,GAAGH,QAAQ,CAAC,CAAC,CAAC;EAC/B,MAAMI,KAAK,GAAGD,WAAW,GAAGE,WAAE,CAACC,KAAK,CAACH,WAAW,CAAC,GAAG,CAAC,CAAC;EAEtD,MAAMI,OAAO,GAAGH,KAAK,CAACI,CAAC,IAAIN,GAAG,CAACO,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;EAChEP,GAAG,GAAI,iCAAgCK,OAAQ,EAAC;EAEhD,OAAOH,KAAK,CAACI,CAAC;EACdJ,KAAK,CAACR,QAAQ,GAAGA,QAAQ,GAAG,GAAG,GAAG,GAAG;EACrCM,GAAG,IAAK,IAAGG,WAAE,CAACK,SAAS,CAACN,KAAK,CAAE,EAAC;;EAEhC;EACA;;EAEA,oBACE,IAAAb,WAAA,CAAAoB,IAAA;IAAKC,SAAS,EAAEd,KAAK,CAACe,SAAU;IAAAC,QAAA,gBAC9B,IAAAvB,WAAA,CAAAwB,GAAA,EAACzB,SAAA,CAAA0B,OAAQ;MAAClB,KAAK,EAAEL;IAAc,CAAE,CAAC,eAClC,IAAAF,WAAA,CAAAwB,GAAA;MACEE,KAAK,EAAC,UAAU;MAChBC,eAAe;MACfN,SAAS,EAAEd,KAAK,CAACqB,KAAM;MACvBtB,GAAG,EAAEK,GAAI;MACTH,KAAK,EAAEA;IAAM,CACd,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,MAAMqB,kBAAkB,GAAG,IAAAC,oBAAM,EAC/B1B,YAAY,EACZ,cAAc,EACdD,cAAc,EACdF,SACF,CAAC;AAEDG,YAAY,CAAC2B,SAAS,GAAG;EACvB1B,QAAQ,EAAE2B,kBAAE,CAACC,IAAI;EACjB3B,GAAG,EAAE0B,kBAAE,CAACE,MAAM,CAACC,UAAU;EACzB5B,KAAK,EAAEsB,kBAAkB,CAACO,SAAS,CAACD,UAAU;EAC9C3B,KAAK,EAAEwB,kBAAE,CAACE;AACZ,CAAC;AAED9B,YAAY,CAACiC,YAAY,GAAG;EAC1BhC,QAAQ,EAAE,KAAK;EACfG,KAAK,EAAE;AACT,CAAC;AAAC,IAAA8B,QAAA,GAAAC,OAAA,CAAAd,OAAA,GAEaI,kBAAkB","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_qs","_reactThemes","_Throbber","_jsxRuntime","baseTheme","throbberTheme","validThemeKeys","YouTubeVideo","autoplay","src","theme","title","srcParts","split","url","queryString","query","qs","parse","videoId","v","match","stringify","jsxs","className","container","children","jsx","default","allow","allowFullScreen","video","ThemedYouTubeVideo","themed","propTypes","PT","bool","string","isRequired","themeType","_default","exports"],"sources":["../../../../../src/shared/components/YouTubeVideo/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport qs from 'qs';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Throbber from 'components/Throbber';\n\nimport baseTheme from './base.scss';\nimport throbberTheme from './throbber.scss';\n\nconst validThemeKeys = ['container', 'video'] as const;\n\ntype ComponentThemeT = Theme<typeof validThemeKeys>;\n\ntype PropsT = {\n autoplay?: boolean;\n src: string;\n theme: ComponentThemeT,\n title?: string;\n};\n\n/**\n * A component for embeding a YouTube video.\n * @param [props] Component properties.\n * @param [props.autoplay] If `true` the video will start to play\n * automatically once loaded.\n * @param [props.src] URL of the video to play. Can be in any of\n * the following formats, and keeps any additional query parameters understood\n * by the YouTube IFrame player:\n * - `https://www.youtube.com/watch?v=NdF6Rmt6Ado`\n * - `https://youtu.be/NdF6Rmt6Ado`\n * - `https://www.youtube.com/embed/NdF6Rmt6Ado`\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props.title] The `title` attribute to add to the player\n * IFrame.\n */\nconst YouTubeVideo: React.FunctionComponent<PropsT> = ({\n autoplay,\n src,\n theme,\n title,\n}) => {\n const srcParts = src.split('?');\n let url = srcParts[0];\n const queryString = srcParts[1];\n const query = queryString ? qs.parse(queryString) : {};\n\n const videoId = query.v || url.match(/\\/([a-zA-Z0-9-_]*)$/)?.[1];\n url = `https://www.youtube.com/embed/${videoId}`;\n\n delete query.v;\n query.autoplay = autoplay ? '1' : '0';\n url += `?${qs.stringify(query)}`;\n\n // TODO: https://developers.google.com/youtube/player_parameters\n // More query parameters can be exposed via the component props.\n\n return (\n <div className={theme.container}>\n <Throbber theme={throbberTheme} />\n <iframe\n allow=\"autoplay\"\n allowFullScreen\n className={theme.video}\n src={url}\n title={title}\n />\n </div>\n );\n};\n\nconst ThemedYouTubeVideo = themed(\n YouTubeVideo,\n 'YouTubeVideo',\n validThemeKeys,\n baseTheme,\n);\n\nYouTubeVideo.propTypes = {\n autoplay: PT.bool,\n src: PT.string.isRequired,\n theme: ThemedYouTubeVideo.themeType.isRequired,\n title: PT.string,\n};\n\nexport default ThemedYouTubeVideo;\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,GAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,YAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,SAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA2C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,MAAAK,SAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAAA,MAAAC,aAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAK3C,MAAMC,cAAc,GAAG,CAAC,WAAW,EAAE,OAAO,CAAU;AAWtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAA6C,GAAGA,CAAC;EACrDC,QAAQ;EACRC,GAAG;EACHC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGH,GAAG,CAACI,KAAK,CAAC,GAAG,CAAC;EAC/B,IAAIC,GAAG,GAAGF,QAAQ,CAAC,CAAC,CAAC;EACrB,MAAMG,WAAW,GAAGH,QAAQ,CAAC,CAAC,CAAC;EAC/B,MAAMI,KAAK,GAAGD,WAAW,GAAGE,WAAE,CAACC,KAAK,CAACH,WAAW,CAAC,GAAG,CAAC,CAAC;EAEtD,MAAMI,OAAO,GAAGH,KAAK,CAACI,CAAC,IAAIN,GAAG,CAACO,KAAK,CAAC,qBAAqB,CAAC,GAAG,CAAC,CAAC;EAChEP,GAAG,GAAI,iCAAgCK,OAAQ,EAAC;EAEhD,OAAOH,KAAK,CAACI,CAAC;EACdJ,KAAK,CAACR,QAAQ,GAAGA,QAAQ,GAAG,GAAG,GAAG,GAAG;EACrCM,GAAG,IAAK,IAAGG,WAAE,CAACK,SAAS,CAACN,KAAK,CAAE,EAAC;;EAEhC;EACA;;EAEA,oBACE,IAAAb,WAAA,CAAAoB,IAAA;IAAKC,SAAS,EAAEd,KAAK,CAACe,SAAU;IAAAC,QAAA,gBAC9B,IAAAvB,WAAA,CAAAwB,GAAA,EAACzB,SAAA,CAAA0B,OAAQ;MAAClB,KAAK,EAAEL;IAAc,CAAE,CAAC,eAClC,IAAAF,WAAA,CAAAwB,GAAA;MACEE,KAAK,EAAC,UAAU;MAChBC,eAAe;MACfN,SAAS,EAAEd,KAAK,CAACqB,KAAM;MACvBtB,GAAG,EAAEK,GAAI;MACTH,KAAK,EAAEA;IAAM,CACd,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,MAAMqB,kBAAkB,GAAG,IAAAC,oBAAM,EAC/B1B,YAAY,EACZ,cAAc,EACdD,cAAc,EACdF,SACF,CAAC;AAEDG,YAAY,CAAC2B,SAAS,GAAG;EACvB1B,QAAQ,EAAE2B,kBAAE,CAACC,IAAI;EACjB3B,GAAG,EAAE0B,kBAAE,CAACE,MAAM,CAACC,UAAU;EACzB5B,KAAK,EAAEsB,kBAAkB,CAACO,SAAS,CAACD,UAAU;EAC9C3B,KAAK,EAAEwB,kBAAE,CAACE;AACZ,CAAC;AAAC,IAAAG,QAAA,GAAAC,OAAA,CAAAb,OAAA,GAEaI,kBAAkB","ignoreList":[]}
@@ -99,9 +99,5 @@ Options.propTypes = {
99
99
  optionClass: _propTypes.default.string.isRequired,
100
100
  options: _common.optionsValidator.isRequired
101
101
  };
102
- Options.defaultProps = {
103
- containerStyle: undefined,
104
- filter: undefined
105
- };
106
102
  var _default = exports.default = Options;
107
103
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_Modal","_common","_jsxRuntime","S","areEqual","a","b","left","top","width","Options","forwardRef","containerClass","containerStyle","filter","onCancel","onChange","optionClass","options","ref","opsRef","useRef","useImperativeHandle","measure","e","current","parentElement","undefined","rect","getBoundingClientRect","style","window","getComputedStyle","mBottom","parseFloat","marginBottom","mTop","marginTop","height","optionNodes","i","length","option","iValue","iName","optionValueName","push","jsx","className","onClick","stopPropagation","onKeyDown","key","role","tabIndex","children","BaseModal","cancelOnScrolling","dontDisableScrolling","theme","ad","hoc","container","context","overlay","propTypes","PT","string","isRequired","shape","number","func","optionsValidator","defaultProps","_default","exports","default"],"sources":["../../../../../../../src/shared/components/selectors/CustomDropdown/Options/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { forwardRef, useImperativeHandle, useRef } from 'react';\n\nimport { BaseModal } from 'components/Modal';\n\nimport S from './style.scss';\n\nimport {\n type OptionT,\n type OptionsT,\n type ValueT,\n optionsValidator,\n optionValueName,\n} from '../../common';\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<React.ReactNode> | ValueT) => boolean;\n optionClass: string;\n options: OptionsT<React.ReactNode>;\n onCancel: () => void;\n onChange: (value: ValueT) => void;\n};\n\nconst Options = forwardRef<RefT, PropsT>(({\n containerClass,\n containerStyle,\n filter,\n onCancel,\n onChange,\n optionClass,\n options,\n}, ref) => {\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: React.ReactNode[] = [];\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n optionNodes.push(\n <div\n className={optionClass}\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 key={iValue}\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 containerStyle={containerStyle}\n dontDisableScrolling\n onCancel={onCancel}\n theme={{\n ad: '',\n hoc: '',\n container: containerClass,\n context: '',\n overlay: S.overlay,\n }}\n >\n <div ref={opsRef}>{optionNodes}</div>\n </BaseModal>\n );\n});\n\nOptions.propTypes = {\n containerClass: PT.string.isRequired,\n\n containerStyle: PT.shape({\n left: PT.number.isRequired,\n top: PT.number.isRequired,\n width: PT.number.isRequired,\n }),\n\n filter: PT.func,\n onCancel: PT.func.isRequired,\n onChange: PT.func.isRequired,\n optionClass: PT.string.isRequired,\n options: optionsValidator.isRequired,\n};\n\nOptions.defaultProps = {\n containerStyle: undefined,\n filter: undefined,\n};\n\nexport default Options;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_Modal","_common","_jsxRuntime","S","areEqual","a","b","left","top","width","Options","forwardRef","containerClass","containerStyle","filter","onCancel","onChange","optionClass","options","ref","opsRef","useRef","useImperativeHandle","measure","e","current","parentElement","undefined","rect","getBoundingClientRect","style","window","getComputedStyle","mBottom","parseFloat","marginBottom","mTop","marginTop","height","optionNodes","i","length","option","iValue","iName","optionValueName","push","jsx","className","onClick","stopPropagation","onKeyDown","key","role","tabIndex","children","BaseModal","cancelOnScrolling","dontDisableScrolling","theme","ad","hoc","container","context","overlay","propTypes","PT","string","isRequired","shape","number","func","optionsValidator","_default","exports","default"],"sources":["../../../../../../../src/shared/components/selectors/CustomDropdown/Options/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { forwardRef, useImperativeHandle, useRef } from 'react';\n\nimport { BaseModal } from 'components/Modal';\n\nimport S from './style.scss';\n\nimport {\n type OptionT,\n type OptionsT,\n type ValueT,\n optionsValidator,\n optionValueName,\n} from '../../common';\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<React.ReactNode> | ValueT) => boolean;\n optionClass: string;\n options: OptionsT<React.ReactNode>;\n onCancel: () => void;\n onChange: (value: ValueT) => void;\n};\n\nconst Options = forwardRef<RefT, PropsT>(({\n containerClass,\n containerStyle,\n filter,\n onCancel,\n onChange,\n optionClass,\n options,\n}, ref) => {\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: React.ReactNode[] = [];\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n optionNodes.push(\n <div\n className={optionClass}\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 key={iValue}\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 containerStyle={containerStyle}\n dontDisableScrolling\n onCancel={onCancel}\n theme={{\n ad: '',\n hoc: '',\n container: containerClass,\n context: '',\n overlay: S.overlay,\n }}\n >\n <div ref={opsRef}>{optionNodes}</div>\n </BaseModal>\n );\n});\n\nOptions.propTypes = {\n containerClass: PT.string.isRequired,\n\n containerStyle: PT.shape({\n left: PT.number.isRequired,\n top: PT.number.isRequired,\n width: PT.number.isRequired,\n }),\n\n filter: PT.func,\n onCancel: PT.func.isRequired,\n onChange: PT.func.isRequired,\n optionClass: PT.string.isRequired,\n options: optionsValidator.isRequired,\n};\n\nexport default Options;\n"],"mappings":"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","ignoreList":[]}
@@ -149,12 +149,5 @@ BaseCustomDropdown.propTypes = {
149
149
  theme: ThemedCustomDropdown.themeType.isRequired,
150
150
  value: _common.valueValidator
151
151
  };
152
- BaseCustomDropdown.defaultProps = {
153
- filter: undefined,
154
- label: undefined,
155
- onChange: undefined,
156
- options: [],
157
- value: undefined
158
- };
159
152
  var _default = exports.default = ThemedCustomDropdown;
160
153
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Options","_interopRequireWildcard","_common","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultTheme","BaseCustomDropdown","filter","label","onChange","options","theme","value","Error","active","setActive","useState","dropdownRef","useRef","opsRef","opsPos","setOpsPos","upward","setUpward","useEffect","undefined","id","cb","anchor","current","getBoundingClientRect","opsRect","measure","fitsDown","bottom","height","window","visualViewport","fitsUp","top","up","pos","left","width","now","areEqual","requestAnimationFrame","cancelAnimationFrame","openList","view","rect","stopPropagation","selected","jsx","Fragment","children","length","option","iValue","iName","optionValueName","containerClassName","container","opsContainerClass","select","jsxs","className","dropdown","onClick","onKeyDown","key","ref","role","tabIndex","arrow","containerClass","containerStyle","onCancel","newValue","optionClass","ThemedCustomDropdown","themed","validThemeKeys","propTypes","PT","func","node","arrayOf","optionValidator","isRequired","themeType","valueValidator","defaultProps","_default","exports"],"sources":["../../../../../../src/shared/components/selectors/CustomDropdown/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { useEffect, useRef, useState } from 'react';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport Options, { type ContainerPosT, type RefT, areEqual } from './Options';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n type ValueT,\n optionValidator,\n optionValueName,\n validThemeKeys,\n valueValidator,\n} from '../common';\n\nconst BaseCustomDropdown: React.FunctionComponent<\nPropsT<React.ReactNode, (value: ValueT) => void>\n> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\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 top: anchor.top - opsRect.height - 1,\n left: anchor.left,\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 (let i = 0; i < options.length; ++i) {\n const option = options[i];\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 = theme.container;\n if (active) containerClassName += ` ${theme.active}`;\n\n let opsContainerClass = theme.select || '';\n if (upward) {\n containerClassName += ` ${theme.upward}`;\n opsContainerClass += ` ${theme.upward}`;\n }\n\n return (\n <div className={containerClassName}>\n {label === undefined ? null : (\n <div className={theme.label}>{label}</div>\n )}\n <div\n className={theme.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={theme.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={theme.option || ''}\n options={options}\n ref={opsRef}\n />\n ) : null\n }\n </div>\n );\n};\n\nconst ThemedCustomDropdown = themed(\n BaseCustomDropdown,\n 'CustomDropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseCustomDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: PT.arrayOf(optionValidator.isRequired),\n theme: ThemedCustomDropdown.themeType.isRequired,\n value: valueValidator,\n};\n\nBaseCustomDropdown.defaultProps = {\n filter: undefined,\n label: undefined,\n onChange: undefined,\n options: [],\n value: undefined,\n};\n\nexport default ThemedCustomDropdown;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactThemes","_Options","_interopRequireWildcard","_common","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultTheme","BaseCustomDropdown","filter","label","onChange","options","theme","value","Error","active","setActive","useState","dropdownRef","useRef","opsRef","opsPos","setOpsPos","upward","setUpward","useEffect","undefined","id","cb","anchor","current","getBoundingClientRect","opsRect","measure","fitsDown","bottom","height","window","visualViewport","fitsUp","top","up","pos","left","width","now","areEqual","requestAnimationFrame","cancelAnimationFrame","openList","view","rect","stopPropagation","selected","jsx","Fragment","children","length","option","iValue","iName","optionValueName","containerClassName","container","opsContainerClass","select","jsxs","className","dropdown","onClick","onKeyDown","key","ref","role","tabIndex","arrow","containerClass","containerStyle","onCancel","newValue","optionClass","ThemedCustomDropdown","themed","validThemeKeys","propTypes","PT","func","node","arrayOf","optionValidator","isRequired","themeType","valueValidator","_default","exports"],"sources":["../../../../../../src/shared/components/selectors/CustomDropdown/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport { useEffect, useRef, useState } from 'react';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport Options, { type ContainerPosT, type RefT, areEqual } from './Options';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n type ValueT,\n optionValidator,\n optionValueName,\n validThemeKeys,\n valueValidator,\n} from '../common';\n\nconst BaseCustomDropdown: React.FunctionComponent<\nPropsT<React.ReactNode, (value: ValueT) => void>\n> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\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 top: anchor.top - opsRect.height - 1,\n left: anchor.left,\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 (let i = 0; i < options.length; ++i) {\n const option = options[i];\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 = theme.container;\n if (active) containerClassName += ` ${theme.active}`;\n\n let opsContainerClass = theme.select || '';\n if (upward) {\n containerClassName += ` ${theme.upward}`;\n opsContainerClass += ` ${theme.upward}`;\n }\n\n return (\n <div className={containerClassName}>\n {label === undefined ? null : (\n <div className={theme.label}>{label}</div>\n )}\n <div\n className={theme.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={theme.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={theme.option || ''}\n options={options}\n ref={opsRef}\n />\n ) : null\n }\n </div>\n );\n};\n\nconst ThemedCustomDropdown = themed(\n BaseCustomDropdown,\n 'CustomDropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseCustomDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: PT.arrayOf(optionValidator.isRequired),\n theme: ThemedCustomDropdown.themeType.isRequired,\n value: valueValidator,\n};\n\nexport default ThemedCustomDropdown;\n"],"mappings":"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","ignoreList":[]}
@@ -103,12 +103,5 @@ Dropdown.propTypes = {
103
103
  theme: ThemedDropdown.themeType.isRequired,
104
104
  value: _common.valueValidator
105
105
  };
106
- Dropdown.defaultProps = {
107
- filter: undefined,
108
- label: undefined,
109
- onChange: undefined,
110
- options: [],
111
- value: ''
112
- };
113
106
  var _default = exports.default = ThemedDropdown;
114
107
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","Dropdown","filter","label","onChange","options","theme","value","Error","isValidValue","optionElements","i","length","option","iValue","iName","optionValueName","push","jsx","className","children","hiddenOption","disabled","jsxs","container","undefined","dropdown","select","arrow","ThemedDropdown","themed","validThemeKeys","propTypes","PT","func","node","stringOptionsValidator","themeType","isRequired","valueValidator","defaultProps","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/NativeDropdown/index.tsx"],"sourcesContent":["// Implements dropdown based on the native HTML <select> element.\n\nimport PT from 'prop-types';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n optionValueName,\n stringOptionsValidator,\n validThemeKeys,\n valueValidator,\n} from '../common';\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: React.FunctionComponent<PropsT<string>> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\n\n let isValidValue = false;\n const optionElements = [];\n\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n isValidValue ||= iValue === value;\n optionElements.push(\n <option className={theme.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 disabled\n className={theme.hiddenOption}\n key=\"__reactUtilsHiddenOption\"\n value={value}\n >\n {value}\n </option>\n );\n\n return (\n <div className={theme.container}>\n { label === undefined ? null : <div className={theme.label}>{label}</div> }\n <div className={theme.dropdown}>\n <select\n className={theme.select}\n onChange={onChange}\n value={value}\n >\n {hiddenOption}\n {optionElements}\n </select>\n <div className={theme.arrow} />\n </div>\n </div>\n );\n};\n\nconst ThemedDropdown = themed(\n Dropdown,\n 'Dropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: stringOptionsValidator,\n theme: ThemedDropdown.themeType.isRequired,\n value: valueValidator,\n};\n\nDropdown.defaultProps = {\n filter: undefined,\n label: undefined,\n onChange: undefined,\n options: [],\n value: '',\n};\n\nexport default ThemedDropdown;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","Dropdown","filter","label","onChange","options","theme","value","Error","isValidValue","optionElements","i","length","option","iValue","iName","optionValueName","push","jsx","className","children","hiddenOption","disabled","jsxs","container","undefined","dropdown","select","arrow","ThemedDropdown","themed","validThemeKeys","propTypes","PT","func","node","stringOptionsValidator","themeType","isRequired","valueValidator","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/NativeDropdown/index.tsx"],"sourcesContent":["// Implements dropdown based on the native HTML <select> element.\n\nimport PT from 'prop-types';\n\nimport themed from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\nimport {\n type PropsT,\n optionValueName,\n stringOptionsValidator,\n validThemeKeys,\n valueValidator,\n} from '../common';\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: React.FunctionComponent<PropsT<string>> = ({\n filter,\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options) throw Error('Internal error');\n\n let isValidValue = false;\n const optionElements = [];\n\n for (let i = 0; i < options.length; ++i) {\n const option = options[i];\n if (!filter || filter(option)) {\n const [iValue, iName] = optionValueName(option);\n isValidValue ||= iValue === value;\n optionElements.push(\n <option className={theme.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 disabled\n className={theme.hiddenOption}\n key=\"__reactUtilsHiddenOption\"\n value={value}\n >\n {value}\n </option>\n );\n\n return (\n <div className={theme.container}>\n { label === undefined ? null : <div className={theme.label}>{label}</div> }\n <div className={theme.dropdown}>\n <select\n className={theme.select}\n onChange={onChange}\n value={value}\n >\n {hiddenOption}\n {optionElements}\n </select>\n <div className={theme.arrow} />\n </div>\n </div>\n );\n};\n\nconst ThemedDropdown = themed(\n Dropdown,\n 'Dropdown',\n validThemeKeys,\n defaultTheme,\n);\n\nDropdown.propTypes = {\n filter: PT.func,\n label: PT.node,\n onChange: PT.func,\n options: stringOptionsValidator,\n theme: ThemedDropdown.themeType.isRequired,\n value: valueValidator,\n};\n\nexport default ThemedDropdown;\n"],"mappings":"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","ignoreList":[]}
@@ -66,11 +66,5 @@ BaseSwitch.propTypes = {
66
66
  theme: ThemedSwitch.themeType.isRequired,
67
67
  value: _common.valueValidator
68
68
  };
69
- BaseSwitch.defaultProps = {
70
- label: undefined,
71
- onChange: undefined,
72
- options: [],
73
- value: undefined
74
- };
75
69
  var _default = exports.default = ThemedSwitch;
76
70
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","validThemeKeys","BaseSwitch","label","onChange","options","theme","value","option","Error","optionNodes","i","length","iValue","iName","optionValueName","className","onPress","selected","push","jsx","onClick","onKeyDown","e","key","role","tabIndex","children","jsxs","container","ThemedSwitch","themed","propTypes","PT","node","func","optionsValidator","themeType","isRequired","valueValidator","defaultProps","undefined","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/Switch/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport {\n type OptionsT,\n type ValueT,\n optionsValidator,\n optionValueName,\n valueValidator,\n} from '../common';\n\nimport defaultTheme from './theme.scss';\n\nconst validThemeKeys = [\n 'container',\n 'label',\n 'option',\n 'options',\n 'selected',\n] as const;\n\ntype PropsT = {\n label?: React.ReactNode;\n onChange?: (value: ValueT) => void;\n options?: Readonly<OptionsT<React.ReactNode>>;\n theme: Theme<typeof validThemeKeys>;\n value?: ValueT;\n};\n\nconst BaseSwitch: React.FunctionComponent<PropsT> = ({\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options || !theme.option) throw Error('Internal error');\n\n const optionNodes: React.ReactNode[] = [];\n for (let i = 0; i < options?.length; ++i) {\n const [iValue, iName] = optionValueName(options[i]);\n\n let className: string = theme.option;\n let onPress: (() => void) | undefined;\n if (iValue === value) className += ` ${theme.selected}`;\n else if (onChange) onPress = () => onChange(iValue);\n\n optionNodes.push(\n onPress ? (\n <div\n className={className}\n onClick={onPress}\n onKeyDown={(e) => {\n if (onPress && e.key === 'Enter') onPress();\n }}\n key={iValue}\n role=\"button\"\n tabIndex={0}\n >\n {iName}\n </div>\n ) : (\n <div className={className} key={iValue}>{iName}</div>\n ),\n );\n }\n\n return (\n <div className={theme.container}>\n {label ? <div className={theme.label}>{label}</div> : null}\n <div className={theme.options}>\n {optionNodes}\n </div>\n </div>\n );\n};\n\nconst ThemedSwitch = themed(\n BaseSwitch,\n 'Switch',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseSwitch.propTypes = {\n label: PT.node,\n onChange: PT.func,\n options: optionsValidator,\n theme: ThemedSwitch.themeType.isRequired,\n value: valueValidator,\n};\n\nBaseSwitch.defaultProps = {\n label: undefined,\n onChange: undefined,\n options: [],\n value: undefined,\n};\n\nexport default ThemedSwitch;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_reactThemes","_common","_jsxRuntime","defaultTheme","validThemeKeys","BaseSwitch","label","onChange","options","theme","value","option","Error","optionNodes","i","length","iValue","iName","optionValueName","className","onPress","selected","push","jsx","onClick","onKeyDown","e","key","role","tabIndex","children","jsxs","container","ThemedSwitch","themed","propTypes","PT","node","func","optionsValidator","themeType","isRequired","valueValidator","_default","exports","default"],"sources":["../../../../../../src/shared/components/selectors/Switch/index.tsx"],"sourcesContent":["import PT from 'prop-types';\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport {\n type OptionsT,\n type ValueT,\n optionsValidator,\n optionValueName,\n valueValidator,\n} from '../common';\n\nimport defaultTheme from './theme.scss';\n\nconst validThemeKeys = [\n 'container',\n 'label',\n 'option',\n 'options',\n 'selected',\n] as const;\n\ntype PropsT = {\n label?: React.ReactNode;\n onChange?: (value: ValueT) => void;\n options?: Readonly<OptionsT<React.ReactNode>>;\n theme: Theme<typeof validThemeKeys>;\n value?: ValueT;\n};\n\nconst BaseSwitch: React.FunctionComponent<PropsT> = ({\n label,\n onChange,\n options,\n theme,\n value,\n}) => {\n if (!options || !theme.option) throw Error('Internal error');\n\n const optionNodes: React.ReactNode[] = [];\n for (let i = 0; i < options?.length; ++i) {\n const [iValue, iName] = optionValueName(options[i]);\n\n let className: string = theme.option;\n let onPress: (() => void) | undefined;\n if (iValue === value) className += ` ${theme.selected}`;\n else if (onChange) onPress = () => onChange(iValue);\n\n optionNodes.push(\n onPress ? (\n <div\n className={className}\n onClick={onPress}\n onKeyDown={(e) => {\n if (onPress && e.key === 'Enter') onPress();\n }}\n key={iValue}\n role=\"button\"\n tabIndex={0}\n >\n {iName}\n </div>\n ) : (\n <div className={className} key={iValue}>{iName}</div>\n ),\n );\n }\n\n return (\n <div className={theme.container}>\n {label ? <div className={theme.label}>{label}</div> : null}\n <div className={theme.options}>\n {optionNodes}\n </div>\n </div>\n );\n};\n\nconst ThemedSwitch = themed(\n BaseSwitch,\n 'Switch',\n validThemeKeys,\n defaultTheme,\n);\n\nBaseSwitch.propTypes = {\n label: PT.node,\n onChange: PT.func,\n options: optionsValidator,\n theme: ThemedSwitch.themeType.isRequired,\n value: valueValidator,\n};\n\nexport default ThemedSwitch;\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,OAAA,GAAAF,OAAA;AAMmB,IAAAG,WAAA,GAAAH,OAAA;AAAA,MAAAI,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAInB,MAAMC,cAAc,GAAG,CACrB,WAAW,EACX,OAAO,EACP,QAAQ,EACR,SAAS,EACT,UAAU,CACF;AAUV,MAAMC,UAA2C,GAAGA,CAAC;EACnDC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,IAAI,CAACF,OAAO,IAAI,CAACC,KAAK,CAACE,MAAM,EAAE,MAAMC,KAAK,CAAC,gBAAgB,CAAC;EAE5D,MAAMC,WAA8B,GAAG,EAAE;EACzC,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGN,OAAO,EAAEO,MAAM,EAAE,EAAED,CAAC,EAAE;IACxC,MAAM,CAACE,MAAM,EAAEC,KAAK,CAAC,GAAG,IAAAC,uBAAe,EAACV,OAAO,CAACM,CAAC,CAAC,CAAC;IAEnD,IAAIK,SAAiB,GAAGV,KAAK,CAACE,MAAM;IACpC,IAAIS,OAAiC;IACrC,IAAIJ,MAAM,KAAKN,KAAK,EAAES,SAAS,IAAK,IAAGV,KAAK,CAACY,QAAS,EAAC,CAAC,KACnD,IAAId,QAAQ,EAAEa,OAAO,GAAGA,CAAA,KAAMb,QAAQ,CAACS,MAAM,CAAC;IAEnDH,WAAW,CAACS,IAAI,CACdF,OAAO,gBACL,IAAAlB,WAAA,CAAAqB,GAAA;MACEJ,SAAS,EAAEA,SAAU;MACrBK,OAAO,EAAEJ,OAAQ;MACjBK,SAAS,EAAGC,CAAC,IAAK;QAChB,IAAIN,OAAO,IAAIM,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEP,OAAO,CAAC,CAAC;MAC7C,CAAE;MAEFQ,IAAI,EAAC,QAAQ;MACbC,QAAQ,EAAE,CAAE;MAAAC,QAAA,EAEXb;IAAK,GAJDD,MAKF,CAAC,gBAEN,IAAAd,WAAA,CAAAqB,GAAA;MAAKJ,SAAS,EAAEA,SAAU;MAAAW,QAAA,EAAeb;IAAK,GAAdD,MAAoB,CAExD,CAAC;EACH;EAEA,oBACE,IAAAd,WAAA,CAAA6B,IAAA;IAAKZ,SAAS,EAAEV,KAAK,CAACuB,SAAU;IAAAF,QAAA,GAC7BxB,KAAK,gBAAG,IAAAJ,WAAA,CAAAqB,GAAA;MAAKJ,SAAS,EAAEV,KAAK,CAACH,KAAM;MAAAwB,QAAA,EAAExB;IAAK,CAAM,CAAC,GAAG,IAAI,eAC1D,IAAAJ,WAAA,CAAAqB,GAAA;MAAKJ,SAAS,EAAEV,KAAK,CAACD,OAAQ;MAAAsB,QAAA,EAC3BjB;IAAW,CACT,CAAC;EAAA,CACH,CAAC;AAEV,CAAC;AAED,MAAMoB,YAAY,GAAG,IAAAC,oBAAM,EACzB7B,UAAU,EACV,QAAQ,EACRD,cAAc,EACdD,YACF,CAAC;AAEDE,UAAU,CAAC8B,SAAS,GAAG;EACrB7B,KAAK,EAAE8B,kBAAE,CAACC,IAAI;EACd9B,QAAQ,EAAE6B,kBAAE,CAACE,IAAI;EACjB9B,OAAO,EAAE+B,wBAAgB;EACzB9B,KAAK,EAAEwB,YAAY,CAACO,SAAS,CAACC,UAAU;EACxC/B,KAAK,EAAEgC;AACT,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEaZ,YAAY","ignoreList":[]}
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  Object.defineProperty(exports, "act", {
8
8
  enumerable: true,
9
9
  get: function () {
10
- return _testUtils.act;
10
+ return _react.act;
11
11
  }
12
12
  });
13
13
  Object.defineProperty(exports, "getGlobal", {
@@ -20,32 +20,19 @@ exports.getMockUuid = getMockUuid;
20
20
  exports.mockClientSide = mockClientSide;
21
21
  exports.mockTimer = mockTimer;
22
22
  exports.mount = mount;
23
- exports.render = render;
24
- exports.shallowRender = shallowRender;
25
- exports.shallowSnapshot = shallowSnapshot;
26
- exports.simulate = void 0;
27
23
  exports.snapshot = snapshot;
28
24
  exports.unmockClientSide = unmockClientSide;
29
25
  var _mockdate = _interopRequireDefault(require("mockdate"));
30
- require("react");
26
+ var _react = require("react");
31
27
  var _client = require("react-dom/client");
32
- var _testUtils = _interopRequireWildcard(require("react-dom/test-utils"));
33
- var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
34
- var _shallow = require("react-test-renderer/shallow");
28
+ var _react2 = require("@testing-library/react");
35
29
  var _global = _interopRequireDefault(require("./global"));
36
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
37
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
38
- /* global expect, jest, document */
30
+ /* global jest, document */
39
31
  /* eslint-disable import/no-extraneous-dependencies */
40
32
 
41
- /* eslint-disable import/no-extraneous-dependencies */
42
-
43
- /* eslint-enable import/no-extraneous-dependencies */
44
-
45
33
  /**
46
34
  * An alias for [act(..)](https://reactjs.org/docs/test-utils.html#act)
47
- * from `react-dom/test-utils`.
48
- * @param {function} action
35
+ * from `react`.
49
36
  */
50
37
 
51
38
  global.IS_REACT_ACT_ENVIRONMENT = true;
@@ -104,71 +91,25 @@ function mount(scene) {
104
91
  document.body.appendChild(element);
105
92
  const res = element;
106
93
  res.destroy = () => {
107
- (0, _testUtils.act)(() => root.unmount());
94
+ // NOTE: As it seems @testing-library may reset this flag to false
95
+ // when it is simulating user events.
96
+ global.IS_REACT_ACT_ENVIRONMENT = true;
97
+ (0, _react.act)(() => root.unmount());
108
98
  res.remove();
109
99
  };
110
- (0, _testUtils.act)(() => {
100
+
101
+ // NOTE: As it seems @testing-library may reset this flag to false
102
+ // when it is simulating user events.
103
+ global.IS_REACT_ACT_ENVIRONMENT = true;
104
+ (0, _react.act)(() => {
111
105
  root = (0, _client.createRoot)(res);
112
106
  root.render(scene);
113
107
  });
114
108
  return res;
115
109
  }
116
-
117
- /* OLD STUFF BELOW THIS MARK */
118
-
119
- /**
120
- * Renders provided ReactJS component into JSON representation of the component
121
- * tree, using [`react-test-renderer`](https://www.npmjs.com/package/react-test-renderer).
122
- * @param {object} component ReactJS component to render.
123
- * @return {object} JSON representation of the rendered tree.
124
- * @example
125
- * import { JU } from '@dr.pogodin/react-utils';
126
- * console.log(JU.render(<div>Example</div>));
127
- */
128
- function render(component) {
129
- return _reactTestRenderer.default.create(component).toJSON();
130
- }
131
-
132
- /**
133
- * Generates a shallow render of given ReactJS component, using
134
- * [react-test-renderer/shallow](https://reactjs.org/docs/shallow-renderer.html)
135
- * and returns the result.
136
- * @param {object} component ReactJS component to render.
137
- * @return {object} JSON representation of the shallow component's render tree.
138
- */
139
- function shallowRender(component) {
140
- const renderer = (0, _shallow.createRenderer)();
141
- renderer.render(component);
142
- return renderer.getRenderOutput();
143
- }
144
-
145
- /**
146
- * Makes a shallow snapshot test of the given ReactJS component, and also
147
- * returns JSON representation of the rendered component tree. Under the hood
148
- * it uses {@link module:JU.shallowRender shallowRender(..)} to generate
149
- * the render, then executes `expect(RENDER_RESULT).toMatchSnapshot()`,
150
- * and finally returns the `RENDER_RESULT` to the caller.
151
- * @param {object} component ReactJS component to render.
152
- * @return {object} JSON representation of shallow render.
153
- */
154
- function shallowSnapshot(component) {
155
- const res = shallowRender(component);
156
- expect(res).toMatchSnapshot();
157
- return res;
158
- }
159
-
160
- /**
161
- * Makes snapshot test of the given ReactJS component, and also returns JSON
162
- * representation of the rendered component tree. Under the hood, it uses
163
- * {@link module:JU.render render(..)} to render it, then executes
164
- * `expect(RENDER_RESULT).toMatchSnapshot()`, and then returns `RENDER_RESULT`.
165
- * @param {object} component ReactJS component to render.
166
- * @return {object} JSON render of the component.
167
- */
168
- function snapshot(component) {
169
- const res = render(component);
110
+ function snapshot(element) {
111
+ const res = (0, _react2.render)(element).asFragment().firstChild;
170
112
  expect(res).toMatchSnapshot();
171
113
  return res;
172
114
  }
173
- const simulate = exports.simulate = _testUtils.default.Simulate;
174
115
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_mockdate","_interopRequireDefault","require","_client","_testUtils","_interopRequireWildcard","_reactTestRenderer","_shallow","_global","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","global","IS_REACT_ACT_ENVIRONMENT","originalProcessVersions","process","versions","mockClientSide","value","unmockClientSide","writable","getMockUuid","seed","x","toString","padStart","slice","mockTimer","time","mockdate","Date","now","jest","advanceTimersByTime","mount","scene","root","element","document","createElement","body","appendChild","res","destroy","act","unmount","remove","createRoot","render","component","Renderer","create","toJSON","shallowRender","renderer","createRenderer","getRenderOutput","shallowSnapshot","expect","toMatchSnapshot","snapshot","simulate","exports","TU","Simulate"],"sources":["../../../../../src/shared/utils/jest/index.tsx"],"sourcesContent":["/* global expect, jest, document */\n/* eslint-disable import/no-extraneous-dependencies */\n\nimport mockdate from 'mockdate';\nimport { type ReactElement, type ReactNode } from 'react';\nimport { type Root, createRoot } from 'react-dom/client';\nimport TU, { act } from 'react-dom/test-utils';\n\n/* eslint-disable import/no-extraneous-dependencies */\nimport Renderer from 'react-test-renderer';\nimport { type ShallowRenderer, createRenderer } from 'react-test-renderer/shallow';\n/* eslint-enable import/no-extraneous-dependencies */\n\n/**\n * An alias for [act(..)](https://reactjs.org/docs/test-utils.html#act)\n * from `react-dom/test-utils`.\n * @param {function} action\n */\nexport { act };\n\nexport { default as getGlobal } from './global';\n\ndeclare global {\n // eslint-disable-next-line no-var, vars-on-top\n var IS_REACT_ACT_ENVIRONMENT: boolean | undefined;\n}\n\nglobal.IS_REACT_ACT_ENVIRONMENT = true;\n\nconst originalProcessVersions = process.versions;\n\n/**\n * Tricks **react-utils** into thinking the test is running within client-side\n * (browser) environment.\n */\nexport function mockClientSide() {\n Object.defineProperty(process, 'versions', { value: null });\n}\n\n/**\n * Reverts the effect of {@link module:JU.mockClientSide mockClientSide(..)}.\n */\nexport function unmockClientSide() {\n Object.defineProperty(process, 'versions', {\n value: originalProcessVersions,\n writable: false,\n });\n}\n\n/**\n * Generates a mock UUID, or better said it determenistically transforms given\n * `seed` number into a UUID-formatted string.\n * @param {number} seed\n * @return {string}\n */\nexport function getMockUuid(seed = 0) {\n const x = seed.toString(16).padStart(32, '0');\n return `${x.slice(0, 8)}-${x.slice(8, 12)}-${x.slice(12, 16)}-${x.slice(16, 20)}-${x.slice(20)}`;\n}\n\n/**\n * Advances mock timers, and mock date by the specified time.\n * @param {number} time Time step [ms].\n * @returns {Promise} Wait for this to \"jump after\" any async code which should\n * be executed because of the mock time movement.\n */\nexport async function mockTimer(time: number) {\n mockdate.set(time + Date.now());\n jest.advanceTimersByTime(time);\n}\n\nexport type MountedSceneT = HTMLElement & {\n destroy: () => void;\n};\n\n/**\n * Mounts `scene` to the DOM, and returns the root scene element.\n * @param scene\n * @return Created container DOM element with destroy() function\n * attached.\n */\nexport function mount(scene: ReactNode): MountedSceneT {\n let root: Root;\n const element = document.createElement('div');\n document.body.appendChild(element);\n\n const res: MountedSceneT = (element as unknown) as MountedSceneT;\n res.destroy = () => {\n act(() => root.unmount());\n res.remove();\n };\n\n act(() => {\n root = createRoot(res);\n root.render(scene);\n });\n return res;\n}\n\n/* OLD STUFF BELOW THIS MARK */\n\n/**\n * Renders provided ReactJS component into JSON representation of the component\n * tree, using [`react-test-renderer`](https://www.npmjs.com/package/react-test-renderer).\n * @param {object} component ReactJS component to render.\n * @return {object} JSON representation of the rendered tree.\n * @example\n * import { JU } from '@dr.pogodin/react-utils';\n * console.log(JU.render(<div>Example</div>));\n */\nexport function render(component: ReactElement) {\n return Renderer.create(component).toJSON();\n}\n\n/**\n * Generates a shallow render of given ReactJS component, using\n * [react-test-renderer/shallow](https://reactjs.org/docs/shallow-renderer.html)\n * and returns the result.\n * @param {object} component ReactJS component to render.\n * @return {object} JSON representation of the shallow component's render tree.\n */\nexport function shallowRender(component: ReactElement) {\n const renderer: ShallowRenderer = createRenderer();\n renderer.render(component);\n return renderer.getRenderOutput();\n}\n\n/**\n * Makes a shallow snapshot test of the given ReactJS component, and also\n * returns JSON representation of the rendered component tree. Under the hood\n * it uses {@link module:JU.shallowRender shallowRender(..)} to generate\n * the render, then executes `expect(RENDER_RESULT).toMatchSnapshot()`,\n * and finally returns the `RENDER_RESULT` to the caller.\n * @param {object} component ReactJS component to render.\n * @return {object} JSON representation of shallow render.\n */\nexport function shallowSnapshot(component: ReactElement) {\n const res = shallowRender(component);\n expect(res).toMatchSnapshot();\n return res;\n}\n\n/**\n * Makes snapshot test of the given ReactJS component, and also returns JSON\n * representation of the rendered component tree. Under the hood, it uses\n * {@link module:JU.render render(..)} to render it, then executes\n * `expect(RENDER_RESULT).toMatchSnapshot()`, and then returns `RENDER_RESULT`.\n * @param {object} component ReactJS component to render.\n * @return {object} JSON render of the component.\n */\nexport function snapshot(component: ReactElement) {\n const res = render(component);\n expect(res).toMatchSnapshot();\n return res;\n}\n\nexport const simulate = TU.Simulate;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_mockdate","_interopRequireDefault","require","_react","_client","_react2","_global","global","IS_REACT_ACT_ENVIRONMENT","originalProcessVersions","process","versions","mockClientSide","Object","defineProperty","value","unmockClientSide","writable","getMockUuid","seed","x","toString","padStart","slice","mockTimer","time","mockdate","set","Date","now","jest","advanceTimersByTime","mount","scene","root","element","document","createElement","body","appendChild","res","destroy","act","unmount","remove","createRoot","render","snapshot","asFragment","firstChild","expect","toMatchSnapshot"],"sources":["../../../../../src/shared/utils/jest/index.tsx"],"sourcesContent":["/* global jest, document */\n/* eslint-disable import/no-extraneous-dependencies */\n\nimport mockdate from 'mockdate';\nimport { type ReactNode, act } from 'react';\nimport { type Root, createRoot } from 'react-dom/client';\n\nimport { render } from '@testing-library/react';\n\n/**\n * An alias for [act(..)](https://reactjs.org/docs/test-utils.html#act)\n * from `react`.\n */\nexport { act };\n\nexport { default as getGlobal } from './global';\n\ndeclare global {\n // eslint-disable-next-line no-var, vars-on-top\n var IS_REACT_ACT_ENVIRONMENT: boolean | undefined;\n}\n\nglobal.IS_REACT_ACT_ENVIRONMENT = true;\n\nconst originalProcessVersions = process.versions;\n\n/**\n * Tricks **react-utils** into thinking the test is running within client-side\n * (browser) environment.\n */\nexport function mockClientSide() {\n Object.defineProperty(process, 'versions', { value: null });\n}\n\n/**\n * Reverts the effect of {@link module:JU.mockClientSide mockClientSide(..)}.\n */\nexport function unmockClientSide() {\n Object.defineProperty(process, 'versions', {\n value: originalProcessVersions,\n writable: false,\n });\n}\n\n/**\n * Generates a mock UUID, or better said it determenistically transforms given\n * `seed` number into a UUID-formatted string.\n * @param {number} seed\n * @return {string}\n */\nexport function getMockUuid(seed = 0) {\n const x = seed.toString(16).padStart(32, '0');\n return `${x.slice(0, 8)}-${x.slice(8, 12)}-${x.slice(12, 16)}-${x.slice(16, 20)}-${x.slice(20)}`;\n}\n\n/**\n * Advances mock timers, and mock date by the specified time.\n * @param {number} time Time step [ms].\n * @returns {Promise} Wait for this to \"jump after\" any async code which should\n * be executed because of the mock time movement.\n */\nexport async function mockTimer(time: number) {\n mockdate.set(time + Date.now());\n jest.advanceTimersByTime(time);\n}\n\nexport type MountedSceneT = HTMLElement & {\n destroy: () => void;\n};\n\n/**\n * Mounts `scene` to the DOM, and returns the root scene element.\n * @param scene\n * @return Created container DOM element with destroy() function\n * attached.\n */\nexport function mount(scene: ReactNode): MountedSceneT {\n let root: Root;\n const element = document.createElement('div');\n document.body.appendChild(element);\n\n const res: MountedSceneT = (element as unknown) as MountedSceneT;\n res.destroy = () => {\n // NOTE: As it seems @testing-library may reset this flag to false\n // when it is simulating user events.\n global.IS_REACT_ACT_ENVIRONMENT = true;\n\n act(() => root.unmount());\n res.remove();\n };\n\n // NOTE: As it seems @testing-library may reset this flag to false\n // when it is simulating user events.\n global.IS_REACT_ACT_ENVIRONMENT = true;\n\n act(() => {\n root = createRoot(res);\n root.render(scene);\n });\n return res;\n}\n\nexport function snapshot(element: React.ReactElement) {\n const res = render(element).asFragment().firstChild;\n expect(res).toMatchSnapshot();\n return res;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAGA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAQA,IAAAI,OAAA,GAAAL,sBAAA,CAAAC,OAAA;AAfA;AACA;;AAQA;AACA;AACA;AACA;;AAUAK,MAAM,CAACC,wBAAwB,GAAG,IAAI;AAEtC,MAAMC,uBAAuB,GAAGC,OAAO,CAACC,QAAQ;;AAEhD;AACA;AACA;AACA;AACO,SAASC,cAAcA,CAAA,EAAG;EAC/BC,MAAM,CAACC,cAAc,CAACJ,OAAO,EAAE,UAAU,EAAE;IAAEK,KAAK,EAAE;EAAK,CAAC,CAAC;AAC7D;;AAEA;AACA;AACA;AACO,SAASC,gBAAgBA,CAAA,EAAG;EACjCH,MAAM,CAACC,cAAc,CAACJ,OAAO,EAAE,UAAU,EAAE;IACzCK,KAAK,EAAEN,uBAAuB;IAC9BQ,QAAQ,EAAE;EACZ,CAAC,CAAC;AACJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAACC,IAAI,GAAG,CAAC,EAAE;EACpC,MAAMC,CAAC,GAAGD,IAAI,CAACE,QAAQ,CAAC,EAAE,CAAC,CAACC,QAAQ,CAAC,EAAE,EAAE,GAAG,CAAC;EAC7C,OAAQ,GAAEF,CAAC,CAACG,KAAK,CAAC,CAAC,EAAE,CAAC,CAAE,IAAGH,CAAC,CAACG,KAAK,CAAC,CAAC,EAAE,EAAE,CAAE,IAAGH,CAAC,CAACG,KAAK,CAAC,EAAE,EAAE,EAAE,CAAE,IAAGH,CAAC,CAACG,KAAK,CAAC,EAAE,EAAE,EAAE,CAAE,IAAGH,CAAC,CAACG,KAAK,CAAC,EAAE,CAAE,EAAC;AAClG;;AAEA;AACA;AACA;AACA;AACA;AACA;AACO,eAAeC,SAASA,CAACC,IAAY,EAAE;EAC5CC,iBAAQ,CAACC,GAAG,CAACF,IAAI,GAAGG,IAAI,CAACC,GAAG,CAAC,CAAC,CAAC;EAC/BC,IAAI,CAACC,mBAAmB,CAACN,IAAI,CAAC;AAChC;AAMA;AACA;AACA;AACA;AACA;AACA;AACO,SAASO,KAAKA,CAACC,KAAgB,EAAiB;EACrD,IAAIC,IAAU;EACd,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAC7CD,QAAQ,CAACE,IAAI,CAACC,WAAW,CAACJ,OAAO,CAAC;EAElC,MAAMK,GAAkB,GAAIL,OAAoC;EAChEK,GAAG,CAACC,OAAO,GAAG,MAAM;IAClB;IACA;IACAlC,MAAM,CAACC,wBAAwB,GAAG,IAAI;IAEtC,IAAAkC,UAAG,EAAC,MAAMR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;IACzBH,GAAG,CAACI,MAAM,CAAC,CAAC;EACd,CAAC;;EAED;EACA;EACArC,MAAM,CAACC,wBAAwB,GAAG,IAAI;EAEtC,IAAAkC,UAAG,EAAC,MAAM;IACRR,IAAI,GAAG,IAAAW,kBAAU,EAACL,GAAG,CAAC;IACtBN,IAAI,CAACY,MAAM,CAACb,KAAK,CAAC;EACpB,CAAC,CAAC;EACF,OAAOO,GAAG;AACZ;AAEO,SAASO,QAAQA,CAACZ,OAA2B,EAAE;EACpD,MAAMK,GAAG,GAAG,IAAAM,cAAM,EAACX,OAAO,CAAC,CAACa,UAAU,CAAC,CAAC,CAACC,UAAU;EACnDC,MAAM,CAACV,GAAG,CAAC,CAACW,eAAe,CAAC,CAAC;EAC7B,OAAOX,GAAG;AACZ","ignoreList":[]}
@@ -205,9 +205,6 @@ function splitComponent({
205
205
  CodeSplit.propTypes = {
206
206
  children: _propTypes.default.node
207
207
  };
208
- CodeSplit.defaultProps = {
209
- children: undefined
210
- };
211
208
  return CodeSplit;
212
209
  }
213
210
  //# sourceMappingURL=splitComponent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"splitComponent.js","names":["_propTypes","_interopRequireDefault","require","_react","_jsUtils","_globalState","_isomorphy","_jsxRuntime","clientChunkGroups","IS_CLIENT_SIDE","default","CHUNK_GROUPS","refCounts","getPublicPath","getBuildInfo","publicPath","bookStyleSheet","name","loadedSheets","refCount","res","path","fullPath","document","location","origin","has","link","querySelector","createElement","setAttribute","head","appendChild","Barrier","addEventListener","resolve","current","getLoadedStyleSheets","Set","styleSheets","i","length","href","add","assertChunkName","chunkName","chunkGroups","Error","bookStyleSheets","promises","assets","asset","endsWith","promise","push","Promise","allSettled","then","freeStyleSheets","remove","usedChunkNames","splitComponent","getComponent","placeholder","LazyComponent","lazy","resolved","Component","Wrapper","forwardRef","children","rest","ref","IS_SERVER_SIDE","chunks","getSsrContext","includes","useInsertionEffect","jsx","CodeSplit","Suspense","fallback","propTypes","PT","node","defaultProps","undefined"],"sources":["../../../../src/shared/utils/splitComponent.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* global document */\n\nimport PT from 'prop-types';\n\nimport {\n type ComponentType,\n type ReactNode,\n forwardRef,\n lazy,\n Suspense,\n useInsertionEffect,\n} from 'react';\n\nimport { Barrier } from '@dr.pogodin/js-utils';\n\nimport { type ChunkGroupsT, getSsrContext } from './globalState';\n\nimport {\n IS_CLIENT_SIDE,\n IS_SERVER_SIDE,\n getBuildInfo,\n} from './isomorphy';\n\n// Note: At the client side we can get chunk groups immediately when loading\n// the module; at the server-side we only can get them within React render flow.\n// Thus, we set and use the following variable at the client-side, and then when\n// needed on the server side, we'll fetch it differently.\nlet clientChunkGroups: ChunkGroupsT;\n\nif (IS_CLIENT_SIDE) {\n // eslint-disable-next-line global-require\n clientChunkGroups = require('client/getInj').default().CHUNK_GROUPS || {};\n}\n\nconst refCounts: { [path: string]: number } = {};\n\nfunction getPublicPath() {\n return getBuildInfo().publicPath;\n}\n\n/**\n * Client-side only! Ensures the specified CSS stylesheet is loaded into\n * the document; loads if it is missing; and does simple reference counting\n * to facilitate future clean-up.\n * @param name\n * @param loadedSheets\n * @param refCount\n * @return\n */\nfunction bookStyleSheet(\n name: string,\n loadedSheets: Set<string>,\n refCount: boolean,\n): Promise<void> | undefined {\n let res: Barrier<void> | undefined;\n const path = `${getPublicPath()}/${name}`;\n const fullPath = `${document.location.origin}${path}`;\n\n if (!loadedSheets.has(fullPath)) {\n let link = document.querySelector(`link[href=\"${path}\"]`);\n\n if (!link) {\n link = document.createElement('link');\n link.setAttribute('rel', 'stylesheet');\n link.setAttribute('href', path);\n document.head.appendChild(link);\n }\n\n res = new Barrier<void>();\n link.addEventListener('load', () => res!.resolve());\n link.addEventListener('error', () => res!.resolve());\n }\n\n if (refCount) {\n const current = refCounts[path] || 0;\n refCounts[path] = 1 + current;\n }\n\n return res;\n}\n\n/**\n * Generates the set of URLs for currently loaded, linked stylesheets.\n * @return\n */\nfunction getLoadedStyleSheets(): Set<string> {\n const res = new Set<string>();\n const { styleSheets } = document;\n for (let i = 0; i < styleSheets.length; ++i) {\n const { href } = styleSheets[i];\n if (href) res.add(href);\n }\n return res;\n}\n\nfunction assertChunkName(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n) {\n if (chunkGroups[chunkName]) return;\n throw Error(`Unknown chunk name \"${chunkName}\"`);\n}\n\n/**\n * Client-side only! Ensures all CSS stylesheets required for the specified\n * code chunk are loaded into the document; loads the missing ones; and does\n * simple reference counting to facilitate future clean-up.\n * @param chunkName Chunk name.\n * @param refCount\n * @return Resolves once all pending stylesheets, necessary for\n * the chunk, are either loaded, or failed to load.\n */\nexport function bookStyleSheets(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n refCount: boolean,\n): Promise<void> {\n const promises = [];\n const assets = chunkGroups[chunkName];\n const loadedSheets = getLoadedStyleSheets();\n\n for (let i = 0; i < assets.length; ++i) {\n const asset = assets[i];\n if (asset.endsWith('.css')) {\n const promise = bookStyleSheet(asset, loadedSheets, refCount);\n if (promise) promises.push(promise);\n }\n }\n\n return promises.length\n ? Promise.allSettled(promises).then()\n : Promise.resolve();\n}\n\n/**\n * Client-side only! Frees from the document all CSS stylesheets that are\n * required by the specified chunk, and have reference counter equal to one\n * (for chunks with larger reference counter values, it just decrements\n * the reference counter).\n * @param {string} chunkName\n */\nexport function freeStyleSheets(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n) {\n const assets = chunkGroups[chunkName];\n for (let i = 0; i < assets.length; ++i) {\n const asset = assets[i];\n if (asset.endsWith('.css')) {\n const path = `${getPublicPath()}/${asset}`;\n if (--refCounts[path] <= 0) {\n document.head.querySelector(`link[href=\"${path}\"]`)!.remove();\n }\n }\n }\n}\n\n// Holds the set of chunk names already used for splitComponent() calls.\nconst usedChunkNames = new Set();\n\ntype ComponentOrModule<PropsT> = ComponentType<PropsT> | {\n default: ComponentType<PropsT>,\n};\n\n/**\n * Given an async component retrieval function `getComponent()` it creates\n * a special \"code split\" component, which uses <Suspense> to asynchronously\n * load on demand the code required by `getComponent()`.\n * @param options\n * @param options.chunkName\n * @param {function} options.getComponent\n * @param {React.Element} [options.placeholder]\n * @return {React.ElementType}\n */\nexport default function splitComponent<\n ComponentPropsT extends { children?: ReactNode },\n>({\n chunkName,\n getComponent,\n placeholder,\n}: {\n chunkName: string;\n getComponent: () => Promise<ComponentOrModule<ComponentPropsT>>,\n placeholder?: ReactNode,\n}) {\n // On the client side we can check right away if the chunk name is known.\n if (IS_CLIENT_SIDE) assertChunkName(chunkName, clientChunkGroups);\n\n // The correct usage of splitComponent() assumes a single call per chunk.\n if (usedChunkNames.has(chunkName)) {\n throw Error(`Repeated splitComponent() call for the chunk \"${chunkName}\"`);\n } else usedChunkNames.add(chunkName);\n\n const LazyComponent = lazy(async () => {\n const resolved = await getComponent();\n const Component = 'default' in resolved ? resolved.default : resolved;\n\n // This pre-loads necessary stylesheets prior to the first mount of\n // the component (the lazy load function is executed by React one at\n // the frist mount).\n if (IS_CLIENT_SIDE) {\n await bookStyleSheets(chunkName, clientChunkGroups, false);\n }\n\n const Wrapper = forwardRef((\n { children, ...rest }: ComponentPropsT,\n ref,\n ) => {\n // On the server side we'll assert the chunk name here,\n // and also push it to the SSR chunks array.\n if (IS_SERVER_SIDE) {\n const { chunkGroups, chunks } = getSsrContext()!;\n assertChunkName(chunkName, chunkGroups);\n if (!chunks.includes(chunkName)) chunks.push(chunkName);\n }\n\n // This takes care about stylesheets management every time an instance of\n // this component is mounted / unmounted.\n useInsertionEffect(() => {\n bookStyleSheets(chunkName, clientChunkGroups, true);\n return () => freeStyleSheets(chunkName, clientChunkGroups);\n }, []);\n\n return (\n <Component ref={ref} {...rest as ComponentPropsT}>\n {children}\n </Component>\n );\n });\n\n return { default: Wrapper };\n });\n\n const CodeSplit: React.FunctionComponent<ComponentPropsT> = ({\n children,\n ...rest\n }: ComponentPropsT) => (\n <Suspense fallback={placeholder}>\n <LazyComponent {...rest as Parameters<typeof LazyComponent>[0]}>\n {children}\n </LazyComponent>\n </Suspense>\n );\n\n CodeSplit.propTypes = {\n children: PT.node,\n } as React.WeakValidationMap<ComponentPropsT>;\n\n CodeSplit.defaultProps = {\n children: undefined,\n } as Partial<ComponentPropsT>;\n\n return CodeSplit;\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"splitComponent.js","names":["_propTypes","_interopRequireDefault","require","_react","_jsUtils","_globalState","_isomorphy","_jsxRuntime","clientChunkGroups","IS_CLIENT_SIDE","default","CHUNK_GROUPS","refCounts","getPublicPath","getBuildInfo","publicPath","bookStyleSheet","name","loadedSheets","refCount","res","path","fullPath","document","location","origin","has","link","querySelector","createElement","setAttribute","head","appendChild","Barrier","addEventListener","resolve","current","getLoadedStyleSheets","Set","styleSheets","i","length","href","add","assertChunkName","chunkName","chunkGroups","Error","bookStyleSheets","promises","assets","asset","endsWith","promise","push","Promise","allSettled","then","freeStyleSheets","remove","usedChunkNames","splitComponent","getComponent","placeholder","LazyComponent","lazy","resolved","Component","Wrapper","forwardRef","children","rest","ref","IS_SERVER_SIDE","chunks","getSsrContext","includes","useInsertionEffect","jsx","CodeSplit","Suspense","fallback","propTypes","PT","node"],"sources":["../../../../src/shared/utils/splitComponent.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* global document */\n\nimport PT from 'prop-types';\n\nimport {\n type ComponentType,\n type ReactNode,\n forwardRef,\n lazy,\n Suspense,\n useInsertionEffect,\n} from 'react';\n\nimport { Barrier } from '@dr.pogodin/js-utils';\n\nimport { type ChunkGroupsT, getSsrContext } from './globalState';\n\nimport {\n IS_CLIENT_SIDE,\n IS_SERVER_SIDE,\n getBuildInfo,\n} from './isomorphy';\n\n// Note: At the client side we can get chunk groups immediately when loading\n// the module; at the server-side we only can get them within React render flow.\n// Thus, we set and use the following variable at the client-side, and then when\n// needed on the server side, we'll fetch it differently.\nlet clientChunkGroups: ChunkGroupsT;\n\nif (IS_CLIENT_SIDE) {\n // eslint-disable-next-line global-require\n clientChunkGroups = require('client/getInj').default().CHUNK_GROUPS || {};\n}\n\nconst refCounts: { [path: string]: number } = {};\n\nfunction getPublicPath() {\n return getBuildInfo().publicPath;\n}\n\n/**\n * Client-side only! Ensures the specified CSS stylesheet is loaded into\n * the document; loads if it is missing; and does simple reference counting\n * to facilitate future clean-up.\n * @param name\n * @param loadedSheets\n * @param refCount\n * @return\n */\nfunction bookStyleSheet(\n name: string,\n loadedSheets: Set<string>,\n refCount: boolean,\n): Promise<void> | undefined {\n let res: Barrier<void> | undefined;\n const path = `${getPublicPath()}/${name}`;\n const fullPath = `${document.location.origin}${path}`;\n\n if (!loadedSheets.has(fullPath)) {\n let link = document.querySelector(`link[href=\"${path}\"]`);\n\n if (!link) {\n link = document.createElement('link');\n link.setAttribute('rel', 'stylesheet');\n link.setAttribute('href', path);\n document.head.appendChild(link);\n }\n\n res = new Barrier<void>();\n link.addEventListener('load', () => res!.resolve());\n link.addEventListener('error', () => res!.resolve());\n }\n\n if (refCount) {\n const current = refCounts[path] || 0;\n refCounts[path] = 1 + current;\n }\n\n return res;\n}\n\n/**\n * Generates the set of URLs for currently loaded, linked stylesheets.\n * @return\n */\nfunction getLoadedStyleSheets(): Set<string> {\n const res = new Set<string>();\n const { styleSheets } = document;\n for (let i = 0; i < styleSheets.length; ++i) {\n const { href } = styleSheets[i];\n if (href) res.add(href);\n }\n return res;\n}\n\nfunction assertChunkName(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n) {\n if (chunkGroups[chunkName]) return;\n throw Error(`Unknown chunk name \"${chunkName}\"`);\n}\n\n/**\n * Client-side only! Ensures all CSS stylesheets required for the specified\n * code chunk are loaded into the document; loads the missing ones; and does\n * simple reference counting to facilitate future clean-up.\n * @param chunkName Chunk name.\n * @param refCount\n * @return Resolves once all pending stylesheets, necessary for\n * the chunk, are either loaded, or failed to load.\n */\nexport function bookStyleSheets(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n refCount: boolean,\n): Promise<void> {\n const promises = [];\n const assets = chunkGroups[chunkName];\n const loadedSheets = getLoadedStyleSheets();\n\n for (let i = 0; i < assets.length; ++i) {\n const asset = assets[i];\n if (asset.endsWith('.css')) {\n const promise = bookStyleSheet(asset, loadedSheets, refCount);\n if (promise) promises.push(promise);\n }\n }\n\n return promises.length\n ? Promise.allSettled(promises).then()\n : Promise.resolve();\n}\n\n/**\n * Client-side only! Frees from the document all CSS stylesheets that are\n * required by the specified chunk, and have reference counter equal to one\n * (for chunks with larger reference counter values, it just decrements\n * the reference counter).\n * @param {string} chunkName\n */\nexport function freeStyleSheets(\n chunkName: string,\n chunkGroups: ChunkGroupsT,\n) {\n const assets = chunkGroups[chunkName];\n for (let i = 0; i < assets.length; ++i) {\n const asset = assets[i];\n if (asset.endsWith('.css')) {\n const path = `${getPublicPath()}/${asset}`;\n if (--refCounts[path] <= 0) {\n document.head.querySelector(`link[href=\"${path}\"]`)!.remove();\n }\n }\n }\n}\n\n// Holds the set of chunk names already used for splitComponent() calls.\nconst usedChunkNames = new Set();\n\ntype ComponentOrModule<PropsT> = ComponentType<PropsT> | {\n default: ComponentType<PropsT>,\n};\n\n/**\n * Given an async component retrieval function `getComponent()` it creates\n * a special \"code split\" component, which uses <Suspense> to asynchronously\n * load on demand the code required by `getComponent()`.\n * @param options\n * @param options.chunkName\n * @param {function} options.getComponent\n * @param {React.Element} [options.placeholder]\n * @return {React.ElementType}\n */\nexport default function splitComponent<\n ComponentPropsT extends { children?: ReactNode },\n>({\n chunkName,\n getComponent,\n placeholder,\n}: {\n chunkName: string;\n getComponent: () => Promise<ComponentOrModule<ComponentPropsT>>,\n placeholder?: ReactNode,\n}) {\n // On the client side we can check right away if the chunk name is known.\n if (IS_CLIENT_SIDE) assertChunkName(chunkName, clientChunkGroups);\n\n // The correct usage of splitComponent() assumes a single call per chunk.\n if (usedChunkNames.has(chunkName)) {\n throw Error(`Repeated splitComponent() call for the chunk \"${chunkName}\"`);\n } else usedChunkNames.add(chunkName);\n\n const LazyComponent = lazy(async () => {\n const resolved = await getComponent();\n const Component = 'default' in resolved ? resolved.default : resolved;\n\n // This pre-loads necessary stylesheets prior to the first mount of\n // the component (the lazy load function is executed by React one at\n // the frist mount).\n if (IS_CLIENT_SIDE) {\n await bookStyleSheets(chunkName, clientChunkGroups, false);\n }\n\n const Wrapper = forwardRef((\n { children, ...rest }: ComponentPropsT,\n ref,\n ) => {\n // On the server side we'll assert the chunk name here,\n // and also push it to the SSR chunks array.\n if (IS_SERVER_SIDE) {\n const { chunkGroups, chunks } = getSsrContext()!;\n assertChunkName(chunkName, chunkGroups);\n if (!chunks.includes(chunkName)) chunks.push(chunkName);\n }\n\n // This takes care about stylesheets management every time an instance of\n // this component is mounted / unmounted.\n useInsertionEffect(() => {\n bookStyleSheets(chunkName, clientChunkGroups, true);\n return () => freeStyleSheets(chunkName, clientChunkGroups);\n }, []);\n\n return (\n <Component ref={ref} {...rest as ComponentPropsT}>\n {children}\n </Component>\n );\n });\n\n return { default: Wrapper };\n });\n\n const CodeSplit: React.FunctionComponent<ComponentPropsT> = ({\n children,\n ...rest\n }: ComponentPropsT) => (\n <Suspense fallback={placeholder}>\n <LazyComponent {...rest as Parameters<typeof LazyComponent>[0]}>\n {children}\n </LazyComponent>\n </Suspense>\n );\n\n CodeSplit.propTypes = {\n children: PT.node,\n } as PT.WeakValidationMap<ComponentPropsT>;\n\n return CodeSplit;\n}\n"],"mappings":"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","ignoreList":[]}