@magmamath/students-features 1.2.1-rc.2 → 1.2.1-rc.20

package/dist/module/features/pmProgress/components/chart/components/SlicesClipPaths.js

@@ -0,0 +1,20 @@
+"use strict";
+
+import React from 'react';
+import { ClipPath, Defs, Path } from 'react-native-svg';
+import { getSliceClipId } from "../chart.helpers.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SlicesClipPaths = ({
+  slices,
+  pieChartManager
+}) => {
+  return /*#__PURE__*/_jsx(Defs, {
+    children: slices.map(slice => /*#__PURE__*/_jsx(ClipPath, {
+      id: getSliceClipId(slice.index),
+      children: /*#__PURE__*/_jsx(Path, {
+        d: pieChartManager.shape.generateSlicePath(slice)
+      })
+    }, slice.index))
+  });
+};
+//# sourceMappingURL=SlicesClipPaths.js.map

package/dist/module/features/pmProgress/components/chart/components/SlicesClipPaths.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ClipPath","Defs","Path","getSliceClipId","jsx","_jsx","SlicesClipPaths","slices","pieChartManager","children","map","slice","id","index","d","shape","generateSlicePath"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/components/SlicesClipPaths.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,IAAI,EAAEC,IAAI,QAAQ,kBAAkB;AACvD,SAASC,cAAc,QAAQ,qBAAkB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AASjD,OAAO,MAAMC,eAAe,GAAGA,CAAC;EAAEC,MAAM;EAAEC;AAAsC,CAAC,KAAK;EACpF,oBACEH,IAAA,CAACJ,IAAI;IAAAQ,QAAA,EACFF,MAAM,CAACG,GAAG,CAAEC,KAAK,iBAChBN,IAAA,CAACL,QAAQ;MAAmBY,EAAE,EAAET,cAAc,CAACQ,KAAK,CAACE,KAAK,CAAE;MAAAJ,QAAA,eAC1DJ,IAAA,CAACH,IAAI;QAACY,CAAC,EAAEN,eAAe,CAACO,KAAK,CAACC,iBAAiB,CAACL,KAAK;MAAE,CAAE;IAAC,GAD9CA,KAAK,CAACE,KAEX,CACX;EAAC,CACE,CAAC;AAEX,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/components/SlicesPaths.js

@@ -0,0 +1,71 @@
+"use strict";
+
+import React from 'react';
+import { Platform, StyleSheet } from 'react-native';
+import { G } from 'react-native-svg';
+import { useUnit } from 'effector-react';
+import { SliceBackgroundColor } from "./layers/SliceBackgroundColor.js";
+import { SliceFillColor } from "./layers/SliceFillColor.js";
+import { SliceArcPattern } from "./layers/SliceArcPattern.js";
+import { usePmProgress } from "../../../context/PmProgressContext.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export const SlicesPaths = ({
+  slices,
+  pieChartManager,
+  config
+}) => {
+  const {
+    model
+  } = usePmProgress();
+  const [hoveredId, expandedId, domains] = useUnit([model.highlight.$hoveredId, model.highlight.$expandedId, model.tree.$domains]);
+  const highlightedId = hoveredId ?? expandedId;
+  const highlightedIndex = highlightedId ? domains.findIndex(({
+    domainId
+  }) => domainId === highlightedId) : null;
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: slices.map(slice => {
+      const id = `${slice.index}`;
+      const shapeSvg = pieChartManager.shape.generateSlicePath(slice);
+      const fillSvg = pieChartManager.shape.generateFillPath(slice);
+      const fillBorderSvg = pieChartManager.shape.generateFillBorderPath(slice);
+      const isHighlighted = highlightedIndex === slice.index;
+      const translateY = pieChartManager.highlight.getTranslateY(isHighlighted);
+      const borderWidth = isHighlighted ? config.borderWidth : 0;
+      const domainId = domains[slice.index]?.domainId;
+      return /*#__PURE__*/_jsxs(G, {
+        style: styles.container,
+        transform: `translate(0, ${translateY})`,
+        onPress: () => domainId && model.highlight.expand(domainId),
+        onMouseEnter: () => domainId && model.highlight.hover(domainId),
+        onMouseLeave: () => model.highlight.hover(null),
+        children: [/*#__PURE__*/_jsx(SliceBackgroundColor, {
+          path: shapeSvg,
+          color: isHighlighted ? config.colors.highlightedBackground : slice.backgroundColor
+        }), /*#__PURE__*/_jsx(SliceFillColor, {
+          clipPathId: id,
+          shapeSvg: shapeSvg,
+          fillSvg: fillSvg,
+          fillBorderSvg: fillBorderSvg,
+          color: slice.fillColor,
+          percent: slice.fillPercent,
+          borderColor: isHighlighted ? slice.borderColor : undefined,
+          borderWidth: borderWidth || undefined
+        }), /*#__PURE__*/_jsx(SliceArcPattern, {
+          clipPathId: id,
+          slice: slice,
+          config: config,
+          pieChartManager: pieChartManager
+        })]
+      }, id);
+    })
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    cursor: 'pointer',
+    ...(Platform.OS === 'web' ? {
+      transition: 'transform 0.1s ease-in-out'
+    } : {})
+  }
+});
+//# sourceMappingURL=SlicesPaths.js.map

