Move conditionals

scripts/copyUsedEmojis.ts

@@ -63,7 +63,6 @@ const allUsedEmojis = [
     '🔎',
     '🗺',
     '📷',
-    '↕️',
     '🆓',
     '😡',
     '🔁',
@@ -106,7 +105,8 @@ const allUsedEmojis = [
     '🧩',
     '🧠',
     '📓',
-    '😴'
+    '😴',
+    '🚦'
   ])
 ]
 

scripts/lib/initialExpressionContainers.ts

@@ -323,14 +323,27 @@ const yCombinatorHighlighted: FunctionExpressionParams = {
 
 export const vazr = initializeExpressionContainer(yCombinator)
 
-export const kysf = initializeExpressionContainer({
+export const ekyd = initializeExpressionContainer({
   checkType: 'isZero',
   condition: {
-    shorthandNumber: 2
+    shorthandNumber: 0
   },
   trueCase: {
+    shorthandNumber: 1
+  },
+  falseCase: {
+    shorthandNumber: 2
+  }
+})
+
+export const kysf = initializeExpressionContainer({
+  checkType: 'isZero',
+  condition: {
     shorthandNumber: 3
   },
+  trueCase: {
+    shorthandNumber: 2
+  },
   falseCase: {
     shorthandNumber: 1
   }
@@ -339,13 +352,13 @@ export const kysf = initializeExpressionContainer({
 export const pslb = initializeExpressionContainer({
   checkType: 'isZero',
   condition: {
-    shorthandNumber: 0
+    shorthandNumber: 3
   },
   trueCase: {
-    shorthandNumber: 5
+    shorthandNumber: 4
   },
   falseCase: {
-    shorthandNumber: 4
+    shorthandNumber: 5
   }
 })
 
@@ -1147,26 +1160,26 @@ export const whey = initializeExpressionContainer([
 
 export const anme = initializeExpressionContainer({
   checkType: 'isZero',
-  condition: 'blankNumberGrey',
-  trueCase: 'blankNumberPurple',
-  falseCase: 'blankNumberPink'
+  condition: 'blankNumberTeal',
+  trueCase: 'blankNumberYellow',
+  falseCase: 'blankNumberRed'
 })
 
 export const zpak = initializeExpressionContainer({
   checkType: 'isZero',
   condition: { shorthandNumber: 0, initialHighlight: true },
-  trueCase: 'blankNumberPurple',
-  falseCase: 'blankNumberPink'
+  trueCase: 'blankNumberYellow',
+  falseCase: 'blankNumberRed'
 })
 
 export const fylp = initializeExpressionContainer({
   checkType: 'isZero',
   condition: { shorthandNumber: 1, initialHighlight: true },
-  trueCase: 'blankNumberPurple',
-  falseCase: 'blankNumberPink'
+  trueCase: 'blankNumberYellow',
+  falseCase: 'blankNumberRed'
 })
 
-export const xgav = initializeExpressionContainer('blankNumberPurple')
+export const xgav = initializeExpressionContainer('blankNumberYellow')
 
 export const cmay = initializeExpressionContainer(
   isZeroParams(
@@ -1194,7 +1207,7 @@ export const rpcm = initializeExpressionContainer(
   )
 )
 
-export const cunp = initializeExpressionContainer('blankNumberPink')
+export const cunp = initializeExpressionContainer('blankNumberRed')
 
 export const psdd = initializeExpressionContainer(
   isZeroParams(
@@ -1277,17 +1290,17 @@ export const eryp = initializeExpressionContainer(
     'e',
     {
       shorthandNumberAfterConvert: 'number',
-      shorthandNumber: 3,
+      shorthandNumber: 1,
       initialHighlight: true
     },
     {
       shorthandNumberAfterConvert: 'number',
-      shorthandNumber: 1,
+      shorthandNumber: 2,
       initialHighlight: true
     },
     {
       shorthandNumberAfterConvert: 'number',
-      shorthandNumber: 2,
+      shorthandNumber: 0,
       initialHighlight: true
     }
   )
@@ -1300,14 +1313,14 @@ export const zmua = initializeExpressionContainer(
     'c',
     'd',
     'e',
-    numberParams(highlighted('f'), highlighted('g'), 3),
-    numberParams(highlighted('h'), highlighted('i'), 1),
-    numberParams(highlighted('j'), highlighted('k'), 2)
+    numberParams(highlighted('f'), highlighted('g'), 1),
+    numberParams(highlighted('h'), highlighted('i'), 2),
+    numberParams(highlighted('j'), highlighted('k'), 0)
   )
 )
 
 export const qzuv = initializeExpressionContainer(
-  numberParamsHighlightNumber('h', 'i', 1)
+  numberParamsHighlightNumber('f', 'g', 1)
 )
 
 export const lcce = initializeExpressionContainer(
@@ -1451,6 +1464,38 @@ export const xskc = initializeExpressionContainer([
   }
 ])
 
+export const gxhl = initializeExpressionContainer(
+  isZeroParams(
+    'a',
+    'b',
+    'c',
+    'd',
+    'e',
+    {
+      shorthandNumber: 2,
+      initialHighlight: true
+    },
+    [
+      {
+        shorthandFunc: 'add',
+        initialHighlight: true
+      },
+      highlighted('f')
+    ],
+    highlighted('f')
+  )
+)
+
+export const oyzh = initializeExpressionContainer({
+  checkType: 'isZero',
+  condition: highlighted('f'),
+  trueCase: { shorthandNumber: 2, initialHighlight: true },
+  falseCase: [
+    { shorthandFunc: 'add', initialHighlight: true },
+    highlighted('f')
+  ]
+})
+
 export const exoq = initializeExpressionContainer([
   {
     arg: 'f',

scripts/lib/runnerConfigs.ts

@@ -311,7 +311,7 @@ export const gtdu: ExpressionRunnerShorthandConfig = {
 export const guhy: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
   initialExpressionContainer: initialExpressionContainers.pslb,
-  initialState: 'trueCaseActive',
+  initialState: 'falseCaseActive',
   explanationsVisibility: 'visible'
 }
 
@@ -364,7 +364,7 @@ export const hykj: ExpressionRunnerShorthandConfig = {
 export const iatt: ExpressionRunnerShorthandConfig = {
   runner: 'predefined',
   initialExpressionContainers: [
-    initialExpressionContainers.kysf,
+    initialExpressionContainers.ekyd,
     initialExpressionContainers.zrwn
   ]
 }
@@ -577,8 +577,8 @@ export const qoms: ExpressionRunnerShorthandConfig = {
 
 export const rjfy: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
-  initialExpressionContainer: initialExpressionContainers.kysf,
-  initialState: 'falseCaseActive',
+  initialExpressionContainer: initialExpressionContainers.ekyd,
+  initialState: 'trueCaseActive',
   explanationsVisibility: 'visible'
 }
 
@@ -836,7 +836,7 @@ export const uwma: ExpressionRunnerShorthandConfig = {
 
 export const vozu: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
-  initialExpressionContainer: initialExpressionContainers.kysf,
+  initialExpressionContainer: initialExpressionContainers.ekyd,
   initialState: 'conditionActive',
   explanationsVisibility: 'visible'
 }
@@ -2039,7 +2039,7 @@ export const kiiq: ExpressionRunnerShorthandConfig = {
 
 export const zdpf: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
-  initialExpressionContainer: initialExpressionContainers.kysf
+  initialExpressionContainer: initialExpressionContainers.ekyd
 }
 
 export const jbqw: ExpressionRunnerShorthandConfig = {
@@ -2065,7 +2065,7 @@ export const oclg: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
   initialExpressionContainer: initialExpressionContainers.qzuv,
   showPriorities: true,
-  bottomRightBadgeOverrides: { h: '🅰️', i: '🅱️' }
+  bottomRightBadgeOverrides: { f: '🅰️', g: '🅱️' }
 }
 
 export const fton: ExpressionRunnerShorthandConfig = {
@@ -2163,6 +2163,14 @@ export const lxgj: ExpressionRunnerShorthandConfig = {
   }
 }
 
+export const wenx: ExpressionRunnerShorthandConfig = {
+  runner: 'simple',
+  initialExpressionContainer: initialExpressionContainers.gxhl,
+  showPriorities: true,
+  variableSize: 'sm',
+  containerSize: 'xs'
+}
+
 export const vlhb: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
   initialExpressionContainer: initialExpressionContainers.cmay,
@@ -2184,6 +2192,13 @@ export const awbq: ExpressionRunnerShorthandConfig = {
   variableSize: 'md'
 }
 
+export const crvj: ExpressionRunnerShorthandConfig = {
+  runner: 'simple',
+  initialExpressionContainer: initialExpressionContainers.oyzh,
+  showPriorities: true,
+  variableSize: 'md'
+}
+
 export const ghwe: ExpressionRunnerShorthandConfig = {
   runner: 'simple',
   initialExpressionContainer: initialExpressionContainers.aiyb,

src/components/ConditionalBorder.tsx

@@ -6,6 +6,7 @@ import { zIndices, colors, fontSizes } from 'src/lib/theme'
 import ExpressionRunnerContext from 'src/components/ExpressionRunnerContext'
 import { ExpressionRunnerContextProps } from 'src/types/ExpressionRunnerTypes'
 import EmojiNumber from 'src/components/EmojiNumber'
+import CustomEmoji from 'src/components/CustomEmoji'
 
 export interface ConditionalBorderProps {
   smallEmoji?: boolean
@@ -42,9 +43,9 @@ const width = (
   }
 }
 
-export const trueCaseColor = colors('deepPurple100')
-export const falseCaseColor = colors('pink100')
-export const conditionColor = colors('grey300')
+export const trueCaseColor = colors('orange100')
+export const falseCaseColor = colors('red100')
+export const conditionColor = colors('teal100')
 
 const ConditionalBorder = ({
   type,
@@ -90,7 +91,7 @@ const ConditionalBorder = ({
             <Emoji size={smallEmoji ? 'sm' : 'md'}>🔢</Emoji>
           )}
           {type === 'condition' && (
-            <Emoji size={smallEmoji ? 'sm' : 'md'}>↕️</Emoji>
+            <CustomEmoji size={smallEmoji ? 'sm' : 'md'} type="condition" />
           )}
         </span>
       )}

src/components/ConditionalExpressionBox.tsx

@@ -57,27 +57,27 @@ const ConditionalExpressionBox = ({
             `}
           >
             <ConditionalBorder
-              type="condition"
+              type="trueCase"
               shaded={
-                expression.state === 'trueCaseActive' ||
-                expression.state === 'falseCaseActive'
+                expression.state === 'falseCaseActive' ||
+                expression.state === 'conditionActive'
               }
             />
-            <ExpressionBox expression={expression.condition} />
+            <ExpressionBox expression={expression.trueCase} />
           </FlexCenter>
           <FlexCenter
             css={css`
               position: relative;
             `}
           >
             <ConditionalBorder
-              type="trueCase"
+              type="condition"
               shaded={
-                expression.state === 'falseCaseActive' ||
-                expression.state === 'conditionActive'
+                expression.state === 'trueCaseActive' ||
+                expression.state === 'falseCaseActive'
               }
             />
-            <ExpressionBox expression={expression.trueCase} />
+            <ExpressionBox expression={expression.condition} />
           </FlexCenter>
         </Flex>
       </ExpressionPriorityContext.Provider>

src/components/CustomEmoji/BlankNumberBrownSvg.tsx → src/components/CustomEmoji/BlankNumberRedSvg.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react'
 
-const BlankNumberBrownSvg = (props: React.SVGProps<SVGSVGElement>) => (
+const BlankNumberRedSvg = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 36 36" {...props}>
     <path
-      fill="#A1887F"
+      fill="#E57373"
       d="M36 32c0 2.209-1.791 4-4 4H4c-2.209 0-4-1.791-4-4V4c0-2.209 1.791-4 4-4h28c2.209 0 4 1.791 4 4v28z"
     />
     <g transform="translate(10.000000, 6.000000)" fill="#FFFFFF">
@@ -13,4 +13,4 @@ const BlankNumberBrownSvg = (props: React.SVGProps<SVGSVGElement>) => (
   </svg>
 )
 
-export default BlankNumberBrownSvg
+export default BlankNumberRedSvg

src/components/CustomEmoji/BlankNumberGreenSvg.tsx → src/components/CustomEmoji/BlankNumberTealSvg.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react'
 
-const BlankNumberGreenSvg = (props: React.SVGProps<SVGSVGElement>) => (
+const BlankNumberTealSvg = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 36 36" {...props}>
     <path
-      fill="#4CAF50"
+      fill="#4DB6AC"
       d="M36 32c0 2.209-1.791 4-4 4H4c-2.209 0-4-1.791-4-4V4c0-2.209 1.791-4 4-4h28c2.209 0 4 1.791 4 4v28z"
     />
     <g transform="translate(10.000000, 6.000000)" fill="#FFFFFF">
@@ -13,4 +13,4 @@ const BlankNumberGreenSvg = (props: React.SVGProps<SVGSVGElement>) => (
   </svg>
 )
 
-export default BlankNumberGreenSvg
+export default BlankNumberTealSvg