From 6c98aa7de2c5c8937f9595c60cff878b4674d3f7 Mon Sep 17 00:00:00 2001
From: garthdb <garthdb@gmail.com>
Date: Wed, 6 Dec 2023 16:02:32 -0700
Subject: [PATCH] feat(site): added static page for list of tokens

---
 docs/site/components/layout.js  |   2 +-
 docs/site/lib/components.js     |   1 +
 docs/site/lib/tokens.js         |  34 +++
 docs/site/package.json          |  14 +-
 docs/site/pages/_app.js         |   4 +-
 docs/site/pages/index.js        |   4 +-
 docs/site/pages/tokens/index.js | 187 ++++++++++++++
 docs/site/styles/global.css     |  16 +-
 docs/site/styles/sidenav.css    | 431 --------------------------------
 package.json                    |   2 +-
 pnpm-lock.yaml                  | 245 +++++++++---------
 11 files changed, 371 insertions(+), 569 deletions(-)
 create mode 100644 docs/site/lib/tokens.js
 create mode 100644 docs/site/pages/tokens/index.js
 delete mode 100644 docs/site/styles/sidenav.css

diff --git a/docs/site/components/layout.js b/docs/site/components/layout.js
index a1cf4bea..c18273c1 100644
--- a/docs/site/components/layout.js
+++ b/docs/site/components/layout.js
@@ -1,7 +1,7 @@
 import Head from "next/head";
 import Link from "next/link";
 
