@magmamath/students-features 1.5.0 → 1.5.1

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","Animated","BORDER_RADIUS","COLORS","SHADOWS","GradientView","FluencyEquationCard","AttemptStatus","jsx","_jsx","jsxs","_jsxs","CARD_GRADIENT_COLORS","CORRECT","INCORRECT","hideAnswer","cardContent","answer","FluencyCardDeck","currentCardContent","exitingCardContent","exitingCardStatus","snapStyles","onAnswerChange","backingCardContent","style","styles","stack","children","card","cardFar","far","cardMid","mid","cardNear","near","readOnly","cardFront","front","cardIncorrect","cardCorrect","colors","absoluteFill","borderRadius","pointerEvents","status","undefined","create","width","maxWidth","height","backgroundColor","NEUTRAL_1","position","top","left","right","opacity","alignItems","justifyContent","borderWidth","borderColor","PRIMARY_GREEN","PRIMARY_RED"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencyCardDeck.tsx"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,33 @@
+"use strict";
+
+import React from 'react';
+import { EquationContent } from "./EquationContent.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const getDisplayedEquation = fact => {
+  const left = fact?.numbers[0] ?? 0;
+  const right = fact?.numbers[1] ?? 0;
+  return {
+    leftOperand: left,
+    rightOperand: right,
+    mode: fact?.mode
+  };
+};
+export const FluencyEquationCard = ({
+  cardContent,
+  readOnly = false,
+  status,
+  onAnswerChange
+}) => {
+  const equation = getDisplayedEquation(cardContent.fact);
+  return /*#__PURE__*/_jsx(EquationContent, {
+    leftOperand: equation.leftOperand,
+    rightOperand: equation.rightOperand,
+    mode: equation.mode,
+    value: cardContent.answer,
+    readOnly: readOnly,
+    status: status,
+    correctAnswer: cardContent.fact?.answer,
+    onChange: onAnswerChange
+  });
+};
+//# sourceMappingURL=FluencyEquationCard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","EquationContent","jsx","_jsx","getDisplayedEquation","fact","left","numbers","right","leftOperand","rightOperand","mode","FluencyEquationCard","cardContent","readOnly","status","onAnswerChange","equation","value","answer","correctAnswer","onChange"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencyEquationCard.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,eAAe,QAAQ,sBAAmB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiBnD,MAAMC,oBAAoB,GAAIC,IAAwB,IAAwB;EAC5E,MAAMC,IAAI,GAAGD,IAAI,EAAEE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC;EAClC,MAAMC,KAAK,GAAGH,IAAI,EAAEE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC;EAEnC,OAAO;IACLE,WAAW,EAAEH,IAAI;IACjBI,YAAY,EAAEF,KAAK;IACnBG,IAAI,EAAEN,IAAI,EAAEM;EACd,CAAC;AACH,CAAC;AAED,OAAO,MAAMC,mBAAmB,GAAGA,CAAC;EAClCC,WAAW;EACXC,QAAQ,GAAG,KAAK;EAChBC,MAAM;EACNC;AACwB,CAAC,KAAK;EAC9B,MAAMC,QAAQ,GAAGb,oBAAoB,CAACS,WAAW,CAACR,IAAI,CAAC;EAEvD,oBACEF,IAAA,CAACF,eAAe;IACdQ,WAAW,EAAEQ,QAAQ,CAACR,WAAY;IAClCC,YAAY,EAAEO,QAAQ,CAACP,YAAa;IACpCC,IAAI,EAAEM,QAAQ,CAACN,IAAK;IACpBO,KAAK,EAAEL,WAAW,CAACM,MAAO;IAC1BL,QAAQ,EAAEA,QAAS;IACnBC,MAAM,EAAEA,MAAO;IACfK,aAAa,EAAEP,WAAW,CAACR,IAAI,EAAEc,MAAO;IACxCE,QAAQ,EAAEL;EAAe,CAC1B,CAAC;AAEN,CAAC","ignoreList":[]}

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

