@magmamath/students-features 1.5.0 → 1.5.1

package/dist/module/features/fluency/components/Fluency.js

@@ -0,0 +1,86 @@
+"use strict";
+
+import React from 'react';
+import { useGate, useUnit } from 'effector-react';
+import { View, StyleSheet } from 'react-native';
+import { Typography, HeadingVariants, SPACING, COLORS } from '@magmamath/react-native-ui';
+import { useText } from "../../../i18n/i18n.js";
+import { StartBanner } from "./start-banner/StartBanner.js";
+import { DayStreakCounter } from "./day-streak-counter/DayStreakCounter.js";
+import { SelectMathOperator } from "./select-math-operator/SelectMathOperator.js";
+import { FluencyMatrix } from "./matrix/FluencyMatrix.js";
+import { MobileMenu } from "./mobile-menu/MobileMenu.js";
+import { FluencyStatusOverlay } from "./FluencyStatusOverlay.js";
+import { FluencyProvider } from "../context/FluencyContext.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export const Fluency = ({
+  model,
+  config,
+  onMenuPress,
+  onStartPress,
+  onPracticePress,
+  onModeSelectPress
+}) => {
+  useGate(model.gate, {
+    config
+  });
+  const t = useText();
+  const status = useUnit(model.$status);
+  return /*#__PURE__*/_jsx(FluencyProvider, {
+    value: {
+      model,
+      onStartPress,
+      onPracticePress,
+      onModeSelectPress
+    },
+    children: /*#__PURE__*/_jsxs(View, {
+      style: styles.root,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.title,
+        children: [/*#__PURE__*/_jsx(MobileMenu, {
+          onPress: onMenuPress
+        }), /*#__PURE__*/_jsx(Typography, {
+          variant: HeadingVariants.H2,
+          style: styles.titleText,
+          children: t('student.fluency.title')
+        })]
+      }), status ? /*#__PURE__*/_jsx(FluencyStatusOverlay, {
+        status: status
+      }) : /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: styles.header,
+          children: [/*#__PURE__*/_jsx(StartBanner, {}), /*#__PURE__*/_jsx(DayStreakCounter, {})]
+        }), /*#__PURE__*/_jsxs(View, {
+          style: styles.matrix,
+          children: [/*#__PURE__*/_jsx(SelectMathOperator, {}), /*#__PURE__*/_jsx(FluencyMatrix, {})]
+        })]
+      })]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  root: {
+    flex: 1
+  },
+  title: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  titleText: {
+    color: COLORS.NEUTRAL_9
+  },
+  header: {
+    height: 182,
+    flexDirection: 'row',
+    marginTop: SPACING[400],
+    gap: SPACING[400],
+    zIndex: 1
+  },
+  matrix: {
+    flex: 1,
+    flexDirection: 'row',
+    marginTop: SPACING[400],
+    gap: SPACING[200]
+  }
+});
+//# sourceMappingURL=Fluency.js.map

package/dist/module/features/fluency/components/Fluency.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useGate","useUnit","View","StyleSheet","Typography","HeadingVariants","SPACING","COLORS","useText","StartBanner","DayStreakCounter","SelectMathOperator","FluencyMatrix","MobileMenu","FluencyStatusOverlay","FluencyProvider","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Fluency","model","config","onMenuPress","onStartPress","onPracticePress","onModeSelectPress","gate","t","status","$status","value","children","style","styles","root","title","onPress","variant","H2","titleText","header","matrix","create","flex","flexDirection","alignItems","color","NEUTRAL_9","height","marginTop","gap","zIndex"],"sourceRoot":"../../../../../src","sources":["features/fluency/components/Fluency.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/fluency/components/FluencySolving.js

@@ -0,0 +1,40 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { COLORS } from '@magmamath/react-native-ui';
+import { FluencyProvider } from "../context/FluencyContext.js";
+import { FluencySolvingHeader } from "./fluency-solving/components/FluencySolvingHeader.js";
+import { FluencySolvingProgress } from "./fluency-solving/components/FluencySolvingProgress.js";
+import { FluencySolvingCard } from "./fluency-solving/components/FluencySolvingCard.js";
+import { FluencySessionResults } from "./session-results/FluencySessionResults.js";
+import { usePreventPageLeave } from "../hooks/usePreventPageLeave.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const FluencySolving = ({
+  model,
+  onClosePress,
+  onEndModalPress
+}) => {
+  usePreventPageLeave();
+  return /*#__PURE__*/_jsxs(FluencyProvider, {
+    value: {
+      model
+    },
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: styles.container,
+      children: [/*#__PURE__*/_jsx(FluencySolvingHeader, {
+        onClosePress: onClosePress
+      }), /*#__PURE__*/_jsx(FluencySolvingProgress, {}), /*#__PURE__*/_jsx(FluencySolvingCard, {})]
+    }), /*#__PURE__*/_jsx(FluencySessionResults, {
+      onClosePress: onClosePress,
+      onEndModalPress: onEndModalPress
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: COLORS.NEUTRAL_3
+  }
+});
+//# sourceMappingURL=FluencySolving.js.map

