diff --git a/lib/component/progress/DangerProgress.tsx b/lib/component/progress/DangerProgress.tsx
index 45e728a..7d5b486 100644
--- a/lib/component/progress/DangerProgress.tsx
+++ b/lib/component/progress/DangerProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const DangerProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function DangerProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-danger)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-DangerProgress.displayName = "DangerProgress";
-
-export default DangerProgress;
+}
diff --git a/lib/component/progress/DarkProgress.tsx b/lib/component/progress/DarkProgress.tsx
index 8d413c3..e66d20e 100644
--- a/lib/component/progress/DarkProgress.tsx
+++ b/lib/component/progress/DarkProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const DarkProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function DarkProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-dark)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-DarkProgress.displayName = "DarkProgress";
-
-export default DarkProgress;
+}
diff --git a/lib/component/progress/InfoProgress.tsx b/lib/component/progress/InfoProgress.tsx
index 169f224..7b070af 100644
--- a/lib/component/progress/InfoProgress.tsx
+++ b/lib/component/progress/InfoProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const InfoProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function InfoProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-info)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-InfoProgress.displayName = "InfoProgress";
-
-export default InfoProgress;
+}
diff --git a/lib/component/progress/LightProgress.tsx b/lib/component/progress/LightProgress.tsx
index b64e767..de79c32 100644
--- a/lib/component/progress/LightProgress.tsx
+++ b/lib/component/progress/LightProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const LightProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function LightProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-dark)"
 			progressColor="var(--color-light)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-LightProgress.displayName = "LightProgress";
-
-export default LightProgress;
+}
diff --git a/lib/component/progress/MoltenProgress.tsx b/lib/component/progress/MoltenProgress.tsx
index 7a42cf9..fd42d29 100644
--- a/lib/component/progress/MoltenProgress.tsx
+++ b/lib/component/progress/MoltenProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const MoltenProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function MoltenProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-molten)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-MoltenProgress.displayName = "MoltenProgress";
-
-export default MoltenProgress;
+}
diff --git a/lib/component/progress/PrimaryProgress.tsx b/lib/component/progress/PrimaryProgress.tsx
index e23b4af..0f68e8c 100644
--- a/lib/component/progress/PrimaryProgress.tsx
+++ b/lib/component/progress/PrimaryProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const PrimaryProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function PrimaryProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-primary)"
-			ref={ref}
 			{...props}
 		/>
 	);
-});
-
-PrimaryProgress.displayName = "PrimaryProgress";
-
-export default PrimaryProgress;
+}
diff --git a/lib/component/progress/Progress.tsx b/lib/component/progress/Progress.tsx
index 25f7b2d..ef934d9 100644
--- a/lib/component/progress/Progress.tsx
+++ b/lib/component/progress/Progress.tsx
@@ -1,9 +1,9 @@
 import type { ProgressProps } from "$/types/ProgressTypes";
 import clsx from "clsx";
-import { forwardRef, useMemo } from "react";
+import { useMemo } from "react";
 
 
-const Progress = forwardRef<HTMLDivElement, ProgressProps>(({
+export default function Progress({
 	id,
 	className,
 	value,
@@ -15,7 +15,7 @@ const Progress = forwardRef<HTMLDivElement, ProgressProps>(({
 	tabIndex,
 	progressColor,
 	backgroundColor
-}, ref ) => {
+}: Readonly<ProgressProps>){
 	const percentage = useMemo(() => {
 		const num = !value || Number.isNaN(value) ? min : Math.max(value, min);
 		const den = (!value || Number.isNaN(value) ? max : Math.max(value, max)) - min;
@@ -55,7 +55,6 @@ const Progress = forwardRef<HTMLDivElement, ProgressProps>(({
 			aria-valuenow={value ? Math.round(value * 10000) / 100 : undefined}
 			aria-label={label}
 			tabIndex={tabIndex ?? 0}
-			ref={ref}
 		>
 			<div
 				className={clsx(
@@ -77,8 +76,4 @@ const Progress = forwardRef<HTMLDivElement, ProgressProps>(({
 			/>
 		</div>
 	);
-});
-
-Progress.displayName = "Progress";
-
-export default Progress;
+}
diff --git a/lib/component/progress/SecondaryProgress.tsx b/lib/component/progress/SecondaryProgress.tsx
index 309cadb..2b94a6e 100644
--- a/lib/component/progress/SecondaryProgress.tsx
+++ b/lib/component/progress/SecondaryProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const SecondaryProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function SecondaryProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-gray-300)"
 			progressColor="var(--color-neutral-500)"
-			ref={ref}
 			{...props}
 		/>
 	);
-});
-
-SecondaryProgress.displayName = "SecondaryProgress";
-
-export default SecondaryProgress;
+}
diff --git a/lib/component/progress/SuccessProgress.tsx b/lib/component/progress/SuccessProgress.tsx
index 3fd5818..0c17edd 100644
--- a/lib/component/progress/SuccessProgress.tsx
+++ b/lib/component/progress/SuccessProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const SuccessProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function SuccessProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-success)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-SuccessProgress.displayName = "SuccessProgress";
-
-export default SuccessProgress;
+}
diff --git a/lib/component/progress/TertiaryProgress.tsx b/lib/component/progress/TertiaryProgress.tsx
index 7af6006..b989902 100644
--- a/lib/component/progress/TertiaryProgress.tsx
+++ b/lib/component/progress/TertiaryProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const TertiaryProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function TertiaryProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-tertiary)"
 			{...props}
-			ref={ref}
 		/>
 	);
-});
-
-TertiaryProgress.displayName = "TertiaryProgress";
-
-export default TertiaryProgress;
+}
diff --git a/lib/component/progress/WarningProgress.tsx b/lib/component/progress/WarningProgress.tsx
index e139990..6e50b00 100644
--- a/lib/component/progress/WarningProgress.tsx
+++ b/lib/component/progress/WarningProgress.tsx
@@ -1,21 +1,15 @@
 import type { ThemedProgressProps } from "$/types/ProgressTypes";
-import { forwardRef } from "react";
 import Progress from "./Progress";
 
 
-const WarningProgress = forwardRef<HTMLDivElement, ThemedProgressProps>(({
+export default function WarningProgress({
 	...props
-}, ref ) => {
+}: Readonly<ThemedProgressProps>){
 	return (
 		<Progress
 			backgroundColor="var(--color-neutral)"
 			progressColor="var(--color-warning)"
-			ref={ref}
 			{...props}
 		/>
 	);
-});
-
-WarningProgress.displayName = "WarningProgress";
-
-export default WarningProgress;
+}