chore(ui): login page & workflow page (#3046)

* login page & number input & multirow select & llm select

* workflow

* adjust nodes

packages/web/components/common/Input/NumberInput/index.tsx

@@ -7,28 +7,50 @@ import {
   NumberInputProps
 } from '@chakra-ui/react';
 import React from 'react';
+import MyIcon from '../../Icon';
+import { UseFormRegister } from 'react-hook-form';
 
 type Props = Omit<NumberInputProps, 'onChange'> & {
-  onChange: (e?: number) => any;
+  onChange?: (e?: number) => any;
   placeholder?: string;
+  register?: UseFormRegister<any>;
+  name?: string;
+  bg?: string;
 };
 
 const MyNumberInput = (props: Props) => {
+  const { register, name, onChange, placeholder, bg, ...restProps } = props;
+
   return (
     <NumberInput
-      {...props}
+      {...restProps}
       onChange={(e) => {
+        if (!onChange) return;
         if (isNaN(Number(e))) {
-          props?.onChange();
+          onChange();
         } else {
-          props?.onChange(Number(e));
+          onChange(Number(e));
         }
       }}
     >
-      <NumberInputField placeholder={props?.placeholder} />
+      <NumberInputField
+        bg={bg}
+        placeholder={placeholder}
+        {...(register && name
+          ? register(name, {
+              required: props.isRequired,
+              min: props.min,
+              max: props.max
+            })
+          : {})}
+      />
       <NumberInputStepper>
-        <NumberIncrementStepper />
-        <NumberDecrementStepper />
+        <NumberIncrementStepper>
+          <MyIcon name={'core/chat/chevronUp'} width={'12px'} />
+        </NumberIncrementStepper>
+        <NumberDecrementStepper>
+          <MyIcon name={'core/chat/chevronDown'} width={'12px'} />
+        </NumberDecrementStepper>
       </NumberInputStepper>
     </NumberInput>
   );