package/dist/module/features/pmProgress/components/chart/components/SlicesPaths.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Platform","StyleSheet","G","useUnit","SliceBackgroundColor","SliceFillColor","SliceArcPattern","usePmProgress","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SlicesPaths","slices","pieChartManager","config","model","hoveredId","expandedId","domains","highlight","$hoveredId","$expandedId","tree","$domains","highlightedId","highlightedIndex","findIndex","domainId","children","map","slice","id","index","shapeSvg","shape","generateSlicePath","fillSvg","generateFillPath","fillBorderSvg","generateFillBorderPath","isHighlighted","translateY","getTranslateY","borderWidth","style","styles","container","transform","onPress","expand","onMouseEnter","hover","onMouseLeave","path","color","colors","highlightedBackground","backgroundColor","clipPathId","fillColor","percent","fillPercent","borderColor","undefined","create","cursor","OS","transition"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/components/SlicesPaths.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/components/layers/SliceArcPattern.js

@@ -0,0 +1,32 @@
+"use strict";
+
+import React from 'react';
+import { G, Path } from 'react-native-svg';
+import { getSliceClipId } from "../../chart.helpers.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SliceArcPattern = ({
+  clipPathId,
+  slice,
+  pieChartManager,
+  config
+}) => {
+  const patternSizes = pieChartManager.pattern.getPatternTrackSizes();
+  return /*#__PURE__*/_jsx(G, {
+    clipPath: `url(#${getSliceClipId(clipPathId)})`,
+    children: patternSizes.map((radius, rowIndex) => {
+      const arcPath = pieChartManager.pattern.generateArcPath(slice, radius);
+      const dashWidth = pieChartManager.pattern.getDashWidthForRadius(radius);
+      const dashOffset = pieChartManager.pattern.getDashOffset(rowIndex, radius);
+      return /*#__PURE__*/_jsx(Path, {
+        d: arcPath,
+        fill: "none",
+        stroke: config.outerArc.color,
+        strokeWidth: config.outerArc.strokeWidth,
+        strokeDasharray: [dashWidth, dashWidth],
+        strokeDashoffset: dashOffset,
+        strokeLinecap: "butt"
+      }, rowIndex);
+    })
+  });
+};
+//# sourceMappingURL=SliceArcPattern.js.map

package/dist/module/features/pmProgress/components/chart/components/layers/SliceArcPattern.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","G","Path","getSliceClipId","jsx","_jsx","SliceArcPattern","clipPathId","slice","pieChartManager","config","patternSizes","pattern","getPatternTrackSizes","clipPath","children","map","radius","rowIndex","arcPath","generateArcPath","dashWidth","getDashWidthForRadius","dashOffset","getDashOffset","d","fill","stroke","outerArc","color","strokeWidth","strokeDasharray","strokeDashoffset","strokeLinecap"],"sourceRoot":"../../../../../../../../src","sources":["features/pmProgress/components/chart/components/layers/SliceArcPattern.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,CAAC,EAAEC,IAAI,QAAQ,kBAAkB;AAC1C,SAASC,cAAc,QAAQ,wBAAqB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAWpD,OAAO,MAAMC,eAAe,GAAGA,CAAC;EAC9BC,UAAU;EACVC,KAAK;EACLC,eAAe;EACfC;AACoB,CAAC,KAAK;EAC1B,MAAMC,YAAY,GAAGF,eAAe,CAACG,OAAO,CAACC,oBAAoB,CAAC,CAAC;EAEnE,oBACER,IAAA,CAACJ,CAAC;IAACa,QAAQ,EAAE,QAAQX,cAAc,CAACI,UAAU,CAAC,GAAI;IAAAQ,QAAA,EAChDJ,YAAY,CAACK,GAAG,CAAC,CAACC,MAAM,EAAEC,QAAQ,KAAK;MACtC,MAAMC,OAAO,GAAGV,eAAe,CAACG,OAAO,CAACQ,eAAe,CAACZ,KAAK,EAAES,MAAM,CAAC;MACtE,MAAMI,SAAS,GAAGZ,eAAe,CAACG,OAAO,CAACU,qBAAqB,CAACL,MAAM,CAAC;MACvE,MAAMM,UAAU,GAAGd,eAAe,CAACG,OAAO,CAACY,aAAa,CAACN,QAAQ,EAAED,MAAM,CAAC;MAE1E,oBACEZ,IAAA,CAACH,IAAI;QAEHuB,CAAC,EAAEN,OAAQ;QACXO,IAAI,EAAC,MAAM;QACXC,MAAM,EAAEjB,MAAM,CAACkB,QAAQ,CAACC,KAAM;QAC9BC,WAAW,EAAEpB,MAAM,CAACkB,QAAQ,CAACE,WAAY;QACzCC,eAAe,EAAE,CAACV,SAAS,EAAEA,SAAS,CAAE;QACxCW,gBAAgB,EAAET,UAAW;QAC7BU,aAAa,EAAC;MAAM,GAPff,QAQN,CAAC;IAEN,CAAC;EAAC,CACD,CAAC;AAER,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/components/layers/SliceBackgroundColor.js