package/dist/module/features/fluency/components/FluencySolving.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","COLORS","FluencyProvider","FluencySolvingHeader","FluencySolvingProgress","FluencySolvingCard","FluencySessionResults","usePreventPageLeave","jsx","_jsx","jsxs","_jsxs","FluencySolving","model","onClosePress","onEndModalPress","value","children","style","styles","container","create","flex","backgroundColor","NEUTRAL_3"],"sourceRoot":"../../../../../src","sources":["features/fluency/components/FluencySolving.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SAASC,MAAM,QAAQ,4BAA4B;AACnD,SAASC,eAAe,QAAQ,8BAA2B;AAC3D,SAASC,oBAAoB,QAAQ,sDAAmD;AACxF,SAASC,sBAAsB,QAAQ,wDAAqD;AAC5F,SAASC,kBAAkB,QAAQ,oDAAiD;AACpF,SAASC,qBAAqB,QAAQ,4CAAyC;AAC/E,SAASC,mBAAmB,QAAQ,iCAA8B;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AASlE,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAAEC,KAAK;EAAEC,YAAY;EAAEC;AAAqC,CAAC,KAAK;EAC/FR,mBAAmB,CAAC,CAAC;EAErB,oBACEI,KAAA,CAACT,eAAe;IAACc,KAAK,EAAE;MAAEH;IAAM,CAAE;IAAAI,QAAA,gBAChCN,KAAA,CAACZ,IAAI;MAACmB,KAAK,EAAEC,MAAM,CAACC,SAAU;MAAAH,QAAA,gBAC5BR,IAAA,CAACN,oBAAoB;QAACW,YAAY,EAAEA;MAAa,CAAE,CAAC,eACpDL,IAAA,CAACL,sBAAsB,IAAE,CAAC,eAC1BK,IAAA,CAACJ,kBAAkB,IAAE,CAAC;IAAA,CAClB,CAAC,eAEPI,IAAA,CAACH,qBAAqB;MAACQ,YAAY,EAAEA,YAAa;MAACC,eAAe,EAAEA;IAAgB,CAAE,CAAC;EAAA,CACxE,CAAC;AAEtB,CAAC;AAED,MAAMI,MAAM,GAAGnB,UAAU,CAACqB,MAAM,CAAC;EAC/BD,SAAS,EAAE;IACTE,IAAI,EAAE,CAAC;IACPC,eAAe,EAAEtB,MAAM,CAACuB;EAC1B;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/FluencyStatusOverlay.js

