From 32ab6e63a3e4d47191fe6a9906fea16fb5a49ea3 Mon Sep 17 00:00:00 2001 From: Steven Tey Date: Fri, 1 Sep 2023 12:14:58 -0700 Subject: [PATCH] bump to 0.1.16 --- README.md | 22 +++++++++++----------- packages/core/README.md | 22 +++++++++++----------- packages/core/package.json | 2 +- packages/core/src/ui/editor/index.tsx | 9 +++------ 4 files changed, 26 insertions(+), 29 deletions(-) diff --git a/README.md b/README.md index 64379fab7..affc930a8 100644 --- a/README.md +++ b/README.md @@ -54,17 +54,17 @@ export default function App() { The `Edtior` is a React component that takes in the following props: -| Prop | Type | Description | Default | -| ------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- | -| `completionApi` | `string` | The API route to use for the OpenAI completion API. | `/api/generate` | -| `className` | `string` | Additional classes to add to the editor container. | `""` | -| `defaultValue` | `JSONContent` or `string` | The default value to use for the editor. | [`defaultEditorContent`](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/default-content.tsx) | -| `extensions` | `Extension[]` | A list of extensions to use for the editor, in addition to the [default Novel extensions](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/extensions/index.tsx). | `[]` | -| `editorProps` | `EditorProps` | Props to pass to the underlying Tiptap editor, in addition to the [default Novel editor props](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/props.ts). | `{}` | -| `onUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated. | `() => {}` | -| `onDebouncedUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated, but only after the defined debounce duration. | `() => {}` | -| `debounceDuration` | `number` | The duration (in milliseconds) to debounce the `onDebouncedUpdate` callback. | `750` | -| `storageKey` | `string` | The key to use for storing the editor's value in local storage. | `novel__content` | +| Prop | Type | Description | Default | +| ------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------ | +| `completionApi` | `string` | The API route to use for the OpenAI completion API. | `/api/generate` | +| `className` | `string` | Additional classes to add to the editor container. | `"relative min-h-[500px] w-full max-w-screen-lg border-stone-200 bg-white p-12 px-8 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg"` | +| `defaultValue` | `JSONContent` or `string` | The default value to use for the editor. | [`defaultEditorContent`](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/default-content.tsx) | +| `extensions` | `Extension[]` | A list of extensions to use for the editor, in addition to the [default Novel extensions](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/extensions/index.tsx). | `[]` | +| `editorProps` | `EditorProps` | Props to pass to the underlying Tiptap editor, in addition to the [default Novel editor props](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/props.ts). | `{}` | +| `onUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated. | `() => {}` | +| `onDebouncedUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated, but only after the defined debounce duration. | `() => {}` | +| `debounceDuration` | `number` | The duration (in milliseconds) to debounce the `onDebouncedUpdate` callback. | `750` | +| `storageKey` | `string` | The key to use for storing the editor's value in local storage. | `novel__content` | > **Note**: Make sure to define an API endpoint that matches the `completionApi` prop (default is `/api/generate`). This is needed for the AI autocompletions to work. Here's an example: https://github.com/steven-tey/novel/blob/main/apps/web/app/api/generate/route.ts diff --git a/packages/core/README.md b/packages/core/README.md index 64379fab7..affc930a8 100644 --- a/packages/core/README.md +++ b/packages/core/README.md @@ -54,17 +54,17 @@ export default function App() { The `Edtior` is a React component that takes in the following props: -| Prop | Type | Description | Default | -| ------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- | -| `completionApi` | `string` | The API route to use for the OpenAI completion API. | `/api/generate` | -| `className` | `string` | Additional classes to add to the editor container. | `""` | -| `defaultValue` | `JSONContent` or `string` | The default value to use for the editor. | [`defaultEditorContent`](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/default-content.tsx) | -| `extensions` | `Extension[]` | A list of extensions to use for the editor, in addition to the [default Novel extensions](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/extensions/index.tsx). | `[]` | -| `editorProps` | `EditorProps` | Props to pass to the underlying Tiptap editor, in addition to the [default Novel editor props](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/props.ts). | `{}` | -| `onUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated. | `() => {}` | -| `onDebouncedUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated, but only after the defined debounce duration. | `() => {}` | -| `debounceDuration` | `number` | The duration (in milliseconds) to debounce the `onDebouncedUpdate` callback. | `750` | -| `storageKey` | `string` | The key to use for storing the editor's value in local storage. | `novel__content` | +| Prop | Type | Description | Default | +| ------------------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------ | +| `completionApi` | `string` | The API route to use for the OpenAI completion API. | `/api/generate` | +| `className` | `string` | Additional classes to add to the editor container. | `"relative min-h-[500px] w-full max-w-screen-lg border-stone-200 bg-white p-12 px-8 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg"` | +| `defaultValue` | `JSONContent` or `string` | The default value to use for the editor. | [`defaultEditorContent`](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/default-content.tsx) | +| `extensions` | `Extension[]` | A list of extensions to use for the editor, in addition to the [default Novel extensions](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/extensions/index.tsx). | `[]` | +| `editorProps` | `EditorProps` | Props to pass to the underlying Tiptap editor, in addition to the [default Novel editor props](https://github.com/steven-tey/novel/blob/main/packages/core/src/ui/editor/props.ts). | `{}` | +| `onUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated. | `() => {}` | +| `onDebouncedUpdate` | `(editor?: Editor) => void` | A callback function that is called whenever the editor is updated, but only after the defined debounce duration. | `() => {}` | +| `debounceDuration` | `number` | The duration (in milliseconds) to debounce the `onDebouncedUpdate` callback. | `750` | +| `storageKey` | `string` | The key to use for storing the editor's value in local storage. | `novel__content` | > **Note**: Make sure to define an API endpoint that matches the `completionApi` prop (default is `/api/generate`). This is needed for the AI autocompletions to work. Here's an example: https://github.com/steven-tey/novel/blob/main/apps/web/app/api/generate/route.ts diff --git a/packages/core/package.json b/packages/core/package.json index 22c318b13..36d76fde0 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "novel", - "version": "0.1.15", + "version": "0.1.16", "description": "Notion-style WYSIWYG editor with AI-powered autocompletions", "license": "Apache-2.0", "main": "./dist/index.js", diff --git a/packages/core/src/ui/editor/index.tsx b/packages/core/src/ui/editor/index.tsx index bf5fd7317..a9f367a9a 100644 --- a/packages/core/src/ui/editor/index.tsx +++ b/packages/core/src/ui/editor/index.tsx @@ -21,11 +21,10 @@ import { getPrevText } from "@/lib/editor"; import { ImageResizer } from "./extensions/image-resizer"; import { EditorProps } from "@tiptap/pm/view"; import { Editor as EditorClass } from "@tiptap/core"; -import { cn } from "@/lib/utils"; export default function Editor({ completionApi = "/api/generate", - className = "", + className = "relative min-h-[500px] w-full max-w-screen-lg border-stone-200 bg-white p-12 px-8 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg", defaultValue = defaultEditorContent, extensions = [], editorProps = {}, @@ -41,6 +40,7 @@ export default function Editor({ completionApi?: string; /** * Additional classes to add to the editor container. + * Defaults to "relative min-h-[500px] w-full max-w-screen-lg border-stone-200 bg-white p-12 px-8 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg". */ className?: string; /** @@ -195,10 +195,7 @@ export default function Editor({ onClick={() => { editor?.chain().focus().run(); }} - className={cn( - "relative min-h-[500px] w-full max-w-screen-lg border-stone-200 bg-white p-12 px-8 sm:mb-[calc(20vh)] sm:rounded-lg sm:border sm:px-12 sm:shadow-lg", - className - )} + className={className} > {editor && } {editor?.isActive("image") && }