Initial commit with 🏗️ Scaffold-ETH 2 @ 1.0.2

packages/nextjs/components/scaffold-eth/Input/Bytes32Input.tsx

@@ -0,0 +1,31 @@
+import { useCallback } from "react";
+import { hexToString, isHex, stringToHex } from "viem";
+import { CommonInputProps, InputBase } from "~~/components/scaffold-eth";
+
+export const Bytes32Input = ({ value, onChange, name, placeholder, disabled }: CommonInputProps) => {
+  const convertStringToBytes32 = useCallback(() => {
+    if (!value) {
+      return;
+    }
+    onChange(isHex(value) ? hexToString(value, { size: 32 }) : stringToHex(value, { size: 32 }));
+  }, [onChange, value]);
+
+  return (
+    <InputBase
+      name={name}
+      value={value}
+      placeholder={placeholder}
+      onChange={onChange}
+      disabled={disabled}
+      suffix={
+        <button
+          className="self-center cursor-pointer text-xl font-semibold px-4 text-accent"
+          onClick={convertStringToBytes32}
+          type="button"
+        >
+          #
+        </button>
+      }
+    />
+  );
+};