@@ -0,0 +1,95 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { COLORS, ErrorIcon, HeadingVariants, InfoIcon, SPACING, Typography } from '@magmamath/react-native-ui';
+import { FluencyStatus } from "../shared/fluency.constants.js";
+import { useText } from "../../../i18n/i18n.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const FLUENCY_STATUS_VARIANTS = {
+  [FluencyStatus.ERROR]: {
+    icon: /*#__PURE__*/_jsx(ErrorIcon, {
+      color: COLORS.PRIMARY_RED,
+      size: 40
+    }),
+    circleColor: COLORS.RED_1,
+    titleKey: 'student.fluency.errorTitle',
+    subtitleKey: 'student.fluency.errorSubtitle'
+  },
+  [FluencyStatus.EMPTY]: {
+    icon: /*#__PURE__*/_jsx(InfoIcon, {
+      color: COLORS.NEUTRAL_6,
+      size: 40
+    }),
+    circleColor: COLORS.NEUTRAL_2,
+    titleKey: 'student.fluency.emptyTitle',
+    subtitleKey: 'student.fluency.emptySubtitle'
+  }
+};
+export const FluencyStatusOverlay = ({
+  status
+}) => {
+  const t = useText();
+  const variant = FLUENCY_STATUS_VARIANTS[status];
+  if (!variant) return null;
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.container,
+    children: /*#__PURE__*/_jsxs(View, {
+      style: styles.content,
+      children: [/*#__PURE__*/_jsx(View, {
+        style: [styles.iconCircle, {
+          backgroundColor: variant.circleColor
+        }],
+        children: variant.icon
+      }), /*#__PURE__*/_jsxs(View, {
+        style: styles.text,
+        children: [/*#__PURE__*/_jsx(Typography, {
+          variant: HeadingVariants.H2,
+          style: styles.title,
+          children: t(variant.titleKey)
+        }), /*#__PURE__*/_jsx(Typography, {
+          variant: HeadingVariants.H7,
+          style: styles.subtitle,
+          children: t(variant.subtitleKey)
+        })]
+      })]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  content: {
+    alignItems: 'center',
+    gap: SPACING[500],
+    paddingBottom: SPACING[800]
+  },
+  iconCircle: {
+    width: 88,
+    height: 88,
+    borderRadius: 44,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  text: {
+    alignItems: 'center',
+    gap: SPACING[200],
+    maxWidth: 340
+  },
+  title: {
+    color: COLORS.NEUTRAL_9,
+    textAlign: 'center',
+    fontSize: 24,
+    fontWeight: '500'
+  },
+  subtitle: {
+    color: COLORS.NEUTRAL_7,
+    textAlign: 'center',
+    fontSize: 16,
+    fontWeight: '400'
+  }
+});
+//# sourceMappingURL=FluencyStatusOverlay.js.map

package/dist/module/features/fluency/components/FluencyStatusOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","COLORS","ErrorIcon","HeadingVariants","InfoIcon","SPACING","Typography","FluencyStatus","useText","jsx","_jsx","jsxs","_jsxs","FLUENCY_STATUS_VARIANTS","ERROR","icon","color","PRIMARY_RED","size","circleColor","RED_1","titleKey","subtitleKey","EMPTY","NEUTRAL_6","NEUTRAL_2","FluencyStatusOverlay","status","t","variant","style","styles","container","children","content","iconCircle","backgroundColor","text","H2","title","H7","subtitle","create","flex","alignItems","justifyContent","gap","paddingBottom","width","height","borderRadius","maxWidth","NEUTRAL_9","textAlign","fontSize","fontWeight","NEUTRAL_7"],"sourceRoot":"../../../../../src","sources":["features/fluency/components/FluencyStatusOverlay.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/fluency/components/day-streak-counter/DayStreak.js

@@ -0,0 +1,90 @@
+"use strict";
+
+import { BORDER_RADIUS, COLORS, CorrectIcon, HeadingVariants, SPACING, Typography } from '@magmamath/react-native-ui';
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { StreakStatus } from "../../shared/fluency.constants.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const STATUS_STYLES = {
+  [StreakStatus.GAINED]: {
+    circle: {
+      backgroundColor: COLORS.PRIMARY_YELLOW,
+      borderWidth: 1,
+      borderColor: COLORS.NEUTRAL_3
+    },
+    label: {
+      color: COLORS.PRIMARY_YELLOW
+    },
+    hasIcon: true
+  },
+  [StreakStatus.TODAY]: {
+    circle: {
+      backgroundColor: COLORS.NEUTRAL_2,
+      borderWidth: 3,
+      borderColor: COLORS.YELLOW_6
+    },
+    label: {
+      color: COLORS.YELLOW_6
+    },
+    hasIcon: false
+  },
+  [StreakStatus.TODAY_GAINED]: {
+    circle: {
+      backgroundColor: COLORS.PRIMARY_YELLOW,
+      borderWidth: 3,
+      borderColor: COLORS.YELLOW_6
+    },
+    label: {
+      color: COLORS.YELLOW_6
+    },
+    hasIcon: true
+  },
+  [StreakStatus.MISSED]: {
+    circle: {
+      backgroundColor: COLORS.NEUTRAL_2,
+      borderWidth: 1,
+      borderColor: COLORS.NEUTRAL_3
+    },
+    label: {
+      color: COLORS.NEUTRAL_4
+    },
+    hasIcon: false
+  }
+};
+export const StreakDay = ({
+  label,
+  status
+}) => {
+  const {
+    circle,
+    label: labelStyle,
+    hasIcon
+  } = STATUS_STYLES[status];
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [styles.circle, circle],
+      children: hasIcon && /*#__PURE__*/_jsx(CorrectIcon, {
+        color: COLORS.NEUTRAL_1
+      })
+    }), /*#__PURE__*/_jsx(Typography, {
+      variant: HeadingVariants.H3,
+      style: labelStyle,
+      children: label
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    gap: SPACING[100]
+  },
+  circle: {
+    width: SPACING[800],
+    height: SPACING[800],
+    borderRadius: BORDER_RADIUS[400],
+    alignItems: 'center',
+    justifyContent: 'center'
+  }
+});
+//# sourceMappingURL=DayStreak.js.map