@@ -0,0 +1,15 @@
+"use strict";
+
+import React from 'react';
+import { Path } from 'react-native-svg';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SliceBackgroundColor = ({
+  path,
+  color
+}) => {
+  return /*#__PURE__*/_jsx(Path, {
+    d: path,
+    fill: color
+  });
+};
+//# sourceMappingURL=SliceBackgroundColor.js.map

package/dist/module/features/pmProgress/components/chart/components/layers/SliceBackgroundColor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Path","jsx","_jsx","SliceBackgroundColor","path","color","d","fill"],"sourceRoot":"../../../../../../../../src","sources":["features/pmProgress/components/chart/components/layers/SliceBackgroundColor.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,kBAAkB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAOvC,OAAO,MAAMC,oBAAoB,GAAGA,CAAC;EAAEC,IAAI;EAAEC;AAA4B,CAAC,KAAK;EAC7E,oBAAOH,IAAA,CAACF,IAAI;IAACM,CAAC,EAAEF,IAAK;IAACG,IAAI,EAAEF;EAAM,CAAE,CAAC;AACvC,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/components/layers/SliceFillColor.js

@@ -0,0 +1,76 @@
+"use strict";
+
+import React from 'react';
+import { ClipPath, Defs, G, Path } from 'react-native-svg';
+import { getSliceClipId } from "../../chart.helpers.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export const SliceFillColor = ({
+  clipPathId,
+  shapeSvg,
+  fillSvg,
+  fillBorderSvg,
+  color,
+  percent,
+  borderColor,
+  borderWidth
+}) => {
+  const isFullyFilled = percent >= 100;
+  const isPartiallyFilled = percent > 0;
+  const hasBorder = borderColor != null && borderWidth != null && borderWidth > 0;
+  const sliceClipId = getSliceClipId(clipPathId);
+  const borderClipId = `${sliceClipId}-border`;
+  if (isFullyFilled) {
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [hasBorder && /*#__PURE__*/_jsx(Defs, {
+        children: /*#__PURE__*/_jsx(ClipPath, {
+          id: borderClipId,
+          children: /*#__PURE__*/_jsx(Path, {
+            d: fillBorderSvg
+          })
+        })
+      }), /*#__PURE__*/_jsxs(G, {
+        clipPath: `url(#${sliceClipId})`,
+        children: [/*#__PURE__*/_jsx(Path, {
+          d: shapeSvg,
+          fill: color
+        }), hasBorder && /*#__PURE__*/_jsx(G, {
+          clipPath: `url(#${borderClipId})`,
+          children: /*#__PURE__*/_jsx(Path, {
+            d: fillBorderSvg,
+            fill: "none",
+            stroke: borderColor,
+            strokeWidth: borderWidth * 2
+          })
+        })]
+      })]
+    });
+  }
+  if (isPartiallyFilled) {
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [hasBorder && /*#__PURE__*/_jsx(Defs, {
+        children: /*#__PURE__*/_jsx(ClipPath, {
+          id: borderClipId,
+          children: /*#__PURE__*/_jsx(Path, {
+            d: fillBorderSvg
+          })
+        })
+      }), /*#__PURE__*/_jsxs(G, {
+        clipPath: `url(#${sliceClipId})`,
+        children: [/*#__PURE__*/_jsx(Path, {
+          d: fillSvg,
+          fill: color
+        }), hasBorder && /*#__PURE__*/_jsx(G, {
+          clipPath: `url(#${borderClipId})`,
+          children: /*#__PURE__*/_jsx(Path, {
+            d: fillBorderSvg,
+            fill: "none",
+            stroke: borderColor,
+            strokeWidth: borderWidth * 2
+          })
+        })]
+      })]
+    });
+  }
+  return null;
+};
+//# sourceMappingURL=SliceFillColor.js.map

