0.0.28 • Published 2 years ago
cms-client-dane v0.0.28
cms-client
Visually edit your react components with end-to-end type safe schemas.
Installation
pnpm add cms-client-dane
npm i cms-client-dane
yarn add cms-client-dane
Usage
Build a component
import { z } from "zod";
export default function Button({ children }: ButtonProps) {
return <button type="button">{children}</button>;
}
export type ButtonProps = z.infer<typeof ButtonProps>;
export const ButtonProps = z.object({
children: z.string().default("Click me!"),
});
Define your CMS
import { C, loadable } from "cms-client-dane";
export const cms = new C();
// Link your component
cms.define(
loadable(() => import(`~/components/Button`)),
{
name: "Button",
icon: `mdi:button`,
schema: ButtonProps,
}
);
Render a page with remix.run
import { json, LoaderArgs } from "@remix-run/node";
import Button from "~/components/Button";
import { Page } from "cms-client-dane";
export const loader = async ({ request }: LoaderArgs) => {
const pageData = await cms.getPageData(request);
return json({ pageData });
};
export default function Index() {
const { pageData } = useLoaderData<typeof loader>();
return <Page data={pageData} />;
}
0.0.28
2 years ago
0.0.27
2 years ago
0.0.26
2 years ago
0.0.25
2 years ago
0.0.24
2 years ago
0.0.23
2 years ago
0.0.22
2 years ago
0.0.21
2 years ago
0.0.19
2 years ago
0.0.17
2 years ago
0.0.16
2 years ago
0.0.15
2 years ago
0.0.14
2 years ago
0.0.13
2 years ago
0.0.12
2 years ago
0.0.11
2 years ago
0.0.10
2 years ago
0.0.9
2 years ago
0.0.8
2 years ago
0.0.7
2 years ago
0.0.6
2 years ago
0.0.5
2 years ago
0.0.4
2 years ago
0.0.3
2 years ago
0.0.2
2 years ago
0.0.1
2 years ago