@undp/data-viz 1.5.9 → 2.0.1

package/dist/{customArea-x4L4xwLl.js.map → customArea-BUhPiPT6.js.map}

@@ -1 +1 @@
-{"version":3,"file":"customArea-x4L4xwLl.js","sources":["../src/Utils/getLineEndPoint.ts","../src/Components/Elements/Annotations.tsx","../src/Utils/getPathFromPoints.ts","../src/Components/Elements/HighlightArea/customArea.tsx"],"sourcesContent":["interface Coordinates {\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\nexport function getLineEndPoint(startPoint: Coordinates, targetPoint: Coordinates, radius: number) {\r\n  const circleCenter = { x: targetPoint.x, y: targetPoint.y };\r\n  const directionVector = {\r\n    x: startPoint.x - circleCenter.x,\r\n    y: startPoint.y - circleCenter.y,\r\n  };\r\n  const magnitude = Math.sqrt(directionVector.x ** 2 + directionVector.y ** 2);\r\n  const unitVector = {\r\n    x: directionVector.x / magnitude,\r\n    y: directionVector.y / magnitude,\r\n  };\r\n  return {\r\n    x: circleCenter.x + radius * unitVector.x,\r\n    y: circleCenter.y + radius * unitVector.y,\r\n  };\r\n}\r\n","import { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  color?: string;\r\n  connectorsSettings?: {\r\n    x1: number;\r\n    x2: number;\r\n    y1: number;\r\n    y2: number;\r\n    cx: number;\r\n    cy: number;\r\n    circleRadius: number;\r\n    strokeWidth: number;\r\n  };\r\n  labelSettings: {\r\n    x: number;\r\n    y: number;\r\n    width: number;\r\n    maxWidth?: number;\r\n    fontWeight?: 'regular' | 'bold' | 'medium';\r\n    align?: 'center' | 'left' | 'right';\r\n  };\r\n  text: string;\r\n  classNames?: {\r\n    connector?: string;\r\n    text?: string;\r\n  };\r\n  styles?: {\r\n    connector?: React.CSSProperties;\r\n    text?: React.CSSProperties;\r\n  };\r\n  animate: AnimateDataType;\r\n  isInView: boolean;\r\n}\r\n\r\nexport function Annotation(props: Props) {\r\n  const { connectorsSettings, text, color, labelSettings, classNames, styles, animate, isInView } =\r\n    props;\r\n  return (\r\n    <motion.g\r\n      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n      variants={{\r\n        initial: {\r\n          opacity: 0,\r\n        },\r\n        whileInView: {\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    >\r\n      {connectorsSettings ? (\r\n        <>\r\n          <circle\r\n            cy={connectorsSettings.cy}\r\n            cx={connectorsSettings.cx}\r\n            r={connectorsSettings.circleRadius}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n          <line\r\n            y1={connectorsSettings.y1}\r\n            x1={connectorsSettings.x1}\r\n            y2={connectorsSettings.y2}\r\n            x2={connectorsSettings.x2}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n        </>\r\n      ) : null}\r\n      <foreignObject\r\n        y={labelSettings.y}\r\n        x={labelSettings.x}\r\n        width={labelSettings.width}\r\n        height={1}\r\n        style={{ overflow: 'visible' }}\r\n      >\r\n        <p\r\n          className={cn(\r\n            'text-sm leading-[1.25] m-0 whitespace-normal',\r\n            labelSettings.fontWeight === 'bold'\r\n              ? 'font-bold'\r\n              : labelSettings.fontWeight === 'medium'\r\n                ? 'font-medium'\r\n                : 'font-normal',\r\n            labelSettings.align === 'right'\r\n              ? 'text-right'\r\n              : labelSettings.align === 'center'\r\n                ? 'text-center'\r\n                : 'text-left',\r\n            !color ? 'text-primary-gray-700 dark:text-primary-gray-300' : undefined,\r\n            classNames?.text,\r\n          )}\r\n          style={{\r\n            maxWidth: labelSettings.maxWidth || 'auto',\r\n            ...(color ? { color } : {}),\r\n            ...(styles?.text || {}),\r\n          }}\r\n        >\r\n          {text}\r\n        </p>\r\n      </foreignObject>\r\n    </motion.g>\r\n  );\r\n}\r\n","export function getPathFromPoints(pointsArray: number[], closePath?: boolean) {\r\n  if (pointsArray.length < 4 || pointsArray.length % 2 !== 0) {\r\n    return ''; // Need at least two points (4 numbers) and an even number of coordinates\r\n  }\r\n\r\n  let path = `M ${pointsArray[0]} ${pointsArray[1]}`; // Move to the first point\r\n  for (let i = 2; i < pointsArray.length; i += 2) {\r\n    path += ` L ${pointsArray[i]} ${pointsArray[i + 1]}`; // Draw lines to subsequent points\r\n  }\r\n  if (closePath === false) return path;\r\n\r\n  path += ' Z'; // Close the path\r\n\r\n  return path;\r\n}\r\n","import { NumberValue } from 'd3-scale';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { getPathFromPoints } from '@/Utils/getPathFromPoints';\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  areaSettings: {\r\n    coordinates: (Date | number)[];\r\n    closePath?: boolean;\r\n    style?: React.CSSProperties;\r\n    className?: string;\r\n    color?: string;\r\n    strokeWidth?: number;\r\n  }[];\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\nexport function CustomArea(props: Props) {\r\n  const { areaSettings, scaleX, scaleY, animate, isInView } = props;\r\n  return (\r\n    <>\r\n      {areaSettings.map(d => (\r\n        <motion.g\r\n          key={d.coordinates\r\n            .map(item => (item instanceof Date ? item.toISOString() : item.toString()))\r\n            .join('~')}\r\n          variants={{\r\n            initial: {\r\n              opacity: 0,\r\n            },\r\n            whileInView: {\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        >\r\n          {d.coordinates.length !== 4 ? (\r\n            <path\r\n              d={getPathFromPoints(\r\n                d.coordinates.map((el, j) => (j % 2 === 0 ? scaleX(el) : scaleY(el as number))),\r\n                d.closePath,\r\n              )}\r\n              style={{\r\n                strokeWidth: d.strokeWidth || 0,\r\n                ...(d.coordinates.length > 4 ? d.color && { fill: d.color } : { fill: 'none' }),\r\n                ...(d.color && { stroke: d.color }),\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color\r\n                  ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550 fill-primary-gray-300 dark:fill-primary-gray-550'\r\n                  : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          ) : (\r\n            <line\r\n              x1={scaleX(d.coordinates[0])}\r\n              y1={scaleY(d.coordinates[1] as number)}\r\n              x2={scaleX(d.coordinates[2])}\r\n              y2={scaleY(d.coordinates[3] as number)}\r\n              style={{\r\n                ...(d.color && { stroke: d.color }),\r\n                fill: 'none',\r\n                strokeWidth: d.strokeWidth || 1,\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550' : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          )}\r\n        </motion.g>\r\n      ))}\r\n    </>\r\n  );\r\n}\r\n"],"names":["getLineEndPoint","startPoint","targetPoint","radius","circleCenter","directionVector","magnitude","unitVector","Annotation","props","connectorsSettings","text","color","labelSettings","classNames","styles","animate","isInView","jsxs","motion","Fragment","jsx","cn","getPathFromPoints","pointsArray","closePath","path","CustomArea","areaSettings","scaleX","scaleY","d","el","j","item"],"mappings":"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"}
+{"version":3,"file":"customArea-BUhPiPT6.js","sources":["../src/Utils/getLineEndPoint.ts","../src/Components/Elements/Annotations.tsx","../src/Utils/getPathFromPoints.ts","../src/Components/Elements/HighlightArea/customArea.tsx"],"sourcesContent":["interface Coordinates {\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\nexport function getLineEndPoint(startPoint: Coordinates, targetPoint: Coordinates, radius: number) {\r\n  const circleCenter = { x: targetPoint.x, y: targetPoint.y };\r\n  const directionVector = {\r\n    x: startPoint.x - circleCenter.x,\r\n    y: startPoint.y - circleCenter.y,\r\n  };\r\n  const magnitude = Math.sqrt(directionVector.x ** 2 + directionVector.y ** 2);\r\n  const unitVector = {\r\n    x: directionVector.x / magnitude,\r\n    y: directionVector.y / magnitude,\r\n  };\r\n  return {\r\n    x: circleCenter.x + radius * unitVector.x,\r\n    y: circleCenter.y + radius * unitVector.y,\r\n  };\r\n}\r\n","import { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  color?: string;\r\n  connectorsSettings?: {\r\n    x1: number;\r\n    x2: number;\r\n    y1: number;\r\n    y2: number;\r\n    cx: number;\r\n    cy: number;\r\n    circleRadius: number;\r\n    strokeWidth: number;\r\n  };\r\n  labelSettings: {\r\n    x: number;\r\n    y: number;\r\n    width: number;\r\n    maxWidth?: number;\r\n    fontWeight?: 'regular' | 'bold' | 'medium';\r\n    align?: 'center' | 'left' | 'right';\r\n  };\r\n  text: string;\r\n  classNames?: {\r\n    connector?: string;\r\n    text?: string;\r\n  };\r\n  styles?: {\r\n    connector?: React.CSSProperties;\r\n    text?: React.CSSProperties;\r\n  };\r\n  animate: AnimateDataType;\r\n  isInView: boolean;\r\n}\r\n\r\nexport function Annotation(props: Props) {\r\n  const { connectorsSettings, text, color, labelSettings, classNames, styles, animate, isInView } =\r\n    props;\r\n  return (\r\n    <motion.g\r\n      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n      variants={{\r\n        initial: {\r\n          opacity: 0,\r\n        },\r\n        whileInView: {\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    >\r\n      {connectorsSettings ? (\r\n        <>\r\n          <circle\r\n            cy={connectorsSettings.cy}\r\n            cx={connectorsSettings.cx}\r\n            r={connectorsSettings.circleRadius}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n          <line\r\n            y1={connectorsSettings.y1}\r\n            x1={connectorsSettings.x1}\r\n            y2={connectorsSettings.y2}\r\n            x2={connectorsSettings.x2}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n        </>\r\n      ) : null}\r\n      <foreignObject\r\n        y={labelSettings.y}\r\n        x={labelSettings.x}\r\n        width={labelSettings.width}\r\n        height={1}\r\n        style={{ overflow: 'visible' }}\r\n      >\r\n        <p\r\n          className={cn(\r\n            'text-sm leading-[1.25] m-0 whitespace-normal',\r\n            labelSettings.fontWeight === 'bold'\r\n              ? 'font-bold'\r\n              : labelSettings.fontWeight === 'medium'\r\n                ? 'font-medium'\r\n                : 'font-normal',\r\n            labelSettings.align === 'right'\r\n              ? 'text-right'\r\n              : labelSettings.align === 'center'\r\n                ? 'text-center'\r\n                : 'text-left',\r\n            !color ? 'text-primary-gray-700 dark:text-primary-gray-300' : undefined,\r\n            classNames?.text,\r\n          )}\r\n          style={{\r\n            maxWidth: labelSettings.maxWidth || 'auto',\r\n            ...(color ? { color } : {}),\r\n            ...(styles?.text || {}),\r\n          }}\r\n        >\r\n          {text}\r\n        </p>\r\n      </foreignObject>\r\n    </motion.g>\r\n  );\r\n}\r\n","export function getPathFromPoints(pointsArray: number[], closePath?: boolean) {\r\n  if (pointsArray.length < 4 || pointsArray.length % 2 !== 0) {\r\n    return ''; // Need at least two points (4 numbers) and an even number of coordinates\r\n  }\r\n\r\n  let path = `M ${pointsArray[0]} ${pointsArray[1]}`; // Move to the first point\r\n  for (let i = 2; i < pointsArray.length; i += 2) {\r\n    path += ` L ${pointsArray[i]} ${pointsArray[i + 1]}`; // Draw lines to subsequent points\r\n  }\r\n  if (closePath === false) return path;\r\n\r\n  path += ' Z'; // Close the path\r\n\r\n  return path;\r\n}\r\n","import { NumberValue } from 'd3-scale';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { getPathFromPoints } from '@/Utils/getPathFromPoints';\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  areaSettings: {\r\n    coordinates: (Date | number)[];\r\n    closePath?: boolean;\r\n    style?: React.CSSProperties;\r\n    className?: string;\r\n    color?: string;\r\n    strokeWidth?: number;\r\n  }[];\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\nexport function CustomArea(props: Props) {\r\n  const { areaSettings, scaleX, scaleY, animate, isInView } = props;\r\n  return (\r\n    <>\r\n      {areaSettings.map(d => (\r\n        <motion.g\r\n          key={d.coordinates\r\n            .map(item => (item instanceof Date ? item.toISOString() : item.toString()))\r\n            .join('~')}\r\n          variants={{\r\n            initial: {\r\n              opacity: 0,\r\n            },\r\n            whileInView: {\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        >\r\n          {d.coordinates.length !== 4 ? (\r\n            <path\r\n              d={getPathFromPoints(\r\n                d.coordinates.map((el, j) => (j % 2 === 0 ? scaleX(el) : scaleY(el as number))),\r\n                d.closePath,\r\n              )}\r\n              style={{\r\n                strokeWidth: d.strokeWidth || 0,\r\n                ...(d.coordinates.length > 4 ? d.color && { fill: d.color } : { fill: 'none' }),\r\n                ...(d.color && { stroke: d.color }),\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color\r\n                  ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550 fill-primary-gray-300 dark:fill-primary-gray-550'\r\n                  : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          ) : (\r\n            <line\r\n              x1={scaleX(d.coordinates[0])}\r\n              y1={scaleY(d.coordinates[1] as number)}\r\n              x2={scaleX(d.coordinates[2])}\r\n              y2={scaleY(d.coordinates[3] as number)}\r\n              style={{\r\n                ...(d.color && { stroke: d.color }),\r\n                fill: 'none',\r\n                strokeWidth: d.strokeWidth || 1,\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550' : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          )}\r\n        </motion.g>\r\n      ))}\r\n    </>\r\n  );\r\n}\r\n"],"names":["getLineEndPoint","startPoint","targetPoint","radius","circleCenter","x","y","directionVector","magnitude","Math","sqrt","unitVector","Annotation","props","$","_c","connectorsSettings","text","color","labelSettings","classNames","styles","animate","isInView","t0","duration","opacity","transition","t1","Symbol","for","t2","initial","whileInView","t3","t4","connector","jsxs","Fragment","jsx","cy","cx","circleRadius","cn","fill","strokeWidth","stroke","y1","x1","y2","x2","t5","t6","t7","width","t8","overflow","t9","fontWeight","t10","align","t11","undefined","t12","t13","t14","maxWidth","t15","t16","t17","t18","t19","t20","motion","getPathFromPoints","pointsArray","closePath","length","path","i","CustomArea","areaSettings","scaleX","scaleY","d","coordinates","map","el","j","style","className","_temp","join","item","Date","toISOString","toString"],"mappings":"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"}