package/dist/module/features/pmProgress/components/chart/components/layers/SliceFillColor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ClipPath","Defs","G","Path","getSliceClipId","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SliceFillColor","clipPathId","shapeSvg","fillSvg","fillBorderSvg","color","percent","borderColor","borderWidth","isFullyFilled","isPartiallyFilled","hasBorder","sliceClipId","borderClipId","children","id","d","clipPath","fill","stroke","strokeWidth"],"sourceRoot":"../../../../../../../../src","sources":["features/pmProgress/components/chart/components/layers/SliceFillColor.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,IAAI,EAAEC,CAAC,EAAEC,IAAI,QAAQ,kBAAkB;AAC1D,SAASC,cAAc,QAAQ,wBAAqB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AAapD,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,UAAU;EACVC,QAAQ;EACRC,OAAO;EACPC,aAAa;EACbC,KAAK;EACLC,OAAO;EACPC,WAAW;EACXC;AACmB,CAAC,KAAK;EACzB,MAAMC,aAAa,GAAGH,OAAO,IAAI,GAAG;EACpC,MAAMI,iBAAiB,GAAGJ,OAAO,GAAG,CAAC;EACrC,MAAMK,SAAS,GAAGJ,WAAW,IAAI,IAAI,IAAIC,WAAW,IAAI,IAAI,IAAIA,WAAW,GAAG,CAAC;EAE/E,MAAMI,WAAW,GAAGnB,cAAc,CAACQ,UAAU,CAAC;EAC9C,MAAMY,YAAY,GAAG,GAAGD,WAAW,SAAS;EAE5C,IAAIH,aAAa,EAAE;IACjB,oBACEZ,KAAA,CAAAE,SAAA;MAAAe,QAAA,GACGH,SAAS,iBACRhB,IAAA,CAACL,IAAI;QAAAwB,QAAA,eACHnB,IAAA,CAACN,QAAQ;UAAC0B,EAAE,EAAEF,YAAa;UAAAC,QAAA,eACzBnB,IAAA,CAACH,IAAI;YAACwB,CAAC,EAAEZ;UAAc,CAAE;QAAC,CAClB;MAAC,CACP,CACP,eACDP,KAAA,CAACN,CAAC;QAAC0B,QAAQ,EAAE,QAAQL,WAAW,GAAI;QAAAE,QAAA,gBAClCnB,IAAA,CAACH,IAAI;UAACwB,CAAC,EAAEd,QAAS;UAACgB,IAAI,EAAEb;QAAM,CAAE,CAAC,EACjCM,SAAS,iBACRhB,IAAA,CAACJ,CAAC;UAAC0B,QAAQ,EAAE,QAAQJ,YAAY,GAAI;UAAAC,QAAA,eACnCnB,IAAA,CAACH,IAAI;YACHwB,CAAC,EAAEZ,aAAc;YACjBc,IAAI,EAAC,MAAM;YACXC,MAAM,EAAEZ,WAAY;YACpBa,WAAW,EAAEZ,WAAW,GAAI;UAAE,CAC/B;QAAC,CACD,CACJ;MAAA,CACA,CAAC;IAAA,CACJ,CAAC;EAEP;EAEA,IAAIE,iBAAiB,EAAE;IACrB,oBACEb,KAAA,CAAAE,SAAA;MAAAe,QAAA,GACGH,SAAS,iBACRhB,IAAA,CAACL,IAAI;QAAAwB,QAAA,eACHnB,IAAA,CAACN,QAAQ;UAAC0B,EAAE,EAAEF,YAAa;UAAAC,QAAA,eACzBnB,IAAA,CAACH,IAAI;YAACwB,CAAC,EAAEZ;UAAc,CAAE;QAAC,CAClB;MAAC,CACP,CACP,eACDP,KAAA,CAACN,CAAC;QAAC0B,QAAQ,EAAE,QAAQL,WAAW,GAAI;QAAAE,QAAA,gBAClCnB,IAAA,CAACH,IAAI;UAACwB,CAAC,EAAEb,OAAQ;UAACe,IAAI,EAAEb;QAAM,CAAE,CAAC,EAChCM,SAAS,iBACRhB,IAAA,CAACJ,CAAC;UAAC0B,QAAQ,EAAE,QAAQJ,YAAY,GAAI;UAAAC,QAAA,eACnCnB,IAAA,CAACH,IAAI;YACHwB,CAAC,EAAEZ,aAAc;YACjBc,IAAI,EAAC,MAAM;YACXC,MAAM,EAAEZ,WAAY;YACpBa,WAAW,EAAEZ,WAAW,GAAI;UAAE,CAC/B;QAAC,CACD,CACJ;MAAA,CACA,CAAC;IAAA,CACJ,CAAC;EAEP;EAEA,OAAO,IAAI;AACb,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/model/ArcPatternGenerator.js

@@ -0,0 +1,44 @@
+"use strict";
+
+export class OuterArcPatternGenerator {
+  constructor(config) {
+    this.config = config;
+  }
+  generateArcPath(slice, radius) {
+    const gapAngle = this.config.gapBetweenSlices / (2 * radius);
+    const startAngle = slice.startAngle + gapAngle;
+    const endAngle = slice.endAngle - gapAngle;
+    const startPoint = this.polarToCartesian(radius, startAngle);
+    const endPoint = this.polarToCartesian(radius, endAngle);
+    const largeArcFlag = endAngle - startAngle > Math.PI ? 1 : 0;
+    return `M ${startPoint.x} ${startPoint.y} A ${radius} ${radius} 0 ${largeArcFlag} 1 ${endPoint.x} ${endPoint.y}`;
+  }
+
+  /** Returns the sizes of the two rings where the checkerboard dashes are drawn. */
+  getPatternTrackSizes() {
+    const {
+      outerRadius,
+      outerArc
+    } = this.config;
+    return [outerRadius - outerArc.strokeWidth / 2, outerRadius - outerArc.strokeWidth * 1.5];
+  }
+  getDashWidthForRadius(radius) {
+    return this.config.outerArc.dashWidth * (radius / this.config.outerRadius);
+  }
+  getDashOffset(rowIndex, radius) {
+    const dashAngle = this.config.outerArc.dashWidth / this.config.outerRadius;
+    const dashWidthAtRadius = dashAngle * radius;
+    const baseOffset = dashWidthAtRadius / 2;
+    if (rowIndex === 1) {
+      return baseOffset - dashWidthAtRadius;
+    }
+    return baseOffset;
+  }
+  polarToCartesian(radius, angleInRadians) {
+    return {
+      x: radius * Math.sin(angleInRadians),
+      y: -radius * Math.cos(angleInRadians)
+    };
+  }
+}
+//# sourceMappingURL=ArcPatternGenerator.js.map

