共通コンポーネント：ヘッダーの実装③

src/components/common/Tab/index.tsx

@@ -10,7 +10,7 @@ type Props = {
 export default function Tab({ text, isActive = false, onClick }: Props) {
   return (
     <HeadlessTab
-      className={cn("py-2", "font-bold", {
+      className={cn("py-2", "font-bold", "cursor-pointer", {
         "border-b-2": isActive,
       })}
       onClick={onClick}

src/consts/index.ts

@@ -0,0 +1 @@
+export * from "~/consts/page";

src/consts/page.ts

@@ -0,0 +1,13 @@
+/**
+ * ページ関連の定数
+ */
+
+/**
+ * パスの定数
+ */
+export const PAGE_PATH = {
+  ABOUT: "/about",
+  HOME: "/home",
+  PRODUCTIONS: "/productions",
+  WORKS: "/works",
+} as const;

src/utils/cn/index.ts

@@ -2,11 +2,13 @@
 import { twMerge } from "tailwind-merge";
 
 /**
- * クラス名管理カスタムヘルパー関数。
+ * クラス名管理カスタムヘルパー関数。\
  * 引数の順番に応じてグルーピングされたスタイルが定義される。
  *
- * 第1引数：余白
- * 第2引数：フォント
+ * 第1引数：余白、大きさ\
+ * 第2引数：配置\
+ * 第3引数：フォント\
+ * 第4引数：装飾\
  * 末端引数：オブジェクトとし、条件分岐によって変わるスタイル
  *
  * @param inputs クラス名