-const name = "Spectrum Tokens";
+const name = "Spectrum Components API";
 export const siteTitle = "Next.js Sample Website";
 
 export default function Layout({ children, home }) {
diff --git a/docs/site/lib/components.js b/docs/site/lib/components.js
index 429fce0e..f4c22447 100644
--- a/docs/site/lib/components.js
+++ b/docs/site/lib/components.js
@@ -40,6 +40,7 @@ const resolveSchemaDefinitions = (schema, ajv) => {
 
 const readJSON = async (filePath) =>
   JSON.parse(await readFile(filePath, "utf8"));
+
 const getValidator = async () => {
   const schemaDir = "public/schemas";
   const ajv = new Ajv();
diff --git a/docs/site/lib/tokens.js b/docs/site/lib/tokens.js
new file mode 100644
index 00000000..d3c7b70b
--- /dev/null
+++ b/docs/site/lib/tokens.js
@@ -0,0 +1,34 @@
+import path from "path";
+import { readFile } from "fs/promises";
+import { glob, Glob } from "glob";
+
+const readJSON = async (filePath) =>
+  JSON.parse(await readFile(filePath, "utf8"));
+
+export async function getTokenData() {
+  const tokenDir = path.resolve(
+    path.join(process.cwd(), "..", "..", "packages", "tokens", "src"),
+  );
+  let tokenArray = [];
+  const g = new Glob(`${tokenDir}/*.json`, {});
+  for await (const file of g) {
+    const fileTokenData = await readJSON(file);
+    const newTokenArray = Object.keys(fileTokenData).map((key) => {
+      return {
+        name: key,
+        ...fileTokenData[key],
+      };
+    });
+    tokenArray = [...tokenArray, ...newTokenArray];
+    // await fileNames.forEach(async (file) => {
+    //   const fileTokenData = await readJSON(file);
+    //   Object.keys(fileTokenData).forEach((key) => {
+    //     tokenArray.push({
+    //       name: key,
+    //       token: fileTokenData[key],
+    //     });
+    //   });
+    // });
+  }
+  return tokenArray;
+}
diff --git a/docs/site/package.json b/docs/site/package.json
index ab4a0fb1..e37cc2a8 100644
--- a/docs/site/package.json
+++ b/docs/site/package.json
@@ -8,16 +8,18 @@
     "url": "git+https://github.com/adobe/spectrum-tokens.git"
   },
   "dependencies": {
-    "@spectrum-css/page": "^5.0.31",
-    "@spectrum-css/table": "^4.0.60",
-    "@spectrum-css/tokens": "^11.0.0",
-    "@spectrum-css/typography": "^5.0.27",
+    "@spectrum-css/link": "^4.0.74",
+    "@spectrum-css/page": "^6.0.9",
+    "@spectrum-css/sidenav": "^4.0.18",
+    "@spectrum-css/table": "^5.0.10",
+    "@spectrum-css/tokens": "^13.0.5",
+    "@spectrum-css/typography": "^5.0.49",
     "ajv": "^8.12.0",
     "ajv-formats": "^2.1.1",
-    "next": "^13.4.10",
+    "next": "^14.0.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "rimraf": "^5.0.1"
+    "rimraf": "^5.0.5"
   },
   "license": "Apache-2.0",
   "bugs": {
diff --git a/docs/site/pages/_app.js b/docs/site/pages/_app.js
index dec146b4..36351ecf 100644
--- a/docs/site/pages/_app.js
+++ b/docs/site/pages/_app.js
@@ -1,11 +1,13 @@
 import "@spectrum-css/tokens/dist/css/global-vars.css";
 import "@spectrum-css/tokens/dist/css/spectrum/custom-vars.css";
+import "@spectrum-css/tokens/dist/css/spectrum/medium-vars.css";
 import "@spectrum-css/tokens/dist/css/medium-vars.css";
 import "@spectrum-css/tokens/dist/css/light-vars.css";
 import "@spectrum-css/page/dist/index-vars.css";
+import "@spectrum-css/link/dist/index-vars.css";
 import "@spectrum-css/table/dist/index-vars.css";
 import "@spectrum-css/typography/dist/index-vars.css";
-import "../styles/sidenav.css";
+import "@spectrum-css/sidenav/dist/index-vars.css";
 
 export default function App({ Component, pageProps }) {
   return <Component {...pageProps} />;
diff --git a/docs/site/pages/index.js b/docs/site/pages/index.js
index aa6261fd..7bfff9f8 100644
--- a/docs/site/pages/index.js
+++ b/docs/site/pages/index.js
@@ -25,7 +25,7 @@ export default function Home({ allComponentsData }) {
 
       <main>
         <section>
-          <h1>Spectrum Components</h1>
+          <h1>Spectrum Components API</h1>
           <nav>
             <ul className="spectrum-SideNav">
               {allComponentsData.map(({ slug, title }) => (
@@ -34,7 +34,7 @@ export default function Home({ allComponentsData }) {
                     className="spectrum-SideNav-itemLink"
                     href={`/components/${slug}`}
                   >
-                    {title}
+                    <span className="spectrum-SideNav-link-text">{title}</span>
                   </Link>
                 </li>
               ))}
diff --git a/docs/site/pages/tokens/index.js b/docs/site/pages/tokens/index.js
new file mode 100644
index 00000000..c28ba151
--- /dev/null
+++ b/docs/site/pages/tokens/index.js
@@ -0,0 +1,187 @@
+import Head from "next/head";
+import Link from "next/link";
+import Layout from "../../components/layout";
+
+import { getTokenData } from "../../lib/tokens";
+
+function isObject(obj) {
+  return typeof obj === "object" && !Array.isArray(obj) && obj !== null;
+}
+
+export async function getStaticProps({}) {
+  const tokenData = await getTokenData();
+  return {
+    props: {
+      tokenData,
+    },
+  };
+}
+
+function RGBAToHexA(rgba, forceRemoveAlpha = false) {
+  return (
+    "#" +
+    rgba
+      .replace(/^rgba?\(|\s+|\)$/g, "") // Get's rgba / rgb string values
+      .split(",") // splits them at ","
+      .filter((string, index) => !forceRemoveAlpha || index !== 3)
+      .map((string) => parseFloat(string)) // Converts them to numbers
+      .map((number, index) => (index === 3 ? Math.round(number * 255) : number)) // Converts alpha to 255 number
+      .map((number) => number.toString(16)) // Converts numbers to hex
+      .map((string) => (string.length === 1 ? "0" + string : string)) // Adds 0 when length of one number is 1
+      .join("")
+  ); // Puts the array to togehter to a string
+}
+
+// function formatTokenLink(value) {
+//   if (value.charAt(0) === "{" && value.charAt(value.length - 1) === "}") {
+//     return (
+//       <Link
+//         className="spectrum-Link"
+//         href={`#${value.substring(1, value.length - 1)}`}
+//       >{`${value.substring(1, value.length - 1)}`}</Link>
+//     );
+//   } else {
+//     return value;
+//   }
+// }
+
+// function formatSets(sets) {
+//   if (Object.hasOwn(sets, "desktop") && Object.hasOwn(sets, "mobile")) {
+//     if (
+//       Object.hasOwn(sets.desktop, "value") &&
+//       Object.hasOwn(sets.mobile, "value")
+//     ) {
+//       return (
+//         <td className="spectrum-Table-cell" tabIndex="0">
+//           {`${formatTokenLink(sets.desktop.value)} (desktop)`}
+//           <br />
+//           {`${formatTokenLink(sets.mobile.value)} (mobile)`}
+//         </td>
+//       );
+//     } else {
+//       return (
+//         <td className="spectrum-Table-cell" tabIndex="0">
+//           {JSON.stringify(sets)}
+//         </td>
+//       );
+//     }
+//   } else {
+//     return (
+//       <td className="spectrum-Table-cell" tabIndex="0">
+//         {JSON.stringify(sets)}
+//       </td>
+//     );
+//   }
+// }
+
+// function formatTokenValue(token) {
+//   if (Object.hasOwn(token, "value")) {
+//     return (
+//       <td className="spectrum-Table-cell" tabIndex="0">
+//         {formatTokenLink(token.value)}
+//       </td>
+//     );
+//   } else if (Object.hasOwn(token, "sets")) {
+//     return formatSets(token.sets);
+//   }
+// }
+
+function TokenValue({ token }) {
+  const type = token.$schema.split("/").pop().slice(0, -5);
+  switch (type) {
+    case "alias":
+      const value = token.value.substring(1, token.value.length - 1);
+      return (
+        <Link className="spectrum-Link" href={`#${value}`}>
+          {value}
+        </Link>
+      );
+    case "dimension":
+    case "multiplier":
+    case "font-family":
+    case "font-weight":
+    case "font-style":
+    case "text-transform":
+    case "opacity":
+      return <>{token.value}</>;
+    case "system-set":
+      if (
+        Object.hasOwn(token.sets.spectrum, "sets") &&
+        Object.hasOwn(token.sets, "express")
+      ) {
+        return (
+          <>
+            {Object.keys(token.sets.spectrum.sets).map((key) => (
+              <div>
+                <TokenValue token={token.sets.express.sets[key]}></TokenValue>{" "}
+                (spectrum / {key})
+              </div>
+            ))}
+            {Object.keys(token.sets.express.sets).map((key) => (
+              <div>
+                <TokenValue token={token.sets.express.sets[key]}></TokenValue>{" "}
+                (express / {key})
+              </div>
+            ))}
+          </>
+        );
+      }
+    case "color-set":
+    case "scale-set":
+      return (
+        <>
+          {Object.keys(token.sets).map((key) => (
+            <div>
+              <TokenValue token={token.sets[key]}></TokenValue> ({key})
+            </div>
+          ))}
+        </>
+      );
+    case "color":
+      return <pre>{RGBAToHexA(token.value)}</pre>;
+    default:
+      return <pre>JSON.stringify(token)</pre>;
+  }
+}
+
+function formatToken(token) {
+  return (
+    <tr className="spectrum-Table-row" id={token.name} key={token.name}>
+      <td className="spectrum-Table-cell" tabIndex="0">
+        <strong>{token.name}</strong>
+      </td>
+      <td className="spectrum-Table-cell" tabIndex="0">
+        <TokenValue token={token}></TokenValue>
+      </td>
+    </tr>
+  );
+}
+
+export default function TokenTable({ tokenData }) {
+  return (
+    <Layout>
+      <Head>
+        <title>Tokens</title>
+      </Head>
+      <table className="spectrum-Table spectrum-Table--sizeM spectrum-Table--quiet">
+        <thead className="spectrum-Table-head">
+          <tr>
+            <th
+              className="spectrum-Table-headCell"
+              aria-sort="descending"
+              tabIndex="0"
+            >
+              Token Name
+            </th>
+            <th className="spectrum-Table-headCell" aria-sort="none">
+              Value
+            </th>
+          </tr>
+        </thead>
+        <tbody className="spectrum-Table-body">
+          {tokenData.map(formatToken)}
+        </tbody>
+      </table>
+    </Layout>
+  );
+}
diff --git a/docs/site/styles/global.css b/docs/site/styles/global.css
index 5f0e52eb..f7b737e4 100644
--- a/docs/site/styles/global.css
+++ b/docs/site/styles/global.css
@@ -2,18 +2,8 @@ html,
 body {
   padding: 0 100px;
   margin: 0;
-  font-family:
-    -apple-system,
-    BlinkMacSystemFont,
-    Segoe UI,
-    Roboto,
-    Oxygen,
-    Ubuntu,
-    Cantarell,
-    Fira Sans,
-    Droid Sans,
-    Helvetica Neue,
-    sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
+    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
   line-height: 1.6;
   font-size: 18px;
 }
@@ -50,4 +40,4 @@ th {
 th,
 td {
   padding: 12px 24px;
-}
+}
\ No newline at end of file
diff --git a/docs/site/styles/sidenav.css b/docs/site/styles/sidenav.css
deleted file mode 100644
index c3b7abf9..00000000
--- a/docs/site/styles/sidenav.css
+++ /dev/null
@@ -1,431 +0,0 @@
-/*!
-Copyright 2023 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
-
-.spectrum--medium {
-  --spectrum-global-dimension-size-50: 4px;
-  --spectrum-global-dimension-size-65: 5px;
-  --spectrum-global-dimension-size-75: 6px;
-  --spectrum-global-dimension-size-150: 12px;
-  --spectrum-global-dimension-size-200: 16px;
-  --spectrum-global-dimension-size-400: 32px;
-  --spectrum-global-dimension-font-size-100: 14px;
-}
-.spectrum--large {
-  --spectrum-global-dimension-size-50: 5px;
-  --spectrum-global-dimension-size-65: 6px;
-  --spectrum-global-dimension-size-75: 8px;
-  --spectrum-global-dimension-size-150: 15px;
-  --spectrum-global-dimension-size-200: 20px;
-  --spectrum-global-dimension-size-400: 40px;
-  --spectrum-global-dimension-font-size-100: 17px;
-}
-
-.spectrum {
-  --spectrum-alias-text-color-hover: var(--spectrum-gray-900);
-  --spectrum-alias-highlight-hover: rgba(0, 0, 0, 0.06);
-  --spectrum-alias-background-color-transparent: transparent;
-  --spectrum-alias-text-color-disabled: var(--spectrum-gray--500);
-  --spectrum-alias-text-color: var(--spectrum-gray-800);
-  --spectrum-alias-border-radius-regular: var(
-    --spectrum-global-dimension-size-75
-  );
-  --spectrum-alias-single-line-height: var(
-    --spectrum-global-dimension-size-400
-  );
-  --spectrum-alias-font-size-default: var(
-    --spectrum-global-dimension-font-size-100
-  );
-  --spectrum-global-font-weight-bold: 700;
-  --spectrum-global-font-weight-regular: 400;
-  --spectrum-global-dimension-static-size-25: 2px;
-  --spectrum-global-font-letter-spacing-medium: 0.06em;
-}
-
-.spectrum-SideNav {
-  --spectrum-sidenav-item-padding-y: var(--spectrum-global-dimension-size-65);
-}
-
-.spectrum-SideNav {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-}
-
-.spectrum-SideNav-item {
-  list-style-type: none;
-
-  margin-top: var(
-    --spectrum-sidenav-item-gap,
-    var(--spectrum-global-dimension-size-50)
-  );
-
-  margin-bottom: var(
-    --spectrum-sidenav-item-gap,
-    var(--spectrum-global-dimension-size-50)
-  );
-  margin-left: 0;
-  margin-right: 0;
-}
-
-.spectrum-SideNav-itemLink {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  justify-content: start;
-  box-sizing: border-box;
-
-  width: 100%;
-  min-height: var(
-    --spectrum-sidenav-item-height,
-    var(--spectrum-alias-single-line-height)
-  );
-
-  padding-left: var(
-    --spectrum-sidenav-item-padding-x,
-    var(--spectrum-global-dimension-size-150)
-  );
-
-  padding-right: var(
-    --spectrum-sidenav-item-padding-x,
-    var(--spectrum-global-dimension-size-150)
-  );
-  padding-top: var(--spectrum-sidenav-item-padding-y);
-  padding-bottom: var(--spectrum-sidenav-item-padding-y);
-
-  border-radius: var(
-    --spectrum-sidenav-item-border-radius,
-    var(--spectrum-alias-border-radius-regular)
-  );
-
-  font-size: var(
-    --spectrum-sidenav-item-text-size,
-    var(--spectrum-alias-font-size-default)
-  );
-  font-weight: var(
-    --spectrum-sidenav-item-text-font-weight,
-    var(--spectrum-global-font-weight-regular)
-  );
-  font-style: normal;
-  text-decoration: none;
-
-  word-break: break-word;
-  -webkit-hyphens: auto;
-  hyphens: auto;
-
-  cursor: pointer;
-
-  transition:
-    background-color var(--spectrum-global-animation-duration-100, 130ms)
-      ease-out,
-    color var(--spectrum-global-animation-duration-100, 130ms) ease-out;
-}
-
-.spectrum-SideNav-itemLink:focus {
-  outline: none;
-}
-
-.spectrum-SideNav-itemLink:before {
-  content: "";
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  pointer-events: none;
-
-  border: var(
-      --spectrum-alias-focus-ring-size,
-      var(--spectrum-global-dimension-static-size-25)
-    )
-    solid transparent;
-  border-radius: var(
-    --spectrum-sidenav-item-border-radius,
-    var(--spectrum-alias-border-radius-regular)
-  );
-
-  transition: border var(--spectrum-global-animation-duration-100, 130ms)
-    ease-out;
-}
-
-[dir="ltr"] .spectrum-SideNav-itemLink .spectrum-SideNav-itemIcon {
-  margin-right: var(
-    --spectrum-sidenav-icon-gap,
-    var(--spectrum-global-dimension-size-100)
-  );
-}
-
-[dir="rtl"] .spectrum-SideNav-itemLink .spectrum-SideNav-itemIcon {
-  margin-left: var(
-    --spectrum-sidenav-icon-gap,
-    var(--spectrum-global-dimension-size-100)
-  );
-}
-
-.spectrum-SideNav-itemLink .spectrum-SideNav-itemIcon {
-  flex-shrink: 0;
-}
-
-[dir="ltr"] .spectrum-SideNav-heading {
-  margin-right: 0;
-}
-
-[dir="rtl"] .spectrum-SideNav-heading {
-  margin-left: 0;
-}
-
-[dir="ltr"] .spectrum-SideNav-heading {
-  margin-left: 0;
-}
-
-[dir="rtl"] .spectrum-SideNav-heading {
-  margin-right: 0;
-}
-
-.spectrum-SideNav-heading {
-  height: var(
-    --spectrum-sidenav-heading-height,
-    var(--spectrum-alias-single-line-height)
-  );
-  line-height: var(
-    --spectrum-sidenav-heading-height,
-    var(--spectrum-alias-single-line-height)
-  );
-
-  margin-top: var(
-    --spectrum-sidenav-heading-gap-top,
-    var(--spectrum-global-dimension-size-200)
-  );
-  margin-bottom: var(
-    --spectrum-sidenav-heading-gap-bottom,
-    var(--spectrum-global-dimension-size-50)
-  );
-  padding-top: 0;
-  padding-bottom: 0;
-  padding-left: var(
-    --spectrum-sidenav-heading-padding-x,
-    var(--spectrum-global-dimension-size-150)
-  );
-  padding-right: var(
-    --spectrum-sidenav-heading-padding-x,
-    var(--spectrum-global-dimension-size-150)
-  );
-
-  border-radius: var(
-    --spectrum-sidenav-heading-border-radius,
-    var(--spectrum-alias-border-radius-regular)
-  );
-
-  font-size: var(
-    --spectrum-sidenav-heading-text-size,
-    var(--spectrum-global-dimension-font-size-50)
-  );
-  font-weight: var(
-    --spectrum-sidenav-heading-text-font-weight,
-    var(--spectrum-global-font-weight-medium)
-  );
-  font-style: normal;
-  letter-spacing: var(
-    --spectrum-sidenav-heading-text-letter-spacing,
-    var(--spectrum-global-font-letter-spacing-medium)
-  );
-
-  text-transform: uppercase;
-}
-
-.spectrum-SideNav--multiLevel .spectrum-SideNav-itemLink {
-  font-weight: var(
-    --spectrum-sidenav-multilevel-main-item-font-weight,
-    var(--spectrum-global-font-weight-bold)
-  );
-}
-
-.spectrum-SideNav--multiLevel .spectrum-SideNav {
-  margin: 0;
-  padding: 0;
-}
-
-[dir="ltr"]
-  .spectrum-SideNav--multiLevel
-  .spectrum-SideNav
-  .spectrum-SideNav-itemLink {
-  padding-left: calc(
-    var(
-        --spectrum-sidenav-multilevel-item-margin-left,
-        var(--spectrum-global-dimension-size-150)
-      ) +
-      var(
-        --spectrum-sidenav-item-padding-x,
-        var(--spectrum-global-dimension-size-150)
-      )
-  );
-}
-
-[dir="rtl"]
-  .spectrum-SideNav--multiLevel
-  .spectrum-SideNav
-  .spectrum-SideNav-itemLink {
-  padding-right: calc(
-    var(
-        --spectrum-sidenav-multilevel-item-margin-left,
-        var(--spectrum-global-dimension-size-150)
-      ) +
-      var(
-        --spectrum-sidenav-item-padding-x,
-        var(--spectrum-global-dimension-size-150)
-      )
-  );
-}
-
-.spectrum-SideNav--multiLevel .spectrum-SideNav .spectrum-SideNav-itemLink {
-  font-weight: var(
-    --spectrum-sidenav-item-text-font-weight,
-    var(--spectrum-global-font-weight-regular)
-  );
-}
-
-[dir="ltr"]
-  .spectrum-SideNav--multiLevel
-  .spectrum-SideNav
-  .spectrum-SideNav
-  .spectrum-SideNav-itemLink {
-  padding-left: calc(
-    var(
-        --spectrum-sidenav-multilevel-item-margin-left,
-        var(--spectrum-global-dimension-size-150)
-      ) +
-      var(
-        --spectrum-sidenav-item-padding-x,
-        var(--spectrum-global-dimension-size-150)
-      )
-  );
-}
-
-[dir="rtl"]
-  .spectrum-SideNav--multiLevel
-  .spectrum-SideNav
-  .spectrum-SideNav
-  .spectrum-SideNav-itemLink {
-  padding-right: calc(
-    var(
-        --spectrum-sidenav-multilevel-item-margin-left,
-        var(--spectrum-global-dimension-size-150)
-      ) +
-      var(
-        --spectrum-sidenav-item-padding-x,
-        var(--spectrum-global-dimension-size-150)
-      )
-  );
-}
-
-.spectrum-SideNav-item.is-selected > .spectrum-SideNav-itemLink {
-  color: var(
-    --spectrum-sidenav-item-text-color-selected,
-    var(--spectrum-alias-text-color-hover)
-  );
-  background-color: var(
-    --spectrum-sidenav-item-background-color-selected,
-    var(--spectrum-alias-highlight-hover)
-  );
-}
-
-.spectrum-SideNav-item .is-active > .spectrum-SideNav-itemLink {
-  background-color: var(
-    --spectrum-sidenav-item-background-color-down,
-    var(--spectrum-alias-highlight-hover)
-  );
-}
-
-.spectrum-SideNav-item.is-disabled .spectrum-SideNav-itemLink {
-  background-color: var(
-    --spectrum-sidenav-item-background-color-disabled,
-    var(--spectrum-alias-background-color-transparent)
-  );
-  color: var(
-    --spectrum-sidenav-item-text-color-disabled,
-    var(--spectrum-alias-text-color-disabled)
-  );
-
-  cursor: default;
-  pointer-events: none;
-}
-
-.spectrum-SideNav-itemLink {
-  background-color: var(
-    --spectrum-sidenav-item-background-color,
-    var(--spectrum-alias-background-color-transparent)
-  );
-  color: var(
-    --spectrum-sidenav-item-text-color,
-    var(--spectrum-alias-text-color)
-  );
-}
-
-.spectrum-SideNav-itemLink:hover {
-  background-color: var(
-    --spectrum-sidenav-item-background-color-hover,
-    var(--spectrum-alias-highlight-hover)
-  );
-  color: var(
-    --spectrum-sidenav-item-text-color-hover,
-    var(--spectrum-alias-text-color-hover)
-  );
-}
-
-.spectrum-SideNav-itemLink:active {
-  background-color: var(
-    --spectrum-sidenav-item-background-color-down,
-    var(--spectrum-alias-highlight-hover)
-  );
-}
-
-.spectrum-SideNav-itemLink.focus-ring {
-  background-color: var(
-    --spectrum-sidenav-item-background-color-key-focus,
-    var(--spectrum-alias-highlight-hover)
-  );
-  color: var(
-    --spectrum-sidenav-item-text-color-key-focus,
-    var(--spectrum-alias-text-color-hover)
-  );
-}
-
-.spectrum-SideNav-itemLink.focus-ring::before {
-  border-color: var(
-    --spectrum-sidenav-item-border-color-key-focus,
-    var(--spectrum-alias-border-color-key-focus)
-  );
-}
-
-.spectrum-SideNav-heading {
-  color: var(
-    --spectrum-sidenav-heading-text-color,
-    var(--spectrum-global-color-gray-700)
-  );
-}
-
-@media (forced-colors: active) {
-  .spectrum-SideNav-item {
-    forced-color-adjust: none;
-    --spectrum-sidenav-item-text-color-selected: HighlightText;
-    --spectrum-sidenav-item-background-color-selected: Highlight;
-    --spectrum-sidenav-item-background-color-disabled: ButtonFace;
-    --spectrum-sidenav-item-text-color-disabled: GrayText;
-    --spectrum-sidenav-item-background-color: ButtonFace;
-    --spectrum-sidenav-item-text-color: ButtonText;
-    --spectrum-sidenav-item-background-color-hover: ButtonFace;
-    --spectrum-sidenav-item-text-color-hover: ButtonText;
-    --spectrum-sidenav-item-background-color-down: ButtonFace;
-    --spectrum-sidenav-item-background-color-key-focus: ButtonFace;
-    --spectrum-sidenav-item-text-color-key-focus: ButtonText;
-    --spectrum-sidenav-item-border-color-key-focus: ButtonText;
-  }
-}
diff --git a/package.json b/package.json
index 71625b48..418c1f55 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,7 @@
     "@changesets/cli": "^2.26.2",
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
-    "@moonrepo/cli": "^1.17.3",
+    "@moonrepo/cli": "^1.17.4",
     "ava": "^5.3.1",
     "husky": "^8.0.3",
     "lint-staged": "^14.0.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e1dcfbe8..dd3da923 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,8 +17,8 @@ importers:
         specifier: ^17.7.0
         version: 17.7.0
       "@moonrepo/cli":
-        specifier: ^1.17.3
-        version: 1.17.3
+        specifier: ^1.17.4
+        version: 1.17.4
       ava:
         specifier: ^5.3.1
         version: 5.3.1
@@ -34,18 +34,24 @@ importers:
 
   docs/site:
     dependencies:
+      "@spectrum-css/link":
+        specifier: ^4.0.74
+        version: 4.0.74(@spectrum-css/tokens@13.0.5)
       "@spectrum-css/page":
-        specifier: ^5.0.31
-        version: 5.0.31
+        specifier: ^6.0.9
+        version: 6.0.9
+      "@spectrum-css/sidenav":
+        specifier: ^4.0.18
+        version: 4.0.18(@spectrum-css/tokens@13.0.5)
       "@spectrum-css/table":
-        specifier: ^4.0.60
-        version: 4.0.60(@spectrum-css/icon@3.0.49)(@spectrum-css/vars@9.0.8)
+        specifier: ^5.0.10
+        version: 5.0.10(@spectrum-css/icon@4.0.5)(@spectrum-css/tokens@13.0.5)
       "@spectrum-css/tokens":
-        specifier: ^11.0.0
-        version: 11.0.0
+        specifier: ^13.0.5
+        version: 13.0.5
       "@spectrum-css/typography":
-        specifier: ^5.0.27
-        version: 5.0.27(@spectrum-css/tokens@11.0.0)
+        specifier: ^5.0.49
+        version: 5.0.49(@spectrum-css/tokens@13.0.5)
       ajv:
         specifier: ^8.12.0
         version: 8.12.0
@@ -53,8 +59,8 @@ importers:
         specifier: ^2.1.1
         version: 2.1.1(ajv@8.12.0)
       next:
-        specifier: ^13.4.10
-        version: 13.4.10(react-dom@18.2.0)(react@18.2.0)
+        specifier: ^14.0.3
+        version: 14.0.3(react-dom@18.2.0)(react@18.2.0)
       react:
         specifier: ^18.2.0
         version: 18.2.0
@@ -62,8 +68,8 @@ importers:
         specifier: ^18.2.0
         version: 18.2.0(react@18.2.0)
       rimraf:
-        specifier: ^5.0.1
-        version: 5.0.1
+        specifier: ^5.0.5
+        version: 5.0.5
 
   docs/visualizer:
     dependencies:
@@ -139,7 +145,7 @@ importers:
         version: 1.1.9
       glob:
         specifier: ^10.3.3
-        version: 10.3.3
+        version: 10.3.10
       style-dictionary:
         specifier: ^3.8.0
         version: 3.8.0
@@ -954,7 +960,7 @@ packages:
         integrity: sha512-hK30sfBlmB1aIe3/OwAPg9Ey0DjjXvHEiGVhNaOiBJl31G0B6wMaX8BN3ibzdlpyRNE9p7X+3EBONmxtJO9Yfg==,
       }
     dependencies:
-      "@swc/helpers": 0.5.1
+      "@swc/helpers": 0.5.2
     dev: false
 
   /@isaacs/cliui@8.0.2:
@@ -1056,29 +1062,29 @@ packages:
       read-yaml-file: 1.1.0
     dev: true
 
-  /@moonrepo/cli@1.17.3:
+  /@moonrepo/cli@1.17.4:
     resolution:
       {
-        integrity: sha512-PuW/R9PeA71OsSZGhadhqTsn3E4tmbTDM3Q7t1GUTeQEjwdDt5WlM/deJ7dxX7D+ItgdMvaUiLhEMMbL8MkOLw==,
+        integrity: sha512-v2EmtCTyELxYNGySrV6LkNeb503Hb5UGLm62CX9zb6JGMt/pRHG+zipG6saeBw2AG1pbnSpQcb3vw++xYRZEVA==,
       }
     hasBin: true
     requiresBuild: true
     dependencies:
       detect-libc: 2.0.2
     optionalDependencies:
-      "@moonrepo/core-linux-arm64-gnu": 1.17.3
-      "@moonrepo/core-linux-arm64-musl": 1.17.3
-      "@moonrepo/core-linux-x64-gnu": 1.17.3
-      "@moonrepo/core-linux-x64-musl": 1.17.3
-      "@moonrepo/core-macos-arm64": 1.17.3
-      "@moonrepo/core-macos-x64": 1.17.3
-      "@moonrepo/core-windows-x64-msvc": 1.17.3
+      "@moonrepo/core-linux-arm64-gnu": 1.17.4
+      "@moonrepo/core-linux-arm64-musl": 1.17.4
+      "@moonrepo/core-linux-x64-gnu": 1.17.4
+      "@moonrepo/core-linux-x64-musl": 1.17.4
+      "@moonrepo/core-macos-arm64": 1.17.4
+      "@moonrepo/core-macos-x64": 1.17.4
+      "@moonrepo/core-windows-x64-msvc": 1.17.4
     dev: true
 
-  /@moonrepo/core-linux-arm64-gnu@1.17.3:
+  /@moonrepo/core-linux-arm64-gnu@1.17.4:
     resolution:
       {
-        integrity: sha512-8BlwjyGAmJum9d7EGuGsw9/64j+bgzDGADeH+YsldJ277gqmPLz8F6LRPLUr0Ddc0xcd7sbw0fJzAI4u55YfGA==,
+        integrity: sha512-YGeNc1YCxlUXyyUfZpxEB5olC3dKr3LqQkkS0SxHzQjkpNv8Dk5Mg+G+PQLm36K30uB0ejufmrM4bW81E9JtbA==,
       }
     cpu: [arm64]
     os: [linux]
@@ -1086,10 +1092,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-linux-arm64-musl@1.17.3:
+  /@moonrepo/core-linux-arm64-musl@1.17.4:
     resolution:
       {
-        integrity: sha512-Kr9SqWBrTla3CxAsc/hIwLyJqs72S9WgVgMj/ZDd6c5r3Onipot/l8Esdw26xy6fIlyu387p9JNh1jWfC9OmXA==,
+        integrity: sha512-l/4pPvzqK21o0SXhbobst2QtGVSMb/Jc5BPmL79FfasOkDi5EYDgz84545FwHAJpRFTHb4/UaPlQxHRbmzNmug==,
       }
     cpu: [arm64]
     os: [linux]
@@ -1097,10 +1103,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-linux-x64-gnu@1.17.3:
+  /@moonrepo/core-linux-x64-gnu@1.17.4:
     resolution:
       {
-        integrity: sha512-YYIKooOSJeZtFJj5BcgW9tWL3IUe4WgoCHPIRbfoUGhuFw+AacUCz9XDa8/6NJpEIF7drblTDX25ztRIAIIXMw==,
+        integrity: sha512-dE+Qs/bhKAt1G38yS+16glU29paoLsUA+MaYFMVh8BZrxymE6VfUZpmz7/qPA8JAC+dG+zG/LOtPGHDSf/j0xQ==,
       }
     cpu: [x64]
     os: [linux]
@@ -1108,10 +1114,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-linux-x64-musl@1.17.3:
+  /@moonrepo/core-linux-x64-musl@1.17.4:
     resolution:
       {
-        integrity: sha512-Txw74QJOZFug/n8Z1ZmsjGt4T2d0F0wwT7zeT+0rXIuzwMX3lZG7l+zbNn/FdgmVqhCtPj20U36gM6WM4J/bhw==,
+        integrity: sha512-ntgXnGE4mcL3eQYCcV83NLnEqDGKIQNOQbPRmBn2qGAMyuXc7YYIQLek2wh99nfG68NERD2tBck2bHx9N6+tzQ==,
       }
     cpu: [x64]
     os: [linux]
@@ -1119,10 +1125,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-macos-arm64@1.17.3:
+  /@moonrepo/core-macos-arm64@1.17.4:
     resolution:
       {
-        integrity: sha512-nYBd8II6UpteaGAlHMLn5UfBOVOQXINUCLl/mRnD34BXFIjxS7sAShmZfUDQSlC6QQx4zf1mIZSW2BQ+3k7R2A==,
+        integrity: sha512-BObXguL5j0JYY71WlXC3j35oQktKq7mO3ZeioBZ6N8lhBnQzLi34Slowoybk2SiE0/0jDPXMWyrH0VN+1WVmdw==,
       }
     cpu: [arm64]
     os: [darwin]
@@ -1130,10 +1136,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-macos-x64@1.17.3:
+  /@moonrepo/core-macos-x64@1.17.4:
     resolution:
       {
-        integrity: sha512-NG3atjVM1aJfEPSJUZGdpWZ+WNh5b5Iw8hJNOPUjs33tfz8QoN0UxFWohSFDwXgGxurjzyur/lc0xUBKd2n5WQ==,
+        integrity: sha512-0XIAqKjMUHzDr8YM41/P5pQAiuZQBk9XX5Scf/0cphzHfqoYs/2C3JfvkIelGsCGGR1x4/oUS6I+RP9CT8VxLA==,
       }
     cpu: [x64]
     os: [darwin]
@@ -1141,10 +1147,10 @@ packages:
     dev: true
     optional: true
 
-  /@moonrepo/core-windows-x64-msvc@1.17.3:
+  /@moonrepo/core-windows-x64-msvc@1.17.4:
     resolution:
       {
-        integrity: sha512-Wz8Lp661RNpgMCYyqATyJxkgaPLw/oMJ+Jip7c55aLOrE8o+HsNU4QqsOgkxY+6PD+7Dp9634KSrziaTPHHiVA==,
+        integrity: sha512-0UrMJU2C4Kygo6f+KhDrdbsAnMkg8viueEKCUDB36096mBLYYszVUQc00EemLRpWXp1TVcI6ucxZTBXY1xBFEA==,
       }
     cpu: [x64]
     os: [win32]
@@ -1152,17 +1158,17 @@ packages:
     dev: true
     optional: true
 
-  /@next/env@13.4.10:
+  /@next/env@14.0.3:
     resolution:
       {
-        integrity: sha512-3G1yD/XKTSLdihyDSa8JEsaWOELY+OWe08o0LUYzfuHp1zHDA8SObQlzKt+v+wrkkPcnPweoLH1ImZeUa0A1NQ==,
+        integrity: sha512-7xRqh9nMvP5xrW4/+L0jgRRX+HoNRGnfJpD+5Wq6/13j3dsdzxO3BCXn7D3hMqsDb+vjZnJq+vI7+EtgrYZTeA==,
       }
     dev: false
 
-  /@next/swc-darwin-arm64@13.4.10:
+  /@next/swc-darwin-arm64@14.0.3:
     resolution:
       {
-        integrity: sha512-4bsdfKmmg7mgFGph0UorD1xWfZ5jZEw4kKRHYEeTK9bT1QnMbPVPlVXQRIiFPrhoDQnZUoa6duuPUJIEGLV1Jg==,
+        integrity: sha512-64JbSvi3nbbcEtyitNn2LEDS/hcleAFpHdykpcnrstITFlzFgB/bW0ER5/SJJwUPj+ZPY+z3e+1jAfcczRLVGw==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
@@ -1171,10 +1177,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-darwin-x64@13.4.10:
+  /@next/swc-darwin-x64@14.0.3:
     resolution:
       {
-        integrity: sha512-ngXhUBbcZIWZWqNbQSNxQrB9T1V+wgfCzAor2olYuo/YpaL6mUYNUEgeBMhr8qwV0ARSgKaOp35lRvB7EmCRBg==,
+        integrity: sha512-RkTf+KbAD0SgYdVn1XzqE/+sIxYGB7NLMZRn9I4Z24afrhUpVJx6L8hsRnIwxz3ERE2NFURNliPjJ2QNfnWicQ==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
@@ -1183,10 +1189,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-arm64-gnu@13.4.10:
+  /@next/swc-linux-arm64-gnu@14.0.3:
     resolution:
       {
-        integrity: sha512-SjCZZCOmHD4uyM75MVArSAmF5Y+IJSGroPRj2v9/jnBT36SYFTORN8Ag/lhw81W9EeexKY/CUg2e9mdebZOwsg==,
+        integrity: sha512-3tBWGgz7M9RKLO6sPWC6c4pAw4geujSwQ7q7Si4d6bo0l6cLs4tmO+lnSwFp1Tm3lxwfMk0SgkJT7EdwYSJvcg==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
@@ -1195,10 +1201,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-arm64-musl@13.4.10:
+  /@next/swc-linux-arm64-musl@14.0.3:
     resolution:
       {
-        integrity: sha512-F+VlcWijX5qteoYIOxNiBbNE8ruaWuRlcYyIRK10CugqI/BIeCDzEDyrHIHY8AWwbkTwe6GRHabMdE688Rqq4Q==,
+        integrity: sha512-v0v8Kb8j8T23jvVUWZeA2D8+izWspeyeDGNaT2/mTHWp7+37fiNfL8bmBWiOmeumXkacM/AB0XOUQvEbncSnHA==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
@@ -1207,10 +1213,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-x64-gnu@13.4.10:
+  /@next/swc-linux-x64-gnu@14.0.3:
     resolution:
       {
-        integrity: sha512-WDv1YtAV07nhfy3i1visr5p/tjiH6CeXp4wX78lzP1jI07t4PnHHG1WEDFOduXh3WT4hG6yN82EQBQHDi7hBrQ==,
+        integrity: sha512-VM1aE1tJKLBwMGtyBR21yy+STfl0MapMQnNrXkxeyLs0GFv/kZqXS5Jw/TQ3TSUnbv0QPDf/X8sDXuMtSgG6eg==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
@@ -1219,10 +1225,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-linux-x64-musl@13.4.10:
+  /@next/swc-linux-x64-musl@14.0.3:
     resolution:
       {
-        integrity: sha512-zFkzqc737xr6qoBgDa3AwC7jPQzGLjDlkNmt/ljvQJ/Veri5ECdHjZCUuiTUfVjshNIIpki6FuP0RaQYK9iCRg==,
+        integrity: sha512-64EnmKy18MYFL5CzLaSuUn561hbO1Gk16jM/KHznYP3iCIfF9e3yULtHaMy0D8zbHfxset9LTOv6cuYKJgcOxg==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
@@ -1231,10 +1237,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-arm64-msvc@13.4.10:
+  /@next/swc-win32-arm64-msvc@14.0.3:
     resolution:
       {
-        integrity: sha512-IboRS8IWz5mWfnjAdCekkl8s0B7ijpWeDwK2O8CdgZkoCDY0ZQHBSGiJ2KViAG6+BJVfLvcP+a2fh6cdyBr9QQ==,
+        integrity: sha512-WRDp8QrmsL1bbGtsh5GqQ/KWulmrnMBgbnb+59qNTW1kVi1nG/2ndZLkcbs2GX7NpFLlToLRMWSQXmPzQm4tog==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
@@ -1243,10 +1249,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-ia32-msvc@13.4.10:
+  /@next/swc-win32-ia32-msvc@14.0.3:
     resolution:
       {
-        integrity: sha512-bSA+4j8jY4EEiwD/M2bol4uVEu1lBlgsGdvM+mmBm/BbqofNBfaZ2qwSbwE2OwbAmzNdVJRFRXQZ0dkjopTRaQ==,
+        integrity: sha512-EKffQeqCrj+t6qFFhIFTRoqb2QwX1mU7iTOvMyLbYw3QtqTw9sMwjykyiMlZlrfm2a4fA84+/aeW+PMg1MjuTg==,
       }
     engines: { node: ">= 10" }
     cpu: [ia32]
@@ -1255,10 +1261,10 @@ packages:
     dev: false
     optional: true
 
-  /@next/swc-win32-x64-msvc@13.4.10:
+  /@next/swc-win32-x64-msvc@14.0.3:
     resolution:
       {
-        integrity: sha512-g2+tU63yTWmcVQKDGY0MV1PjjqgZtwM4rB1oVVi/v0brdZAcrcTV+04agKzWtvWroyFz6IqtT0MoZJA7PNyLVw==,
+        integrity: sha512-ERhKPSJ1vQrPiwrs15Pjz/rvDHZmkmvbf/BjPN/UCOI++ODftT0GtasDPi0j+y6PPJi5HsXw+dpRaXUaw4vjuQ==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
@@ -1438,10 +1444,10 @@ packages:
     dev: true
     optional: true
 
-  /@spectrum-css/icon@3.0.49(@spectrum-css/vars@9.0.8):
+  /@spectrum-css/icon@4.0.5(@spectrum-css/vars@9.0.8):
     resolution:
       {
-        integrity: sha512-CQAPZqn2l4/osbeSIUlB9DstA8dTipvitWeyXwLjEPO68CKkVgAu9Iq10HlxEKdAO3sdG6aET3S9BURdWvZO+w==,
+        integrity: sha512-8kx+fZVRV0f1AUzla1ZGbRqxf3kXNXCDiJR3+LzeV4Gu1eK9/6gSRplM6DWbbCnsChES/+s7eT6NoPRLxSWUGQ==,
       }
     peerDependencies:
       "@spectrum-css/vars": ">=9"
@@ -1449,44 +1455,66 @@ packages:
       "@spectrum-css/vars": 9.0.8
     dev: false
 
-  /@spectrum-css/page@5.0.31:
+  /@spectrum-css/link@4.0.74(@spectrum-css/tokens@13.0.5):
     resolution:
       {
-        integrity: sha512-F61w7EmFZ5VVTk6AuvfFGNbviqM+I0GkvOPgZXfWP+gL5beWzbd+ecsMKoFpeDwlH3ai87r4jg1fuI4LhvJFJA==,
+        integrity: sha512-u77Z32HYnUgsHvEKQ+Kxlkbg3exUlilkgq7WyPkmK3IrrZ6Sq5fBSyZaFGarMr6QZ7lPtHc5sdz3FD9EVLltSw==,
       }
+    peerDependencies:
+      "@spectrum-css/tokens": ">=13"
     dependencies:
-      "@spectrum-css/vars": 9.0.8
+      "@spectrum-css/tokens": 13.0.5
+    dev: false
+
+  /@spectrum-css/page@6.0.9:
+    resolution:
+      {
+        integrity: sha512-e+pNeyWcmScSTMcC94JGy2TfsyRa+lsIzxu4Gw+PADL4NfLjtrpemqIT1kuKgAcv4Z2NRm1JgBDembxvWdWxcw==,
+      }
+    dependencies:
+      "@spectrum-css/tokens": 13.0.5
     dev: false
 
-  /@spectrum-css/table@4.0.60(@spectrum-css/icon@3.0.49)(@spectrum-css/vars@9.0.8):
+  /@spectrum-css/sidenav@4.0.18(@spectrum-css/tokens@13.0.5):
     resolution:
       {
-        integrity: sha512-eaBFdF/MJfRJtLkjlojAaFzI2dLnK0Xuk3lyXxVHIENzFsarlMVztHiDE2K/MThhsPsASJ7dc9ufOgtgjqxEHQ==,
+        integrity: sha512-fpRIy+eYOpxYIVSNNyADpc7embWAZKGKk3evmZEPkcNmRsiReSEJVUF/GnIRq0/59RRwrAa1F6G+JgN4EnG7Cw==,
       }
     peerDependencies:
-      "@spectrum-css/icon": ">=3"
-      "@spectrum-css/vars": ">=9"
+      "@spectrum-css/tokens": ">=13"
     dependencies:
-      "@spectrum-css/icon": 3.0.49(@spectrum-css/vars@9.0.8)
-      "@spectrum-css/vars": 9.0.8
+      "@spectrum-css/tokens": 13.0.5
+    dev: false
+
+  /@spectrum-css/table@5.0.10(@spectrum-css/icon@4.0.5)(@spectrum-css/tokens@13.0.5):
+    resolution:
+      {
+        integrity: sha512-Uy3Ta5sXeq7a8Dz05nTkOe+Vd8tjH/1mZgf5K3zgDEOBIzaKXBpxYLJx+5kv4ZMi3xsZBn8zBgwVqxm9CSQQ4w==,
+      }
+    peerDependencies:
+      "@spectrum-css/icon": ">=4"
+      "@spectrum-css/tokens": ">=13"
+    dependencies:
+      "@spectrum-css/icon": 4.0.5(@spectrum-css/vars@9.0.8)
+      "@spectrum-css/tokens": 13.0.5
     dev: false
 
-  /@spectrum-css/tokens@11.0.0:
+  /@spectrum-css/tokens@13.0.5:
     resolution:
       {
-        integrity: sha512-C1PtYG3TRngneVbFxcd3Ksj8ZnnKuh1HZCSm+tHf1blx/8O44OQfHk2b36sOQMMDvysVXpaKU2LxttsEjrgSpw==,
+        integrity: sha512-iy8EF4mtmF6ctTLIuOgd/7VWRCSuqIV+0RYAVfKzRvOkl8vJPaK2dUvOVeWE3sIaGS6yJi3TWFQHuODahM//AA==,
       }
     dev: false
 
-  /@spectrum-css/typography@5.0.27(@spectrum-css/tokens@11.0.0):
+  /@spectrum-css/typography@5.0.49(@spectrum-css/tokens@13.0.5):
     resolution:
       {
-        integrity: sha512-olI3i90+TICneBPpa5bjvEuhzZCfbzZePFpJX4OIjJ9lVfW+B4PjFTnTzyYAWiWYwJrmTh1E51cvOeZb+S+5/g==,
+        integrity: sha512-0iM/1DUTLsgFjMFnkAW6uSzoytAa3rEz+Pess2/a73uZy2pfnP398GUl2i+q/33gK2Vrx7NLn73IIDO1aYSZDg==,
       }
     peerDependencies:
-      "@spectrum-css/tokens": ">=9"
+      "@spectrum-css/tokens": ">=13"
     dependencies:
-      "@spectrum-css/tokens": 11.0.0
+      "@spectrum-css/tokens": 13.0.5
     dev: false
 
   /@spectrum-css/vars@9.0.8:
@@ -1822,10 +1850,10 @@ packages:
       "@spectrum-web-components/shared": 0.40.0
     dev: false
 
-  /@swc/helpers@0.5.1:
+  /@swc/helpers@0.5.2:
     resolution:
       {
-        integrity: sha512-sJ902EfIzn1Fa+qYmjdQqh8tPsoxyBz+8yBKC2HKUxyezKJFwPGOn7pv4WY6QuQW//ySQi5lJjA/ZT9sNWWNTg==,
+        integrity: sha512-E4KcWTpoLHqwPHLxidpOqQbcrZVgi0rsmmZXUle1jXmJfuIf/UWpczUJ7MZZ5tlxytgJXyp0w4PGkkeLiuIdZw==,
       }
     dependencies:
       tslib: 2.6.0
@@ -3526,16 +3554,16 @@ packages:
       }
     dev: false
 
-  /glob@10.3.3:
+  /glob@10.3.10:
     resolution:
       {
-        integrity: sha512-92vPiMb/iqpmEgsOoIDvTjc50wf9CCCvMzsi6W0JLPeUKE8TWP1a73PgqSrqy7iAZxaSD1YdzU7QZR5LF51MJw==,
+        integrity: sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==,
       }
     engines: { node: ">=16 || 14 >=14.17" }
     hasBin: true
     dependencies:
       foreground-child: 3.1.1
-      jackspeak: 2.2.1
+      jackspeak: 2.3.6
       minimatch: 9.0.3
       minipass: 7.0.2
       path-scurry: 1.10.1
@@ -4168,10 +4196,10 @@ packages:
         integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==,
       }
 
-  /jackspeak@2.2.1:
+  /jackspeak@2.3.6:
     resolution:
       {
-        integrity: sha512-MXbxovZ/Pm42f6cDIDkl3xpwv1AGwObKwfmjs2nQePiy85tP3fatofl3FC1aBsOtP/6fq5SbtgHwWcMsLP+bDw==,
+        integrity: sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==,
       }
     engines: { node: ">=14" }
     dependencies:
@@ -4861,47 +4889,43 @@ packages:
     engines: { node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1 }
     hasBin: true
 
-  /next@13.4.10(react-dom@18.2.0)(react@18.2.0):
+  /next@14.0.3(react-dom@18.2.0)(react@18.2.0):
     resolution:
       {
-        integrity: sha512-4ep6aKxVTQ7rkUW2fBLhpBr/5oceCuf4KmlUpvG/aXuDTIf9mexNSpabUD6RWPspu6wiJJvozZREhXhueYO36A==,
+        integrity: sha512-AbYdRNfImBr3XGtvnwOxq8ekVCwbFTv/UJoLwmaX89nk9i051AEY4/HAWzU0YpaTDw8IofUpmuIlvzWF13jxIw==,
       }
-    engines: { node: ">=16.8.0" }
+    engines: { node: ">=18.17.0" }
     hasBin: true
     peerDependencies:
       "@opentelemetry/api": ^1.1.0
-      fibers: ">= 3.1.0"
       react: ^18.2.0
       react-dom: ^18.2.0
       sass: ^1.3.0
     peerDependenciesMeta:
       "@opentelemetry/api":
         optional: true
-      fibers:
-        optional: true
       sass:
         optional: true
     dependencies:
-      "@next/env": 13.4.10
-      "@swc/helpers": 0.5.1
+      "@next/env": 14.0.3
+      "@swc/helpers": 0.5.2
       busboy: 1.6.0
       caniuse-lite: 1.0.30001515
-      postcss: 8.4.14
+      postcss: 8.4.31
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
       styled-jsx: 5.1.1(react@18.2.0)
       watchpack: 2.4.0
-      zod: 3.21.4
     optionalDependencies:
-      "@next/swc-darwin-arm64": 13.4.10
-      "@next/swc-darwin-x64": 13.4.10
-      "@next/swc-linux-arm64-gnu": 13.4.10
-      "@next/swc-linux-arm64-musl": 13.4.10
-      "@next/swc-linux-x64-gnu": 13.4.10
-      "@next/swc-linux-x64-musl": 13.4.10
-      "@next/swc-win32-arm64-msvc": 13.4.10
-      "@next/swc-win32-ia32-msvc": 13.4.10
-      "@next/swc-win32-x64-msvc": 13.4.10
+      "@next/swc-darwin-arm64": 14.0.3
+      "@next/swc-darwin-x64": 14.0.3
+      "@next/swc-linux-arm64-gnu": 14.0.3
+      "@next/swc-linux-arm64-musl": 14.0.3
+      "@next/swc-linux-x64-gnu": 14.0.3
+      "@next/swc-linux-x64-musl": 14.0.3
+      "@next/swc-win32-arm64-msvc": 14.0.3
+      "@next/swc-win32-ia32-msvc": 14.0.3
+      "@next/swc-win32-x64-msvc": 14.0.3
     transitivePeerDependencies:
       - "@babel/core"
       - babel-plugin-macros
@@ -5359,10 +5383,10 @@ packages:
       irregular-plurals: 3.5.0
     dev: true
 
-  /postcss@8.4.14:
+  /postcss@8.4.31:
     resolution:
       {
-        integrity: sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==,
+        integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==,
       }
     engines: { node: ^10 || ^12 || >=14 }
     dependencies:
@@ -5672,15 +5696,15 @@ packages:
       glob: 7.2.3
     dev: true
 
-  /rimraf@5.0.1:
+  /rimraf@5.0.5:
     resolution:
       {
-        integrity: sha512-OfFZdwtd3lZ+XZzYP/6gTACubwFcHdLRqS9UX3UwpU2dnGQYkPFISRwvM3w9IiB2w7bW5qGo/uAwE4SmXXSKvg==,
+        integrity: sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==,
       }
     engines: { node: ">=14" }
     hasBin: true
     dependencies:
-      glob: 10.3.3
+      glob: 10.3.10
     dev: false
 
   /rollup@4.6.1:
@@ -6857,10 +6881,3 @@ packages:
       }
     engines: { node: ">=12.20" }
     dev: true
-
-  /zod@3.21.4:
-    resolution:
-      {
-        integrity: sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==,
-      }
-    dev: false