package/dist/module/features/pmProgress/components/chart/model/ArcPatternGenerator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["OuterArcPatternGenerator","constructor","config","generateArcPath","slice","radius","gapAngle","gapBetweenSlices","startAngle","endAngle","startPoint","polarToCartesian","endPoint","largeArcFlag","Math","PI","x","y","getPatternTrackSizes","outerRadius","outerArc","strokeWidth","getDashWidthForRadius","dashWidth","getDashOffset","rowIndex","dashAngle","dashWidthAtRadius","baseOffset","angleInRadians","sin","cos"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/model/ArcPatternGenerator.ts"],"mappings":";;AAEA,OAAO,MAAMA,wBAAwB,CAAC;EACpCC,WAAWA,CAAkBC,MAA6B,EAAE;IAAA,KAA/BA,MAA6B,GAA7BA,MAA6B;EAAG;EAEtDC,eAAeA,CAACC,KAAiB,EAAEC,MAAc,EAAE;IACxD,MAAMC,QAAQ,GAAG,IAAI,CAACJ,MAAM,CAACK,gBAAgB,IAAI,CAAC,GAAGF,MAAM,CAAC;IAC5D,MAAMG,UAAU,GAAGJ,KAAK,CAACI,UAAU,GAAGF,QAAQ;IAC9C,MAAMG,QAAQ,GAAGL,KAAK,CAACK,QAAQ,GAAGH,QAAQ;IAE1C,MAAMI,UAAU,GAAG,IAAI,CAACC,gBAAgB,CAACN,MAAM,EAAEG,UAAU,CAAC;IAC5D,MAAMI,QAAQ,GAAG,IAAI,CAACD,gBAAgB,CAACN,MAAM,EAAEI,QAAQ,CAAC;IACxD,MAAMI,YAAY,GAAGJ,QAAQ,GAAGD,UAAU,GAAGM,IAAI,CAACC,EAAE,GAAG,CAAC,GAAG,CAAC;IAE5D,OAAO,KAAKL,UAAU,CAACM,CAAC,IAAIN,UAAU,CAACO,CAAC,MAAMZ,MAAM,IAAIA,MAAM,MAAMQ,YAAY,MAAMD,QAAQ,CAACI,CAAC,IAAIJ,QAAQ,CAACK,CAAC,EAAE;EAClH;;EAEA;EACOC,oBAAoBA,CAAA,EAAqB;IAC9C,MAAM;MAAEC,WAAW;MAAEC;IAAS,CAAC,GAAG,IAAI,CAAClB,MAAM;IAC7C,OAAO,CACLiB,WAAW,GAAGC,QAAQ,CAACC,WAAW,GAAG,CAAC,EACtCF,WAAW,GAAGC,QAAQ,CAACC,WAAW,GAAG,GAAG,CACzC;EACH;EAEOC,qBAAqBA,CAACjB,MAAc,EAAE;IAC3C,OAAO,IAAI,CAACH,MAAM,CAACkB,QAAQ,CAACG,SAAS,IAAIlB,MAAM,GAAG,IAAI,CAACH,MAAM,CAACiB,WAAW,CAAC;EAC5E;EAEOK,aAAaA,CAACC,QAAgB,EAAEpB,MAAc,EAAE;IACrD,MAAMqB,SAAS,GAAG,IAAI,CAACxB,MAAM,CAACkB,QAAQ,CAACG,SAAS,GAAG,IAAI,CAACrB,MAAM,CAACiB,WAAW;IAC1E,MAAMQ,iBAAiB,GAAGD,SAAS,GAAGrB,MAAM;IAC5C,MAAMuB,UAAU,GAAGD,iBAAiB,GAAG,CAAC;IAExC,IAAIF,QAAQ,KAAK,CAAC,EAAE;MAClB,OAAOG,UAAU,GAAGD,iBAAiB;IACvC;IACA,OAAOC,UAAU;EACnB;EAEQjB,gBAAgBA,CAACN,MAAc,EAAEwB,cAAsB,EAAE;IAC/D,OAAO;MACLb,CAAC,EAAEX,MAAM,GAAGS,IAAI,CAACgB,GAAG,CAACD,cAAc,CAAC;MACpCZ,CAAC,EAAE,CAACZ,MAAM,GAAGS,IAAI,CAACiB,GAAG,CAACF,cAAc;IACtC,CAAC;EACH;AACF","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/model/PieChartManager.js

@@ -0,0 +1,20 @@
+"use strict";
+
+import { SliceShapeGenerator } from "./SliceShapeGenerator.js";
+import { OuterArcPatternGenerator } from "./ArcPatternGenerator.js";
+import { SliceHighlight } from "./SliceHighlight.js";
+export class PieChartManager {
+  constructor(config) {
+    this.config = config;
+    this.shape = new SliceShapeGenerator(config);
+    this.pattern = new OuterArcPatternGenerator(config);
+    this.highlight = new SliceHighlight(config);
+  }
+  getCenter() {
+    return {
+      x: this.config.size / 2,
+      y: this.config.size / 2
+    };
+  }
+}
+//# sourceMappingURL=PieChartManager.js.map

package/dist/module/features/pmProgress/components/chart/model/PieChartManager.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SliceShapeGenerator","OuterArcPatternGenerator","SliceHighlight","PieChartManager","constructor","config","shape","pattern","highlight","getCenter","x","size","y"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/model/PieChartManager.ts"],"mappings":";;AAAA,SAASA,mBAAmB,QAAQ,0BAAuB;AAC3D,SAASC,wBAAwB,QAAQ,0BAAuB;AAChE,SAASC,cAAc,QAAQ,qBAAkB;AAGjD,OAAO,MAAMC,eAAe,CAAC;EAK3BC,WAAWA,CAAiBC,MAA6B,EAAE;IAAA,KAA/BA,MAA6B,GAA7BA,MAA6B;IACvD,IAAI,CAACC,KAAK,GAAG,IAAIN,mBAAmB,CAACK,MAAM,CAAC;IAC5C,IAAI,CAACE,OAAO,GAAG,IAAIN,wBAAwB,CAACI,MAAM,CAAC;IACnD,IAAI,CAACG,SAAS,GAAG,IAAIN,cAAc,CAACG,MAAM,CAAC;EAC7C;EAEOI,SAASA,CAAA,EAAG;IACjB,OAAO;MAAEC,CAAC,EAAE,IAAI,CAACL,MAAM,CAACM,IAAI,GAAG,CAAC;MAAEC,CAAC,EAAE,IAAI,CAACP,MAAM,CAACM,IAAI,GAAG;IAAE,CAAC;EAC7D;AACF","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/model/SliceHighlight.js

