@elliemae/ds-dataviz-pie 3.22.0-next.7 → 3.22.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/cjs/Pie.js.map +1 -1
  2. package/dist/cjs/PieContext.js.map +1 -1
  3. package/dist/cjs/config/useKeyboardNavigation.js.map +1 -1
  4. package/dist/cjs/config/usePie.js.map +1 -1
  5. package/dist/cjs/helpers/colorPallet.js.map +1 -1
  6. package/dist/cjs/index.js.map +1 -1
  7. package/dist/cjs/parts/ChartContainer.js.map +1 -1
  8. package/dist/cjs/parts/ColorLegend.js.map +1 -1
  9. package/dist/cjs/parts/Pie.js.map +1 -1
  10. package/dist/cjs/parts/Slice.js.map +1 -1
  11. package/dist/cjs/react-desc-prop-types.js.map +1 -1
  12. package/dist/cjs/styles.js.map +1 -1
  13. package/dist/esm/Pie.js.map +1 -1
  14. package/dist/esm/PieContext.js.map +1 -1
  15. package/dist/esm/config/useKeyboardNavigation.js.map +1 -1
  16. package/dist/esm/config/usePie.js.map +1 -1
  17. package/dist/esm/helpers/colorPallet.js.map +1 -1
  18. package/dist/esm/index.js.map +1 -1
  19. package/dist/esm/parts/ChartContainer.js.map +1 -1
  20. package/dist/esm/parts/ColorLegend.js.map +1 -1
  21. package/dist/esm/parts/Pie.js.map +1 -1
  22. package/dist/esm/parts/Slice.js.map +1 -1
  23. package/dist/esm/react-desc-prop-types.js.map +1 -1
  24. package/dist/esm/styles.js.map +1 -1
  25. package/package.json +12 -12
