Docs refresh

adeira-source-id: 6ebb0d0cb6616913c42bae720c8e06d9b2f18e2a
trytriplex · Jan 14, 2024 · f84fb7e · f84fb7e
1 parent e47d226
commit f84fb7e
Show file tree

Hide file tree

Showing 42 changed files with 645 additions and 518 deletions.
diff --git a/.changeset/few-crabs-hunt.md b/.changeset/few-crabs-hunt.md
@@ -0,0 +1,5 @@
+---
+"@triplex/editor": patch
+---
+
+Fix label extending past container.
diff --git a/apps/docs/.triplex/README.md b/apps/docs/.triplex/README.md
@@ -1,4 +1,4 @@
 Thanks for being an early adopter! This folder holds the configuration for
 [Triplex](https://github.com/try-triplex/triplex).
 
-[Learn more](https://triplex.dev/docs/api-reference/config).
+[Learn more](https://triplex.dev/docs/get-started/settings).
diff --git a/apps/docs/components/footer.tsx b/apps/docs/components/footer.tsx
@@ -8,7 +8,7 @@ import Link from "next/link";
 
 export function Footer() {
   return (
-    <footer className="relative col-span-full border-t border-neutral-800 bg-neutral-950">
+    <footer className="bg-neutral-950 relative col-span-full border-t border-neutral-800">
       <div className="mx-auto flex justify-center gap-14 px-10 py-10 lg:w-full lg:max-w-[79rem] lg:gap-32">
         <div className="lg:mr-auto">
           <div className="flex gap-1">
@@ -62,15 +62,15 @@ export function Footer() {
                 className="text-current"
                 data-testid="geist-icon"
                 height="16"
-                stroke-linejoin="round"
+                strokeLinejoin="round"
                 viewBox="0 0 16 16"
                 width="16"
               >
                 <path
-                  clip-rule="evenodd"
+                  clipRule="evenodd"
                   d="M0.5 0.5H5.75L9.48421 5.71053L14 0.5H16L10.3895 6.97368L16.5 15.5H11.25L7.51579 10.2895L3 15.5H1L6.61053 9.02632L0.5 0.5ZM12.0204 14L3.42043 2H4.97957L13.5796 14H12.0204Z"
                   fill="currentColor"
-                  fill-rule="evenodd"
+                  fillRule="evenodd"
                 />
               </svg>
             </a>
@@ -164,6 +164,22 @@ export function Footer() {
                 Github
               </Link>
             </li>
+            <li>
+              <Link
+                className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://github.com/sponsors/itsdouges"
+              >
+                Sponsor
+              </Link>
+            </li>
+            <li>
+              <Link
+                className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://pmnd.rs/"
+              >
+                Poimandres
+              </Link>
+            </li>
           </ul>
           <ul className="flex flex-col gap-4">
             <span className="text-sm font-bold text-neutral-200">Legal</span>

diff --git a/apps/docs/components/hero.tsx b/apps/docs/components/hero.tsx
@@ -40,12 +40,12 @@ export function BigDownloadLink({ variant }: { variant: "outline" | "bold" }) {
 export function Hero() {
   return (
     <div
-      className="relative flex h-[100lvh] min-h-[700px] items-center"
+      className="relative -mb-20 flex h-[80lvh] min-h-[400px] items-center pt-28"
       id="hero-section"
     >
-      <div className="max-w-[80rem] px-10 pt-16 xl:px-28">
+      <div className="max-w-[80rem] px-10 xl:px-28">
         <div className="flex flex-col items-center gap-8 md:items-start lg:gap-4">
-          <h1 className="max-w-2xl text-center text-6xl font-extrabold tracking-tighter text-neutral-200 md:text-left md:text-7xl lg:max-w-4xl lg:text-8xl">
+          <h1 className="max-w-2xl text-center text-5xl font-bold tracking-tighter text-neutral-200 md:text-left md:text-6xl lg:max-w-4xl lg:text-7xl">
             Visually Edit React Three Fiber Components
           </h1>
           <span className="text-center text-2xl font-medium tracking-tight text-neutral-300 md:max-w-3xl md:text-left lg:text-3xl">

diff --git a/apps/docs/components/intro-video.tsx b/apps/docs/components/intro-video.tsx
@@ -10,18 +10,6 @@ export function IntroVideo() {
   return (
     <div className="relative flex min-h-[120vh] flex-col items-center justify-center px-10">
       <div className="relative grid h-[90vh] w-full items-center justify-center md:h-[80vh]">
-        {/* <button className="z-50 flex h-32 w-32 scale-90 items-center justify-center rounded-full bg-neutral-800/90 pl-2 text-white/60 hover:text-white/80 active:scale-[.8] md:scale-100 md:active:scale-90">
-          <svg width="48" viewBox="0 0 60 67">
-            <g id="Regular-S">
-              <path
-                id="Path"
-                fill="currentColor"
-                stroke="none"
-                d="M 5.976074 66.314453 C 6.822388 66.314453 7.628052 66.167969 8.393066 65.875 C 9.158081 65.582031 9.947388 65.191406 10.76123 64.703125 L 54.706543 39.410156 C 56.496948 38.36853 57.733887 37.448853 58.41748 36.651367 C 59.101074 35.853882 59.442871 34.901733 59.442871 33.794922 C 59.442871 32.68811 59.101074 31.735962 58.41748 30.938477 C 57.733887 30.140991 56.496948 29.221313 54.706543 28.179688 L 10.76123 2.886719 C 9.947388 2.398438 9.158081 2.007813 8.393066 1.714844 C 7.628052 1.421875 6.822388 1.275391 5.976074 1.275391 C 4.446167 1.275391 3.233521 1.820679 2.338379 2.911133 C 1.443237 4.001587 0.995605 5.458374 0.995605 7.28125 L 0.995605 60.308594 C 0.995605 62.13147 1.443237 63.588257 2.338379 64.678711 C 3.233521 65.769165 4.446167 66.314453 5.976074 66.314453 Z"
-              />
-            </g>
-          </svg>
-        </button> */}
         <Image
           alt="Screenshot of the Triplex user interface running on macOS"
           className="object-contain md:hidden"

diff --git a/apps/docs/nextra-triplex/index.tsx b/apps/docs/nextra-triplex/index.tsx
@@ -9,15 +9,15 @@ import Head from "next/head";
 import Link from "next/link";
 import { useSearchParams } from "next/navigation";
 import type { NextraThemeLayoutProps } from "nextra";
-import { type Components, MDXProvider, useMDXComponents } from "nextra/mdx";
+import { MDXProvider, useMDXComponents, type Components } from "nextra/mdx";
 import { normalizePages } from "nextra/normalize-pages";
 import {
   Fragment,
-  type MouseEventHandler,
   useEffect,
   useMemo,
   useRef,
   useState,
+  type MouseEventHandler,
 } from "react";
 import { Footer } from "../components/footer";
 import { Header, HeaderItem } from "../components/header";
@@ -74,7 +74,7 @@ const components: Components = {
     const code = applyAction(JSON.stringify(meta, null, 2), targetValue);
 
     return (
-      <pre className="mt-5 whitespace-break-spaces rounded-xl bg-white/5 p-3 text-lg text-neutral-300 md:text-base">
+      <pre className="whitespace-break-spaces mt-5 rounded-xl bg-white/5 p-3 text-lg text-neutral-300 md:text-base">
         <code>{code}</code>
       </pre>
     );
@@ -113,23 +113,23 @@ const components: Components = {
   ),
   h2: ({ children, id }) => (
     <h2
-      className="mt-14 text-4xl font-extrabold tracking-tight text-neutral-200"
+      className="mt-14 text-4xl font-bold tracking-tight text-neutral-200"
       id={id}
     >
       {children}
     </h2>
   ),
   h3: ({ children, id }) => (
     <h3
-      className="mt-10 text-2xl font-extrabold tracking-tight text-neutral-200"
+      className="mt-10 text-2xl font-bold tracking-tight text-neutral-200"
       id={id}
     >
       {children}
     </h3>
   ),
   h4: ({ children, id }) => (
     <h4
-      className="mt-6 text-xl font-extrabold tracking-tight text-neutral-200"
+      className="mt-6 text-xl font-bold tracking-tight text-neutral-200"
       id={id}
     >
       {children}
@@ -143,7 +143,7 @@ const components: Components = {
     <p className="mt-6 text-xl text-neutral-300 md:text-lg">{children}</p>
   ),
   pre: ({ children }) => (
-    <pre className="mt-5 whitespace-break-spaces rounded-xl bg-white/5 p-3 text-lg text-neutral-300 md:text-base">
+    <pre className="whitespace-break-spaces mt-5 rounded-xl bg-white/5 p-3 text-lg text-neutral-300 md:text-base">
       {children}
     </pre>
   ),
@@ -340,7 +340,7 @@ function SearchModal({
 
   return (
     <dialog
-      className="m-auto mt-10 w-full rounded-lg border border-neutral-700 bg-neutral-950 p-0 backdrop:bg-black/70 md:mt-32 md:max-w-2xl"
+      className="bg-neutral-950 m-auto mt-10 w-full rounded-lg border border-neutral-700 p-0 backdrop:bg-black/70 md:mt-32 md:max-w-2xl"
       ref={ref}
     >
       <form method="dialog">
@@ -423,7 +423,7 @@ function Layout({ children, pageOpts }: NextraThemeLayoutProps) {
       </Header>
 
       {isNavMenuOpen && (
-        <div className="absolute left-0 right-0 top-16 z-50 border-b border-neutral-900 bg-neutral-950 px-10 py-6 text-white md:hidden">
+        <div className="bg-neutral-950 absolute left-0 right-0 top-16 z-50 border-b border-neutral-900 px-10 py-6 text-white md:hidden">
           {result.topLevelNavbarItems.map((item) => (
             <div className="mb-2" key={item.title}>
               <Link
@@ -474,7 +474,7 @@ function Layout({ children, pageOpts }: NextraThemeLayoutProps) {
       >
         {result.activeThemeContext.layout !== "raw" && (
           <>
-            <h1 className="text-6xl font-extrabold tracking-tight text-neutral-300">
+            <h1 className="text-5xl font-bold tracking-tight text-neutral-300">
               {title}
             </h1>
             {frontMatter.date && (
@@ -507,7 +507,7 @@ function Layout({ children, pageOpts }: NextraThemeLayoutProps) {
                 <div className="flex items-center gap-2">
                   <ArrowLeftIcon className="text-neutral-400" />
                   <Link
-                    className="text-2xl font-bold text-neutral-300 md:text-xl"
+                    className="text-2xl font-medium text-neutral-300 md:text-xl"
                     href={previousPage.route}
                   >
                     {previousPage.title}
@@ -517,7 +517,7 @@ function Layout({ children, pageOpts }: NextraThemeLayoutProps) {
               {nextPage && nextPage.route !== "#" && (
                 <div className="ml-auto flex items-center gap-2">
                   <Link
-                    className="text-2xl font-bold text-neutral-300 md:text-xl"
+                    className="text-2xl font-medium text-neutral-300 md:text-xl"
                     href={nextPage.route}
                   >
                     {nextPage.title}

diff --git a/apps/docs/pages/blog/_meta.json b/apps/docs/pages/blog/_meta.json
@@ -4,6 +4,7 @@
       "pagination": false
     }
   },
+  "v0.64.0-shared-buffer-array-canvas-frame": "",
   "v0.63.0-new-year-new-features": "",
   "v0.62.0-the-one-with-linux": "",
   "v0.61.0-drag-n-drop-file-tabs": "",

diff --git a/apps/docs/pages/blog/v0.64.0-shared-buffer-array-canvas-frame.mdx b/apps/docs/pages/blog/v0.64.0-shared-buffer-array-canvas-frame.mdx
@@ -0,0 +1,56 @@
+---
+title: "Triplex 0.64: SharedBufferArray, Canvas Frames, and Bugfixes"
+ogTitle: Triplex 0.64.0
+date: 2024-01-13
+description: But what, exactly?
+---
+
+▵ Triplex 0.64.0 adds support for `SharedBufferArray`, sizing your scene over
+different viewports, and new renderer configuration.
+
+## New features
+
+- Add support for `SharedBufferArray`
+  [[#186](https://github.com/try-triplex/triplex/issues/186)]
+- Add canvas frame and zoom controls to size your scene over different viewports
+- Add [define](/docs/get-started/settings#define) config to replace static
+  variables at build time
+  [[#177](https://github.com/try-triplex/triplex/issues/177)]
+- Add [renderer attributes](/docs/get-started/settings#renderer-attributes)
+  config [[#187](https://github.com/try-triplex/triplex/issues/187)]
+
+## Bug fixes
+
+- Component controls, provider controls, and component prop controls now show
+  their default value when one has been set
+  [[#176](https://github.com/try-triplex/triplex/issues/176)]
+- Vite backend now selects a random port on start
+  [[#175](https://github.com/try-triplex/triplex/issues/175)]
+- Improve UI/UX of error screen shown when loading a project fails, now showing
+  the actual error message
+  [[#111](https://github.com/try-triplex/triplex/issues/111)]
+- Fix error resolution for the provider component, now when any errors inside it
+  get fixed the scene successfully re-renders
+  [[#183](https://github.com/try-triplex/triplex/issues/183)]
+- Prevent throwing an exception if a component resolves to `any` when resolving
+  its path [[#188](https://github.com/try-triplex/triplex/issues/188)]
+- Fix adding elements to a component without a top level fragment
+  [[#130](https://github.com/try-triplex/triplex/issues/130)]
+- Fix default prop parsing from fc component
+  [[#178](https://github.com/try-triplex/triplex/issues/178)]
+- Fix string literal union input resetting the value on clear to nothing instead
+  of the default value
+- Improve UI/UX of error screen shown when loading a project fails, now shows
+  the actual error message
+- Errors are now captured during renderer bootstrap
+- Fix select input not being cleared when pressing backspace
+- Errors thrown during the initial render are now visible as an error
+  notification
+- Fix inferring jsx element locations for certain scenarios
+
+## Chores
+
+- Error notifications now display the latest error first
+
+Triplex is the React Three Fiber editor where your code is source of truth.
+[Download today](/download).
diff --git a/apps/docs/pages/docs/_meta.json b/apps/docs/pages/docs/_meta.json
@@ -1,8 +1,8 @@
 {
-  "overview": "",
+  "overview": "Get Started",
   "setup": "Setup",
   "get-started": "Get Started",
-  "user-guide": "User Guide",
+  "guides": "Guides",
   "faq": {
     "title": "FAQ",
     "display": "hidden",
@@ -11,29 +11,12 @@
       "pagination": false
     }
   },
-  "api-reference": {
-    "title": "API Reference"
-  },
   "supporting": {
     "type": "page",
     "title": "Supporting",
     "display": "hidden",
     "theme": {
       "pagination": false
     }
-  },
-  "---": {
-    "title": "",
-    "type": "separator"
-  },
-  "sponsor": {
-    "title": "Sponsor",
-    "href": "https://github.com/sponsors/itsdouges",
-    "newWindow": true
-  },
-  "pmndrs": {
-    "title": "Poimandres",
-    "href": "https://pmnd.rs/",
-    "newWindow": true
   }
 }
diff --git a/apps/docs/pages/docs/api-reference/_meta.json b/apps/docs/pages/docs/api-reference/_meta.json