@@ -0,0 +1,56 @@
+"use strict";
+
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { FONT_FAMILY, SelectGroup, SelectOptionColor, SelectOptionSize, SPACING } from '@magmamath/react-native-ui';
+import { useFluencyNumpad } from "../../../hooks/useFluencyNumpad.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const FluencyNumpad = ({
+  onSubmit
+}) => {
+  const {
+    options
+  } = useFluencyNumpad({
+    onSubmit
+  });
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.container,
+    children: /*#__PURE__*/_jsx(SelectGroup, {
+      numOfRows: 4,
+      color: SelectOptionColor.GREY,
+      size: SelectOptionSize.SMALL,
+      options: options,
+      style: {
+        container: styles.grid,
+        row: styles.row,
+        option: {
+          button: styles.optionButton,
+          text: styles.optionText
+        }
+      }
+    })
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    paddingVertical: SPACING[400],
+    marginTop: SPACING[200]
+  },
+  grid: {
+    width: 360,
+    gap: SPACING[200]
+  },
+  row: {
+    gap: SPACING[200]
+  },
+  optionButton: {
+    height: 60
+  },
+  optionText: {
+    fontSize: 24,
+    fontWeight: '700',
+    fontFamily: FONT_FAMILY.buenosAires
+  }
+});
+//# sourceMappingURL=FluencyNumpad.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","StyleSheet","View","FONT_FAMILY","SelectGroup","SelectOptionColor","SelectOptionSize","SPACING","useFluencyNumpad","jsx","_jsx","FluencyNumpad","onSubmit","options","style","styles","container","children","numOfRows","color","GREY","size","SMALL","grid","row","option","button","optionButton","text","optionText","create","alignItems","paddingVertical","marginTop","width","gap","height","fontSize","fontWeight","fontFamily","buenosAires"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencyNumpad.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,SAASC,WAAW,EAAEC,WAAW,EAAEC,iBAAiB,EAAEC,gBAAgB,EAAEC,OAAO,QAAQ,4BAA4B;AACnH,SAASC,gBAAgB,QAAQ,oCAAiC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAMlE,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAAEC;AAA6B,CAAC,KAAK;EACjE,MAAM;IAAEC;EAAQ,CAAC,GAAGL,gBAAgB,CAAC;IAAEI;EAAS,CAAC,CAAC;EAElD,oBACEF,IAAA,CAACR,IAAI;IAACY,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,eAC5BP,IAAA,CAACN,WAAW;MACVc,SAAS,EAAE,CAAE;MACbC,KAAK,EAAEd,iBAAiB,CAACe,IAAK;MAC9BC,IAAI,EAAEf,gBAAgB,CAACgB,KAAM;MAC7BT,OAAO,EAAEA,OAAQ;MACjBC,KAAK,EAAE;QACLE,SAAS,EAAED,MAAM,CAACQ,IAAI;QACtBC,GAAG,EAAET,MAAM,CAACS,GAAG;QACfC,MAAM,EAAE;UACNC,MAAM,EAAEX,MAAM,CAACY,YAAY;UAC3BC,IAAI,EAAEb,MAAM,CAACc;QACf;MACF;IAAE,CACH;EAAC,CACE,CAAC;AAEX,CAAC;AAED,MAAMd,MAAM,GAAGd,UAAU,CAAC6B,MAAM,CAAC;EAC/Bd,SAAS,EAAE;IACTe,UAAU,EAAE,QAAQ;IACpBC,eAAe,EAAEzB,OAAO,CAAC,GAAG,CAAC;IAC7B0B,SAAS,EAAE1B,OAAO,CAAC,GAAG;EACxB,CAAC;EACDgB,IAAI,EAAE;IACJW,KAAK,EAAE,GAAG;IACVC,GAAG,EAAE5B,OAAO,CAAC,GAAG;EAClB,CAAC;EACDiB,GAAG,EAAE;IACHW,GAAG,EAAE5B,OAAO,CAAC,GAAG;EAClB,CAAC;EACDoB,YAAY,EAAE;IACZS,MAAM,EAAE;EACV,CAAC;EACDP,UAAU,EAAE;IACVQ,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAEpC,WAAW,CAACqC;EAC1B;AACF,CAAC,CAAC","ignoreList":[]}

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

