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

package/dist/module/features/pmProgress/components/insights/PmInsights.js

@@ -0,0 +1,63 @@
+"use strict";
+
+import React, { useMemo, useState } from 'react';
+import { useStoreMap } from 'effector-react';
+import { StyleSheet, View } from 'react-native';
+import { BORDER_RADIUS, COLORS, SPACING } from '@magmamath/react-native-ui';
+import { PracticeProgressPieChart } from "../chart/components/PracticeProgressPieChart.js";
+import { PmTimeframeStats } from "./PmTimeframeStats.js";
+import { usePmProgress } from "../../context/PmProgressContext.js";
+import { createChartConfig } from "../../shared/pmProgress.helpers.js";
+import { EMPTY_PIE_CHART_DATA, MAX_PIE_CHART_SIZE, STATS_MAX_HEIGHT } from "../../shared/pmProgress.constants.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const PmInsights = () => {
+  const {
+    model
+  } = usePmProgress();
+  const [chartSize, setChartSize] = useState(MAX_PIE_CHART_SIZE);
+  const chartData = useStoreMap(model.tree.$domains, domains => domains.map(domain => ({
+    value: 1,
+    fillPercent: Math.round(domain.scorePercentage),
+    fillColor: domain.color,
+    borderColor: domain.borderColor,
+    backgroundColor: domain.backgroundColor
+  })));
+  const chartConfig = useMemo(() => {
+    const size = Math.max(0, chartSize - SPACING[400]);
+    return createChartConfig(size);
+  }, [chartSize]);
+  const measureLayout = event => {
+    const height = event.nativeEvent.layout.height;
+    const size = Math.min(height - STATS_MAX_HEIGHT - SPACING[800], MAX_PIE_CHART_SIZE);
+    setChartSize(size);
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    onLayout: measureLayout,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [styles.chart, {
+        width: chartSize,
+        height: chartSize
+      }],
+      children: /*#__PURE__*/_jsx(PracticeProgressPieChart, {
+        data: chartData.length > 0 ? chartData : EMPTY_PIE_CHART_DATA,
+        config: chartConfig
+      })
+    }), /*#__PURE__*/_jsx(PmTimeframeStats, {})]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    height: '100%'
+  },
+  chart: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: COLORS.NEUTRAL_1,
+    borderRadius: BORDER_RADIUS[250],
+    padding: SPACING[400],
+    marginBottom: SPACING[400],
+    marginTop: SPACING[400]
+  }
+});
+//# sourceMappingURL=PmInsights.js.map