@@ -0,0 +1,15 @@
+"use strict";
+
+import { createEvent, createStore } from 'effector';
+export class SliceHighlight {
+  set = createEvent();
+  reset = createEvent();
+  $highlightedIndex = createStore(null).on(this.set, (_, index) => index).reset(this.reset);
+  constructor(config) {
+    this.config = config;
+  }
+  getTranslateY(isHighlighted) {
+    return isHighlighted ? -this.config.pressOffset : 0;
+  }
+}
+//# sourceMappingURL=SliceHighlight.js.map

package/dist/module/features/pmProgress/components/chart/model/SliceHighlight.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createEvent","createStore","SliceHighlight","set","reset","$highlightedIndex","on","_","index","constructor","config","getTranslateY","isHighlighted","pressOffset"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/model/SliceHighlight.ts"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,WAAW,QAAQ,UAAU;AAGnD,OAAO,MAAMC,cAAc,CAAC;EACVC,GAAG,GAAGH,WAAW,CAAS,CAAC;EAC3BI,KAAK,GAAGJ,WAAW,CAAC,CAAC;EAErBK,iBAAiB,GAAGJ,WAAW,CAAgB,IAAI,CAAC,CACjEK,EAAE,CAAC,IAAI,CAACH,GAAG,EAAE,CAACI,CAAC,EAAEC,KAAK,KAAKA,KAAK,CAAC,CACjCJ,KAAK,CAAC,IAAI,CAACA,KAAK,CAAC;EAEpBK,WAAWA,CAAkBC,MAA6B,EAAE;IAAA,KAA/BA,MAA6B,GAA7BA,MAA6B;EAAG;EAEtDC,aAAaA,CAACC,aAAsB,EAAU;IACnD,OAAOA,aAAa,GAAG,CAAC,IAAI,CAACF,MAAM,CAACG,WAAW,GAAG,CAAC;EACrD;AACF","ignoreList":[]}

package/dist/module/features/pmProgress/components/chart/model/SliceShapeGenerator.js