@@ -0,0 +1,74 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { useUnit } from 'effector-react/effector-react.mjs';
+import { SPACING } from '@magmamath/react-native-ui';
+import { FluencyNumpad } from "./FluencyNumpad.js";
+import { FluencyCardDeck } from "./FluencyCardDeck.js";
+import { useFluency } from "../../../context/FluencyContext.js";
+import { useFluencyCardDeckAnimation } from "../../../hooks/useFluencyCardDeckAnimation.js";
+import { useSuccessSound } from "../../../hooks/useSuccessSound.js";
+import { AttemptStatus } from "../../../shared/fluency.constants.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const FluencySolvingCard = () => {
+  const {
+    model
+  } = useFluency();
+  const {
+    currentAnswer,
+    currentFact
+  } = useUnit({
+    currentAnswer: model.solving.$answer,
+    currentFact: model.solving.$current
+  });
+  const cardDeckAnimation = useFluencyCardDeckAnimation();
+  const successSound = useSuccessSound();
+  const currentCardContent = {
+    fact: currentFact,
+    answer: currentAnswer ?? ''
+  };
+  const updateAnswer = text => {
+    const digits = text.replace(/\D/g, '');
+    model.solving.setAnswer(digits || null);
+  };
+  const submit = () => {
+    if (!currentFact) return;
+    if (currentAnswer === null) return;
+    const isCorrect = Number(currentAnswer) === currentFact.answer;
+    const direction = isCorrect ? 'right' : 'left';
+    const status = isCorrect ? AttemptStatus.CORRECT : AttemptStatus.INCORRECT;
+    if (!cardDeckAnimation.startCardExit({
+      cardContent: currentCardContent,
+      direction,
+      status
+    })) return;
+    if (isCorrect) {
+      successSound.play();
+    }
+    model.solving.submit();
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.wrapper,
+      children: /*#__PURE__*/_jsx(FluencyCardDeck, {
+        currentCardContent: currentCardContent,
+        exitingCardContent: cardDeckAnimation.exitingCardContent,
+        exitingCardStatus: cardDeckAnimation.exitingCardStatus,
+        snapStyles: cardDeckAnimation.snapStyles,
+        onAnswerChange: updateAnswer
+      })
+    }), /*#__PURE__*/_jsx(FluencyNumpad, {
+      onSubmit: submit
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  wrapper: {
+    alignItems: 'center',
+    paddingVertical: SPACING[400],
+    paddingHorizontal: SPACING[600],
+    marginTop: SPACING[300]
+  }
+});
+//# sourceMappingURL=FluencySolvingCard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","useUnit","SPACING","FluencyNumpad","FluencyCardDeck","useFluency","useFluencyCardDeckAnimation","useSuccessSound","AttemptStatus","jsx","_jsx","jsxs","_jsxs","FluencySolvingCard","model","currentAnswer","currentFact","solving","$answer","$current","cardDeckAnimation","successSound","currentCardContent","fact","answer","updateAnswer","text","digits","replace","setAnswer","submit","isCorrect","Number","direction","status","CORRECT","INCORRECT","startCardExit","cardContent","play","children","style","styles","wrapper","exitingCardContent","exitingCardStatus","snapStyles","onAnswerChange","onSubmit","create","alignItems","paddingVertical","paddingHorizontal","marginTop"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencySolvingCard.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SAASC,OAAO,QAAQ,mCAAmC;AAC3D,SAASC,OAAO,QAAQ,4BAA4B;AAEpD,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,eAAe,QAAQ,sBAAmB;AACnD,SAASC,UAAU,QAAQ,oCAAiC;AAC5D,SAASC,2BAA2B,QAAQ,+CAA4C;AACxF,SAASC,eAAe,QAAQ,mCAAgC;AAChE,SAASC,aAAa,QAAQ,sCAAmC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGjE,OAAO,MAAMC,kBAAkB,GAAGA,CAAA,KAAM;EACtC,MAAM;IAAEC;EAAM,CAAC,GAAGT,UAAU,CAAC,CAAC;EAC9B,MAAM;IAAEU,aAAa;IAAEC;EAAY,CAAC,GAAGf,OAAO,CAAC;IAC7Cc,aAAa,EAAED,KAAK,CAACG,OAAO,CAACC,OAAO;IACpCF,WAAW,EAAEF,KAAK,CAACG,OAAO,CAACE;EAC7B,CAAC,CAAC;EACF,MAAMC,iBAAiB,GAAGd,2BAA2B,CAAC,CAAC;EACvD,MAAMe,YAAY,GAAGd,eAAe,CAAC,CAAC;EAEtC,MAAMe,kBAAkB,GAAG;IAAEC,IAAI,EAAEP,WAAW;IAAEQ,MAAM,EAAET,aAAa,IAAI;EAAG,CAAC;EAE7E,MAAMU,YAAY,GAAIC,IAAY,IAAK;IACrC,MAAMC,MAAM,GAAGD,IAAI,CAACE,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;IACtCd,KAAK,CAACG,OAAO,CAACY,SAAS,CAACF,MAAM,IAAI,IAAI,CAAC;EACzC,CAAC;EAED,MAAMG,MAAM,GAAGA,CAAA,KAAM;IACnB,IAAI,CAACd,WAAW,EAAE;IAClB,IAAID,aAAa,KAAK,IAAI,EAAE;IAE5B,MAAMgB,SAAS,GAAGC,MAAM,CAACjB,aAAa,CAAC,KAAKC,WAAW,CAACQ,MAAM;IAC9D,MAAMS,SAAwB,GAAGF,SAAS,GAAG,OAAO,GAAG,MAAM;IAC7D,MAAMG,MAAM,GAAGH,SAAS,GAAGvB,aAAa,CAAC2B,OAAO,GAAG3B,aAAa,CAAC4B,SAAS;IAE1E,IAAI,CAAChB,iBAAiB,CAACiB,aAAa,CAAC;MAAEC,WAAW,EAAEhB,kBAAkB;MAAEW,SAAS;MAAEC;IAAO,CAAC,CAAC,EAC1F;IAEF,IAAIH,SAAS,EAAE;MACbV,YAAY,CAACkB,IAAI,CAAC,CAAC;IACrB;IAEAzB,KAAK,CAACG,OAAO,CAACa,MAAM,CAAC,CAAC;EACxB,CAAC;EAED,oBACElB,KAAA,CAACb,IAAI;IAAAyC,QAAA,gBACH9B,IAAA,CAACX,IAAI;MAAC0C,KAAK,EAAEC,MAAM,CAACC,OAAQ;MAAAH,QAAA,eAC1B9B,IAAA,CAACN,eAAe;QACdkB,kBAAkB,EAAEA,kBAAmB;QACvCsB,kBAAkB,EAAExB,iBAAiB,CAACwB,kBAAmB;QACzDC,iBAAiB,EAAEzB,iBAAiB,CAACyB,iBAAkB;QACvDC,UAAU,EAAE1B,iBAAiB,CAAC0B,UAAW;QACzCC,cAAc,EAAEtB;MAAa,CAC9B;IAAC,CACE,CAAC,eACPf,IAAA,CAACP,aAAa;MAAC6C,QAAQ,EAAElB;IAAO,CAAE,CAAC;EAAA,CAC/B,CAAC;AAEX,CAAC;AAED,MAAMY,MAAM,GAAG1C,UAAU,CAACiD,MAAM,CAAC;EAC/BN,OAAO,EAAE;IACPO,UAAU,EAAE,QAAQ;IACpBC,eAAe,EAAEjD,OAAO,CAAC,GAAG,CAAC;IAC7BkD,iBAAiB,EAAElD,OAAO,CAAC,GAAG,CAAC;IAC/BmD,SAAS,EAAEnD,OAAO,CAAC,GAAG;EACxB;AACF,CAAC,CAAC","ignoreList":[]}

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