package/dist/module/features/fluency/components/day-streak-counter/DayStreak.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BORDER_RADIUS","COLORS","CorrectIcon","HeadingVariants","SPACING","Typography","React","StyleSheet","View","StreakStatus","jsx","_jsx","jsxs","_jsxs","STATUS_STYLES","GAINED","circle","backgroundColor","PRIMARY_YELLOW","borderWidth","borderColor","NEUTRAL_3","label","color","hasIcon","TODAY","NEUTRAL_2","YELLOW_6","TODAY_GAINED","MISSED","NEUTRAL_4","StreakDay","status","labelStyle","style","styles","container","children","NEUTRAL_1","variant","H3","create","alignItems","gap","width","height","borderRadius","justifyContent"],"sourceRoot":"../../../../../../src","sources":["features/fluency/components/day-streak-counter/DayStreak.tsx"],"mappings":";;AAAA,SACEA,aAAa,EACbC,MAAM,EACNC,WAAW,EACXC,eAAe,EACfC,OAAO,EACPC,UAAU,QACL,4BAA4B;AACnC,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAaC,IAAI,QAAmB,cAAc;AACrE,SAASC,YAAY,QAAQ,mCAAgC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAa7D,MAAMC,aAAgD,GAAG;EACvD,CAACL,YAAY,CAACM,MAAM,GAAG;IACrBC,MAAM,EAAE;MACNC,eAAe,EAAEhB,MAAM,CAACiB,cAAc;MACtCC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAEnB,MAAM,CAACoB;IACtB,CAAC;IACDC,KAAK,EAAE;MAAEC,KAAK,EAAEtB,MAAM,CAACiB;IAAe,CAAC;IACvCM,OAAO,EAAE;EACX,CAAC;EACD,CAACf,YAAY,CAACgB,KAAK,GAAG;IACpBT,MAAM,EAAE;MACNC,eAAe,EAAEhB,MAAM,CAACyB,SAAS;MACjCP,WAAW,EAAE,CAAC;MACdC,WAAW,EAAEnB,MAAM,CAAC0B;IACtB,CAAC;IACDL,KAAK,EAAE;MAAEC,KAAK,EAAEtB,MAAM,CAAC0B;IAAS,CAAC;IACjCH,OAAO,EAAE;EACX,CAAC;EACD,CAACf,YAAY,CAACmB,YAAY,GAAG;IAC3BZ,MAAM,EAAE;MACNC,eAAe,EAAEhB,MAAM,CAACiB,cAAc;MACtCC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAEnB,MAAM,CAAC0B;IACtB,CAAC;IACDL,KAAK,EAAE;MAAEC,KAAK,EAAEtB,MAAM,CAAC0B;IAAS,CAAC;IACjCH,OAAO,EAAE;EACX,CAAC;EACD,CAACf,YAAY,CAACoB,MAAM,GAAG;IACrBb,MAAM,EAAE;MAAEC,eAAe,EAAEhB,MAAM,CAACyB,SAAS;MAAEP,WAAW,EAAE,CAAC;MAAEC,WAAW,EAAEnB,MAAM,CAACoB;IAAU,CAAC;IAC5FC,KAAK,EAAE;MAAEC,KAAK,EAAEtB,MAAM,CAAC6B;IAAU,CAAC;IAClCN,OAAO,EAAE;EACX;AACF,CAAC;AAED,OAAO,MAAMO,SAAS,GAAGA,CAAC;EAAET,KAAK;EAAEU;AAAuB,CAAC,KAAK;EAC9D,MAAM;IAAEhB,MAAM;IAAEM,KAAK,EAAEW,UAAU;IAAET;EAAQ,CAAC,GAAGV,aAAa,CAACkB,MAAM,CAAC;EAEpE,oBACEnB,KAAA,CAACL,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,gBAC5B1B,IAAA,CAACH,IAAI;MAAC0B,KAAK,EAAE,CAACC,MAAM,CAACnB,MAAM,EAAEA,MAAM,CAAE;MAAAqB,QAAA,EAClCb,OAAO,iBAAIb,IAAA,CAACT,WAAW;QAACqB,KAAK,EAAEtB,MAAM,CAACqC;MAAU,CAAE;IAAC,CAChD,CAAC,eACP3B,IAAA,CAACN,UAAU;MAACkC,OAAO,EAAEpC,eAAe,CAACqC,EAAG;MAACN,KAAK,EAAED,UAAW;MAAAI,QAAA,EACxDf;IAAK,CACI,CAAC;EAAA,CACT,CAAC;AAEX,CAAC;AAED,MAAMa,MAAM,GAAG5B,UAAU,CAACkC,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAEvC,OAAO,CAAC,GAAG;EAClB,CAAC;EACDY,MAAM,EAAE;IACN4B,KAAK,EAAExC,OAAO,CAAC,GAAG,CAAC;IACnByC,MAAM,EAAEzC,OAAO,CAAC,GAAG,CAAC;IACpB0C,YAAY,EAAE9C,aAAa,CAAC,GAAG,CAAC;IAChC0C,UAAU,EAAE,QAAQ;IACpBK,cAAc,EAAE;EAClB;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/day-streak-counter/DayStreakCounter.js

