@undp/data-viz 1.4.1 → 1.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AreaChart.cjs +1 -1
- package/dist/AreaChart.js +21 -21
- package/dist/BarGraph.cjs +1 -1
- package/dist/BarGraph.js +7 -7
- package/dist/BeeSwarmChart.cjs +1 -1
- package/dist/BeeSwarmChart.js +2 -2
- package/dist/BiVariateChoroplethMap.cjs +1 -1
- package/dist/BiVariateChoroplethMap.js +5 -5
- package/dist/BulletChart.cjs +1 -1
- package/dist/BulletChart.js +14 -14
- package/dist/ButterflyChart.cjs +1 -1
- package/dist/ButterflyChart.js +9 -9
- package/dist/ChoroplethMap.cjs +1 -1
- package/dist/ChoroplethMap.js +9 -9
- package/dist/CirclePackingGraph.cjs +1 -1
- package/dist/CirclePackingGraph.js +1 -1
- package/dist/CopyTextButton.cjs +7 -7
- package/dist/CopyTextButton.cjs.map +1 -1
- package/dist/CopyTextButton.js +4 -4
- package/dist/CopyTextButton.js.map +1 -1
- package/dist/DataCards.cjs +9 -9
- package/dist/DataCards.cjs.map +1 -1
- package/dist/DataCards.js +93 -93
- package/dist/DataCards.js.map +1 -1
- package/dist/DifferenceLineChart.cjs +1 -1
- package/dist/DifferenceLineChart.js +18 -18
- package/dist/DonutChart.cjs +1 -1
- package/dist/DonutChart.js +1 -1
- package/dist/DotDensityMap.cjs +1 -1
- package/dist/DotDensityMap.js +8 -8
- package/dist/{DropdownSelect-0I2QxaVy.cjs → DropdownSelect-BmE5JaeE.cjs} +6 -6
- package/dist/{DropdownSelect-0I2QxaVy.cjs.map → DropdownSelect-BmE5JaeE.cjs.map} +1 -1
- package/dist/{DropdownSelect-CDC9lEqU.js → DropdownSelect-CeHog_ih.js} +4 -4
- package/dist/{DropdownSelect-CDC9lEqU.js.map → DropdownSelect-CeHog_ih.js.map} +1 -1
- package/dist/DualAxisLineChart.cjs +1 -1
- package/dist/DualAxisLineChart.js +15 -15
- package/dist/DumbbellChart.cjs +1 -1
- package/dist/DumbbellChart.js +13 -13
- package/dist/GeoHubMap.cjs +1 -1
- package/dist/GeoHubMap.js +2 -2
- package/dist/GeoHubMapWithLayerSelection.cjs +1 -1
- package/dist/GeoHubMapWithLayerSelection.js +2 -2
- package/dist/{GraphEl-B6SoGRFW.cjs → GraphEl-B5gAX1IQ.cjs} +2 -2
- package/dist/{GraphEl-B6SoGRFW.cjs.map → GraphEl-B5gAX1IQ.cjs.map} +1 -1
- package/dist/{GraphEl-Cw2tDUb3.js → GraphEl-BdIyscdt.js} +3 -3
- package/dist/{GraphEl-Cw2tDUb3.js.map → GraphEl-BdIyscdt.js.map} +1 -1
- package/dist/GriddedGraphs.cjs +1 -1
- package/dist/GriddedGraphs.js +4 -4
- package/dist/GriddedGraphsFromConfig.cjs +1 -1
- package/dist/GriddedGraphsFromConfig.js +1 -1
- package/dist/HeatMap.cjs +1 -1
- package/dist/HeatMap.js +10 -10
- package/dist/Histogram.cjs +1 -1
- package/dist/Histogram.js +1 -1
- package/dist/LineChartWithConfidenceInterval.cjs +1 -1
- package/dist/LineChartWithConfidenceInterval.js +21 -21
- package/dist/{Modal-CUU6ZK3U.js → Modal-DVVwpKhP.js} +2 -2
- package/dist/{Modal-CUU6ZK3U.js.map → Modal-DVVwpKhP.js.map} +1 -1
- package/dist/{Modal-C_dl0EtQ.cjs → Modal-tXZlLE5s.cjs} +4 -4
- package/dist/{Modal-C_dl0EtQ.cjs.map → Modal-tXZlLE5s.cjs.map} +1 -1
- package/dist/MultiGraphDashboard.cjs +1 -1
- package/dist/MultiGraphDashboard.js +3 -3
- package/dist/MultiGraphDashboardFromConfig.cjs +1 -1
- package/dist/MultiGraphDashboardFromConfig.js +1 -1
- package/dist/MultiGraphDashboardWideToLongFormat.cjs +1 -1
- package/dist/MultiGraphDashboardWideToLongFormat.js +3 -3
- package/dist/MultiGraphDashboardWideToLongFormatFromConfig.cjs +1 -1
- package/dist/MultiGraphDashboardWideToLongFormatFromConfig.js +1 -1
- package/dist/MultiLineAltChart.cjs +1 -1
- package/dist/MultiLineAltChart.js +21 -21
- package/dist/MultiLineChart.cjs +1 -1
- package/dist/MultiLineChart.js +19 -19
- package/dist/ParetoChart.cjs +1 -1
- package/dist/ParetoChart.js +12 -12
- package/dist/PerformanceIntensiveMultiGraphDashboard.cjs +1 -1
- package/dist/PerformanceIntensiveMultiGraphDashboard.js +3 -3
- package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.cjs +1 -1
- package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.js +1 -1
- package/dist/PerformanceIntensiveScrollStory.cjs +1 -1
- package/dist/PerformanceIntensiveScrollStory.js +2 -2
- package/dist/RadarChart.cjs +1 -1
- package/dist/RadarChart.js +8 -8
- package/dist/{ReferenceLine-CuFMk0cI.cjs → ReferenceLine-CFVBBN__.cjs} +2 -2
- package/dist/{ReferenceLine-CuFMk0cI.cjs.map → ReferenceLine-CFVBBN__.cjs.map} +1 -1
- package/dist/{ReferenceLine-C1GpoG9d.js → ReferenceLine-CfAW3vKJ.js} +2 -2
- package/dist/{ReferenceLine-C1GpoG9d.js.map → ReferenceLine-CfAW3vKJ.js.map} +1 -1
- package/dist/{RegressionLine-BFwDCTUU.js → RegressionLine-mH7UKOPi.js} +3 -3
- package/dist/{RegressionLine-BFwDCTUU.js.map → RegressionLine-mH7UKOPi.js.map} +1 -1
- package/dist/{RegressionLine-7_rKTHN_.cjs → RegressionLine-xKdiJ8sw.cjs} +2 -2
- package/dist/{RegressionLine-7_rKTHN_.cjs.map → RegressionLine-xKdiJ8sw.cjs.map} +1 -1
- package/dist/SankeyChart.cjs +1 -1
- package/dist/SankeyChart.js +4 -4
- package/dist/ScatterPlot.cjs +1 -1
- package/dist/ScatterPlot.js +13 -13
- package/dist/ScrollStory.cjs +1 -1
- package/dist/ScrollStory.js +2 -2
- package/dist/SimpleLineChart.cjs +1 -1
- package/dist/SimpleLineChart.js +20 -20
- package/dist/SingleGraphDashboard.cjs +1 -1
- package/dist/SingleGraphDashboard.js +4 -4
- package/dist/SingleGraphDashboardFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardFromConfig.js +1 -1
- package/dist/SingleGraphDashboardGeoHubMapsFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardGeoHubMapsFromConfig.js +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.cjs +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.js +3 -3
- package/dist/SingleGraphDashboardThreeDGraphsFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardThreeDGraphsFromConfig.js +1 -1
- package/dist/SlopeChart.cjs +1 -1
- package/dist/SlopeChart.js +7 -7
- package/dist/StripChart.cjs +1 -1
- package/dist/StripChart.js +9 -9
- package/dist/ThreeDGlobe.cjs +1 -1
- package/dist/ThreeDGlobe.js +2 -2
- package/dist/TreeMapGraph.cjs +1 -1
- package/dist/TreeMapGraph.js +4 -4
- package/dist/UnitChart.cjs +1 -1
- package/dist/UnitChart.js +3 -3
- package/dist/{XAxesLabels-DQFo_z2R.js → XAxesLabels-CaV2q-6H.js} +2 -2
- package/dist/{XAxesLabels-DQFo_z2R.js.map → XAxesLabels-CaV2q-6H.js.map} +1 -1
- package/dist/{XAxesLabels-CJMQbfVy.cjs → XAxesLabels-OjBNl_lS.cjs} +2 -2
- package/dist/{XAxesLabels-CJMQbfVy.cjs.map → XAxesLabels-OjBNl_lS.cjs.map} +1 -1
- package/dist/{YAxesLabels-H5-002X5.js → YAxesLabels-CPGZjmZJ.js} +2 -2
- package/dist/{YAxesLabels-H5-002X5.js.map → YAxesLabels-CPGZjmZJ.js.map} +1 -1
- package/dist/{YAxesLabels-BXLTX7AI.cjs → YAxesLabels-D8IydyZj.cjs} +2 -2
- package/dist/{YAxesLabels-BXLTX7AI.cjs.map → YAxesLabels-D8IydyZj.cjs.map} +1 -1
- package/dist/{checkIfMultiple-Do4kADNr.cjs → checkIfMultiple-BXbHUCWM.cjs} +6 -6
- package/dist/{checkIfMultiple-Do4kADNr.cjs.map → checkIfMultiple-BXbHUCWM.cjs.map} +1 -1
- package/dist/{checkIfMultiple-CYp3vADF.js → checkIfMultiple-ChTJk2Tk.js} +5 -5
- package/dist/{checkIfMultiple-CYp3vADF.js.map → checkIfMultiple-ChTJk2Tk.js.map} +1 -1
- package/dist/{customArea-CaxScFmW.js → customArea-B-dWU0zZ.js} +2 -2
- package/dist/{customArea-CaxScFmW.js.map → customArea-B-dWU0zZ.js.map} +1 -1
- package/dist/{customArea-BYNyxAkm.cjs → customArea-CK768gCn.cjs} +2 -2
- package/dist/{customArea-BYNyxAkm.cjs.map → customArea-CK768gCn.cjs.map} +1 -1
- package/dist/{fetchAndParseData-Bcmr659B.js → fetchAndParseData-4gsYTy6_.js} +3 -3
- package/dist/fetchAndParseData-4gsYTy6_.js.map +1 -0
- package/dist/{fetchAndParseData-DmgQtB9n.cjs → fetchAndParseData-CQyVGCul.cjs} +6 -6
- package/dist/fetchAndParseData-CQyVGCul.cjs.map +1 -0
- package/dist/fetchAndParseData.cjs +1 -1
- package/dist/fetchAndParseData.js +1 -1
- package/dist/index-BW8iNx7E.cjs +10 -0
- package/dist/index-BW8iNx7E.cjs.map +1 -0
- package/dist/index-CNvov0eg.js +122 -0
- package/dist/index-CNvov0eg.js.map +1 -0
- package/dist/{index-D_n8aamX.cjs → index-CZLvTu6p.cjs} +2 -2
- package/dist/{index-D_n8aamX.cjs.map → index-CZLvTu6p.cjs.map} +1 -1
- package/dist/{index-n_RI8T0n.js → index-Cdcfp4nk.js} +2 -2
- package/dist/{index-n_RI8T0n.js.map → index-Cdcfp4nk.js.map} +1 -1
- package/dist/{index-BVnYktl4.js → index-DGAaLNu9.js} +2 -2
- package/dist/{index-BVnYktl4.js.map → index-DGAaLNu9.js.map} +1 -1
- package/dist/{index-CylX-pWB.cjs → index-DNj994Pv.cjs} +2 -2
- package/dist/{index-CylX-pWB.cjs.map → index-DNj994Pv.cjs.map} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +3 -3
- package/dist/proxy-BHRoeZgd.cjs +2 -0
- package/dist/proxy-BHRoeZgd.cjs.map +1 -0
- package/dist/{proxy-DJxJg1kD.js → proxy-CkpFesk1.js} +4123 -4075
- package/dist/proxy-CkpFesk1.js.map +1 -0
- package/dist/style.css +1 -1
- package/dist/transformData.cjs +1 -1
- package/dist/transformData.js +2 -2
- package/dist/{transformDataForGraphFromFile-D9G3ToQf.cjs → transformDataForGraphFromFile-B1A0AS-Z.cjs} +2 -2
- package/dist/{transformDataForGraphFromFile-D9G3ToQf.cjs.map → transformDataForGraphFromFile-B1A0AS-Z.cjs.map} +1 -1
- package/dist/{transformDataForGraphFromFile-CA0rw80A.js → transformDataForGraphFromFile-BCjsizvb.js} +2 -2
- package/dist/{transformDataForGraphFromFile-CA0rw80A.js.map → transformDataForGraphFromFile-BCjsizvb.js.map} +1 -1
- package/dist/{use-in-view-BCmzDU2O.cjs → use-in-view-sQJZ_xDO.cjs} +2 -2
- package/dist/use-in-view-sQJZ_xDO.cjs.map +1 -0
- package/dist/{use-in-view-BAHrBy6b.js → use-in-view-yS6jzJAp.js} +2 -2
- package/dist/use-in-view-yS6jzJAp.js.map +1 -0
- package/dist/x-BBpi7a_7-Dz2vKSfu.cjs +27 -0
- package/dist/x-BBpi7a_7-Dz2vKSfu.cjs.map +1 -0
- package/dist/x-BBpi7a_7-WVdj1j6r.js +106 -0
- package/dist/x-BBpi7a_7-WVdj1j6r.js.map +1 -0
- package/package.json +50 -51
- package/dist/fetchAndParseData-Bcmr659B.js.map +0 -1
- package/dist/fetchAndParseData-DmgQtB9n.cjs.map +0 -1
- package/dist/index-BxAUvrua.js +0 -120
- package/dist/index-BxAUvrua.js.map +0 -1
- package/dist/index-DVOJ7vxH.cjs +0 -10
- package/dist/index-DVOJ7vxH.cjs.map +0 -1
- package/dist/proxy-DJxJg1kD.js.map +0 -1
- package/dist/proxy-PQd2AItT.cjs +0 -2
- package/dist/proxy-PQd2AItT.cjs.map +0 -1
- package/dist/use-in-view-BAHrBy6b.js.map +0 -1
- package/dist/use-in-view-BCmzDU2O.cjs.map +0 -1
- package/dist/x-CnsEH4Ox-CGGXQl4M.cjs +0 -27
- package/dist/x-CnsEH4Ox-CGGXQl4M.cjs.map +0 -1
- package/dist/x-CnsEH4Ox-DDvAJndW.js +0 -101
- package/dist/x-CnsEH4Ox-DDvAJndW.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./fetchAndParseData-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./fetchAndParseData-CQyVGCul.cjs");require("handlebars");exports.fetchAndParseCSV=e.fetchAndParseCSV;exports.fetchAndParseCSVFromTextBlob=e.fetchAndParseCSVFromTextBlob;exports.fetchAndParseJSON=e.fetchAndParseJSON;exports.fetchAndParseMultipleDataSources=e.fetchAndParseMultipleDataSources;exports.fetchAndTransformDataFromAPI=e.fetchAndTransformDataFromAPI;
|
|
2
2
|
//# sourceMappingURL=fetchAndParseData.cjs.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";const y=require("./index-CHPV5EwG-DDoeWRVt.cjs"),s=require("react"),C=require("./proxy-BHRoeZgd.cjs");function I(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,o.get?o:{enumerable:!0,get:()=>t[e]})}}return r.default=t,Object.freeze(r)}const M=I(s);class S extends M.Component{getSnapshotBeforeUpdate(r){const e=this.props.childRef.current;if(e&&r.isPresent&&!this.props.isPresent){const o=e.offsetParent,m=C.isHTMLElement(o)&&o.offsetWidth||0,n=this.props.sizeRef.current;n.height=e.offsetHeight||0,n.width=e.offsetWidth||0,n.top=e.offsetTop,n.left=e.offsetLeft,n.right=m-n.width-n.left}return null}componentDidUpdate(){}render(){return this.props.children}}function T({children:t,isPresent:r,anchorX:e,root:o}){const m=s.useId(),n=s.useRef(null),p=s.useRef({width:0,height:0,top:0,left:0,right:0}),{nonce:g}=s.useContext(C.MotionConfigContext);return s.useInsertionEffect(()=>{const{width:E,height:i,top:j,left:c,right:f}=p.current;if(r||!n.current||!E||!i)return;const d=e==="left"?`left: ${c}`:`right: ${f}`;n.current.dataset.motionPopId=m;const l=document.createElement("style");g&&(l.nonce=g);const a=o??document.head;return a.appendChild(l),l.sheet&&l.sheet.insertRule(`
|
|
2
|
+
[data-motion-pop-id="${m}"] {
|
|
3
|
+
position: absolute !important;
|
|
4
|
+
width: ${E}px !important;
|
|
5
|
+
height: ${i}px !important;
|
|
6
|
+
${d}px !important;
|
|
7
|
+
top: ${j}px !important;
|
|
8
|
+
}
|
|
9
|
+
`),()=>{a.contains(l)&&a.removeChild(l)}},[r]),y.jsxRuntimeExports.jsx(S,{isPresent:r,childRef:n,sizeRef:p,children:M.cloneElement(t,{ref:n})})}const _=({children:t,initial:r,isPresent:e,onExitComplete:o,custom:m,presenceAffectsLayout:n,mode:p,anchorX:g,root:E})=>{const i=C.useConstant(A),j=s.useId();let c=!0,f=s.useMemo(()=>(c=!1,{id:j,initial:r,isPresent:e,custom:m,onExitComplete:d=>{i.set(d,!0);for(const l of i.values())if(!l)return;o&&o()},register:d=>(i.set(d,!1),()=>i.delete(d))}),[e,i,o]);return n&&c&&(f={...f}),s.useMemo(()=>{i.forEach((d,l)=>i.set(l,!1))},[e]),M.useEffect(()=>{!e&&!i.size&&o&&o()},[e]),p==="popLayout"&&(t=y.jsxRuntimeExports.jsx(T,{isPresent:e,anchorX:g,root:E,children:t})),y.jsxRuntimeExports.jsx(C.PresenceContext.Provider,{value:f,children:t})};function A(){return new Map}const w=t=>t.key||"";function z(t){const r=[];return s.Children.forEach(t,e=>{s.isValidElement(e)&&r.push(e)}),r}const q=({children:t,custom:r,initial:e=!0,onExitComplete:o,presenceAffectsLayout:m=!0,mode:n="sync",propagate:p=!1,anchorX:g="left",root:E})=>{const[i,j]=C.usePresence(p),c=s.useMemo(()=>z(t),[t]),f=p&&!i?[]:c.map(w),d=s.useRef(!0),l=s.useRef(c),a=C.useConstant(()=>new Map),[L,O]=s.useState(c),[x,b]=s.useState(c);C.useIsomorphicLayoutEffect(()=>{d.current=!1,l.current=c;for(let h=0;h<x.length;h++){const u=w(x[h]);f.includes(u)?a.delete(u):a.get(u)!==!0&&a.set(u,!1)}},[x,f.length,f.join("-")]);const P=[];if(c!==L){let h=[...c];for(let u=0;u<x.length;u++){const R=x[u],v=w(R);f.includes(v)||(h.splice(u,0,R),P.push(R))}return n==="wait"&&P.length&&(h=P),b(z(h)),O(c),null}process.env.NODE_ENV!=="production"&&n==="wait"&&x.length>1&&console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);const{forceRender:k}=s.useContext(C.LayoutGroupContext);return y.jsxRuntimeExports.jsx(y.jsxRuntimeExports.Fragment,{children:x.map(h=>{const u=w(h),R=p&&!i?!1:c===x||f.includes(u),v=()=>{if(a.has(u))a.set(u,!0);else return;let $=!0;a.forEach(D=>{D||($=!1)}),$&&(k?.(),b(l.current),p&&j?.(),o&&o())};return y.jsxRuntimeExports.jsx(_,{isPresent:R,initial:!d.current||e?void 0:!1,custom:r,presenceAffectsLayout:m,mode:n,root:E,onExitComplete:R?void 0:v,anchorX:g,children:h},u)})})};exports.AnimatePresence=q;
|
|
10
|
+
//# sourceMappingURL=index-BW8iNx7E.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-BW8iNx7E.cjs","sources":["../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/utils.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs"],"sourcesContent":["\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { isHTMLElement } from 'motion-dom';\nimport * as React from 'react';\nimport { useId, useRef, useContext, useInsertionEffect } from 'react';\nimport { MotionConfigContext } from '../../context/MotionConfigContext.mjs';\n\n/**\n * Measurement functionality has to be within a separate component\n * to leverage snapshot lifecycle.\n */\nclass PopChildMeasure extends React.Component {\n getSnapshotBeforeUpdate(prevProps) {\n const element = this.props.childRef.current;\n if (element && prevProps.isPresent && !this.props.isPresent) {\n const parent = element.offsetParent;\n const parentWidth = isHTMLElement(parent)\n ? parent.offsetWidth || 0\n : 0;\n const size = this.props.sizeRef.current;\n size.height = element.offsetHeight || 0;\n size.width = element.offsetWidth || 0;\n size.top = element.offsetTop;\n size.left = element.offsetLeft;\n size.right = parentWidth - size.width - size.left;\n }\n return null;\n }\n /**\n * Required with getSnapshotBeforeUpdate to stop React complaining.\n */\n componentDidUpdate() { }\n render() {\n return this.props.children;\n }\n}\nfunction PopChild({ children, isPresent, anchorX, root }) {\n const id = useId();\n const ref = useRef(null);\n const size = useRef({\n width: 0,\n height: 0,\n top: 0,\n left: 0,\n right: 0,\n });\n const { nonce } = useContext(MotionConfigContext);\n /**\n * We create and inject a style block so we can apply this explicit\n * sizing in a non-destructive manner by just deleting the style block.\n *\n * We can't apply size via render as the measurement happens\n * in getSnapshotBeforeUpdate (post-render), likewise if we apply the\n * styles directly on the DOM node, we might be overwriting\n * styles set via the style prop.\n */\n useInsertionEffect(() => {\n const { width, height, top, left, right } = size.current;\n if (isPresent || !ref.current || !width || !height)\n return;\n const x = anchorX === \"left\" ? `left: ${left}` : `right: ${right}`;\n ref.current.dataset.motionPopId = id;\n const style = document.createElement(\"style\");\n if (nonce)\n style.nonce = nonce;\n const parent = root ?? document.head;\n parent.appendChild(style);\n if (style.sheet) {\n style.sheet.insertRule(`\n [data-motion-pop-id=\"${id}\"] {\n position: absolute !important;\n width: ${width}px !important;\n height: ${height}px !important;\n ${x}px !important;\n top: ${top}px !important;\n }\n `);\n }\n return () => {\n if (parent.contains(style)) {\n parent.removeChild(style);\n }\n };\n }, [isPresent]);\n return (jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React.cloneElement(children, { ref }) }));\n}\n\nexport { PopChild };\n","\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useMemo } from 'react';\nimport { PresenceContext } from '../../context/PresenceContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PopChild } from './PopChild.mjs';\n\nconst PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, anchorX, root }) => {\n const presenceChildren = useConstant(newChildrenMap);\n const id = useId();\n let isReusedContext = true;\n let context = useMemo(() => {\n isReusedContext = false;\n return {\n id,\n initial,\n isPresent,\n custom,\n onExitComplete: (childId) => {\n presenceChildren.set(childId, true);\n for (const isComplete of presenceChildren.values()) {\n if (!isComplete)\n return; // can stop searching when any is incomplete\n }\n onExitComplete && onExitComplete();\n },\n register: (childId) => {\n presenceChildren.set(childId, false);\n return () => presenceChildren.delete(childId);\n },\n };\n }, [isPresent, presenceChildren, onExitComplete]);\n /**\n * If the presence of a child affects the layout of the components around it,\n * we want to make a new context value to ensure they get re-rendered\n * so they can detect that layout change.\n */\n if (presenceAffectsLayout && isReusedContext) {\n context = { ...context };\n }\n useMemo(() => {\n presenceChildren.forEach((_, key) => presenceChildren.set(key, false));\n }, [isPresent]);\n /**\n * If there's no `motion` components to fire exit animations, we want to remove this\n * component immediately.\n */\n React.useEffect(() => {\n !isPresent &&\n !presenceChildren.size &&\n onExitComplete &&\n onExitComplete();\n }, [isPresent]);\n if (mode === \"popLayout\") {\n children = (jsx(PopChild, { isPresent: isPresent, anchorX: anchorX, root: root, children: children }));\n }\n return (jsx(PresenceContext.Provider, { value: context, children: children }));\n};\nfunction newChildrenMap() {\n return new Map();\n}\n\nexport { PresenceChild };\n","import { Children, isValidElement } from 'react';\n\nconst getChildKey = (child) => child.key || \"\";\nfunction onlyElements(children) {\n const filtered = [];\n // We use forEach here instead of map as map mutates the component key by preprending `.$`\n Children.forEach(children, (child) => {\n if (isValidElement(child))\n filtered.push(child);\n });\n return filtered;\n}\n\nexport { getChildKey, onlyElements };\n","\"use client\";\nimport { jsx, Fragment } from 'react/jsx-runtime';\nimport { useMemo, useRef, useState, useContext } from 'react';\nimport { LayoutGroupContext } from '../../context/LayoutGroupContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs';\nimport { PresenceChild } from './PresenceChild.mjs';\nimport { usePresence } from './use-presence.mjs';\nimport { onlyElements, getChildKey } from './utils.mjs';\n\n/**\n * `AnimatePresence` enables the animation of components that have been removed from the tree.\n *\n * When adding/removing more than a single child, every child **must** be given a unique `key` prop.\n *\n * Any `motion` components that have an `exit` property defined will animate out when removed from\n * the tree.\n *\n * ```jsx\n * import { motion, AnimatePresence } from 'framer-motion'\n *\n * export const Items = ({ items }) => (\n * <AnimatePresence>\n * {items.map(item => (\n * <motion.div\n * key={item.id}\n * initial={{ opacity: 0 }}\n * animate={{ opacity: 1 }}\n * exit={{ opacity: 0 }}\n * />\n * ))}\n * </AnimatePresence>\n * )\n * ```\n *\n * You can sequence exit animations throughout a tree using variants.\n *\n * If a child contains multiple `motion` components with `exit` props, it will only unmount the child\n * once all `motion` components have finished animating out. Likewise, any components using\n * `usePresence` all need to call `safeToRemove`.\n *\n * @public\n */\nconst AnimatePresence = ({ children, custom, initial = true, onExitComplete, presenceAffectsLayout = true, mode = \"sync\", propagate = false, anchorX = \"left\", root }) => {\n const [isParentPresent, safeToRemove] = usePresence(propagate);\n /**\n * Filter any children that aren't ReactElements. We can only track components\n * between renders with a props.key.\n */\n const presentChildren = useMemo(() => onlyElements(children), [children]);\n /**\n * Track the keys of the currently rendered children. This is used to\n * determine which children are exiting.\n */\n const presentKeys = propagate && !isParentPresent ? [] : presentChildren.map(getChildKey);\n /**\n * If `initial={false}` we only want to pass this to components in the first render.\n */\n const isInitialRender = useRef(true);\n /**\n * A ref containing the currently present children. When all exit animations\n * are complete, we use this to re-render the component with the latest children\n * *committed* rather than the latest children *rendered*.\n */\n const pendingPresentChildren = useRef(presentChildren);\n /**\n * Track which exiting children have finished animating out.\n */\n const exitComplete = useConstant(() => new Map());\n /**\n * Save children to render as React state. To ensure this component is concurrent-safe,\n * we check for exiting children via an effect.\n */\n const [diffedChildren, setDiffedChildren] = useState(presentChildren);\n const [renderedChildren, setRenderedChildren] = useState(presentChildren);\n useIsomorphicLayoutEffect(() => {\n isInitialRender.current = false;\n pendingPresentChildren.current = presentChildren;\n /**\n * Update complete status of exiting children.\n */\n for (let i = 0; i < renderedChildren.length; i++) {\n const key = getChildKey(renderedChildren[i]);\n if (!presentKeys.includes(key)) {\n if (exitComplete.get(key) !== true) {\n exitComplete.set(key, false);\n }\n }\n else {\n exitComplete.delete(key);\n }\n }\n }, [renderedChildren, presentKeys.length, presentKeys.join(\"-\")]);\n const exitingChildren = [];\n if (presentChildren !== diffedChildren) {\n let nextChildren = [...presentChildren];\n /**\n * Loop through all the currently rendered components and decide which\n * are exiting.\n */\n for (let i = 0; i < renderedChildren.length; i++) {\n const child = renderedChildren[i];\n const key = getChildKey(child);\n if (!presentKeys.includes(key)) {\n nextChildren.splice(i, 0, child);\n exitingChildren.push(child);\n }\n }\n /**\n * If we're in \"wait\" mode, and we have exiting children, we want to\n * only render these until they've all exited.\n */\n if (mode === \"wait\" && exitingChildren.length) {\n nextChildren = exitingChildren;\n }\n setRenderedChildren(onlyElements(nextChildren));\n setDiffedChildren(presentChildren);\n /**\n * Early return to ensure once we've set state with the latest diffed\n * children, we can immediately re-render.\n */\n return null;\n }\n if (process.env.NODE_ENV !== \"production\" &&\n mode === \"wait\" &&\n renderedChildren.length > 1) {\n console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to \"wait\". This will lead to odd visual behaviour.`);\n }\n /**\n * If we've been provided a forceRender function by the LayoutGroupContext,\n * we can use it to force a re-render amongst all surrounding components once\n * all components have finished animating out.\n */\n const { forceRender } = useContext(LayoutGroupContext);\n return (jsx(Fragment, { children: renderedChildren.map((child) => {\n const key = getChildKey(child);\n const isPresent = propagate && !isParentPresent\n ? false\n : presentChildren === renderedChildren ||\n presentKeys.includes(key);\n const onExit = () => {\n if (exitComplete.has(key)) {\n exitComplete.set(key, true);\n }\n else {\n return;\n }\n let isEveryExitComplete = true;\n exitComplete.forEach((isExitComplete) => {\n if (!isExitComplete)\n isEveryExitComplete = false;\n });\n if (isEveryExitComplete) {\n forceRender?.();\n setRenderedChildren(pendingPresentChildren.current);\n propagate && safeToRemove?.();\n onExitComplete && onExitComplete();\n }\n };\n return (jsx(PresenceChild, { isPresent: isPresent, initial: !isInitialRender.current || initial\n ? undefined\n : false, custom: custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode, root: root, onExitComplete: isPresent ? undefined : onExit, anchorX: anchorX, children: child }, key));\n }) }));\n};\n\nexport { AnimatePresence };\n"],"names":["PopChildMeasure","React","prevProps","element","parent","parentWidth","isHTMLElement","size","PopChild","children","isPresent","anchorX","root","id","useId","ref","useRef","nonce","useContext","MotionConfigContext","useInsertionEffect","width","height","top","left","right","x","style","jsx","PresenceChild","initial","onExitComplete","custom","presenceAffectsLayout","mode","presenceChildren","useConstant","newChildrenMap","isReusedContext","context","useMemo","childId","isComplete","_","key","PresenceContext","getChildKey","child","onlyElements","filtered","Children","isValidElement","AnimatePresence","propagate","isParentPresent","safeToRemove","usePresence","presentChildren","presentKeys","isInitialRender","pendingPresentChildren","exitComplete","diffedChildren","setDiffedChildren","useState","renderedChildren","setRenderedChildren","useIsomorphicLayoutEffect","i","exitingChildren","nextChildren","forceRender","LayoutGroupContext","Fragment","onExit","isEveryExitComplete","isExitComplete"],"mappings":"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","x_google_ignoreList":[0,1,2,3]}
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import { j as y } from "./index-CHPV5EwG-BPSP-7Jg.js";
|
|
2
|
+
import * as M from "react";
|
|
3
|
+
import { useId as k, useRef as P, useContext as A, useInsertionEffect as K, useMemo as j, Children as N, isValidElement as S, useState as z } from "react";
|
|
4
|
+
import { M as U, i as V, u as I, P as X, a as _, b as B, L as F } from "./proxy-CkpFesk1.js";
|
|
5
|
+
class G extends M.Component {
|
|
6
|
+
getSnapshotBeforeUpdate(l) {
|
|
7
|
+
const e = this.props.childRef.current;
|
|
8
|
+
if (e && l.isPresent && !this.props.isPresent) {
|
|
9
|
+
const o = e.offsetParent, p = V(o) && o.offsetWidth || 0, t = this.props.sizeRef.current;
|
|
10
|
+
t.height = e.offsetHeight || 0, t.width = e.offsetWidth || 0, t.top = e.offsetTop, t.left = e.offsetLeft, t.right = p - t.width - t.left;
|
|
11
|
+
}
|
|
12
|
+
return null;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Required with getSnapshotBeforeUpdate to stop React complaining.
|
|
16
|
+
*/
|
|
17
|
+
componentDidUpdate() {
|
|
18
|
+
}
|
|
19
|
+
render() {
|
|
20
|
+
return this.props.children;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
function O({ children: i, isPresent: l, anchorX: e, root: o }) {
|
|
24
|
+
const p = k(), t = P(null), h = P({
|
|
25
|
+
width: 0,
|
|
26
|
+
height: 0,
|
|
27
|
+
top: 0,
|
|
28
|
+
left: 0,
|
|
29
|
+
right: 0
|
|
30
|
+
}), { nonce: C } = A(U);
|
|
31
|
+
return K(() => {
|
|
32
|
+
const { width: x, height: n, top: w, left: s, right: f } = h.current;
|
|
33
|
+
if (l || !t.current || !x || !n)
|
|
34
|
+
return;
|
|
35
|
+
const u = e === "left" ? `left: ${s}` : `right: ${f}`;
|
|
36
|
+
t.current.dataset.motionPopId = p;
|
|
37
|
+
const c = document.createElement("style");
|
|
38
|
+
C && (c.nonce = C);
|
|
39
|
+
const a = o ?? document.head;
|
|
40
|
+
return a.appendChild(c), c.sheet && c.sheet.insertRule(`
|
|
41
|
+
[data-motion-pop-id="${p}"] {
|
|
42
|
+
position: absolute !important;
|
|
43
|
+
width: ${x}px !important;
|
|
44
|
+
height: ${n}px !important;
|
|
45
|
+
${u}px !important;
|
|
46
|
+
top: ${w}px !important;
|
|
47
|
+
}
|
|
48
|
+
`), () => {
|
|
49
|
+
a.contains(c) && a.removeChild(c);
|
|
50
|
+
};
|
|
51
|
+
}, [l]), y.jsx(G, { isPresent: l, childRef: t, sizeRef: h, children: M.cloneElement(i, { ref: t }) });
|
|
52
|
+
}
|
|
53
|
+
const Y = ({ children: i, initial: l, isPresent: e, onExitComplete: o, custom: p, presenceAffectsLayout: t, mode: h, anchorX: C, root: x }) => {
|
|
54
|
+
const n = I(q), w = k();
|
|
55
|
+
let s = !0, f = j(() => (s = !1, {
|
|
56
|
+
id: w,
|
|
57
|
+
initial: l,
|
|
58
|
+
isPresent: e,
|
|
59
|
+
custom: p,
|
|
60
|
+
onExitComplete: (u) => {
|
|
61
|
+
n.set(u, !0);
|
|
62
|
+
for (const c of n.values())
|
|
63
|
+
if (!c)
|
|
64
|
+
return;
|
|
65
|
+
o && o();
|
|
66
|
+
},
|
|
67
|
+
register: (u) => (n.set(u, !1), () => n.delete(u))
|
|
68
|
+
}), [e, n, o]);
|
|
69
|
+
return t && s && (f = { ...f }), j(() => {
|
|
70
|
+
n.forEach((u, c) => n.set(c, !1));
|
|
71
|
+
}, [e]), M.useEffect(() => {
|
|
72
|
+
!e && !n.size && o && o();
|
|
73
|
+
}, [e]), h === "popLayout" && (i = y.jsx(O, { isPresent: e, anchorX: C, root: x, children: i })), y.jsx(X.Provider, { value: f, children: i });
|
|
74
|
+
};
|
|
75
|
+
function q() {
|
|
76
|
+
return /* @__PURE__ */ new Map();
|
|
77
|
+
}
|
|
78
|
+
const E = (i) => i.key || "";
|
|
79
|
+
function b(i) {
|
|
80
|
+
const l = [];
|
|
81
|
+
return N.forEach(i, (e) => {
|
|
82
|
+
S(e) && l.push(e);
|
|
83
|
+
}), l;
|
|
84
|
+
}
|
|
85
|
+
const ee = ({ children: i, custom: l, initial: e = !0, onExitComplete: o, presenceAffectsLayout: p = !0, mode: t = "sync", propagate: h = !1, anchorX: C = "left", root: x }) => {
|
|
86
|
+
const [n, w] = _(h), s = j(() => b(i), [i]), f = h && !n ? [] : s.map(E), u = P(!0), c = P(s), a = I(() => /* @__PURE__ */ new Map()), [T, D] = z(s), [m, L] = z(s);
|
|
87
|
+
B(() => {
|
|
88
|
+
u.current = !1, c.current = s;
|
|
89
|
+
for (let d = 0; d < m.length; d++) {
|
|
90
|
+
const r = E(m[d]);
|
|
91
|
+
f.includes(r) ? a.delete(r) : a.get(r) !== !0 && a.set(r, !1);
|
|
92
|
+
}
|
|
93
|
+
}, [m, f.length, f.join("-")]);
|
|
94
|
+
const R = [];
|
|
95
|
+
if (s !== T) {
|
|
96
|
+
let d = [...s];
|
|
97
|
+
for (let r = 0; r < m.length; r++) {
|
|
98
|
+
const g = m[r], v = E(g);
|
|
99
|
+
f.includes(v) || (d.splice(r, 0, g), R.push(g));
|
|
100
|
+
}
|
|
101
|
+
return t === "wait" && R.length && (d = R), L(b(d)), D(s), null;
|
|
102
|
+
}
|
|
103
|
+
process.env.NODE_ENV !== "production" && t === "wait" && m.length > 1 && console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);
|
|
104
|
+
const { forceRender: W } = A(F);
|
|
105
|
+
return y.jsx(y.Fragment, { children: m.map((d) => {
|
|
106
|
+
const r = E(d), g = h && !n ? !1 : s === m || f.includes(r), v = () => {
|
|
107
|
+
if (a.has(r))
|
|
108
|
+
a.set(r, !0);
|
|
109
|
+
else
|
|
110
|
+
return;
|
|
111
|
+
let $ = !0;
|
|
112
|
+
a.forEach((H) => {
|
|
113
|
+
H || ($ = !1);
|
|
114
|
+
}), $ && (W?.(), L(c.current), h && w?.(), o && o());
|
|
115
|
+
};
|
|
116
|
+
return y.jsx(Y, { isPresent: g, initial: !u.current || e ? void 0 : !1, custom: l, presenceAffectsLayout: p, mode: t, root: x, onExitComplete: g ? void 0 : v, anchorX: C, children: d }, r);
|
|
117
|
+
}) });
|
|
118
|
+
};
|
|
119
|
+
export {
|
|
120
|
+
ee as A
|
|
121
|
+
};
|
|
122
|
+
//# sourceMappingURL=index-CNvov0eg.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-CNvov0eg.js","sources":["../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/utils.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs"],"sourcesContent":["\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { isHTMLElement } from 'motion-dom';\nimport * as React from 'react';\nimport { useId, useRef, useContext, useInsertionEffect } from 'react';\nimport { MotionConfigContext } from '../../context/MotionConfigContext.mjs';\n\n/**\n * Measurement functionality has to be within a separate component\n * to leverage snapshot lifecycle.\n */\nclass PopChildMeasure extends React.Component {\n getSnapshotBeforeUpdate(prevProps) {\n const element = this.props.childRef.current;\n if (element && prevProps.isPresent && !this.props.isPresent) {\n const parent = element.offsetParent;\n const parentWidth = isHTMLElement(parent)\n ? parent.offsetWidth || 0\n : 0;\n const size = this.props.sizeRef.current;\n size.height = element.offsetHeight || 0;\n size.width = element.offsetWidth || 0;\n size.top = element.offsetTop;\n size.left = element.offsetLeft;\n size.right = parentWidth - size.width - size.left;\n }\n return null;\n }\n /**\n * Required with getSnapshotBeforeUpdate to stop React complaining.\n */\n componentDidUpdate() { }\n render() {\n return this.props.children;\n }\n}\nfunction PopChild({ children, isPresent, anchorX, root }) {\n const id = useId();\n const ref = useRef(null);\n const size = useRef({\n width: 0,\n height: 0,\n top: 0,\n left: 0,\n right: 0,\n });\n const { nonce } = useContext(MotionConfigContext);\n /**\n * We create and inject a style block so we can apply this explicit\n * sizing in a non-destructive manner by just deleting the style block.\n *\n * We can't apply size via render as the measurement happens\n * in getSnapshotBeforeUpdate (post-render), likewise if we apply the\n * styles directly on the DOM node, we might be overwriting\n * styles set via the style prop.\n */\n useInsertionEffect(() => {\n const { width, height, top, left, right } = size.current;\n if (isPresent || !ref.current || !width || !height)\n return;\n const x = anchorX === \"left\" ? `left: ${left}` : `right: ${right}`;\n ref.current.dataset.motionPopId = id;\n const style = document.createElement(\"style\");\n if (nonce)\n style.nonce = nonce;\n const parent = root ?? document.head;\n parent.appendChild(style);\n if (style.sheet) {\n style.sheet.insertRule(`\n [data-motion-pop-id=\"${id}\"] {\n position: absolute !important;\n width: ${width}px !important;\n height: ${height}px !important;\n ${x}px !important;\n top: ${top}px !important;\n }\n `);\n }\n return () => {\n if (parent.contains(style)) {\n parent.removeChild(style);\n }\n };\n }, [isPresent]);\n return (jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React.cloneElement(children, { ref }) }));\n}\n\nexport { PopChild };\n","\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useMemo } from 'react';\nimport { PresenceContext } from '../../context/PresenceContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PopChild } from './PopChild.mjs';\n\nconst PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, anchorX, root }) => {\n const presenceChildren = useConstant(newChildrenMap);\n const id = useId();\n let isReusedContext = true;\n let context = useMemo(() => {\n isReusedContext = false;\n return {\n id,\n initial,\n isPresent,\n custom,\n onExitComplete: (childId) => {\n presenceChildren.set(childId, true);\n for (const isComplete of presenceChildren.values()) {\n if (!isComplete)\n return; // can stop searching when any is incomplete\n }\n onExitComplete && onExitComplete();\n },\n register: (childId) => {\n presenceChildren.set(childId, false);\n return () => presenceChildren.delete(childId);\n },\n };\n }, [isPresent, presenceChildren, onExitComplete]);\n /**\n * If the presence of a child affects the layout of the components around it,\n * we want to make a new context value to ensure they get re-rendered\n * so they can detect that layout change.\n */\n if (presenceAffectsLayout && isReusedContext) {\n context = { ...context };\n }\n useMemo(() => {\n presenceChildren.forEach((_, key) => presenceChildren.set(key, false));\n }, [isPresent]);\n /**\n * If there's no `motion` components to fire exit animations, we want to remove this\n * component immediately.\n */\n React.useEffect(() => {\n !isPresent &&\n !presenceChildren.size &&\n onExitComplete &&\n onExitComplete();\n }, [isPresent]);\n if (mode === \"popLayout\") {\n children = (jsx(PopChild, { isPresent: isPresent, anchorX: anchorX, root: root, children: children }));\n }\n return (jsx(PresenceContext.Provider, { value: context, children: children }));\n};\nfunction newChildrenMap() {\n return new Map();\n}\n\nexport { PresenceChild };\n","import { Children, isValidElement } from 'react';\n\nconst getChildKey = (child) => child.key || \"\";\nfunction onlyElements(children) {\n const filtered = [];\n // We use forEach here instead of map as map mutates the component key by preprending `.$`\n Children.forEach(children, (child) => {\n if (isValidElement(child))\n filtered.push(child);\n });\n return filtered;\n}\n\nexport { getChildKey, onlyElements };\n","\"use client\";\nimport { jsx, Fragment } from 'react/jsx-runtime';\nimport { useMemo, useRef, useState, useContext } from 'react';\nimport { LayoutGroupContext } from '../../context/LayoutGroupContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs';\nimport { PresenceChild } from './PresenceChild.mjs';\nimport { usePresence } from './use-presence.mjs';\nimport { onlyElements, getChildKey } from './utils.mjs';\n\n/**\n * `AnimatePresence` enables the animation of components that have been removed from the tree.\n *\n * When adding/removing more than a single child, every child **must** be given a unique `key` prop.\n *\n * Any `motion` components that have an `exit` property defined will animate out when removed from\n * the tree.\n *\n * ```jsx\n * import { motion, AnimatePresence } from 'framer-motion'\n *\n * export const Items = ({ items }) => (\n * <AnimatePresence>\n * {items.map(item => (\n * <motion.div\n * key={item.id}\n * initial={{ opacity: 0 }}\n * animate={{ opacity: 1 }}\n * exit={{ opacity: 0 }}\n * />\n * ))}\n * </AnimatePresence>\n * )\n * ```\n *\n * You can sequence exit animations throughout a tree using variants.\n *\n * If a child contains multiple `motion` components with `exit` props, it will only unmount the child\n * once all `motion` components have finished animating out. Likewise, any components using\n * `usePresence` all need to call `safeToRemove`.\n *\n * @public\n */\nconst AnimatePresence = ({ children, custom, initial = true, onExitComplete, presenceAffectsLayout = true, mode = \"sync\", propagate = false, anchorX = \"left\", root }) => {\n const [isParentPresent, safeToRemove] = usePresence(propagate);\n /**\n * Filter any children that aren't ReactElements. We can only track components\n * between renders with a props.key.\n */\n const presentChildren = useMemo(() => onlyElements(children), [children]);\n /**\n * Track the keys of the currently rendered children. This is used to\n * determine which children are exiting.\n */\n const presentKeys = propagate && !isParentPresent ? [] : presentChildren.map(getChildKey);\n /**\n * If `initial={false}` we only want to pass this to components in the first render.\n */\n const isInitialRender = useRef(true);\n /**\n * A ref containing the currently present children. When all exit animations\n * are complete, we use this to re-render the component with the latest children\n * *committed* rather than the latest children *rendered*.\n */\n const pendingPresentChildren = useRef(presentChildren);\n /**\n * Track which exiting children have finished animating out.\n */\n const exitComplete = useConstant(() => new Map());\n /**\n * Save children to render as React state. To ensure this component is concurrent-safe,\n * we check for exiting children via an effect.\n */\n const [diffedChildren, setDiffedChildren] = useState(presentChildren);\n const [renderedChildren, setRenderedChildren] = useState(presentChildren);\n useIsomorphicLayoutEffect(() => {\n isInitialRender.current = false;\n pendingPresentChildren.current = presentChildren;\n /**\n * Update complete status of exiting children.\n */\n for (let i = 0; i < renderedChildren.length; i++) {\n const key = getChildKey(renderedChildren[i]);\n if (!presentKeys.includes(key)) {\n if (exitComplete.get(key) !== true) {\n exitComplete.set(key, false);\n }\n }\n else {\n exitComplete.delete(key);\n }\n }\n }, [renderedChildren, presentKeys.length, presentKeys.join(\"-\")]);\n const exitingChildren = [];\n if (presentChildren !== diffedChildren) {\n let nextChildren = [...presentChildren];\n /**\n * Loop through all the currently rendered components and decide which\n * are exiting.\n */\n for (let i = 0; i < renderedChildren.length; i++) {\n const child = renderedChildren[i];\n const key = getChildKey(child);\n if (!presentKeys.includes(key)) {\n nextChildren.splice(i, 0, child);\n exitingChildren.push(child);\n }\n }\n /**\n * If we're in \"wait\" mode, and we have exiting children, we want to\n * only render these until they've all exited.\n */\n if (mode === \"wait\" && exitingChildren.length) {\n nextChildren = exitingChildren;\n }\n setRenderedChildren(onlyElements(nextChildren));\n setDiffedChildren(presentChildren);\n /**\n * Early return to ensure once we've set state with the latest diffed\n * children, we can immediately re-render.\n */\n return null;\n }\n if (process.env.NODE_ENV !== \"production\" &&\n mode === \"wait\" &&\n renderedChildren.length > 1) {\n console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to \"wait\". This will lead to odd visual behaviour.`);\n }\n /**\n * If we've been provided a forceRender function by the LayoutGroupContext,\n * we can use it to force a re-render amongst all surrounding components once\n * all components have finished animating out.\n */\n const { forceRender } = useContext(LayoutGroupContext);\n return (jsx(Fragment, { children: renderedChildren.map((child) => {\n const key = getChildKey(child);\n const isPresent = propagate && !isParentPresent\n ? false\n : presentChildren === renderedChildren ||\n presentKeys.includes(key);\n const onExit = () => {\n if (exitComplete.has(key)) {\n exitComplete.set(key, true);\n }\n else {\n return;\n }\n let isEveryExitComplete = true;\n exitComplete.forEach((isExitComplete) => {\n if (!isExitComplete)\n isEveryExitComplete = false;\n });\n if (isEveryExitComplete) {\n forceRender?.();\n setRenderedChildren(pendingPresentChildren.current);\n propagate && safeToRemove?.();\n onExitComplete && onExitComplete();\n }\n };\n return (jsx(PresenceChild, { isPresent: isPresent, initial: !isInitialRender.current || initial\n ? undefined\n : false, custom: custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode, root: root, onExitComplete: isPresent ? undefined : onExit, anchorX: anchorX, children: child }, key));\n }) }));\n};\n\nexport { AnimatePresence };\n"],"names":["PopChildMeasure","React","prevProps","element","parent","parentWidth","isHTMLElement","size","PopChild","children","isPresent","anchorX","root","id","useId","ref","useRef","nonce","useContext","MotionConfigContext","useInsertionEffect","width","height","top","left","right","x","style","jsx","PresenceChild","initial","onExitComplete","custom","presenceAffectsLayout","mode","presenceChildren","useConstant","newChildrenMap","isReusedContext","context","useMemo","childId","isComplete","_","key","PresenceContext","getChildKey","child","onlyElements","filtered","Children","isValidElement","AnimatePresence","propagate","isParentPresent","safeToRemove","usePresence","presentChildren","presentKeys","isInitialRender","pendingPresentChildren","exitComplete","diffedChildren","setDiffedChildren","useState","renderedChildren","setRenderedChildren","useIsomorphicLayoutEffect","i","exitingChildren","nextChildren","forceRender","LayoutGroupContext","Fragment","onExit","isEveryExitComplete","isExitComplete"],"mappings":"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","x_google_ignoreList":[0,1,2,3]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const t=require("./index-CHPV5EwG-DDoeWRVt.cjs"),de=require("./index-CZbIGs8q.cjs"),i=require("react"),fe=require("./index-C21TvELx.cjs"),ge=require("./index-BczVvEBZ.cjs"),me=require("./Modal-
|
|
2
|
-
//# sourceMappingURL=index-
|
|
1
|
+
"use strict";const t=require("./index-CHPV5EwG-DDoeWRVt.cjs"),de=require("./index-CZbIGs8q.cjs"),i=require("react"),fe=require("./index-C21TvELx.cjs"),ge=require("./index-BczVvEBZ.cjs"),me=require("./Modal-tXZlLE5s.cjs"),pe=require("./Spinner-DA6Z5E4n.cjs"),ve=require("./Tooltip-n8z5bfav.cjs"),je=require("./numberFormattingFunction-02t-wJta.cjs"),he=require("./getTextColorBasedOnBgColor-nqY-bsM_.cjs"),se=require("./Colors.cjs"),U=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),be=require("./string2HTML-D2Avudmb.cjs"),ye=require("./pow-B5-jkdHU.cjs"),W=require("./y-QcCbqrzx.cjs"),Ce=require("./GraphFooter.cjs"),Me=require("./GraphHeader.cjs"),we=require("./ColorLegendWithMouseOver.cjs"),Ee=require("./EmptyState-d8_8SxeW.cjs");function I(M,o){let r,x;if(o===void 0)for(const a of M)a!=null&&(r===void 0?a>=a&&(r=x=a):(r>a&&(r=a),x<a&&(x=a)));else{let a=-1;for(let c of M)(c=o(c,++a,M))!=null&&(r===void 0?c>=c&&(r=x=c):(r>c&&(r=c),x<c&&(x=c)))}return[r,x]}const xe=i.memo(M=>{const{data:o,colors:r,leftMargin:x,width:a,height:c,colorDomain:k,selectedColor:b,rightMargin:X,topMargin:Y,bottomMargin:y,showLabels:n,tooltip:B,onSeriesMouseOver:w,showValues:H,suffix:_,prefix:C,highlightedDataPoints:L,onSeriesMouseClick:O,maxRadiusValue:S,radius:u,resetSelectionOnDoubleClick:A,detailsOnClick:v,styles:J,classNames:T,dimmedOpacity:N,precision:re}=M,le=i.useRef(null),[P,z]=i.useState(void 0),[p,E]=i.useState(void 0),[d,D]=i.useState(void 0),[K,$]=i.useState(void 0),[Q,F]=i.useState(void 0),[Z,j]=i.useState(null),f=i.useMemo(()=>({top:Y,bottom:y,left:x,right:X}),[Y,y,x,X]),ee=a-f.left-f.right,te=c-f.top-f.bottom,g=i.useMemo(()=>o.filter(e=>!U.checkIfNullOrUndefined(e.size)).length===0?o:ge.orderBy(o.filter(e=>!U.checkIfNullOrUndefined(e.size)),"radius","asc"),[o]),h=i.useMemo(()=>o.filter(e=>e.size===void 0||e.size===null).length!==o.length?ye.sqrt().domain([0,U.checkIfNullOrUndefined(S)?Math.max(...o.map(e=>e.size).filter(e=>e!=null)):S]).range([.25,u]).nice():void 0,[o,S,u]);i.useEffect(()=>{(()=>{const s=[...g];W.forceSimulation(s).force("y",W.forceY(l=>te/2).strength(1)).force("x",W.forceX(l=>ee/2).strength(1)).force("collide",W.forceCollide(l=>h?h(l.size||0)+1:u+1)).force("charge",W.forceManyBody().strength(-15)).alphaDecay(.05).tick(1e4).on("tick",()=>{j(s)}).on("end",()=>{j(s);const l=I(s,m=>m.x-(h?h(m.size||0)+1:u+1))[0]||0,V=I(s,m=>m.y-(h?h(m.size||0)+1:u+1))[0]||0,q=I(s,m=>m.x+(h?h(m.size||0)+1:u+1))[1]||0,ue=I(s,m=>m.y+(h?h(m.size||0)+1:u+1))[1]||0;D([l,V,l<0?q-l:q,V<0?ue-V:ue])})})()},[o,u,te,ee,S,g,h]);const G=i.useCallback((e,s)=>{z(s),F(e.clientY),$(e.clientX),w?.(s)},[w]),oe=i.useCallback((e,s)=>{z(s),F(e.clientY),$(e.clientX)},[]),ne=i.useCallback(e=>{(O||v)&&(p===e.label&&A?(E(void 0),O?.(void 0)):(E(e.label),O?.(e)))},[O,v,p,A]),ae=i.useCallback(()=>{z(void 0),$(void 0),F(void 0),w?.(void 0)},[w]),R=i.useCallback(e=>o.filter(s=>s.color).length===0?r[0]:e.color?r[k.indexOf(e.color)]:se.Colors.gray,[o,r,k]),ie=i.useCallback(e=>b?e.color&&r[k.indexOf(e.color)]===b?1:N:L.length!==0?L.indexOf(e.label)!==-1?.85:N:.85,[b,N,r,k,L]);return Z?d?t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx("svg",{width:`${a}px`,height:`${c}px`,viewBox:`${d[0]>0?0:d[0]} ${d[1]>0?0:d[1]} ${a<d[2]?d[2]:a} ${c<d[3]?d[3]:c}`,direction:"ltr",ref:le,children:t.jsxRuntimeExports.jsx("g",{transform:`translate(${f.left},${f.top})`,children:Z.map(e=>{const s=R(e),ce=ie(e),l=h?h(e.size||0):u,V=l>20&&(n||H);return t.jsxRuntimeExports.jsxs("g",{className:"undp-viz-g-with-hover",opacity:ce,transform:`translate(${e.x},${e.y})`,onMouseEnter:q=>G(q,e),onMouseMove:q=>oe(q,e),onClick:()=>ne(e),onMouseLeave:ae,children:[t.jsxRuntimeExports.jsx("circle",{cx:0,cy:0,r:l,fill:s}),(V||H)&&e.size!==void 0&&e.size!==null&&t.jsxRuntimeExports.jsx("g",{children:t.jsxRuntimeExports.jsx("foreignObject",{y:0-l,x:0-l,width:2*l,height:2*l,children:t.jsxRuntimeExports.jsxs("div",{className:"flex flex-col justify-center items-center h-full py-0 px-3",children:[n&&t.jsxRuntimeExports.jsx("p",{className:t.mo("text-center leading-[1.25] overflow-hidden m-0 circle-packing-label",T?.graphObjectValues),style:{fontSize:`${Math.min(Math.max(Math.round(l/4),12),Math.max(Math.round(l*12/`${e.label}`.length),12),14)}px`,WebkitLineClamp:l*2<60?1:l*2<75?2:l*2<100?3:void 0,display:"-webkit-box",WebkitBoxOrient:"vertical",color:he.getTextColorBasedOnBgColor(s),hyphens:"auto",...J?.graphObjectValues||{}},children:e.label}),H&&t.jsxRuntimeExports.jsx("p",{className:"text-center font-bold leading-[1.25] w-full m-0 circle-packing-value",style:{fontSize:`${Math.min(Math.max(Math.round(l/4),14),14)}px`,color:he.getTextColorBasedOnBgColor(s)},children:je.numberFormattingFunction(e.size,"NA",re,C,_)})]})})})]},e.label)})})}),P&&B&&K&&Q&&t.jsxRuntimeExports.jsx(ve.Tooltip,{data:P,body:B,xPos:K,yPos:Q,backgroundStyle:J?.tooltip,className:T?.tooltip}),v&&p!==void 0?t.jsxRuntimeExports.jsx(me.X,{open:p!==void 0,onClose:()=>{E(void 0)},children:t.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof v=="string"?{__html:be.string2HTML(v,p)}:void 0,children:typeof v=="function"?v(p):null})}):null]}):null:t.jsxRuntimeExports.jsx("div",{style:{width:`${a}px`,height:`${c}px`},children:t.jsxRuntimeExports.jsx("div",{className:"flex m-auto items-center justify-center p-0 leading-none text-base h-40",children:t.jsxRuntimeExports.jsx(pe.y,{})})})});xe.displayName="BubbleChart";function Re(M){const{data:o,graphTitle:r,colors:x,suffix:a="",sources:c,prefix:k="",graphDescription:b,leftMargin:X=0,rightMargin:Y=0,height:y,width:n,footNote:B,colorDomain:w,colorLegendTitle:H,padding:_,backgroundColor:C=!1,topMargin:L=0,bottomMargin:O=0,showLabels:S=!0,relativeHeight:u,tooltip:A,onSeriesMouseOver:v,showColorScale:J=!0,showValues:T,graphID:N,highlightedDataPoints:re=[],onSeriesMouseClick:le,graphDownload:P=!1,dataDownload:z=!1,language:p="en",showNAColor:E,minHeight:d=0,theme:D="light",ariaLabel:K,radius:$,maxRadiusValue:Q,resetSelectionOnDoubleClick:F=!0,detailsOnClick:Z,styles:j,classNames:f,dimmedOpacity:ee=.3,precision:te=2}=M,[g,h]=i.useState(0),[G,oe]=i.useState(0),[ne,ae]=i.useState(void 0),R=i.useRef(null),ie=i.useRef(null);return i.useEffect(()=>{const e=new ResizeObserver(s=>{h(n||s[0].target.clientWidth||620),oe(y||s[0].target.clientHeight||480)});return R.current&&(oe(R.current.clientHeight||480),h(R.current.clientWidth||620),n||e.observe(R.current)),()=>e.disconnect()},[n,y]),t.jsxRuntimeExports.jsx("div",{className:`${D||"light"} flex ${n?"w-fit grow-0":"w-full grow"}`,dir:p==="he"||p==="ar"?"rtl":void 0,children:t.jsxRuntimeExports.jsx("div",{className:t.mo(`${C?C===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${p||"en"}`,f?.graphContainer),style:{...j?.graphContainer||{},...C&&C!==!0?{backgroundColor:C}:{}},id:N,ref:ie,"aria-label":K||`${r?`The graph shows ${r}. `:""}This is a chart where data points are represented by circles, and their sizes reflect their values.${b?` ${b}`:""}`,children:t.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:C?_||"1rem":_||0},children:t.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[r||b||P||z?t.jsxRuntimeExports.jsx(Me.GraphHeader,{styles:{title:j?.title,description:j?.description},classNames:{title:f?.title,description:f?.description},graphTitle:r,graphDescription:b,width:n,graphDownload:P?ie.current:void 0,dataDownload:z?o.map(e=>e.data).filter(e=>e!==void 0).length>0?o.map(e=>e.data).filter(e=>e!==void 0):o.filter(e=>e!==void 0):null}):null,t.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:o.length===0?t.jsxRuntimeExports.jsx(Ee.EmptyState,{}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[J&&o.filter(e=>e.color).length!==0?t.jsxRuntimeExports.jsx(we.ColorLegendWithMouseOver,{width:n,colorLegendTitle:H,colors:x||se.Colors[D].categoricalColors.colors,colorDomain:w||de.uniqBy(o.filter(e=>e.color),"color").map(e=>e.color),setSelectedColor:ae,showNAColor:E??!0,isCenter:!0}):null,t.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center w-full leading-0",ref:R,"aria-label":"Graph area",children:(n||g)&&(y||G)?t.jsxRuntimeExports.jsx(xe,{data:o,colors:o.filter(e=>e.color).length===0?x?[x]:[se.Colors.primaryColors["blue-600"]]:x||se.Colors[D].categoricalColors.colors,colorDomain:o.filter(e=>e.color).length===0?[]:w||de.uniqBy(o.filter(e=>e.color),"color").map(e=>e.color),width:n||g,height:Math.max(d,y||(u?d?(n||g)*u>d?(n||g)*u:d:(n||g)*u:G)),leftMargin:X,rightMargin:Y,topMargin:L,bottomMargin:O,showLabels:S,showValues:T!==!1?o.filter(e=>e.size).length!==0:T,selectedColor:ne,suffix:a,prefix:k,tooltip:A,onSeriesMouseOver:v,highlightedDataPoints:re,onSeriesMouseClick:le,theme:D,radius:$||Math.min(n||g,y||(u?d?(n||g)*u>d?(n||g)*u:d:(n||g)*u:G))*(o.filter(e=>!U.checkIfNullOrUndefined(e.size)).length===0?1:Math.max(...o.map(e=>e.size).filter(e=>e!=null)))/(o.filter(e=>!U.checkIfNullOrUndefined(e.size)).length===0?o.length:fe.sum(o.filter(e=>e.size).map(e=>e.size))*1.25),maxRadiusValue:Q,resetSelectionOnDoubleClick:F,detailsOnClick:Z,styles:j,classNames:f,dimmedOpacity:ee,precision:te}):null})]})}),c||B?t.jsxRuntimeExports.jsx(Ce.GraphFooter,{styles:{footnote:j?.footnote,source:j?.source},classNames:{footnote:f?.footnote,source:f?.source},sources:c,footNote:B,width:n}):null]})})})})}exports.CirclePackingGraph=Re;exports.extent=I;
|
|
2
|
+
//# sourceMappingURL=index-CZLvTu6p.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-D_n8aamX.cjs","sources":["../node_modules/d3-array/src/extent.js","../src/Components/Graphs/CirclePackingGraph/Graph.tsx","../src/Components/Graphs/CirclePackingGraph/index.tsx"],"sourcesContent":["export default function extent(values, valueof) {\n let min;\n let max;\n if (valueof === undefined) {\n for (const value of values) {\n if (value != null) {\n if (min === undefined) {\n if (value >= value) min = max = value;\n } else {\n if (min > value) min = value;\n if (max < value) max = value;\n }\n }\n }\n } else {\n let index = -1;\n for (let value of values) {\n if ((value = valueof(value, ++index, values)) != null) {\n if (min === undefined) {\n if (value >= value) min = max = value;\n } else {\n if (min > value) min = value;\n if (max < value) max = value;\n }\n }\n }\n }\n return [min, max];\n}\n","import { memo, useCallback, useMemo, useEffect, useState, useRef } from 'react';\r\nimport { forceCollide, forceManyBody, forceSimulation, forceX, forceY } from 'd3-force';\r\nimport orderBy from 'lodash.orderby';\r\nimport { scaleSqrt } from 'd3-scale';\r\nimport { extent } from 'd3-array';\r\nimport { Modal } from '@undp/design-system-react/Modal';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\n\r\nimport { ClassNameObject, StyleObject, TreeMapDataType } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { getTextColorBasedOnBgColor } from '@/Utils/getTextColorBasedOnBgColor';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { string2HTML } from '@/Utils/string2HTML';\r\n\r\ninterface Props {\r\n data: TreeMapDataType[];\r\n colors: string[];\r\n colorDomain: string[];\r\n leftMargin: number;\r\n rightMargin: number;\r\n topMargin: number;\r\n bottomMargin: number;\r\n showLabels: boolean;\r\n showValues: boolean;\r\n width: number;\r\n height: number;\r\n suffix: string;\r\n prefix: string;\r\n selectedColor?: string;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n highlightedDataPoints: (string | number)[];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n theme: 'light' | 'dark';\r\n maxRadiusValue?: number;\r\n radius: number;\r\n resetSelectionOnDoubleClick: boolean;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n styles?: StyleObject;\r\n classNames?: ClassNameObject;\r\n dimmedOpacity: number;\r\n precision: number;\r\n}\r\n\r\ninterface TreeMapDataTypeForBubbleChart extends TreeMapDataType {\r\n x: number;\r\n y: number;\r\n vx: number;\r\n vy: number;\r\n}\r\n\r\nexport const Graph = memo((props: Props) => {\r\n const {\r\n data,\r\n colors,\r\n leftMargin,\r\n width,\r\n height,\r\n colorDomain,\r\n selectedColor,\r\n rightMargin,\r\n topMargin,\r\n bottomMargin,\r\n showLabels,\r\n tooltip,\r\n onSeriesMouseOver,\r\n showValues,\r\n suffix,\r\n prefix,\r\n highlightedDataPoints,\r\n onSeriesMouseClick,\r\n maxRadiusValue,\r\n radius,\r\n resetSelectionOnDoubleClick,\r\n detailsOnClick,\r\n styles,\r\n classNames,\r\n dimmedOpacity,\r\n precision,\r\n } = props;\r\n const svgRef = useRef(null);\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mouseOverData, setMouseOverData] = useState<any>(undefined);\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n const [viewPortDimensions, setViewPortDimensions] = useState<\r\n [number, number, number, number] | undefined\r\n >(undefined);\r\n const [eventX, setEventX] = useState<number | undefined>(undefined);\r\n const [eventY, setEventY] = useState<number | undefined>(undefined);\r\n const [finalData, setFinalData] = useState<TreeMapDataTypeForBubbleChart[] | null>(null);\r\n\r\n // Memoize expensive calculations\r\n const margin = useMemo(\r\n () => ({\r\n top: topMargin,\r\n bottom: bottomMargin,\r\n left: leftMargin,\r\n right: rightMargin,\r\n }),\r\n [topMargin, bottomMargin, leftMargin, rightMargin],\r\n );\r\n\r\n const graphWidth = width - margin.left - margin.right;\r\n const graphHeight = height - margin.top - margin.bottom;\r\n\r\n // Memoize data ordering and radius scale\r\n const dataOrdered = useMemo(\r\n () =>\r\n data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? data\r\n : orderBy(\r\n data.filter(d => !checkIfNullOrUndefined(d.size)),\r\n 'radius',\r\n 'asc',\r\n ),\r\n [data],\r\n );\r\n\r\n const radiusScale = useMemo(() => {\r\n return data.filter(d => d.size === undefined || d.size === null).length !== data.length\r\n ? scaleSqrt()\r\n .domain([\r\n 0,\r\n checkIfNullOrUndefined(maxRadiusValue)\r\n ? Math.max(...data.map(d => d.size).filter(d => d !== undefined && d !== null))\r\n : (maxRadiusValue as number),\r\n ])\r\n .range([0.25, radius])\r\n .nice()\r\n : undefined;\r\n }, [data, maxRadiusValue, radius]);\r\n\r\n // Memoize simulation setup\r\n useEffect(() => {\r\n const setupSimulation = () => {\r\n const dataTemp = [...dataOrdered];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const simulation = forceSimulation(dataTemp as any)\r\n .force('y', forceY(_d => graphHeight / 2).strength(1))\r\n .force('x', forceX(_d => graphWidth / 2).strength(1))\r\n .force(\r\n 'collide',\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n forceCollide((d: any) => (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1)),\r\n )\r\n .force('charge', forceManyBody().strength(-15))\r\n .alphaDecay(0.05)\r\n .tick(10000);\r\n\r\n simulation\r\n .on('tick', () => {\r\n setFinalData(dataTemp as TreeMapDataTypeForBubbleChart[]);\r\n })\r\n .on('end', () => {\r\n setFinalData(dataTemp as TreeMapDataTypeForBubbleChart[]);\r\n const xMinExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.x - (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[0] || 0;\r\n const yMinExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.y - (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[0] || 0;\r\n const xMaxExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.x + (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[1] || 0;\r\n const yMaxExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.y + (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[1] || 0;\r\n setViewPortDimensions([\r\n xMinExtent,\r\n yMinExtent,\r\n xMinExtent < 0 ? xMaxExtent - xMinExtent : xMaxExtent,\r\n yMinExtent < 0 ? yMaxExtent - yMinExtent : yMaxExtent,\r\n ]);\r\n });\r\n };\r\n\r\n setupSimulation();\r\n }, [data, radius, graphHeight, graphWidth, maxRadiusValue, dataOrdered, radiusScale]);\r\n\r\n // Memoize event handlers to prevent unnecessary re-renders\r\n const handleMouseEnter = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (event: any, d: any) => {\r\n setMouseOverData(d);\r\n setEventY(event.clientY);\r\n setEventX(event.clientX);\r\n onSeriesMouseOver?.(d);\r\n },\r\n [onSeriesMouseOver],\r\n );\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const handleMouseMove = useCallback((event: any, d: any) => {\r\n setMouseOverData(d);\r\n setEventY(event.clientY);\r\n setEventX(event.clientX);\r\n }, []);\r\n\r\n const handleClick = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) => {\r\n if (onSeriesMouseClick || detailsOnClick) {\r\n if (mouseClickData === d.label && resetSelectionOnDoubleClick) {\r\n setMouseClickData(undefined);\r\n onSeriesMouseClick?.(undefined);\r\n } else {\r\n setMouseClickData(d.label);\r\n onSeriesMouseClick?.(d);\r\n }\r\n }\r\n },\r\n [onSeriesMouseClick, detailsOnClick, mouseClickData, resetSelectionOnDoubleClick],\r\n );\r\n\r\n const handleMouseLeave = useCallback(() => {\r\n setMouseOverData(undefined);\r\n setEventX(undefined);\r\n setEventY(undefined);\r\n onSeriesMouseOver?.(undefined);\r\n }, [onSeriesMouseOver]);\r\n\r\n // Memoize color and opacity calculations\r\n const getCircleColor = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) =>\r\n data.filter(el => el.color).length === 0\r\n ? colors[0]\r\n : !d.color\r\n ? Colors.gray\r\n : colors[colorDomain.indexOf(d.color)],\r\n [data, colors, colorDomain],\r\n );\r\n\r\n const getOpacity = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) =>\r\n selectedColor\r\n ? d.color\r\n ? colors[colorDomain.indexOf(d.color)] === selectedColor\r\n ? 1\r\n : dimmedOpacity\r\n : dimmedOpacity\r\n : highlightedDataPoints.length !== 0\r\n ? highlightedDataPoints.indexOf(d.label) !== -1\r\n ? 0.85\r\n : dimmedOpacity\r\n : 0.85,\r\n [selectedColor, dimmedOpacity, colors, colorDomain, highlightedDataPoints],\r\n );\r\n\r\n // Render loading state\r\n if (!finalData) {\r\n return (\r\n <div style={{ width: `${width}px`, height: `${height}px` }}>\r\n <div className='flex m-auto items-center justify-center p-0 leading-none text-base h-40'>\r\n <Spinner />\r\n </div>\r\n </div>\r\n );\r\n }\r\n if (viewPortDimensions) {\r\n return (\r\n <>\r\n <svg\r\n width={`${width}px`}\r\n height={`${height}px`}\r\n viewBox={`${viewPortDimensions[0] > 0 ? 0 : viewPortDimensions[0]} ${\r\n viewPortDimensions[1] > 0 ? 0 : viewPortDimensions[1]\r\n } ${width < viewPortDimensions[2] ? viewPortDimensions[2] : width} ${\r\n height < viewPortDimensions[3] ? viewPortDimensions[3] : height\r\n }`}\r\n direction='ltr'\r\n ref={svgRef}\r\n >\r\n <g transform={`translate(${margin.left},${margin.top})`}>\r\n {finalData.map(d => {\r\n const circleColor = getCircleColor(d);\r\n const opacity = getOpacity(d);\r\n const bubbleRadius = radiusScale ? radiusScale(d.size || 0) : radius;\r\n const showLabel = bubbleRadius > 20 && (showLabels || showValues);\r\n return (\r\n <g\r\n className='undp-viz-g-with-hover'\r\n key={d.label}\r\n opacity={opacity}\r\n transform={`translate(${d.x},${d.y})`}\r\n onMouseEnter={event => handleMouseEnter(event, d)}\r\n onMouseMove={event => handleMouseMove(event, d)}\r\n onClick={() => handleClick(d)}\r\n onMouseLeave={handleMouseLeave}\r\n >\r\n <circle cx={0} cy={0} r={bubbleRadius} fill={circleColor} />\r\n {(showLabel || showValues) && d.size !== undefined && d.size !== null && (\r\n <g>\r\n <foreignObject\r\n y={0 - bubbleRadius}\r\n x={0 - bubbleRadius}\r\n width={2 * bubbleRadius}\r\n height={2 * bubbleRadius}\r\n >\r\n <div className='flex flex-col justify-center items-center h-full py-0 px-3'>\r\n {showLabels && (\r\n <p\r\n className={cn(\r\n 'text-center leading-[1.25] overflow-hidden m-0 circle-packing-label',\r\n classNames?.graphObjectValues,\r\n )}\r\n style={{\r\n fontSize: `${Math.min(\r\n Math.max(Math.round(bubbleRadius / 4), 12),\r\n Math.max(\r\n Math.round((bubbleRadius * 12) / `${d.label}`.length),\r\n 12,\r\n ),\r\n 14,\r\n )}px`,\r\n WebkitLineClamp:\r\n bubbleRadius * 2 < 60\r\n ? 1\r\n : bubbleRadius * 2 < 75\r\n ? 2\r\n : bubbleRadius * 2 < 100\r\n ? 3\r\n : undefined,\r\n display: '-webkit-box',\r\n WebkitBoxOrient: 'vertical',\r\n color: getTextColorBasedOnBgColor(circleColor),\r\n hyphens: 'auto',\r\n ...(styles?.graphObjectValues || {}),\r\n }}\r\n >\r\n {d.label}\r\n </p>\r\n )}\r\n {showValues && (\r\n <p\r\n className='text-center font-bold leading-[1.25] w-full m-0 circle-packing-value'\r\n style={{\r\n fontSize: `${Math.min(\r\n Math.max(Math.round(bubbleRadius / 4), 14),\r\n 14,\r\n )}px`,\r\n color: getTextColorBasedOnBgColor(circleColor),\r\n }}\r\n >\r\n {numberFormattingFunction(d.size, 'NA', precision, prefix, suffix)}\r\n </p>\r\n )}\r\n </div>\r\n </foreignObject>\r\n </g>\r\n )}\r\n </g>\r\n );\r\n })}\r\n </g>\r\n </svg>\r\n {mouseOverData && tooltip && eventX && eventY && (\r\n <Tooltip\r\n data={mouseOverData}\r\n body={tooltip}\r\n xPos={eventX}\r\n yPos={eventY}\r\n backgroundStyle={styles?.tooltip}\r\n className={classNames?.tooltip}\r\n />\r\n )}\r\n {detailsOnClick && mouseClickData !== undefined ? (\r\n <Modal\r\n open={mouseClickData !== undefined}\r\n onClose={() => {\r\n setMouseClickData(undefined);\r\n }}\r\n >\r\n <div\r\n className='graph-modal-content m-0'\r\n dangerouslySetInnerHTML={\r\n typeof detailsOnClick === 'string'\r\n ? { __html: string2HTML(detailsOnClick, mouseClickData) }\r\n : undefined\r\n }\r\n >\r\n {typeof detailsOnClick === 'function' ? detailsOnClick(mouseClickData) : null}\r\n </div>\r\n </Modal>\r\n ) : null}\r\n </>\r\n );\r\n }\r\n return null;\r\n});\r\n\r\nGraph.displayName = 'BubbleChart';\r\n","import uniqBy from 'lodash.uniqby';\r\nimport { useState, useRef, useEffect } from 'react';\r\nimport sum from 'lodash.sum';\r\nimport { cn } from '@undp/design-system-react/cn';\r\n\r\nimport { Graph } from './Graph';\r\n\r\nimport { Languages, SourcesDataType, StyleObject, ClassNameObject, TreeMapDataType } from '@/Types';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { ColorLegendWithMouseOver } from '@/Components/Elements/ColorLegendWithMouseOver';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { EmptyState } from '@/Components/Elements/EmptyState';\r\n\r\ninterface Props {\r\n // Data\r\n /** Array of data objects */\r\n data: TreeMapDataType[];\r\n\r\n // Titles, Labels, and Sources\r\n /** Title of the graph */\r\n graphTitle?: string | React.ReactNode;\r\n /** Description of the graph */\r\n graphDescription?: string | React.ReactNode;\r\n /** Footnote for the graph */\r\n footNote?: string | React.ReactNode;\r\n /** Source data for the graph */\r\n sources?: SourcesDataType[];\r\n /** Accessibility label */\r\n ariaLabel?: string;\r\n\r\n // Colors and Styling\r\n /** Color or array of colors for circle */\r\n colors?: string | string[];\r\n /** Domain of colors for the graph */\r\n colorDomain?: string[];\r\n /** Title for the color legend */\r\n colorLegendTitle?: string;\r\n /** Background color of the graph */\r\n backgroundColor?: string | boolean;\r\n /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n styles?: StyleObject;\r\n /** Custom class names */\r\n classNames?: ClassNameObject;\r\n\r\n // Size and Spacing\r\n /** Width of the graph */\r\n width?: number;\r\n /** Height of the graph */\r\n height?: number;\r\n /** Minimum height of the graph */\r\n minHeight?: number;\r\n /** Relative height scaling factor. This overwrites the height props */\r\n relativeHeight?: number;\r\n /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n padding?: string;\r\n /** Left margin of the graph */\r\n leftMargin?: number;\r\n /** Right margin of the graph */\r\n rightMargin?: number;\r\n /** Top margin of the graph */\r\n topMargin?: number;\r\n /** Bottom margin of the graph */\r\n bottomMargin?: number;\r\n\r\n // Values and Ticks\r\n /** Prefix for values */\r\n prefix?: string;\r\n /** Suffix for values */\r\n suffix?: string;\r\n /** Maximum value mapped to the radius chart */\r\n maxRadiusValue?: number;\r\n\r\n // Graph Parameters\r\n /** Maximum radius of the circle */\r\n radius?: number;\r\n /** Toggle visibility of labels */\r\n showLabels?: boolean;\r\n /** Toggle visibility of values */\r\n showValues?: boolean;\r\n /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\r\n showColorScale?: boolean;\r\n /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */\r\n showNAColor?: boolean;\r\n /** Data points to highlight. Use the label value from data to highlight the data point */\r\n highlightedDataPoints?: (string | number)[];\r\n /** Defines the opacity of the non-highlighted data */\r\n dimmedOpacity?: number;\r\n /** Specifies the number of decimal places to display in the value. */\r\n precision?: number;\r\n /** Enable graph download option as png */\r\n graphDownload?: boolean;\r\n /** Enable data download option as a csv */\r\n dataDownload?: boolean;\r\n /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n resetSelectionOnDoubleClick?: boolean;\r\n\r\n // Interactions and Callbacks\r\n /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n /** Callback for mouse over event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n /** Callback for mouse click event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n\r\n // Configuration and Options\r\n /** Language setting */\r\n language?: Languages;\r\n /** Color theme */\r\n theme?: 'light' | 'dark';\r\n /** Unique ID for the graph */\r\n graphID?: string;\r\n}\r\n\r\nexport function CirclePackingGraph(props: Props) {\r\n const {\r\n data,\r\n graphTitle,\r\n colors,\r\n suffix = '',\r\n sources,\r\n prefix = '',\r\n graphDescription,\r\n leftMargin = 0,\r\n rightMargin = 0,\r\n height,\r\n width,\r\n footNote,\r\n colorDomain,\r\n colorLegendTitle,\r\n padding,\r\n backgroundColor = false,\r\n topMargin = 0,\r\n bottomMargin = 0,\r\n showLabels = true,\r\n relativeHeight,\r\n tooltip,\r\n onSeriesMouseOver,\r\n showColorScale = true,\r\n showValues,\r\n graphID,\r\n highlightedDataPoints = [],\r\n onSeriesMouseClick,\r\n graphDownload = false,\r\n dataDownload = false,\r\n language = 'en',\r\n showNAColor,\r\n minHeight = 0,\r\n theme = 'light',\r\n ariaLabel,\r\n radius,\r\n maxRadiusValue,\r\n resetSelectionOnDoubleClick = true,\r\n detailsOnClick,\r\n styles,\r\n classNames,\r\n dimmedOpacity = 0.3,\r\n precision = 2,\r\n } = props;\r\n const [svgWidth, setSvgWidth] = useState(0);\r\n const [svgHeight, setSvgHeight] = useState(0);\r\n const [selectedColor, setSelectedColor] = useState<string | undefined>(undefined);\r\n const graphDiv = useRef<HTMLDivElement>(null);\r\n const graphParentDiv = useRef<HTMLDivElement>(null);\r\n useEffect(() => {\r\n const resizeObserver = new ResizeObserver(entries => {\r\n setSvgWidth(width || entries[0].target.clientWidth || 620);\r\n setSvgHeight(height || entries[0].target.clientHeight || 480);\r\n });\r\n if (graphDiv.current) {\r\n setSvgHeight(graphDiv.current.clientHeight || 480);\r\n setSvgWidth(graphDiv.current.clientWidth || 620);\r\n if (!width) resizeObserver.observe(graphDiv.current);\r\n }\r\n return () => resizeObserver.disconnect();\r\n }, [width, height]);\r\n return (\r\n <div\r\n className={`${theme || 'light'} flex ${width ? 'w-fit grow-0' : 'w-full grow'}`}\r\n dir={language === 'he' || language === 'ar' ? 'rtl' : undefined}\r\n >\r\n <div\r\n className={cn(\r\n `${\r\n !backgroundColor\r\n ? 'bg-transparent '\r\n : backgroundColor === true\r\n ? 'bg-primary-gray-200 dark:bg-primary-gray-650 '\r\n : ''\r\n }ml-auto mr-auto flex flex-col grow h-inherit ${language || 'en'}`,\r\n classNames?.graphContainer,\r\n )}\r\n style={{\r\n ...(styles?.graphContainer || {}),\r\n ...(backgroundColor && backgroundColor !== true ? { backgroundColor } : {}),\r\n }}\r\n id={graphID}\r\n ref={graphParentDiv}\r\n aria-label={\r\n ariaLabel ||\r\n `${\r\n graphTitle ? `The graph shows ${graphTitle}. ` : ''\r\n }This is a chart where data points are represented by circles, and their sizes reflect their values.${\r\n graphDescription ? ` ${graphDescription}` : ''\r\n }`\r\n }\r\n >\r\n <div\r\n className='flex grow'\r\n style={{ padding: backgroundColor ? padding || '1rem' : padding || 0 }}\r\n >\r\n <div className='flex flex-col w-full gap-4 grow justify-between'>\r\n {graphTitle || graphDescription || graphDownload || dataDownload ? (\r\n <GraphHeader\r\n styles={{\r\n title: styles?.title,\r\n description: styles?.description,\r\n }}\r\n classNames={{\r\n title: classNames?.title,\r\n description: classNames?.description,\r\n }}\r\n graphTitle={graphTitle}\r\n graphDescription={graphDescription}\r\n width={width}\r\n graphDownload={graphDownload ? graphParentDiv.current : undefined}\r\n dataDownload={\r\n dataDownload\r\n ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n ? data.map(d => d.data).filter(d => d !== undefined)\r\n : data.filter(d => d !== undefined)\r\n : null\r\n }\r\n />\r\n ) : null}\r\n <div className='grow flex flex-col justify-center gap-3 w-full'>\r\n {data.length === 0 ? (\r\n <EmptyState />\r\n ) : (\r\n <>\r\n {showColorScale && data.filter(el => el.color).length !== 0 ? (\r\n <ColorLegendWithMouseOver\r\n width={width}\r\n colorLegendTitle={colorLegendTitle}\r\n colors={\r\n (colors as string[] | undefined) || Colors[theme].categoricalColors.colors\r\n }\r\n colorDomain={\r\n colorDomain ||\r\n (uniqBy(\r\n data.filter(el => el.color),\r\n 'color',\r\n ).map(d => d.color) as string[])\r\n }\r\n setSelectedColor={setSelectedColor}\r\n showNAColor={\r\n showNAColor === undefined || showNAColor === null ? true : showNAColor\r\n }\r\n isCenter\r\n />\r\n ) : null}\r\n <div\r\n className='flex flex-col grow justify-center w-full leading-0'\r\n ref={graphDiv}\r\n aria-label='Graph area'\r\n >\r\n {(width || svgWidth) && (height || svgHeight) ? (\r\n <Graph\r\n data={data}\r\n colors={\r\n data.filter(el => el.color).length === 0\r\n ? colors\r\n ? [colors as string]\r\n : [Colors.primaryColors['blue-600']]\r\n : (colors as string[] | undefined) ||\r\n Colors[theme].categoricalColors.colors\r\n }\r\n colorDomain={\r\n data.filter(el => el.color).length === 0\r\n ? []\r\n : colorDomain ||\r\n (uniqBy(\r\n data.filter(el => el.color),\r\n 'color',\r\n ).map(d => d.color) as string[])\r\n }\r\n width={width || svgWidth}\r\n height={Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}\r\n leftMargin={leftMargin}\r\n rightMargin={rightMargin}\r\n topMargin={topMargin}\r\n bottomMargin={bottomMargin}\r\n showLabels={showLabels}\r\n showValues={\r\n showValues !== false\r\n ? data.filter(el => el.size).length !== 0\r\n : (showValues as boolean)\r\n }\r\n selectedColor={selectedColor}\r\n suffix={suffix}\r\n prefix={prefix}\r\n tooltip={tooltip}\r\n onSeriesMouseOver={onSeriesMouseOver}\r\n highlightedDataPoints={highlightedDataPoints}\r\n onSeriesMouseClick={onSeriesMouseClick}\r\n theme={theme}\r\n radius={\r\n !radius\r\n ? (Math.min(\r\n width || svgWidth,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n ) *\r\n (data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? 1\r\n : Math.max(\r\n ...data\r\n .map(d => d.size)\r\n .filter(d => d !== undefined && d !== null),\r\n ))) /\r\n (data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? data.length\r\n : sum(data.filter(d => d.size).map(d => d.size)) * 1.25)\r\n : radius\r\n }\r\n maxRadiusValue={maxRadiusValue}\r\n resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n detailsOnClick={detailsOnClick}\r\n styles={styles}\r\n classNames={classNames}\r\n dimmedOpacity={dimmedOpacity}\r\n precision={precision}\r\n />\r\n ) : null}\r\n </div>\r\n </>\r\n )}\r\n </div>\r\n {sources || footNote ? (\r\n <GraphFooter\r\n styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n classNames={{\r\n footnote: classNames?.footnote,\r\n source: classNames?.source,\r\n }}\r\n sources={sources}\r\n footNote={footNote}\r\n width={width}\r\n />\r\n ) : null}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"names":["extent","values","valueof","min","max","value","index","Graph","memo","props","data","colors","leftMargin","width","height","colorDomain","selectedColor","rightMargin","topMargin","bottomMargin","showLabels","tooltip","onSeriesMouseOver","showValues","suffix","prefix","highlightedDataPoints","onSeriesMouseClick","maxRadiusValue","radius","resetSelectionOnDoubleClick","detailsOnClick","styles","classNames","dimmedOpacity","precision","svgRef","useRef","mouseOverData","setMouseOverData","useState","mouseClickData","setMouseClickData","viewPortDimensions","setViewPortDimensions","eventX","setEventX","eventY","setEventY","finalData","setFinalData","margin","useMemo","graphWidth","graphHeight","dataOrdered","d","checkIfNullOrUndefined","orderBy","radiusScale","scaleSqrt","useEffect","dataTemp","forceSimulation","forceY","_d","forceX","forceCollide","forceManyBody","xMinExtent","yMinExtent","xMaxExtent","yMaxExtent","handleMouseEnter","useCallback","event","handleMouseMove","handleClick","handleMouseLeave","getCircleColor","el","Colors","getOpacity","jsxs","Fragment","jsx","circleColor","opacity","bubbleRadius","showLabel","cn","getTextColorBasedOnBgColor","Tooltip","Modal","string2HTML","Spinner","CirclePackingGraph","graphTitle","sources","graphDescription","footNote","colorLegendTitle","padding","backgroundColor","relativeHeight","showColorScale","graphID","graphDownload","dataDownload","language","showNAColor","minHeight","theme","ariaLabel","svgWidth","setSvgWidth","svgHeight","setSvgHeight","setSelectedColor","graphDiv","graphParentDiv","resizeObserver","entries","GraphHeader","EmptyState","ColorLegendWithMouseOver","uniqBy","sum","GraphFooter"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"index-CZLvTu6p.cjs","sources":["../node_modules/d3-array/src/extent.js","../src/Components/Graphs/CirclePackingGraph/Graph.tsx","../src/Components/Graphs/CirclePackingGraph/index.tsx"],"sourcesContent":["export default function extent(values, valueof) {\n let min;\n let max;\n if (valueof === undefined) {\n for (const value of values) {\n if (value != null) {\n if (min === undefined) {\n if (value >= value) min = max = value;\n } else {\n if (min > value) min = value;\n if (max < value) max = value;\n }\n }\n }\n } else {\n let index = -1;\n for (let value of values) {\n if ((value = valueof(value, ++index, values)) != null) {\n if (min === undefined) {\n if (value >= value) min = max = value;\n } else {\n if (min > value) min = value;\n if (max < value) max = value;\n }\n }\n }\n }\n return [min, max];\n}\n","import { memo, useCallback, useMemo, useEffect, useState, useRef } from 'react';\r\nimport { forceCollide, forceManyBody, forceSimulation, forceX, forceY } from 'd3-force';\r\nimport orderBy from 'lodash.orderby';\r\nimport { scaleSqrt } from 'd3-scale';\r\nimport { extent } from 'd3-array';\r\nimport { Modal } from '@undp/design-system-react/Modal';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\n\r\nimport { ClassNameObject, StyleObject, TreeMapDataType } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { getTextColorBasedOnBgColor } from '@/Utils/getTextColorBasedOnBgColor';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { string2HTML } from '@/Utils/string2HTML';\r\n\r\ninterface Props {\r\n data: TreeMapDataType[];\r\n colors: string[];\r\n colorDomain: string[];\r\n leftMargin: number;\r\n rightMargin: number;\r\n topMargin: number;\r\n bottomMargin: number;\r\n showLabels: boolean;\r\n showValues: boolean;\r\n width: number;\r\n height: number;\r\n suffix: string;\r\n prefix: string;\r\n selectedColor?: string;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n highlightedDataPoints: (string | number)[];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n theme: 'light' | 'dark';\r\n maxRadiusValue?: number;\r\n radius: number;\r\n resetSelectionOnDoubleClick: boolean;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n styles?: StyleObject;\r\n classNames?: ClassNameObject;\r\n dimmedOpacity: number;\r\n precision: number;\r\n}\r\n\r\ninterface TreeMapDataTypeForBubbleChart extends TreeMapDataType {\r\n x: number;\r\n y: number;\r\n vx: number;\r\n vy: number;\r\n}\r\n\r\nexport const Graph = memo((props: Props) => {\r\n const {\r\n data,\r\n colors,\r\n leftMargin,\r\n width,\r\n height,\r\n colorDomain,\r\n selectedColor,\r\n rightMargin,\r\n topMargin,\r\n bottomMargin,\r\n showLabels,\r\n tooltip,\r\n onSeriesMouseOver,\r\n showValues,\r\n suffix,\r\n prefix,\r\n highlightedDataPoints,\r\n onSeriesMouseClick,\r\n maxRadiusValue,\r\n radius,\r\n resetSelectionOnDoubleClick,\r\n detailsOnClick,\r\n styles,\r\n classNames,\r\n dimmedOpacity,\r\n precision,\r\n } = props;\r\n const svgRef = useRef(null);\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mouseOverData, setMouseOverData] = useState<any>(undefined);\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n const [viewPortDimensions, setViewPortDimensions] = useState<\r\n [number, number, number, number] | undefined\r\n >(undefined);\r\n const [eventX, setEventX] = useState<number | undefined>(undefined);\r\n const [eventY, setEventY] = useState<number | undefined>(undefined);\r\n const [finalData, setFinalData] = useState<TreeMapDataTypeForBubbleChart[] | null>(null);\r\n\r\n // Memoize expensive calculations\r\n const margin = useMemo(\r\n () => ({\r\n top: topMargin,\r\n bottom: bottomMargin,\r\n left: leftMargin,\r\n right: rightMargin,\r\n }),\r\n [topMargin, bottomMargin, leftMargin, rightMargin],\r\n );\r\n\r\n const graphWidth = width - margin.left - margin.right;\r\n const graphHeight = height - margin.top - margin.bottom;\r\n\r\n // Memoize data ordering and radius scale\r\n const dataOrdered = useMemo(\r\n () =>\r\n data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? data\r\n : orderBy(\r\n data.filter(d => !checkIfNullOrUndefined(d.size)),\r\n 'radius',\r\n 'asc',\r\n ),\r\n [data],\r\n );\r\n\r\n const radiusScale = useMemo(() => {\r\n return data.filter(d => d.size === undefined || d.size === null).length !== data.length\r\n ? scaleSqrt()\r\n .domain([\r\n 0,\r\n checkIfNullOrUndefined(maxRadiusValue)\r\n ? Math.max(...data.map(d => d.size).filter(d => d !== undefined && d !== null))\r\n : (maxRadiusValue as number),\r\n ])\r\n .range([0.25, radius])\r\n .nice()\r\n : undefined;\r\n }, [data, maxRadiusValue, radius]);\r\n\r\n // Memoize simulation setup\r\n useEffect(() => {\r\n const setupSimulation = () => {\r\n const dataTemp = [...dataOrdered];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const simulation = forceSimulation(dataTemp as any)\r\n .force('y', forceY(_d => graphHeight / 2).strength(1))\r\n .force('x', forceX(_d => graphWidth / 2).strength(1))\r\n .force(\r\n 'collide',\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n forceCollide((d: any) => (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1)),\r\n )\r\n .force('charge', forceManyBody().strength(-15))\r\n .alphaDecay(0.05)\r\n .tick(10000);\r\n\r\n simulation\r\n .on('tick', () => {\r\n setFinalData(dataTemp as TreeMapDataTypeForBubbleChart[]);\r\n })\r\n .on('end', () => {\r\n setFinalData(dataTemp as TreeMapDataTypeForBubbleChart[]);\r\n const xMinExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.x - (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[0] || 0;\r\n const yMinExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.y - (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[0] || 0;\r\n const xMaxExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.x + (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[1] || 0;\r\n const yMaxExtent =\r\n extent(\r\n dataTemp as TreeMapDataTypeForBubbleChart[],\r\n d => d.y + (radiusScale ? radiusScale(d.size || 0) + 1 : radius + 1),\r\n )[1] || 0;\r\n setViewPortDimensions([\r\n xMinExtent,\r\n yMinExtent,\r\n xMinExtent < 0 ? xMaxExtent - xMinExtent : xMaxExtent,\r\n yMinExtent < 0 ? yMaxExtent - yMinExtent : yMaxExtent,\r\n ]);\r\n });\r\n };\r\n\r\n setupSimulation();\r\n }, [data, radius, graphHeight, graphWidth, maxRadiusValue, dataOrdered, radiusScale]);\r\n\r\n // Memoize event handlers to prevent unnecessary re-renders\r\n const handleMouseEnter = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (event: any, d: any) => {\r\n setMouseOverData(d);\r\n setEventY(event.clientY);\r\n setEventX(event.clientX);\r\n onSeriesMouseOver?.(d);\r\n },\r\n [onSeriesMouseOver],\r\n );\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const handleMouseMove = useCallback((event: any, d: any) => {\r\n setMouseOverData(d);\r\n setEventY(event.clientY);\r\n setEventX(event.clientX);\r\n }, []);\r\n\r\n const handleClick = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) => {\r\n if (onSeriesMouseClick || detailsOnClick) {\r\n if (mouseClickData === d.label && resetSelectionOnDoubleClick) {\r\n setMouseClickData(undefined);\r\n onSeriesMouseClick?.(undefined);\r\n } else {\r\n setMouseClickData(d.label);\r\n onSeriesMouseClick?.(d);\r\n }\r\n }\r\n },\r\n [onSeriesMouseClick, detailsOnClick, mouseClickData, resetSelectionOnDoubleClick],\r\n );\r\n\r\n const handleMouseLeave = useCallback(() => {\r\n setMouseOverData(undefined);\r\n setEventX(undefined);\r\n setEventY(undefined);\r\n onSeriesMouseOver?.(undefined);\r\n }, [onSeriesMouseOver]);\r\n\r\n // Memoize color and opacity calculations\r\n const getCircleColor = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) =>\r\n data.filter(el => el.color).length === 0\r\n ? colors[0]\r\n : !d.color\r\n ? Colors.gray\r\n : colors[colorDomain.indexOf(d.color)],\r\n [data, colors, colorDomain],\r\n );\r\n\r\n const getOpacity = useCallback(\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n (d: any) =>\r\n selectedColor\r\n ? d.color\r\n ? colors[colorDomain.indexOf(d.color)] === selectedColor\r\n ? 1\r\n : dimmedOpacity\r\n : dimmedOpacity\r\n : highlightedDataPoints.length !== 0\r\n ? highlightedDataPoints.indexOf(d.label) !== -1\r\n ? 0.85\r\n : dimmedOpacity\r\n : 0.85,\r\n [selectedColor, dimmedOpacity, colors, colorDomain, highlightedDataPoints],\r\n );\r\n\r\n // Render loading state\r\n if (!finalData) {\r\n return (\r\n <div style={{ width: `${width}px`, height: `${height}px` }}>\r\n <div className='flex m-auto items-center justify-center p-0 leading-none text-base h-40'>\r\n <Spinner />\r\n </div>\r\n </div>\r\n );\r\n }\r\n if (viewPortDimensions) {\r\n return (\r\n <>\r\n <svg\r\n width={`${width}px`}\r\n height={`${height}px`}\r\n viewBox={`${viewPortDimensions[0] > 0 ? 0 : viewPortDimensions[0]} ${\r\n viewPortDimensions[1] > 0 ? 0 : viewPortDimensions[1]\r\n } ${width < viewPortDimensions[2] ? viewPortDimensions[2] : width} ${\r\n height < viewPortDimensions[3] ? viewPortDimensions[3] : height\r\n }`}\r\n direction='ltr'\r\n ref={svgRef}\r\n >\r\n <g transform={`translate(${margin.left},${margin.top})`}>\r\n {finalData.map(d => {\r\n const circleColor = getCircleColor(d);\r\n const opacity = getOpacity(d);\r\n const bubbleRadius = radiusScale ? radiusScale(d.size || 0) : radius;\r\n const showLabel = bubbleRadius > 20 && (showLabels || showValues);\r\n return (\r\n <g\r\n className='undp-viz-g-with-hover'\r\n key={d.label}\r\n opacity={opacity}\r\n transform={`translate(${d.x},${d.y})`}\r\n onMouseEnter={event => handleMouseEnter(event, d)}\r\n onMouseMove={event => handleMouseMove(event, d)}\r\n onClick={() => handleClick(d)}\r\n onMouseLeave={handleMouseLeave}\r\n >\r\n <circle cx={0} cy={0} r={bubbleRadius} fill={circleColor} />\r\n {(showLabel || showValues) && d.size !== undefined && d.size !== null && (\r\n <g>\r\n <foreignObject\r\n y={0 - bubbleRadius}\r\n x={0 - bubbleRadius}\r\n width={2 * bubbleRadius}\r\n height={2 * bubbleRadius}\r\n >\r\n <div className='flex flex-col justify-center items-center h-full py-0 px-3'>\r\n {showLabels && (\r\n <p\r\n className={cn(\r\n 'text-center leading-[1.25] overflow-hidden m-0 circle-packing-label',\r\n classNames?.graphObjectValues,\r\n )}\r\n style={{\r\n fontSize: `${Math.min(\r\n Math.max(Math.round(bubbleRadius / 4), 12),\r\n Math.max(\r\n Math.round((bubbleRadius * 12) / `${d.label}`.length),\r\n 12,\r\n ),\r\n 14,\r\n )}px`,\r\n WebkitLineClamp:\r\n bubbleRadius * 2 < 60\r\n ? 1\r\n : bubbleRadius * 2 < 75\r\n ? 2\r\n : bubbleRadius * 2 < 100\r\n ? 3\r\n : undefined,\r\n display: '-webkit-box',\r\n WebkitBoxOrient: 'vertical',\r\n color: getTextColorBasedOnBgColor(circleColor),\r\n hyphens: 'auto',\r\n ...(styles?.graphObjectValues || {}),\r\n }}\r\n >\r\n {d.label}\r\n </p>\r\n )}\r\n {showValues && (\r\n <p\r\n className='text-center font-bold leading-[1.25] w-full m-0 circle-packing-value'\r\n style={{\r\n fontSize: `${Math.min(\r\n Math.max(Math.round(bubbleRadius / 4), 14),\r\n 14,\r\n )}px`,\r\n color: getTextColorBasedOnBgColor(circleColor),\r\n }}\r\n >\r\n {numberFormattingFunction(d.size, 'NA', precision, prefix, suffix)}\r\n </p>\r\n )}\r\n </div>\r\n </foreignObject>\r\n </g>\r\n )}\r\n </g>\r\n );\r\n })}\r\n </g>\r\n </svg>\r\n {mouseOverData && tooltip && eventX && eventY && (\r\n <Tooltip\r\n data={mouseOverData}\r\n body={tooltip}\r\n xPos={eventX}\r\n yPos={eventY}\r\n backgroundStyle={styles?.tooltip}\r\n className={classNames?.tooltip}\r\n />\r\n )}\r\n {detailsOnClick && mouseClickData !== undefined ? (\r\n <Modal\r\n open={mouseClickData !== undefined}\r\n onClose={() => {\r\n setMouseClickData(undefined);\r\n }}\r\n >\r\n <div\r\n className='graph-modal-content m-0'\r\n dangerouslySetInnerHTML={\r\n typeof detailsOnClick === 'string'\r\n ? { __html: string2HTML(detailsOnClick, mouseClickData) }\r\n : undefined\r\n }\r\n >\r\n {typeof detailsOnClick === 'function' ? detailsOnClick(mouseClickData) : null}\r\n </div>\r\n </Modal>\r\n ) : null}\r\n </>\r\n );\r\n }\r\n return null;\r\n});\r\n\r\nGraph.displayName = 'BubbleChart';\r\n","import uniqBy from 'lodash.uniqby';\r\nimport { useState, useRef, useEffect } from 'react';\r\nimport sum from 'lodash.sum';\r\nimport { cn } from '@undp/design-system-react/cn';\r\n\r\nimport { Graph } from './Graph';\r\n\r\nimport { Languages, SourcesDataType, StyleObject, ClassNameObject, TreeMapDataType } from '@/Types';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { ColorLegendWithMouseOver } from '@/Components/Elements/ColorLegendWithMouseOver';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { EmptyState } from '@/Components/Elements/EmptyState';\r\n\r\ninterface Props {\r\n // Data\r\n /** Array of data objects */\r\n data: TreeMapDataType[];\r\n\r\n // Titles, Labels, and Sources\r\n /** Title of the graph */\r\n graphTitle?: string | React.ReactNode;\r\n /** Description of the graph */\r\n graphDescription?: string | React.ReactNode;\r\n /** Footnote for the graph */\r\n footNote?: string | React.ReactNode;\r\n /** Source data for the graph */\r\n sources?: SourcesDataType[];\r\n /** Accessibility label */\r\n ariaLabel?: string;\r\n\r\n // Colors and Styling\r\n /** Color or array of colors for circle */\r\n colors?: string | string[];\r\n /** Domain of colors for the graph */\r\n colorDomain?: string[];\r\n /** Title for the color legend */\r\n colorLegendTitle?: string;\r\n /** Background color of the graph */\r\n backgroundColor?: string | boolean;\r\n /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n styles?: StyleObject;\r\n /** Custom class names */\r\n classNames?: ClassNameObject;\r\n\r\n // Size and Spacing\r\n /** Width of the graph */\r\n width?: number;\r\n /** Height of the graph */\r\n height?: number;\r\n /** Minimum height of the graph */\r\n minHeight?: number;\r\n /** Relative height scaling factor. This overwrites the height props */\r\n relativeHeight?: number;\r\n /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n padding?: string;\r\n /** Left margin of the graph */\r\n leftMargin?: number;\r\n /** Right margin of the graph */\r\n rightMargin?: number;\r\n /** Top margin of the graph */\r\n topMargin?: number;\r\n /** Bottom margin of the graph */\r\n bottomMargin?: number;\r\n\r\n // Values and Ticks\r\n /** Prefix for values */\r\n prefix?: string;\r\n /** Suffix for values */\r\n suffix?: string;\r\n /** Maximum value mapped to the radius chart */\r\n maxRadiusValue?: number;\r\n\r\n // Graph Parameters\r\n /** Maximum radius of the circle */\r\n radius?: number;\r\n /** Toggle visibility of labels */\r\n showLabels?: boolean;\r\n /** Toggle visibility of values */\r\n showValues?: boolean;\r\n /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\r\n showColorScale?: boolean;\r\n /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */\r\n showNAColor?: boolean;\r\n /** Data points to highlight. Use the label value from data to highlight the data point */\r\n highlightedDataPoints?: (string | number)[];\r\n /** Defines the opacity of the non-highlighted data */\r\n dimmedOpacity?: number;\r\n /** Specifies the number of decimal places to display in the value. */\r\n precision?: number;\r\n /** Enable graph download option as png */\r\n graphDownload?: boolean;\r\n /** Enable data download option as a csv */\r\n dataDownload?: boolean;\r\n /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n resetSelectionOnDoubleClick?: boolean;\r\n\r\n // Interactions and Callbacks\r\n /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n /** Callback for mouse over event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n /** Callback for mouse click event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n\r\n // Configuration and Options\r\n /** Language setting */\r\n language?: Languages;\r\n /** Color theme */\r\n theme?: 'light' | 'dark';\r\n /** Unique ID for the graph */\r\n graphID?: string;\r\n}\r\n\r\nexport function CirclePackingGraph(props: Props) {\r\n const {\r\n data,\r\n graphTitle,\r\n colors,\r\n suffix = '',\r\n sources,\r\n prefix = '',\r\n graphDescription,\r\n leftMargin = 0,\r\n rightMargin = 0,\r\n height,\r\n width,\r\n footNote,\r\n colorDomain,\r\n colorLegendTitle,\r\n padding,\r\n backgroundColor = false,\r\n topMargin = 0,\r\n bottomMargin = 0,\r\n showLabels = true,\r\n relativeHeight,\r\n tooltip,\r\n onSeriesMouseOver,\r\n showColorScale = true,\r\n showValues,\r\n graphID,\r\n highlightedDataPoints = [],\r\n onSeriesMouseClick,\r\n graphDownload = false,\r\n dataDownload = false,\r\n language = 'en',\r\n showNAColor,\r\n minHeight = 0,\r\n theme = 'light',\r\n ariaLabel,\r\n radius,\r\n maxRadiusValue,\r\n resetSelectionOnDoubleClick = true,\r\n detailsOnClick,\r\n styles,\r\n classNames,\r\n dimmedOpacity = 0.3,\r\n precision = 2,\r\n } = props;\r\n const [svgWidth, setSvgWidth] = useState(0);\r\n const [svgHeight, setSvgHeight] = useState(0);\r\n const [selectedColor, setSelectedColor] = useState<string | undefined>(undefined);\r\n const graphDiv = useRef<HTMLDivElement>(null);\r\n const graphParentDiv = useRef<HTMLDivElement>(null);\r\n useEffect(() => {\r\n const resizeObserver = new ResizeObserver(entries => {\r\n setSvgWidth(width || entries[0].target.clientWidth || 620);\r\n setSvgHeight(height || entries[0].target.clientHeight || 480);\r\n });\r\n if (graphDiv.current) {\r\n setSvgHeight(graphDiv.current.clientHeight || 480);\r\n setSvgWidth(graphDiv.current.clientWidth || 620);\r\n if (!width) resizeObserver.observe(graphDiv.current);\r\n }\r\n return () => resizeObserver.disconnect();\r\n }, [width, height]);\r\n return (\r\n <div\r\n className={`${theme || 'light'} flex ${width ? 'w-fit grow-0' : 'w-full grow'}`}\r\n dir={language === 'he' || language === 'ar' ? 'rtl' : undefined}\r\n >\r\n <div\r\n className={cn(\r\n `${\r\n !backgroundColor\r\n ? 'bg-transparent '\r\n : backgroundColor === true\r\n ? 'bg-primary-gray-200 dark:bg-primary-gray-650 '\r\n : ''\r\n }ml-auto mr-auto flex flex-col grow h-inherit ${language || 'en'}`,\r\n classNames?.graphContainer,\r\n )}\r\n style={{\r\n ...(styles?.graphContainer || {}),\r\n ...(backgroundColor && backgroundColor !== true ? { backgroundColor } : {}),\r\n }}\r\n id={graphID}\r\n ref={graphParentDiv}\r\n aria-label={\r\n ariaLabel ||\r\n `${\r\n graphTitle ? `The graph shows ${graphTitle}. ` : ''\r\n }This is a chart where data points are represented by circles, and their sizes reflect their values.${\r\n graphDescription ? ` ${graphDescription}` : ''\r\n }`\r\n }\r\n >\r\n <div\r\n className='flex grow'\r\n style={{ padding: backgroundColor ? padding || '1rem' : padding || 0 }}\r\n >\r\n <div className='flex flex-col w-full gap-4 grow justify-between'>\r\n {graphTitle || graphDescription || graphDownload || dataDownload ? (\r\n <GraphHeader\r\n styles={{\r\n title: styles?.title,\r\n description: styles?.description,\r\n }}\r\n classNames={{\r\n title: classNames?.title,\r\n description: classNames?.description,\r\n }}\r\n graphTitle={graphTitle}\r\n graphDescription={graphDescription}\r\n width={width}\r\n graphDownload={graphDownload ? graphParentDiv.current : undefined}\r\n dataDownload={\r\n dataDownload\r\n ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n ? data.map(d => d.data).filter(d => d !== undefined)\r\n : data.filter(d => d !== undefined)\r\n : null\r\n }\r\n />\r\n ) : null}\r\n <div className='grow flex flex-col justify-center gap-3 w-full'>\r\n {data.length === 0 ? (\r\n <EmptyState />\r\n ) : (\r\n <>\r\n {showColorScale && data.filter(el => el.color).length !== 0 ? (\r\n <ColorLegendWithMouseOver\r\n width={width}\r\n colorLegendTitle={colorLegendTitle}\r\n colors={\r\n (colors as string[] | undefined) || Colors[theme].categoricalColors.colors\r\n }\r\n colorDomain={\r\n colorDomain ||\r\n (uniqBy(\r\n data.filter(el => el.color),\r\n 'color',\r\n ).map(d => d.color) as string[])\r\n }\r\n setSelectedColor={setSelectedColor}\r\n showNAColor={\r\n showNAColor === undefined || showNAColor === null ? true : showNAColor\r\n }\r\n isCenter\r\n />\r\n ) : null}\r\n <div\r\n className='flex flex-col grow justify-center w-full leading-0'\r\n ref={graphDiv}\r\n aria-label='Graph area'\r\n >\r\n {(width || svgWidth) && (height || svgHeight) ? (\r\n <Graph\r\n data={data}\r\n colors={\r\n data.filter(el => el.color).length === 0\r\n ? colors\r\n ? [colors as string]\r\n : [Colors.primaryColors['blue-600']]\r\n : (colors as string[] | undefined) ||\r\n Colors[theme].categoricalColors.colors\r\n }\r\n colorDomain={\r\n data.filter(el => el.color).length === 0\r\n ? []\r\n : colorDomain ||\r\n (uniqBy(\r\n data.filter(el => el.color),\r\n 'color',\r\n ).map(d => d.color) as string[])\r\n }\r\n width={width || svgWidth}\r\n height={Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}\r\n leftMargin={leftMargin}\r\n rightMargin={rightMargin}\r\n topMargin={topMargin}\r\n bottomMargin={bottomMargin}\r\n showLabels={showLabels}\r\n showValues={\r\n showValues !== false\r\n ? data.filter(el => el.size).length !== 0\r\n : (showValues as boolean)\r\n }\r\n selectedColor={selectedColor}\r\n suffix={suffix}\r\n prefix={prefix}\r\n tooltip={tooltip}\r\n onSeriesMouseOver={onSeriesMouseOver}\r\n highlightedDataPoints={highlightedDataPoints}\r\n onSeriesMouseClick={onSeriesMouseClick}\r\n theme={theme}\r\n radius={\r\n !radius\r\n ? (Math.min(\r\n width || svgWidth,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n ) *\r\n (data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? 1\r\n : Math.max(\r\n ...data\r\n .map(d => d.size)\r\n .filter(d => d !== undefined && d !== null),\r\n ))) /\r\n (data.filter(d => !checkIfNullOrUndefined(d.size)).length === 0\r\n ? data.length\r\n : sum(data.filter(d => d.size).map(d => d.size)) * 1.25)\r\n : radius\r\n }\r\n maxRadiusValue={maxRadiusValue}\r\n resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n detailsOnClick={detailsOnClick}\r\n styles={styles}\r\n classNames={classNames}\r\n dimmedOpacity={dimmedOpacity}\r\n precision={precision}\r\n />\r\n ) : null}\r\n </div>\r\n </>\r\n )}\r\n </div>\r\n {sources || footNote ? (\r\n <GraphFooter\r\n styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n classNames={{\r\n footnote: classNames?.footnote,\r\n source: classNames?.source,\r\n }}\r\n sources={sources}\r\n footNote={footNote}\r\n width={width}\r\n />\r\n ) : null}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"names":["extent","values","valueof","min","max","value","index","Graph","memo","props","data","colors","leftMargin","width","height","colorDomain","selectedColor","rightMargin","topMargin","bottomMargin","showLabels","tooltip","onSeriesMouseOver","showValues","suffix","prefix","highlightedDataPoints","onSeriesMouseClick","maxRadiusValue","radius","resetSelectionOnDoubleClick","detailsOnClick","styles","classNames","dimmedOpacity","precision","svgRef","useRef","mouseOverData","setMouseOverData","useState","mouseClickData","setMouseClickData","viewPortDimensions","setViewPortDimensions","eventX","setEventX","eventY","setEventY","finalData","setFinalData","margin","useMemo","graphWidth","graphHeight","dataOrdered","d","checkIfNullOrUndefined","orderBy","radiusScale","scaleSqrt","useEffect","dataTemp","forceSimulation","forceY","_d","forceX","forceCollide","forceManyBody","xMinExtent","yMinExtent","xMaxExtent","yMaxExtent","handleMouseEnter","useCallback","event","handleMouseMove","handleClick","handleMouseLeave","getCircleColor","el","Colors","getOpacity","jsxs","Fragment","jsx","circleColor","opacity","bubbleRadius","showLabel","cn","getTextColorBasedOnBgColor","Tooltip","Modal","string2HTML","Spinner","CirclePackingGraph","graphTitle","sources","graphDescription","footNote","colorLegendTitle","padding","backgroundColor","relativeHeight","showColorScale","graphID","graphDownload","dataDownload","language","showNAColor","minHeight","theme","ariaLabel","svgWidth","setSvgWidth","svgHeight","setSvgHeight","setSelectedColor","graphDiv","graphParentDiv","resizeObserver","entries","GraphHeader","EmptyState","ColorLegendWithMouseOver","uniqBy","sum","GraphFooter"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { j as a } from "./index-CHPV5EwG-BPSP-7Jg.js";
|
|
2
2
|
import { Colors as g } from "./Colors.js";
|
|
3
|
-
import { m as e } from "./proxy-
|
|
3
|
+
import { m as e } from "./proxy-CkpFesk1.js";
|
|
4
4
|
function y(c) {
|
|
5
5
|
const { areaSettings: l, width: h, height: r, scale: o, animate: n, isInView: s } = c;
|
|
6
6
|
return /* @__PURE__ */ a.jsx(a.Fragment, { children: l.map((t, i) => /* @__PURE__ */ a.jsx(e.g, { children: t.coordinates[0] === null && t.coordinates[1] === null ? null : /* @__PURE__ */ a.jsx(e.g, { children: /* @__PURE__ */ a.jsx(
|
|
@@ -74,4 +74,4 @@ export {
|
|
|
74
74
|
y as H,
|
|
75
75
|
p as a
|
|
76
76
|
};
|
|
77
|
-
//# sourceMappingURL=index-
|
|
77
|
+
//# sourceMappingURL=index-Cdcfp4nk.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-
|
|
1
|
+
{"version":3,"file":"index-Cdcfp4nk.js","sources":["../src/Components/Elements/HighlightArea/index.tsx"],"sourcesContent":["import { NumberValue } from 'd3-scale';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n areaSettings: {\r\n coordinates: (Date | null | number)[];\r\n style?: React.CSSProperties;\r\n className?: string;\r\n color?: string;\r\n strokeWidth?: number;\r\n }[];\r\n width: number;\r\n height: number;\r\n scale: (value: Date | NumberValue) => number;\r\n animate: AnimateDataType;\r\n isInView: boolean;\r\n}\r\n\r\nexport function HighlightArea(props: Props) {\r\n const { areaSettings, width, height, scale, animate, isInView } = props;\r\n return (\r\n <>\r\n {areaSettings.map((d, i) => (\r\n <motion.g key={i}>\r\n {d.coordinates[0] === null && d.coordinates[1] === null ? null : (\r\n <motion.g>\r\n <motion.rect\r\n style={{\r\n fill: d.color || Colors.light.grays['gray-300'],\r\n strokeWidth: d.strokeWidth,\r\n ...(d.style || {}),\r\n }}\r\n className={d.className}\r\n y={0}\r\n height={height}\r\n variants={{\r\n initial: {\r\n width: 0,\r\n x: d.coordinates[0] ? scale(d.coordinates[0]) : 0,\r\n opacity: 1,\r\n },\r\n whileInView: {\r\n width: d.coordinates[1]\r\n ? scale(d.coordinates[1]) - (d.coordinates[0] ? scale(d.coordinates[0]) : 0)\r\n : width - (d.coordinates[0] ? scale(d.coordinates[0]) : 0),\r\n x: d.coordinates[0] ? scale(d.coordinates[0]) : 0,\r\n opacity: 1,\r\n transition: { duration: animate.duration },\r\n },\r\n }}\r\n initial='initial'\r\n animate={isInView ? 'whileInView' : 'initial'}\r\n exit={{ opacity: 0, width: 0, transition: { duration: animate.duration } }}\r\n />\r\n </motion.g>\r\n )}\r\n </motion.g>\r\n ))}\r\n </>\r\n );\r\n}\r\n\r\ninterface ScatterPlotProps {\r\n areaSettings: {\r\n coordinates: (Date | null | number)[];\r\n style?: React.CSSProperties;\r\n className?: string;\r\n color?: string;\r\n strokeWidth?: number;\r\n }[];\r\n width: number;\r\n height: number;\r\n scaleX: (value: Date | NumberValue) => number;\r\n scaleY: (value: Date | NumberValue) => number;\r\n animate: AnimateDataType;\r\n isInView: boolean;\r\n}\r\n\r\nexport function HighlightAreaForScatterPlot(props: ScatterPlotProps) {\r\n const { areaSettings, width, height, scaleX, scaleY, animate, isInView } = props;\r\n return (\r\n <>\r\n {areaSettings.map((d, i) => (\r\n <motion.g key={`${i}`}>\r\n {d.coordinates.filter(el => el === null).length === 4 ? null : (\r\n <motion.g>\r\n <motion.rect\r\n style={{\r\n fill: d.color || Colors.light.grays['gray-300'],\r\n strokeWidth: d.strokeWidth,\r\n ...(d.style || {}),\r\n }}\r\n className={d.className}\r\n variants={{\r\n initial: {\r\n x: d.coordinates[0] ? scaleX(d.coordinates[0] as number) : 0,\r\n width: 0,\r\n y: d.coordinates[3] ? scaleY(d.coordinates[3] as number) : 0,\r\n height: 0,\r\n },\r\n whileInView: {\r\n x: d.coordinates[0] ? scaleX(d.coordinates[0] as number) : 0,\r\n width: d.coordinates[1]\r\n ? scaleX(d.coordinates[1] as number) -\r\n (d.coordinates[0] ? scaleX(d.coordinates[0] as number) : 0)\r\n : width - (d.coordinates[0] ? scaleX(d.coordinates[0] as number) : 0),\r\n y: d.coordinates[3] ? scaleY(d.coordinates[3] as number) : 0,\r\n height:\r\n d.coordinates[2] !== null\r\n ? scaleY(d.coordinates[2] as number) -\r\n (d.coordinates[3] ? scaleY(d.coordinates[3] as number) : 0)\r\n : height -\r\n (d.coordinates[3] ? height - scaleY(d.coordinates[3] as number) : 0),\r\n transition: { duration: animate.duration },\r\n },\r\n }}\r\n initial='initial'\r\n animate={isInView ? 'whileInView' : 'initial'}\r\n exit={{\r\n opacity: 0,\r\n width: 0,\r\n height: 0,\r\n transition: { duration: animate.duration },\r\n }}\r\n />\r\n </motion.g>\r\n )}\r\n </motion.g>\r\n ))}\r\n </>\r\n );\r\n}\r\n"],"names":["HighlightArea","props","areaSettings","width","height","scale","animate","isInView","jsx","Fragment","d","motion","Colors","HighlightAreaForScatterPlot","scaleX","scaleY","i","el"],"mappings":"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"}
|