@@ -0,0 +1,67 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { BORDER_RADIUS, Button, ButtonColor, ButtonSize, ButtonVariant, COLORS, HeadingVariants, SHADOWS, SPACING, Typography } from '@magmamath/react-native-ui';
+import { useFluencySolvingPreset } from "../../../hooks/useFluencySolvingPreset.js";
+import { XCloseIcon } from "../../../../../shared/icons/XCloseIcon.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const FluencySolvingHeader = ({
+  onClosePress
+}) => {
+  const modePreset = useFluencySolvingPreset();
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(Button, {
+      variant: ButtonVariant.SECONDARY,
+      size: ButtonSize.LARGE,
+      colorScheme: ButtonColor.WHITE,
+      icon: /*#__PURE__*/_jsx(XCloseIcon, {}),
+      onPress: onClosePress
+    }), /*#__PURE__*/_jsx(View, {
+      style: [styles.operatorBadge, {
+        backgroundColor: modePreset.colors.accent
+      }],
+      children: /*#__PURE__*/_jsx(Typography, {
+        variant: HeadingVariants.H7,
+        style: styles.symbol,
+        children: modePreset.symbol
+      })
+    }), /*#__PURE__*/_jsx(Typography, {
+      variant: HeadingVariants.H4,
+      style: styles.title,
+      children: modePreset.label
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    height: 76,
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 14,
+    paddingVertical: SPACING[400],
+    paddingHorizontal: SPACING[600],
+    backgroundColor: COLORS.NEUTRAL_1,
+    ...SHADOWS[1]
+  },
+  operatorBadge: {
+    width: 32,
+    height: 32,
+    borderRadius: BORDER_RADIUS[200],
+    alignItems: 'center',
+    justifyContent: 'center',
+    ...SHADOWS[1]
+  },
+  title: {
+    color: COLORS.NEUTRAL_10,
+    fontWeight: '700'
+  },
+  symbol: {
+    fontSize: 32,
+    fontWeight: '100',
+    marginBottom: 2,
+    color: COLORS.NEUTRAL_1
+  }
+});
+//# sourceMappingURL=FluencySolvingHeader.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","BORDER_RADIUS","Button","ButtonColor","ButtonSize","ButtonVariant","COLORS","HeadingVariants","SHADOWS","SPACING","Typography","useFluencySolvingPreset","XCloseIcon","jsx","_jsx","jsxs","_jsxs","FluencySolvingHeader","onClosePress","modePreset","style","styles","container","children","variant","SECONDARY","size","LARGE","colorScheme","WHITE","icon","onPress","operatorBadge","backgroundColor","colors","accent","H7","symbol","H4","title","label","create","height","flexDirection","alignItems","gap","paddingVertical","paddingHorizontal","NEUTRAL_1","width","borderRadius","justifyContent","color","NEUTRAL_10","fontWeight","fontSize","marginBottom"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencySolvingHeader.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SACEC,aAAa,EACbC,MAAM,EACNC,WAAW,EACXC,UAAU,EACVC,aAAa,EACbC,MAAM,EACNC,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,UAAU,QACL,4BAA4B;AACnC,SAASC,uBAAuB,QAAQ,2CAAwC;AAChF,SAASC,UAAU,QAAQ,2CAAwC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAMnE,OAAO,MAAMC,oBAAoB,GAAGA,CAAC;EAAEC;AAAwC,CAAC,KAAK;EACnF,MAAMC,UAAU,GAAGR,uBAAuB,CAAC,CAAC;EAE5C,oBACEK,KAAA,CAACjB,IAAI;IAACqB,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,gBAC5BT,IAAA,CAACZ,MAAM;MACLsB,OAAO,EAAEnB,aAAa,CAACoB,SAAU;MACjCC,IAAI,EAAEtB,UAAU,CAACuB,KAAM;MACvBC,WAAW,EAAEzB,WAAW,CAAC0B,KAAM;MAC/BC,IAAI,eAAEhB,IAAA,CAACF,UAAU,IAAE,CAAE;MACrBmB,OAAO,EAAEb;IAAa,CACvB,CAAC,eACFJ,IAAA,CAACf,IAAI;MAACqB,KAAK,EAAE,CAACC,MAAM,CAACW,aAAa,EAAE;QAAEC,eAAe,EAAEd,UAAU,CAACe,MAAM,CAACC;MAAO,CAAC,CAAE;MAAAZ,QAAA,eACjFT,IAAA,CAACJ,UAAU;QAACc,OAAO,EAAEjB,eAAe,CAAC6B,EAAG;QAAChB,KAAK,EAAEC,MAAM,CAACgB,MAAO;QAAAd,QAAA,EAC3DJ,UAAU,CAACkB;MAAM,CACR;IAAC,CACT,CAAC,eACPvB,IAAA,CAACJ,UAAU;MAACc,OAAO,EAAEjB,eAAe,CAAC+B,EAAG;MAAClB,KAAK,EAAEC,MAAM,CAACkB,KAAM;MAAAhB,QAAA,EAC1DJ,UAAU,CAACqB;IAAK,CACP,CAAC;EAAA,CACT,CAAC;AAEX,CAAC;AAED,MAAMnB,MAAM,GAAGrB,UAAU,CAACyC,MAAM,CAAC;EAC/BnB,SAAS,EAAE;IACToB,MAAM,EAAE,EAAE;IACVC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAE,EAAE;IACPC,eAAe,EAAErC,OAAO,CAAC,GAAG,CAAC;IAC7BsC,iBAAiB,EAAEtC,OAAO,CAAC,GAAG,CAAC;IAC/BwB,eAAe,EAAE3B,MAAM,CAAC0C,SAAS;IACjC,GAAGxC,OAAO,CAAC,CAAC;EACd,CAAC;EACDwB,aAAa,EAAE;IACbiB,KAAK,EAAE,EAAE;IACTP,MAAM,EAAE,EAAE;IACVQ,YAAY,EAAEjD,aAAa,CAAC,GAAG,CAAC;IAChC2C,UAAU,EAAE,QAAQ;IACpBO,cAAc,EAAE,QAAQ;IACxB,GAAG3C,OAAO,CAAC,CAAC;EACd,CAAC;EACD+B,KAAK,EAAE;IACLa,KAAK,EAAE9C,MAAM,CAAC+C,UAAU;IACxBC,UAAU,EAAE;EACd,CAAC;EACDjB,MAAM,EAAE;IACNkB,QAAQ,EAAE,EAAE;IACZD,UAAU,EAAE,KAAK;IACjBE,YAAY,EAAE,CAAC;IACfJ,KAAK,EAAE9C,MAAM,CAAC0C;EAChB;AACF,CAAC,CAAC","ignoreList":[]}

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

