From 936e65a9bc0cbcc4a594db1dcbed1bbe96ee7681 Mon Sep 17 00:00:00 2001
From: m-abe-dev <66056064+m-abe-dev@users.noreply.github.com>
Date: Mon, 17 Jun 2024 22:35:35 +0900
Subject: [PATCH] chore(web): create color field (#1016)

---
 web/src/beta/ui/fields/ColorField.tsx | 18 ++++++++++++++++++
 web/src/beta/ui/fields/index.ts       |  1 +
 2 files changed, 19 insertions(+)
 create mode 100644 web/src/beta/ui/fields/ColorField.tsx

diff --git a/web/src/beta/ui/fields/ColorField.tsx b/web/src/beta/ui/fields/ColorField.tsx
new file mode 100644
index 0000000000..d57cef92ce
--- /dev/null
+++ b/web/src/beta/ui/fields/ColorField.tsx
@@ -0,0 +1,18 @@
+import { FC } from "react";
+
+import { ColorInput, ColorInputProps } from "@reearth/beta/lib/reearth-ui";
+
+import CommonField, { CommonFieldProps } from "./CommonField";
+
+export type ColorInputFieldProps = CommonFieldProps &
+  Pick<ColorInputProps, "value" | "size" | "onChange" | "alphaDisabled" | "disabled">;
+
+const ColorInputField: FC<ColorInputFieldProps> = ({ title, description, ...props }) => {
+  return (
+    <CommonField title={title} description={description}>
+      <ColorInput {...props} />
+    </CommonField>
+  );
+};
+
+export default ColorInputField;
diff --git a/web/src/beta/ui/fields/index.ts b/web/src/beta/ui/fields/index.ts
index 1197c87390..b88ebc84b5 100644
--- a/web/src/beta/ui/fields/index.ts
+++ b/web/src/beta/ui/fields/index.ts
@@ -1,2 +1,3 @@
 export * from "./CommonField";
 export * from "./InputField";
+export * from "./ColorField";