chore: typing for sidepeek components

components/TempDesignSystem/SidePeek/Content/index.tsx

@@ -5,6 +5,8 @@ import { Children, PropsWithChildren } from "react"
 import { CloseIcon } from "@/components/Icons"
 import Title from "@/components/TempDesignSystem/Text/Title"
 
+import { SidePeekContentProps } from "./types"
+
 import styles from "./content.module.css"
 
 export default function Content({
@@ -13,12 +15,7 @@ export default function Content({
   contentKey,
   isActive = false,
   onClose,
-}: PropsWithChildren<{
+}: PropsWithChildren<SidePeekContentProps>) {
-  title?: string
-  contentKey: string
-  isActive?: boolean
-  onClose?: () => void
-}>) {
   return isActive ? (
     <aside className={styles.content}>
       <header className={styles.header}>

components/TempDesignSystem/SidePeek/Content/types.ts

@@ -0,0 +1,6 @@
+export type SidePeekContentProps = {
+  title?: string
+  contentKey: string
+  isActive?: boolean
+  onClose?: () => void
+}

components/TempDesignSystem/SidePeek/index.tsx

@@ -5,15 +5,14 @@ import { Dialog, DialogTrigger, Modal } from "react-aria-components"
 
 import styles from "./sidePeek.module.css"
 
-type SidePeekProps = {
-  activeContent: string | null
-  onClose: (isOpen: boolean) => void
-}
 export default function SidePeek({
   children,
   onClose,
   activeContent,
-}: PropsWithChildren<SidePeekProps>) {
+}: PropsWithChildren<{
+  onClose: (isOpen: boolean) => void
+  activeContent: string | null
+}>) {
   return (
     <DialogTrigger>
       <Modal