package/dist/module/features/pmProgress/components/insights/PmInsights.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","useState","useStoreMap","StyleSheet","View","BORDER_RADIUS","COLORS","SPACING","PracticeProgressPieChart","PmTimeframeStats","usePmProgress","createChartConfig","EMPTY_PIE_CHART_DATA","MAX_PIE_CHART_SIZE","STATS_MAX_HEIGHT","jsx","_jsx","jsxs","_jsxs","PmInsights","model","chartSize","setChartSize","chartData","tree","$domains","domains","map","domain","value","fillPercent","Math","round","scorePercentage","fillColor","color","borderColor","backgroundColor","chartConfig","size","max","measureLayout","event","height","nativeEvent","layout","min","style","styles","container","onLayout","children","chart","width","data","length","config","create","alignItems","justifyContent","NEUTRAL_1","borderRadius","padding","marginBottom","marginTop"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/insights/PmInsights.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAChD,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,SAA4BC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAClE,SAASC,aAAa,EAAEC,MAAM,EAAEC,OAAO,QAAQ,4BAA4B;AAC3E,SAASC,wBAAwB,QAAQ,iDAA8C;AACvF,SAASC,gBAAgB,QAAQ,uBAAoB;AACrD,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,iBAAiB,QAAQ,oCAAiC;AACnE,SAASC,oBAAoB,EAAEC,kBAAkB,EAAEC,gBAAgB,QAAQ,sCAAmC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE9G,OAAO,MAAMC,UAAU,GAAGA,CAAA,KAAM;EAC9B,MAAM;IAAEC;EAAM,CAAC,GAAGV,aAAa,CAAC,CAAC;EACjC,MAAM,CAACW,SAAS,EAAEC,YAAY,CAAC,GAAGrB,QAAQ,CAACY,kBAAkB,CAAC;EAC9D,MAAMU,SAAS,GAAGrB,WAAW,CAACkB,KAAK,CAACI,IAAI,CAACC,QAAQ,EAAGC,OAAO,IACzDA,OAAO,CAACC,GAAG,CAAEC,MAAM,KAAM;IACvBC,KAAK,EAAE,CAAC;IACRC,WAAW,EAAEC,IAAI,CAACC,KAAK,CAACJ,MAAM,CAACK,eAAe,CAAC;IAC/CC,SAAS,EAAEN,MAAM,CAACO,KAAK;IACvBC,WAAW,EAAER,MAAM,CAACQ,WAAW;IAC/BC,eAAe,EAAET,MAAM,CAACS;EAC1B,CAAC,CAAC,CACJ,CAAC;EAED,MAAMC,WAAW,GAAGtC,OAAO,CAAC,MAAM;IAChC,MAAMuC,IAAI,GAAGR,IAAI,CAACS,GAAG,CAAC,CAAC,EAAEnB,SAAS,GAAGd,OAAO,CAAC,GAAG,CAAC,CAAC;IAClD,OAAOI,iBAAiB,CAAC4B,IAAI,CAAC;EAChC,CAAC,EAAE,CAAClB,SAAS,CAAC,CAAC;EAEf,MAAMoB,aAAa,GAAIC,KAAwB,IAAK;IAClD,MAAMC,MAAM,GAAGD,KAAK,CAACE,WAAW,CAACC,MAAM,CAACF,MAAM;IAC9C,MAAMJ,IAAI,GAAGR,IAAI,CAACe,GAAG,CAACH,MAAM,GAAG7B,gBAAgB,GAAGP,OAAO,CAAC,GAAG,CAAC,EAAEM,kBAAkB,CAAC;IACnFS,YAAY,CAACiB,IAAI,CAAC;EACpB,CAAC;EAED,oBACErB,KAAA,CAACd,IAAI;IAAC2C,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,QAAQ,EAAET,aAAc;IAAAU,QAAA,gBACrDnC,IAAA,CAACZ,IAAI;MAAC2C,KAAK,EAAE,CAACC,MAAM,CAACI,KAAK,EAAE;QAAEC,KAAK,EAAEhC,SAAS;QAAEsB,MAAM,EAAEtB;MAAU,CAAC,CAAE;MAAA8B,QAAA,eACnEnC,IAAA,CAACR,wBAAwB;QAAC8C,IAAI,EAAE/B,SAAS,CAACgC,MAAM,GAAG,CAAC,GAAGhC,SAAS,GAAGX,oBAAqB;QAAC4C,MAAM,EAAElB;MAAY,CAAE;IAAC,CAC5G,CAAC,eACPtB,IAAA,CAACP,gBAAgB,IAAE,CAAC;EAAA,CAChB,CAAC;AAEX,CAAC;AAED,MAAMuC,MAAM,GAAG7C,UAAU,CAACsD,MAAM,CAAC;EAC/BR,SAAS,EAAE;IACTN,MAAM,EAAE;EACV,CAAC;EACDS,KAAK,EAAE;IACLM,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE,QAAQ;IACxBtB,eAAe,EAAE/B,MAAM,CAACsD,SAAS;IACjCC,YAAY,EAAExD,aAAa,CAAC,GAAG,CAAC;IAChCyD,OAAO,EAAEvD,OAAO,CAAC,GAAG,CAAC;IACrBwD,YAAY,EAAExD,OAAO,CAAC,GAAG,CAAC;IAC1ByD,SAAS,EAAEzD,OAAO,CAAC,GAAG;EACxB;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/insights/PmTimeframeStats.js