@@ -0,0 +1,74 @@
+"use strict";
+
+import { arc, pie } from 'd3-shape';
+export class SliceShapeGenerator {
+  innerRadius = 0;
+  d3Pie = pie().value(({
+    value
+  }) => value).sort(null);
+  constructor(config) {
+    this.config = config;
+  }
+  generateSlices(data) {
+    this.innerRadius = this.getInnerRadius(data.length);
+    return this.d3Pie(data).map((datum, index) => ({
+      index,
+      startAngle: datum.startAngle,
+      endAngle: datum.endAngle,
+      fillPercent: datum.data.fillPercent ?? 0,
+      backgroundColor: datum.data.backgroundColor ?? this.config.colors.background,
+      fillColor: datum.data.fillColor,
+      borderColor: datum.data.borderColor,
+      data: datum.data
+    }));
+  }
+  generateSlicePath(slice) {
+    return this.buildArc(slice, this.config.outerRadius, this.getCornerRadius(100));
+  }
+  generateFillPath(slice) {
+    const fillRadius = this.getFillRadius(slice);
+    const cornerRadius = this.getCornerRadius(slice.fillPercent);
+
+    // Build with innerRadius 0 so d3 only rounds the outer corners.
+    // The slice clip path will cut the inner edge to the correct boundary.
+    return arc().outerRadius(fillRadius).innerRadius(0).cornerRadius(cornerRadius).padAngle(this.padAngle).padRadius(this.config.outerRadius)({
+      startAngle: slice.startAngle,
+      endAngle: slice.endAngle,
+      innerRadius: 0,
+      outerRadius: fillRadius
+    });
+  }
+  generateFillBorderPath(slice) {
+    const fillRadius = this.getFillRadius(slice);
+    const cornerRadius = this.getCornerRadius(slice.fillPercent);
+    return this.buildArc(slice, fillRadius, cornerRadius);
+  }
+  getFillRadius(slice) {
+    return this.innerRadius + (this.config.outerRadius - this.innerRadius) * (slice.fillPercent / 100);
+  }
+  getInnerRadius(sliceCount) {
+    const {
+      innerRadius
+    } = this.config;
+    return typeof innerRadius === 'function' ? innerRadius(sliceCount) : innerRadius;
+  }
+  getCornerRadius(fillPercent) {
+    const {
+      cornerRadius
+    } = this.config;
+    return typeof cornerRadius === 'function' ? cornerRadius(fillPercent) : cornerRadius;
+  }
+  get padAngle() {
+    return this.config.gapBetweenSlices / this.config.outerRadius;
+  }
+  buildArc(slice, outerRadius, cornerRadius) {
+    const innerRadius = this.innerRadius;
+    return arc().outerRadius(outerRadius).innerRadius(innerRadius).cornerRadius(cornerRadius).padAngle(this.padAngle).padRadius(this.config.outerRadius)({
+      startAngle: slice.startAngle,
+      endAngle: slice.endAngle,
+      innerRadius,
+      outerRadius
+    });
+  }
+}
+//# sourceMappingURL=SliceShapeGenerator.js.map

package/dist/module/features/pmProgress/components/chart/model/SliceShapeGenerator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["arc","pie","SliceShapeGenerator","innerRadius","d3Pie","value","sort","constructor","config","generateSlices","data","getInnerRadius","length","map","datum","index","startAngle","endAngle","fillPercent","backgroundColor","colors","background","fillColor","borderColor","generateSlicePath","slice","buildArc","outerRadius","getCornerRadius","generateFillPath","fillRadius","getFillRadius","cornerRadius","padAngle","padRadius","generateFillBorderPath","sliceCount","gapBetweenSlices"],"sourceRoot":"../../../../../../../src","sources":["features/pmProgress/components/chart/model/SliceShapeGenerator.ts"],"mappings":"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","ignoreList":[]}

package/dist/module/features/pmProgress/components/header/PmProgressHeader.js

