Hello World
++ You can open{" "} + + /docs + {" "} + and see the documentation. +
++ You can open{" "} + + /examples + {" "} + and see the examples. +
+diff --git a/docs/app/portal/page.tsx b/docs/app/portal/page.tsx deleted file mode 100644 index c93f41baff..0000000000 --- a/docs/app/portal/page.tsx +++ /dev/null @@ -1,19 +0,0 @@ -"use client"; - -import { useSession } from "@/util/auth-client"; - -// Just shows session info -export default function Me() { - const { data: session } = useSession(); - - if (!session) { - return
{JSON.stringify(session, null, 2)}-
+ You can open{" "} + + /docs + {" "} + and see the documentation. +
++ You can open{" "} + + /examples + {" "} + and see the examples. +
++ Your subscription helps maintain and develop BlockNote while giving + you access to direct support, priority features, and Pro Examples. +
+
+ Thanks for checking out BlockNote Pro!
BlockNote is free and
+ open source software that organizations of all sizes are using to add
+ polished editing experiences to their apps.
+
{signingInState.message}
++ { + router.push( + `${props.variant === "email" ? "/signup" : "/signin"}?redirect=${encodeURIComponent(callbackURL)}&theme=${encodeURIComponent(theme)}`, + ); + }} + > + {props.variant === "email" + ? "Don't have an account? Sign Up" + : props.variant === "password" + ? "Return to email login" + : "Already have an account? Log In"} + +
++ Get access to the full source code for pro examples by subscribing + to BlockNote Pro +
++ Or{" "} + {" "} + via GitHub +
+ )} */} +{props.subtext}
++ More questions? Reach out to our team. +
*/} +...and more: (TODO)
++ When we started building an Open Source Notion alternative, we + figured: "How hard can it be?". Pretty hard, it turns out. + Text editors in 2024? More complex than we thought. +
++ After going down many rabbit holes and becoming accidental wizards + in Prosemirror (the industry standard used by giants like NY Times, + Atlassian, Gitlab and many others), we figured that we could save + other devs a lot of pain by creating a modern, batteries-included, + block-based text editor on top of it. +
++ We're excited to share BlockNote with you. No more dealing with + low-level positions; use the strongly typed, block-based API to work + with your editor and documents. No need to build all interface + elements from scratch; it comes with modern UI components + out-of-the-box. Now, you can add a rich text editor with a polished + UX to your app with just a few lines of code. +
++ It's early days, but the excitement is real. We're seeing + a mix of companies, enthusiasts, and community heroes jumping in. As + a community-led open source project, we're looking forward to + your contributions, feedback, or collaboration! +
++ {children} +
+ ); +} + +export function SectionIntro({ + header, + subtext, +}: { + header: ReactNode; + subtext: ReactNode; +}) { + return ( ++ {faq.answer} +
++ {typeof tier.price === "string" + ? tier.price + : `$${tier.price[frequency]} / ${frequency}`} +
+ ); +} + +function TierHeader({ tier, frequency }: { tier: Tier; frequency: Frequency }) { + return ( +{tier.description}
; +} + +function TierCTAButton({ tier }: { tier: Tier }) { + const { data: session } = useSession(); + let href = "/signup"; + let text = "Sign up"; + + if (session) { + if (session.planType === "free") { + href = `/api/auth/checkout/${tier.id}`; + text = "Buy now"; + } else { + href = "/api/auth/portal"; + text = + session.planType === tier.id + ? "Manage subscription" + : "Update subscription"; + } + } + return ( + { + track("Signup", { tier: tier.id }); + }} + > + {tier.id === "enterprise" ? "Get in touch" : text} + + ); +} + +function TierFeature({ feature }: { feature: string }) { + return ( +`, `
+ The `useCreateBlockNote` hook is actually a simple `useMemo` wrapper around + the `BlockNoteEditor.create` method. You can use this method directly if you + want to control the editor lifecycle manually. For example, we do this in + the [Saving & Loading example](/examples/backend/saving-loading) to delay + the editor creation until some content has been fetched from an external + data source. +
++ Note that the `BlockNoteView` component is an [uncontrolled component](https://react.dev/learn/sharing-state-between-components#controlled-and-uncontrolled-components). + This means you don't pass in the editor content directly as a prop. You can use the `initialContent` option in the `useCreateBlockNote` hook to set the initial content of the editor (similar to the `defaultValue` prop in a regular React `
++ BlockNote handles the complexities and performance optimizations of managing editor state internally. You can interact with the editor content using the [Editor API](/docs/editor-api). +
+