package/dist/customArea-CMF5g-C3.cjs

@@ -0,0 +1,2 @@
+"use strict";const s=require("./index-CHPV5EwG-CTPQjnHt.cjs"),I=require("./proxy-BxvUI_9l.cjs");function C(l,t,o){const r={x:t.x,y:t.y},i={x:l.x-r.x,y:l.y-r.y},n=Math.sqrt(i.x**2+i.y**2),a={x:i.x/n,y:i.y/n};return{x:r.x+o*a.x,y:r.y+o*a.y}}function P(l){const t=s.compilerRuntimeExports.c(39),{connectorsSettings:o,text:r,color:i,labelSettings:n,classNames:a,styles:c,animate:x,isInView:u}=l;let e;t[0]!==x.duration?(e={opacity:0,transition:{duration:x.duration}},t[0]=x.duration,t[1]=e):e=t[1];let y;t[2]===Symbol.for("react.memo_cache_sentinel")?(y={opacity:0},t[2]=y):y=t[2];let m;t[3]!==x.duration?(m={initial:y,whileInView:{opacity:1,transition:{duration:x.duration}}},t[3]=x.duration,t[4]=m):m=t[4];const R=u?"whileInView":"initial";let h;t[5]!==a?.connector||t[6]!==i||t[7]!==o||t[8]!==c?.connector?(h=o?s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("circle",{cy:o.cy,cx:o.cx,r:o.circleRadius,className:s.mo(i?"":"stroke-primary-gray-700 dark:stroke-primary-gray-300",a?.connector),style:{fill:"none",strokeWidth:o.strokeWidth,...i?{stroke:i}:{},...c?.connector||{}}}),s.jsxRuntimeExports.jsx("line",{y1:o.y1,x1:o.x1,y2:o.y2,x2:o.x2,className:s.mo(i?"":"stroke-primary-gray-700 dark:stroke-primary-gray-300",a?.connector),style:{fill:"none",strokeWidth:o.strokeWidth,...i?{stroke:i}:{},...c?.connector||{}}})]}):null,t[5]=a?.connector,t[6]=i,t[7]=o,t[8]=c?.connector,t[9]=h):h=t[9];const $=n.y,v=n.x,_=n.width;let w;t[10]===Symbol.for("react.memo_cache_sentinel")?(w={overflow:"visible"},t[10]=w):w=t[10];const W=n.fontWeight==="bold"?"font-bold":n.fontWeight==="medium"?"font-medium":"font-normal",V=n.align==="right"?"text-right":n.align==="center"?"text-center":"text-left",N=i?void 0:"text-primary-gray-700 dark:text-primary-gray-300",S=a?.text;let f;t[11]!==V||t[12]!==N||t[13]!==S||t[14]!==W?(f=s.mo("text-sm leading-[1.25] m-0 whitespace-normal",W,V,N,S),t[11]=V,t[12]=N,t[13]=S,t[14]=W,t[15]=f):f=t[15];const b=n.maxWidth||"auto";let g;t[16]!==i?(g=i?{color:i}:{},t[16]=i,t[17]=g):g=t[17];let p;t[18]!==c?.text?(p=c?.text||{},t[18]=c?.text,t[19]=p):p=t[19];let d;t[20]!==b||t[21]!==g||t[22]!==p?(d={maxWidth:b,...g,...p},t[20]=b,t[21]=g,t[22]=p,t[23]=d):d=t[23];let k;t[24]!==f||t[25]!==d||t[26]!==r?(k=s.jsxRuntimeExports.jsx("p",{className:f,style:d,children:r}),t[24]=f,t[25]=d,t[26]=r,t[27]=k):k=t[27];let j;t[28]!==n.width||t[29]!==n.x||t[30]!==n.y||t[31]!==k?(j=s.jsxRuntimeExports.jsx("foreignObject",{y:$,x:v,width:_,height:1,style:w,children:k}),t[28]=n.width,t[29]=n.x,t[30]=n.y,t[31]=k,t[32]=j):j=t[32];let E;return t[33]!==e||t[34]!==j||t[35]!==m||t[36]!==R||t[37]!==h?(E=s.jsxRuntimeExports.jsxs(I.motion.g,{exit:e,variants:m,initial:"initial",animate:R,children:[h,j]}),t[33]=e,t[34]=j,t[35]=m,t[36]=R,t[37]=h,t[38]=E):E=t[38],E}function q(l,t){if(l.length<4||l.length%2!==0)return"";let o=`M ${l[0]} ${l[1]}`;for(let r=2;r<l.length;r+=2)o+=` L ${l[r]} ${l[r+1]}`;return t===!1||(o+=" Z"),o}function F(l){const t=s.compilerRuntimeExports.c(13),{areaSettings:o,scaleX:r,scaleY:i,animate:n,isInView:a}=l;let c;if(t[0]!==n||t[1]!==o||t[2]!==a||t[3]!==r||t[4]!==i){let u;t[6]!==n||t[7]!==a||t[8]!==r||t[9]!==i?(u=e=>s.jsxRuntimeExports.jsx(I.motion.g,{variants:{initial:{opacity:0},whileInView:{opacity:1,transition:{duration:n.duration}}},initial:"initial",animate:a?"whileInView":"initial",children:e.coordinates.length!==4?s.jsxRuntimeExports.jsx("path",{d:q(e.coordinates.map((y,m)=>m%2===0?r(y):i(y)),e.closePath),style:{strokeWidth:e.strokeWidth||0,...e.coordinates.length>4?e.color&&{fill:e.color}:{fill:"none"},...e.color&&{stroke:e.color},...e.style||{}},className:s.mo(e.color?"":"stroke-primary-gray-300 dark:stroke-primary-gray-550 fill-primary-gray-300 dark:fill-primary-gray-550",e.className)}):s.jsxRuntimeExports.jsx("line",{x1:r(e.coordinates[0]),y1:i(e.coordinates[1]),x2:r(e.coordinates[2]),y2:i(e.coordinates[3]),style:{...e.color&&{stroke:e.color},fill:"none",strokeWidth:e.strokeWidth||1,...e.style||{}},className:s.mo(e.color?"":"stroke-primary-gray-300 dark:stroke-primary-gray-550",e.className)})},e.coordinates.map(L).join("~")),t[6]=n,t[7]=a,t[8]=r,t[9]=i,t[10]=u):u=t[10],c=o.map(u),t[0]=n,t[1]=o,t[2]=a,t[3]=r,t[4]=i,t[5]=c}else c=t[5];let x;return t[11]!==c?(x=s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:c}),t[11]=c,t[12]=x):x=t[12],x}function L(l){return l instanceof Date?l.toISOString():l.toString()}exports.Annotation=P;exports.CustomArea=F;exports.getLineEndPoint=C;
+//# sourceMappingURL=customArea-CMF5g-C3.cjs.map