@@ -0,0 +1,192 @@
+"use strict";
+
+import React, { useState } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { Button, ButtonColor, ButtonSize, ButtonVariant, CaretDownIcon, CaretUpIcon, COLORS, Dropdown, HeadingVariants, Menu, PlayIcon, SPACING, Typography } from '@magmamath/react-native-ui';
+import { SketchArrowRight } from "../../../../shared/icons/SketchArrowRight.js";
+import { SliceDiamondIcon } from "../../../../shared/icons/SliceDiamondIcon.js";
+import { useText } from "../../../../shared/translation/index.js";
+import { useStoreMap, useUnit } from 'effector-react';
+import { usePmProgress } from "../../context/PmProgressContext.js";
+import { formatGradeName, isFluencyDomain } from "../../shared/pmProgress.helpers.js";
+import { SolvingFlow } from "../../shared/pmProgress.constants.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const PmProgressHeader = () => {
+  const t = useText();
+  const {
+    model,
+    onStartPress
+  } = usePmProgress();
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+  const grade = useUnit(model.tree.$grade);
+  const grades = useStoreMap(model.tree.$grades, grades => grades.map(grade => ({
+    key: grade.value,
+    title: grade.name,
+    disabled: grade.isLocked
+  })));
+  const nextUp = useStoreMap(model.tree.$domains, domains => domains.find(domain => {
+    const isFluency = isFluencyDomain(domain.title);
+    const isCompleted = domain.skillsCount.achieved === domain.skillsCount.total;
+    return !isFluency && !isCompleted;
+  }));
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.title,
+      children: [/*#__PURE__*/_jsx(Typography, {
+        variant: HeadingVariants.H2,
+        style: styles.dark,
+        children: t('pmProgress.title')
+      }), /*#__PURE__*/_jsx(Dropdown, {
+        isOpen: isDropdownOpen,
+        onDismiss: () => setIsDropdownOpen(false),
+        anchor: /*#__PURE__*/_jsxs(Button, {
+          variant: ButtonVariant.TERTIARY,
+          onPress: () => setIsDropdownOpen(prev => !prev),
+          children: [/*#__PURE__*/_jsx(Typography, {
+            variant: HeadingVariants.H8,
+            style: styles.dark,
+            children: grade !== null ? formatGradeName(grade) : t('pmProgress.grade')
+          }), /*#__PURE__*/_jsx(View, {
+            style: styles.caret,
+            children: isDropdownOpen ? /*#__PURE__*/_jsx(CaretUpIcon, {
+              color: COLORS.NEUTRAL_9
+            }) : /*#__PURE__*/_jsx(CaretDownIcon, {
+              color: COLORS.NEUTRAL_9
+            })
+          })]
+        }),
+        children: /*#__PURE__*/_jsx(Menu, {
+          style: styles.menu,
+          items: grades,
+          onItemPress: item => {
+            model.tree.setGrade(item.key);
+            setIsDropdownOpen(false);
+          }
+        })
+      })]
+    }), /*#__PURE__*/_jsxs(View, {
+      style: styles.nextUp,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.content,
+        children: [/*#__PURE__*/_jsx(View, {
+          style: styles.subtitle,
+          children: /*#__PURE__*/_jsx(Typography, {
+            variant: HeadingVariants.H2,
+            style: styles.dark,
+            children: t('pmProgress.nextUp')
+          })
+        }), /*#__PURE__*/_jsxs(View, {
+          style: [styles.row, styles.tilted],
+          children: [/*#__PURE__*/_jsx(Typography, {
+            variant: HeadingVariants.H7,
+            style: styles.muted,
+            children: nextUp?.title
+          }), /*#__PURE__*/_jsx(View, {
+            style: styles.diamond,
+            children: /*#__PURE__*/_jsx(SliceDiamondIcon, {
+              color: nextUp?.color
+            })
+          })]
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.arrow,
+        children: /*#__PURE__*/_jsx(SketchArrowRight, {})
+      }), /*#__PURE__*/_jsx(Button, {
+        onPress: async () => {
+          const skill = await model.solving.start({
+            type: SolvingFlow.MAGMA
+          });
+          onStartPress?.(skill);
+        },
+        icon: /*#__PURE__*/_jsx(PlayIcon, {
+          size: 16,
+          color: COLORS.NEUTRAL_1
+        }),
+        variant: ButtonVariant.PRIMARY,
+        size: ButtonSize.LARGE,
+        colorScheme: ButtonColor.YELLOW,
+        raiseLevel: 6,
+        style: {
+          container: styles.startButton
+        },
+        children: /*#__PURE__*/_jsx(Typography, {
+          variant: HeadingVariants.H6,
+          style: styles.startButtonText,
+          children: t('pmProgress.startButton')
+        })
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    marginBottom: SPACING[400],
+    zIndex: 1
+  },
+  title: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACING[200]
+  },
+  dark: {
+    color: COLORS.NEUTRAL_9
+  },
+  caret: {
+    marginLeft: SPACING[100]
+  },
+  menu: {
+    top: SPACING[100],
+    minWidth: 110
+  },
+  nextUp: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACING[400]
+  },
+  content: {
+    alignItems: 'center',
+    gap: SPACING[100]
+  },
+  subtitle: {
+    transform: [{
+      rotate: '355deg'
+    }],
+    marginRight: SPACING[300]
+  },
+  tilted: {
+    transform: [{
+      rotate: '355deg'
+    }]
+  },
+  row: {
+    flexDirection: 'row',
+    gap: SPACING[100]
+  },
+  muted: {
+    color: COLORS.NEUTRAL_8
+  },
+  diamond: {
+    bottom: 10,
+    transform: [{
+      rotate: '5deg'
+    }]
+  },
+  arrow: {
+    transform: [{
+      rotate: '358deg'
+    }]
+  },
+  startButton: {
+    minWidth: 145
+  },
+  startButtonText: {
+    fontWeight: '700',
+    textTransform: 'uppercase',
+    color: COLORS.NEUTRAL_1
+  }
+});
+//# sourceMappingURL=PmProgressHeader.js.map

package/dist/module/features/pmProgress/components/header/PmProgressHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","StyleSheet","View","Button","ButtonColor","ButtonSize","ButtonVariant","CaretDownIcon","CaretUpIcon","COLORS","Dropdown","HeadingVariants","Menu","PlayIcon","SPACING","Typography","SketchArrowRight","SliceDiamondIcon","useText","useStoreMap","useUnit","usePmProgress","formatGradeName","isFluencyDomain","SolvingFlow","jsx","_jsx","jsxs","_jsxs","PmProgressHeader","t","model","onStartPress","isDropdownOpen","setIsDropdownOpen","grade","tree","$grade","grades","$grades","map","key","value","title","name","disabled","isLocked","nextUp","$domains","domains","find","domain","isFluency","isCompleted","skillsCount","achieved","total","style","styles","container","children","variant","H2","dark","isOpen","onDismiss","anchor","TERTIARY","onPress","prev","H8","caret","color","NEUTRAL_9","menu","items","onItemPress","item","setGrade","content","subtitle","row","tilted","H7","muted","diamond","arrow","skill","solving","start","type","MAGMA","icon","size","NEUTRAL_1","PRIMARY","LARGE","colorScheme","YELLOW","raiseLevel","startButton","H6","startButtonText","create","flexDirection","justifyContent","alignItems","marginBottom","zIndex","gap","marginLeft","top","minWidth","transform","rotate","marginRight","NEUTRAL_8","bottom","fontWeight","textTransform"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/header/PmProgressHeader.tsx"],"mappings":"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","ignoreList":[]}