@keystatic/templates-nextjs 0.0.30 → 0.0.32

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @keystatic/templates-nextjs
 
+## 0.0.32
+
+### Patch Changes
+
+- Updated dependencies [[`a129ea4`](https://github.com/Thinkmill/keystatic/commit/a129ea4ea46a5d9c2ddec8aef4313d98cf13a575), [`73aa1b8`](https://github.com/Thinkmill/keystatic/commit/73aa1b856b7100d1ac033eb16bee5e7f630a2c3e), [`73aa1b8`](https://github.com/Thinkmill/keystatic/commit/73aa1b856b7100d1ac033eb16bee5e7f630a2c3e), [`a1a71c1`](https://github.com/Thinkmill/keystatic/commit/a1a71c1ab2313c4c0a85fdce3f9a802a14580ece)]:
+  - @keystatic/core@0.5.19
+  - @keystatic/next@5.0.1
+
+## 0.0.31
+
+### Patch Changes
+
+- [#1164](https://github.com/Thinkmill/keystatic/pull/1164) [`be255f9`](https://github.com/Thinkmill/keystatic/commit/be255f9446c3e1b1c47cadcdd0e5154d7cffc68a) Thanks [@emmatown](https://github.com/emmatown)! - Switch from deprecated `fields.document` to `fields.markdoc`
+
+- Updated dependencies [[`86bd966`](https://github.com/Thinkmill/keystatic/commit/86bd966ff35981185030ce0850b8041e8a2dc5bb), [`dc7e028`](https://github.com/Thinkmill/keystatic/commit/dc7e0287b1cd1e6b4d09e3b39d390054b60fe130)]:
+  - @keystatic/core@0.5.18
+  - @keystatic/next@5.0.1
+
 ## 0.0.30
 
 ### Patch Changes

package/app/[slug]/page.tsx

@@ -1,5 +1,8 @@
-import { DocumentRenderer } from '@keystatic/core/renderer';
+import '../styles.css';
+import React from 'react';
+import Markdoc from '@markdoc/markdoc';
 import { reader } from '../reader';
+import { markdocConfig } from '../../keystatic.config';
 
 export default async function Post({ params }: { params: { slug: string } }) {
   const { slug } = params;
@@ -8,12 +11,20 @@ export default async function Post({ params }: { params: { slug: string } }) {
 
   if (!post) return <div>Post not found!</div>;
 
+  const { node } = await post.content();
+
+  const errors = Markdoc.validate(node, markdocConfig);
+  if (errors.length) {
+    console.error(errors);
+    throw new Error('Invalid content');
+  }
+
+  const renderable = Markdoc.transform(node, markdocConfig);
+
   return (
     <div>
       <h1>{post.title}</h1>
-      <div>
-        <DocumentRenderer document={await post.content()} />
-      </div>
+      {Markdoc.renderers.react(renderable, React)}
     </div>
   );
 }

package/keystatic.config.ts

@@ -1,5 +1,7 @@
 import { config, collection, fields } from '@keystatic/core';
 
+export const markdocConfig = fields.markdoc.createMarkdocConfig({});
+
 export default config({
   storage: {
     kind: 'local',
@@ -12,13 +14,7 @@ export default config({
       format: { contentField: 'content' },
       schema: {
         title: fields.slug({ name: { label: 'Title' } }),
-        content: fields.document({
-          label: 'Content',
-          formatting: true,
-          dividers: true,
-          links: true,
-          images: true,
-        }),
+        content: fields.markdoc({ label: 'Content' }),
       },
     }),
   },

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@keystatic/templates-nextjs",
-  "version": "0.0.30",
+  "version": "0.0.32",
   "license": "MIT",
   "dependencies": {
+    "@markdoc/markdoc": "^0.4.0",
     "next": "^14.1.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "@keystatic/core": "^0.5.17",
+    "@keystatic/core": "^0.5.19",
     "@keystatic/next": "^5.0.1"
   },
   "devDependencies": {

package/app/[slug]/layout.tsx

@@ -1,9 +0,0 @@
-import '../styles.css';
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return <>{children}</>;
-}

package/next.config.js

@@ -1,4 +0,0 @@
-/** @type {import('next').NextConfig} */
-module.exports = {
-  reactStrictMode: false,
-};