@@ -0,0 +1,89 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { COLORS, SelectGroup, SelectOptionColor, SPACING } from '@magmamath/react-native-ui';
+import { StatsCard } from "./StatsCard.js";
+import { StarIcon } from "../../../../shared/icons/StarIcon.js";
+import { TimerIcon } from "../../../../shared/icons/TimerIcon.js";
+import { BORDER_RADIUS } from '@magmamath/react-native-ui';
+import { useText } from "../../../../shared/translation/index.js";
+import { useUnit } from 'effector-react';
+import { formatTime } from "../../shared/pmProgress.helpers.js";
+import { InsightsTimeframe, STATS_MAX_HEIGHT } from "../../shared/pmProgress.constants.js";
+import { usePmProgress } from "../../context/PmProgressContext.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const PmTimeframeStats = () => {
+  const t = useText();
+  const {
+    model
+  } = usePmProgress();
+  const timeframe = useUnit(model.insights.$timeframe);
+  const insights = useUnit(model.insights.$insights);
+  const OPTIONS = [{
+    key: InsightsTimeframe.WEEK,
+    title: t('pmProgress.thisWeek')
+  }, {
+    key: InsightsTimeframe.LAST_WEEK,
+    title: t('pmProgress.lastWeek')
+  }, {
+    key: InsightsTimeframe.ALL,
+    title: t('pmProgress.allTime')
+  }];
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.container,
+    children: /*#__PURE__*/_jsxs(View, {
+      style: styles.content,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.cards,
+        children: [/*#__PURE__*/_jsx(StatsCard, {
+          value: insights?.numberOfStars ?? 0,
+          label: t('pmProgress.stars'),
+          color: COLORS.PRIMARY_YELLOW,
+          icon: /*#__PURE__*/_jsx(StarIcon, {})
+        }), /*#__PURE__*/_jsx(StatsCard, {
+          value: formatTime(insights?.timeInPracticeMs ?? 0),
+          label: t('pmProgress.time'),
+          color: COLORS.PRIMARY_PURPLE,
+          icon: /*#__PURE__*/_jsx(TimerIcon, {})
+        })]
+      }), /*#__PURE__*/_jsx(SelectGroup, {
+        color: SelectOptionColor.GREY,
+        options: OPTIONS,
+        selectedOptions: OPTIONS.filter(({
+          key
+        }) => key === timeframe),
+        onOptionChange: ({
+          key
+        }) => model.insights.setTimeframe(key)
+      })]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    maxHeight: STATS_MAX_HEIGHT,
+    height: '100%',
+    padding: SPACING[200],
+    backgroundColor: COLORS.NEUTRAL_1,
+    borderRadius: BORDER_RADIUS[300],
+    shadowColor: COLORS.NEUTRAL_9,
+    shadowOffset: {
+      width: 0,
+      height: 1
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 3,
+    elevation: 2
+  },
+  content: {
+    gap: SPACING[100],
+    marginBottom: 4
+  },
+  cards: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    gap: SPACING[300]
+  }
+});
+//# sourceMappingURL=PmTimeframeStats.js.map

package/dist/module/features/pmProgress/components/insights/PmTimeframeStats.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","COLORS","SelectGroup","SelectOptionColor","SPACING","StatsCard","StarIcon","TimerIcon","BORDER_RADIUS","useText","useUnit","formatTime","InsightsTimeframe","STATS_MAX_HEIGHT","usePmProgress","jsx","_jsx","jsxs","_jsxs","PmTimeframeStats","t","model","timeframe","insights","$timeframe","$insights","OPTIONS","key","WEEK","title","LAST_WEEK","ALL","style","styles","container","children","content","cards","value","numberOfStars","label","color","PRIMARY_YELLOW","icon","timeInPracticeMs","PRIMARY_PURPLE","GREY","options","selectedOptions","filter","onOptionChange","setTimeframe","create","maxHeight","height","padding","backgroundColor","NEUTRAL_1","borderRadius","shadowColor","NEUTRAL_9","shadowOffset","width","shadowOpacity","shadowRadius","elevation","gap","marginBottom","flexDirection","justifyContent"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/insights/PmTimeframeStats.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/pmProgress/components/insights/StatsCard.js