package/dist/{customArea-1G1S78s_.cjs.map → customArea-CMF5g-C3.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"customArea-1G1S78s_.cjs","sources":["../src/Utils/getLineEndPoint.ts","../src/Components/Elements/Annotations.tsx","../src/Utils/getPathFromPoints.ts","../src/Components/Elements/HighlightArea/customArea.tsx"],"sourcesContent":["interface Coordinates {\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\nexport function getLineEndPoint(startPoint: Coordinates, targetPoint: Coordinates, radius: number) {\r\n  const circleCenter = { x: targetPoint.x, y: targetPoint.y };\r\n  const directionVector = {\r\n    x: startPoint.x - circleCenter.x,\r\n    y: startPoint.y - circleCenter.y,\r\n  };\r\n  const magnitude = Math.sqrt(directionVector.x ** 2 + directionVector.y ** 2);\r\n  const unitVector = {\r\n    x: directionVector.x / magnitude,\r\n    y: directionVector.y / magnitude,\r\n  };\r\n  return {\r\n    x: circleCenter.x + radius * unitVector.x,\r\n    y: circleCenter.y + radius * unitVector.y,\r\n  };\r\n}\r\n","import { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  color?: string;\r\n  connectorsSettings?: {\r\n    x1: number;\r\n    x2: number;\r\n    y1: number;\r\n    y2: number;\r\n    cx: number;\r\n    cy: number;\r\n    circleRadius: number;\r\n    strokeWidth: number;\r\n  };\r\n  labelSettings: {\r\n    x: number;\r\n    y: number;\r\n    width: number;\r\n    maxWidth?: number;\r\n    fontWeight?: 'regular' | 'bold' | 'medium';\r\n    align?: 'center' | 'left' | 'right';\r\n  };\r\n  text: string;\r\n  classNames?: {\r\n    connector?: string;\r\n    text?: string;\r\n  };\r\n  styles?: {\r\n    connector?: React.CSSProperties;\r\n    text?: React.CSSProperties;\r\n  };\r\n  animate: AnimateDataType;\r\n  isInView: boolean;\r\n}\r\n\r\nexport function Annotation(props: Props) {\r\n  const { connectorsSettings, text, color, labelSettings, classNames, styles, animate, isInView } =\r\n    props;\r\n  return (\r\n    <motion.g\r\n      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n      variants={{\r\n        initial: {\r\n          opacity: 0,\r\n        },\r\n        whileInView: {\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    >\r\n      {connectorsSettings ? (\r\n        <>\r\n          <circle\r\n            cy={connectorsSettings.cy}\r\n            cx={connectorsSettings.cx}\r\n            r={connectorsSettings.circleRadius}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n          <line\r\n            y1={connectorsSettings.y1}\r\n            x1={connectorsSettings.x1}\r\n            y2={connectorsSettings.y2}\r\n            x2={connectorsSettings.x2}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n        </>\r\n      ) : null}\r\n      <foreignObject\r\n        y={labelSettings.y}\r\n        x={labelSettings.x}\r\n        width={labelSettings.width}\r\n        height={1}\r\n        style={{ overflow: 'visible' }}\r\n      >\r\n        <p\r\n          className={cn(\r\n            'text-sm leading-[1.25] m-0 whitespace-normal',\r\n            labelSettings.fontWeight === 'bold'\r\n              ? 'font-bold'\r\n              : labelSettings.fontWeight === 'medium'\r\n                ? 'font-medium'\r\n                : 'font-normal',\r\n            labelSettings.align === 'right'\r\n              ? 'text-right'\r\n              : labelSettings.align === 'center'\r\n                ? 'text-center'\r\n                : 'text-left',\r\n            !color ? 'text-primary-gray-700 dark:text-primary-gray-300' : undefined,\r\n            classNames?.text,\r\n          )}\r\n          style={{\r\n            maxWidth: labelSettings.maxWidth || 'auto',\r\n            ...(color ? { color } : {}),\r\n            ...(styles?.text || {}),\r\n          }}\r\n        >\r\n          {text}\r\n        </p>\r\n      </foreignObject>\r\n    </motion.g>\r\n  );\r\n}\r\n","export function getPathFromPoints(pointsArray: number[], closePath?: boolean) {\r\n  if (pointsArray.length < 4 || pointsArray.length % 2 !== 0) {\r\n    return ''; // Need at least two points (4 numbers) and an even number of coordinates\r\n  }\r\n\r\n  let path = `M ${pointsArray[0]} ${pointsArray[1]}`; // Move to the first point\r\n  for (let i = 2; i < pointsArray.length; i += 2) {\r\n    path += ` L ${pointsArray[i]} ${pointsArray[i + 1]}`; // Draw lines to subsequent points\r\n  }\r\n  if (closePath === false) return path;\r\n\r\n  path += ' Z'; // Close the path\r\n\r\n  return path;\r\n}\r\n","import { NumberValue } from 'd3-scale';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { getPathFromPoints } from '@/Utils/getPathFromPoints';\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  areaSettings: {\r\n    coordinates: (Date | number)[];\r\n    closePath?: boolean;\r\n    style?: React.CSSProperties;\r\n    className?: string;\r\n    color?: string;\r\n    strokeWidth?: number;\r\n  }[];\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\nexport function CustomArea(props: Props) {\r\n  const { areaSettings, scaleX, scaleY, animate, isInView } = props;\r\n  return (\r\n    <>\r\n      {areaSettings.map(d => (\r\n        <motion.g\r\n          key={d.coordinates\r\n            .map(item => (item instanceof Date ? item.toISOString() : item.toString()))\r\n            .join('~')}\r\n          variants={{\r\n            initial: {\r\n              opacity: 0,\r\n            },\r\n            whileInView: {\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        >\r\n          {d.coordinates.length !== 4 ? (\r\n            <path\r\n              d={getPathFromPoints(\r\n                d.coordinates.map((el, j) => (j % 2 === 0 ? scaleX(el) : scaleY(el as number))),\r\n                d.closePath,\r\n              )}\r\n              style={{\r\n                strokeWidth: d.strokeWidth || 0,\r\n                ...(d.coordinates.length > 4 ? d.color && { fill: d.color } : { fill: 'none' }),\r\n                ...(d.color && { stroke: d.color }),\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color\r\n                  ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550 fill-primary-gray-300 dark:fill-primary-gray-550'\r\n                  : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          ) : (\r\n            <line\r\n              x1={scaleX(d.coordinates[0])}\r\n              y1={scaleY(d.coordinates[1] as number)}\r\n              x2={scaleX(d.coordinates[2])}\r\n              y2={scaleY(d.coordinates[3] as number)}\r\n              style={{\r\n                ...(d.color && { stroke: d.color }),\r\n                fill: 'none',\r\n                strokeWidth: d.strokeWidth || 1,\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550' : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          )}\r\n        </motion.g>\r\n      ))}\r\n    </>\r\n  );\r\n}\r\n"],"names":["getLineEndPoint","startPoint","targetPoint","radius","circleCenter","directionVector","magnitude","unitVector","Annotation","props","connectorsSettings","text","color","labelSettings","classNames","styles","animate","isInView","jsxs","motion","Fragment","jsx","cn","getPathFromPoints","pointsArray","closePath","path","i","CustomArea","areaSettings","scaleX","scaleY","d","el","j","item"],"mappings":"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"}
+{"version":3,"file":"customArea-CMF5g-C3.cjs","sources":["../src/Utils/getLineEndPoint.ts","../src/Components/Elements/Annotations.tsx","../src/Utils/getPathFromPoints.ts","../src/Components/Elements/HighlightArea/customArea.tsx"],"sourcesContent":["interface Coordinates {\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\nexport function getLineEndPoint(startPoint: Coordinates, targetPoint: Coordinates, radius: number) {\r\n  const circleCenter = { x: targetPoint.x, y: targetPoint.y };\r\n  const directionVector = {\r\n    x: startPoint.x - circleCenter.x,\r\n    y: startPoint.y - circleCenter.y,\r\n  };\r\n  const magnitude = Math.sqrt(directionVector.x ** 2 + directionVector.y ** 2);\r\n  const unitVector = {\r\n    x: directionVector.x / magnitude,\r\n    y: directionVector.y / magnitude,\r\n  };\r\n  return {\r\n    x: circleCenter.x + radius * unitVector.x,\r\n    y: circleCenter.y + radius * unitVector.y,\r\n  };\r\n}\r\n","import { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  color?: string;\r\n  connectorsSettings?: {\r\n    x1: number;\r\n    x2: number;\r\n    y1: number;\r\n    y2: number;\r\n    cx: number;\r\n    cy: number;\r\n    circleRadius: number;\r\n    strokeWidth: number;\r\n  };\r\n  labelSettings: {\r\n    x: number;\r\n    y: number;\r\n    width: number;\r\n    maxWidth?: number;\r\n    fontWeight?: 'regular' | 'bold' | 'medium';\r\n    align?: 'center' | 'left' | 'right';\r\n  };\r\n  text: string;\r\n  classNames?: {\r\n    connector?: string;\r\n    text?: string;\r\n  };\r\n  styles?: {\r\n    connector?: React.CSSProperties;\r\n    text?: React.CSSProperties;\r\n  };\r\n  animate: AnimateDataType;\r\n  isInView: boolean;\r\n}\r\n\r\nexport function Annotation(props: Props) {\r\n  const { connectorsSettings, text, color, labelSettings, classNames, styles, animate, isInView } =\r\n    props;\r\n  return (\r\n    <motion.g\r\n      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n      variants={{\r\n        initial: {\r\n          opacity: 0,\r\n        },\r\n        whileInView: {\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    >\r\n      {connectorsSettings ? (\r\n        <>\r\n          <circle\r\n            cy={connectorsSettings.cy}\r\n            cx={connectorsSettings.cx}\r\n            r={connectorsSettings.circleRadius}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n          <line\r\n            y1={connectorsSettings.y1}\r\n            x1={connectorsSettings.x1}\r\n            y2={connectorsSettings.y2}\r\n            x2={connectorsSettings.x2}\r\n            className={cn(\r\n              !color ? 'stroke-primary-gray-700 dark:stroke-primary-gray-300' : '',\r\n              classNames?.connector,\r\n            )}\r\n            style={{\r\n              fill: 'none',\r\n              strokeWidth: connectorsSettings.strokeWidth,\r\n              ...(color ? { stroke: color } : {}),\r\n              ...(styles?.connector || {}),\r\n            }}\r\n          />\r\n        </>\r\n      ) : null}\r\n      <foreignObject\r\n        y={labelSettings.y}\r\n        x={labelSettings.x}\r\n        width={labelSettings.width}\r\n        height={1}\r\n        style={{ overflow: 'visible' }}\r\n      >\r\n        <p\r\n          className={cn(\r\n            'text-sm leading-[1.25] m-0 whitespace-normal',\r\n            labelSettings.fontWeight === 'bold'\r\n              ? 'font-bold'\r\n              : labelSettings.fontWeight === 'medium'\r\n                ? 'font-medium'\r\n                : 'font-normal',\r\n            labelSettings.align === 'right'\r\n              ? 'text-right'\r\n              : labelSettings.align === 'center'\r\n                ? 'text-center'\r\n                : 'text-left',\r\n            !color ? 'text-primary-gray-700 dark:text-primary-gray-300' : undefined,\r\n            classNames?.text,\r\n          )}\r\n          style={{\r\n            maxWidth: labelSettings.maxWidth || 'auto',\r\n            ...(color ? { color } : {}),\r\n            ...(styles?.text || {}),\r\n          }}\r\n        >\r\n          {text}\r\n        </p>\r\n      </foreignObject>\r\n    </motion.g>\r\n  );\r\n}\r\n","export function getPathFromPoints(pointsArray: number[], closePath?: boolean) {\r\n  if (pointsArray.length < 4 || pointsArray.length % 2 !== 0) {\r\n    return ''; // Need at least two points (4 numbers) and an even number of coordinates\r\n  }\r\n\r\n  let path = `M ${pointsArray[0]} ${pointsArray[1]}`; // Move to the first point\r\n  for (let i = 2; i < pointsArray.length; i += 2) {\r\n    path += ` L ${pointsArray[i]} ${pointsArray[i + 1]}`; // Draw lines to subsequent points\r\n  }\r\n  if (closePath === false) return path;\r\n\r\n  path += ' Z'; // Close the path\r\n\r\n  return path;\r\n}\r\n","import { NumberValue } from 'd3-scale';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport { motion } from 'motion/react';\r\n\r\nimport { getPathFromPoints } from '@/Utils/getPathFromPoints';\r\nimport { AnimateDataType } from '@/Types';\r\n\r\ninterface Props {\r\n  areaSettings: {\r\n    coordinates: (Date | number)[];\r\n    closePath?: boolean;\r\n    style?: React.CSSProperties;\r\n    className?: string;\r\n    color?: string;\r\n    strokeWidth?: number;\r\n  }[];\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\nexport function CustomArea(props: Props) {\r\n  const { areaSettings, scaleX, scaleY, animate, isInView } = props;\r\n  return (\r\n    <>\r\n      {areaSettings.map(d => (\r\n        <motion.g\r\n          key={d.coordinates\r\n            .map(item => (item instanceof Date ? item.toISOString() : item.toString()))\r\n            .join('~')}\r\n          variants={{\r\n            initial: {\r\n              opacity: 0,\r\n            },\r\n            whileInView: {\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        >\r\n          {d.coordinates.length !== 4 ? (\r\n            <path\r\n              d={getPathFromPoints(\r\n                d.coordinates.map((el, j) => (j % 2 === 0 ? scaleX(el) : scaleY(el as number))),\r\n                d.closePath,\r\n              )}\r\n              style={{\r\n                strokeWidth: d.strokeWidth || 0,\r\n                ...(d.coordinates.length > 4 ? d.color && { fill: d.color } : { fill: 'none' }),\r\n                ...(d.color && { stroke: d.color }),\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color\r\n                  ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550 fill-primary-gray-300 dark:fill-primary-gray-550'\r\n                  : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          ) : (\r\n            <line\r\n              x1={scaleX(d.coordinates[0])}\r\n              y1={scaleY(d.coordinates[1] as number)}\r\n              x2={scaleX(d.coordinates[2])}\r\n              y2={scaleY(d.coordinates[3] as number)}\r\n              style={{\r\n                ...(d.color && { stroke: d.color }),\r\n                fill: 'none',\r\n                strokeWidth: d.strokeWidth || 1,\r\n                ...(d.style || {}),\r\n              }}\r\n              className={cn(\r\n                !d.color ? 'stroke-primary-gray-300 dark:stroke-primary-gray-550' : '',\r\n                d.className,\r\n              )}\r\n            />\r\n          )}\r\n        </motion.g>\r\n      ))}\r\n    </>\r\n  );\r\n}\r\n"],"names":["getLineEndPoint","startPoint","targetPoint","radius","circleCenter","x","y","directionVector","magnitude","Math","sqrt","unitVector","Annotation","props","$","_c","connectorsSettings","text","color","labelSettings","classNames","styles","animate","isInView","t0","duration","opacity","transition","t1","Symbol","for","t2","initial","whileInView","t3","t4","connector","jsxs","Fragment","jsx","cy","cx","circleRadius","cn","fill","strokeWidth","stroke","y1","x1","y2","x2","t5","t6","t7","width","t8","overflow","t9","fontWeight","t10","align","t11","undefined","t12","t13","t14","maxWidth","t15","t16","t17","t18","t19","t20","motion","getPathFromPoints","pointsArray","closePath","length","path","i","CustomArea","areaSettings","scaleX","scaleY","d","coordinates","map","el","j","style","className","_temp","join","item","Date","toISOString","toString"],"mappings":"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"}