@@ -0,0 +1,87 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { COLORS, SPACING } from '@magmamath/react-native-ui';
+import { AttemptStatus, SESSION_LENGTH } from "../../../shared/fluency.constants.js";
+import { FluencySolvingProgressDot } from "./FluencySolvingProgressDot.js";
+import { useFluency } from "../../../context/FluencyContext.js";
+import { useUnit } from 'effector-react';
+import { jsx as _jsx } from "react/jsx-runtime";
+const GROUP_SIZE = 5;
+const ProgressDot = ({
+  index,
+  activeIndex,
+  outcome
+}) => {
+  if (index === activeIndex) return /*#__PURE__*/_jsx(FluencySolvingProgressDot, {});
+  if (index < activeIndex && outcome) return /*#__PURE__*/_jsx(View, {
+    style: DOT_STYLE_BY_OUTCOME[outcome.status]
+  });
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.dot
+  });
+};
+export const FluencySolvingProgress = () => {
+  const {
+    model
+  } = useFluency();
+  const outcomes = useUnit(model.solving.$outcomes);
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.container,
+    children: Array.from({
+      length: SESSION_LENGTH / GROUP_SIZE
+    }, (_, groupIndex) => /*#__PURE__*/_jsx(View, {
+      style: styles.group,
+      children: Array.from({
+        length: GROUP_SIZE
+      }, (_, dotIndex) => {
+        const index = groupIndex * GROUP_SIZE + dotIndex;
+        return /*#__PURE__*/_jsx(ProgressDot, {
+          index: index,
+          activeIndex: outcomes.length,
+          outcome: outcomes[index]
+        }, index);
+      })
+    }, groupIndex))
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    gap: SPACING[500],
+    paddingHorizontal: SPACING[600],
+    paddingVertical: 14,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  group: {
+    flexDirection: 'row',
+    gap: 8,
+    alignItems: 'center'
+  },
+  dot: {
+    width: 10,
+    height: 10,
+    borderRadius: 5,
+    backgroundColor: COLORS.NEUTRAL_4
+  },
+  dotCorrect: {
+    width: 10,
+    height: 10,
+    borderRadius: 5,
+    backgroundColor: COLORS.PRIMARY_GREEN
+  },
+  dotWrong: {
+    width: 10,
+    height: 10,
+    borderRadius: 5,
+    backgroundColor: COLORS.PRIMARY_RED
+  }
+});
+const DOT_STYLE_BY_OUTCOME = {
+  [AttemptStatus.CORRECT]: styles.dotCorrect,
+  [AttemptStatus.INCORRECT]: styles.dotWrong,
+  [AttemptStatus.SKIPPED]: styles.dot
+};
+//# sourceMappingURL=FluencySolvingProgress.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","COLORS","SPACING","AttemptStatus","SESSION_LENGTH","FluencySolvingProgressDot","useFluency","useUnit","jsx","_jsx","GROUP_SIZE","ProgressDot","index","activeIndex","outcome","style","DOT_STYLE_BY_OUTCOME","status","styles","dot","FluencySolvingProgress","model","outcomes","solving","$outcomes","container","children","Array","from","length","_","groupIndex","group","dotIndex","create","flexDirection","gap","paddingHorizontal","paddingVertical","justifyContent","alignItems","width","height","borderRadius","backgroundColor","NEUTRAL_4","dotCorrect","PRIMARY_GREEN","dotWrong","PRIMARY_RED","CORRECT","INCORRECT","SKIPPED"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencySolvingProgress.tsx"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,62 @@
+"use strict";
+
+import React, { useEffect } from 'react';
+import { View, StyleSheet } from 'react-native';
+import Animated, { cancelAnimation, Easing, interpolate, useAnimatedStyle, useSharedValue, withRepeat, withSequence, withTiming } from 'react-native-reanimated';
+import { COLORS } from '@magmamath/react-native-ui';
+import { jsx as _jsx } from "react/jsx-runtime";
+const DOT_SIZE = 16;
+const RING_SPREAD_MIN = 4;
+const RING_SPREAD_MAX = 8;
+const RING_SIZE = DOT_SIZE + RING_SPREAD_MAX * 2;
+const RING_SCALE_MIN = (DOT_SIZE + RING_SPREAD_MIN * 2) / RING_SIZE;
+const RING_OPACITY_MIN = 0.06;
+const RING_OPACITY_MAX = 0.12;
+const PULSE_DURATION_MS = 800;
+export const FluencySolvingProgressDot = () => {
+  const progress = useSharedValue(0);
+  useEffect(() => {
+    progress.value = withRepeat(withSequence(withTiming(1, {
+      duration: PULSE_DURATION_MS,
+      easing: Easing.inOut(Easing.ease)
+    }), withTiming(0, {
+      duration: PULSE_DURATION_MS,
+      easing: Easing.inOut(Easing.ease)
+    })), -1, false);
+    return () => cancelAnimation(progress);
+  }, [progress]);
+  const ringStyle = useAnimatedStyle(() => {
+    const scale = interpolate(progress.value, [0, 1], [RING_SCALE_MIN, 1]);
+    const opacity = interpolate(progress.value, [0, 1], [RING_OPACITY_MAX, RING_OPACITY_MIN]);
+    return {
+      opacity,
+      transform: [{
+        scale
+      }]
+    };
+  }, [progress]);
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.dot,
+    children: /*#__PURE__*/_jsx(Animated.View, {
+      style: [styles.ring, ringStyle]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  dot: {
+    width: DOT_SIZE,
+    height: DOT_SIZE,
+    borderRadius: DOT_SIZE / 2,
+    backgroundColor: COLORS.NEUTRAL_10
+  },
+  ring: {
+    position: 'absolute',
+    top: -RING_SPREAD_MAX,
+    left: -RING_SPREAD_MAX,
+    width: RING_SIZE,
+    height: RING_SIZE,
+    borderRadius: RING_SIZE / 2,
+    backgroundColor: COLORS.NEUTRAL_10
+  }
+});
+//# sourceMappingURL=FluencySolvingProgressDot.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","View","StyleSheet","Animated","cancelAnimation","Easing","interpolate","useAnimatedStyle","useSharedValue","withRepeat","withSequence","withTiming","COLORS","jsx","_jsx","DOT_SIZE","RING_SPREAD_MIN","RING_SPREAD_MAX","RING_SIZE","RING_SCALE_MIN","RING_OPACITY_MIN","RING_OPACITY_MAX","PULSE_DURATION_MS","FluencySolvingProgressDot","progress","value","duration","easing","inOut","ease","ringStyle","scale","opacity","transform","style","styles","dot","children","ring","create","width","height","borderRadius","backgroundColor","NEUTRAL_10","position","top","left"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/fluency-solving/components/FluencySolvingProgressDot.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,OAAOC,QAAQ,IACbC,eAAe,EACfC,MAAM,EACNC,WAAW,EACXC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,EACVC,YAAY,EACZC,UAAU,QACL,yBAAyB;AAChC,SAASC,MAAM,QAAQ,4BAA4B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAEnD,MAAMC,QAAQ,GAAG,EAAE;AACnB,MAAMC,eAAe,GAAG,CAAC;AACzB,MAAMC,eAAe,GAAG,CAAC;AACzB,MAAMC,SAAS,GAAGH,QAAQ,GAAGE,eAAe,GAAG,CAAC;AAChD,MAAME,cAAc,GAAG,CAACJ,QAAQ,GAAGC,eAAe,GAAG,CAAC,IAAIE,SAAS;AACnE,MAAME,gBAAgB,GAAG,IAAI;AAC7B,MAAMC,gBAAgB,GAAG,IAAI;AAC7B,MAAMC,iBAAiB,GAAG,GAAG;AAE7B,OAAO,MAAMC,yBAAyB,GAAGA,CAAA,KAAM;EAC7C,MAAMC,QAAQ,GAAGhB,cAAc,CAAC,CAAC,CAAC;EAElCR,SAAS,CAAC,MAAM;IACdwB,QAAQ,CAACC,KAAK,GAAGhB,UAAU,CACzBC,YAAY,CACVC,UAAU,CAAC,CAAC,EAAE;MAAEe,QAAQ,EAAEJ,iBAAiB;MAAEK,MAAM,EAAEtB,MAAM,CAACuB,KAAK,CAACvB,MAAM,CAACwB,IAAI;IAAE,CAAC,CAAC,EACjFlB,UAAU,CAAC,CAAC,EAAE;MAAEe,QAAQ,EAAEJ,iBAAiB;MAAEK,MAAM,EAAEtB,MAAM,CAACuB,KAAK,CAACvB,MAAM,CAACwB,IAAI;IAAE,CAAC,CAClF,CAAC,EACD,CAAC,CAAC,EACF,KACF,CAAC;IACD,OAAO,MAAMzB,eAAe,CAACoB,QAAQ,CAAC;EACxC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEd,MAAMM,SAAS,GAAGvB,gBAAgB,CAAC,MAAM;IACvC,MAAMwB,KAAK,GAAGzB,WAAW,CAACkB,QAAQ,CAACC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAACN,cAAc,EAAE,CAAC,CAAC,CAAC;IACtE,MAAMa,OAAO,GAAG1B,WAAW,CAACkB,QAAQ,CAACC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAACJ,gBAAgB,EAAED,gBAAgB,CAAC,CAAC;IACzF,OAAO;MACLY,OAAO;MACPC,SAAS,EAAE,CAAC;QAAEF;MAAM,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,CAACP,QAAQ,CAAC,CAAC;EAEd,oBACEV,IAAA,CAACb,IAAI;IAACiC,KAAK,EAAEC,MAAM,CAACC,GAAI;IAAAC,QAAA,eACtBvB,IAAA,CAACX,QAAQ,CAACF,IAAI;MAACiC,KAAK,EAAE,CAACC,MAAM,CAACG,IAAI,EAAER,SAAS;IAAE,CAAE;EAAC,CAC9C,CAAC;AAEX,CAAC;AAED,MAAMK,MAAM,GAAGjC,UAAU,CAACqC,MAAM,CAAC;EAC/BH,GAAG,EAAE;IACHI,KAAK,EAAEzB,QAAQ;IACf0B,MAAM,EAAE1B,QAAQ;IAChB2B,YAAY,EAAE3B,QAAQ,GAAG,CAAC;IAC1B4B,eAAe,EAAE/B,MAAM,CAACgC;EAC1B,CAAC;EACDN,IAAI,EAAE;IACJO,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC7B,eAAe;IACrB8B,IAAI,EAAE,CAAC9B,eAAe;IACtBuB,KAAK,EAAEtB,SAAS;IAChBuB,MAAM,EAAEvB,SAAS;IACjBwB,YAAY,EAAExB,SAAS,GAAG,CAAC;IAC3ByB,eAAe,EAAE/B,MAAM,CAACgC;EAC1B;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/matrix/FluencyMatrix.js

@@ -0,0 +1,29 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { BORDER_RADIUS, COLORS, SHADOWS, SPACING } from '@magmamath/react-native-ui';
+import { MatrixLegend } from "./components/MatrixLegend.js";
+import { MatrixFill } from "./components/MatrixFill.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const FluencyMatrix = () => /*#__PURE__*/_jsxs(View, {
+  style: styles.container,
+  children: [/*#__PURE__*/_jsx(View, {
+    style: styles.matrixFillContainer,
+    children: /*#__PURE__*/_jsx(MatrixFill, {})
+  }), /*#__PURE__*/_jsx(MatrixLegend, {})]
+});
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: COLORS.NEUTRAL_1,
+    borderRadius: BORDER_RADIUS[400],
+    overflow: 'hidden',
+    ...SHADOWS[1]
+  },
+  matrixFillContainer: {
+    flex: 1,
+    padding: SPACING[300]
+  }
+});
+//# sourceMappingURL=FluencyMatrix.js.map

