From 95c9c58f3a74def02b0781add8b77c3648933274 Mon Sep 17 00:00:00 2001
From: David Totrashvili <8580261+totraev@users.noreply.github.com>
Date: Thu, 19 Dec 2024 22:40:04 +0500
Subject: [PATCH] feat: add hidden field (#71)

---
 .changeset/nice-keys-rest.md                  |  5 ++++
 src/index.tsx                                 |  1 +
 .../form/HiddenField/HiddenField.stories.tsx  | 28 +++++++++++++++++++
 src/widgets/form/HiddenField/HiddenField.tsx  |  9 ++++++
 src/widgets/form/HiddenField/index.ts         |  1 +
 5 files changed, 44 insertions(+)
 create mode 100644 .changeset/nice-keys-rest.md
 create mode 100644 src/widgets/form/HiddenField/HiddenField.stories.tsx
 create mode 100644 src/widgets/form/HiddenField/HiddenField.tsx
 create mode 100644 src/widgets/form/HiddenField/index.ts

diff --git a/.changeset/nice-keys-rest.md b/.changeset/nice-keys-rest.md
new file mode 100644
index 0000000..76559e5
--- /dev/null
+++ b/.changeset/nice-keys-rest.md
@@ -0,0 +1,5 @@
+---
+"@babylonlabs-io/bbn-core-ui": patch
+---
+
+add hidden field
diff --git a/src/index.tsx b/src/index.tsx
index 02b69dc..8c5f96e 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -19,6 +19,7 @@ export * from "./widgets/form/TextField";
 export * from "./widgets/form/CheckboxField";
 export * from "./widgets/form/RadioField";
 export * from "./widgets/form/SelectField";
+export * from "./widgets/form/HiddenField";
 export * from "./widgets/form/hooks";
 export * from "./widgets/form/hooks";
 
diff --git a/src/widgets/form/HiddenField/HiddenField.stories.tsx b/src/widgets/form/HiddenField/HiddenField.stories.tsx
new file mode 100644
index 0000000..f8fda23
--- /dev/null
+++ b/src/widgets/form/HiddenField/HiddenField.stories.tsx
@@ -0,0 +1,28 @@
+import type { Meta, StoryObj } from "@storybook/react";
+
+import { Form } from "@/widgets/form/Form";
+
+import { HiddenField } from "./HiddenField";
+
+const meta: Meta<typeof HiddenField> = {
+  component: HiddenField,
+  tags: ["autodocs"],
+};
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  args: {
+    name: "hidden_field",
+    value: "test",
+  },
+  decorators: [
+    (Story) => (
+      <Form onChange={console.log}>
+        <Story />
+      </Form>
+    ),
+  ],
+};
diff --git a/src/widgets/form/HiddenField/HiddenField.tsx b/src/widgets/form/HiddenField/HiddenField.tsx
new file mode 100644
index 0000000..190ddc4
--- /dev/null
+++ b/src/widgets/form/HiddenField/HiddenField.tsx
@@ -0,0 +1,9 @@
+import type { HTMLProps } from "react";
+import { useFormContext } from "react-hook-form";
+
+export function HiddenField({ name, ...inputProps }: HTMLProps<HTMLInputElement> & { name: string }) {
+  const { register } = useFormContext();
+  const props = register(name);
+
+  return <input {...inputProps} {...props} type="hidden" />;
+}
diff --git a/src/widgets/form/HiddenField/index.ts b/src/widgets/form/HiddenField/index.ts
new file mode 100644
index 0000000..54fce16
--- /dev/null
+++ b/src/widgets/form/HiddenField/index.ts
@@ -0,0 +1 @@
+export * from "./HiddenField";