@@ -0,0 +1,65 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet, Text } from 'react-native';
+import { COLORS, FONT_FAMILY } from '@magmamath/react-native-ui';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const StatsCard = ({
+  value,
+  label,
+  color,
+  icon
+}) => {
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.card, {
+      borderColor: color
+    }],
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [styles.iconContainer, {
+        backgroundColor: color
+      }],
+      children: icon
+    }), /*#__PURE__*/_jsxs(View, {
+      children: [/*#__PURE__*/_jsx(Text, {
+        style: [styles.value, {
+          color
+        }],
+        children: value
+      }), /*#__PURE__*/_jsx(Text, {
+        style: styles.label,
+        children: label
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  card: {
+    flex: 1,
+    height: 65,
+    alignItems: 'center',
+    flexDirection: 'row',
+    borderRadius: 12,
+    borderWidth: 4,
+    padding: 8,
+    gap: 8
+  },
+  iconContainer: {
+    width: 42,
+    height: 42,
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: 100
+  },
+  value: {
+    fontSize: 32,
+    fontWeight: '700',
+    fontFamily: FONT_FAMILY.buenosAires
+  },
+  label: {
+    color: COLORS.NEUTRAL_8,
+    fontSize: 12,
+    fontFamily: FONT_FAMILY.buenosAires,
+    top: -6
+  }
+});
+//# sourceMappingURL=StatsCard.js.map

package/dist/module/features/pmProgress/components/insights/StatsCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","Text","COLORS","FONT_FAMILY","jsx","_jsx","jsxs","_jsxs","StatsCard","value","label","color","icon","style","styles","card","borderColor","children","iconContainer","backgroundColor","create","flex","height","alignItems","flexDirection","borderRadius","borderWidth","padding","gap","width","justifyContent","fontSize","fontWeight","fontFamily","buenosAires","NEUTRAL_8","top"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/insights/StatsCard.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAqB,OAAO;AACxC,SAASC,IAAI,EAAEC,UAAU,EAAEC,IAAI,QAAkB,cAAc;AAC/D,SAASC,MAAM,EAAEC,WAAW,QAAQ,4BAA4B;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAShE,OAAO,MAAMC,SAAS,GAAGA,CAAC;EAAEC,KAAK;EAAEC,KAAK;EAAEC,KAAK;EAAEC;AAAqB,CAAC,KAAK;EAC1E,oBACEL,KAAA,CAACR,IAAI;IAACc,KAAK,EAAE,CAACC,MAAM,CAACC,IAAI,EAAE;MAAEC,WAAW,EAAEL;IAAM,CAAC,CAAE;IAAAM,QAAA,gBACjDZ,IAAA,CAACN,IAAI;MAACc,KAAK,EAAE,CAACC,MAAM,CAACI,aAAa,EAAE;QAAEC,eAAe,EAAER;MAAM,CAAC,CAAE;MAAAM,QAAA,EAAEL;IAAI,CAAO,CAAC,eAC9EL,KAAA,CAACR,IAAI;MAAAkB,QAAA,gBACHZ,IAAA,CAACJ,IAAI;QAACY,KAAK,EAAE,CAACC,MAAM,CAACL,KAAK,EAAE;UAAEE;QAAM,CAAC,CAAE;QAAAM,QAAA,EAAER;MAAK,CAAO,CAAC,eACtDJ,IAAA,CAACJ,IAAI;QAACY,KAAK,EAAEC,MAAM,CAACJ,KAAM;QAAAO,QAAA,EAAEP;MAAK,CAAO,CAAC;IAAA,CACrC,CAAC;EAAA,CACH,CAAC;AAEX,CAAC;AAED,MAAMI,MAAM,GAAGd,UAAU,CAACoB,MAAM,CAAC;EAC/BL,IAAI,EAAE;IACJM,IAAI,EAAE,CAAC;IACPC,MAAM,EAAE,EAAE;IACVC,UAAU,EAAE,QAAQ;IACpBC,aAAa,EAAE,KAAK;IACpBC,YAAY,EAAE,EAAE;IAChBC,WAAW,EAAE,CAAC;IACdC,OAAO,EAAE,CAAC;IACVC,GAAG,EAAE;EACP,CAAC;EACDV,aAAa,EAAE;IACbW,KAAK,EAAE,EAAE;IACTP,MAAM,EAAE,EAAE;IACVC,UAAU,EAAE,QAAQ;IACpBO,cAAc,EAAE,QAAQ;IACxBL,YAAY,EAAE;EAChB,CAAC;EACDhB,KAAK,EAAE;IACLsB,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE9B,WAAW,CAAC+B;EAC1B,CAAC;EACDxB,KAAK,EAAE;IACLC,KAAK,EAAET,MAAM,CAACiC,SAAS;IACvBJ,QAAQ,EAAE,EAAE;IACZE,UAAU,EAAE9B,WAAW,CAAC+B,WAAW;IACnCE,GAAG,EAAE,CAAC;EACR;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/list/Fluency.js

@@ -0,0 +1,63 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { ListCard } from "./ListCard.js";
+import { COLORS, SPACING } from '@magmamath/react-native-ui';
+import { SliceDiamondIcon } from "../../../../shared/icons/SliceDiamondIcon.js";
+import { useText } from "../../../../shared/translation/index.js";
+import { useUnit } from 'effector-react';
+import { CustomDomain, SolvingFlow } from "../../shared/pmProgress.constants.js";
+import { usePmProgress } from "../../context/PmProgressContext.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const Fluency = ({
+  data
+}) => {
+  const t = useText();
+  const {
+    model,
+    onStandardPress
+  } = usePmProgress();
+  const expandedId = useUnit(model.highlight.$expandedId);
+  if (!data) return null;
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.separator
+    }), /*#__PURE__*/_jsx(ListCard, {
+      title: t('pmProgress.fluency'),
+      items: data.standards.map(standard => ({
+        ...standard,
+        id: standard.standardId
+      })),
+      progress: data.scorePercentage,
+      color: COLORS.PRIMARY_ORANGE,
+      onPress: () => model.highlight.expand(CustomDomain.FLUENCY),
+      onItemPress: async item => {
+        const skill = await model.solving.start({
+          type: SolvingFlow.STANDARD,
+          standardId: item.standardId
+        });
+        onStandardPress?.(skill);
+      },
+      isFirst: true,
+      isLast: true,
+      isExpanded: expandedId === CustomDomain.FLUENCY,
+      icon: /*#__PURE__*/_jsx(SliceDiamondIcon, {
+        color: COLORS.PRIMARY_ORANGE
+      })
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    marginBottom: SPACING[800]
+  },
+  separator: {
+    height: 1,
+    marginHorizontal: SPACING[100],
+    marginVertical: SPACING[200],
+    backgroundColor: COLORS.NEUTRAL_4
+  }
+});
+//# sourceMappingURL=Fluency.js.map

