Skip to content

Commit

Permalink
release: v0.12 - new website and major refactor (#562)
Browse files Browse the repository at this point in the history
* Added async slash menu items POC

* Fixed vanilla example

* Small test fix

* Implemented PR feedback

* Improved performance

* Simplified how outdated queries are ignored/cancelled

* small fixes

* Added custom suggestion menus PoC

* Updated custom mentions example

* Add Liveblocks info and BlockNote download command (#540)

* Update real-time-collaboration.md

* feat: Example image

* feat: Replace image with video

* Fixed video

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>

* wip: migrate to nextjs

* update docs2

* fixes

* fix: Mantine styles (#553)

* Updated Mantine and package-lock

* Added Mantine global styles reset

* Made Mantine global styles not get imported

* Fixed CSS import order

* Updated test & snapshots

* Implemented PR feedback

* Implemented PR feedback

* Fixed paragraph shortcut (#556)

* v0.11.2

* fix

* fix index

* Converted more examples & small fixes

* Added gen files for new examples

* Small typing fixes

* misc

* fix build

* disable examples

* Converted remaining examples and small fixes

* improve examples

* react icon import only types

* fix build speed

* Fixed demo & examples styling

* Small fix

* basic auth working

* remove old site

* clean script + organize examples

* Changed home page gradients and styling fixes

* update examples, docs, scripts

* fix playground

* fix docs

* fix playground

* add strictmode again!

* Revert "add strictmode again!"

This reverts commit 692c5b3.

* Revised features section and gradients

* small fixes

* small fixes

* small fixes

* try fix link clicks + speed

* fix type issue

* Revised styles, fixed dark mode, and small cleanup

* Small fix

* Improved dark mode selection

* Refactor/cleanup mount system (#567)

* cleanup mount system

* demo

* wip

* fix build

* fix

* fix light / dark mode

* clean examples

* clean examples

* docs

* misc

* refs

* better errors

* add default block / partialblock types

* wip: examples

* fix theme

* update interop examples

* Small fixes

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>

* refactor: Mentions & custom suggestion menus (#534)

* fix: Docs home page demo styling fix (#507)

* Fixed styling for code styles (#517)

* Made suggestions plugin control multiple menus

* Added hook to create suggestion menu

* Fixed add block button behaviour on blocks with different content (#526)

* Small CSS fix (#527)

* fix: List item shortcuts (#528)

* Fixed list item shortcuts

* Updated test screenshots

* Added code toggle formatting toolbar example (#531)

* fix: Errors when hovering image block while editor is uneditable (#533)

* Fixed errors when hovering image block while editor is uneditable

* Small fix

* fix: Formatting toolbar not hiding while dragging blocks (#529)

* Fixed formatting toolbar not hiding while dragging blocks

* Small fix

* Updated Mantine (#535)

* Updated `package-lock.json` (#536)

* v0.11.1

* v0.6.2

* v0.8.1

* v0.8.2

* v0.8.3

* v0.8.4

* v0.8.5

* v0.9.0

* v0.9.1

* Revert "v0.9.1"

This reverts commit 6e9d61f.

* v0.9.1

* Revert "v0.9.1"

This reverts commit ac7abee.

* v0.9.2

* v0.9.3

* v0.9.4

* v0.9.5

* v0.9.6

* v0.10.0

* v0.10.1

* v0.11.0

* v0.11.1

* fix collaboration and editable: false bug (#538)

* pair refactoring

* wip

* fix type annotations on some of the docs (#539)

* Cleanup and continue refactor

* docs: Dark mode styling fix (#548)

* Fixed styles that were overwritten by Mantine globals

* Removed old code

* Implemented PR feedback

* Add Liveblocks info and BlockNote download command (#540)

* Update real-time-collaboration.md

* feat: Example image

* feat: Replace image with video

* Fixed video

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>

* Implemented PR feedback

* fix: Mantine styles (#553)

* Updated Mantine and package-lock

* Added Mantine global styles reset

* Made Mantine global styles not get imported

* Fixed CSS import order

* Updated test & snapshots

* Implemented PR feedback

* Implemented PR feedback

* Fixed paragraph shortcut (#556)

* v0.11.2

* Fixed build issues

* Fixed add block button behaviour

* Small fix

* Small fix

* Fixed tests

---------

Co-authored-by: Yousef <yousefdardiry@gmail.com>
Co-authored-by: Chris Nicholas <ctnicholasdev@gmail.com>

* Refactored how remaining UI elements (except table handles) are created to match suggestions

* remove file left after merge

* Replaced `data`/`position` hooks with refactored general hooks

* Fixed vanilla example

* Lint fix

* Minor fixes

* Refactored table handles

* clean getitems

* misc

* test

* tests

* small fixes

* about page

* Implemented PR feedback

* Small naming fix

* Added vanilla default slash menu items

* address feedback

* pair work

* add footer

* small fix

* faq, sponsors

* noteplan

* readme todo

* Cleaned up homepage

* Addressed docs TODOs and cleanup

* refactor: UI component types, names, and API (#584)

* Cleaned up UI components and examples

* Continued cleanup

* Continued cleanup

* Continued cleanup

* Imlemented PR feedback

* add default onItemClick

* Implemented PR feedback

* Small fix

* fix build

* remove file

* Rename

* fix image caption button

* Moved components requiring Mantine to `/mantine` directories

* Small fix

* Updated formatting toolbar & side menu docs

* suggestion (#588)

* suggestion

* Fixed block type dropdown API and small refactor

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>

* Added hyperlink toolbar docs and small changes

* Updated slash menu docs & small fixes

* Updated slash menu docs & small fixes

* wip

* update scripts

* fix

* fix

* remove files

* fix

* update names

* small fixes

* docs

* as discussed

* address comments

* Added initial content to UI component examples & small changes

* Cleaned up UI component docs

* custom schemas + custom blocks page

* fix

* update slash menu docs

* move some examples

* rename slash menu to suggestion menu

* Added custom inline content page and other fixes

* fix

* theming todos

* Made discussed changes to styling & theming docs

* address feedback

* Added custom styles docs

* Fixed theming & styling demos

* Updated advanced docs

* docs: Proposal for editor basics docs changes (#594)

* Added proposals for editor basics docs changes

* Addressed editor basics TODOs

* fix build

* fix

* Updated editor api links

* generate + clean some comments

* fix?

* disable og

* docs review (#596)

* docs review

* Fixed PR feedback

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>

---------

Co-authored-by: yousefed <yousefdardiry@gmail.com>

---------

Co-authored-by: yousefed <yousefdardiry@gmail.com>

* Fixed demo styles & windows scrollbars

* fix build

* fix og image?

* Changed selections demo(s) & fixed various styles

* fix lint

* lint fix

* Fixed demo input/output TODOs and removed hide last line hack

* fix tests

* try fix tests

* Updated e2e test setup

* Updated e2e test setup

* Added docs pages redirects and misc changes

* scripts

* Updated screenshots

* Fixed various docs TODOs

* webpack stats / github ci

* WIP: Fix/polish examples

* ci update

* Finished examples cleanup (expect collab)

* Fixed toolbar button click behaviour for Safari

* Fixed collaboration examples

* Revert dependency changes

* fix package json

* separate inter font

* fix xss #601

* Implemented PR feedback

* small edits

* small cleanup

* fix bugs

* features (wip)

* fix

* only apply fix to safari

* comments

* fix package lock

* fix authors

* fix bug

* fix inline content api

* Added insert inline content docs

* update docs

* small fixes

* update readme

* text

* feat: Editor option to customize placeholders (#503)

* Added option to customize placeholders

* Slightly adjusted default placeholders

* check emptyness with css

* Added editor options to customize placeholders via CSS

* Implemented PR feedback

* small placeholder fixes

---------

Co-authored-by: yousefed <yousefdardiry@gmail.com>

* fix Incorrect blocknote styles affecting Mantine ToolTip component styles #566

* export

* Cleaned up home page code

* Added font import

---------

Co-authored-by: Matthew Lipski <matthewlipski@gmail.com>
Co-authored-by: Chris Nicholas <ctnicholasdev@gmail.com>
Co-authored-by: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com>
  • Loading branch information
4 people committed Mar 5, 2024
1 parent 5932a81 commit e8486d8
Show file tree
Hide file tree
Showing 859 changed files with 38,408 additions and 21,693 deletions.
14 changes: 7 additions & 7 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ jobs:
name: Build
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/checkout@v4

- uses: actions/setup-node@v3
- uses: actions/setup-node@v4
with:
node-version: "18.x"
node-version: "20.x"

- name: Cache node modules
uses: actions/cache@v3
uses: actions/cache@v4
env:
cache-name: cache-node-modules
with:
Expand All @@ -32,7 +32,7 @@ jobs:
- name: cache playwright
id: playwright-cache
uses: actions/cache@v3
uses: actions/cache@v4
with:
path: ~/.cache/ms-playwright
key: pw-new-${{ runner.os }}-${{ hashFiles('**/package-lock.json') }}
Expand Down Expand Up @@ -70,7 +70,7 @@ jobs:
working-directory: ./tests
run: npx playwright test

- uses: actions/upload-artifact@v3
- uses: actions/upload-artifact@v4
if: always()
with:
name: playwright-report
Expand All @@ -80,5 +80,5 @@ jobs:
- name: Upload webpack stats artifact (editor)
uses: relative-ci/agent-upload-artifact-action@v1
with:
webpackStatsFile: ./examples/editor/dist/webpack-stats.json
webpackStatsFile: ./playground/dist/webpack-stats.json
artifactName: relative-ci-artifacts-editor
2 changes: 1 addition & 1 deletion .nvmrc
Original file line number Diff line number Diff line change
@@ -1 +1 @@
v18.16.0
v20.11.0
26 changes: 11 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,49 +1,45 @@
<p align="center">
<a href="https://www.blocknotejs.org">
<img alt="TypeCell" src="https://github.com/TypeCellOS/BlockNote/raw/main/packages/website/docs/public/img/logos/banner.svg?raw=true" width="300" />
<img alt="TypeCell" src="https://github.com/TypeCellOS/BlockNote/raw/main/docs/public/img/logos/banner.svg?raw=true" width="300" />
</a>
</p>

<p align="center">
Welcome to BlockNote! The open source Block-Based
rich text editor. Easily add a modern text editing experience to your app.
React rich text editor. Easily add a modern text editing experience to your app.
</p>

<p align="center">
<a href="https://discord.gg/Qc2QTTH5dF"><img alt="Discord" src="https://img.shields.io/badge/Chat on discord%20-%237289DA.svg?&style=for-the-badge&logo=discord&logoColor=white"/></a> <a href="https://matrix.to/#/#typecell-space:matrix.org"><img alt="Matrix" src="https://img.shields.io/badge/Chat on matrix%20-%23000.svg?&style=for-the-badge&logo=matrix&logoColor=white"/></a>
<a href="https://discord.gg/Qc2QTTH5dF"><img alt="Discord" src="https://img.shields.io/badge/Chat on discord%20-%237289DA.svg?&style=for-the-badge&logo=discord&logoColor=white"/></a>
</p>

<p align="center">
<a href="https://www.blocknotejs.org">
Homepage
</a> - <a href="https://www.blocknotejs.org/docs/introduction">
Introduction
</a> - <a href="https://www.blocknotejs.org/docs/quickstart">
Documentation
</a> - <a href="https://www.blocknotejs.org/docs/quickstart">
Quickstart
</a>- <a href="https://www.blocknotejs.org/docs/examples">
Examples
</a>
</p>

# Live demo

Play with the editor @ [https://playground.blocknotejs.org/](https://playground.blocknotejs.org/).

(Source in [examples](/examples))
See our homepage @ [https://www.blocknotejs.org](https://www.blocknotejs.org/) or browse the [examples](https://www.blocknotejs.org/examples).

# Example code (React)

[![npm version](https://badge.fury.io/js/%40blocknote%2Freact.svg)](https://badge.fury.io/js/%40blocknote%2Freact)

```typescript
import { BlockNoteView, useBlockNote } from "@blocknote/react";
import { BlockNoteView, useCreateBlockNote } from "@blocknote/react";
import "@blocknote/core/fonts/inter.css";
import "@blocknote/react/style.css";

function App() {
const editor = useBlockNote({
onEditorContentChange: (editor) => {
// Log the document to console on every update
console.log(editor.getJSON());
},
});
const editor = useCreateBlockNote();

return <BlockNoteView editor={editor} />;
}
Expand Down
4 changes: 4 additions & 0 deletions docs/.env.local.example
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
AUTH_SECRET= # Linux: `openssl rand -hex 32` or go to https://generate-secret.vercel.app/32

AUTH_GITHUB_ID=
AUTH_GITHUB_SECRET=
3 changes: 3 additions & 0 deletions docs/.eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"extends": "next/core-web-vitals"
}
36 changes: 36 additions & 0 deletions docs/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.

# dependencies
/node_modules
/.pnp
.pnp.js
.yarn/install-state.gz

# testing
/coverage

# next.js
/.next/
/out/

# production
/build

# misc
.DS_Store
*.pem

# debug
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# local env files
.env*.local

# vercel
.vercel

# typescript
*.tsbuildinfo
next-env.d.ts
36 changes: 36 additions & 0 deletions docs/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

## Getting Started

First, run the development server:

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.

This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.

## Learn More

To learn more about Next.js, take a look at the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

## Deploy on Vercel

The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.

Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
2 changes: 2 additions & 0 deletions docs/app/api/auth/[...nextauth]/route.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export { GET, POST } from "../../../../auth";
export const runtime = "edge"; // optional
19 changes: 7 additions & 12 deletions packages/website/api/og.tsx → docs/app/api/og/route.tsx
Original file line number Diff line number Diff line change
@@ -1,24 +1,19 @@
import { ImageResponse } from "@vercel/og";
import React from "react";
import { ImageResponse } from "next/og";

export const config = {
runtime: "edge",
};
export const runtime = "edge";

const font = fetch(
new URL("../docs/public/fonts/Gilroy-Regular.ttf", import.meta.url)
).then((res) => res.arrayBuffer());

export default async function handler(request) {
export async function GET(request: Request) {
try {
const fontData = await fetch(
new URL("../../../assets/fonts/Gilroy-Regular.ttf", import.meta.url),
).then((res) => res.arrayBuffer());

const { searchParams } = new URL(request.url);
let title = searchParams.get("title");
if (title && title.length > 100) {
title = title.slice(0, 99) + "…";
}

const fontData = await font;

const bannerSVG = (
<svg
width="938"
Expand Down
Binary file added docs/app/favicon.ico
Binary file not shown.
33 changes: 33 additions & 0 deletions docs/app/globals.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
--foreground-rgb: 0, 0, 0;
--background-start-rgb: 214, 219, 220;
--background-end-rgb: 255, 255, 255;
}

@media (prefers-color-scheme: dark) {
:root {
--foreground-rgb: 255, 255, 255;
--background-start-rgb: 0, 0, 0;
--background-end-rgb: 0, 0, 0;
}
}

body {
color: rgb(var(--foreground-rgb));
background: linear-gradient(
to bottom,
transparent,
rgb(var(--background-end-rgb))
)
rgb(var(--background-start-rgb));
}

@layer utilities {
.text-balance {
text-wrap: balance;
}
}
22 changes: 22 additions & 0 deletions docs/app/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";

const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};

export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<body className={inter.className}>{children}</body>
</html>
);
}
113 changes: 113 additions & 0 deletions docs/app/page.tsx.bak
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
import Image from "next/image";

export default function Home() {
return (
<main className="flex min-h-screen flex-col items-center justify-between p-24">
<div className="z-10 max-w-5xl w-full items-center justify-between font-mono text-sm lg:flex">
<p className="fixed left-0 top-0 flex w-full justify-center border-b border-gray-300 bg-gradient-to-b from-zinc-200 pb-6 pt-8 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30">
Get started by editing&nbsp;
<code className="font-mono font-bold">app/page.tsx</code>
</p>
<div className="fixed bottom-0 left-0 flex h-48 w-full items-end justify-center bg-gradient-to-t from-white via-white dark:from-black dark:via-black lg:static lg:h-auto lg:w-auto lg:bg-none">
<a
className="pointer-events-none flex place-items-center gap-2 p-8 lg:pointer-events-auto lg:p-0"
href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
By{" "}
<Image
src="/vercel.svg"
alt="Vercel Logo"
className="dark:invert"
width={100}
height={24}
priority
/>
</a>
</div>
</div>

<div className="relative flex place-items-center before:absolute before:h-[300px] before:w-full sm:before:w-[480px] before:-translate-x-1/2 before:rounded-full before:bg-gradient-radial before:from-white before:to-transparent before:blur-2xl before:content-[''] after:absolute after:-z-20 after:h-[180px] after:w-full sm:after:w-[240px] after:translate-x-1/3 after:bg-gradient-conic after:from-sky-200 after:via-blue-200 after:blur-2xl after:content-[''] before:dark:bg-gradient-to-br before:dark:from-transparent before:dark:to-blue-700 before:dark:opacity-10 after:dark:from-sky-900 after:dark:via-[#0141ff] after:dark:opacity-40 before:lg:h-[360px] z-[-1]">
<Image
className="relative dark:drop-shadow-[0_0_0.3rem_#ffffff70] dark:invert"
src="/next.svg"
alt="Next.js Logo"
width={180}
height={37}
priority
/>
</div>

<div className="mb-32 grid text-center lg:max-w-5xl lg:w-full lg:mb-0 lg:grid-cols-4 lg:text-left">
<a
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
target="_blank"
rel="noopener noreferrer"
>
<h2 className={`mb-3 text-2xl font-semibold`}>
Docs{" "}
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
-&gt;
</span>
</h2>
<p className={`m-0 max-w-[30ch] text-sm opacity-50`}>
Find in-depth information about Next.js features and API.
</p>
</a>

<a
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
target="_blank"
rel="noopener noreferrer"
>
<h2 className={`mb-3 text-2xl font-semibold`}>
Learn{" "}
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
-&gt;
</span>
</h2>
<p className={`m-0 max-w-[30ch] text-sm opacity-50`}>
Learn about Next.js in an interactive course with&nbsp;quizzes!
</p>
</a>

<a
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
target="_blank"
rel="noopener noreferrer"
>
<h2 className={`mb-3 text-2xl font-semibold`}>
Templates{" "}
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
-&gt;
</span>
</h2>
<p className={`m-0 max-w-[30ch] text-sm opacity-50`}>
Explore starter templates for Next.js.
</p>
</a>

<a
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
className="group rounded-lg border border-transparent px-5 py-4 transition-colors hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
target="_blank"
rel="noopener noreferrer"
>
<h2 className={`mb-3 text-2xl font-semibold`}>
Deploy{" "}
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
-&gt;
</span>
</h2>
<p className={`m-0 max-w-[30ch] text-sm opacity-50 text-balance`}>
Instantly deploy your Next.js site to a shareable URL with Vercel.
</p>
</a>
</div>
</main>
);
}
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
Loading

0 comments on commit e8486d8

Please sign in to comment.