@magmamath/students-features 0.9.0-rc11 → 0.9.0-rc13

package/src/features/keyboard/components/UnitsLayout/UnitsLayout.tsx

@@ -1,6 +1,6 @@
 import React, { useMemo, useState } from 'react'
 import { KeysList } from '../KeysList/KeysList'
-import { StyleSheet, View } from 'react-native'
+import { StyleSheet, useWindowDimensions, View } from 'react-native'
 import {
   COLORS,
   FONT_FAMILY,
@@ -25,6 +25,7 @@ import {
   MATH_ENTRY_WEIGHT_UNITS_SW_KEYBOARD_GROUPS,
 } from './keyboardGroups'
 import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { MAX_WIDTH_FOR_MOBILE_LAYOUT } from '../../constants'
 
 const UNITS_KEYBOARD_GROUPS = new Map([
   [
@@ -54,7 +55,10 @@ enum SelectedLayout {
 }
 
 export const UnitsLayout = (props: KeyboardLayoutProps) => {
-  const [selectedLayout, setSelectedLayout] = useState<SelectedLayout>(SelectedLayout.ALGEBRA)
+  const { width } = useWindowDimensions()
+  const [selectedLayout, setSelectedLayout] = useState<SelectedLayout>(
+    width > MAX_WIDTH_FOR_MOBILE_LAYOUT ? SelectedLayout.ALGEBRA : SelectedLayout.UNITS,
+  )
   const t = useText()
   const basicExtendedKeys =
     KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicExtended]
@@ -100,6 +104,9 @@ export const UnitsLayout = (props: KeyboardLayoutProps) => {
           />
         ),
         key: '1',
+        onPressIn: () => {
+          setSelectedLayout(SelectedLayout.ALGEBRA)
+        },
       },
       {
         title: (
@@ -109,28 +116,30 @@ export const UnitsLayout = (props: KeyboardLayoutProps) => {
           />
         ),
         key: '2',
+        onPressIn: () => {
+          setSelectedLayout(SelectedLayout.UNITS)
+        },
       },
     ]
   }, [activeTab, selectedLayout])
 
   return (
     <View style={styles.container}>
-      <SelectGroup
-        numOfRows={2}
-        options={selectOptions}
-        size={SelectOptionSize.SMALL}
-        style={{
-          container: styles.optionContainer,
-          option: { ...(IS_MOBILE && { container: { flexBasis: 45 } }) },
-        }}
-        color={props.color}
-        selectedOptions={[
-          selectedLayout === SelectedLayout.ALGEBRA ? selectOptions[0] : selectOptions[1],
-        ]}
-        onOptionChange={(option) => {
-          setSelectedLayout(option.key === '1' ? SelectedLayout.ALGEBRA : SelectedLayout.UNITS)
-        }}
-      />
+      {width > MAX_WIDTH_FOR_MOBILE_LAYOUT && (
+        <SelectGroup
+          numOfRows={2}
+          options={selectOptions}
+          size={SelectOptionSize.SMALL}
+          style={{
+            container: styles.optionContainer,
+            option: { ...(IS_MOBILE && { container: { flexBasis: 45 } }) },
+          }}
+          color={props.color}
+          selectedOptions={[
+            selectedLayout === SelectedLayout.ALGEBRA ? selectOptions[0] : selectOptions[1],
+          ]}
+        />
+      )}
       {selectedLayout === SelectedLayout.UNITS ? (
         <UnitTabs
           tabs={tabs}
@@ -164,7 +173,6 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     gap: 16,
     paddingRight: 16,
-    width: 450,
   },
   basicExtendedContainer: {
     gap: 8,

package/src/features/keyboard/constants/keysValues.ts

@@ -4,16 +4,21 @@ import {
   MATH_CURRENCY_UK_KEYBOARD_GROUP,
   MATH_CURRENCY_US_KEYBOARD_GROUP,
   MATH_ENTRY_BASIC_KEYBOARD_GROUP,
+  MATH_ENTRY_BASIC_SW_KEYBOARD_GROUP,
   MATH_TIME_SW_KEYBOARD_GROUP,
   MATH_TIME_US_KEYBOARD_GROUP,
 } from '../components/BasicLayout/keyboardGroup'
 import { MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP } from '../components/AlgebraLayout/keyboardGroups'
 import {
+  MATH_ENTRY_BASIC_EXTENDED_MOBILE,
+  MATH_ENTRY_BASIC_EXTENDED_MOBILE_SW,
   MATH_ENTRY_BASIC_SW_EXTENDED,
   MATH_ENTRY_BASIC_US_EXTENDED,
 } from '../components/BasicExtendedLayout/keyboardGroups'
 import {
   MATH_ENTRY_BASIC_EXTENDED_PLUS,
+  MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE,
+  MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE_SW,
   MATH_ENTRY_BASIC_EXTENDED_PLUS_SW,
 } from '../components/BasicExtendedPlusLayout/keyboardGroups'
 import {
@@ -25,13 +30,18 @@ import { MATH_BASIC_OPERATORS } from '../types/MathKeysGroups/basicOperators'
 import { MATH_AREA_UNITS, MATH_VOLUME_UNITS } from '../types/MathKeysGroups/units'
 import { MATH_INTEGRALS_AND_DERIVATIVES } from '../types/MathKeysGroups/calculusOperators'
 import { Locale } from '../../../shared/translation'
-import { MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS } from '@magmamath/students-features'
+import {
+  MATH_BASIC_TRIGONOMETRIC_FUNCTIONS,
+  MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS,
+} from '@magmamath/students-features'
 
 export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, KeyboardGroup>> = {
   [Locale.CA]: {
     [KeyboardType.Basic]: MATH_ENTRY_BASIC_KEYBOARD_GROUP,
     [KeyboardType.BasicExtended]: MATH_ENTRY_BASIC_US_EXTENDED,
+    [KeyboardType.BasicExtendedMobile]: MATH_ENTRY_BASIC_EXTENDED_MOBILE,
     [KeyboardType.BasicExtendedPlus]: MATH_ENTRY_BASIC_EXTENDED_PLUS,
+    [KeyboardType.BasicExtendedPlusMobile]: MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE,
     [KeyboardType.BasicUnits]: {
       ...MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS,
       keys: MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS.keys[0],
@@ -44,7 +54,9 @@ export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, Keyb
   [Locale.SCT]: {
     [KeyboardType.Basic]: MATH_ENTRY_BASIC_KEYBOARD_GROUP,
     [KeyboardType.BasicExtended]: MATH_ENTRY_BASIC_US_EXTENDED,
+    [KeyboardType.BasicExtendedMobile]: MATH_ENTRY_BASIC_EXTENDED_MOBILE,
     [KeyboardType.BasicExtendedPlus]: MATH_ENTRY_BASIC_EXTENDED_PLUS,
+    [KeyboardType.BasicExtendedPlusMobile]: MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE,
     [KeyboardType.BasicUnits]: {
       ...MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS,
       keys: MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS.keys[0],
@@ -57,7 +69,9 @@ export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, Keyb
   [Locale.GB]: {
     [KeyboardType.Basic]: MATH_ENTRY_BASIC_KEYBOARD_GROUP,
     [KeyboardType.BasicExtended]: MATH_ENTRY_BASIC_US_EXTENDED,
+    [KeyboardType.BasicExtendedMobile]: MATH_ENTRY_BASIC_EXTENDED_MOBILE,
     [KeyboardType.BasicExtendedPlus]: MATH_ENTRY_BASIC_EXTENDED_PLUS,
+    [KeyboardType.BasicExtendedPlusMobile]: MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE,
     [KeyboardType.BasicUnits]: {
       ...MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS,
       keys: MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS.keys[0],
@@ -70,7 +84,9 @@ export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, Keyb
   [Locale.EN]: {
     [KeyboardType.Basic]: MATH_ENTRY_BASIC_KEYBOARD_GROUP,
     [KeyboardType.BasicExtended]: MATH_ENTRY_BASIC_US_EXTENDED,
+    [KeyboardType.BasicExtendedMobile]: MATH_ENTRY_BASIC_EXTENDED_MOBILE,
     [KeyboardType.BasicExtendedPlus]: MATH_ENTRY_BASIC_EXTENDED_PLUS,
+    [KeyboardType.BasicExtendedPlusMobile]: MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE,
     [KeyboardType.BasicUnits]: {
       ...MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS,
       keys: MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS.keys[0],
@@ -81,9 +97,11 @@ export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, Keyb
     [KeyboardType.Numpad]: MATH_ENTRY_NUMBERS_US_KEYBOARD_GROUP,
   },
   [Locale.SW]: {
-    [KeyboardType.Basic]: MATH_ENTRY_BASIC_KEYBOARD_GROUP,
+    [KeyboardType.Basic]: MATH_ENTRY_BASIC_SW_KEYBOARD_GROUP,
     [KeyboardType.BasicExtended]: MATH_ENTRY_BASIC_SW_EXTENDED,
+    [KeyboardType.BasicExtendedMobile]: MATH_ENTRY_BASIC_EXTENDED_MOBILE_SW,
     [KeyboardType.BasicExtendedPlus]: MATH_ENTRY_BASIC_EXTENDED_PLUS_SW,
+    [KeyboardType.BasicExtendedPlusMobile]: MATH_ENTRY_BASIC_EXTENDED_PLUS_MOBILE_SW,
     [KeyboardType.BasicUnits]: {
       ...MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS,
       keys: MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS.keys[0],
@@ -119,11 +137,15 @@ export const DISABLED_KEYS: KeyboardKey[] = [
   MATH_VOLUME_UNITS.CUBIC_METER,
   MATH_VOLUME_UNITS.CUBIC_CENTIMETER,
   MATH_VOLUME_UNITS.CUBIC_MILLIMETER,
+  MATH_VOLUME_UNITS.CUBIC_DECIMETER,
   MATH_VOLUME_UNITS.FLOZ,
   MATH_INTEGRALS_AND_DERIVATIVES.DEFINITEINTEGRAL,
   MATH_INTEGRALS_AND_DERIVATIVES.INTEGRAL,
   MATH_INTEGRALS_AND_DERIVATIVES.DERIVATIVE,
   MATH_INTEGRALS_AND_DERIVATIVES.DOUBLEINTEGRAL,
+  MATH_BASIC_TRIGONOMETRIC_FUNCTIONS.TAN,
+  MATH_BASIC_TRIGONOMETRIC_FUNCTIONS.SIN,
+  MATH_BASIC_TRIGONOMETRIC_FUNCTIONS.COS,
   MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS.ARCTAN,
   MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS.ARCSIN,
   MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS.ARCCOS,

package/src/features/keyboard/constants.ts

@@ -4,3 +4,5 @@ export const DEFAULT_KEY_ICON_PROPS = {
   size: 16,
   color: COLORS.NEUTRAL_9,
 } as const
+
+export const MAX_WIDTH_FOR_MOBILE_LAYOUT = 1180

package/src/features/keyboard/types/MathKeysGroups/basicOperators.tsx

@@ -113,11 +113,13 @@ export const MATH_BASIC_OPERATORS: MathKeysGroup<typeof MathBasicOperator> = {
     icon: <LessThanIcon {...DEFAULT_KEY_ICON_PROPS} />,
     mathliveValue: '<',
     katexValue: 'LESS_THAN',
+    spreadsheetValue: '<',
   },
   [MathBasicOperator.GREATER_THAN]: {
     icon: <GreaterThanIcon {...DEFAULT_KEY_ICON_PROPS} />,
     mathliveValue: '>',
     katexValue: 'GREATER_THAN',
+    spreadsheetValue: '>',
   },
   [MathBasicOperator.LESS_THAN_OR_EQUAL]: {
     icon: <LessThanOrEqualIcon {...DEFAULT_KEY_ICON_PROPS} />,

package/src/features/keyboard/types/MathKeysGroups/textSymbols.tsx

@@ -20,47 +20,47 @@ export enum MathTextSymbol {
 export const MATH_TEXT_SYMBOLS: MathKeysGroup<typeof MathTextSymbol> = {
   [MathTextSymbol.A]: {
     label: 'a',
-    mathliveValue: '$a$',
+    mathliveValue: 'a',
     katexValue: 'a',
   },
   [MathTextSymbol.B]: {
     label: 'b',
-    mathliveValue: '$b$',
+    mathliveValue: 'b',
     katexValue: 'b',
   },
   [MathTextSymbol.C]: {
     label: 'c',
-    mathliveValue: '$c$',
+    mathliveValue: 'c',
     katexValue: 'c',
   },
   [MathTextSymbol.F]: {
     label: 'f',
-    mathliveValue: '$f$',
+    mathliveValue: 'f',
     katexValue: 'f',
   },
   [MathTextSymbol.G]: {
     label: 'g',
-    mathliveValue: '$g$',
+    mathliveValue: 'g',
     katexValue: 'g',
   },
   [MathTextSymbol.H]: {
     label: 'h',
-    mathliveValue: '$h$',
+    mathliveValue: 'h',
     katexValue: 'h',
   },
   [MathTextSymbol.X]: {
     icon: <XIcon {...DEFAULT_KEY_ICON_PROPS} />,
-    mathliveValue: '$x$',
+    mathliveValue: 'x',
     katexValue: 'x',
   },
   [MathTextSymbol.Y]: {
     icon: <YIcon {...DEFAULT_KEY_ICON_PROPS} />,
-    mathliveValue: '$y$',
+    mathliveValue: 'y',
     katexValue: 'y',
   },
   [MathTextSymbol.Z]: {
     icon: <ZIcon {...DEFAULT_KEY_ICON_PROPS} />,
-    mathliveValue: '$z$',
+    mathliveValue: 'z',
     katexValue: 'z',
   },
 }

package/src/features/keyboard/types/MathKeysGroups/trigonometric.tsx

@@ -29,12 +29,12 @@ export const MATH_BASIC_TRIGONOMETRIC_FUNCTIONS: MathKeysGroup<
   [MathBasicTrigonometricFunction.COS]: {
     label: 'cos',
     mathliveValue: '$\\cos(\\placeholder{})$',
-    katexValue: 'cos()',
+    katexValue: 'cos',
   },
   [MathBasicTrigonometricFunction.TAN]: {
     label: 'tan',
     mathliveValue: '$\\tan(\\placeholder{})$',
-    katexValue: 'tan()',
+    katexValue: 'tan',
   },
   [MathBasicTrigonometricFunction.COT]: {
     label: 'cot',
@@ -59,22 +59,22 @@ export const MATH_INVERSE_TRIGONOMETRIC_FUNCTIONS: MathKeysGroup<
   [MathInverseTrigonometricFunction.ARCSIN]: {
     label: 'arcsin',
     mathliveValue: '$\\arcsin(\\placeholder{})$',
-    katexValue: 'arcsin()',
+    katexValue: 'arcsin',
   },
   [MathInverseTrigonometricFunction.ARCCOS]: {
     label: 'arccos',
     mathliveValue: '$\\arccos(\\placeholder{})$',
-    katexValue: 'arccos()',
+    katexValue: 'arccos',
   },
   [MathInverseTrigonometricFunction.ARCTAN]: {
     label: 'arctan',
     mathliveValue: '$\\arctan(\\placeholder{})$',
-    katexValue: 'arctan()',
+    katexValue: 'arctan',
   },
   [MathInverseTrigonometricFunction.ARCCOT]: {
     label: 'arccot',
     mathliveValue: '$\\operatorname{arccot}(\\placeholder{})$',
-    katexValue: 'arccot()',
+    katexValue: 'arccot',
   },
   [MathInverseTrigonometricFunction.ARCSEC]: {
     label: 'arcsec',

package/src/features/keyboard/types/types.ts

@@ -1,14 +1,17 @@
 import { ReactNode } from 'react'
 import { SelectOptionColor } from '@magmamath/react-native-ui'
+import { GestureResponderEvent } from 'react-native'
 
 export const enum KeyboardType {
   AlgebraAdvanced = 'AlgebraAdvanced',
   Basic = 'Basic',
   BasicExtended = 'BasicExtended',
+  BasicExtendedMobile = 'BasicExtendedMobile',
   BasicTime = 'BasicTime',
   BasicCurrency = 'BasicCurrency',
   BasicUnits = 'BasicUnits',
   BasicExtendedPlus = 'BasicExtendedPlus',
+  BasicExtendedPlusMobile = 'BasicExtendedPlusMobile',
   Numpad = 'Numpad',
 }
 
@@ -17,13 +20,16 @@ export type KeyboardKey = {
   label?: string
   isSpecialSymbol?: boolean
   mathliveValue?: string
+  spreadsheetValue?: string
   icon?: ReactNode
 }
 
 export type KeyboardKeyValue = {
+  event: GestureResponderEvent
   katexValue: string
   mathliveValue?: string
   isSpecialSymbol?: boolean
+  spreadsheetValue?: string
 }
 
 export type KeyboardGroup = {