package/dist/cjs/Pie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/Pie.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/Pie.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React from 'react';\nimport { ChartContainer } from './parts/ChartContainer.js';\nimport { Pie } from './parts/Pie.js';\nimport { PieContext } from './PieContext.js';\nimport { usePie } from './config/usePie.js';\nimport type { DSPieT } from './react-desc-prop-types.js';\nimport { ColorLegend } from './parts/ColorLegend.js';\nexport const PieChart: React.ComponentType<DSPieT.Props> = (props) => {\n const ctx = usePie(props);\n return (\n <PieContext.Provider value={ctx}>\n <ChartContainer>\n <ColorLegend />\n <Pie />\n </ChartContainer>\n </PieContext.Provider>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADWjB;AAVN,4BAA+B;AAC/B,iBAAoB;AACpB,wBAA2B;AAC3B,oBAAuB;AAEvB,yBAA4B;AACrB,MAAM,WAA8C,CAAC,UAAU;AACpE,QAAM,UAAM,sBAAO,KAAK;AACxB,SACE,4CAAC,6BAAW,UAAX,EAAoB,OAAO,KAC1B,uDAAC,wCACC;AAAA,gDAAC,kCAAY;AAAA,IACb,4CAAC,kBAAI;AAAA,KACP,GACF;AAEJ;",
6
6
  "names": []
package/dist/cjs/PieContext.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/PieContext.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/PieContext.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { createContext, createRef } from 'react';\nimport type { ScaleOrdinal } from 'd3';\nimport { scaleOrdinal } from 'd3';\nimport type { DSPieT } from './react-desc-prop-types.js';\n\ninterface PieChartContextT {\n props: Partial<DSPieT.Props>;\n innerHeight: number;\n innerWidth: number;\n activeSerie: string;\n setActiveSerie: React.Dispatch<React.SetStateAction<string>>;\n containerRef: React.RefObject<HTMLDivElement>;\n groups: string[];\n colorScale: ScaleOrdinal<string, unknown, never>;\n}\n\nconst pieChartdefaultContext: PieChartContextT = {\n // props: defaultProps,\n // innerHeight: 0,\n // innerWidth: 0,\n // activeSerie: '',\n // setActiveSerie: () => {},\n // containerRef: createRef<HTMLDivElement>(),\n // groups: [],\n // colorScale: scaleOrdinal(),\n};\n\nexport const PieContext = createContext(pieChartdefaultContext);\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AAgBzC,MAAM,yBAA2C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASjD;AAEO,MAAM,iBAAa,4BAAc,sBAAsB;",
6
6
  "names": []
package/dist/cjs/config/useKeyboardNavigation.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/config/useKeyboardNavigation.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/config/useKeyboardNavigation.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext } from 'react';\nimport { PieContext } from '../PieContext.js';\n\nexport const findInCircularList = (\n list,\n from: number,\n //criteria: (item) => boolean,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const { activeSerie, setActiveSerie, containerRef, currentData } = useContext(PieContext);\n\n // const currentGroup = useMemo(() => data.find((d) => d.name === currentFocusedDataset), [currentFocusedDataset, data]);\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(() => {\n setActiveSerie(currentData[0].key);\n }, [currentData, setActiveSerie]);\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (\n !containerRef?.current?.contains(document.activeElement) ||\n containerRef?.current === document.activeElement\n ) {\n setActiveSerie('');\n }\n });\n }, [containerRef, setActiveSerie]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newFocusedSliceIndex = findInCircularList(\n currentData,\n currentData.findIndex((serie) => serie.key === activeSerie),\n step,\n );\n setActiveSerie(currentData[newFocusedSliceIndex].key);\n },\n [activeSerie, currentData, setActiveSerie],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n },\n [navigateSerie],\n );\n\n return { onInputKeyDown, handleOnBlur, handleOnFocus };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAwC;AACxC,wBAA2B;AAEpB,MAAM,qBAAqB,CAChC,MACA,MAEA,OAAO,MAEI;AACX,WACM,KAAK,OAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,KAAK,IAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,KAAK,CAAC;AAAG,aAAO;AAAA,EACtB;AACA,SAAO;AACT;AAEO,MAAM,wBAAwB,MAAM;AACzC,QAAM,EAAE,aAAa,gBAAgB,cAAc,YAAY,QAAI,yBAAW,4BAAU;AAIxF,QAAM,oBAAyD,0BAAY,MAAM;AAC/E,mBAAe,YAAY,CAAC,EAAE,GAAG;AAAA,EACnC,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,QAAM,mBAA0D,0BAAY,MAAM;AAChF,eAAW,MAAM;AACf,UACE,CAAC,cAAc,SAAS,SAAS,SAAS,aAAa,KACvD,cAAc,YAAY,SAAS,eACnC;AACA,uBAAe,EAAE;AAAA,MACnB;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,cAAc,cAAc,CAAC;AAEjC,QAAM,oBAAgB;AAAA,IACpB,CAAC,SAAiB;AAChB,YAAM,uBAAuB;AAAA,QAC3B;AAAA,QACA,YAAY,UAAU,CAAC,UAAU,MAAM,QAAQ,WAAW;AAAA,QAC1D;AAAA,MACF;AACA,qBAAe,YAAY,oBAAoB,EAAE,GAAG;AAAA,IACtD;AAAA,IACA,CAAC,aAAa,aAAa,cAAc;AAAA,EAC3C;AAEA,QAAM,qBAA+D;AAAA,IACnE,CAAC,MAAM;AACL,UAAI,EAAE,SAAS,OAAO;AACpB,UAAE,eAAe;AAAA,MACnB;AACA,UAAI,CAAC,aAAa,YAAY,EAAE,SAAS,EAAE,IAAI,GAAG;AAChD,sBAAc,EAAE,SAAS,cAAc,KAAK,CAAC;AAAA,MAC/C;AAAA,IACF;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AAEA,SAAO,EAAE,gBAAgB,cAAc,cAAc;AACvD;",
6
6
  "names": []
package/dist/cjs/config/usePie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/config/usePie.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/config/usePie.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useMemo, useState, useRef } from 'react';\nimport { pie } from 'd3';\n//\nimport { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSPieT } from '../react-desc-prop-types.js';\n\nexport const usePie = (props: DSPieT.Props) => {\n // useValidateTypescriptPropTypes(props, propTypes);\n\n const { series, width, height, margin, isHalfPie, size } = props;\n\n const containerRef = useRef(null);\n const svgRef = useRef(null);\n\n const [activeSerie, setActiveSerie] = useState('');\n\n const prevInnerWidth = width - margin.left - margin.right;\n const prevInnerHeight = height - margin.top - margin.bottom;\n const prevRadius = isHalfPie\n ? Math.min(prevInnerWidth, prevInnerHeight)\n : Math.min(prevInnerWidth, prevInnerHeight) / 2;\n\n const innerHeight = useMemo(() => prevInnerHeight - prevRadius * 0.1 * 2, [prevInnerHeight, prevRadius]);\n const innerWidth = useMemo(() => prevInnerWidth - prevRadius * 0.1 * 2, [prevInnerWidth, prevRadius]);\n\n const radius = isHalfPie ? Math.min(innerHeight, innerWidth) : Math.min(innerHeight, innerWidth) / 2;\n\n const groups = series.map((serie) => serie.name);\n\n const currentData = useMemo(\n () =>\n series.map((serie, i) => ({\n ...serie,\n key: `${serie.name}-${i}`,\n })),\n [series],\n );\n let total = 0;\n const data = series.reduce((acc, curr) => {\n total += curr.data;\n return { ...acc, [curr.name]: curr.data };\n }, {});\n if (size) {\n data.rest = size - total;\n }\n const pieGenerator = pie()\n .value((d) => d[1])\n .sort(null)\n .padAngle(0.02);\n const pieData = pieGenerator(Object.entries(data));\n\n return useMemo(\n () => ({\n props,\n innerHeight,\n innerWidth,\n groups,\n svgRef,\n containerRef,\n activeSerie,\n pieData,\n setActiveSerie,\n currentData,\n prevRadius,\n radius,\n }),\n [props, radius, prevRadius, innerHeight, innerWidth, groups, activeSerie, pieData, currentData],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA0C;AAC1C,gBAAoB;AAKb,MAAM,SAAS,CAAC,UAAwB;AAG7C,QAAM,EAAE,QAAQ,OAAO,QAAQ,QAAQ,WAAW,KAAK,IAAI;AAE3D,QAAM,mBAAe,qBAAO,IAAI;AAChC,QAAM,aAAS,qBAAO,IAAI;AAE1B,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,EAAE;AAEjD,QAAM,iBAAiB,QAAQ,OAAO,OAAO,OAAO;AACpD,QAAM,kBAAkB,SAAS,OAAO,MAAM,OAAO;AACrD,QAAM,aAAa,YACf,KAAK,IAAI,gBAAgB,eAAe,IACxC,KAAK,IAAI,gBAAgB,eAAe,IAAI;AAEhD,QAAM,kBAAc,sBAAQ,MAAM,kBAAkB,aAAa,MAAM,GAAG,CAAC,iBAAiB,UAAU,CAAC;AACvG,QAAM,iBAAa,sBAAQ,MAAM,iBAAiB,aAAa,MAAM,GAAG,CAAC,gBAAgB,UAAU,CAAC;AAEpG,QAAM,SAAS,YAAY,KAAK,IAAI,aAAa,UAAU,IAAI,KAAK,IAAI,aAAa,UAAU,IAAI;AAEnG,QAAM,SAAS,OAAO,IAAI,CAAC,UAAU,MAAM,IAAI;AAE/C,QAAM,kBAAc;AAAA,IAClB,MACE,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,MACxB,GAAG;AAAA,MACH,KAAK,GAAG,MAAM,QAAQ;AAAA,IACxB,EAAE;AAAA,IACJ,CAAC,MAAM;AAAA,EACT;AACA,MAAI,QAAQ;AACZ,QAAM,OAAO,OAAO,OAAO,CAAC,KAAK,SAAS;AACxC,aAAS,KAAK;AACd,WAAO,EAAE,GAAG,KAAK,CAAC,KAAK,IAAI,GAAG,KAAK,KAAK;AAAA,EAC1C,GAAG,CAAC,CAAC;AACL,MAAI,MAAM;AACR,SAAK,OAAO,OAAO;AAAA,EACrB;AACA,QAAM,mBAAe,eAAI,EACtB,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,EACjB,KAAK,IAAI,EACT,SAAS,IAAI;AAChB,QAAM,UAAU,aAAa,OAAO,QAAQ,IAAI,CAAC;AAEjD,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,YAAY,aAAa,YAAY,QAAQ,aAAa,SAAS,WAAW;AAAA,EAChG;AACF;",
6
6
  "names": []
package/dist/cjs/helpers/colorPallet.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/helpers/colorPallet.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/helpers/colorPallet.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["export const COLOR_PALLET = {\n 'blue-100': '#1E79C2',\n 'blue-200': '#165A91',\n 'blue-400': '#10426A',\n 'magenta-100': '#CA3981',\n 'magenta-200': '#832553',\n 'magenta-400': '#6E1F46',\n 'orange-100': '#B25119',\n 'orange-200': '#853C12',\n 'orange-400': '#612C0D',\n 'purple-100': '#8E49B2',\n 'purple-200': '#61327A',\n 'purple-400': '#4D2861',\n 'green-100': '#007A78',\n 'green-200': '#005B59',\n 'green-400': '#004241',\n 'grey-100': '#697489',\n 'grey-200': '#4E5666',\n 'grey-400': '#323842',\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,eAAe;AAAA,EACf,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AACd;",
6
6
  "names": []
package/dist/cjs/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/index.ts", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/index.ts", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["export { PieChart } from './Pie.js';\nexport { COLOR_PALLET } from './helpers/colorPallet.js';\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iBAAyB;AACzB,yBAA6B;",
6
6
  "names": []
package/dist/cjs/parts/ChartContainer.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/parts/ChartContainer.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/parts/ChartContainer.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { StyledSVGWrapper } from '../styles.js';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation.js';\nimport { PieContext } from '../PieContext.js';\n// import { useKeyboardNavigation } from '../config/useKeyboardNavigation';\ninterface ChartContainerT {\n children: JSX.Element | JSX.Element[] | string | string[];\n}\nexport const ChartContainer: React.ComponentType<ChartContainerT> = ({ children }) => {\n const {\n props: { width, height, margin, responsive, hasBaseline, isHalfPie },\n containerRef,\n innerHeight,\n radius,\n activeSerie,\n } = useContext(PieContext);\n\n const dimensions = useMemo(\n () =>\n responsive\n ? {\n viewBox: `0 0 ${width} ${height}`,\n }\n : {\n width,\n height,\n },\n [height, responsive, width],\n );\n\n const marginRadius = useMemo(() => {\n if (isHalfPie) {\n return radius * 0.1;\n }\n return radius * 0.1;\n });\n const { onInputKeyDown, handleOnBlur, handleOnFocus } = useKeyboardNavigation();\n\n return (\n <StyledSVGWrapper\n ref={containerRef}\n onKeyDown={onInputKeyDown}\n // aria-hidden=\"true\"\n tabIndex={activeSerie ? -1 : 0}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onMouseDown={(e) => e.preventDefault()}\n style={{ width: `${width}px`, height: `${height}px` }}\n >\n <svg {...dimensions}>\n <g className=\"container\" transform={`translate(${margin.left + marginRadius},${margin.top + marginRadius})`}>\n {children}\n </g>\n {hasBaseline ? (\n <line\n x1={0}\n x2={width}\n y1={innerHeight + marginRadius}\n y2={innerHeight + marginRadius}\n stroke=\"grey\"\n strokeWidth=\"2\"\n />\n ) : null}\n </svg>\n </StyledSVGWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDjB;AAjDN,mBAA2C;AAC3C,oBAAiC;AACjC,mCAAsC;AACtC,wBAA2B;AAKpB,MAAM,iBAAuD,CAAC,EAAE,SAAS,MAAM;AACpF,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,QAAQ,QAAQ,YAAY,aAAa,UAAU;AAAA,IACnE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,4BAAU;AAEzB,QAAM,iBAAa;AAAA,IACjB,MACE,aACI;AAAA,MACE,SAAS,OAAO,SAAS;AAAA,IAC3B,IACA;AAAA,MACE;AAAA,MACA;AAAA,IACF;AAAA,IACN,CAAC,QAAQ,YAAY,KAAK;AAAA,EAC5B;AAEA,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,WAAW;AACb,aAAO,SAAS;AAAA,IAClB;AACA,WAAO,SAAS;AAAA,EAClB,CAAC;AACD,QAAM,EAAE,gBAAgB,cAAc,cAAc,QAAI,oDAAsB;AAE9E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW;AAAA,MAEX,UAAU,cAAc,KAAK;AAAA,MAC7B,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,aAAa,CAAC,MAAM,EAAE,eAAe;AAAA,MACrC,OAAO,EAAE,OAAO,GAAG,WAAW,QAAQ,GAAG,WAAW;AAAA,MAEpD,uDAAC,SAAK,GAAG,YACP;AAAA,oDAAC,OAAE,WAAU,aAAY,WAAW,aAAa,OAAO,OAAO,gBAAgB,OAAO,MAAM,iBACzF,UACH;AAAA,QACC,cACC;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,IAAI;AAAA,YACJ,IAAI,cAAc;AAAA,YAClB,IAAI,cAAc;AAAA,YAClB,QAAO;AAAA,YACP,aAAY;AAAA;AAAA,QACd,IACE;AAAA,SACN;AAAA;AAAA,EACF;AAEJ;",
6
6
  "names": []
package/dist/cjs/parts/ColorLegend.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/parts/ColorLegend.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/parts/ColorLegend.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React, { useContext } from 'react';\nimport { PieContext } from '../PieContext.js';\n\nexport const ColorLegend = ({ tickSpacing = 20, tickSize = 10, tickTextOffset = 20 }) => {\n const {\n colorScale,\n innerWidth,\n props: { colorLegend, circleRadius },\n } = useContext(PieContext);\n\n if (!colorLegend) return null;\n return (\n <g transform={`translate(${innerWidth + 30},30)`}>\n <text x={35} y={-25} className=\"axis-label\" textAnchor=\"middle\">\n {colorLegend.label}\n </text>\n {colorScale.domain().map((domainValue, i) => (\n <g className=\"tick\" transform={`translate(0,${i * tickSpacing})`}>\n <circle fill={colorScale(domainValue)} r={circleRadius ?? tickSize} />\n <text x={tickTextOffset} dy=\".32em\">\n {domainValue}\n </text>\n </g>\n ))}\n </g>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADajB;AAbN,mBAAkC;AAClC,wBAA2B;AAEpB,MAAM,cAAc,CAAC,EAAE,cAAc,IAAI,WAAW,IAAI,iBAAiB,GAAG,MAAM;AACvF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,aAAa,aAAa;AAAA,EACrC,QAAI,yBAAW,4BAAU;AAEzB,MAAI,CAAC;AAAa,WAAO;AACzB,SACE,6CAAC,OAAE,WAAW,aAAa,aAAa,UACtC;AAAA,gDAAC,UAAK,GAAG,IAAI,GAAG,KAAK,WAAU,cAAa,YAAW,UACpD,sBAAY,OACf;AAAA,IACC,WAAW,OAAO,EAAE,IAAI,CAAC,aAAa,MACrC,6CAAC,OAAE,WAAU,QAAO,WAAW,eAAe,IAAI,gBAChD;AAAA,kDAAC,YAAO,MAAM,WAAW,WAAW,GAAG,GAAG,gBAAgB,UAAU;AAAA,MACpE,4CAAC,UAAK,GAAG,gBAAgB,IAAG,SACzB,uBACH;AAAA,OACF,CACD;AAAA,KACH;AAEJ;",
6
6
  "names": []
package/dist/cjs/parts/Pie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/parts/Pie.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/parts/Pie.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React, { useContext } from 'react';\nimport { Slice } from './Slice.js';\nimport { PieContext } from '../PieContext.js';\nimport { StyledInnerText } from '../styles.js';\nexport const Pie = () => {\n const {\n innerHeight,\n innerWidth,\n pieData,\n\n props: { isHalfPie, label, innerRadius },\n } = useContext(PieContext);\n\n const radius = Math.min(innerWidth, innerHeight) / 2;\n\n const currentInnerHeight = isHalfPie ? innerHeight : innerHeight / 2;\n return (\n <g transform={`translate(${innerWidth / 2},${currentInnerHeight})`}>\n {pieData.map((slice) => (\n <Slice key={slice.index} data={slice} />\n ))}\n {!isHalfPie && label ? (\n <StyledInnerText x={0} y={0} textAnchor=\"middle\" alignmentBaseline=\"middle\">\n {label}\n </StyledInnerText>\n ) : null}\n {isHalfPie && label ? (\n <StyledInnerText x={0} y={-innerRadius / 4} textAnchor=\"middle\" alignmentBaseline=\"middle\">\n {label}\n </StyledInnerText>\n ) : null}\n </g>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiBnB;AAjBJ,mBAAkC;AAClC,mBAAsB;AACtB,wBAA2B;AAC3B,oBAAgC;AACzB,MAAM,MAAM,MAAM;AACvB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IAEA,OAAO,EAAE,WAAW,OAAO,YAAY;AAAA,EACzC,QAAI,yBAAW,4BAAU;AAEzB,QAAM,SAAS,KAAK,IAAI,YAAY,WAAW,IAAI;AAEnD,QAAM,qBAAqB,YAAY,cAAc,cAAc;AACnE,SACE,6CAAC,OAAE,WAAW,aAAa,aAAa,KAAK,uBAC1C;AAAA,YAAQ,IAAI,CAAC,UACZ,4CAAC,sBAAwB,MAAM,SAAnB,MAAM,KAAoB,CACvC;AAAA,IACA,CAAC,aAAa,QACb,4CAAC,iCAAgB,GAAG,GAAG,GAAG,GAAG,YAAW,UAAS,mBAAkB,UAChE,iBACH,IACE;AAAA,IACH,aAAa,QACZ,4CAAC,iCAAgB,GAAG,GAAG,GAAG,CAAC,cAAc,GAAG,YAAW,UAAS,mBAAkB,UAC/E,iBACH,IACE;AAAA,KACN;AAEJ;",
6
6
  "names": []
package/dist/cjs/parts/Slice.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/parts/Slice.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/parts/Slice.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useState, useEffect, useCallback, useMemo, useRef, useContext } from 'react';\nimport { arc, select } from 'd3';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { PieContext } from '../PieContext.js';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { StyledTooltipContainer, StyledMouseOverDetectionBox } from '../styles.js';\nexport const Slice = ({ data }) => {\n const {\n innerHeight,\n innerWidth,\n activeSerie,\n setActiveSerie,\n props: { series, innerRadius, isHalfPie, TooltipRenderer },\n } = useContext(PieContext);\n\n const arcRef = useRef(null);\n\n const radius = isHalfPie ? Math.min(innerWidth, innerHeight) : Math.min(innerWidth, innerHeight) / 2;\n const { startAngle, endAngle, index } = data;\n const currentStartAngle = isHalfPie ? startAngle / 2 : startAngle;\n const currentEndAngle = isHalfPie ? endAngle / 2 : endAngle;\n\n const serieData = series?.find((serie) => serie.name === data.data[0]);\n const { color, name } = serieData || { name: undefined, color: 'grey' };\n\n const sliceData = useMemo(\n () =>\n arc()\n .innerRadius(innerRadius ? radius * innerRadius : 0)\n .outerRadius(radius)\n .startAngle(currentStartAngle)\n .endAngle(currentEndAngle)(),\n [currentEndAngle, currentStartAngle, innerRadius, radius],\n );\n\n const sliceOver = useMemo(\n () =>\n arc()\n .innerRadius(innerRadius ? radius * innerRadius : 0)\n .outerRadius(radius + radius * 0.1)\n .startAngle(currentStartAngle)\n .endAngle(currentEndAngle),\n [currentEndAngle, currentStartAngle, innerRadius, radius],\n );\n\n const deltaAngle = currentStartAngle + (currentEndAngle - currentStartAngle) / 2;\n const x = radius * Math.sin(deltaAngle);\n const y = -radius * Math.cos(deltaAngle);\n\n const isFocus = useMemo(() => activeSerie === `${name}-${index}`, [activeSerie, index, name]);\n useEffect(() => {\n if (arcRef.current) {\n if (isFocus) select(arcRef.current).transition().attr('d', sliceOver).duration(300);\n else select(arcRef.current).transition().attr('d', sliceData).duration(300);\n }\n }, [sliceData, isFocus, sliceOver]);\n\n const [referenceElement, setReferenceElement] = useState<HTMLSpanElement | null>();\n\n const handleMouseEnter = useCallback(() => {\n if (name) setActiveSerie(`${name}-${index}`);\n }, [index, name, setActiveSerie]);\n\n const handleOnMouseLeave = useCallback(() => {\n if (name) setActiveSerie('');\n }, [name, setActiveSerie]);\n return (\n <g onMouseEnter={handleMouseEnter} onMouseLeave={handleOnMouseLeave} transform={isHalfPie ? 'rotate(-90)' : ''}>\n <path ref={arcRef} fill={COLOR_PALLET[color] ?? color} stroke=\"white\"></path>\n\n {name && TooltipRenderer && isFocus && (\n <foreignObject x={x} y={y}>\n <div ref={setReferenceElement}>\n <DSPopperJS referenceElement={referenceElement} showPopover zIndex={3000}>\n <StyledTooltipContainer>\n <TooltipRenderer data={serieData} />\n </StyledTooltipContainer>\n <StyledMouseOverDetectionBox />\n </DSPopperJS>\n </div>\n </foreignObject>\n )}\n </g>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsEjB;AApEN,mBAAqF;AACrF,gBAA4B;AAC5B,yBAA2B;AAC3B,wBAA2B;AAC3B,yBAA6B;AAC7B,oBAAoE;AAC7D,MAAM,QAAQ,CAAC,EAAE,KAAK,MAAM;AACjC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,QAAQ,aAAa,WAAW,gBAAgB;AAAA,EAC3D,QAAI,yBAAW,4BAAU;AAEzB,QAAM,aAAS,qBAAO,IAAI;AAE1B,QAAM,SAAS,YAAY,KAAK,IAAI,YAAY,WAAW,IAAI,KAAK,IAAI,YAAY,WAAW,IAAI;AACnG,QAAM,EAAE,YAAY,UAAU,MAAM,IAAI;AACxC,QAAM,oBAAoB,YAAY,aAAa,IAAI;AACvD,QAAM,kBAAkB,YAAY,WAAW,IAAI;AAEnD,QAAM,YAAY,QAAQ,KAAK,CAAC,UAAU,MAAM,SAAS,KAAK,KAAK,CAAC,CAAC;AACrE,QAAM,EAAE,OAAO,KAAK,IAAI,aAAa,EAAE,MAAM,QAAW,OAAO,OAAO;AAEtE,QAAM,gBAAY;AAAA,IAChB,UACE,eAAI,EACD,YAAY,cAAc,SAAS,cAAc,CAAC,EAClD,YAAY,MAAM,EAClB,WAAW,iBAAiB,EAC5B,SAAS,eAAe,EAAE;AAAA,IAC/B,CAAC,iBAAiB,mBAAmB,aAAa,MAAM;AAAA,EAC1D;AAEA,QAAM,gBAAY;AAAA,IAChB,UACE,eAAI,EACD,YAAY,cAAc,SAAS,cAAc,CAAC,EAClD,YAAY,SAAS,SAAS,GAAG,EACjC,WAAW,iBAAiB,EAC5B,SAAS,eAAe;AAAA,IAC7B,CAAC,iBAAiB,mBAAmB,aAAa,MAAM;AAAA,EAC1D;AAEA,QAAM,aAAa,qBAAqB,kBAAkB,qBAAqB;AAC/E,QAAM,IAAI,SAAS,KAAK,IAAI,UAAU;AACtC,QAAM,IAAI,CAAC,SAAS,KAAK,IAAI,UAAU;AAEvC,QAAM,cAAU,sBAAQ,MAAM,gBAAgB,GAAG,QAAQ,SAAS,CAAC,aAAa,OAAO,IAAI,CAAC;AAC5F,8BAAU,MAAM;AACd,QAAI,OAAO,SAAS;AAClB,UAAI;AAAS,8BAAO,OAAO,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,SAAS,EAAE,SAAS,GAAG;AAAA;AAC7E,8BAAO,OAAO,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,SAAS,EAAE,SAAS,GAAG;AAAA,IAC5E;AAAA,EACF,GAAG,CAAC,WAAW,SAAS,SAAS,CAAC;AAElC,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAiC;AAEjF,QAAM,uBAAmB,0BAAY,MAAM;AACzC,QAAI;AAAM,qBAAe,GAAG,QAAQ,OAAO;AAAA,EAC7C,GAAG,CAAC,OAAO,MAAM,cAAc,CAAC;AAEhC,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,QAAI;AAAM,qBAAe,EAAE;AAAA,EAC7B,GAAG,CAAC,MAAM,cAAc,CAAC;AACzB,SACE,6CAAC,OAAE,cAAc,kBAAkB,cAAc,oBAAoB,WAAW,YAAY,gBAAgB,IAC1G;AAAA,gDAAC,UAAK,KAAK,QAAQ,MAAM,gCAAa,KAAK,KAAK,OAAO,QAAO,SAAQ;AAAA,IAErE,QAAQ,mBAAmB,WAC1B,4CAAC,mBAAc,GAAM,GACnB,sDAAC,SAAI,KAAK,qBACR,uDAAC,iCAAW,kBAAoC,aAAW,MAAC,QAAQ,KAClE;AAAA,kDAAC,wCACC,sDAAC,mBAAgB,MAAM,WAAW,GACpC;AAAA,MACA,4CAAC,6CAA4B;AAAA,OAC/B,GACF,GACF;AAAA,KAEJ;AAEJ;",
6
6
  "names": []
package/dist/cjs/react-desc-prop-types.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\ntype MarginT = {\n top: number;\n left: number;\n right: number;\n bottom: number;\n};\n\nexport declare namespace DSPieT {\n export interface SeriesT {\n name: string;\n data: number;\n color: string;\n }\n export interface Props {\n series: SeriesT[];\n height: number;\n width: number;\n margin: MarginT;\n }\n}\n\nexport const propTypes = {\n ...globalAttributesPropTypes,\n height: PropTypes.number.isRequired.description('height').defaultValue(''),\n width: PropTypes.number.isRequired.description('height').defaultValue(''),\n margin: PropTypes.shape({\n top: PropTypes.number,\n bottom: PropTypes.number,\n left: PropTypes.number,\n right: PropTypes.number,\n })\n .isRequired.description('margin')\n .defaultValue(''),\n series: PropTypes.arrayOf(PropTypes.object).description('yValue').defaultValue(''),\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAqD;AAuB9C,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,QAAQ,kCAAU,OAAO,WAAW,YAAY,QAAQ,EAAE,aAAa,EAAE;AAAA,EACzE,OAAO,kCAAU,OAAO,WAAW,YAAY,QAAQ,EAAE,aAAa,EAAE;AAAA,EACxE,QAAQ,kCAAU,MAAM;AAAA,IACtB,KAAK,kCAAU;AAAA,IACf,QAAQ,kCAAU;AAAA,IAClB,MAAM,kCAAU;AAAA,IAChB,OAAO,kCAAU;AAAA,EACnB,CAAC,EACE,WAAW,YAAY,QAAQ,EAC/B,aAAa,EAAE;AAAA,EAClB,QAAQ,kCAAU,QAAQ,kCAAU,MAAM,EAAE,YAAY,QAAQ,EAAE,aAAa,EAAE;AACnF;",
6
6
  "names": []
package/dist/cjs/styles.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/styles.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { styled, css } from '@elliemae/ds-system';\n\nexport const StyledSVGWrapper = styled.div`\n :focus {\n outline: none;\n }\n :focus-within {\n outline: none;\n }\n`;\n\nexport const StyledInnerText = styled.text`\n font-size: 18px;\n font-weight: 600;\n`;\n\nexport const StyledTooltipContainer = styled.div`\n max-width: 350px;\n background-color: white;\n pointer-events: none;\n`;\n\nexport const StyledMouseOverDetectionBox = styled.div`\n position: absolute;\n top: -15px;\n right: -15px;\n width: calc(100% + 30px);\n height: calc(100% + 30px);\n z-index: -1;\n pointer-events: none;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA4B;AAErB,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShC,MAAM,kBAAkB,wBAAO;AAAA;AAAA;AAAA;AAK/B,MAAM,yBAAyB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMtC,MAAM,8BAA8B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
6
  "names": []
package/dist/esm/Pie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Pie.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/Pie.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { ChartContainer } from './parts/ChartContainer.js';\nimport { Pie } from './parts/Pie.js';\nimport { PieContext } from './PieContext.js';\nimport { usePie } from './config/usePie.js';\nimport type { DSPieT } from './react-desc-prop-types.js';\nimport { ColorLegend } from './parts/ColorLegend.js';\nexport const PieChart: React.ComponentType<DSPieT.Props> = (props) => {\n const ctx = usePie(props);\n return (\n <PieContext.Provider value={ctx}>\n <ChartContainer>\n <ColorLegend />\n <Pie />\n </ChartContainer>\n </PieContext.Provider>\n );\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACWjB,SACE,KADF;AAVN,SAAS,sBAAsB;AAC/B,SAAS,WAAW;AACpB,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AAEvB,SAAS,mBAAmB;AACrB,MAAM,WAA8C,CAAC,UAAU;AACpE,QAAM,MAAM,OAAO,KAAK;AACxB,SACE,oBAAC,WAAW,UAAX,EAAoB,OAAO,KAC1B,+BAAC,kBACC;AAAA,wBAAC,eAAY;AAAA,IACb,oBAAC,OAAI;AAAA,KACP,GACF;AAEJ;",
6
6
  "names": []
package/dist/esm/PieContext.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/PieContext.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/PieContext.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext, createRef } from 'react';\nimport type { ScaleOrdinal } from 'd3';\nimport { scaleOrdinal } from 'd3';\nimport type { DSPieT } from './react-desc-prop-types.js';\n\ninterface PieChartContextT {\n props: Partial<DSPieT.Props>;\n innerHeight: number;\n innerWidth: number;\n activeSerie: string;\n setActiveSerie: React.Dispatch<React.SetStateAction<string>>;\n containerRef: React.RefObject<HTMLDivElement>;\n groups: string[];\n colorScale: ScaleOrdinal<string, unknown, never>;\n}\n\nconst pieChartdefaultContext: PieChartContextT = {\n // props: defaultProps,\n // innerHeight: 0,\n // innerWidth: 0,\n // activeSerie: '',\n // setActiveSerie: () => {},\n // containerRef: createRef<HTMLDivElement>(),\n // groups: [],\n // colorScale: scaleOrdinal(),\n};\n\nexport const PieContext = createContext(pieChartdefaultContext);\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,qBAAgC;AAgBzC,MAAM,yBAA2C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASjD;AAEO,MAAM,aAAa,cAAc,sBAAsB;",
6
6
  "names": []
package/dist/esm/config/useKeyboardNavigation.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useKeyboardNavigation.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useKeyboardNavigation.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext } from 'react';\nimport { PieContext } from '../PieContext.js';\n\nexport const findInCircularList = (\n list,\n from: number,\n //criteria: (item) => boolean,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const { activeSerie, setActiveSerie, containerRef, currentData } = useContext(PieContext);\n\n // const currentGroup = useMemo(() => data.find((d) => d.name === currentFocusedDataset), [currentFocusedDataset, data]);\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(() => {\n setActiveSerie(currentData[0].key);\n }, [currentData, setActiveSerie]);\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (\n !containerRef?.current?.contains(document.activeElement) ||\n containerRef?.current === document.activeElement\n ) {\n setActiveSerie('');\n }\n });\n }, [containerRef, setActiveSerie]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newFocusedSliceIndex = findInCircularList(\n currentData,\n currentData.findIndex((serie) => serie.key === activeSerie),\n step,\n );\n setActiveSerie(currentData[newFocusedSliceIndex].key);\n },\n [activeSerie, currentData, setActiveSerie],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n },\n [navigateSerie],\n );\n\n return { onInputKeyDown, handleOnBlur, handleOnFocus };\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,aAAa,kBAAkB;AACxC,SAAS,kBAAkB;AAEpB,MAAM,qBAAqB,CAChC,MACA,MAEA,OAAO,MAEI;AACX,WACM,KAAK,OAAO,OAAO,KAAK,UAAU,KAAK,QAC3C,MAAM,QAAQ,OAAO,IACrB,KAAK,IAAI,OAAO,KAAK,UAAU,KAAK,QACpC;AACA,QAAI,KAAK,CAAC;AAAG,aAAO;AAAA,EACtB;AACA,SAAO;AACT;AAEO,MAAM,wBAAwB,MAAM;AACzC,QAAM,EAAE,aAAa,gBAAgB,cAAc,YAAY,IAAI,WAAW,UAAU;AAIxF,QAAM,gBAAyD,YAAY,MAAM;AAC/E,mBAAe,YAAY,CAAC,EAAE,GAAG;AAAA,EACnC,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,QAAM,eAA0D,YAAY,MAAM;AAChF,eAAW,MAAM;AACf,UACE,CAAC,cAAc,SAAS,SAAS,SAAS,aAAa,KACvD,cAAc,YAAY,SAAS,eACnC;AACA,uBAAe,EAAE;AAAA,MACnB;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,cAAc,cAAc,CAAC;AAEjC,QAAM,gBAAgB;AAAA,IACpB,CAAC,SAAiB;AAChB,YAAM,uBAAuB;AAAA,QAC3B;AAAA,QACA,YAAY,UAAU,CAAC,UAAU,MAAM,QAAQ,WAAW;AAAA,QAC1D;AAAA,MACF;AACA,qBAAe,YAAY,oBAAoB,EAAE,GAAG;AAAA,IACtD;AAAA,IACA,CAAC,aAAa,aAAa,cAAc;AAAA,EAC3C;AAEA,QAAM,iBAA+D;AAAA,IACnE,CAAC,MAAM;AACL,UAAI,EAAE,SAAS,OAAO;AACpB,UAAE,eAAe;AAAA,MACnB;AACA,UAAI,CAAC,aAAa,YAAY,EAAE,SAAS,EAAE,IAAI,GAAG;AAChD,sBAAc,EAAE,SAAS,cAAc,KAAK,CAAC;AAAA,MAC/C;AAAA,IACF;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AAEA,SAAO,EAAE,gBAAgB,cAAc,cAAc;AACvD;",
6
6
  "names": []
package/dist/esm/config/usePie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/usePie.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/usePie.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useState, useRef } from 'react';\nimport { pie } from 'd3';\n//\nimport { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSPieT } from '../react-desc-prop-types.js';\n\nexport const usePie = (props: DSPieT.Props) => {\n // useValidateTypescriptPropTypes(props, propTypes);\n\n const { series, width, height, margin, isHalfPie, size } = props;\n\n const containerRef = useRef(null);\n const svgRef = useRef(null);\n\n const [activeSerie, setActiveSerie] = useState('');\n\n const prevInnerWidth = width - margin.left - margin.right;\n const prevInnerHeight = height - margin.top - margin.bottom;\n const prevRadius = isHalfPie\n ? Math.min(prevInnerWidth, prevInnerHeight)\n : Math.min(prevInnerWidth, prevInnerHeight) / 2;\n\n const innerHeight = useMemo(() => prevInnerHeight - prevRadius * 0.1 * 2, [prevInnerHeight, prevRadius]);\n const innerWidth = useMemo(() => prevInnerWidth - prevRadius * 0.1 * 2, [prevInnerWidth, prevRadius]);\n\n const radius = isHalfPie ? Math.min(innerHeight, innerWidth) : Math.min(innerHeight, innerWidth) / 2;\n\n const groups = series.map((serie) => serie.name);\n\n const currentData = useMemo(\n () =>\n series.map((serie, i) => ({\n ...serie,\n key: `${serie.name}-${i}`,\n })),\n [series],\n );\n let total = 0;\n const data = series.reduce((acc, curr) => {\n total += curr.data;\n return { ...acc, [curr.name]: curr.data };\n }, {});\n if (size) {\n data.rest = size - total;\n }\n const pieGenerator = pie()\n .value((d) => d[1])\n .sort(null)\n .padAngle(0.02);\n const pieData = pieGenerator(Object.entries(data));\n\n return useMemo(\n () => ({\n props,\n innerHeight,\n innerWidth,\n groups,\n svgRef,\n containerRef,\n activeSerie,\n pieData,\n setActiveSerie,\n currentData,\n prevRadius,\n radius,\n }),\n [props, radius, prevRadius, innerHeight, innerWidth, groups, activeSerie, pieData, currentData],\n );\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,SAAS,UAAU,cAAc;AAC1C,SAAS,WAAW;AAKb,MAAM,SAAS,CAAC,UAAwB;AAG7C,QAAM,EAAE,QAAQ,OAAO,QAAQ,QAAQ,WAAW,KAAK,IAAI;AAE3D,QAAM,eAAe,OAAO,IAAI;AAChC,QAAM,SAAS,OAAO,IAAI;AAE1B,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AAEjD,QAAM,iBAAiB,QAAQ,OAAO,OAAO,OAAO;AACpD,QAAM,kBAAkB,SAAS,OAAO,MAAM,OAAO;AACrD,QAAM,aAAa,YACf,KAAK,IAAI,gBAAgB,eAAe,IACxC,KAAK,IAAI,gBAAgB,eAAe,IAAI;AAEhD,QAAM,cAAc,QAAQ,MAAM,kBAAkB,aAAa,MAAM,GAAG,CAAC,iBAAiB,UAAU,CAAC;AACvG,QAAM,aAAa,QAAQ,MAAM,iBAAiB,aAAa,MAAM,GAAG,CAAC,gBAAgB,UAAU,CAAC;AAEpG,QAAM,SAAS,YAAY,KAAK,IAAI,aAAa,UAAU,IAAI,KAAK,IAAI,aAAa,UAAU,IAAI;AAEnG,QAAM,SAAS,OAAO,IAAI,CAAC,UAAU,MAAM,IAAI;AAE/C,QAAM,cAAc;AAAA,IAClB,MACE,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,MACxB,GAAG;AAAA,MACH,KAAK,GAAG,MAAM,QAAQ;AAAA,IACxB,EAAE;AAAA,IACJ,CAAC,MAAM;AAAA,EACT;AACA,MAAI,QAAQ;AACZ,QAAM,OAAO,OAAO,OAAO,CAAC,KAAK,SAAS;AACxC,aAAS,KAAK;AACd,WAAO,EAAE,GAAG,KAAK,CAAC,KAAK,IAAI,GAAG,KAAK,KAAK;AAAA,EAC1C,GAAG,CAAC,CAAC;AACL,MAAI,MAAM;AACR,SAAK,OAAO,OAAO;AAAA,EACrB;AACA,QAAM,eAAe,IAAI,EACtB,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,EACjB,KAAK,IAAI,EACT,SAAS,IAAI;AAChB,QAAM,UAAU,aAAa,OAAO,QAAQ,IAAI,CAAC;AAEjD,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,QAAQ,YAAY,aAAa,YAAY,QAAQ,aAAa,SAAS,WAAW;AAAA,EAChG;AACF;",
6
6
  "names": []
package/dist/esm/helpers/colorPallet.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/helpers/colorPallet.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/helpers/colorPallet.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const COLOR_PALLET = {\n 'blue-100': '#1E79C2',\n 'blue-200': '#165A91',\n 'blue-400': '#10426A',\n 'magenta-100': '#CA3981',\n 'magenta-200': '#832553',\n 'magenta-400': '#6E1F46',\n 'orange-100': '#B25119',\n 'orange-200': '#853C12',\n 'orange-400': '#612C0D',\n 'purple-100': '#8E49B2',\n 'purple-200': '#61327A',\n 'purple-400': '#4D2861',\n 'green-100': '#007A78',\n 'green-200': '#005B59',\n 'green-400': '#004241',\n 'grey-100': '#697489',\n 'grey-200': '#4E5666',\n 'grey-400': '#323842',\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,eAAe;AAAA,EAC1B,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,eAAe;AAAA,EACf,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AACd;",
6
6
  "names": []
package/dist/esm/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { PieChart } from './Pie.js';\nexport { COLOR_PALLET } from './helpers/colorPallet.js';\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;",
6
6
  "names": []
package/dist/esm/parts/ChartContainer.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/ChartContainer.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/ChartContainer.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo } from 'react';\nimport { StyledSVGWrapper } from '../styles.js';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation.js';\nimport { PieContext } from '../PieContext.js';\n// import { useKeyboardNavigation } from '../config/useKeyboardNavigation';\ninterface ChartContainerT {\n children: JSX.Element | JSX.Element[] | string | string[];\n}\nexport const ChartContainer: React.ComponentType<ChartContainerT> = ({ children }) => {\n const {\n props: { width, height, margin, responsive, hasBaseline, isHalfPie },\n containerRef,\n innerHeight,\n radius,\n activeSerie,\n } = useContext(PieContext);\n\n const dimensions = useMemo(\n () =>\n responsive\n ? {\n viewBox: `0 0 ${width} ${height}`,\n }\n : {\n width,\n height,\n },\n [height, responsive, width],\n );\n\n const marginRadius = useMemo(() => {\n if (isHalfPie) {\n return radius * 0.1;\n }\n return radius * 0.1;\n });\n const { onInputKeyDown, handleOnBlur, handleOnFocus } = useKeyboardNavigation();\n\n return (\n <StyledSVGWrapper\n ref={containerRef}\n onKeyDown={onInputKeyDown}\n // aria-hidden=\"true\"\n tabIndex={activeSerie ? -1 : 0}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onMouseDown={(e) => e.preventDefault()}\n style={{ width: `${width}px`, height: `${height}px` }}\n >\n <svg {...dimensions}>\n <g className=\"container\" transform={`translate(${margin.left + marginRadius},${margin.top + marginRadius})`}>\n {children}\n </g>\n {hasBaseline ? (\n <line\n x1={0}\n x2={width}\n y1={innerHeight + marginRadius}\n y2={innerHeight + marginRadius}\n stroke=\"grey\"\n strokeWidth=\"2\"\n />\n ) : null}\n </svg>\n </StyledSVGWrapper>\n );\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACiDjB,SACE,KADF;AAjDN,SAAgB,YAAY,eAAe;AAC3C,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AACtC,SAAS,kBAAkB;AAKpB,MAAM,iBAAuD,CAAC,EAAE,SAAS,MAAM;AACpF,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,QAAQ,QAAQ,YAAY,aAAa,UAAU;AAAA,IACnE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,UAAU;AAEzB,QAAM,aAAa;AAAA,IACjB,MACE,aACI;AAAA,MACE,SAAS,OAAO,SAAS;AAAA,IAC3B,IACA;AAAA,MACE;AAAA,MACA;AAAA,IACF;AAAA,IACN,CAAC,QAAQ,YAAY,KAAK;AAAA,EAC5B;AAEA,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,WAAW;AACb,aAAO,SAAS;AAAA,IAClB;AACA,WAAO,SAAS;AAAA,EAClB,CAAC;AACD,QAAM,EAAE,gBAAgB,cAAc,cAAc,IAAI,sBAAsB;AAE9E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW;AAAA,MAEX,UAAU,cAAc,KAAK;AAAA,MAC7B,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,aAAa,CAAC,MAAM,EAAE,eAAe;AAAA,MACrC,OAAO,EAAE,OAAO,GAAG,WAAW,QAAQ,GAAG,WAAW;AAAA,MAEpD,+BAAC,SAAK,GAAG,YACP;AAAA,4BAAC,OAAE,WAAU,aAAY,WAAW,aAAa,OAAO,OAAO,gBAAgB,OAAO,MAAM,iBACzF,UACH;AAAA,QACC,cACC;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,IAAI;AAAA,YACJ,IAAI,cAAc;AAAA,YAClB,IAAI,cAAc;AAAA,YAClB,QAAO;AAAA,YACP,aAAY;AAAA;AAAA,QACd,IACE;AAAA,SACN;AAAA;AAAA,EACF;AAEJ;",
6
6
  "names": []
package/dist/esm/parts/ColorLegend.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/ColorLegend.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/ColorLegend.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { PieContext } from '../PieContext.js';\n\nexport const ColorLegend = ({ tickSpacing = 20, tickSize = 10, tickTextOffset = 20 }) => {\n const {\n colorScale,\n innerWidth,\n props: { colorLegend, circleRadius },\n } = useContext(PieContext);\n\n if (!colorLegend) return null;\n return (\n <g transform={`translate(${innerWidth + 30},30)`}>\n <text x={35} y={-25} className=\"axis-label\" textAnchor=\"middle\">\n {colorLegend.label}\n </text>\n {colorScale.domain().map((domainValue, i) => (\n <g className=\"tick\" transform={`translate(0,${i * tickSpacing})`}>\n <circle fill={colorScale(domainValue)} r={circleRadius ?? tickSize} />\n <text x={tickTextOffset} dy=\".32em\">\n {domainValue}\n </text>\n </g>\n ))}\n </g>\n );\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACajB,cAIE,YAJF;AAbN,SAAgB,kBAAkB;AAClC,SAAS,kBAAkB;AAEpB,MAAM,cAAc,CAAC,EAAE,cAAc,IAAI,WAAW,IAAI,iBAAiB,GAAG,MAAM;AACvF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,aAAa,aAAa;AAAA,EACrC,IAAI,WAAW,UAAU;AAEzB,MAAI,CAAC;AAAa,WAAO;AACzB,SACE,qBAAC,OAAE,WAAW,aAAa,aAAa,UACtC;AAAA,wBAAC,UAAK,GAAG,IAAI,GAAG,KAAK,WAAU,cAAa,YAAW,UACpD,sBAAY,OACf;AAAA,IACC,WAAW,OAAO,EAAE,IAAI,CAAC,aAAa,MACrC,qBAAC,OAAE,WAAU,QAAO,WAAW,eAAe,IAAI,gBAChD;AAAA,0BAAC,YAAO,MAAM,WAAW,WAAW,GAAG,GAAG,gBAAgB,UAAU;AAAA,MACpE,oBAAC,UAAK,GAAG,gBAAgB,IAAG,SACzB,uBACH;AAAA,OACF,CACD;AAAA,KACH;AAEJ;",
6
6
  "names": []
package/dist/esm/parts/Pie.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Pie.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Pie.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { Slice } from './Slice.js';\nimport { PieContext } from '../PieContext.js';\nimport { StyledInnerText } from '../styles.js';\nexport const Pie = () => {\n const {\n innerHeight,\n innerWidth,\n pieData,\n\n props: { isHalfPie, label, innerRadius },\n } = useContext(PieContext);\n\n const radius = Math.min(innerWidth, innerHeight) / 2;\n\n const currentInnerHeight = isHalfPie ? innerHeight : innerHeight / 2;\n return (\n <g transform={`translate(${innerWidth / 2},${currentInnerHeight})`}>\n {pieData.map((slice) => (\n <Slice key={slice.index} data={slice} />\n ))}\n {!isHalfPie && label ? (\n <StyledInnerText x={0} y={0} textAnchor=\"middle\" alignmentBaseline=\"middle\">\n {label}\n </StyledInnerText>\n ) : null}\n {isHalfPie && label ? (\n <StyledInnerText x={0} y={-innerRadius / 4} textAnchor=\"middle\" alignmentBaseline=\"middle\">\n {label}\n </StyledInnerText>\n ) : null}\n </g>\n );\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACiBnB,SAEI,KAFJ;AAjBJ,SAAgB,kBAAkB;AAClC,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AACzB,MAAM,MAAM,MAAM;AACvB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IAEA,OAAO,EAAE,WAAW,OAAO,YAAY;AAAA,EACzC,IAAI,WAAW,UAAU;AAEzB,QAAM,SAAS,KAAK,IAAI,YAAY,WAAW,IAAI;AAEnD,QAAM,qBAAqB,YAAY,cAAc,cAAc;AACnE,SACE,qBAAC,OAAE,WAAW,aAAa,aAAa,KAAK,uBAC1C;AAAA,YAAQ,IAAI,CAAC,UACZ,oBAAC,SAAwB,MAAM,SAAnB,MAAM,KAAoB,CACvC;AAAA,IACA,CAAC,aAAa,QACb,oBAAC,mBAAgB,GAAG,GAAG,GAAG,GAAG,YAAW,UAAS,mBAAkB,UAChE,iBACH,IACE;AAAA,IACH,aAAa,QACZ,oBAAC,mBAAgB,GAAG,GAAG,GAAG,CAAC,cAAc,GAAG,YAAW,UAAS,mBAAkB,UAC/E,iBACH,IACE;AAAA,KACN;AAEJ;",
6
6
  "names": []
package/dist/esm/parts/Slice.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Slice.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Slice.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useState, useEffect, useCallback, useMemo, useRef, useContext } from 'react';\nimport { arc, select } from 'd3';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { PieContext } from '../PieContext.js';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { StyledTooltipContainer, StyledMouseOverDetectionBox } from '../styles.js';\nexport const Slice = ({ data }) => {\n const {\n innerHeight,\n innerWidth,\n activeSerie,\n setActiveSerie,\n props: { series, innerRadius, isHalfPie, TooltipRenderer },\n } = useContext(PieContext);\n\n const arcRef = useRef(null);\n\n const radius = isHalfPie ? Math.min(innerWidth, innerHeight) : Math.min(innerWidth, innerHeight) / 2;\n const { startAngle, endAngle, index } = data;\n const currentStartAngle = isHalfPie ? startAngle / 2 : startAngle;\n const currentEndAngle = isHalfPie ? endAngle / 2 : endAngle;\n\n const serieData = series?.find((serie) => serie.name === data.data[0]);\n const { color, name } = serieData || { name: undefined, color: 'grey' };\n\n const sliceData = useMemo(\n () =>\n arc()\n .innerRadius(innerRadius ? radius * innerRadius : 0)\n .outerRadius(radius)\n .startAngle(currentStartAngle)\n .endAngle(currentEndAngle)(),\n [currentEndAngle, currentStartAngle, innerRadius, radius],\n );\n\n const sliceOver = useMemo(\n () =>\n arc()\n .innerRadius(innerRadius ? radius * innerRadius : 0)\n .outerRadius(radius + radius * 0.1)\n .startAngle(currentStartAngle)\n .endAngle(currentEndAngle),\n [currentEndAngle, currentStartAngle, innerRadius, radius],\n );\n\n const deltaAngle = currentStartAngle + (currentEndAngle - currentStartAngle) / 2;\n const x = radius * Math.sin(deltaAngle);\n const y = -radius * Math.cos(deltaAngle);\n\n const isFocus = useMemo(() => activeSerie === `${name}-${index}`, [activeSerie, index, name]);\n useEffect(() => {\n if (arcRef.current) {\n if (isFocus) select(arcRef.current).transition().attr('d', sliceOver).duration(300);\n else select(arcRef.current).transition().attr('d', sliceData).duration(300);\n }\n }, [sliceData, isFocus, sliceOver]);\n\n const [referenceElement, setReferenceElement] = useState<HTMLSpanElement | null>();\n\n const handleMouseEnter = useCallback(() => {\n if (name) setActiveSerie(`${name}-${index}`);\n }, [index, name, setActiveSerie]);\n\n const handleOnMouseLeave = useCallback(() => {\n if (name) setActiveSerie('');\n }, [name, setActiveSerie]);\n return (\n <g onMouseEnter={handleMouseEnter} onMouseLeave={handleOnMouseLeave} transform={isHalfPie ? 'rotate(-90)' : ''}>\n <path ref={arcRef} fill={COLOR_PALLET[color] ?? color} stroke=\"white\"></path>\n\n {name && TooltipRenderer && isFocus && (\n <foreignObject x={x} y={y}>\n <div ref={setReferenceElement}>\n <DSPopperJS referenceElement={referenceElement} showPopover zIndex={3000}>\n <StyledTooltipContainer>\n <TooltipRenderer data={serieData} />\n </StyledTooltipContainer>\n <StyledMouseOverDetectionBox />\n </DSPopperJS>\n </div>\n </foreignObject>\n )}\n </g>\n );\n};\n"],
5
5
  "mappings": "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",
6
6
  "names": []
package/dist/esm/react-desc-prop-types.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { globalAttributesPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\n\ntype MarginT = {\n top: number;\n left: number;\n right: number;\n bottom: number;\n};\n\nexport declare namespace DSPieT {\n export interface SeriesT {\n name: string;\n data: number;\n color: string;\n }\n export interface Props {\n series: SeriesT[];\n height: number;\n width: number;\n margin: MarginT;\n }\n}\n\nexport const propTypes = {\n ...globalAttributesPropTypes,\n height: PropTypes.number.isRequired.description('height').defaultValue(''),\n width: PropTypes.number.isRequired.description('height').defaultValue(''),\n margin: PropTypes.shape({\n top: PropTypes.number,\n bottom: PropTypes.number,\n left: PropTypes.number,\n right: PropTypes.number,\n })\n .isRequired.description('margin')\n .defaultValue(''),\n series: PropTypes.arrayOf(PropTypes.object).description('yValue').defaultValue(''),\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,2BAA2B,iBAAiB;AAuB9C,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,QAAQ,UAAU,OAAO,WAAW,YAAY,QAAQ,EAAE,aAAa,EAAE;AAAA,EACzE,OAAO,UAAU,OAAO,WAAW,YAAY,QAAQ,EAAE,aAAa,EAAE;AAAA,EACxE,QAAQ,UAAU,MAAM;AAAA,IACtB,KAAK,UAAU;AAAA,IACf,QAAQ,UAAU;AAAA,IAClB,MAAM,UAAU;AAAA,IAChB,OAAO,UAAU;AAAA,EACnB,CAAC,EACE,WAAW,YAAY,QAAQ,EAC/B,aAAa,EAAE;AAAA,EAClB,QAAQ,UAAU,QAAQ,UAAU,MAAM,EAAE,YAAY,QAAQ,EAAE,aAAa,EAAE;AACnF;",
6
6
  "names": []
package/dist/esm/styles.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styles.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styles.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css } from '@elliemae/ds-system';\n\nexport const StyledSVGWrapper = styled.div`\n :focus {\n outline: none;\n }\n :focus-within {\n outline: none;\n }\n`;\n\nexport const StyledInnerText = styled.text`\n font-size: 18px;\n font-weight: 600;\n`;\n\nexport const StyledTooltipContainer = styled.div`\n max-width: 350px;\n background-color: white;\n pointer-events: none;\n`;\n\nexport const StyledMouseOverDetectionBox = styled.div`\n position: absolute;\n top: -15px;\n right: -15px;\n width: calc(100% + 30px);\n height: calc(100% + 30px);\n z-index: -1;\n pointer-events: none;\n`;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAmB;AAErB,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShC,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA;AAK/B,MAAM,yBAAyB,OAAO;AAAA;AAAA;AAAA;AAAA;AAMtC,MAAM,8BAA8B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
6
  "names": []
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-dataviz-pie",
3
- "version": "3.22.0-next.7",
3
+ "version": "3.22.0-rc.0",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - DataViz",
6
6
  "files": [
@@ -37,16 +37,16 @@
37
37
  "dependencies": {
38
38
  "d3": "~7.8.2",
39
39
  "d3-shape": "^3.2.0",
40
- "@elliemae/ds-popperjs": "3.22.0-next.7",
41
- "@elliemae/ds-props-helpers": "3.22.0-next.7",
42
- "@elliemae/ds-system": "3.22.0-next.7"
40
+ "@elliemae/ds-popperjs": "3.22.0-rc.0",
41
+ "@elliemae/ds-props-helpers": "3.22.0-rc.0",
42
+ "@elliemae/ds-system": "3.22.0-rc.0"
43
43
  },
44
44
  "devDependencies": {
45
- "@elliemae/pui-cli": "~9.0.0-next.17",
45
+ "@elliemae/pui-cli": "~9.0.0-next.22",
46
46
  "@elliemae/pui-theme": "~2.7.0",
47
47
  "@types/d3": "~7.4.0",
48
48
  "styled-components": "~5.3.9",
49
- "@elliemae/ds-monorepo-devops": "3.22.0-next.7"
49
+ "@elliemae/ds-monorepo-devops": "3.22.0-rc.0"
50
50
  },
51
51
  "peerDependencies": {
52
52
  "@elliemae/pui-theme": "~2.7.0",
@@ -59,14 +59,14 @@
59
59
  "typeSafety": false
60
60
  },
61
61
  "scripts": {
62
- "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
62
+ "dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
63
63
  "test": "pui-cli test --passWithNoTests",
64
- "lint": "node ../../scripts/lint.mjs",
65
- "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../.eslintrc.js' src/",
66
- "dts": "node ../../scripts/dts.mjs",
67
- "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
64
+ "lint": "node ../../../scripts/lint.mjs",
65
+ "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../../.eslintrc.js' src/",
66
+ "dts": "node ../../../scripts/dts.mjs",
67
+ "build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
68
68
  "dev:build": "pnpm --filter {.}... build",
69
69
  "dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
70
- "checkDeps": "npm exec ../ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
70
+ "checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
71
71
  }
72
72
  }