@@ -0,0 +1,56 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { BORDER_RADIUS, COLORS, FONT_FAMILY, SHADOWS, SPACING, Typography } from '@magmamath/react-native-ui';
+import { StreakDay } from "./DayStreak.js";
+import { useText } from "../../../../i18n/i18n.js";
+import { useFluency } from "../../context/FluencyContext.js";
+import { useStoreMap } from 'effector-react';
+import { StreakStatus } from "../../shared/fluency.constants.js";
+import { generateStreakDates } from "../../shared/fluency.helpers.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const DAY_LABEL_KEYS = ['student.fluency.dayMonday', 'student.fluency.dayTuesday', 'student.fluency.dayWednesday', 'student.fluency.dayThursday', 'student.fluency.dayFriday'];
+export const DayStreakCounter = () => {
+  const t = useText();
+  const {
+    model
+  } = useFluency();
+  const statuses = useStoreMap(model.streak.$stats, stats => stats ? generateStreakDates(stats) : []);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(Typography, {
+      style: styles.label,
+      children: t('student.fluency.practiceThisWeek')
+    }), /*#__PURE__*/_jsx(View, {
+      style: styles.streakDays,
+      children: DAY_LABEL_KEYS.map((key, i) => /*#__PURE__*/_jsx(StreakDay, {
+        label: t(key),
+        status: statuses[i] ?? StreakStatus.MISSED
+      }, key))
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    width: 230,
+    height: 110,
+    paddingVertical: SPACING[200],
+    paddingHorizontal: SPACING[400],
+    borderRadius: BORDER_RADIUS[300],
+    backgroundColor: COLORS.NEUTRAL_1,
+    ...SHADOWS[1]
+  },
+  label: {
+    fontSize: 12,
+    fontWeight: '700',
+    fontFamily: FONT_FAMILY.buenosAires,
+    color: COLORS.NEUTRAL_8
+  },
+  streakDays: {
+    flexDirection: 'row',
+    marginTop: 10,
+    gap: SPACING[200]
+  }
+});
+//# sourceMappingURL=DayStreakCounter.js.map

