move docs to collection class

souporserious · Oct 10, 2024 · 37c5947 · 37c5947
1 parent 6a74c71
commit 37c5947
Show file tree

Hide file tree

Showing 9 changed files with 35 additions and 34 deletions.
diff --git a/apps/site/app/(home)/QuickSteps.tsx b/apps/site/app/(home)/QuickSteps.tsx
@@ -8,20 +8,20 @@ const steps = [
   {
     title: 'Collect',
     content: `Start by collecting structured data from your file system. Collections help organize and validate your source code.`,
-    code: `import { collection } from 'renoun/collections'
+    code: `import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 
-const posts = collection<{ default: MDXContent }>({
+const posts = new Collection<{ default: MDXContent }>({
   filePattern: 'docs/*.mdx'
 })`,
   },
   {
     title: 'Render',
     content: `Easily query and render your file system sources programmatically using a fluent API.`,
-    code: `import { collection } from 'renoun/collections'
+    code: `import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 
-const posts = collection<{ default: MDXContent }>({
+const posts = new Collection<{ default: MDXContent }>({
   filePattern: 'docs/*.mdx'
 })
 

diff --git a/apps/site/docs/02.getting-started.mdx b/apps/site/docs/02.getting-started.mdx
@@ -46,10 +46,10 @@ const posts = collection({
 We can then constrain the collection by providing types for the exports we're interested in querying:
 
 ```tsx
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 
-const posts = collection<{
+const posts = new Collection<{
   default: MDXContent
 }>({
   filePattern: 'posts/*.mdx',
@@ -59,10 +59,10 @@ const posts = collection<{
 Finally, we can use this collection to render the contents of our MDX files:
 
 ```tsx
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 
-const posts = collection<{
+const posts = new Collection<{
   default: MDXContent
 }>({
   filePattern: 'posts/*.mdx',
@@ -140,7 +140,7 @@ By using schemas, you can validate module exports and ensure they remain consist
 In our Button component example, we can validate the front matter of the MDX file at the call site of our collection using a schema:
 
 ```tsx
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 import { z } from 'zod'
 
@@ -151,7 +151,7 @@ const frontmatterSchema = z.object({
   tags: z.array(z.string()).optional(),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: z.infer<typeof frontmatterSchema>
 }>({

diff --git a/apps/site/guides/04.zod.mdx b/apps/site/guides/04.zod.mdx
@@ -6,7 +6,7 @@ export const metadata = {
 }
 
 ```ts allowErrors
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import { z } from 'zod'
 
 const frontmatterSchema = z.object({
@@ -16,7 +16,7 @@ const frontmatterSchema = z.object({
   tags: z.array(z.string()).optional(),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: z.infer<typeof frontmatterSchema>
 }>('posts/.mdx', {
@@ -65,7 +65,7 @@ const frontmatterSchema = z.object({
 We can now apply the Zod `frontmatterSchema` to your collection using the `schema` option in the `collection` utility:
 
 ```ts allowErrors focusedLines="1-2,12-20"
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 import { z } from 'zod'
 
@@ -76,7 +76,7 @@ const frontmatterSchema = z.object({
   tags: z.array(z.string()).optional(),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: z.infer<typeof frontmatterSchema>
 }>('posts/.mdx', {

diff --git a/apps/site/guides/05.valibot.mdx b/apps/site/guides/05.valibot.mdx
@@ -6,7 +6,7 @@ export const metadata = {
 }
 
 ```ts allowErrors
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import * as v from 'valibot'
 
 const frontmatterSchema = v.object({
@@ -16,7 +16,7 @@ const frontmatterSchema = v.object({
   tags: v.optional(v.array(v.string())),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: v.InferInput<typeof frontmatterSchema>
 }>('posts/.mdx', {
@@ -65,7 +65,7 @@ const frontmatterSchema = v.object({
 We can now apply the Valibot `frontmatterSchema` to your collection using the `schema` option in the `collection` utility:
 
 ```ts allowErrors focusedLines="1-2,12-20"
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 import * as v from 'valibot'
 
@@ -76,7 +76,7 @@ const frontmatterSchema = v.object({
   tags: v.optional(v.array(v.string())),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: v.InferInput<typeof frontmatterSchema>
 }>('posts/.mdx', {

diff --git a/examples/blog/collections.ts b/examples/blog/collections.ts
@@ -1,4 +1,4 @@
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 import { z } from 'zod'
 
@@ -9,7 +9,7 @@ const frontmatterSchema = z.object({
   tags: z.array(z.string()).optional(),
 })
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   default: MDXContent
   frontmatter: z.infer<typeof frontmatterSchema>
 }>(

diff --git a/examples/design-system/app/components/[...slug]/page.tsx b/examples/design-system/app/components/[...slug]/page.tsx
@@ -1,5 +1,5 @@
 import { CodeBlock, Tokens } from 'renoun/components'
-import { collection, type ExportSource } from 'renoun/collections'
+import { Collection, type ExportSource } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 import Link from 'next/link'
 import { notFound } from 'next/navigation'
@@ -15,7 +15,7 @@ export async function generateStaticParams() {
     .map((source) => ({ slug: source.getPathSegments() }))
 }
 
-const ComponentsReadmeCollection = collection<{ default: MDXContent }>(
+const ComponentsReadmeCollection = new Collection<{ default: MDXContent }>(
   {
     baseDirectory: 'components',
     basePath: 'components',

diff --git a/examples/design-system/collections.ts b/examples/design-system/collections.ts
@@ -1,10 +1,10 @@
-import { collection, type FileSystemSource } from 'renoun/collections'
+import { Collection, type FileSystemSource } from 'renoun/collections'
 
 type ComponentSchema = Record<string, React.ComponentType>
 
 export type ComponentSource = FileSystemSource<ComponentSchema>
 
-export const ComponentsCollection = collection<ComponentSchema>(
+export const ComponentsCollection = new Collection<ComponentSchema>(
   {
     baseDirectory: 'components',
     basePath: 'components',

diff --git a/packages/renoun/src/collections/docs/01.recipes.mdx b/packages/renoun/src/collections/docs/01.recipes.mdx
@@ -15,9 +15,9 @@ By organizing content into structured collections, we can easily generate static
 A collection is created by calling the `collection` function with a glob pattern and optional options:
 
 ```ts allowErrors filename="@/collections.ts"
-import { collection, type SourceOf } from 'renoun'
+import { Collection, type SourceOf } from 'renoun'
 
-export const PostsCollection = collection<{
+export const PostsCollection = new Collection<{
   frontmatter: {
     title: string
     description: string
@@ -268,7 +268,7 @@ export const metadata = {
 To use the metadata, we can get the value of the `metadata` constant from the file and use it to set the page title and description:
 
 ```tsx allowErrors filename="components/[slug]/page.tsx"
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import { notFound } from 'next/navigation'
 
 type Schema = {
@@ -278,7 +278,7 @@ type Schema = {
   }
 }
 
-export const Components = collection<Schema>({
+export const Components = new Collection<Schema>({
   filePattern: '@/components/**/index.{ts,tsx}',
 })
 
@@ -336,11 +336,11 @@ This works by finding the index file related to the root directory we're targeti
 
 ```tsx allowErrors
 import type { MDXContent, SourceOf } from 'renoun'
-import { collection } from 'renoun/collections'
+import { Collection } from 'renoun/collections'
 import { notFound } from 'next/navigation'
 import { getSiteMetadata } from '@/utils'
 
-export const Posts = collection<{
+export const Posts = new Collection<{
   default: MDXContent
   frontmatter: {
     title: string
@@ -495,10 +495,11 @@ export default async function Page({ params }) {
 ### components/[slug]/[example]/page.tsx
 
 ```tsx allowErrors
-import { collection, Tokens } from 'renoun'
+import { Collection } from 'renoun/collections'
+import { Tokens } from 'renoun/components'
 import { notFound } from 'next/navigation'
 
-export const ComponentExamples = collection<
+export const ComponentExamples = new Collection<
   Record<string, React.ComponentType>
 >({
   filePattern: '@/components/**/*.examples.tsx',

diff --git a/packages/renoun/src/collections/docs/index.mdx b/packages/renoun/src/collections/docs/index.mdx
@@ -11,7 +11,7 @@ Collections are a way to organize and query file-system data in renoun. They are
 Let's look at an example of how to create a collection for a blog. We'll define a collection that queries all `mdx` files in a `posts` directory:
 
 ```tsx filename="collections.ts"
-import { collection, type FileSystemSource } from 'renoun/collections'
+import { Collection, type FileSystemSource } from 'renoun/collections'
 import type { MDXContent } from 'renoun/mdx'
 
 type PostsSchema = {
@@ -24,7 +24,7 @@ type PostsSchema = {
 
 export type PostsSource = FileSystemSource<PostsSchema>
 
-export const PostsCollection = collection<PostsSchema>({
+export const PostsCollection = new Collection<PostsSchema>({
   filePattern: 'posts/*.mdx',
   baseDirectory: 'posts',
   basePath: 'posts',