Updates to Experimental features and bug fixes

.gitignore

@@ -41,3 +41,5 @@ netlify
 # miniflare cache
 .mf
 .vercel
+
+vite.config.ts.timestamp*

components/TableOfContents.tsx

@@ -17,7 +17,7 @@ export function useTableOfContents() {
   );
 }
 
-export default function TableOfContents() {
+export function TableOfContents() {
   const headings = useTableOfContents();
 
   return (

components/components.tsx

@@ -1,9 +1,8 @@
 import { Title as MetaTitle } from "@solidjs/meta";
 import { createUniqueId, mergeProps, Show } from "solid-js";
-import { unstable_island } from "solid-start";
 import "tippy.js/dist/tippy.css";
 import A from "./A";
-const Tooltip = unstable_island(() => import("./tooltip"));
+import Tooltip from "./tooltip";
 
 export const components = {
   strong: props => <span class="font-bold">{props.children}</span>,

docs.root.tsx

@@ -2,6 +2,7 @@
 import { createMemo, For, Show, Suspense } from "solid-js";
 import { MDXProvider } from "solid-mdx";
 import {
+  A,
   Body,
   FileRoutes,
   Head,
@@ -11,15 +12,11 @@ import {
   Routes,
   Scripts,
   Stylesheet,
-  Title,
-  unstable_island
+  Title
 } from "solid-start";
 import { ErrorBoundary } from "solid-start/error-boundary";
 import "./components/index.css";
 
-const IslandA = unstable_island(() => import("./components/A"));
-const TableOfContents = unstable_island(() => import("./components/TableOfContents"));
-
 export const mods = /*#__PURE__*/ import.meta.glob<
   true,
   any,
@@ -132,6 +129,7 @@ function Nav() {
         order: number;
         subsection: string;
         href: string;
+        frontMatter: any;
       }[] & { subsection?: Set<string>; title?: string; order?: number };
     } = {};
 
@@ -198,15 +196,15 @@ function Nav() {
                         <For each={r.filter(i => i.subsection === s)}>
                           {({ title, path, href, frontMatter }) => (
                             <li class="ml-2">
-                              <IslandA
+                              <A
                                 activeClass="text-primary"
                                 inactiveClass="text-gray-500"
                                 href={href}
                               >
                                 <span class="block ml-4 pb-2 text-sm break-words hover:text-gray-500 dark:hover:text-gray-300">
                                   {title}
                                 </span>
-                              </IslandA>
+                              </A>
                             </li>
                           )}
                         </For>
@@ -217,13 +215,9 @@ function Nav() {
                   <For each={r.filter(i => !i.subsection)}>
                     {({ title, path, href, frontMatter }) => (
                       <li class="ml-2">
-                        <IslandA
-                          activeClass="text-primary"
-                          inactiveClass="text-gray-500"
-                          href={href}
-                        >
+                        <A activeClass="text-primary" inactiveClass="text-gray-500" href={href}>
                           <span>{title}</span>
-                        </IslandA>
+                        </A>
                       </li>
                     )}
                   </For>
@@ -233,11 +227,11 @@ function Nav() {
               <For each={r}>
                 {({ title, path, href, frontMatter }) => (
                   <li class="ml-2" classList={{ "text-slate-300": !frontMatter.active }}>
-                    <IslandA activeClass="text-primary" inactiveClass="text-gray-500" href={href}>
+                    <A activeClass="text-primary" inactiveClass="text-gray-500" href={href}>
                       <span class="block dark:text-gray-300 py-1 text-md font-semibold break-words hover:text-gray-400 dark:hover:text-gray-400">
                         {title}
                       </span>
-                    </IslandA>
+                    </A>
                   </li>
                 )}
               </For>
@@ -250,7 +244,7 @@ function Nav() {
 }
 
 import { components } from "./components/components";
-import { useTableOfContents } from "./components/TableOfContents";
+import { TableOfContents, useTableOfContents } from "./components/TableOfContents";
 
 export default function Root() {
   return (
@@ -319,9 +313,9 @@ export default function Root() {
                                           "ml-4": h.depth === 3
                                         }}
                                       >
-                                        <IslandA class="border-0 no-underline" href={`#${h.slug}`}>
+                                        <A class="border-0 no-underline" href={`#${h.slug}`}>
                                           {h.text}
-                                        </IslandA>
+                                        </A>
                                       </li>
                                     )}
                                   </For>

docs/core-concepts/data-loading.mdx

@@ -195,6 +195,7 @@ export default function HouseLayout(props: ParentProps) {
   return <><Outlet /></>;
 }
 
+
 // @filename: routes/[house]/students.tsx
 import { RouteDataArgs, Outlet } from "solid-start";
 import { ParentProps } from 'solid-js';
@@ -224,7 +225,7 @@ import { createContext } from 'solid-js';
 const RouteContext = createContext<{ data: any }>({ data: null });
 
 // ---cut---
-import { useLocation, useNavigate } from "solid-start";
+import { useLocation, useNavigate, RouteDataArgs } from "solid-start";
 import { 
   default as HouseLayout, 
   routeData as getHouseLayoutData 
@@ -245,9 +246,9 @@ function Routes() {
     params: { house: 'gryffindor' }
   }
 
-  const houseLayoutData = getHouseLayoutData({ ...args, data: null });
-  const studentsLayoutData = getStudentsLayoutData({ ...args, data: houseLayoutData });
-  const studentsData = getStudentsLayoutData({ ...args, data: studentsLayoutData  });
+  const houseLayoutData = getHouseLayoutData({ ...args, data: null } as RouteDataArgs);
+  const studentsLayoutData = getStudentsLayoutData({ ...args, data: houseLayoutData } as RouteDataArgs);
+  const studentsData = getStudentsLayoutData({ ...args, data: studentsLayoutData  } as RouteDataArgs);
 
   return (
     <RouteContext.Provider value={{ data: houseLayoutData }}>

examples/bare/package.json

@@ -7,19 +7,19 @@
   },
   "type": "module",
   "devDependencies": {
-    "@types/node": "^18.11.18",
+    "@types/node": "^18.16.19",
     "esbuild": "^0.14.54",
-    "postcss": "^8.4.21",
-    "solid-start-node": "^0.2.19",
-    "typescript": "^4.9.4",
+    "postcss": "^8.4.26",
+    "solid-start-node": "^0.2.29",
+    "typescript": "^4.9.5",
     "vite": "^4.4.6"
   },
   "dependencies": {
-    "@solidjs/meta": "^0.28.2",
+    "@solidjs/meta": "^0.28.5",
     "@solidjs/router": "^0.8.2",
     "solid-js": "^1.7.9",
     "solid-start": "^0.2.31",
-    "undici": "^5.15.1"
+    "undici": "^5.22.1"
   },
   "engines": {
     "node": ">=16.8"

examples/hackernews/package.json

@@ -8,19 +8,19 @@
   "type": "module",
   "main": "./dist/index.js",
   "devDependencies": {
-    "@types/babel__core": "^7.20.0",
-    "@types/node": "^18.11.18",
+    "@types/babel__core": "^7.20.1",
+    "@types/node": "^18.16.19",
     "esbuild": "^0.14.54",
-    "solid-start-node": "^0.2.19",
-    "typescript": "^4.9.4",
+    "solid-start-node": "^0.2.29",
+    "typescript": "^4.9.5",
     "vite": "^4.4.6"
   },
   "dependencies": {
-    "@solidjs/meta": "^0.28.2",
+    "@solidjs/meta": "^0.28.5",
     "@solidjs/router": "^0.8.2",
     "solid-js": "^1.7.9",
     "solid-start": "^0.2.31",
-    "undici": "^5.15.1"
+    "undici": "^5.22.1"
   },
   "engines": {
     "node": ">=16"

examples/movies/.gitignore

@@ -0,0 +1,4 @@
+node_modules
+# Keep environment variables out of version control
+.env*
+.db

examples/movies/README.md

@@ -0,0 +1,23 @@
+# solid-movies
+
+This was adapted from the Nuxt version: https://github.com/tastejs/nuxt-movies
+
+A SolidStart Movies application using [The Movie Database (TMDb)](https://developers.themoviedb.org/3) API. Built using [Solid](https://github.com/solidjs/solid) and [SolidStart](https://github.com/solidjs/solid-start). Our version is built by the Solid team.
+
+## Quick setup
+
+1. Take a copy of `.env.sample` and re-name to `.env`
+2. Get your [TMDb](https://developers.themoviedb.org/3) API key
+3. Get your [YouTube](https://developers.google.com/youtube/v3/getting-started) API key (optional, used for video data)
+4. Enter the details into the `.env` file
+
+## Running
+
+``` bash
+# install dependencies
+$ npm install # Or yarn install
+
+# serve with hot reload at localhost:3000
+$ npm run dev
+```
+

examples/movies/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "example-movies",
+  "scripts": {
+    "dev": "solid-start dev",
+    "build": "solid-start build",
+    "start": "solid-start start"
+  },
+  "type": "module",
+  "devDependencies": {
+    "@iconify/json": "^2.2.90",
+    "sass": "^1.63.6",
+    "solid-start-node": "^0.2.30",
+    "typescript": "^4.9.5",
+    "unplugin-icons": "^0.14.15",
+    "vite": "^4.4.6"
+  },
+  "dependencies": {
+    "@solid-primitives/scheduled": "1.1.0",
+    "@solidjs/meta": "^0.28.5",
+    "@solidjs/router": "^0.8.2",
+    "nprogress": "^0.2.0",
+    "solid-heroicons": "^3.2.4",
+    "solid-js": "^1.7.9",
+    "solid-start": "^0.2.30",
+    "solid-start-netlify": "^0.2.30",
+    "undici": "^5.22.1"
+  },
+  "engines": {
+    "node": ">=16"
+  }
+}

examples/movies/public/README.md

@@ -0,0 +1,12 @@
+# STATIC
+
+This directory contains your static files.
+Each file inside this directory is mapped to /.
+
+Example: /static/robots.txt is mapped as /robots.txt.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#static
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

examples/movies/src/assets/README.md

@@ -0,0 +1,3 @@
+# ASSETS
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.