package/dist/module/features/fluency/components/day-streak-counter/DayStreakCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","BORDER_RADIUS","COLORS","FONT_FAMILY","SHADOWS","SPACING","Typography","StreakDay","useText","useFluency","useStoreMap","StreakStatus","generateStreakDates","jsx","_jsx","jsxs","_jsxs","DAY_LABEL_KEYS","DayStreakCounter","t","model","statuses","streak","$stats","stats","style","styles","container","children","label","streakDays","map","key","i","status","MISSED","create","width","height","paddingVertical","paddingHorizontal","borderRadius","backgroundColor","NEUTRAL_1","fontSize","fontWeight","fontFamily","buenosAires","color","NEUTRAL_8","flexDirection","marginTop","gap"],"sourceRoot":"../../../../../../src","sources":["features/fluency/components/day-streak-counter/DayStreakCounter.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SACEC,aAAa,EACbC,MAAM,EACNC,WAAW,EACXC,OAAO,EACPC,OAAO,EACPC,UAAU,QACL,4BAA4B;AACnC,SAASC,SAAS,QAAQ,gBAAa;AACvC,SAAyBC,OAAO,QAAQ,0BAAuB;AAC/D,SAASC,UAAU,QAAQ,iCAA8B;AACzD,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,SAASC,YAAY,QAAQ,mCAAgC;AAC7D,SAASC,mBAAmB,QAAQ,iCAA8B;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAElE,MAAMC,cAAgC,GAAG,CACvC,2BAA2B,EAC3B,4BAA4B,EAC5B,8BAA8B,EAC9B,6BAA6B,EAC7B,2BAA2B,CACnB;AAEV,OAAO,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;EACpC,MAAMC,CAAC,GAAGX,OAAO,CAAC,CAAC;EACnB,MAAM;IAAEY;EAAM,CAAC,GAAGX,UAAU,CAAC,CAAC;EAC9B,MAAMY,QAAQ,GAAGX,WAAW,CAACU,KAAK,CAACE,MAAM,CAACC,MAAM,EAAGC,KAAK,IACtDA,KAAK,GAAGZ,mBAAmB,CAACY,KAAK,CAAC,GAAG,EACvC,CAAC;EAED,oBACER,KAAA,CAACjB,IAAI;IAAC0B,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,gBAC5Bd,IAAA,CAACR,UAAU;MAACmB,KAAK,EAAEC,MAAM,CAACG,KAAM;MAAAD,QAAA,EAAET,CAAC,CAAC,kCAAkC;IAAC,CAAa,CAAC,eAErFL,IAAA,CAACf,IAAI;MAAC0B,KAAK,EAAEC,MAAM,CAACI,UAAW;MAAAF,QAAA,EAC5BX,cAAc,CAACc,GAAG,CAAC,CAACC,GAAG,EAAEC,CAAC,kBACzBnB,IAAA,CAACP,SAAS;QAAWsB,KAAK,EAAEV,CAAC,CAACa,GAAG,CAAE;QAACE,MAAM,EAAEb,QAAQ,CAACY,CAAC,CAAC,IAAItB,YAAY,CAACwB;MAAO,GAA/DH,GAAiE,CAClF;IAAC,CACE,CAAC;EAAA,CACH,CAAC;AAEX,CAAC;AAED,MAAMN,MAAM,GAAG1B,UAAU,CAACoC,MAAM,CAAC;EAC/BT,SAAS,EAAE;IACTU,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXC,eAAe,EAAElC,OAAO,CAAC,GAAG,CAAC;IAC7BmC,iBAAiB,EAAEnC,OAAO,CAAC,GAAG,CAAC;IAC/BoC,YAAY,EAAExC,aAAa,CAAC,GAAG,CAAC;IAChCyC,eAAe,EAAExC,MAAM,CAACyC,SAAS;IACjC,GAAGvC,OAAO,CAAC,CAAC;EACd,CAAC;EACDyB,KAAK,EAAE;IACLe,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE3C,WAAW,CAAC4C,WAAW;IACnCC,KAAK,EAAE9C,MAAM,CAAC+C;EAChB,CAAC;EACDnB,UAAU,EAAE;IACVoB,aAAa,EAAE,KAAK;IACpBC,SAAS,EAAE,EAAE;IACbC,GAAG,EAAE/C,OAAO,CAAC,GAAG;EAClB;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/fluency-solving/components/EquationContent.js

