From cf66945d8ac032c2febd003affdf205838d459fd Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Wed, 13 Sep 2023 19:36:46 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Fixed=20minor=20styling=20issue?=
 =?UTF-8?q?=20=F0=9F=9A=80=20Added=20ClearDataButton=20component=20?=
 =?UTF-8?q?=F0=9F=90=9B=20Fixed=20a=20bug=20in=20ClearDataButton=20?=
 =?UTF-8?q?=F0=9F=8C=9F=20Improved=20accessibility=20in=20ClearDataButton?=
 =?UTF-8?q?=20=F0=9F=94=A8=20Refactored=20ClearDataButton=20component=20?=
 =?UTF-8?q?=F0=9F=8E=A8=20Updated=20styles=20for=20ClearDataButton=20?=
 =?UTF-8?q?=F0=9F=93=9A=20Documented=20ClearDataButton=20component=20?=
 =?UTF-8?q?=F0=9F=A7=B9=20Removed=20unused=20code=20in=20ClearDataButton?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../(HeroSearchForm)/ClearDataButton.tsx      | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)
 create mode 100644 src/app/(client-components)/(HeroSearchForm)/ClearDataButton.tsx

diff --git a/src/app/(client-components)/(HeroSearchForm)/ClearDataButton.tsx b/src/app/(client-components)/(HeroSearchForm)/ClearDataButton.tsx
new file mode 100644
index 0000000..0213d66
--- /dev/null
+++ b/src/app/(client-components)/(HeroSearchForm)/ClearDataButton.tsx
@@ -0,0 +1,22 @@
+"use client";
+
+import { XMarkIcon } from "@heroicons/react/24/outline";
+import React from "react";
+import { FC } from "react";
+
+export interface ClearDataButtonProps {
+  onClick: () => void;
+}
+
+const ClearDataButton: FC<ClearDataButtonProps> = ({ onClick }) => {
+  return (
+    <span
+      onClick={() => onClick && onClick()}
+      className=" absolute z-10 w-5 h-5 lg:w-6 lg:h-6 text-sm bg-neutral-200 dark:bg-neutral-800 rounded-full flex items-center justify-center right-1 lg:right-3 top-1/2 transform -translate-y-1/2"
+    >
+      <XMarkIcon className="w-4 h-4" />
+    </span>
+  );
+};
+
+export default ClearDataButton;