package/dist/module/features/fluency/components/matrix/FluencyMatrix.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","BORDER_RADIUS","COLORS","SHADOWS","SPACING","MatrixLegend","MatrixFill","jsx","_jsx","jsxs","_jsxs","FluencyMatrix","style","styles","container","children","matrixFillContainer","create","flex","backgroundColor","NEUTRAL_1","borderRadius","overflow","padding"],"sourceRoot":"../../../../../../src","sources":["features/fluency/components/matrix/FluencyMatrix.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SAASC,aAAa,EAAEC,MAAM,EAAEC,OAAO,EAAEC,OAAO,QAAQ,4BAA4B;AACpF,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,UAAU,QAAQ,4BAAyB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEpD,OAAO,MAAMC,aAAa,GAAGA,CAAA,kBAC3BD,KAAA,CAACX,IAAI;EAACa,KAAK,EAAEC,MAAM,CAACC,SAAU;EAAAC,QAAA,gBAC5BP,IAAA,CAACT,IAAI;IAACa,KAAK,EAAEC,MAAM,CAACG,mBAAoB;IAAAD,QAAA,eACtCP,IAAA,CAACF,UAAU,IAAE;EAAC,CACV,CAAC,eAEPE,IAAA,CAACH,YAAY,IAAE,CAAC;AAAA,CACZ,CACP;AAED,MAAMQ,MAAM,GAAGb,UAAU,CAACiB,MAAM,CAAC;EAC/BH,SAAS,EAAE;IACTI,IAAI,EAAE,CAAC;IACPC,eAAe,EAAEjB,MAAM,CAACkB,SAAS;IACjCC,YAAY,EAAEpB,aAAa,CAAC,GAAG,CAAC;IAChCqB,QAAQ,EAAE,QAAQ;IAClB,GAAGnB,OAAO,CAAC,CAAC;EACd,CAAC;EACDa,mBAAmB,EAAE;IACnBE,IAAI,EAAE,CAAC;IACPK,OAAO,EAAEnB,OAAO,CAAC,GAAG;EACtB;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/matrix/components/CellTooltip.js