package/dist/module/features/pmProgress/components/list/Fluency.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","ListCard","COLORS","SPACING","SliceDiamondIcon","useText","useUnit","CustomDomain","SolvingFlow","usePmProgress","jsx","_jsx","jsxs","_jsxs","Fluency","data","t","model","onStandardPress","expandedId","highlight","$expandedId","style","styles","container","children","separator","title","items","standards","map","standard","id","standardId","progress","scorePercentage","color","PRIMARY_ORANGE","onPress","expand","FLUENCY","onItemPress","item","skill","solving","start","type","STANDARD","isFirst","isLast","isExpanded","icon","create","marginBottom","height","marginHorizontal","marginVertical","backgroundColor","NEUTRAL_4"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/list/Fluency.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,SAASC,QAAQ,QAAQ,eAAY;AACrC,SAASC,MAAM,EAAEC,OAAO,QAAQ,4BAA4B;AAC5D,SAASC,gBAAgB,QAAQ,8CAA2C;AAC5E,SAASC,OAAO,QAAQ,yCAAgC;AACxD,SAASC,OAAO,QAAQ,gBAAgB;AACxC,SAASC,YAAY,EAAEC,WAAW,QAAQ,sCAAmC;AAE7E,SAASC,aAAa,QAAQ,oCAAiC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAM/D,OAAO,MAAMC,OAAO,GAAGA,CAAC;EAAEC;AAAmB,CAAC,KAAK;EACjD,MAAMC,CAAC,GAAGX,OAAO,CAAC,CAAC;EACnB,MAAM;IAAEY,KAAK;IAAEC;EAAgB,CAAC,GAAGT,aAAa,CAAC,CAAC;EAClD,MAAMU,UAAU,GAAGb,OAAO,CAACW,KAAK,CAACG,SAAS,CAACC,WAAW,CAAC;EAEvD,IAAI,CAACN,IAAI,EAAE,OAAO,IAAI;EAEtB,oBACEF,KAAA,CAACb,IAAI;IAACsB,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,gBAC5Bd,IAAA,CAACX,IAAI;MAACsB,KAAK,EAAEC,MAAM,CAACG;IAAU,CAAE,CAAC,eACjCf,IAAA,CAACV,QAAQ;MACP0B,KAAK,EAAEX,CAAC,CAAC,oBAAoB,CAAE;MAC/BY,KAAK,EAAEb,IAAI,CAACc,SAAS,CAACC,GAAG,CAAEC,QAAQ,KAAM;QAAE,GAAGA,QAAQ;QAAEC,EAAE,EAAED,QAAQ,CAACE;MAAW,CAAC,CAAC,CAAE;MACpFC,QAAQ,EAAEnB,IAAI,CAACoB,eAAgB;MAC/BC,KAAK,EAAElC,MAAM,CAACmC,cAAe;MAC7BC,OAAO,EAAEA,CAAA,KAAMrB,KAAK,CAACG,SAAS,CAACmB,MAAM,CAAChC,YAAY,CAACiC,OAAO,CAAE;MAC5DC,WAAW,EAAE,MAAOC,IAAI,IAAK;QAC3B,MAAMC,KAAK,GAAG,MAAM1B,KAAK,CAAC2B,OAAO,CAACC,KAAK,CAAC;UACtCC,IAAI,EAAEtC,WAAW,CAACuC,QAAQ;UAC1Bd,UAAU,EAAES,IAAI,CAACT;QACnB,CAAC,CAAC;QACFf,eAAe,GAAGyB,KAAK,CAAC;MAC1B,CAAE;MACFK,OAAO;MACPC,MAAM;MACNC,UAAU,EAAE/B,UAAU,KAAKZ,YAAY,CAACiC,OAAQ;MAChDW,IAAI,eAAExC,IAAA,CAACP,gBAAgB;QAACgC,KAAK,EAAElC,MAAM,CAACmC;MAAe,CAAE;IAAE,CAC1D,CAAC;EAAA,CACE,CAAC;AAEX,CAAC;AAED,MAAMd,MAAM,GAAGxB,UAAU,CAACqD,MAAM,CAAC;EAC/B5B,SAAS,EAAE;IACT6B,YAAY,EAAElD,OAAO,CAAC,GAAG;EAC3B,CAAC;EACDuB,SAAS,EAAE;IACT4B,MAAM,EAAE,CAAC;IACTC,gBAAgB,EAAEpD,OAAO,CAAC,GAAG,CAAC;IAC9BqD,cAAc,EAAErD,OAAO,CAAC,GAAG,CAAC;IAC5BsD,eAAe,EAAEvD,MAAM,CAACwD;EAC1B;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/pmProgress/components/list/ListCard.js