@@ -0,0 +1,141 @@
+"use strict";
+
+import React, { useRef } from 'react';
+import { View, StyleSheet, TextInput, Platform } from 'react-native';
+import { COLORS, FONT_FAMILY, HeadingVariants, SPACING, Typography } from '@magmamath/react-native-ui';
+import { useText } from "../../../../../i18n/i18n.js";
+import { useFluencySolvingPreset } from "../../../hooks/useFluencySolvingPreset.js";
+import { usePreventWebKeys } from "../../../hooks/usePreventWebKeys.js";
+import { AttemptStatus, MAX_INPUT_LENGTH } from "../../../shared/fluency.constants.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const CURSOR_MOVE_KEYS = ['ArrowLeft', 'ArrowRight', 'Home', 'End'];
+const STATUS_LABELS = {
+  [AttemptStatus.CORRECT]: 'student.fluency.correct',
+  [AttemptStatus.INCORRECT]: 'student.fluency.incorrect',
+  [AttemptStatus.SKIPPED]: 'student.fluency.skipped'
+};
+const STATUS_COLOR = {
+  [AttemptStatus.CORRECT]: COLORS.PRIMARY_GREEN,
+  [AttemptStatus.INCORRECT]: COLORS.PRIMARY_RED,
+  [AttemptStatus.SKIPPED]: COLORS.NEUTRAL_7
+};
+export const EquationContent = ({
+  leftOperand,
+  rightOperand,
+  mode,
+  value = '',
+  readOnly = false,
+  status,
+  correctAnswer,
+  onChange
+}) => {
+  const t = useText();
+  const modePreset = useFluencySolvingPreset({
+    mode
+  });
+  const labelColor = status ? STATUS_COLOR[status] : COLORS.NEUTRAL_7;
+  const labelText = status ? t(STATUS_LABELS[status], {
+    answer: correctAnswer
+  }) : t('student.fluency.typeYourAnswer');
+  const answerAreaColor = status === AttemptStatus.INCORRECT ? COLORS.PRIMARY_RED : modePreset.colors.accent;
+  const inputRef = useRef(null);
+  usePreventWebKeys({
+    ref: inputRef,
+    keys: CURSOR_MOVE_KEYS,
+    enabled: !readOnly
+  });
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Typography, {
+      variant: HeadingVariants.H9,
+      style: [styles.cardLabel, {
+        color: labelColor
+      }],
+      children: labelText
+    }), /*#__PURE__*/_jsxs(View, {
+      style: styles.equationRow,
+      children: [/*#__PURE__*/_jsx(Typography, {
+        style: styles.number,
+        children: leftOperand
+      }), /*#__PURE__*/_jsx(Typography, {
+        style: [styles.number, {
+          color: modePreset.colors.accent
+        }],
+        children: modePreset.symbol
+      }), /*#__PURE__*/_jsx(Typography, {
+        style: styles.number,
+        children: rightOperand
+      }), /*#__PURE__*/_jsx(Typography, {
+        style: styles.equals,
+        children: "="
+      }), /*#__PURE__*/_jsx(View, {
+        style: [styles.answerBox, value.length > 0 && {
+          borderBottomColor: answerAreaColor
+        }],
+        children: /*#__PURE__*/_jsx(TextInput, {
+          ref: readOnly ? undefined : inputRef,
+          value: value,
+          onChangeText: readOnly ? undefined : onChange,
+          editable: !readOnly,
+          keyboardType: "number-pad",
+          maxLength: MAX_INPUT_LENGTH,
+          selection: readOnly ? undefined : {
+            start: value.length,
+            end: value.length
+          },
+          style: [styles.number, styles.answerInput, {
+            color: answerAreaColor
+          }],
+          autoFocus: false
+        })
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  cardLabel: {
+    fontSize: 11,
+    fontWeight: '700',
+    letterSpacing: 1.3,
+    marginBottom: SPACING[500],
+    color: COLORS.NEUTRAL_7
+  },
+  equationRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: SPACING[300],
+    marginTop: SPACING[600]
+  },
+  number: {
+    fontSize: 75,
+    color: COLORS.NEUTRAL_10,
+    fontWeight: '700',
+    fontFamily: FONT_FAMILY.buenosAires
+  },
+  equals: {
+    fontSize: 75,
+    color: COLORS.NEUTRAL_7,
+    fontWeight: '700',
+    fontFamily: FONT_FAMILY.buenosAires
+  },
+  answerBox: {
+    width: 135,
+    height: 44,
+    marginBottom: -SPACING[800],
+    alignItems: 'center',
+    borderBottomWidth: 8,
+    borderBottomColor: COLORS.NEUTRAL_10
+  },
+  answerInput: {
+    position: 'absolute',
+    bottom: -SPACING[400],
+    textAlign: 'center',
+    width: '100%',
+    borderWidth: 0,
+    backgroundColor: 'transparent',
+    ...(Platform.OS === 'web' && {
+      outlineStyle: 'none',
+      caretColor: 'transparent'
+    })
+  }
+});
+//# sourceMappingURL=EquationContent.js.map

package/dist/module/features/fluency/components/fluency-solving/components/EquationContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useRef","View","StyleSheet","TextInput","Platform","COLORS","FONT_FAMILY","HeadingVariants","SPACING","Typography","useText","useFluencySolvingPreset","usePreventWebKeys","AttemptStatus","MAX_INPUT_LENGTH","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","CURSOR_MOVE_KEYS","STATUS_LABELS","CORRECT","INCORRECT","SKIPPED","STATUS_COLOR","PRIMARY_GREEN","PRIMARY_RED","NEUTRAL_7","EquationContent","leftOperand","rightOperand","mode","value","readOnly","status","correctAnswer","onChange","t","modePreset","labelColor","labelText","answer","answerAreaColor","colors","accent","inputRef","ref","keys","enabled","children","variant","H9","style","styles","cardLabel","color","equationRow","number","symbol","equals","answerBox","length","borderBottomColor","undefined","onChangeText","editable","keyboardType","maxLength","selection","start","end","answerInput","autoFocus","create","fontSize","fontWeight","letterSpacing","marginBottom","flexDirection","alignItems","gap","marginTop","NEUTRAL_10","fontFamily","buenosAires","width","height","borderBottomWidth","position","bottom","textAlign","borderWidth","backgroundColor","OS","outlineStyle","caretColor"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/EquationContent.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/features/fluency/components/fluency-solving/components/FluencyCardDeck.js

@@ -0,0 +1,107 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import Animated from 'react-native-reanimated';
+import { BORDER_RADIUS, COLORS, SHADOWS } from '@magmamath/react-native-ui';
+import { GradientView } from "../../../../../lib/components/GradientView.js";
+import { FluencyEquationCard } from "./FluencyEquationCard.js";
+import { AttemptStatus } from "../../../shared/fluency.constants.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const CARD_GRADIENT_COLORS = {
+  [AttemptStatus.CORRECT]: ['#ecfbf3', '#ffffff'],
+  [AttemptStatus.INCORRECT]: ['#fff0f1', '#ffffff']
+};
+const hideAnswer = cardContent => ({
+  ...cardContent,
+  answer: ''
+});
+export const FluencyCardDeck = ({
+  currentCardContent,
+  exitingCardContent,
+  exitingCardStatus,
+  snapStyles,
+  onAnswerChange
+}) => {
+  const backingCardContent = hideAnswer(currentCardContent);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.stack,
+    children: [/*#__PURE__*/_jsx(Animated.View, {
+      style: [styles.card, styles.cardFar, snapStyles.far]
+    }), /*#__PURE__*/_jsx(Animated.View, {
+      style: [styles.card, styles.cardMid, snapStyles.mid]
+    }), /*#__PURE__*/_jsx(Animated.View, {
+      style: [styles.card, styles.cardNear, snapStyles.near],
+      children: /*#__PURE__*/_jsx(FluencyEquationCard, {
+        cardContent: backingCardContent,
+        readOnly: true
+      })
+    }), !exitingCardContent && /*#__PURE__*/_jsx(Animated.View, {
+      style: [styles.card, styles.cardFront],
+      children: /*#__PURE__*/_jsx(FluencyEquationCard, {
+        cardContent: currentCardContent,
+        onAnswerChange: onAnswerChange
+      })
+    }), exitingCardContent && /*#__PURE__*/_jsxs(Animated.View, {
+      style: [styles.card, styles.cardFront, snapStyles.front, exitingCardStatus === AttemptStatus.INCORRECT && styles.cardIncorrect, exitingCardStatus === AttemptStatus.CORRECT && styles.cardCorrect],
+      children: [(exitingCardStatus === AttemptStatus.CORRECT || exitingCardStatus === AttemptStatus.INCORRECT) && /*#__PURE__*/_jsx(GradientView, {
+        colors: CARD_GRADIENT_COLORS[exitingCardStatus],
+        style: [StyleSheet.absoluteFill, {
+          borderRadius: BORDER_RADIUS[400]
+        }],
+        pointerEvents: "none"
+      }), /*#__PURE__*/_jsx(FluencyEquationCard, {
+        cardContent: exitingCardContent,
+        status: exitingCardStatus ?? undefined,
+        readOnly: true
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  stack: {
+    width: '100%',
+    maxWidth: 560
+  },
+  card: {
+    height: 260,
+    borderRadius: BORDER_RADIUS[400],
+    backgroundColor: COLORS.NEUTRAL_1,
+    ...SHADOWS[5]
+  },
+  cardFar: {
+    position: 'absolute',
+    top: 36,
+    left: 60,
+    right: 60,
+    opacity: 0
+  },
+  cardMid: {
+    position: 'absolute',
+    top: 24,
+    left: 40,
+    right: 40
+  },
+  cardNear: {
+    position: 'absolute',
+    top: 12,
+    left: 20,
+    right: 20,
+    alignItems: 'center',
+    justifyContent: 'center',
+    ...SHADOWS[5]
+  },
+  cardFront: {
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  cardCorrect: {
+    borderWidth: 1.5,
+    borderColor: COLORS.PRIMARY_GREEN
+  },
+  cardIncorrect: {
+    borderWidth: 1.5,
+    borderColor: COLORS.PRIMARY_RED
+  }
+});
+//# sourceMappingURL=FluencyCardDeck.js.map