@@ -0,0 +1,50 @@
+"use strict";
+
+import React from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import { BORDER_RADIUS, COLORS, SHADOWS, SPACING } from '@magmamath/react-native-ui';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const CellTooltip = ({
+  label
+}) => /*#__PURE__*/_jsxs(View, {
+  style: styles.container,
+  children: [/*#__PURE__*/_jsx(View, {
+    style: styles.bubble,
+    children: /*#__PURE__*/_jsx(Text, {
+      style: styles.label,
+      children: label
+    })
+  }), /*#__PURE__*/_jsx(View, {
+    style: styles.arrow
+  })]
+});
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center'
+  },
+  bubble: {
+    backgroundColor: COLORS.NEUTRAL_1,
+    borderRadius: BORDER_RADIUS[150],
+    paddingHorizontal: SPACING[200],
+    paddingVertical: SPACING[100],
+    ...SHADOWS[4]
+  },
+  label: {
+    fontSize: 13,
+    color: COLORS.NEUTRAL_9,
+    textAlign: 'center'
+  },
+  arrow: {
+    width: 0,
+    height: 0,
+    marginTop: -4,
+    borderLeftWidth: 9,
+    borderRightWidth: 9,
+    borderTopWidth: 12,
+    borderStyle: 'solid',
+    borderLeftColor: 'transparent',
+    borderRightColor: 'transparent',
+    borderTopColor: COLORS.NEUTRAL_1
+  }
+});
+//# sourceMappingURL=CellTooltip.js.map