@@ -0,0 +1,191 @@
+"use strict";
+
+import React, { useState } from 'react';
+import { Pressable, View, StyleSheet } from 'react-native';
+import { BORDER_RADIUS, CaretDownIcon, CaretRightIcon, COLORS, HeadingVariants, SPACING, Typography } from '@magmamath/react-native-ui';
+import { ListItem } from "./ListItem.js";
+import { useText } from "../../../../shared/translation/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const HEADER_HEIGHT = 60;
+const PROGRESS_BAR_WIDTH = 50;
+const PROGRESS_BAR_HEIGHT = 10;
+function getVisibleItems(items, maxItems) {
+  const visible = maxItems != null ? items.slice(0, maxItems) : items;
+  const remainingCount = maxItems != null ? Math.max(0, items.length - maxItems) : 0;
+  return {
+    visible,
+    remainingCount
+  };
+}
+export const ListCard = ({
+  title,
+  icon,
+  color,
+  items,
+  isExpanded = false,
+  isHighlighted = false,
+  onPress,
+  onHoverIn,
+  onHoverOut,
+  onItemPress,
+  progress = 0,
+  rightContent,
+  isFirst,
+  isLast,
+  maxItems,
+  expandedColor = COLORS.NEUTRAL_3,
+  isSkillsLeftHidden = false
+}) => {
+  const t = useText();
+  const [isHovered, setIsHovered] = useState(false);
+  const {
+    visible,
+    remainingCount
+  } = getVisibleItems(items, maxItems);
+  const withHighlight = isHovered || isExpanded || isHighlighted;
+  const Caret = isExpanded ? CaretDownIcon : CaretRightIcon;
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.container, !isFirst && styles.containerCollapsed, isFirst && styles.containerFirst, isLast && styles.containerLast, withHighlight && {
+      backgroundColor: expandedColor
+    }],
+    children: [/*#__PURE__*/_jsxs(Pressable, {
+      style: [styles.header, isFirst && styles.headerFirst, isLast && !isExpanded && styles.headerLast, withHighlight && {
+        backgroundColor: expandedColor
+      }],
+      onPress: onPress,
+      onHoverIn: () => {
+        setIsHovered(true);
+        onHoverIn?.();
+      },
+      onHoverOut: () => {
+        setIsHovered(false);
+        onHoverOut?.();
+      },
+      children: [icon, /*#__PURE__*/_jsx(View, {
+        style: styles.caret,
+        children: /*#__PURE__*/_jsx(Caret, {
+          color: COLORS.NEUTRAL_9
+        })
+      }), /*#__PURE__*/_jsx(Typography, {
+        variant: HeadingVariants.H6,
+        style: styles.title,
+        children: title
+      }), rightContent ?? /*#__PURE__*/_jsxs(View, {
+        style: styles.progress,
+        children: [/*#__PURE__*/_jsxs(Typography, {
+          variant: HeadingVariants.H7,
+          style: [styles.percentage, {
+            color
+          }],
+          children: [Math.round(progress), "%"]
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.track,
+          children: /*#__PURE__*/_jsx(View, {
+            style: [styles.fill, {
+              width: `${Math.round(progress)}%`,
+              backgroundColor: color
+            }]
+          })
+        })]
+      })]
+    }), isExpanded && /*#__PURE__*/_jsxs(View, {
+      style: [styles.items, isLast && styles.itemsLast],
+      children: [visible.map(item => {
+        const skillsLeft = item.skillsCount.total - item.skillsCount.achieved;
+        return /*#__PURE__*/_jsx(ListItem, {
+          title: item.title,
+          skillsLeft: skillsLeft,
+          subtitle: item.subtitle,
+          isFinished: skillsLeft === 0,
+          isSkillsLeftHidden: isSkillsLeftHidden,
+          onPress: () => onItemPress?.(item)
+        }, item.id);
+      }), remainingCount > 0 && /*#__PURE__*/_jsx(Typography, {
+        variant: HeadingVariants.H8,
+        style: styles.moreText,
+        children: t('pmProgress.andMore', {
+          count: `${remainingCount}`
+        })
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+    backgroundColor: COLORS.NEUTRAL_2,
+    overflow: 'hidden',
+    cursor: 'pointer'
+  },
+  containerCollapsed: {
+    marginTop: -1
+  },
+  containerFirst: {
+    borderTopLeftRadius: BORDER_RADIUS[200],
+    borderTopRightRadius: BORDER_RADIUS[200]
+  },
+  containerLast: {
+    borderBottomLeftRadius: BORDER_RADIUS[200],
+    borderBottomRightRadius: BORDER_RADIUS[200]
+  },
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    height: HEADER_HEIGHT,
+    padding: SPACING[400],
+    backgroundColor: COLORS.NEUTRAL_2,
+    borderWidth: 1,
+    borderColor: COLORS.NEUTRAL_4,
+    cursor: 'pointer'
+  },
+  headerFirst: {
+    borderTopLeftRadius: BORDER_RADIUS[200],
+    borderTopRightRadius: BORDER_RADIUS[200]
+  },
+  headerLast: {
+    borderBottomLeftRadius: BORDER_RADIUS[200],
+    borderBottomRightRadius: BORDER_RADIUS[200]
+  },
+  caret: {
+    marginLeft: SPACING[400]
+  },
+  title: {
+    color: COLORS.NEUTRAL_9,
+    marginLeft: SPACING[200],
+    flex: 1
+  },
+  progress: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACING[200]
+  },
+  percentage: {
+    textAlign: 'right'
+  },
+  track: {
+    width: PROGRESS_BAR_WIDTH,
+    height: PROGRESS_BAR_HEIGHT,
+    backgroundColor: COLORS.NEUTRAL_4,
+    borderRadius: BORDER_RADIUS[200],
+    overflow: 'hidden'
+  },
+  fill: {
+    height: '100%',
+    borderRadius: BORDER_RADIUS[200]
+  },
+  items: {
+    gap: SPACING[200],
+    padding: SPACING[200],
+    backgroundColor: COLORS.NEUTRAL_1
+  },
+  itemsLast: {
+    borderBottomLeftRadius: BORDER_RADIUS[200],
+    borderBottomRightRadius: BORDER_RADIUS[200]
+  },
+  moreText: {
+    textAlign: 'center',
+    color: COLORS.NEUTRAL_7,
+    marginVertical: SPACING[200]
+  }
+});
+//# sourceMappingURL=ListCard.js.map

package/dist/module/features/pmProgress/components/list/ListCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","Pressable","View","StyleSheet","BORDER_RADIUS","CaretDownIcon","CaretRightIcon","COLORS","HeadingVariants","SPACING","Typography","ListItem","useText","jsx","_jsx","jsxs","_jsxs","HEADER_HEIGHT","PROGRESS_BAR_WIDTH","PROGRESS_BAR_HEIGHT","getVisibleItems","items","maxItems","visible","slice","remainingCount","Math","max","length","ListCard","title","icon","color","isExpanded","isHighlighted","onPress","onHoverIn","onHoverOut","onItemPress","progress","rightContent","isFirst","isLast","expandedColor","NEUTRAL_3","isSkillsLeftHidden","t","isHovered","setIsHovered","withHighlight","Caret","style","styles","container","containerCollapsed","containerFirst","containerLast","backgroundColor","children","header","headerFirst","headerLast","caret","NEUTRAL_9","variant","H6","H7","percentage","round","track","fill","width","itemsLast","map","item","skillsLeft","skillsCount","total","achieved","subtitle","isFinished","id","H8","moreText","count","create","justifyContent","NEUTRAL_2","overflow","cursor","marginTop","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","flexDirection","alignItems","height","padding","borderWidth","borderColor","NEUTRAL_4","marginLeft","flex","gap","textAlign","borderRadius","NEUTRAL_1","NEUTRAL_7","marginVertical"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/list/ListCard.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/pmProgress/components/list/ListItem.js

@@ -0,0 +1,114 @@
+"use strict";
+
+import React, { useState } from 'react';
+import { View, Pressable, StyleSheet } from 'react-native';
+import { ArrowRightIcon, CheckIcon, COLORS, FONT_FAMILY, HeadingVariants, Typography } from '@magmamath/react-native-ui';
+import { useText } from "../../../../shared/translation/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const FINISHED_BG = '#EFFBF5';
+const FINISHED_TITLE = '#00804A';
+const FINISHED_SUBTITLE = '#29A96F';
+const FINISHED_ICON = '#5CD497';
+const CARD_HEIGHT = 52;
+const ICON_SIZE = 25;
+const SUBTITLE_FONT_SIZE = 10;
+const SUBTITLE_LINE_HEIGHT = 14;
+export const ListItem = ({
+  title,
+  subtitle,
+  skillsLeft,
+  isFinished = false,
+  onPress,
+  isSkillsLeftHidden = false
+}) => {
+  const t = useText();
+  const [isHovered, setIsHovered] = useState(false);
+  const isSkillsLeftVisible = skillsLeft > 0 && !isFinished && !isSkillsLeftHidden;
+  return /*#__PURE__*/_jsxs(Pressable, {
+    onPress: onPress,
+    style: [styles.card, isFinished && styles.finished, isHovered && styles.hovered],
+    onHoverIn: () => setIsHovered(true),
+    onHoverOut: () => setIsHovered(false),
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.content,
+      children: [/*#__PURE__*/_jsx(Typography, {
+        variant: HeadingVariants.H10,
+        style: [styles.title, isFinished && styles.titleFinished],
+        numberOfLines: 1,
+        children: title
+      }), /*#__PURE__*/_jsx(Typography, {
+        style: [styles.subtitle, isFinished && styles.subtitleFinished],
+        numberOfLines: 1,
+        children: subtitle
+      })]
+    }), /*#__PURE__*/_jsxs(View, {
+      style: styles.trailing,
+      children: [isSkillsLeftVisible && /*#__PURE__*/_jsxs(Typography, {
+        variant: HeadingVariants.H10,
+        style: styles.skills,
+        children: [skillsLeft, " ", skillsLeft === 1 ? t('pmProgress.skillLeft') : t('pmProgress.skillsLeft')]
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.icon,
+        children: isFinished ? /*#__PURE__*/_jsx(CheckIcon, {
+          color: FINISHED_ICON
+        }) : /*#__PURE__*/_jsx(ArrowRightIcon, {
+          color: COLORS.NEUTRAL_9
+        })
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  card: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    height: CARD_HEIGHT,
+    paddingLeft: 32,
+    paddingRight: 16,
+    backgroundColor: 'white',
+    borderRadius: 12,
+    gap: 8,
+    boxShadow: '0px 0px 1px 0px #33333366, 0px 1px 3px 0px #3333331A'
+  },
+  finished: {
+    backgroundColor: FINISHED_BG,
+    boxShadow: '0px 0px 1px 0px #33333366, 0px 1px 3px 0px #3333331A'
+  },
+  hovered: {
+    backgroundColor: '#FAFAFB',
+    boxShadow: '0px 0px 1px 0px #33333366, 0px 1px 3px 0px #3333331A, 4px 4px 10px rgba(51, 51, 51, 0.15)'
+  },
+  content: {
+    flex: 1
+  },
+  title: {
+    color: COLORS.NEUTRAL_9
+  },
+  titleFinished: {
+    color: FINISHED_TITLE
+  },
+  subtitle: {
+    color: COLORS.NEUTRAL_7,
+    fontSize: SUBTITLE_FONT_SIZE,
+    fontFamily: FONT_FAMILY.buenosAires,
+    lineHeight: SUBTITLE_LINE_HEIGHT
+  },
+  subtitleFinished: {
+    color: FINISHED_SUBTITLE
+  },
+  trailing: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8
+  },
+  skills: {
+    color: COLORS.NEUTRAL_9
+  },
+  icon: {
+    width: ICON_SIZE,
+    height: ICON_SIZE,
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+});
+//# sourceMappingURL=ListItem.js.map

package/dist/module/features/pmProgress/components/list/ListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","View","Pressable","StyleSheet","ArrowRightIcon","CheckIcon","COLORS","FONT_FAMILY","HeadingVariants","Typography","useText","jsx","_jsx","jsxs","_jsxs","FINISHED_BG","FINISHED_TITLE","FINISHED_SUBTITLE","FINISHED_ICON","CARD_HEIGHT","ICON_SIZE","SUBTITLE_FONT_SIZE","SUBTITLE_LINE_HEIGHT","ListItem","title","subtitle","skillsLeft","isFinished","onPress","isSkillsLeftHidden","t","isHovered","setIsHovered","isSkillsLeftVisible","style","styles","card","finished","hovered","onHoverIn","onHoverOut","children","content","variant","H10","titleFinished","numberOfLines","subtitleFinished","trailing","skills","icon","color","NEUTRAL_9","create","flexDirection","alignItems","height","paddingLeft","paddingRight","backgroundColor","borderRadius","gap","boxShadow","flex","NEUTRAL_7","fontSize","fontFamily","buenosAires","lineHeight","width","justifyContent"],"sourceRoot":"../../../../../../src","sources":["features/pmProgress/components/list/ListItem.tsx"],"mappings":"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","ignoreList":[]}