@magmamath/students-features 0.9.2 → 0.9.4-rc.0

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

@@ -9,19 +9,15 @@ export const LAYOUT_STYLES_CONFIG = {
     paddingLeft: SPACING[800],
   },
   BASIC: { borderColor: 'transparent', paddingLeft: SPACING[800] },
-  ALGEBRA: { borderColor: COLORS.NEUTRAL_3, paddingLeft: SPACING[200] },
 } as const
 
 export const getLayoutConfigStyles = (characterType?: number, isMobile?: boolean) => {
   if (!characterType || !isMobile) return LAYOUT_STYLES_CONFIG.DEFAULT
 
-  const { Basic, AlgebraAdvanced, BasicPlus } = KEYBOARD_LAYOUTS
+  const { Basic } = KEYBOARD_LAYOUTS
 
   if (Basic.characterTypes.includes(characterType)) return LAYOUT_STYLES_CONFIG.BASIC
 
-  if ([...AlgebraAdvanced.characterTypes, ...BasicPlus.characterTypes].includes(characterType))
-    return LAYOUT_STYLES_CONFIG.ALGEBRA
-
   return LAYOUT_STYLES_CONFIG.DEFAULT
 }
 

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

@@ -39,6 +39,7 @@ import {
 import { Locale } from '../../../shared/translation'
 import { MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP } from '../components/AlgebraLayout/keyboardGroups'
 import { KeyboardUnitsGroupType, UnitKeyboardGroups } from '../components/UnitsLayout/types'
+import { MATH_ENTRY_UNDERLINED_KEYBOARD_GROUP } from '../components/UnderlinedLayout/keyboardGroups'
 
 function createKeyboardLocale(overrides: Partial<Record<KeyboardType, KeyboardGroup>>) {
   const base: Record<KeyboardType, KeyboardGroup> = {
@@ -55,6 +56,7 @@ function createKeyboardLocale(overrides: Partial<Record<KeyboardType, KeyboardGr
     [KeyboardType.BasicTime]: MATH_TIME_US_KEYBOARD_GROUP,
     [KeyboardType.AlgebraAdvanced]: MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP,
     [KeyboardType.Numpad]: MATH_ENTRY_NUMBERS_US_KEYBOARD_GROUP,
+    [KeyboardType.Underlined]: MATH_ENTRY_UNDERLINED_KEYBOARD_GROUP,
   }
   return { ...base, ...overrides }
 }

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

@@ -30,7 +30,6 @@ export const KEYBOARD_LAYOUTS = {
       MyScriptMathCharacterTypes.NUMBERS,
       MyScriptMathCharacterTypes.NUMBERS_AND_X,
       MyScriptMathCharacterTypes.NUMBERS_AND_MULTIPLICATION,
-      MyScriptMathCharacterTypes.NUMBERS_RATIONAL,
       MyScriptMathCharacterTypes.OPERATORS,
       MyScriptMathCharacterTypes.PERCENT,
     ],
@@ -55,6 +54,7 @@ export const KEYBOARD_LAYOUTS = {
     characterTypes: [
       MyScriptMathCharacterTypes.GEOM_ANGLES,
       MyScriptMathCharacterTypes.GEOM_COORDINATE,
+      MyScriptMathCharacterTypes.NUMBERS_RATIONAL,
     ],
   },
 }

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

@@ -42,6 +42,9 @@ import { EqualsIcon } from '../../../../shared/icons/keyboard/EqualsIcon/EqualsI
 import { AbsoluteValueIcon } from '../../../../shared/icons/keyboard/AbsoluteValueIcon/AbsoluteValueIcon'
 import { IntervalIcon } from '../../../../shared/icons/keyboard/IntervalIcon/IntervalIcon'
 import { createMathKeysGroup } from './helpers'
+import { UnderlinedTenIcon } from '../../../../shared/icons/keyboard/UnderlinedTenIcon/UnderlinedTenIcon'
+import { UnderlinedOneIcon } from '../../../../shared/icons/keyboard/UnderlinedOneIcon/UnderlinedOneIcon'
+import { UnderlinedUIcon } from '../../../../shared/icons/keyboard/UnderlinedUIcon/UnderlinedUIcon'
 
 export const MATH_BASIC_OPERATORS = createMathKeysGroup({
   ADDITION: {
@@ -266,4 +269,22 @@ export const MATH_BASIC_OPERATORS = createMathKeysGroup({
     mathliveValue: '$\\left[, \\right]$',
     katexValue: '[ , ]',
   },
+  UNDERLINED_TEN: {
+    icon: <UnderlinedTenIcon {...DEFAULT_KEY_ICON_PROPS} />,
+    mathliveValue: '\\underline{10}',
+    katexValue: '10̲',
+    spreadsheetValue: 'TEN',
+  },
+  UNDERLINED_ONE: {
+    icon: <UnderlinedOneIcon {...DEFAULT_KEY_ICON_PROPS} />,
+    mathliveValue: '\\underline{1}',
+    katexValue: '1̲',
+    spreadsheetValue: 'ONE_FOOT_NOTE',
+  },
+  UNDERLINED_U: {
+    icon: <UnderlinedUIcon {...DEFAULT_KEY_ICON_PROPS} />,
+    mathliveValue: '\\underline{u}',
+    katexValue: 'U̲',
+    spreadsheetValue: 'FRACTION',
+  },
 })

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

@@ -27,4 +27,5 @@ export enum MathEntryKeyboardGroupId {
   CURRENCY_SW = 'math-entry-currency-sw',
   CURRENCY_UK = 'math-entry-currency-uk',
   CURRENCY_US = 'math-entry-currency-us',
+  UNDERLINED = 'math-entry-underlined',
 }

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

@@ -13,6 +13,7 @@ export const enum KeyboardType {
   BasicPlusPlus = 'BasicPlusPlus',
   BasicPlusPlusMobile = 'BasicPlusPlusMobile',
   Numpad = 'Numpad',
+  Underlined = 'Underlined',
 }
 
 export type KeyboardKey = {
@@ -44,6 +45,7 @@ export type KeyboardGroup = {
 
 export type KeyboardLayoutProps = {
   onKeyPress: (key: KeyboardKeyValue) => void
+  onLayoutChange?: (isSecondaryLayout: boolean) => void
   color?: SelectOptionColor
   isDisabled?: boolean
   disabledKeys?: KeyboardKey[]

package/src/shared/icons/keyboard/UnderlinedOneIcon/UnderlinedOneIcon.tsx

@@ -0,0 +1,17 @@
+import React from 'react'
+import { IconProps } from '../../icon.types'
+import Svg, { Path } from 'react-native-svg'
+
+export const UnderlinedOneIcon = ({ size = 20, color }: IconProps) => {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 17 17" fill="none">
+      <Path d="M7.93176 12.1924V3.83738H6.46176V1.84238H10.0918V12.1924H7.93176Z" fill={color} />
+      <Path
+        d="M2.15088 15.1924H15.1509"
+        stroke={color}
+        stroke-width="1.2"
+        stroke-linecap="square"
+      />
+    </Svg>
+  )
+}

package/src/shared/icons/keyboard/UnderlinedTenIcon/UnderlinedTenIcon.tsx

@@ -0,0 +1,20 @@
+import React from 'react'
+import { IconProps } from '../../icon.types'
+import Svg, { Path } from 'react-native-svg'
+
+export const UnderlinedTenIcon = ({ size = 20, color }: IconProps) => {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 17 17" fill="none">
+      <Path
+        d="M3.25158 12.1924V3.83738H1.78158V1.84238H5.41158V12.1924H3.25158ZM11.4998 1.69238C14.0348 1.69238 15.5198 3.52238 15.5198 6.80738V7.16738C15.5198 10.4524 14.0348 12.2824 11.4998 12.2824C8.96482 12.2824 7.47982 10.4524 7.47982 7.16738V6.80738C7.47982 3.52238 8.96482 1.69238 11.4998 1.69238ZM9.65482 7.16738C9.65482 9.38738 10.2698 10.3024 11.4998 10.3024C12.7298 10.3024 13.3448 9.38738 13.3448 7.16738V6.80738C13.3448 4.58738 12.7298 3.67238 11.4998 3.67238C10.2698 3.67238 9.65482 4.58738 9.65482 6.80738V7.16738Z"
+        fill={color}
+      />
+      <path
+        d="M2.15088 15.1924H15.1509"
+        stroke={color}
+        stroke-width="1.2"
+        stroke-linecap="square"
+      />
+    </Svg>
+  )
+}

package/src/shared/icons/keyboard/UnderlinedUIcon/UnderlinedUIcon.tsx

@@ -0,0 +1,20 @@
+import React from 'react'
+import { IconProps } from '../../icon.types'
+import Svg, { Path } from 'react-native-svg'
+
+export const UnderlinedUIcon = ({ size = 20, color }: IconProps) => {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 17 17" fill="none">
+      <Path
+        d="M10.6573 1.69238H12.8473V8.42738C12.8473 10.7824 11.4523 12.4174 8.6473 12.4174C5.8273 12.4174 4.4473 10.7824 4.4473 8.42738V1.69238H6.6223V8.26238C6.6223 9.56738 7.4023 10.3474 8.6473 10.3474C9.8923 10.3474 10.6573 9.56738 10.6573 8.26238V1.69238Z"
+        fill={color}
+      />
+      <Path
+        d="M2.15088 15.1924H15.1509"
+        stroke={color}
+        stroke-width="1.2"
+        stroke-linecap="square"
+      />
+    </Svg>
+  )
+}