package/dist/module/features/fluency/components/matrix/components/CellTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","BORDER_RADIUS","COLORS","SHADOWS","SPACING","jsx","_jsx","jsxs","_jsxs","CellTooltip","label","style","styles","container","children","bubble","arrow","create","alignItems","backgroundColor","NEUTRAL_1","borderRadius","paddingHorizontal","paddingVertical","fontSize","color","NEUTRAL_9","textAlign","width","height","marginTop","borderLeftWidth","borderRightWidth","borderTopWidth","borderStyle","borderLeftColor","borderRightColor","borderTopColor"],"sourceRoot":"../../../../../../../src","sources":["features/fluency/components/matrix/components/CellTooltip.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AACrD,SAASC,aAAa,EAAEC,MAAM,EAAEC,OAAO,EAAEC,OAAO,QAAQ,4BAA4B;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAMpF,OAAO,MAAMC,WAAW,GAAGA,CAAC;EAAEC;AAAwB,CAAC,kBACrDF,KAAA,CAACV,IAAI;EAACa,KAAK,EAAEC,MAAM,CAACC,SAAU;EAAAC,QAAA,gBAC5BR,IAAA,CAACR,IAAI;IAACa,KAAK,EAAEC,MAAM,CAACG,MAAO;IAAAD,QAAA,eACzBR,IAAA,CAACP,IAAI;MAACY,KAAK,EAAEC,MAAM,CAACF,KAAM;MAAAI,QAAA,EAAEJ;IAAK,CAAO;EAAC,CACrC,CAAC,eACPJ,IAAA,CAACR,IAAI;IAACa,KAAK,EAAEC,MAAM,CAACI;EAAM,CAAE,CAAC;AAAA,CACzB,CACP;AAED,MAAMJ,MAAM,GAAGZ,UAAU,CAACiB,MAAM,CAAC;EAC/BJ,SAAS,EAAE;IACTK,UAAU,EAAE;EACd,CAAC;EACDH,MAAM,EAAE;IACNI,eAAe,EAAEjB,MAAM,CAACkB,SAAS;IACjCC,YAAY,EAAEpB,aAAa,CAAC,GAAG,CAAC;IAChCqB,iBAAiB,EAAElB,OAAO,CAAC,GAAG,CAAC;IAC/BmB,eAAe,EAAEnB,OAAO,CAAC,GAAG,CAAC;IAC7B,GAAGD,OAAO,CAAC,CAAC;EACd,CAAC;EACDO,KAAK,EAAE;IACLc,QAAQ,EAAE,EAAE;IACZC,KAAK,EAAEvB,MAAM,CAACwB,SAAS;IACvBC,SAAS,EAAE;EACb,CAAC;EACDX,KAAK,EAAE;IACLY,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE,CAAC;IACTC,SAAS,EAAE,CAAC,CAAC;IACbC,eAAe,EAAE,CAAC;IAClBC,gBAAgB,EAAE,CAAC;IACnBC,cAAc,EAAE,EAAE;IAClBC,WAAW,EAAE,OAAO;IACpBC,eAAe,EAAE,aAAa;IAC9BC,gBAAgB,EAAE,aAAa;IAC/BC,cAAc,EAAEnC,MAAM,CAACkB;EACzB;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency/components/matrix/components/MatrixCell.js

@@ -0,0 +1,111 @@
+"use strict";
+
+import React, { useState } from 'react';
+import { Pressable, View, Text, StyleSheet } from 'react-native';
+import Animated, { FadeIn, FadeOut } from 'react-native-reanimated';
+import { BORDER_RADIUS, COLORS, FONT_FAMILY, SPACING } from '@magmamath/react-native-ui';
+import { FluencyMasteryLevel } from "../../../shared/fluency.constants.js";
+import { StarFillIcon } from "../../../assets/StarFillIcon.js";
+import { CellTooltip } from "./CellTooltip.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const MatrixCell = ({
+  label,
+  box,
+  isHeader,
+  isEmpty,
+  levelColors,
+  tooltipLabel
+}) => {
+  const [isActive, setIsActive] = useState(false);
+  const masteryLevel = box || null;
+  const isMastered = masteryLevel === FluencyMasteryLevel.MASTERED;
+  const bgColor = (() => {
+    if (masteryLevel) return levelColors[masteryLevel];
+    if (isHeader) return COLORS.NEUTRAL_5;
+    return COLORS.NEUTRAL_2;
+  })();
+  const showTooltip = isActive && !!tooltipLabel;
+  const activate = () => setIsActive(true);
+  const deactivate = () => setIsActive(false);
+  if (isEmpty) {
+    return /*#__PURE__*/_jsx(View, {
+      style: styles.wrapper,
+      children: /*#__PURE__*/_jsx(View, {
+        style: [styles.cell, styles.emptyCell],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: styles.emptyCellText,
+          children: "\u2212"
+        })
+      })
+    });
+  }
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.wrapper, showTooltip && styles.wrapperActive],
+    children: [showTooltip && /*#__PURE__*/_jsx(Animated.View, {
+      entering: FadeIn.duration(200),
+      exiting: FadeOut.duration(200),
+      style: [styles.tooltipContainer, {
+        pointerEvents: 'none'
+      }],
+      children: /*#__PURE__*/_jsx(CellTooltip, {
+        label: tooltipLabel
+      })
+    }), /*#__PURE__*/_jsxs(Pressable, {
+      style: [styles.cell, {
+        backgroundColor: bgColor
+      }],
+      onHoverIn: activate,
+      onHoverOut: deactivate,
+      onPressIn: activate,
+      onPressOut: deactivate,
+      children: [isMastered && /*#__PURE__*/_jsx(StarFillIcon, {
+        color: isActive ? COLORS.PRIMARY_YELLOW : undefined
+      }), label !== null && /*#__PURE__*/_jsx(Text, {
+        style: typeof label === 'string' ? styles.symbolText : styles.headerText,
+        children: label
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  wrapper: {
+    flex: 1
+  },
+  wrapperActive: {
+    zIndex: 1
+  },
+  cell: {
+    flex: 1,
+    borderRadius: BORDER_RADIUS[100],
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  tooltipContainer: {
+    position: 'absolute',
+    bottom: '80%',
+    left: 0,
+    right: 0,
+    alignItems: 'center',
+    paddingBottom: SPACING[50],
+    zIndex: 1
+  },
+  emptyCell: {
+    backgroundColor: COLORS.NEUTRAL_2
+  },
+  emptyCellText: {
+    fontSize: 12,
+    color: COLORS.NEUTRAL_5,
+    fontFamily: FONT_FAMILY.buenosAires
+  },
+  headerText: {
+    fontSize: 12,
+    fontWeight: '600',
+    color: COLORS.NEUTRAL_2,
+    fontFamily: FONT_FAMILY.buenosAires
+  },
+  symbolText: {
+    fontSize: 24,
+    color: COLORS.NEUTRAL_7
+  }
+});
+//# sourceMappingURL=MatrixCell.js.map