@magmamath/students-features 0.5.7-rc-0 → 0.5.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magmamath/students-features",
-  "version": "0.5.7-rc-0",
+  "version": "0.5.7",
   "description": "Magmamath features library",
   "source": "src/index.ts",
   "main": "src/index.ts",
@@ -29,7 +29,7 @@
     "react-native-svg": "^15.10.0"
   },
   "devDependencies": {
-    "@magmamath/react-native-ui": "0.4.17",
+    "@magmamath/react-native-ui": "0.4.12",
     "@react-native/eslint-config": "^0.73.1",
     "@release-it/conventional-changelog": "^9.0.2",
     "@types/jest": "^29.5.5",

package/src/features/celebrations/components/ParticleBatch.tsx

@@ -1,9 +1,9 @@
 import React, { useState, useEffect, ComponentType } from 'react'
-import { IconProps } from '@magmamath/react-native-ui'
 import { CELEBRATION_VARIANTS } from '../config'
 import { generateParticle } from '../helpers'
 import { Particle } from './Particle'
 import { CelebrationVariant } from '../types'
+import { IconProps } from '../../../shared/icons/icon.types'
 
 export type ParticlesBatch = {
   id: number

package/src/features/celebrations/components/Spark.tsx

@@ -1,18 +1,14 @@
-import { IconProps } from '@magmamath/react-native-ui'
 import React from 'react'
 import { View } from 'react-native'
+import { IconProps } from '../../../shared/icons/icon.types'
 
-export const Spark = ({ size = 10, color }: IconProps) => {
-  const actualSize = typeof size === 'number' ? size : 0
-
-  return (
-    <View
-      style={{
-        width: actualSize,
-        height: actualSize,
-        backgroundColor: color,
-        borderRadius: actualSize / 2,
-      }}
-    />
-  )
-}
+export const Spark = ({ size = 10, color }: IconProps) => (
+  <View
+    style={{
+      width: size,
+      height: size,
+      backgroundColor: color,
+      borderRadius: size / 2,
+    }}
+  />
+)

package/src/features/endOfAssignment/components/Modal/assets/SunrisingIcon.tsx

@@ -1,13 +1,12 @@
 import * as React from 'react'
-import { IconProps } from '@magmamath/react-native-ui'
 import Svg, { G, Path, Defs, LinearGradient, Stop } from 'react-native-svg'
+import { IconProps } from '../../../../../shared/icons/icon.types'
 
-export const SunrisingIcon = ({ size }: IconProps) => {
-  const actualSize = typeof size === 'number' ? size : 0
-  const height = actualSize * 0.606
+export const SunrisingIcon = (props: IconProps) => {
+  const height = (props.size ?? 0) * 0.606
 
   return (
-    <Svg width={size} height={height} viewBox="0 0 909 551" fill="none">
+    <Svg width={props.size} height={height} viewBox="0 0 909 551" fill="none" {...props}>
       <G opacity={0.1}>
         <Path
           d="M164.04-598.854a893.984 893.984 0 01222.319 28.085L164.04 295.106v-893.96z"

package/src/features/endOfAssignment/components/Modal/assets/TrophyIcon.tsx

@@ -1,13 +1,12 @@
-import { IconProps } from '@magmamath/react-native-ui'
 import * as React from 'react'
 import Svg, { Path } from 'react-native-svg'
+import { IconProps } from '../../../../../shared/icons/icon.types'
 
-export const TrophyIcon = ({ size }: IconProps) => {
-  const actualSize = typeof size === 'number' ? size : 0
-  const height = actualSize * 0.982
+export const TrophyIcon = (props: IconProps) => {
+  const height = (props.size ?? 0) * 0.982
 
   return (
-    <Svg width={size} height={height} viewBox="0 0 466 458" fill="none">
+    <Svg width={props.size} height={height} viewBox="0 0 466 458" fill="none" {...props}>
       <Path
         d="M258.454 244.45l-5.731 32.767 16.384 2.86c8.047 1.407 15.796 2.106 23.222 2.106 15.697.011 29.985-3.137 42.766-9.389 6.728-3.292 13.025-7.438 18.9-12.449 44.672-38.12 50.247-115.859 49.604-158.813-.288-18.467-9.466-35.848-24.575-46.49-9.355-6.606-20.23-10.209-31.348-10.575a57.996 57.996 0 00-17.935 2.206c-14.355 4.09-26.36 13.38-33.875 25.994l-32.379-14.332L250.03 88.75l39.162 17.326c6.274 2.771 13.247 2.916 19.632.388 6.374-2.516 11.373-7.382 14.055-13.7a24.56 24.56 0 0115.974-14.112c2.993-.853 6.052-1.13 9.056-.853a24.578 24.578 0 0111.961 4.422c6.44 4.534 10.353 11.95 10.475 19.82 1.164 76.841-18.822 112.224-32.024 127.144-2.195 2.494-4.213 4.412-5.909 5.864-14.632 12.47-33.465 16.483-57.586 12.271l-16.372-2.871zM37.623 282.187c7.429 0 15.173-.703 23.223-2.111l16.379-2.864-5.73-32.757-16.378 2.865c-24.126 4.221-42.953.202-57.575-12.274-11.858-10.119-39.295-43.336-37.936-133.006.119-7.871 4.036-15.28 10.476-19.82a24.601 24.601 0 0121.015-3.57A24.606 24.606 0 017.075 92.764c2.683 6.318 7.675 11.186 14.058 13.709 6.384 2.522 13.355 2.38 19.63-.396l39.152-17.329-13.46-30.41-32.37 14.328C26.57 60.055 14.57 50.762.213 46.67c-16.936-4.828-34.901-1.777-49.293 8.369-15.102 10.647-24.286 28.03-24.565 46.498-.652 42.947 4.926 120.686 49.6 158.806 17.036 14.535 37.71 21.844 61.668 21.844z"
         fill="#FFD690"

package/src/features/endOfAssignment/ui/SparkIcon.tsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import { IconProps } from '@magmamath/react-native-ui'
 import Svg, { Path } from 'react-native-svg'
+import { IconProps } from '../../../shared/icons/icon.types'
 
 export const SparkIcon = ({ size = 12, color }: IconProps) => {
   return (

package/src/features/endOfAssignment/ui/ThumbUpIcon.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
-
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
 import Svg, { Path } from 'react-native-svg'
+import { IconProps } from '../../../shared/icons/icon.types'
 
 export const ThumbUpIcon = ({ size = 57, color = COLORS.NEUTRAL_1 }: IconProps) => {
   return (

package/src/features/formulaSheet/components/FormulaSheet.tsx

@@ -0,0 +1,78 @@
+import React, { forwardRef, ReactNode, useEffect } from 'react'
+import { useUnit } from 'effector-react'
+import {
+  Button,
+  ButtonColor,
+  ButtonSize,
+  ButtonVariant,
+  COLORS,
+  TheoryIcon,
+  ButtonRef,
+  LoaderColor,
+  ButtonStyle,
+} from '@magmamath/react-native-ui'
+import { FormulaSheetModel } from '../model/model'
+import { FormulaSheetModal } from './FormulaSheetModal'
+
+type FormulaSheetProps = {
+  model: FormulaSheetModel
+  fileId: string
+  renderer: (fileBlob: string) => ReactNode
+  buttonSize: ButtonSize
+  buttonColor: ButtonColor
+  loaderColor: LoaderColor
+  onPress?: () => void
+  style?: ButtonStyle
+}
+
+export const FormulaSheet = forwardRef<ButtonRef | null, FormulaSheetProps>(
+  (
+    {
+      model,
+      fileId,
+      renderer,
+      buttonSize = ButtonSize.MEDIUM,
+      buttonColor = ButtonColor.BLUE,
+      loaderColor = LoaderColor.BLUE,
+      onPress,
+      style,
+    },
+    ref,
+  ) => {
+    const isOpen = useUnit(model.modal.$isOpen)
+    const sheetFileBlob = useUnit(model.file.$blob)
+    const isRequestPending = useUnit(model.api.getPDFFileBlobFx.pending)
+
+    useEffect(() => {
+      model.file.setId(fileId ?? null)
+    }, [fileId])
+
+    return (
+      <>
+        <Button
+          ref={ref}
+          size={buttonSize}
+          variant={ButtonVariant.SECONDARY}
+          colorScheme={buttonColor}
+          isActive={isOpen}
+          onPress={() => {
+            model.modal.toggle()
+            onPress?.()
+          }}
+          icon={<TheoryIcon color={isOpen ? COLORS.NEUTRAL_1 : undefined} size={20} />}
+          style={style}
+        />
+
+        {isOpen && (
+          <FormulaSheetModal
+            isLoading={isRequestPending}
+            loaderColor={loaderColor}
+            onClose={() => model.modal.setIsOpen(false)}
+          >
+            {renderer(sheetFileBlob ?? '')}
+          </FormulaSheetModal>
+        )}
+      </>
+    )
+  },
+)

package/src/features/formulaSheet/components/FormulaSheetModal.tsx

@@ -0,0 +1,64 @@
+import React, { PropsWithChildren } from 'react'
+import { View, Modal, StyleSheet, TouchableWithoutFeedback } from 'react-native'
+import {
+  BORDER_RADIUS,
+  COLORS,
+  Loader,
+  LoaderColor,
+  LoaderSize,
+  LoaderType,
+  SPACING,
+} from '@magmamath/react-native-ui'
+
+type FormulaSheetModalProps = {
+  isLoading: boolean
+  loaderColor: LoaderColor
+  onClose: () => void
+}
+
+export const FormulaSheetModal = ({
+  children,
+  loaderColor,
+  isLoading,
+  onClose,
+}: PropsWithChildren<FormulaSheetModalProps>) => {
+  return (
+    <Modal visible transparent animationType="none" onRequestClose={onClose}>
+      <TouchableWithoutFeedback onPress={onClose}>
+        <View style={styles.container}>
+          <TouchableWithoutFeedback onPress={(event) => event.stopPropagation()}>
+            <View style={styles.content}>
+              {isLoading ? (
+                <Loader type={LoaderType.PRIMARY} color={loaderColor} size={LoaderSize.LARGE} />
+              ) : (
+                children
+              )}
+            </View>
+          </TouchableWithoutFeedback>
+        </View>
+      </TouchableWithoutFeedback>
+    </Modal>
+  )
+}
+
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    height: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: 'rgba(0, 0, 0, 0.25)',
+  },
+  content: {
+    width: '100%',
+    maxWidth: 720,
+    height: '100%',
+    maxHeight: '80%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: SPACING['800'],
+    paddingVertical: SPACING['400'],
+    borderRadius: BORDER_RADIUS['400'],
+    backgroundColor: COLORS.NEUTRAL_1,
+  },
+})

package/src/features/formulaSheet/index.ts

@@ -0,0 +1,2 @@
+export { FormulaSheet } from './components/FormulaSheet'
+export { FormulaSheetModel } from './model/model'

package/src/features/formulaSheet/model/api.model.ts

@@ -0,0 +1,13 @@
+import { createEffect, Effect } from 'effector'
+
+export type FormulaSheetApiProps = {
+  getPDFFileBlob: (id: string) => Promise<string>
+}
+
+export class FormulaSheetAPI {
+  public readonly getPDFFileBlobFx: Effect<string, string> = createEffect()
+
+  public setupRequests(api: FormulaSheetApiProps) {
+    this.getPDFFileBlobFx.use(api.getPDFFileBlob)
+  }
+}

package/src/features/formulaSheet/model/file.model.ts

@@ -0,0 +1,18 @@
+import { createEvent, restore, StoreWritable } from 'effector'
+import { FormulaSheetAPI } from './api.model'
+
+type FormulaSheetFileProps = {
+  api: FormulaSheetAPI
+}
+
+export class FormulaSheetFile {
+  public readonly reset = createEvent()
+  public readonly $blob: StoreWritable<string | null>
+
+  public readonly setId = createEvent<string>()
+  public readonly $id = restore(this.setId, null)
+
+  constructor({ api }: FormulaSheetFileProps) {
+    this.$blob = restore(api.getPDFFileBlobFx.doneData, null).reset(this.reset)
+  }
+}

package/src/features/formulaSheet/model/modal.model.ts

@@ -0,0 +1,10 @@
+import { createEvent, restore } from 'effector'
+
+export class FormulaSheetModal {
+  public readonly reset = createEvent()
+  public readonly toggle = createEvent()
+  public readonly setIsOpen = createEvent<boolean>()
+  public readonly $isOpen = restore(this.setIsOpen, false)
+    .on(this.toggle, (state) => !state)
+    .reset(this.reset)
+}

package/src/features/formulaSheet/model/model.ts

@@ -0,0 +1,31 @@
+import { sample } from 'effector'
+import { FormulaSheetAPI, type FormulaSheetApiProps } from './api.model'
+import { FormulaSheetModal } from './modal.model'
+import { FormulaSheetFile } from './file.model'
+
+type FormulaSheetModelProps = {
+  api: FormulaSheetApiProps
+}
+
+export class FormulaSheetModel {
+  public readonly api = new FormulaSheetAPI()
+  public readonly modal = new FormulaSheetModal()
+  public readonly file = new FormulaSheetFile({ api: this.api })
+
+  constructor({ api }: FormulaSheetModelProps) {
+    this.api.setupRequests(api)
+
+    sample({
+      clock: this.modal.$isOpen,
+      source: [this.file.$id, this.file.$blob],
+      filter: ([fileId, blob], isOpen) => !!(isOpen && fileId && !blob),
+      fn: ([fileId]) => fileId as string,
+      target: this.api.getPDFFileBlobFx,
+    })
+
+    sample({
+      clock: this.file.$id,
+      target: [this.file.reset, this.modal.reset],
+    })
+  }
+}

package/src/index.ts

@@ -4,4 +4,4 @@ export * from './features/chatbot'
 export * from './features/feedback'
 export * from './features/celebrations'
 export * from './features/endOfAssignment'
-export * from './features/problemSelector'
+export * from './features/formulaSheet'

package/src/shared/icons/Halloween.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, { ClipPath, Defs, G, Path } from 'react-native-svg'
-
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 function Halloween({ size = 57, color = COLORS.NEUTRAL_8 }: IconProps) {
   return (

package/src/shared/icons/MessageBubbleIcon.tsx

@@ -1,15 +1,16 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-import { IconProps, COLORS } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 export const MessageBubbleIcon = ({ size = 26, color = COLORS.NEUTRAL_1 }: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox='0 0 26 26' fill='none'>
+    <Svg width={size} height={size} viewBox="0 0 26 26" fill="none">
       <Path
-        d='M1.46731 10.0594C0.934026 14.231 2.94959 17.0124 4.72827 18.403C5.15473 20.0717 4.90596 21.8796 4.72827 22.5749C6.86227 22.1577 8.40099 20.946 8.93496 20.2507C12.6702 21.2937 23.0923 21.063 24.4129 14.7527C25.5097 9.51166 22.2158 5.12788 15.3416 3.80165C7.2255 2.23582 2.01279 5.79234 1.46731 10.0594Z'
+        d="M1.46731 10.0594C0.934026 14.231 2.94959 17.0124 4.72827 18.403C5.15473 20.0717 4.90596 21.8796 4.72827 22.5749C6.86227 22.1577 8.40099 20.946 8.93496 20.2507C12.6702 21.2937 23.0923 21.063 24.4129 14.7527C25.5097 9.51166 22.2158 5.12788 15.3416 3.80165C7.2255 2.23582 2.01279 5.79234 1.46731 10.0594Z"
         stroke={color}
-        strokeWidth='2'
-        strokeLinejoin='round'
+        strokeWidth="2"
+        strokeLinejoin="round"
       />
     </Svg>
   )

package/src/shared/icons/Pi.tsx

@@ -1,13 +1,11 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 function Pi({ size = 57, color = COLORS.NEUTRAL_8 }: IconProps) {
-  const actualSize = typeof size === 'number' ? size : 0
-  const height = actualSize * 0.8421
-
   return (
-    <Svg width={57} height={height} viewBox="0 0 57 48" fill="none">
+    <Svg width={57} height={size * 0.8421} viewBox="0 0 57 48" fill="none">
       <Path
         d="M2.311 10.528a5.23 5.23 0 00.244 7.63c2.166 1.926 5.52 1.836 7.572-.23l4.685-4.719a5.09 5.09 0 01.04-.04c.557-.55 1.37-.044 1.302.735a96.284 96.284 0 01-.666 5.732c-.546 3.688-1.358 7.523-2.543 10.924-1.209 3.468-2.669 6.084-4.272 7.7a5.23 5.23 0 00.246 7.63c2.167 1.925 5.52 1.835 7.572-.233 3.195-3.219 5.307-7.505 6.759-11.67 1.475-4.232 2.41-8.76 3.012-12.831.483-3.272.763-6.327.926-8.813a1.006 1.006 0 011.002-.942h2.357a1 1 0 011 1v23.505c0 6.436 5.464 11.367 11.84 11.367 7.233 0 13.389-5.587 13.389-12.831v-.872c0-3.093-2.6-5.315-5.443-5.315-2.843 0-5.443 2.222-5.443 5.315v.872c0 1.058-.958 2.202-2.502 2.202-.69 0-.955-.489-.955-.738V12.401a1 1 0 011-1h7.9c2.844 0 5.443-2.221 5.443-5.315 0-3.093-2.6-5.315-5.443-5.315H19.267c-4.614 0-9.059 1.803-12.27 5.038L2.31 10.528z"
         fill={color}

package/src/shared/icons/Star.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 function Star({ size = 57, color = COLORS.NEUTRAL_8 }: IconProps) {
   return (

package/src/shared/icons/Valentine.tsx

@@ -1,13 +1,11 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 function Valentine({ size = 57, color = COLORS.NEUTRAL_8 }: IconProps) {
-  const actualSize = typeof size === 'number' ? size : 0
-  const height = actualSize * 0.8421
-
   return (
-    <Svg width={size} height={height} viewBox="0 0 57 48" fill="none">
+    <Svg width={size} height={size * 0.8421} viewBox="0 0 57 48" fill="none">
       <Path
         d="M52.473 24.947L29.763 47.5a1.4 1.4 0 01-1.973 0L5.08 24.947A14.57 14.57 0 013.567 6.032C8.604-.884 18.487-1.994 24.931 3.633l2.924 2.554a1.4 1.4 0 001.842 0l2.924-2.554c6.444-5.627 16.327-4.517 21.363 2.399a14.57 14.57 0 01-1.511 18.915z"
         fill={color}

package/src/shared/icons/Winter.tsx

@@ -1,15 +1,11 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-
-import { COLORS, IconProps } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 function Winter({ size = 50, color = COLORS.NEUTRAL_8 }: IconProps) {
-  const actualSize = typeof size === 'number' ? size : 0
-
-  const height = actualSize * 1.14
-
   return (
-    <Svg width={size} height={height} viewBox="0 0 50 57" fill="none">
+    <Svg width={size} height={size * 1.14} viewBox="0 0 50 57" fill="none">
       <Path
         fillRule="evenodd"
         clipRule="evenodd"

package/src/shared/icons/XCloseIcon.tsx

@@ -1,12 +1,13 @@
 import React from 'react'
 import Svg, { Path } from 'react-native-svg'
-import { IconProps, COLORS } from '@magmamath/react-native-ui'
+import { COLORS } from '@magmamath/react-native-ui'
+import { IconProps } from './icon.types'
 
 export const XCloseIcon = ({ size = 26, color = COLORS.NEUTRAL_9 }: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox='0 0 26 26' fill='none'>
+    <Svg width={size} height={size} viewBox="0 0 26 26" fill="none">
       <Path
-        d='M4.38388 2.61612C3.89573 2.12796 3.10427 2.12796 2.61612 2.61612C2.12796 3.10427 2.12796 3.89573 2.61612 4.38388L11.2322 13L2.61612 21.6161C2.12796 22.1043 2.12796 22.8957 2.61612 23.3839C3.10427 23.872 3.89573 23.872 4.38388 23.3839L13 14.7678L21.6161 23.3839C22.1043 23.872 22.8957 23.872 23.3839 23.3839C23.872 22.8957 23.872 22.1043 23.3839 21.6161L14.7678 13L23.3839 4.38388C23.872 3.89573 23.872 3.10427 23.3839 2.61612C22.8957 2.12796 22.1043 2.12796 21.6161 2.61612L13 11.2322L4.38388 2.61612Z'
+        d="M4.38388 2.61612C3.89573 2.12796 3.10427 2.12796 2.61612 2.61612C2.12796 3.10427 2.12796 3.89573 2.61612 4.38388L11.2322 13L2.61612 21.6161C2.12796 22.1043 2.12796 22.8957 2.61612 23.3839C3.10427 23.872 3.89573 23.872 4.38388 23.3839L13 14.7678L21.6161 23.3839C22.1043 23.872 22.8957 23.872 23.3839 23.3839C23.872 22.8957 23.872 22.1043 23.3839 21.6161L14.7678 13L23.3839 4.38388C23.872 3.89573 23.872 3.10427 23.3839 2.61612C22.8957 2.12796 22.1043 2.12796 21.6161 2.61612L13 11.2322L4.38388 2.61612Z"
         fill={color}
       />
     </Svg>

package/dist/commonjs/features/problemSelector/components/ProblemSelector.js

@@ -1,43 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ProblemSelector = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _reactNativeUi = require("@magmamath/react-native-ui");
-var _ProblemSelectorButton = require("./ProblemSelectorButton.js");
-var _constants = require("../constants.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const ProblemSelector = ({
-  buttons
-}) => {
-  if (!buttons.length) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: styles.container,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.contentContainer,
-      children: buttons.map(btn => /*#__PURE__*/(0, _react.createElement)(_ProblemSelectorButton.ProblemSelectorButton, {
-        ...btn,
-        key: btn.key
-      }))
-    })
-  });
-};
-exports.ProblemSelector = ProblemSelector;
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    alignItems: 'center'
-  },
-  contentContainer: {
-    width: _constants.PROBLEM_SELECTOR_CONTENT_WIDTH,
-    flexWrap: 'wrap',
-    flexDirection: 'row',
-    paddingVertical: _reactNativeUi.SPACING[400],
-    gap: 15
-  }
-});
-//# sourceMappingURL=ProblemSelector.js.map

package/dist/commonjs/features/problemSelector/components/ProblemSelector.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeUi","_ProblemSelectorButton","_constants","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ProblemSelector","buttons","length","jsx","View","style","styles","container","children","contentContainer","map","btn","createElement","ProblemSelectorButton","key","exports","StyleSheet","create","alignItems","width","PROBLEM_SELECTOR_CONTENT_WIDTH","flexWrap","flexDirection","paddingVertical","SPACING","gap"],"sourceRoot":"../../../../../src","sources":["features/problemSelector/components/ProblemSelector.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AAEA,IAAAG,sBAAA,GAAAH,OAAA;AAEA,IAAAI,UAAA,GAAAJ,OAAA;AAA6D,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAM,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAOtD,MAAMW,eAAe,GAAGA,CAAC;EAAEC;AAA8B,CAAC,KAAK;EACpE,IAAI,CAACA,OAAO,CAACC,MAAM,EAAE,OAAO,IAAI;EAEhC,oBACE,IAAAvB,WAAA,CAAAwB,GAAA,EAAC5B,YAAA,CAAA6B,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,eAC5B,IAAA7B,WAAA,CAAAwB,GAAA,EAAC5B,YAAA,CAAA6B,IAAI;MAACC,KAAK,EAAEC,MAAM,CAACG,gBAAiB;MAAAD,QAAA,EAClCP,OAAO,CAACS,GAAG,CAAEC,GAAG,iBACf,IAAAvC,MAAA,CAAAwC,aAAA,EAACnC,sBAAA,CAAAoC,qBAAqB;QAAA,GAAKF,GAAG;QAAEG,GAAG,EAAEH,GAAG,CAACG;MAAI,CAAE,CAChD;IAAC,CACE;EAAC,CACH,CAAC;AAEX,CAAC;AAAAC,OAAA,CAAAf,eAAA,GAAAA,eAAA;AAED,MAAMM,MAAM,GAAGU,uBAAU,CAACC,MAAM,CAAC;EAC/BV,SAAS,EAAE;IAAEW,UAAU,EAAE;EAAS,CAAC;EACnCT,gBAAgB,EAAE;IAChBU,KAAK,EAAEC,yCAA8B;IACrCC,QAAQ,EAAE,MAAM;IAChBC,aAAa,EAAE,KAAK;IACpBC,eAAe,EAAEC,sBAAO,CAAC,GAAG,CAAC;IAC7BC,GAAG,EAAE;EACP;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/commonjs/features/problemSelector/components/ProblemSelectorButton.js

@@ -1,68 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ProblemSelectorButton = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactNative = require("react-native");
-var _studentsFeatures = require("@magmamath/students-features");
-var _reactNativeUi = require("@magmamath/react-native-ui");
-var _constants = require("../constants.js");
-var _LockIcon = require("../../../shared/icons/LockIcon.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ProblemSelectorButton = ({
-  text,
-  state,
-  onClick,
-  badgeValue,
-  locked
-}) => {
-  const customColorScheme = _constants.COLOR_SCHEME_MAP[state];
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.wrapper,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeUi.Button, {
-      variant: _reactNativeUi.ButtonVariant.PRIMARY,
-      size: _reactNativeUi.ButtonSize.MEDIUM,
-      customColorScheme: customColorScheme,
-      onPress: onClick,
-      style: {
-        button: styles.button
-      },
-      disabled: locked,
-      icon: locked ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_LockIcon.LockIcon, {
-        ..._constants.ICON_SIZE,
-        color: customColorScheme[_reactNativeUi.ButtonStates.DISABLED]?.color
-      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeUi.Typography, {
-        variant: "h2",
-        style: {
-          color: customColorScheme[_reactNativeUi.ButtonStates.DEFAULT]?.color
-        },
-        children: text ?? ''
-      })
-    }), typeof badgeValue === 'number' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_studentsFeatures.UnreadMessagesBadge, {
-      badgeContent: badgeValue !== 0 ? badgeValue : undefined,
-      withBorder: true,
-      style: [styles.badge, {
-        top: badgeValue ? 0 : _constants.BADGE_COORDINATES.top,
-        right: badgeValue ? 0 : _constants.BADGE_COORDINATES.right
-      }]
-    })]
-  });
-};
-exports.ProblemSelectorButton = ProblemSelectorButton;
-const styles = _reactNative.StyleSheet.create({
-  wrapper: {
-    position: 'relative'
-  },
-  badge: {
-    position: 'absolute'
-  },
-  button: {
-    width: _constants.BUTTON_SIZE,
-    height: _constants.BUTTON_SIZE,
-    borderWidth: 2.75
-  }
-});
-//# sourceMappingURL=ProblemSelectorButton.js.map

package/dist/commonjs/features/problemSelector/components/ProblemSelectorButton.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_studentsFeatures","_reactNativeUi","_constants","_LockIcon","_jsxRuntime","e","__esModule","default","ProblemSelectorButton","text","state","onClick","badgeValue","locked","customColorScheme","COLOR_SCHEME_MAP","jsxs","View","style","styles","wrapper","children","jsx","Button","variant","ButtonVariant","PRIMARY","size","ButtonSize","MEDIUM","onPress","button","disabled","icon","LockIcon","ICON_SIZE","color","ButtonStates","DISABLED","Typography","DEFAULT","UnreadMessagesBadge","badgeContent","undefined","withBorder","badge","top","BADGE_COORDINATES","right","exports","StyleSheet","create","position","width","BUTTON_SIZE","height","borderWidth"],"sourceRoot":"../../../../../src","sources":["features/problemSelector/components/ProblemSelectorButton.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,iBAAA,GAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AAQA,IAAAI,UAAA,GAAAJ,OAAA;AACA,IAAAK,SAAA,GAAAL,OAAA;AAAyD,IAAAM,WAAA,GAAAN,OAAA;AAAA,SAAAD,uBAAAQ,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAIlD,MAAMG,qBAAqB,GAAGA,CAAC;EACpCC,IAAI;EACJC,KAAK;EACLC,OAAO;EACPC,UAAU;EACVC;AAC0B,CAAC,KAAK;EAChC,MAAMC,iBAAiB,GAAGC,2BAAgB,CAACL,KAAK,CAAC;EAEjD,oBACE,IAAAN,WAAA,CAAAY,IAAA,EAACjB,YAAA,CAAAkB,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACC,OAAQ;IAAAC,QAAA,gBAC1B,IAAAjB,WAAA,CAAAkB,GAAA,EAACrB,cAAA,CAAAsB,MAAM;MACLC,OAAO,EAAEC,4BAAa,CAACC,OAAQ;MAC/BC,IAAI,EAAEC,yBAAU,CAACC,MAAO;MACxBf,iBAAiB,EAAEA,iBAAkB;MACrCgB,OAAO,EAAEnB,OAAQ;MACjBO,KAAK,EAAE;QACLa,MAAM,EAAEZ,MAAM,CAACY;MACjB,CAAE;MACFC,QAAQ,EAAEnB,MAAO;MACjBoB,IAAI,EACFpB,MAAM,gBACJ,IAAAT,WAAA,CAAAkB,GAAA,EAACnB,SAAA,CAAA+B,QAAQ;QAAA,GAAKC,oBAAS;QAAEC,KAAK,EAAEtB,iBAAiB,CAACuB,2BAAY,CAACC,QAAQ,CAAC,EAAEF;MAAM,CAAE,CAAC,gBAEnF,IAAAhC,WAAA,CAAAkB,GAAA,EAACrB,cAAA,CAAAsC,UAAU;QACTf,OAAO,EAAC,IAAI;QACZN,KAAK,EAAE;UAAEkB,KAAK,EAAEtB,iBAAiB,CAACuB,2BAAY,CAACG,OAAO,CAAC,EAAEJ;QAAM,CAAE;QAAAf,QAAA,EAEhEZ,IAAI,IAAI;MAAE,CACD;IAEf,CACF,CAAC,EAED,OAAOG,UAAU,KAAK,QAAQ,iBAC7B,IAAAR,WAAA,CAAAkB,GAAA,EAACtB,iBAAA,CAAAyC,mBAAmB;MAClBC,YAAY,EAAE9B,UAAU,KAAK,CAAC,GAAGA,UAAU,GAAG+B,SAAU;MACxDC,UAAU;MACV1B,KAAK,EAAE,CACLC,MAAM,CAAC0B,KAAK,EACZ;QACEC,GAAG,EAAElC,UAAU,GAAG,CAAC,GAAGmC,4BAAiB,CAACD,GAAG;QAC3CE,KAAK,EAAEpC,UAAU,GAAG,CAAC,GAAGmC,4BAAiB,CAACC;MAC5C,CAAC;IACD,CACH,CACF;EAAA,CACG,CAAC;AAEX,CAAC;AAAAC,OAAA,CAAAzC,qBAAA,GAAAA,qBAAA;AAED,MAAMW,MAAM,GAAG+B,uBAAU,CAACC,MAAM,CAAC;EAC/B/B,OAAO,EAAE;IAAEgC,QAAQ,EAAE;EAAW,CAAC;EACjCP,KAAK,EAAE;IAAEO,QAAQ,EAAE;EAAW,CAAC;EAC/BrB,MAAM,EAAE;IACNsB,KAAK,EAAEC,sBAAW;IAClBC,MAAM,EAAED,sBAAW;IACnBE,WAAW,EAAE;EACf;AACF,CAAC,CAAC","ignoreList":[]}