✨ Add AB test block

Closes #449

apps/builder/src/components/icons.tsx

@@ -594,3 +594,13 @@ export const TableIcon = (props: IconProps) => (
     <path d="M9 3H5a2 2 0 0 0-2 2v4m6-6h10a2 2 0 0 1 2 2v4M9 3v18m0 0h10a2 2 0 0 0 2-2V9M9 21H5a2 2 0 0 1-2-2V9m0 0h18"></path>
   </Icon>
 )
+
+export const ShuffleIcon = (props: IconProps) => (
+  <Icon viewBox="0 0 24 24" {...featherIconsBaseProps} {...props}>
+    <polyline points="16 3 21 3 21 8"></polyline>
+    <line x1="4" y1="20" x2="21" y2="3"></line>
+    <polyline points="21 16 21 21 16 21"></polyline>
+    <line x1="15" y1="15" x2="21" y2="21"></line>
+    <line x1="4" y1="4" x2="9" y2="9"></line>
+  </Icon>
+)

apps/builder/src/components/inputs/NumberInput.tsx

@@ -9,6 +9,7 @@ import {
   HStack,
   FormControl,
   FormLabel,
+  Stack,
 } from '@chakra-ui/react'
 import { Variable, VariableString } from '@typebot.io/schemas'
 import { useEffect, useState } from 'react'
@@ -27,6 +28,7 @@ type Props<HasVariable extends boolean> = {
   label?: string
   moreInfoTooltip?: string
   isRequired?: boolean
+  direction?: 'row' | 'column'
   onValueChange: (value?: Value<HasVariable>) => void
 } & Omit<NumberInputProps, 'defaultValue' | 'value' | 'onChange' | 'isRequired'>
 
@@ -38,6 +40,7 @@ export const NumberInput = <HasVariable extends boolean>({
   label,
   moreInfoTooltip,
   isRequired,
+  direction,
   ...props
 }: Props<HasVariable>) => {
   const [value, setValue] = useState(defaultValue?.toString() ?? '')
@@ -90,7 +93,7 @@ export const NumberInput = <HasVariable extends boolean>({
 
   return (
     <FormControl
-      as={HStack}
+      as={direction === 'column' ? Stack : HStack}
       isRequired={isRequired}
       justifyContent="space-between"
       width={label ? 'full' : 'auto'}