diff --git a/README.md b/README.md index b44fa5d..a8d8696 100644 --- a/README.md +++ b/README.md @@ -28,7 +28,7 @@ NextJS and React Snippets with TypeScript support as well!🚀 2. `rafect` (React Functional Component with Types) ```tsx - import { FC } from 'react'; + import { FC } from "react"; interface Props {} const Component: FC = () => { return
; @@ -81,9 +81,22 @@ NextJS and React Snippets with TypeScript support as well!🚀 3. `taytay` (NextPage component with NextPage type) ```tsx - import type { NextPage } from 'next'; + import type { NextPage } from "next"; const Page: NextPage = () => { return <>; }; export default Page; ``` + +4. `nextct` (Next JS Component with NextComponentType and Props) + + ```tsx + import type { NextComponentType, NextPageContext } from "next"; + interface Props {} + const Component: NextComponentType = ( + props: Props + ) => { + return
; + }; + export default Component; + ``` diff --git a/snippets/next-typescript.code-snippets b/snippets/next-typescript.code-snippets index 8ccd2eb..e175312 100644 --- a/snippets/next-typescript.code-snippets +++ b/snippets/next-typescript.code-snippets @@ -38,5 +38,22 @@ "export default ${1:${TM_FILENAME}}" ], "description": "NextPage component with NextPage type" - } + }, + "nct": { + "prefix": "nextct", + "body": [ + "import type { NextComponentType, NextPageContext } from \"next\";", + "interface Props {}", + "const ${1:${TM_FILENAME_BASE}}: NextComponentType = (", + " props: Props,", + ") => {", + " return (", + "
", + " )", + "}", + "", + "export default ${1:${TM_FILENAME_BASE}}" + ], + "description": "Next JS Component with NextComponentType and Props" + } }