@kjam/next-ui

Components to use in Kjam + Next.js powered websites.

Usage no npm install needed!

<script type="module">
  import kjamNextUi from 'https://cdn.skypack.dev/@kjam/next-ui';
</script>

README

@kjam/next-ui

React components within the kjam tooling for git (github) based headless CMS + next.js projects.

Usage

In one of your pages, e.g. pages/[slug].ts

import { kjam, KjamProps } from "@kjam/next";
import { PageDebug } from "@kjam/next-ui";
import { serialize } from "next-mdx-remote/serialize";
// import { mdComponents } from "../md-components";

type Data = {
  title: string;
};

type Params = {
  slug: string[];
};

type Props = KjamProps<Data, Params> & {};

export default function PagesPage({
  mdx,
  entry,
}: PageStatic<typeof getStaticProps>) {
  return (
    <PageDebug
      tpl="[slug]"
      entry={entry}
      mdx={mdx}
      // mdComponents={mdComponents}
    />
  );
}

export const getStaticPaths: DataStaticPaths<Params> = async (ctx) => {
  return await kjam.getStaticPaths<Params>(ctx, "blocking", "pages");
};

export const getStaticProps: DataStatic<Props, Params> = async (ctx) => {
  return await kjam.getStaticProps<Params, Data>(ctx, serialize, "");
};

This repo is automatically deployed by @kjam monorepo. Issues and development happen there.